:root{--gold:#ffc928;--ink:#02070b;--panel:#08131d;--line:#31536b;--blue:#58c4ff;--green:#63e681;--red:#ff6d6d;--text:#f3f7fb;--muted:#b7c9d7}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#02070b;color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}body{overflow-x:hidden}.game-shell{min-height:100vh;background:radial-gradient(circle at 50% -15%,#14314a 0,#07111a 40%,#02070b 78%)}.game-topbar{height:72px;padding:0 28px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;border-bottom:1px solid #1f3444;background:rgba(2,7,11,.94);position:sticky;top:0;z-index:30}.brand{font-weight:1000;color:#fff;text-decoration:none;letter-spacing:.02em}.brand span{color:var(--gold)}.level-title{text-align:center;display:grid;gap:2px}.level-title strong{color:var(--gold);font-size:.86rem;letter-spacing:.12em}.level-title span{color:#bdd1df;font-size:.72rem;letter-spacing:.08em}.exit-link{justify-self:end;color:#dceaf3;text-decoration:none;font-weight:900;font-size:.8rem;padding:10px 14px;border:1px solid #355166;border-radius:10px}.game-frame{position:relative;width:min(100%,1920px);margin:0 auto;aspect-ratio:16/9;min-height:560px;overflow:hidden;background:#0b2231}.game-frame canvas{width:100%;height:100%;display:block;background:#8fc5f0}.hud{position:absolute;z-index:10;top:20px;padding:14px 16px;border:1px solid rgba(164,204,230,.38);border-radius:14px;background:rgba(3,12,19,.82);backdrop-filter:blur(12px);box-shadow:0 16px 40px rgba(0,0,0,.22)}.hud-left{left:20px;width:240px}.hud-right{right:20px;width:220px}.hud-label{font-size:.7rem;color:var(--gold);font-weight:1000;letter-spacing:.13em}.hud-value{font-size:2rem;font-weight:1000;margin:2px 0 8px}.hud-small{color:#bfd0dc;font-size:.73rem;line-height:1.35;margin-top:7px}.meter{height:8px;border-radius:99px;background:#142635;overflow:hidden;border:1px solid #29465a}.meter span{display:block;height:100%;width:0;background:linear-gradient(90deg,#e7ad11,#ffe56a);transition:width .35s ease}.meter.health span{width:100%;background:linear-gradient(90deg,#1eae4f,#74ec8e)}.hud-row{display:flex;justify-content:space-between;gap:12px;margin:5px 0;font-size:.78rem}.hud-row span{color:#9db6c6;font-weight:800}.hud-row strong{color:#fff}.mission-banner{position:absolute;z-index:9;left:50%;top:24px;transform:translateX(-50%);max-width:640px;text-align:center;padding:12px 22px;border-radius:13px;background:rgba(3,12,19,.76);border:1px solid rgba(255,201,40,.34);backdrop-filter:blur(10px);transition:opacity .5s ease,transform .5s ease}.mission-banner strong{display:block;color:var(--gold);font-size:.75rem;letter-spacing:.1em}.mission-banner span{display:block;margin-top:3px;color:#e4edf4;font-size:.78rem}.mission-banner.hide{opacity:0;transform:translate(-50%,-12px);pointer-events:none}.control-hint{position:absolute;z-index:9;left:50%;bottom:16px;transform:translateX(-50%);padding:10px 18px;background:rgba(3,12,19,.78);border:1px solid #39566c;border-radius:999px;color:#cbdbe6;font-size:.78rem;white-space:nowrap;backdrop-filter:blur(8px)}.control-hint strong{color:#fff}.modal{position:absolute;z-index:50;inset:0;display:grid;place-items:center;padding:28px;background:rgba(1,5,8,.68);backdrop-filter:blur(6px)}.hidden{display:none!important}.modal-card{width:min(760px,94vw);padding:26px;border:1px solid #3a5f78;border-radius:22px;background:linear-gradient(145deg,#091924,#07121a);box-shadow:0 35px 90px rgba(0,0,0,.58)}.question-kicker{font-size:.72rem;color:var(--gold);font-weight:1000;letter-spacing:.12em}.modal-card h2{font-size:2rem;margin:.25rem 0 .7rem}.passage{padding:17px;border-left:4px solid var(--blue);background:#06131d;border-radius:9px;color:#e8f0f5;line-height:1.65}.prompt{font-weight:900;font-size:1.08rem;line-height:1.45}.choices{display:grid;gap:9px;margin-top:14px}.choice{padding:13px 15px;border:1px solid #35566c;border-radius:11px;background:#0c1d29;color:#eaf3f8;text-align:left;font:inherit;font-weight:760;transition:.12s ease}.choice.selected{border-color:var(--gold);background:#2d2507;box-shadow:0 0 0 2px rgba(255,201,40,.13)}.question-help{text-align:center;margin-top:14px;color:#91a9b8;font-size:.73rem}.feedback-card{text-align:center}.feedback-icon{width:70px;height:70px;margin:0 auto 8px;display:grid;place-items:center;border-radius:50%;background:#0f4122;border:2px solid #57e27a;color:#b8ffc8;font-size:2.3rem;font-weight:1000}.feedback-card.wrong .feedback-icon{background:#4a1818;border-color:#ff7777;color:#ffd0d0}.feedback-xp{font-size:2.2rem;font-weight:1000;color:var(--gold);margin:10px 0 18px}.modal-card button{border:0;border-radius:12px;padding:13px 18px;background:var(--gold);color:#071018;font-weight:1000;cursor:pointer}.complete-card{text-align:center}.crest{width:76px;height:76px;margin:0 auto 10px;display:grid;place-items:center;border-radius:50%;border:3px solid var(--gold);color:var(--gold);font-weight:1000;font-size:1.2rem}.completion-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:20px 0}.completion-grid div{padding:15px;border:1px solid #304e62;border-radius:12px;background:#07131c}.completion-grid span{display:block;color:#9ab3c2;font-size:.7rem;font-weight:900}.completion-grid strong{font-size:1.4rem;color:#fff}.next-level{color:#8cd2ff}.game-footer{display:flex;justify-content:space-between;gap:20px;padding:15px 28px;color:#8097a6;font-size:.73rem;border-top:1px solid #182a37;background:#02070b}@media(max-width:900px){.game-topbar{grid-template-columns:1fr auto;height:auto;padding:12px 15px}.level-title{display:none}.game-frame{min-height:72vh;aspect-ratio:auto}.hud{top:10px;padding:10px}.hud-left{left:10px;width:180px}.hud-right{right:10px;width:170px}.mission-banner{top:105px;width:90%}.control-hint{font-size:.66rem;bottom:10px}.game-footer{display:none}}@media(max-width:640px){.hud-right{display:none}.control-hint{white-space:normal;width:92%;text-align:center}.modal{padding:12px}.modal-card{padding:18px}.completion-grid{grid-template-columns:1fr}}

/* Character roster - Level One 2030.2 */
.character-roster{width:min(100%,1920px);margin:0 auto;padding:24px 28px 26px;background:linear-gradient(180deg,#07111a,#03090e);border-bottom:1px solid #1e3546}.roster-heading{display:flex;align-items:end;justify-content:space-between;gap:28px;margin-bottom:18px}.roster-heading h2{margin:.2rem 0 0;font-size:clamp(1.55rem,2.5vw,2.35rem);letter-spacing:-.03em}.roster-heading p{max-width:720px;margin:0;color:#a9bfcd;line-height:1.5}.roster-kicker{color:var(--gold);font-size:.72rem;font-weight:1000;letter-spacing:.14em}.roster-grid{display:grid;grid-template-columns:repeat(8,minmax(135px,1fr));gap:12px}.character-card{overflow:hidden;border:1px solid #2d4b60;border-radius:16px;background:#08141e;box-shadow:0 12px 28px rgba(0,0,0,.2)}.character-card img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover;object-position:center}.character-card div{display:grid;gap:3px;padding:11px 12px 13px}.character-card strong{color:#fff;font-size:.83rem;letter-spacing:.04em}.character-card span{color:#9eb6c5;font-size:.68rem;line-height:1.35}.hero-card{border-color:#3e6f91}.artifact-card{border-color:#579bd0}.princess-card{border-color:#b89a42}.villain-card{border-color:#8a4747}.enemy-card{border-color:#5f4939}.character-card:hover{transform:translateY(-2px);transition:.16s ease;border-color:var(--gold)}@media(max-width:1200px){.roster-grid{grid-template-columns:repeat(4,1fr)}}@media(max-width:760px){.character-roster{padding:18px 14px}.roster-heading{display:block}.roster-heading p{margin-top:8px}.roster-grid{grid-template-columns:repeat(2,1fr)}}

/* Quest Social - Alias Friends + Chat 2030.3 */
.quest-social{width:min(100%,1920px);margin:0 auto;padding:28px;background:linear-gradient(180deg,#06111a,#03080d);border-top:1px solid #1d3444}.social-heading{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:18px}.social-heading h2{margin:.2rem 0 .35rem;font-size:clamp(1.55rem,2.4vw,2.25rem)}.social-heading p{margin:0;color:#a9bfcd;max-width:760px;line-height:1.5}.social-safety{padding:9px 12px;border:1px solid #28516b;border-radius:999px;color:#8fd5ff;background:#082033;font-size:.7rem;font-weight:1000;letter-spacing:.06em;white-space:nowrap}.social-locked{display:flex;align-items:center;gap:15px;flex-wrap:wrap;padding:18px;border:1px solid #34546a;border-radius:16px;background:#081722}.social-locked strong{color:#fff}.social-locked span{color:#9fb6c4;flex:1;min-width:260px}.social-locked a{padding:11px 15px;border-radius:10px;background:var(--gold);color:#061019;text-decoration:none;font-weight:1000}.social-app{display:grid;grid-template-columns:minmax(280px,360px) 1fr;gap:18px}.social-sidebar,.chat-panel{border:1px solid #2b4b60;border-radius:18px;background:#07131d;overflow:hidden}.social-sidebar{padding:16px;display:grid;gap:16px;align-content:start}.alias-card,.friend-search,.request-panel,.friends-panel{padding:14px;border:1px solid #243f51;border-radius:13px;background:#091a26}.social-sidebar label,.social-label{display:block;margin-bottom:8px;color:var(--gold);font-size:.68rem;font-weight:1000;letter-spacing:.1em}.alias-row{display:grid;grid-template-columns:1fr auto;gap:8px}.alias-row input,.chat-compose input{width:100%;min-width:0;border:1px solid #35576c;border-radius:10px;background:#041018;color:#fff;padding:11px 12px;font:inherit;outline:none}.alias-row input:focus,.chat-compose input:focus{border-color:#58c4ff;box-shadow:0 0 0 2px rgba(88,196,255,.12)}.alias-row button,.chat-compose button,.friend-action{border:0;border-radius:9px;background:#123149;color:#eaf6ff;padding:10px 12px;font-weight:900;cursor:pointer}.alias-row button:hover,.friend-action:hover{background:#19425f}.alias-card small{display:block;margin-top:9px;color:#7894a6;line-height:1.4}.friend-list{display:grid;gap:8px}.empty-state{color:#718a9a;font-size:.82rem}.friend-item,.request-item{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 10px;border:1px solid #29465a;border-radius:10px;background:#06131c}.friend-name{display:flex;align-items:center;gap:8px;min-width:0}.online-dot{width:8px;height:8px;border-radius:50%;background:#4ce673;box-shadow:0 0 0 3px rgba(76,230,115,.12)}.offline-dot{width:8px;height:8px;border-radius:50%;background:#526673}.friend-name strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.86rem}.request-actions{display:flex;gap:5px;flex-wrap:wrap;justify-content:end}.friend-action{padding:7px 9px;font-size:.68rem}.friend-action.accept{background:#115b2c}.friend-action.deny{background:#593a16}.friend-action.block{background:#5b1c24}.chat-panel{display:grid;grid-template-rows:auto minmax(300px,460px) auto auto auto;min-width:0}.chat-header{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:16px 18px;border-bottom:1px solid #243d4f;background:#081824}.chat-header .social-label{margin:0 0 3px}.chat-header strong{font-size:1.05rem}.social-status{color:#81cfff;font-size:.72rem}.chat-messages{padding:16px;overflow-y:auto;display:flex;flex-direction:column;gap:9px;background:linear-gradient(180deg,#06131d,#040d14)}.chat-empty{margin:auto;color:#728a99;text-align:center}.chat-bubble{max-width:min(76%,650px);padding:10px 12px;border-radius:13px;border:1px solid #294b62;background:#0b2130}.chat-bubble.mine{align-self:flex-end;background:#312a0b;border-color:#6f5d1a}.chat-bubble.theirs{align-self:flex-start}.chat-meta{display:flex;justify-content:space-between;gap:14px;margin-bottom:4px;color:#8fa8b8;font-size:.64rem}.chat-body{color:#eef6fb;line-height:1.45;overflow-wrap:anywhere}.emoji-strip{display:flex;align-items:center;gap:7px;padding:10px 14px;border-top:1px solid #1f3545;background:#07141e}.emoji-button{border:1px solid #34566c;border-radius:9px;background:#0b2231;padding:7px 9px;font-size:1.12rem;cursor:pointer}.emoji-strip span{color:#7892a3;font-size:.72rem}.chat-compose{display:grid;grid-template-columns:1fr auto;gap:8px;padding:12px 14px;background:#07141e}.chat-compose button{background:var(--gold);color:#071018}.chat-compose button:disabled,.chat-compose input:disabled{opacity:.45;cursor:not-allowed}.chat-note{padding:0 14px 14px;color:#718a99;font-size:.68rem;background:#07141e}@media(max-width:900px){.social-heading{display:block}.social-safety{display:inline-block;margin-top:12px}.social-app{grid-template-columns:1fr}.chat-panel{grid-template-rows:auto 340px auto auto auto}}@media(max-width:560px){.quest-social{padding:18px 12px}.alias-row,.chat-compose{grid-template-columns:1fr}.request-item{align-items:flex-start;flex-direction:column}.request-actions{justify-content:flex-start}}
