:root{color-scheme:dark;font-family:'Segoe UI',system-ui,sans-serif;background:#090d0f;color:#ece7da;--gold:#d8b365;--gold-bright:#f5d587;--panel:#121a1d;--border:#3c4d44;--emerald:#2a6049}
*{box-sizing:border-box}
body{margin:0;background:radial-gradient(circle at 50% 0%,#182924 0%,#090d0f 65%);min-height:100vh}
.svg-filters{position:absolute;width:0;height:0;pointer-events:none}
main{max-width:1240px;margin:auto;padding:16px 20px 36px}
.tft-hero{display:flex;align-items:center;gap:18px;padding:14px 20px;background:linear-gradient(135deg,rgba(24,38,34,.92),rgba(13,19,22,.96));border:1px solid var(--gold);border-radius:10px;box-shadow:0 12px 32px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,235,175,.2)}
.crest{border-radius:8px;filter:drop-shadow(0 4px 10px rgba(0,0,0,.7));flex-shrink:0}
.hero-title{flex:1;min-width:240px}
.eyebrow{display:block;font-size:.7rem;letter-spacing:.14em;color:var(--gold);font-weight:700;margin-bottom:4px}
h1{font-size:1.38rem;margin:0 0 4px;color:#fff5dc;text-shadow:0 2px 6px rgba(0,0,0,.7)}
h2{font-size:1rem;margin:0;color:#f3e6c6}
p{line-height:1.5;color:#bfd0ca;margin:4px 0}
.vfx-showcase{display:flex;gap:8px;flex-wrap:wrap}
.vfx-showcase span{display:flex;flex-direction:column;align-items:center;gap:2px;background:rgba(9,14,16,.75);border:1px solid rgba(216,179,101,.35);border-radius:8px;padding:5px 7px;min-width:52px}
.vfx-showcase img{filter:drop-shadow(0 0 6px rgba(140,220,255,.35))}
.vfx-showcase small{font-size:.66rem;color:#d8cbb0;letter-spacing:.04em}
.onboarding-zone{margin-top:12px}
.onboarding-zone.compact .secondary-card{display:none}
.onboarding-zone.compact .onboarding-grid{grid-template-columns:1fr}
.onboarding-zone.compact .primary-card{padding:10px 16px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px}
.onboarding-zone.compact .primary-card h2,.onboarding-zone.compact .primary-card p,.onboarding-zone.compact .step-tag{display:none}
.onboarding-grid{display:grid;grid-template-columns:1.25fr 1fr;gap:12px}
.onboard-card{background:var(--panel);border:1px solid var(--border);border-radius:10px;padding:15px 18px;transition:border-color .15s,background .15s}
.onboard-card.dragover,.panel.dragover{border:2px dashed var(--gold-bright);background:rgba(36,68,58,.45)}
.primary-card{border-color:rgba(216,179,101,.55)}
.step-tag{display:inline-block;font-size:.68rem;font-weight:700;letter-spacing:.1em;color:var(--gold);margin-bottom:4px}
.onboard-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:10px}
.req-pills{display:flex;gap:8px;flex-wrap:wrap;list-style:none;padding:0;margin:10px 0 0}
.req-pills li{font-size:.78rem;padding:4px 10px;border-radius:99px;background:rgba(8,12,14,.75);border:1px solid #33463f}
.guide-steps{margin:8px 0 0;padding-left:18px;color:#c7d6d1;font-size:.85rem;line-height:1.55}
.guide-steps li{margin-bottom:6px}
.command-bar{margin-top:12px;padding:12px 16px;background:var(--panel);border:1px solid var(--border);border-radius:10px}
.actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
button,.btn-upload,.onboard-actions label,.panel-head label{background:#1c3d35;color:#f2efe6;border:1px solid #6ea38e;border-radius:6px;padding:9px 13px;font:600 .86rem/1.2 inherit;cursor:pointer;transition:transform .12s,border-color .15s,background .15s;display:inline-flex;align-items:center;gap:6px}
button:hover:not(:disabled),.btn-upload:hover,.onboard-actions label:hover,.panel-head label:hover{background:#255247;border-color:var(--gold-bright)}
.btn-gold{background:linear-gradient(180deg,#8b6520,#583d0e)!important;border-color:var(--gold-bright)!important;color:#fff8e6!important;box-shadow:0 4px 14px rgba(216,179,101,.22)}
.btn-gold:hover:not(:disabled){background:linear-gradient(180deg,#a47928,#6b4b12)!important}
.btn-polish[aria-pressed='true']{background:linear-gradient(180deg,#1e4b52,#132e35);border-color:#7ce8ff;color:#dffaff}
.btn-perf[aria-pressed='true']{background:linear-gradient(180deg,#234c35,#142e20);border-color:#84eba8;color:#e0ffea}
.btn-view{background:#192830;border-color:#7899ab}
button:disabled{opacity:.42;cursor:default}
button:focus-visible,input:focus-visible,canvas:focus-visible{outline:2px solid var(--gold-bright);outline-offset:2px}
.status-strip{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:8px;font-size:.85rem}
#fatal{color:#ffb4aa;white-space:pre-wrap;margin:6px 0 0}
.viewport-shell{position:relative;margin-top:12px}
.floating-hud{display:none;position:absolute;top:10px;right:14px;z-index:20;gap:6px;align-items:center;padding:6px 10px;background:rgba(8,12,14,.78);backdrop-filter:blur(6px);border:1px solid rgba(216,179,101,.55);border-radius:8px;opacity:.32;transition:opacity .2s}
.floating-hud:hover,.viewport-shell:fullscreen .floating-hud,body.theater-mode .floating-hud{opacity:.95}
.viewport-shell.running .floating-hud,.viewport-shell:fullscreen .floating-hud,body.theater-mode .floating-hud{display:flex}
.hud-title{font-size:.75rem;color:var(--gold-bright);font-weight:700;margin-right:4px}
.hud-btn{padding:5px 9px;font-size:.75rem;background:#172b28;border-color:#5a8275}
.hud-danger{background:#4a1f1f;border-color:#c97373}
#viewport:not(:empty){height:min(82vh,780px);background:#000;border:2px solid var(--gold);border-radius:10px;overflow:hidden;box-shadow:0 16px 40px rgba(0,0,0,.78)}
.viewport-shell:fullscreen{width:100vw;height:100vh;margin:0;background:#000}
.viewport-shell:fullscreen #viewport{width:100vw;height:100vh;border:0;border-radius:0}
body.theater-mode{overflow:hidden}
body.theater-mode .viewport-shell{position:fixed;inset:0;z-index:999;margin:0;background:#000}
body.theater-mode #viewport{width:100vw;height:100vh;max-height:none;border:0;border-radius:0}
#viewport.polish-active canvas{filter:url(#tft-hd-polish) saturate(1.12)}
canvas{display:block;width:100%;height:100%;touch-action:none}
.grid-panels{display:grid;grid-template-columns:1.1fr .9fr;gap:14px;margin-top:14px}
@media(max-width:900px){.grid-panels,.onboarding-grid{grid-template-columns:1fr}.tft-hero{flex-direction:column;align-items:flex-start}}
.panel{background:var(--panel);border:1px solid var(--border);border-radius:10px;padding:15px}
.panel-head{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;margin-bottom:8px}
.panel-sub{font-size:.82rem;color:#9eb2ac;margin:3px 0 8px}
.badge{background:rgba(42,96,73,.45);border:1px solid #6ec79e;color:#b8f5d6;padding:3px 9px;border-radius:99px;font-size:.72rem;font-weight:700}
.certified-list{display:flex;flex-direction:column;gap:8px;margin-top:6px}
.map-card{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 12px;background:rgba(9,14,16,.68);border:1px solid #30423b;border-radius:8px}
.map-card.imported{border-color:#7ce8ff;background:rgba(16,34,40,.65)}
.map-card strong{color:#fff3d6;display:block;font-size:.92rem}
.map-card small{color:#9ab0a9;display:block;font-size:.76rem;margin-top:2px}
.map-card-actions{display:flex;gap:8px;flex-shrink:0}
.btn-sm{padding:6px 11px;font-size:.79rem}
.certify-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:10px}
.metric-box{background:rgba(9,14,16,.65);border:1px solid #2e4039;border-radius:7px;padding:8px 10px}
.metric-box b{display:block;font-size:1.08rem;color:var(--gold-bright)}
.metric-box span{font-size:.73rem;color:#9cb0aa}
.polish-compare{margin-top:10px;padding:10px 12px;background:rgba(24,42,36,.45);border-left:3px solid var(--gold);border-radius:5px;font-size:.82rem;color:#d6e2de}
.data-drawer{margin-top:14px;background:var(--panel);border:1px solid var(--border);border-radius:10px;padding:12px 16px}
.data-drawer summary{cursor:pointer;font-weight:600;color:#e5d8b8;font-size:.88rem}
.drawer-body{margin-top:10px}
.file-inputs{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
label{display:block;margin:4px 0;font-size:.84rem}
input[type='file']{display:block;margin-top:6px;max-width:100%}
#log{max-height:180px;overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere;background:#080c0e;padding:10px;border-radius:6px;border:1px solid #26342f;font-size:.76rem}
.missing{color:#ffc29f}.present{color:#97d7b2;border-color:#4b8f6b!important}