@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{--bg:#08141b;--side:#0c1b22;--panel:#10242b;--panel2:#132c33;--line:#254047;--muted:#8fa5aa;--text:#edf5f3;--lime:#b7f16d;--teal:#5bd3b0;--gold:#e9c477;--red:#ff8d80}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:'DM Sans','Noto Sans JP',sans-serif}button,input,select{font:inherit}button{cursor:pointer}.app{display:flex;min-height:100vh}.sidebar{width:252px;flex:none;background:var(--side);border-right:1px solid #1b363d;padding:28px 17px;display:flex;flex-direction:column;position:sticky;top:0;height:100vh}.brand{display:flex;align-items:center;gap:12px;padding:0 8px}.crest{height:48px;width:45px;background:linear-gradient(145deg,#c3f57d,#62caa5);color:#0b2526;clip-path:polygon(50% 0,95% 15%,95% 73%,50% 100%,5% 73%,5% 15%);display:flex;flex-direction:column;align-items:center;justify-content:center;font:800 17px 'Space Grotesk';line-height:1}.crest span{font-size:9px;letter-spacing:2px}.brand b{font-family:'Space Grotesk';font-size:18px;letter-spacing:2px}.brand small{display:block;font-size:8px;letter-spacing:1.6px;color:var(--muted);margin-top:3px}.edition{font-size:9px;letter-spacing:1.5px;color:var(--lime);padding:32px 10px 28px;display:flex;justify-content:space-between}.edition span{color:var(--muted)}.nav-label{font-size:10px;letter-spacing:1.7px;color:#627f85;padding:0 13px 13px}nav{display:grid;gap:5px}.navbtn{border:0;background:transparent;color:#9cb2b7;text-align:left;border-radius:9px;padding:13px 13px;display:flex;align-items:center;gap:13px;font-size:13px;font-weight:600}.navbtn:hover{background:#173037;color:white}.navbtn.active{background:#203c39;color:var(--lime);box-shadow:inset 3px 0 var(--lime)}.navicon{font-size:17px;width:23px;text-align:center}.sidebar-bottom{margin-top:auto;border-top:1px solid var(--line);padding:22px 9px 0}.statusdot{font-size:10px;letter-spacing:1.1px;color:#c9e5d3;font-weight:800}.statusdot i,.livepill i{display:inline-block;background:var(--lime);width:7px;height:7px;border-radius:50%;margin-right:8px;box-shadow:0 0 10px #b7f16d66}.sidebar-bottom small{display:block;color:#708a8e;margin-top:9px;font-size:10px}.main{flex:1;min-width:0}.topbar{height:80px;border-bottom:1px solid #1e363d;display:flex;align-items:center;justify-content:space-between;padding:0 42px}.crumb{font-size:11px;letter-spacing:1.5px;color:#7f9ba1;font-weight:800}.crumb span{margin:0 12px;color:#48646b}.crumb strong{color:#e1f0e8}.topright{display:flex;align-items:center;gap:24px}.livepill{border:1px solid #345348;border-radius:30px;color:#c5e6b1;padding:9px 12px;font-size:10px;font-weight:800;letter-spacing:1px}.date{font-size:9px;color:#759298;letter-spacing:1px}.date b{display:block;color:#e3f0ec;font-size:11px;margin-top:4px}.iconbtn{background:#152b32;color:#d2e9e3;border:1px solid #2b464b;border-radius:8px;padding:8px 12px;font-size:18px}.content{padding:36px 42px 50px;max-width:1650px;margin:auto;min-height:calc(100vh - 120px)}footer{border-top:1px solid #1c333a;padding:18px 42px;color:#607d82;font-size:9px;letter-spacing:1.3px;display:flex;justify-content:space-between;gap:20px}.eyebrow{font-size:10px;letter-spacing:2.8px;font-weight:800;color:var(--lime);margin-bottom:10px}.pagehead{display:flex;justify-content:space-between;align-items:end;gap:18px;margin-bottom:28px}.pagehead h1{font:700 clamp(30px,3.2vw,49px)/1.1 'Space Grotesk',sans-serif;margin:0;letter-spacing:-1.8px}.sub{color:var(--muted);font-size:13px;margin-top:12px}.outlinebtn,.primarybtn{border:1px solid #3e6058;border-radius:9px;padding:11px 16px;background:transparent;color:#d4ece2;font-size:12px;font-weight:800}.primarybtn{background:var(--lime);color:#14241e;border:0}.outlinebtn:hover{background:#254139}.hero{min-height:252px;border:1px solid #3d5b4b;border-radius:16px;background:radial-gradient(ellipse at 80% 0%,#305f48 0%,transparent 48%),linear-gradient(110deg,#1c403a,#10252c 67%);position:relative;overflow:hidden;padding:35px 38px;margin-bottom:20px}.hero:after{content:'AU';position:absolute;right:5%;top:-70px;font:800 330px 'Space Grotesk';letter-spacing:-40px;color:#b7f16d0c;pointer-events:none}.hero h2{font:700 38px 'Space Grotesk';margin:11px 0 12px;letter-spacing:-1.3px;max-width:650px}.hero p{max-width:600px;color:#b4d0c8;line-height:1.7;font-size:13px}.hero .tag{font-size:10px;font-weight:800;letter-spacing:2px;color:var(--lime)}.hero .herofoot{display:flex;gap:22px;align-items:center;margin-top:25px;color:#b6d1c6;font-size:11px}.herofoot b{color:white}.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:18px 0 24px}.stat{border:1px solid var(--line);background:var(--panel);padding:22px 23px;border-radius:13px;min-height:130px}.stat .label{font-size:10px;color:#8da6aa;letter-spacing:1.2px;font-weight:800}.stat .value{font:700 32px 'Space Grotesk';margin:14px 0 5px;letter-spacing:-1px}.stat .hint{font-size:10px;color:#80bda8}.stat .hint.warn{color:var(--gold)}.twocol{display:grid;grid-template-columns:1.45fr 1fr;gap:18px}.panel{background:var(--panel);border:1px solid var(--line);border-radius:13px;overflow:hidden}.panelhead{padding:22px 23px;border-bottom:1px solid #254047;display:flex;align-items:center;justify-content:space-between;gap:12px}.panelhead h3{margin:0;font:700 16px 'Space Grotesk'}.panelhead small{color:var(--muted);font-size:10px}.panelbody{padding:22px 23px}.sectiontitle{font:700 18px 'Space Grotesk';margin:28px 0 16px}.rowline{display:flex;justify-content:space-between;align-items:center;padding:14px 0;border-bottom:1px solid #254047;gap:12px}.rowline:last-child{border:0}.rowline strong{font-size:13px}.rowline small{display:block;color:var(--muted);margin-top:5px;font-size:11px}.num{font:700 18px 'Space Grotesk'}.pill{font-size:10px;font-weight:800;letter-spacing:.4px;border-radius:6px;padding:6px 8px;background:#28443e;color:#bff0cd;white-space:nowrap}.pill.gold{background:#463d2a;color:#f2d48b}.pill.blue{background:#243d4b;color:#a8d6f2}.pill.red{background:#4b3131;color:#ffb4a9}.empty{padding:35px;color:#9bb0b2;text-align:center;font-size:13px;line-height:1.8}.tablewrap{overflow:auto}.datatable{border-collapse:collapse;width:100%;min-width:720px;text-align:left}.datatable th{font-size:10px;letter-spacing:1.2px;color:#85a2a6;background:#152e34;padding:15px 18px;white-space:nowrap}.datatable td{padding:16px 18px;border-bottom:1px solid #254047;font-size:12px;color:#d9e9e4}.datatable tr:last-child td{border-bottom:0}.datatable tbody tr:hover{background:#19333a}.clickrow{cursor:pointer}.namecell{display:flex;align-items:center;gap:12px}.avatar{background:linear-gradient(135deg,#32534a,#18313a);width:34px;height:34px;border:1px solid #44675d;border-radius:9px;display:grid;place-items:center;color:#d7f5c0;font-weight:800;font-size:11px}.rating{font:800 17px 'Space Grotesk';color:var(--lime)}.muted{color:var(--muted)!important}.search{border:1px solid #355057;border-radius:9px;background:#10252b;color:white;padding:12px 14px;min-width:240px;outline:0}.search:focus{border-color:var(--lime)}.toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px;flex-wrap:wrap}.filters{display:flex;gap:8px;flex-wrap:wrap}.filterbtn{background:#142c32;border:1px solid #2b484d;color:#9fb7ba;padding:10px 13px;border-radius:8px;font-size:11px;font-weight:800}.filterbtn.active{background:#b7f16d;color:#10261d;border-color:#b7f16d}.gridcards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.personcard{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:21px;cursor:pointer}.personcard:hover{border-color:#6caa83}.personcard h3{margin:14px 0 4px;font:700 17px 'Space Grotesk'}.personcard p{font-size:11px;color:var(--muted);margin:0}.cardtop{display:flex;justify-content:space-between;align-items:center}.bigovr{font:700 30px 'Space Grotesk';color:var(--lime)}.progress{height:6px;background:#29454b;border-radius:6px;overflow:hidden;margin:16px 0 10px}.progress>span{display:block;height:100%;background:linear-gradient(90deg,#57bfa4,#c0f376)}.kpis{display:flex;gap:12px;flex-wrap:wrap}.kpis>div{background:#17343a;padding:11px 14px;border-radius:8px;min-width:110px}.kpis small{display:block;color:#8ba6a8;font-size:10px}.kpis b{display:block;font:700 18px 'Space Grotesk';margin-top:5px}.notice{border-left:3px solid var(--gold);background:#3c362b4f;padding:15px 18px;color:#e5d3aa;font-size:12px;line-height:1.7;border-radius:0 8px 8px 0;margin:18px 0}.modal-backdrop{position:fixed;inset:0;background:#020b0bd9;z-index:30;display:grid;place-items:center;padding:20px}.modal-backdrop[hidden]{display:none}.modal{background:#122930;border:1px solid #3a5b58;border-radius:16px;padding:30px;max-width:570px;width:100%;position:relative;box-shadow:0 20px 80px #0008}.close{position:absolute;right:16px;top:14px;border:0;background:none;color:white;font-size:20px}.modal h2{font:700 29px 'Space Grotesk';margin:0 0 12px}.modal p{color:#b6cdca;line-height:1.8;font-size:13px}.detailgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:20px}.detailgrid>div{background:#1b383f;padding:14px;border-radius:8px}.detailgrid small{color:#87a6aa;font-size:10px;display:block;margin-bottom:8px}.detailgrid b{font-size:16px}.formrow{display:flex;gap:10px;margin:14px 0;flex-wrap:wrap}.formrow input,.formrow select{flex:1;min-width:140px;background:#0b2026;border:1px solid #37555a;border-radius:8px;padding:11px;color:white}.barline{display:flex;align-items:center;gap:14px;margin:17px 0}.barline label{width:130px;font-size:11px;color:#aac3c3}.bar{height:10px;flex:1;background:#26444a;border-radius:9px;overflow:hidden}.bar span{display:block;height:100%;background:linear-gradient(90deg,#4eb7a3,#b7f16d)}.barline b{font-size:12px;width:80px;text-align:right}.splitnumber{display:flex;justify-content:space-between;margin-bottom:12px}.splitnumber small{color:#8ca7aa}.splitnumber b{font:700 20px 'Space Grotesk'}.mobilebrand{display:none}#toast{position:fixed;right:22px;bottom:22px;z-index:50;background:#b7f16d;color:#10251c;padding:13px 19px;border-radius:10px;font-weight:800;font-size:12px;display:none}a{color:var(--lime)}@media(max-width:1100px){.sidebar{width:215px}.content{padding:28px}.topbar{padding:0 28px}.stats{grid-template-columns:repeat(2,1fr)}.twocol{grid-template-columns:1fr}.gridcards{grid-template-columns:repeat(2,1fr)}}@media(max-width:720px){.sidebar{position:fixed;z-index:20;transform:translateX(-100%);transition:.2s}.sidebar.open{transform:none}.topbar{height:66px;padding:0 18px}.mobilebrand{display:block;font-weight:800;color:var(--lime)}.mobilebrand button{background:none;color:white;border:0;font-size:19px;margin-left:8px}.crumb,.date{display:none}.topright{gap:7px}.livepill{font-size:9px;padding:7px}.content{padding:24px 16px}.hero{padding:25px;min-height:260px}.hero h2{font-size:30px}.stats{gap:9px}.stat{padding:17px;min-height:115px}.stat .value{font-size:24px}.gridcards{grid-template-columns:1fr}.pagehead{align-items:start;flex-direction:column}.pagehead h1{font-size:35px}footer{padding:16px;display:block;line-height:2}.search{min-width:100%;width:100%}}

/* Original anime visual expansion */
.crest{clip-path:none;background:transparent;width:54px;height:58px}.crest img{width:100%;height:100%;object-fit:contain;border-radius:4px}.avatar{overflow:hidden}.avatar img{width:100%;height:100%;object-fit:cover}.portrait-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(125px,1fr));gap:12px;margin-bottom:28px}.portrait-tile{display:flex;flex-direction:column;align-items:stretch;text-align:left;overflow:hidden;background:#11282e;border:1px solid #31564d;border-radius:12px;color:#fff;padding:0;transition:transform .16s,border-color .16s}.portrait-tile:hover{transform:translateY(-3px);border-color:#b7f16d}.portrait-tile img{display:block;width:100%;aspect-ratio:1.15;object-fit:cover;object-position:50% 20%;background:#1e3738}.portrait-name{font-weight:800;font-size:12px;padding:10px 9px 2px}.portrait-meta{font-size:10px;color:#9cc5b6;padding:0 9px 11px}.gallery-count{color:#8bb2a7;font-size:10px;letter-spacing:1.3px;margin-left:9px}.hero{isolation:isolate;padding-right:31%}.hero-face{position:absolute;right:0;bottom:0;width:31%;height:100%;object-fit:cover;object-position:50% 15%;mask-image:linear-gradient(to right,transparent,black 30%);opacity:.94;z-index:-1}.youthportrait{height:155px;margin:-21px -21px 17px;overflow:hidden;border-radius:12px 12px 0 0}.youthportrait img{width:100%;height:100%;object-fit:cover;object-position:center 20%}.profilehero{display:flex;gap:20px;align-items:center;margin-bottom:15px}.profilehero img{width:132px;height:132px;object-fit:cover;border-radius:14px;border:1px solid #54775d}.profilehero h2{margin:0}.modal{max-height:90vh;overflow:auto}@media(max-width:720px){.hero{padding-right:25px}.hero-face{opacity:.18;width:65%}.portrait-gallery{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.portrait-name{font-size:10px}.portrait-meta{font-size:9px}.profilehero img{width:90px;height:90px}}

/* One player per row: readable roster with large original anime portraits */
.roster-list{width:100%;display:flex;flex-direction:column;overflow:hidden}
.roster-head,.roster-row{display:grid;grid-template-columns:minmax(230px,2.25fr) minmax(95px,.85fr) 68px minmax(95px,.9fr) minmax(140px,1.45fr) 65px;align-items:center;column-gap:14px}
.roster-head{padding:14px 21px;background:#17333a;color:#8eabb0;font-size:10px;font-weight:800;letter-spacing:1.15px}
.roster-row{border:0;border-top:1px solid #29454a;background:#10242b;color:#e7f4ef;text-align:left;width:100%;padding:10px 21px;min-height:108px;transition:background .15s}
.roster-row:hover,.roster-row:focus-visible{background:#1a3a3b;outline:0;box-shadow:inset 3px 0 #b7f16d}
.roster-identity{display:flex;align-items:center;gap:17px;min-width:0}
.roster-photo{width:85px;height:91px;flex:0 0 85px;border-radius:10px;overflow:hidden;border:1px solid #52776b;background:#264441;display:block}
.roster-photo img{width:100%;height:100%;object-fit:cover;object-position:center 17%;display:block}
.roster-name-wrap{display:flex;flex-direction:column;gap:8px;min-width:0}.roster-name-wrap strong{font-size:15px;line-height:1.2;overflow-wrap:anywhere}.roster-name-wrap small{color:#8fa9aa;font-size:9px;letter-spacing:.8px}
.roster-position{font-size:13px;font-weight:800;color:#d5e9e3}.roster-overall{font:800 27px 'Space Grotesk',sans-serif;color:#b7f16d}.roster-potential{font:700 17px 'Space Grotesk',sans-serif;color:#f2d58c}.roster-other{display:flex;flex-direction:column;gap:8px}.roster-sub{font-size:11px;color:#a7c0bc;line-height:1.3}.roster-arrow{font-size:11px;color:#b7f16d;font-weight:800;text-align:right}
@media(max-width:1100px){.roster-head,.roster-row{grid-template-columns:minmax(185px,2fr) minmax(80px,.8fr) 55px minmax(80px,.8fr) minmax(110px,1.1fr);gap:9px}.roster-head>span:last-child,.roster-arrow{display:none}.roster-photo{width:72px;height:78px;flex-basis:72px}}
@media(max-width:720px){.roster-head{grid-template-columns:minmax(130px,2fr) 55px 52px 70px;padding:12px 10px;gap:7px}.roster-head>span:nth-child(5){display:none}.roster-head>span:nth-child(2){display:none}.roster-row{grid-template-columns:minmax(130px,2fr) 55px 52px 70px;gap:7px;padding:9px 10px;min-height:88px}.roster-position,.roster-other{display:none}.roster-photo{width:59px;height:67px;flex-basis:59px}.roster-identity{gap:9px}.roster-name-wrap strong{font-size:12px}.roster-name-wrap small{font-size:8px;letter-spacing:0}.roster-overall{font-size:22px}.roster-potential{font-size:13px}.roster-head>span:nth-child(3){grid-column:2}.roster-head>span:nth-child(4){grid-column:3 / 5}}

/* Six editable skill ratings, displayed alongside each player */
.roster-scroll{overflow-x:auto;border-radius:10px}.roster-stats{min-width:1000px}.roster-stats .roster-head,.roster-stats .roster-row{grid-template-columns:minmax(200px,1.8fr) 80px 58px 85px minmax(310px,2.5fr) 48px;column-gap:10px}.roster-stats .roster-head>span:last-child,.roster-stats .roster-arrow{display:block}.attributes-heading{text-align:center}.attr-strip{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:5px}.attr-cell{background:#1b353a;border:1px solid #2b5050;border-radius:7px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:8px 2px;gap:5px}.attr-cell small{color:#9bb6b4;font-size:9px;font-weight:800;letter-spacing:.5px}.attr-cell b{color:#b7f16d;font:800 18px 'Space Grotesk',sans-serif}.attr-cell b.attr-empty{color:#6d8b8c}.attribute-editor{border-top:1px solid #345456;margin-top:22px;padding-top:22px}.attribute-editor p{font-size:12px}.attribute-fields{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:14px 0 18px}.attribute-fields label{font-size:11px;color:#b6cdca;display:flex;flex-direction:column;gap:6px}.attribute-fields input{width:100%;background:#0b2026;color:#e8f5ec;border:1px solid #46625e;border-radius:7px;padding:10px;font-size:16px}@media(max-width:720px){.attribute-fields{grid-template-columns:repeat(2,1fr)}.roster-stats .roster-head,.roster-stats .roster-row{grid-template-columns:minmax(185px,1.8fr) 75px 55px 75px minmax(300px,2.5fr) 40px}.roster-stats .roster-position{display:block}.roster-stats .roster-head>span:nth-child(2){display:block}.roster-stats .roster-head>span:nth-child(5){display:block}}
