:root{font-family:Inter,ui-sans-serif,system-ui,sans-serif;color:#e9e2d3;background:#0e120f}*{box-sizing:border-box}body{margin:0;overflow:hidden;background:#0e120f}button{font:inherit;color:#d9d3c5;background:#1c231e;border:1px solid #4f5b50;padding:8px 9px;cursor:pointer}button:hover{background:#263028}.shell{height:100vh;display:grid;grid-template-rows:62px 1fr}header{display:flex;align-items:center;justify-content:space-between;padding:0 20px;border-bottom:1px solid #4e584e;background:#161c18}header strong{font-size:21px;letter-spacing:.18em}header div>span{margin-left:12px;color:#929b90;font-size:10px}.metrics{display:flex;gap:20px}.metrics span{margin:0;font-size:9px;letter-spacing:.12em}.metrics b{display:block;margin-top:3px;color:#e9e2d3;font-size:11px}.layout{display:grid;grid-template-columns:260px minmax(0,1fr) 300px;min-height:0}.left-panel,.right-panel{padding:16px;background:#151a17;overflow:auto}.left-panel{border-right:1px solid #485148}.right-panel{border-left:1px solid #485148}h2{margin:18px 0 8px;font-size:10px;letter-spacing:.17em;text-transform:uppercase;color:#afa994}h2:first-child{margin-top:0}dl{margin:0}dt{margin-top:9px;font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:#7f897e}dd{margin:2px 0;font:11px ui-monospace,SFMono-Regular,monospace}p,li{font-size:11px;line-height:1.45}ul{padding-left:17px}.muted{font-size:11px;line-height:1.45;color:#858e84}.action-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}.help{margin-top:18px;padding:10px;border:1px solid #414a42;background:#0f1411;color:#879087;font-size:10px;line-height:1.65}.view-wrap{position:relative;min-width:0;min-height:0;background:#0e120f}canvas{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none}.hidden{display:none!important}.card-tray{position:absolute;left:12px;right:12px;bottom:12px;pointer-events:none}.cards{display:flex;justify-content:center;gap:8px;align-items:flex-end}.card{width:132px;min-height:112px;padding:9px;text-align:left;background:#171d19e8;border:1px solid #59645a;box-shadow:0 8px 24px #0008;pointer-events:auto}.card.selected{transform:translateY(-10px);border-color:#e0c58e}.card .name{font-weight:700;font-size:11px}.card .meta{margin-top:4px;color:#9da599;font-size:9px;text-transform:uppercase}.card .text{margin-top:10px;color:#c4c0b5;font-size:10px;line-height:1.35}.card .cost{float:right;font-weight:700}.encounter-banner{position:absolute;top:14px;left:50%;transform:translateX(-50%);padding:8px 14px;border:1px solid #75554b;background:#211815e8;font-size:10px;letter-spacing:.13em}.encounter-banner.elite{border-color:#b27c66;color:#e5b9a3}.encounter-banner.boss{border-color:#d0ae69;color:#f0d99f}.focus-title{display:flex;justify-content:space-between;gap:10px;align-items:start}.focus-title strong{font-size:15px}.focus-title span{font-size:9px;letter-spacing:.12em;color:#c89d7e}.boss-phase{height:6px;margin:10px 0;background:#2a211c;border:1px solid #55483c}.boss-phase>div{height:100%;background:#c49a58}.combat-log{list-style:none;padding:0;margin:0}.combat-log li{padding:5px 0;border-bottom:1px solid #2e352f;color:#aeb5aa}.game-over{position:fixed;inset:0;z-index:20;display:grid;place-items:center;background:#090b09d9}.game-over>div{width:340px;padding:30px;border:1px solid #725248;background:#171412;text-align:center}.game-over h1{letter-spacing:.16em;font-size:24px}.game-over p{color:#aaa298}.game-over button{margin-top:12px;padding:10px 18px}@media(max-width:1000px){.layout{grid-template-columns:220px 1fr}.right-panel{position:absolute;right:0;top:62px;bottom:0;width:260px;background:#151a17ed;z-index:5}.card{width:112px}.metrics{display:none}}.expedition-card{padding:9px;border:1px solid #465047;background:#101512;font-size:10px;line-height:1.45}.expedition-card strong{display:block;color:#e3d1a3;font-size:12px}.expedition-card small{display:block;margin-top:4px;color:#929b90}.expedition-actions{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:6px}.expedition-actions button{padding:6px 5px;font-size:9px}.lead-list{list-style:none;padding:0;margin:0}.lead-list li{margin:0 0 5px}.lead-button{width:100%;padding:7px;text-align:left;background:#111713;border-color:#39433b;font-size:10px}.lead-button.tracked{border-color:#d2b978;background:#202018}.lead-button .lead-meta{display:block;margin-top:2px;color:#8d968c;font-size:9px}.march-button{grid-column:1/-1}

/* Startup title, settings, and opening presentation. */
.front-screen{position:fixed;inset:0;z-index:50;display:grid;place-items:center;overflow:hidden;background:
radial-gradient(circle at 50% 72%,#293429 0,#172019 24%,#0d120f 58%,#080b09 100%);color:#ede6d7}
.front-screen::before{content:"";position:absolute;inset:-20%;background:
linear-gradient(115deg,transparent 20%,#8997840b 48%,transparent 70%),
repeating-linear-gradient(90deg,transparent 0 70px,#bdc8b505 71px 72px);
animation:front-drift 18s linear infinite;pointer-events:none}
.front-grain{position:absolute;inset:0;opacity:.28;background-image:
radial-gradient(circle at 20% 30%,#d5dec90d 0 1px,transparent 1.5px),
radial-gradient(circle at 70% 65%,#d5dec90b 0 1px,transparent 1.5px);background-size:38px 38px,53px 53px;pointer-events:none}
.front-orbit{position:absolute;border:1px solid #8ea08b20;border-radius:50%;box-shadow:0 0 80px #6174610a;pointer-events:none}
.orbit-a{width:min(70vw,820px);aspect-ratio:1;animation:front-spin 42s linear infinite}
.orbit-b{width:min(52vw,590px);aspect-ratio:1;border-style:dashed;animation:front-spin 26s linear infinite reverse}
.title-card,.settings-card,.opening-copy{position:relative;z-index:2;width:min(720px,calc(100vw - 40px));padding:42px}
.title-card{text-align:center}
.front-kicker{margin:0 0 12px;color:#97a092;font:10px ui-monospace,SFMono-Regular,monospace;letter-spacing:.28em}
.title-card h1,.settings-card h1,.opening-copy h1{margin:0;color:#f1e9d8;font-weight:600;letter-spacing:.22em;text-shadow:0 14px 42px #000}
.title-card h1{font-size:clamp(72px,15vw,156px);line-height:.82}
.title-line{margin:30px 0 8px;color:#c9c4b8;font-size:14px;letter-spacing:.2em;text-transform:uppercase}
.title-copy{margin:0 auto;max-width:520px;color:#858f84;font-size:12px;line-height:1.8}
.front-actions{display:flex;justify-content:center;gap:10px;margin-top:30px}
.front-actions.compact{justify-content:flex-start;margin-top:24px}
.front-button{min-width:170px;padding:12px 16px;border-color:#59645a;background:#111713d9;font-size:10px;letter-spacing:.16em}
.front-button.primary{border-color:#c0b07d;color:#efe1b9;background:#23231be8}
.front-button:hover{background:#2d372f}
.front-button:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid #d1bf86;outline-offset:3px}
.front-status{margin:16px 0 0;color:#5f6a61;font:9px ui-monospace,SFMono-Regular,monospace;letter-spacing:.12em}
.settings-card{border:1px solid #55605766;background:#111713e8;box-shadow:0 24px 100px #0009}
.settings-card h1{font-size:38px}
.setting-row,.setting-toggle{display:grid;grid-template-columns:minmax(0,1fr) 190px;align-items:center;gap:20px;padding:18px 0;border-bottom:1px solid #39423b}
.setting-row:first-of-type{margin-top:22px;border-top:1px solid #39423b}
.setting-row label,.setting-toggle strong{font-size:10px;letter-spacing:.15em;color:#c4c0b5}
.setting-row select{width:100%;padding:9px;border:1px solid #4e594f;background:#0d120f;color:#e9e2d3;font:10px ui-monospace,SFMono-Regular,monospace}
.setting-toggle{cursor:pointer}
.setting-toggle span{display:grid;gap:5px}
.setting-toggle small{color:#788278;font-size:10px;line-height:1.4}
.setting-toggle input{justify-self:end;width:18px;height:18px;accent-color:#bba873}
.opening-screen{place-items:stretch;background:linear-gradient(#090c0a 0,#121913 55%,#080a09 100%)}
.op-visual{position:absolute;inset:0;overflow:hidden}
.op-visual::before{content:"";position:absolute;left:50%;bottom:-34vw;width:110vw;height:70vw;transform:translateX(-50%);border-radius:50%;border:1px solid #8b9b8920;background:radial-gradient(circle at 50% 15%,#53655324 0,transparent 34%);box-shadow:0 -24px 90px #758a6820}
.op-visual i{position:absolute;left:50%;bottom:20%;width:1px;height:58%;background:linear-gradient(transparent,#b3bd9d35,transparent);transform-origin:bottom}
.op-visual i:nth-child(1){transform:rotate(-38deg)}
.op-visual i:nth-child(2){transform:rotate(0)}
.op-visual i:nth-child(3){transform:rotate(38deg)}
.opening-copy{align-self:end;margin:0 0 7vh 7vw;width:min(760px,86vw);padding:0}
.opening-copy h1{font-size:clamp(34px,6vw,76px);line-height:1.05;max-width:760px}
.opening-copy>p:not(.front-kicker){max-width:620px;margin:18px 0 0;color:#a6aea3;font-size:13px;line-height:1.9}
.opening-progress{display:flex;gap:6px;margin-top:26px;width:min(360px,60vw)}
.opening-progress span{height:2px;flex:1;background:#4a554b}
.opening-progress span.active{background:#d0bc80;box-shadow:0 0 18px #c4aa6255}
.reduce-motion .front-screen::before,.reduce-motion .front-orbit{animation:none}
.reduce-motion *{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}
@keyframes front-drift{from{transform:translate3d(-3%,0,0)}50%{transform:translate3d(3%,2%,0)}to{transform:translate3d(-3%,0,0)}}
@keyframes front-spin{to{transform:rotate(360deg)}}
@media(max-width:680px){.title-card,.settings-card{padding:28px 22px}.front-actions{flex-direction:column}.front-button{width:100%}.front-actions.compact{align-items:stretch}.setting-row,.setting-toggle{grid-template-columns:1fr;gap:10px}.setting-toggle input{justify-self:start}.opening-copy{margin:0 24px 6vh;width:auto}.opening-copy .front-actions{width:min(360px,100%)}}
