@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800;900&family=DM+Sans:wght@400;500;600;700;800&display=swap');
:root{font-family:'DM Sans',system-ui,sans-serif;color:#f6edd5;background:#101a1b;--ink:#101a1b;--cream:#f6edd5;--gold:#f5be61;--red:#b64b37;--line:#53615c;--panel:#172426}*{box-sizing:border-box}body{margin:0;min-height:100vh}button,input,select{font:inherit}button{cursor:pointer}h1,h2,h3,.display,.mode-title{font-family:'Barlow Condensed',Impact,sans-serif;text-transform:uppercase;letter-spacing:.035em}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(3.8rem,11vw,9.8rem);line-height:.82;margin-bottom:18px}h2{font-size:clamp(2.4rem,6vw,5rem);line-height:.9;margin-bottom:18px}h3{font-size:1.9rem;margin-bottom:12px}.eyebrow{color:var(--gold);font-size:.7rem;letter-spacing:.23em;font-weight:800;text-transform:uppercase}.muted{color:#b8c4b7}.small{font-size:.83rem}.wrap{max-width:1320px;margin:auto;padding:24px clamp(18px,4vw,56px)}.btn{border:1px solid #dbcba3;border-radius:3px;background:var(--gold);color:#151b19;padding:12px 20px;text-transform:uppercase;font-weight:900;letter-spacing:.06em;box-shadow:4px 4px 0 #754936}.btn:hover,.btn:focus-visible{transform:translateY(-2px);filter:brightness(1.08)}.btn.alt{background:#273638;color:var(--cream);border-color:#687a71;box-shadow:4px 4px 0 #0b1313}.btn.ghost{background:transparent;color:var(--cream);box-shadow:none}.btn.danger{background:#9f3a2c;color:#fff}.btn:disabled{opacity:.45;cursor:not-allowed}.topbar{position:sticky;top:0;z-index:30;background:#101a1be8;backdrop-filter:blur(16px);border-bottom:1px solid #65725b;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:12px clamp(18px,4vw,56px)}.brand{font-family:'Barlow Condensed';text-transform:uppercase;font-size:1.5rem;font-weight:900;letter-spacing:.05em;color:var(--gold)}.nav{display:flex;gap:8px;flex-wrap:wrap}.nav button{border:0;background:transparent;color:#d2d7c8;text-transform:uppercase;font-size:.72rem;font-weight:800;letter-spacing:.1em;padding:9px}.nav button:hover,.nav .active{color:var(--gold)}.title-screen{min-height:100svh;position:relative;overflow:hidden;background:radial-gradient(circle at 70% 35%,#566257 0,#1c2a2b 30%,#101617 75%)}.title-screen:before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(0deg,#ffffff08 0 1px,transparent 1px 4px),linear-gradient(90deg,#0c1718 0%,transparent 75%);pointer-events:none;z-index:2}.photo-wall{position:absolute;inset:0 0 0 35%;display:flex;justify-content:center;align-items:stretch;gap:2%;transform:skew(-7deg) scale(1.12);opacity:.86}.photo-wall .portrait{position:relative;flex:1;min-width:0;overflow:hidden;border-left:2px solid #dcae68}.photo-wall img{height:100%;width:100%;object-fit:cover;filter:sepia(.38) contrast(1.25) grayscale(.38)}.photo-wall .portrait:nth-child(1) img{object-position:54% 30%}.photo-wall .portrait:nth-child(2) img{object-position:45% 30%}.photo-wall .portrait:nth-child(3) img{object-position:57% 28%}.photo-wall .portrait:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#111c1c 1%,transparent 60%),linear-gradient(90deg,#1020209c,transparent)}.photo-wall .tag{position:absolute;bottom:11%;left:10%;z-index:3;font-family:'Barlow Condensed';font-weight:900;font-size:clamp(1rem,2.1vw,2rem);text-transform:uppercase;text-shadow:1px 2px 8px #000}.title-copy{position:relative;z-index:3;padding:clamp(60px,13vh,150px) clamp(24px,5vw,80px);width:min(680px,66%)}.title-copy p{max-width:500px;line-height:1.6;color:#e2e4d4}.byline{border-left:3px solid var(--gold);padding-left:14px;margin:25px 0 33px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}.title-actions{display:flex;gap:14px;flex-wrap:wrap}.credit{position:absolute;bottom:14px;left:24px;z-index:4;color:#a7b1a6;font-size:.65rem;max-width:560px}.hero-band{background:linear-gradient(100deg,#7a4a31,#b26339 48%,#d7a04e);padding:44px clamp(20px,4vw,60px);border-bottom:5px solid #edc073}.hero-band h2{max-width:850px;color:#fff1d6}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.card,.panel{background:linear-gradient(145deg,#223232,#172324);border:1px solid #667669;border-radius:5px;padding:22px;box-shadow:0 10px 35px #050c0c4d}.mode-card{min-height:210px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden;transition:transform .2s}.mode-card:hover{transform:translateY(-4px)}.mode-card:after{content:attr(data-mark);position:absolute;right:-10px;top:-24px;font:900 180px 'Barlow Condensed';color:#f3d79a0b;pointer-events:none}.mode-title{font-size:2.2rem;font-weight:900;color:var(--gold)}.mode-card p{max-width:460px;color:#cfdbc9;font-size:.9rem}.row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.between{justify-content:space-between}.section-title{display:flex;justify-content:space-between;align-items:end;gap:20px;margin:28px 0 16px}.control{display:flex;flex-direction:column;gap:7px;color:#b7c5ba;font-size:.72rem;text-transform:uppercase;font-weight:800;letter-spacing:.1em;min-width:170px;flex:1}.control input,.control select{background:#0d191b;color:#fff4d7;border:1px solid #76877d;border-radius:3px;min-height:44px;padding:9px 12px;min-width:0}.control input[type=range]{padding:0}.team-list,.roster-list{display:grid;gap:8px;max-height:440px;overflow:auto;padding-right:4px}.team-row,.player-row{border:1px solid #4e655c;background:#1b2a2b;color:var(--cream);display:flex;text-align:left;align-items:center;justify-content:space-between;gap:12px;padding:12px;border-radius:3px}.team-row:hover,.player-row:hover,.team-row.selected,.player-row.selected{border-color:var(--gold);background:#33433c}.badge{background:#d5ac62;color:#1b2220;border-radius:2px;padding:5px 8px;font:900 .8rem 'Barlow Condensed';min-width:38px;text-align:center}.two-col{display:grid;grid-template-columns:1.05fr .95fr;gap:18px}.stat{font-family:'Barlow Condensed';font-size:1.25rem;font-weight:800;color:var(--gold)}.statline{display:flex;gap:10px;flex-wrap:wrap;margin:8px 0}.statline span{background:#283a36;padding:5px 9px;border-radius:2px;font-size:.72rem}.list-head{font-weight:800;color:#e5c385;letter-spacing:.12em;font-size:.7rem;text-transform:uppercase;margin:15px 0 8px}.history{margin-top:25px;padding:16px;background:#111d1d;border-left:3px solid var(--gold);font-size:.82rem;color:#cdd3c3;line-height:1.5}.history a{color:var(--gold)}.portrait-mini{width:72px;height:82px;object-fit:cover;filter:sepia(.4);border:1px solid #bd9960}.table-wrap{overflow:auto}.table{border-collapse:collapse;width:100%;min-width:650px;font-size:.82rem}.table th,.table td{text-align:left;padding:9px 7px;border-bottom:1px solid #44554d}.table th{color:var(--gold);font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;position:sticky;top:0;background:#172426}.table tr:hover td{background:#2c3b39}.field-shell{position:relative;border:2px solid #a7a77a;background:#122526;overflow:hidden;aspect-ratio:16/9;min-height:370px;max-height:72vh}.field-shell canvas{width:100%;height:100%;display:block;touch-action:none}.field-hud{position:absolute;top:15px;left:15px;right:15px;display:flex;gap:10px;justify-content:space-between;align-items:flex-start;pointer-events:none}.hud-box{background:#0d191be8;color:white;border:1px solid #eed18e;padding:8px 12px;font-family:'Barlow Condensed';font-size:1.25rem;font-weight:800;box-shadow:3px 3px 0 #593c2b}.field-controls{position:absolute;bottom:14px;left:15px;right:15px;display:flex;justify-content:space-between;align-items:end;gap:15px}.field-controls .btn{pointer-events:auto;min-width:100px}.field-message{position:absolute;top:21%;left:50%;transform:translateX(-50%);min-width:220px;text-align:center;background:#122122e8;border:1px solid #e4b45e;padding:13px 20px;color:var(--gold);font:900 clamp(1.4rem,3vw,3rem) 'Barlow Condensed';text-transform:uppercase;letter-spacing:.07em;pointer-events:none}.meter{height:12px;width:180px;background:#151919;border:1px solid #d3d3aa;position:relative}.meter i{display:block;background:#cf8b4c;height:100%;width:10%;transition:width .06s}.note{color:#bbcabf;font-size:.78rem;line-height:1.5}.mobile-only{display:none}.upgrade-item{display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid #53665b;padding:9px 0}.upgrade-item strong{color:var(--gold)}.screen-footer{padding:40px 20px;color:#aeb8aa;text-align:center;font-size:.7rem}.loading{padding:40vh 10vw;text-align:center;font:900 3rem 'Barlow Condensed';text-transform:uppercase;color:var(--gold)}.toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);z-index:100;background:var(--gold);color:#17201d;padding:12px 20px;font-weight:800;box-shadow:0 5px 30px #0009;text-align:center;max-width:90vw}
@media(max-width:820px){.two-col,.grid.three{grid-template-columns:1fr}.nav{gap:0}.topbar{align-items:flex-start;flex-direction:column;gap:2px}.topbar .nav{overflow-x:auto;width:100%;white-space:nowrap;flex-wrap:nowrap}.nav button{padding:7px 10px}.field-shell{aspect-ratio:9/13;min-height:440px;max-height:75vh}.field-controls{bottom:10px}.field-controls .btn{padding:11px;min-width:92px}.mobile-only{display:inline}.title-copy{width:100%;min-height:100svh;padding:13vh 24px 80px}.photo-wall{inset:0;opacity:.43;transform:skew(-5deg) scale(1.17)}.title-screen:before{background:linear-gradient(90deg,#091414ef,#09141472)}.title-copy p{max-width:440px}.grid{grid-template-columns:1fr}.mode-card{min-height:160px}.section-title{align-items:start;flex-direction:column}.photo-wall .tag{bottom:7%}.credit{font-size:.56rem}.hud-box{font-size:.95rem;padding:6px}.field-message{top:17%}}
.tutorial .card{overflow:hidden}.tutorial-art{height:230px;margin:-22px -22px 18px;position:relative;background:#355a44;overflow:hidden}.tutorial-art img{width:100%;height:100%;object-fit:cover;object-position:center 28%;filter:sepia(.25)}.tutorial-art svg{width:100%;height:100%;display:block}.tutorial-art span{position:absolute;bottom:0;left:0;right:0;padding:12px 20px;background:linear-gradient(transparent,#101a1be8);color:#f5be61;font:900 1.4rem 'Barlow Condensed',Impact,sans-serif;text-transform:uppercase}.tutorial .card p{line-height:1.55;color:#d3dccd}