:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;color:#162018;background:radial-gradient(circle at top,#ffffffeb,#fff0 26%),linear-gradient(#d8ecff 0%,#eef7dd 100%);font-family:PRetendard,Pretendard,Pretendard Variable,-apple-system,BlinkMacSystemFont,Apple SD Gothic Neo,Noto Sans KR,Malgun Gothic,sans-serif}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}body{min-height:100vh}button{font:inherit}.app-shell{gap:18px;min-height:100vh;padding:32px 20px 24px;display:grid}.hero-copy{text-align:center;width:min(840px,100%);margin:0 auto}.eyebrow{letter-spacing:.24em;text-transform:uppercase;color:#7a5d2d;margin:0 0 8px;font-size:.74rem;font-weight:700}.hero-copy h1{letter-spacing:.04em;color:#28321f;text-shadow:0 10px 24px #4a613026;white-space:nowrap;margin:0;font-family:Black Ops One,cursive;font-size:clamp(1.8rem,5vw,4.2rem)}.description{color:#162018c7;max-width:780px;margin:12px auto 0;font-size:clamp(.84rem,1.75vw,1rem);line-height:1.7}.viewport-card{aspect-ratio:16/9;background:linear-gradient(#ffffff9e,#eaf5dc59);border:1px solid #2b36271f;border-radius:34px;width:min(1320px,100%);min-height:420px;margin:0 auto;position:relative;overflow:hidden;box-shadow:0 28px 80px #48614038,inset 0 1px #ffffff73}.viewport{position:absolute;inset:0}.viewport canvas{width:100%;height:100%;display:block}.focus-overlay{z-index:3;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);text-align:center;background:#fcf9f1c2;border:1px solid #252f1f1a;border-radius:28px;width:min(420px,100% - 36px);padding:22px 24px 20px;transition:opacity .18s,transform .18s;position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%);box-shadow:0 28px 70px #283a1f38}.focus-overlay.is-hidden{opacity:0;pointer-events:none;transform:translate(-50%,-46%)}.focus-kicker{letter-spacing:.18em;text-transform:uppercase;color:#785f2b;margin:0 0 8px;font-size:.72rem;font-weight:800}.focus-overlay h2{color:#1f2b22;margin:0;font-size:clamp(1.1rem,2.8vw,1.55rem);line-height:1.2}.focus-overlay p{color:#182319b8;margin:10px 0 0;font-size:.88rem;line-height:1.65}.hud{z-index:2;gap:8px;display:grid;position:absolute;top:18px}.hud span{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);letter-spacing:.04em;text-transform:uppercase;background:#f7f3e8c7;border:1px solid #32322317;border-radius:999px;width:fit-content;padding:8px 12px;font-size:.76rem;font-weight:700}.hud-left{left:18px}.status-bar{z-index:2;align-items:center;gap:8px;display:flex;position:absolute;bottom:18px;left:18px}.status-pill{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#f4f8ef;letter-spacing:.08em;text-transform:uppercase;background:#1a2c19d1;border:1px solid #ffffff1f;border-radius:999px;padding:10px 13px;font-size:.72rem;font-weight:800;box-shadow:0 14px 30px #1926162e}.status-pill.subtle{color:#223022;box-shadow:none;background:#f7f3e8b8;border-color:#32322317}.status-pill.is-live{background:#224722d6}.crosshair{z-index:2;opacity:0;pointer-events:none;width:18px;height:18px;transition:opacity .16s;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.crosshair:before,.crosshair:after{content:"";background:#ffffffd6;position:absolute;box-shadow:0 0 16px #0f18102e}.crosshair:before{width:2px;height:16px;top:1px;left:8px}.crosshair:after{width:16px;height:2px;top:8px;left:1px}.crosshair.is-visible{opacity:1}@media (width<=860px){.app-shell{padding:18px 12px 14px}.viewport-card{aspect-ratio:auto;min-height:70vh}.hud{gap:6px;top:12px}.hud span{padding:7px 10px;font-size:.68rem}.focus-overlay{width:calc(100% - 24px);padding:18px 16px}.status-bar{flex-wrap:wrap;gap:6px;bottom:12px;left:12px}.status-pill{padding:8px 10px;font-size:.64rem}}