:root{--navy:#071f2c;--panel:#102e3d;--panel-hi:#183b4a;--paper:#faf0d9;--muted:#a4bdc7;--gold:#f5bf62;--accent:#6cddc4;--danger:#ff9c88;--line:rgba(189,216,224,.2);--tbh:110px;--bbh:76px;--abyss:#071f2c;--abyss2:#102e3d;--cream:#faf0d9;--amber:#f5bf62;--amber2:#f5bf62;--teal:#6cddc4;--green:#6cddc4}
body{font-family:'Trebuchet MS',Arial,sans-serif!important;color:var(--paper)}
button,input,select{font:inherit}button,a,input,select{touch-action:manipulation}button{cursor:pointer}button:disabled{opacity:.5;cursor:wait}a{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.btn,.smbtn,.atlas-dialog button,.ex-btn,.cfgback{border:1px solid var(--line);border-radius:12px;min-height:44px;background:var(--panel-hi);color:var(--paper);padding:11px 17px;font-family:inherit!important;font-size:14px;font-weight:700;letter-spacing:0;text-transform:none;box-shadow:none;transition:background .15s,transform .15s}
.btn:hover,.smbtn:hover,.atlas-dialog button:hover,.ex-btn:hover{background:#244c5c;transform:translateY(-1px)}
.btn.amber,.smbtn:first-of-type,.primary,.ex-btn.primary,.atlas-dialog .primary{background:var(--gold);color:#102532;border-color:var(--gold)}
.btn.teal{background:#174f51;color:#baf7e6;border-color:#347b73}.btn.red{background:#563536;color:#ffd5cc}.hint,.muted,.sub{color:var(--muted);line-height:1.5}.label{font-family:inherit;font-size:12px;font-weight:700;letter-spacing:.09em;margin:18px 0 9px}.card,.box{border:1px solid var(--line);border-radius:16px;background:var(--panel);box-shadow:none}.card h3{font-family:inherit}
input,select{min-height:44px;background:#071e2a!important;color:var(--paper)!important;border:1px solid #3b5c69!important;border-radius:10px;padding:10px 12px}label{font-size:13px;display:grid;gap:7px;line-height:1.5}input{user-select:text!important}button img.atlas-icon{width:24px;height:24px;object-fit:contain;vertical-align:middle;margin-right:5px}.atlas-icon{display:inline-block;width:22px;height:22px;vertical-align:middle;object-fit:contain}.atlas-avatar{object-fit:contain;border-radius:50%;background:var(--panel-hi);flex:none}
#startScreen{padding:0;overflow:auto;background:var(--navy);z-index:55}#startScreen .startwrap{width:100%;height:100dvh;min-height:720px;aspect-ratio:auto;max-width:none;overflow:hidden;background:var(--navy)}
#startScreen .hero{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;opacity:.92;pointer-events:none}
#startScreen .startwrap:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,23,36,.92),rgba(3,23,36,.35) 45%,transparent 70%);pointer-events:none}
.atlas-brand{position:absolute;z-index:2;left:7%;top:12%;max-width:520px}.atlas-brand h1{font:900 clamp(54px,7vw,100px)/.95 'Trebuchet MS',sans-serif;letter-spacing:-.055em;margin:25px 0}.atlas-brand h1 span{display:block;color:var(--gold);font-size:.56em;letter-spacing:-.04em}.atlas-brand p:last-child{font-size:22px;line-height:1.35;color:#deebef}.eyebrow{font-size:11px;letter-spacing:.2em;font-weight:700;color:var(--accent)}.atlas-switch{font-size:13px;color:var(--muted);text-decoration:none}.atlas-switch:hover{color:white}
#startScreen .startmenu{z-index:3;left:7%;right:auto;top:auto;bottom:9%;width:330px;max-width:86%;padding:0;gap:9px;overflow:visible}#startScreen .smbtn{min-height:48px;font-size:15px;text-align:left;padding:12px 18px;display:block;width:100%;margin:0;background:rgba(16,46,61,.93)}#startScreen #newGameBtn,#startScreen #resumeBtn{background:var(--gold);color:#152832}
#startScreen .startcfg{position:fixed!important;inset:50% auto auto 50%!important;transform:translate(-50%,-50%)!important;width:min(540px,94vw);height:min(760px,92dvh);display:none!important;z-index:20;background:#0b2635;border:1px solid #516975;border-radius:20px;box-shadow:0 0 0 100vmax rgba(0,10,19,.75);overflow:hidden}
#startScreen .startcfg.open{display:flex!important;flex-direction:column}.cfghead{padding:17px 22px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}.cfghead h2{font-size:22px;margin:0}.cfgscroll{padding:5px 22px 22px;overflow:auto;flex:1;min-height:0}.modeopt{border-radius:12px;padding:12px;background:var(--panel);margin:10px 0}.modeopt .mt{font-family:inherit;text-transform:none}.modeopt .md{font-size:13px;line-height:1.45}.modeopt[data-mode=battle],.modeopt[data-mode=dominate]{display:none!important}#startName,#startPick,#difficultyPick{width:100%;font-size:15px}
#topbar{background:rgba(5,25,37,.96);border-bottom:1px solid var(--line);backdrop-filter:blur(12px);padding:12px 18px 10px}#topbar .tb-frame{aspect-ratio:auto;max-width:1040px;height:85px;display:grid;grid-template-columns:repeat(6,1fr);gap:8px;padding-top:33px}
#topbar .tb-bg,#topbar #tbAvatar,#topbar #tbAvatarEmoji,#modepill{display:none!important}.atlas-hud-name{position:absolute;top:0;left:0;font-size:15px;font-weight:900;letter-spacing:.08em}.atlas-hud-name b{font-weight:400;color:var(--gold);letter-spacing:0}#atlasSaveState{position:absolute;top:2px;right:0;font-size:11px;color:var(--muted)}
#topbar .tb-val,#topbar .tb-lvl{position:relative;inset:auto!important;transform:none!important;top:auto!important;width:auto!important;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-family:inherit!important;font-size:18px!important;text-shadow:none;line-height:1.1;border-left:1px solid var(--line);white-space:nowrap}
#topbar .tb-val:before{content:attr(data-label);font-size:10px;font-weight:400;color:var(--muted)}#topbar .tb-lvl{border:0}#topbar .tb-lvl .lvltxt{font-family:inherit;font-size:15px;text-shadow:none}#topbar .xpbar{position:static!important;width:65%;height:4px!important;display:block;margin:4px 0 0!important}
#bottombar{padding:0 10px env(safe-area-inset-bottom);background:rgba(5,25,37,.96);border-top:1px solid var(--line)}#bottombar .bb-frame{height:75px;max-width:720px;margin:auto;aspect-ratio:auto;display:grid;grid-template-columns:repeat(5,1fr);gap:4px}.bb-bg{display:none!important}#bottombar button{position:relative!important;inset:auto!important;transform:none!important;width:auto!important;height:auto!important;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-size:11px;padding:5px;color:var(--paper);border-radius:10px}#bottombar button .atlas-icon{width:29px;height:29px;margin:0}#bottombar button.active{background:#214455}#bottombar button:before,#bottombar button:after{display:none!important}
#gearBtn,#themeBtn,#findBtn,#flameBtn,#mgBtn{width:46px;height:46px;background:var(--panel);border:1px solid #42616d;box-shadow:0 3px 10px #0003;border-radius:14px;right:14px}#gearBtn{bottom:91px}#themeBtn{bottom:146px}#findBtn{bottom:201px}#flameBtn{bottom:256px}#mgBtn{bottom:311px}.hiddenUntilIntro{display:none!important}
#sheet{bottom:78px;border:1px solid #42616d;background:var(--navy);border-radius:20px 20px 0 0;max-height:calc(100dvh - 190px);box-shadow:0 -8px 30px #0005}#sheet .x,.screenclose{min-width:44px;min-height:44px}#eventBanner{top:118px;max-width:calc(100vw - 24px);border-radius:12px;background:#174d51}#tutorialCard{border-radius:18px;border:1px solid #598d94;background:var(--panel);max-width:490px}#tutorialText{font-family:inherit;font-size:15px;line-height:1.5}#tutorialOverlay{bottom:90px!important}#toasts{top:122px}#quizModal .box,#seaModal .box{background:var(--navy);border:1px solid #456573;border-radius:20px}#quizTitle{font-family:inherit}#qOpts .opt{min-height:50px;border-radius:12px;font:600 15px/1.4 inherit}.screen{background:rgba(6,25,37,.98)}#briefModal{max-width:none;padding:30px 20px;overflow:auto}
.atlas-dialog{width:min(740px,94vw);max-height:90dvh;padding:0;color:var(--paper);background:var(--navy);border:1px solid #486775;border-radius:20px;box-shadow:0 24px 100px #0008;font:15px/1.55 'Trebuchet MS',sans-serif;user-select:text}.atlas-dialog::backdrop{background:rgba(0,14,24,.75);backdrop-filter:blur(6px)}.atlas-dialog header{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;padding:16px 24px;background:var(--navy);border-bottom:1px solid var(--line)}.atlas-dialog h2{font-size:23px;margin:0}.atlas-close{font-size:24px!important;min-width:44px;padding:0!important}.atlas-dialog-body{padding:12px 24px 25px}.atlas-dialog p{color:var(--muted)}.atlas-dialog form{display:grid;gap:10px;margin:20px 0}.atlas-dialog [hidden],body [hidden]{display:none!important}.atlas-filters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:18px 0}.atlas-dialog select,.atlas-dialog input{width:100%;min-width:0}.atlas-ranking{list-style:none;padding:0}.atlas-ranking li{display:flex;align-items:center;gap:12px;padding:14px 0;border-bottom:1px solid var(--line)}.rank-number{width:22px;color:var(--gold);font-weight:700}.rank-name{flex:1;overflow-wrap:anywhere}.rank-name small{display:block;color:var(--muted);font-size:11px}.atlas-group{display:flex;justify-content:space-between;gap:14px;border-bottom:1px solid var(--line);padding:12px 0}.atlas-group code{color:var(--gold);user-select:all}.atlas-dialog button+button{margin-left:7px}
/* Explorer: a separate learning game with the same visual language. */
body.explorer{margin:0;background:var(--navy);overflow:hidden;user-select:none}.ex-home{position:fixed;inset:0;overflow:auto;background:var(--navy)}.ex-home-hero{min-height:660px;height:100dvh;background:linear-gradient(90deg,rgba(3,23,36,.85),transparent 70%),url('/static/img/atlas-explorer-hero.webp') center/cover;position:relative}.ex-home-content{position:relative;padding:8vh 7vw;max-width:700px}.ex-home h1{font-size:clamp(60px,8vw,112px);letter-spacing:-.07em;line-height:.88;margin:42px 0 28px}.ex-home h1 span{display:block;color:var(--gold);font-size:.55em;letter-spacing:-.04em}.ex-home .tagline{font-size:23px;line-height:1.4;max-width:340px;margin-bottom:30px;color:#e2eef0}.ex-home-menu{display:grid;gap:10px;width:320px;max-width:86vw}.ex-home-menu .ex-btn{text-align:left;min-height:50px;font-size:16px;background:rgba(16,46,61,.94)}.ex-home-menu .primary{background:var(--gold)}.ex-footnote{margin-top:23px;color:var(--muted);font-size:12px}
.ex-header{position:fixed;inset:0 0 auto;z-index:4;background:rgba(5,25,37,.96);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);padding:13px 22px;display:flex;align-items:center;justify-content:space-between;gap:15px}.ex-logo{font-size:20px;letter-spacing:.07em;font-weight:900;white-space:nowrap}.ex-logo span{display:block;font-size:10px;letter-spacing:.18em;color:var(--gold);font-weight:600}.ex-stats{display:flex;gap:28px}.ex-stats div{font-size:19px;font-weight:700}.ex-stats small{display:block;color:var(--muted);font-size:10px;font-weight:400;margin-bottom:3px}.ex-stats progress{width:110px;height:5px;display:block;accent-color:var(--accent)}.ex-header-actions{display:flex;gap:8px}.ex-header button{min-width:44px}
#explorerCanvas{position:fixed;inset:0;width:100%;height:100%;touch-action:none}.ex-map-controls{position:fixed;right:20px;bottom:100px;z-index:3;display:grid;gap:8px}.ex-map-controls button{width:46px;height:46px;border:1px solid #5b7a87;background:var(--navy);border-radius:13px;color:var(--paper);font-size:22px}.ex-toolbar{position:fixed;z-index:4;bottom:15px;left:50%;transform:translateX(-50%);display:flex;gap:5px;background:rgba(5,25,37,.96);border:1px solid #365c6c;border-radius:18px;padding:7px;box-shadow:0 8px 24px #0004}.ex-toolbar button{min-width:88px;display:grid;justify-items:center;gap:4px;background:transparent;border:0;border-radius:12px;color:var(--muted);padding:8px;font-size:12px}.ex-toolbar button.active{color:var(--paper);background:#214856}.ex-toolbar img{width:26px;height:26px}.ex-callout{position:fixed;z-index:3;left:20px;top:102px;max-width:360px;padding:14px 17px;background:rgba(8,34,47,.96);border:1px solid #426f7b;border-radius:15px;color:var(--paper);font-size:14px;line-height:1.5}.ex-callout strong{display:block;color:var(--gold);font-size:12px;letter-spacing:.05em}.ex-callout button{margin-top:10px}
.ex-card{position:fixed;z-index:6;left:24px;top:110px;width:340px;max-height:calc(100dvh - 220px);overflow:auto;padding:22px;background:rgba(8,33,46,.98);border:1px solid #527a84;border-radius:20px;box-shadow:0 16px 40px #0005}.ex-card h2{font-size:26px;margin:8px 0 14px;letter-spacing:-.03em}.ex-card p{color:var(--muted);font-size:14px;line-height:1.5}.ex-card .flag{width:72px;max-height:50px;object-fit:contain}.ex-card .ex-btn{width:100%;margin:5px 0}.ex-card .close-card{float:right;border:0;background:none;color:var(--muted);font-size:24px;min-width:40px;min-height:40px}.ex-tag{color:var(--accent);font-size:11px;letter-spacing:.1em;font-weight:700}.ex-question{position:fixed;z-index:8;top:105px;left:50%;transform:translateX(-50%);width:min(500px,92vw);padding:22px;background:rgba(7,30,43,.98);border:1px solid #5c8b95;border-radius:20px;box-shadow:0 15px 55px #0005}.ex-question.map-question{top:105px;left:22px;transform:none;width:min(350px,90vw)}.ex-question h2{font-size:23px;line-height:1.25;margin:8px 0 15px}.ex-question .flag{width:100px;height:65px;object-fit:contain;display:block;margin:15px auto}.ex-options{display:grid;gap:9px}.ex-options button{text-align:left;min-height:48px}.ex-question progress{width:100%;height:6px;accent-color:var(--gold)}.ex-question small{color:var(--muted)}.ex-feedback{color:var(--accent);line-height:1.5;padding-top:12px}.ex-feedback b{font-size:20px}.ex-sprint-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.ex-sprint-grid button{display:grid;gap:12px;padding:16px 10px;justify-items:center}.ex-sprint-grid img{width:45px;height:45px}.ex-score-total{font-size:58px;font-weight:900;color:var(--gold);margin:15px 0}.ex-result-stats{display:flex;gap:24px;color:var(--muted)}.ex-result-stats b{display:block;font-size:24px;color:var(--paper)}.ex-toast{position:fixed;z-index:100;left:50%;bottom:100px;transform:translateX(-50%);padding:13px 20px;max-width:90vw;border:1px solid #6da699;background:#123b40;color:white;border-radius:14px;box-shadow:0 10px 30px #0004}
@media(min-width:1000px){#sheet{width:460px;left:20px;right:auto;border-radius:20px;bottom:95px}.atlas-brand{top:10%}#startScreen .startmenu{bottom:8%;width:340px}.ex-home-content{padding-top:7vh}}
@media(max-width:700px){#startScreen .startwrap{min-height:760px}.atlas-brand{left:7%;top:6%;max-width:90%}.atlas-brand h1{font-size:65px;margin:25px 0 18px}.atlas-brand p:last-child{font-size:19px}#startScreen .hero{object-position:64% center;opacity:.64}#startScreen .startwrap:after{background:linear-gradient(0deg,#061f2eee 0%,#061f2e44 80%)}#startScreen .startmenu{left:7%;bottom:6%;width:86%;gap:8px}#startScreen .smbtn{min-height:46px}#topbar{padding:10px 8px}#topbar .tb-frame{height:85px;gap:0}#topbar .tb-val{font-size:15px!important}#topbar .tb-val:before{font-size:9px}.atlas-hud-name{font-size:13px}#atlasSaveState{font-size:9px}.cfgscroll{padding:8px 16px 20px}.atlas-dialog header{padding:14px 16px}.atlas-dialog-body{padding:8px 16px 22px}.atlas-dialog h2{font-size:20px}.atlas-group{display:grid;gap:2px}.ex-home-hero{min-height:760px;background-position:62% center;background-image:linear-gradient(90deg,rgba(3,23,36,.88),rgba(3,23,36,.28)),url('/static/img/atlas-explorer-hero.webp')}.ex-home-content{padding:6vh 7vw}.ex-home h1{font-size:79px;margin:34px 0 24px}.ex-home-menu{width:100%}.ex-home .tagline{font-size:20px;max-width:290px}.ex-header{padding:12px;flex-wrap:wrap;gap:10px}.ex-logo{font-size:17px}.ex-header-actions .ex-btn{padding:9px 11px}.ex-stats{order:3;width:100%;justify-content:space-between;gap:12px}.ex-stats div{font-size:16px}.ex-stats progress{width:90px}.ex-callout{top:138px;left:12px;max-width:calc(100vw - 80px);font-size:12px}.ex-card{top:auto;bottom:91px;left:10px;right:10px;width:auto;max-height:55dvh;padding:17px}.ex-card h2{font-size:23px}.ex-question{top:138px;padding:18px}.ex-question.map-question{top:138px;left:12px;width:calc(100vw - 78px);padding:13px}.ex-question h2{font-size:20px}.ex-toolbar{bottom:max(10px,env(safe-area-inset-bottom));max-width:96vw;padding:5px}.ex-toolbar button{min-width:60px;padding:7px 8px;font-size:10px}.ex-toolbar img{width:24px;height:24px}.ex-map-controls{right:10px;bottom:98px;gap:6px}.ex-map-controls button{width:43px;height:43px}.ex-sprint-grid{grid-template-columns:repeat(2,1fr)}}
.ex-question{max-height:calc(100dvh - 210px);overflow:auto}.ex-question .ex-options{grid-template-columns:repeat(2,minmax(0,1fr))}.ex-card .flag,.ex-question .flag{background:#eee;border:1px solid #b8c6cd;border-radius:3px;image-rendering:auto}.ex-question.map-options{max-width:340px}
@media(max-width:700px){.ex-question.map-options{top:auto;bottom:90px;max-height:47dvh;left:12px;width:calc(100vw - 24px);max-width:none}.ex-question .ex-options button{font-size:13px;padding:10px}.ex-feedback p{margin:8px 0}.ex-question h2{margin-bottom:10px}.ex-question{max-height:calc(100dvh - 238px)}}
#topbar,#bottombar{width:auto!important;left:0!important;right:0!important;max-width:none!important}#sheet:not(.open){visibility:hidden;pointer-events:none;transform:translateY(calc(100% + 160px))!important}#gearBtn,#themeBtn,#findBtn,#flameBtn,#mgBtn{right:16px!important;left:auto!important}#sheet{max-width:none!important}
@media(min-width:1000px){#sheet{left:20px!important;right:auto!important;width:460px!important}}
@media(max-width:999px){#sheet{left:0!important;right:0!important;width:auto!important}}
#startScreen .startmenu{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:390px;gap:10px}#startScreen #resumeBtn,#startScreen #newGameBtn{grid-column:1/-1}body.has-save #startScreen #newGameBtn{background:rgba(16,46,61,.95);color:var(--paper);box-shadow:none}#startScreen .smbtn{font-size:14px;min-height:49px}#startScreen .startmenu .atlas-icon{width:21px;height:21px}
@media(max-width:700px){#startScreen .startmenu{width:86%;bottom:7%}#startScreen .smbtn{font-size:13px;padding:10px 12px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}