:root{color-scheme:dark;font-family:Trebuchet MS,Avenir Next,sans-serif;background:radial-gradient(circle at top,#3e0b5c,#0d1021 42%,#05070f);color:#f4f7ff;line-height:1.3;font-weight:500;--cyan: #82ffee;--blue: #66b4ff;--pink: #ff5bce;--gold: #ffd95a;--ink: rgba(7, 10, 20, .84);--panel: rgba(13, 17, 33, .9);--panel-soft: rgba(13, 17, 33, .74)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#app{width:100%;height:100%;margin:0;overflow:hidden}body{background:radial-gradient(circle at 50% 0%,rgba(130,28,160,.32),transparent 36%),linear-gradient(180deg,#0d1021,#080a12)}button,input,textarea,select{font:inherit}.app-shell{display:grid;place-items:center;width:100%;height:100%;padding:16px}.app-frame{position:relative;width:min(100vw,56.25vh);height:min(100vh - 32px,177.78vw);max-width:540px;max-height:960px;overflow:hidden;border:1px solid rgba(130,255,238,.22);border-radius:28px;background:linear-gradient(180deg,#0d1121e0,#05070feb);box-shadow:0 24px 80px #0000008c,inset 0 0 0 1px #ffffff0a}.game-root,.overlay-root{position:absolute;inset:0}.game-root canvas{display:block;width:100%;height:100%}.overlay-root{pointer-events:none}.screen{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-between;padding:18px}.screen.hidden,.hidden{display:none!important}.menu-card,.result-card,.overlay-card,.hud-rail,.hud-actions{pointer-events:auto}.menu-card,.result-card,.overlay-card{margin:auto 0;padding:22px 20px;border-radius:24px;background:linear-gradient(180deg,#0d1121f0,#0d1121b8);border:1px solid rgba(130,255,238,.22);box-shadow:0 0 0 1px #ffffff0a inset,0 16px 36px #00000061;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.menu-card--wide,.overlay-card--wide{max-width:100%}.title-kicker,.draft-rarity{display:inline-block;padding:6px 10px;border-radius:999px;background:#ff5bce26;color:#ff9fe4;font-size:12px;letter-spacing:.08em;text-transform:uppercase}.title{margin:12px 0 8px;color:var(--cyan);font-size:42px;line-height:.98;text-transform:uppercase;text-shadow:0 0 24px rgba(130,255,238,.28)}.section-title,.result-title{margin:12px 0 10px;color:var(--cyan);font-size:28px;line-height:1}.subtitle,.result-subtitle,.paywall-status{margin:0;color:#f0f5ffd1;font-size:15px}.paywall-status{margin-top:10px;color:#82ffeee0;font-size:13px}.menu-primary,.menu-secondary,.menu-utility,.modal-actions,.result-actions{display:grid;gap:10px}.menu-primary,.menu-secondary,.menu-utility{margin-top:14px}.menu-utility{grid-template-columns:repeat(2,minmax(0,1fr))}.meta-strip,.paywall-points,.hud-meta-row,.draft-tags,.result-stats{display:flex;gap:8px;flex-wrap:wrap}.meta-chip,.result-chip,.draft-tag{padding:7px 10px;border-radius:999px;background:#82ffee1f;color:#f0f5ffcc;font-size:12px}.primary-button,.secondary-button,.text-button,.skill-button,.draft-card{pointer-events:auto;border:0;border-radius:18px;cursor:pointer;transition:transform .12s ease,opacity .12s ease,box-shadow .12s ease,background .12s ease}.primary-button:active,.secondary-button:active,.text-button:active,.skill-button:active,.draft-card:active{transform:scale(.98)}.primary-button{min-height:54px;padding:0 18px;color:#09131a;font-weight:800;font-size:15px;background:linear-gradient(135deg,var(--cyan) 0%,var(--blue) 100%);box-shadow:0 12px 28px #66b4ff3d}.secondary-button{min-height:46px;padding:0 14px;color:#f0f5fff0;font-weight:700;font-size:14px;background:#ffffff14;border:1px solid rgba(255,255,255,.08)}.text-button{min-height:40px;padding:0 10px;color:#f0f5ffb3;font-size:13px;font-weight:700;background:transparent}.primary-button:disabled,.secondary-button:disabled,.skill-button:disabled{opacity:.48;cursor:default}.profile-summary{margin-top:18px}.profile-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.profile-pill,.hud-pill{padding:10px 12px;border-radius:18px;background:#070a14c7;border:1px solid rgba(130,255,238,.18);box-shadow:0 10px 28px #0000003d}.profile-pill--wide,.hud-pill--wide{grid-column:1 / -1}.hud-label{display:block;margin-bottom:4px;color:#f0f5ff80;font-size:11px;text-transform:uppercase;letter-spacing:.08em}.hud-value{display:block;color:#f4f7ff;font-size:15px;font-weight:700}.guide-grid{display:grid;gap:12px;margin:18px 0}.guide-card{display:grid;grid-template-columns:60px 1fr;gap:12px;align-items:center;padding:14px;border-radius:18px;background:#ffffff0d;border:1px solid rgba(255,255,255,.08)}.guide-card h3{margin:0 0 4px;font-size:16px}.guide-card p{margin:0;color:#f0f5ffc7;font-size:13px}.guide-icon{width:60px;height:60px;object-fit:contain;filter:drop-shadow(0 0 16px rgba(130,255,238,.18))}.screen--hud{pointer-events:none}.hud-rail{width:min(72%,290px);display:grid;gap:8px;transition:opacity .22s ease,transform .22s ease}.hud-top{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.hud-pill{padding:8px 10px;border-radius:16px}.hud-pill .hud-value{font-size:13px}.objective-banner{align-self:flex-start;max-width:100%;padding:10px 14px;border-radius:999px;background:linear-gradient(135deg,#ff5bce2e,#82ffee1a);border:1px solid rgba(255,255,255,.08);color:#f4f7ffeb;font-size:13px;box-shadow:0 12px 30px #0003}.hud-meta-row{padding-left:2px}.hud-actions{display:flex;justify-content:space-between;align-items:flex-end;gap:10px;transition:opacity .22s ease}.pause-button{min-width:82px;min-height:42px}.skill-cluster{display:flex;gap:10px}.skill-button{min-width:112px;min-height:60px;padding:10px 14px;text-align:left;color:#f4f7ff;background:linear-gradient(180deg,#070a14e0,#070a14ad);border:1px solid rgba(130,255,238,.18);box-shadow:0 14px 32px #00000047}.skill-title{display:block;margin-bottom:4px;font-size:16px;font-weight:800}.skill-meta{display:block;color:#f0f5ffa8;font-size:12px}.screen--quiet .hud-rail{opacity:0;transform:translateY(-18px);pointer-events:none}.screen--quiet .hud-actions{opacity:.34}.overlay-panel{position:absolute;inset:0;display:grid;place-items:center;padding:18px;background:#04060c8a;pointer-events:auto}.overlay-card{width:min(100%,420px)}.overlay-card--wide,.paywall-card{width:min(100%,470px)}.draft-grid{display:grid;gap:12px;margin-top:18px}.draft-card{padding:16px;text-align:left;color:#f4f7ff;background:#ffffff0f;border:1px solid rgba(255,255,255,.08);display:grid;gap:8px}.draft-card--legendary{background:linear-gradient(135deg,#ffd95a2e,#ff5bce29);border-color:#ffd95a5c}.draft-card strong{font-size:18px}.draft-summary{color:#f0f5ffd1;font-size:14px}.draft-tags{margin-top:4px}.achievement-list{display:grid;gap:10px;margin:16px 0 18px;max-height:55vh;overflow:auto}.achievement-item{padding:14px;border-radius:18px;background:#ffffff0d;border:1px solid rgba(255,255,255,.06)}.achievement-item--unlocked{border-color:#82ffee38;background:#82ffee14}.achievement-item h3{margin:0 0 6px;font-size:17px}.achievement-item p{margin:0 0 8px;font-size:13px;color:#f0f5ffc7}.achievement-meta{color:#82ffeed1;font-size:12px}.result-card{display:flex;flex-direction:column;gap:14px}.result-stats{margin-top:4px}@media(max-width:480px){.app-shell{padding:0}.app-frame{width:100vw;height:100vh;max-width:none;max-height:none;border-radius:0}.screen,.overlay-panel{padding:14px}.hud-rail{width:min(78%,260px)}.skill-cluster{width:100%;justify-content:flex-end}.skill-button{min-width:102px}.menu-utility{grid-template-columns:1fr}.guide-card{grid-template-columns:48px 1fr}.guide-icon{width:48px;height:48px}}