/* Aulix's brighter game layer. Preserve the logo colors and the quiet page canvas. */
.site-header{background:#2563EB;border-bottom:3px solid #00F0FF;box-shadow:0 3px 14px #1746B414}
.brand strong{font-weight:800;color:#FFFFFF;letter-spacing:-1.3px}
.brand-sub{color:#FFFFFF}
.brand-symbol{border-color:#00F0FF;box-shadow:none}
.atlas-header-actions #browse-header{background:#FFFFFF;color:#1746B4;border-color:#FFFFFF}
.atlas-header-actions #progress-button{background:#00F0FF;color:#10324D;border-color:#00F0FF;font-weight:700}
.atlas-header-actions #browse-header:hover{background:#E4F6FF;border-color:#E4F6FF}
.atlas-header-actions #progress-button:hover{background:#9AF8FF;border-color:#9AF8FF}
.header-profile #account-button{background:#FFFFFF;border:2px solid #FFFFFF;color:#1746B4;box-shadow:0 2px 0 #1746B4}
.header-profile #account-button:hover{background:#E4F6FF;border-color:#B8F6FF}
.site-header .language{border-inline-start-color:#7EA7FF}
.site-header .language-toggle{background:#FFFFFF;border:1px solid #FFFFFF;border-radius:9px;padding:8px 10px}
.site-header .language-toggle:hover{background:#E4F6FF}
.site-header .language-icon,.site-header .voice-control>svg{stroke:#00F0FF}
.site-header .voice-control select{background:#FFFFFF;border-color:#FFFFFF;border-radius:9px}
.site-header .voice-control button{color:#FFFFFF;stroke:#FFFFFF}
.site-header .atlas-save-status{color:#FFFFFF}
.site-header button:focus-visible,.site-header select:focus-visible,.site-header a:focus-visible{outline:3px solid #00F0FF;outline-offset:3px}

/* A colorful map scene, with readable controls in front of it. */
.setup-screen{border:2px solid #C9E6EE;border-radius:26px;background:#DBF0F5;box-shadow:0 5px 0 #D9E9EF,0 14px 32px #1C65850C}
.setup-map path{fill:#64B8AF}
.setup-map .preview-context{fill:#A3CBD2}
.setup-map .preview-water{fill:#DBF0F5}
.setup-shade{background:linear-gradient(105deg,#F7FAFCEB 0%,#F7FAFCB8 43%,#F7FAFC35 79%,#F7FAFC1C 100%)}
.setup-content>.eyebrow{display:inline-flex;align-items:center;color:#1746B4;background:#DAF5FF;border:1px solid #73C9EF;border-radius:8px;padding:7px 10px;letter-spacing:1.5px}
.setup-content>h1{color:#153D62;font-weight:800;letter-spacing:-1.6px;line-height:1.12;margin-top:17px}
.setup-intro{color:#3C6886}
.field label{font-weight:750;color:#254E6F}
.atlas-map-choice{background:#FFFFFF;border:2px solid #2563EB;border-radius:13px;color:#1746B4;box-shadow:0 3px 0 #BED4FF;font-weight:650}
.atlas-map-choice:hover{background:#EAF4FF;border-color:#1746B4}
.atlas-choice-icon{color:#2563EB;font-weight:700}
.setup-fields .field:nth-child(2) label{color:#1D4ED8}
.setup-fields .field:nth-child(2) select{background:#E4F6FF;border:2px solid #73C9EF;color:#1D4ED8;border-radius:13px;box-shadow:0 3px 0 #B6EAF7;font-weight:650}
.setup-fields .field:nth-child(2) select:hover{border-color:#2563EB}
.setup-fields .field:nth-child(2) .field-icon{stroke:#2563EB}
.setup-fields .field:nth-child(2) .select-wrap:after{border-color:#2563EB}
.setup-fields select option{background:#FFFFFF;color:#244B65}
.mode-description{color:#536E86;line-height:1.6}

/* Solid color and a small raised edge make the next action easy to find. */
.play-button,.primary,.atlas-action-primary,.atlas-account-primary{background:#2563EB;border:2px solid #2563EB;border-radius:13px;color:#FFFFFF;box-shadow:0 4px 0 #1746B4;font-weight:750;transition:background .12s,box-shadow .12s,transform .12s}
.play-button:hover,.primary:hover,.atlas-action-primary:hover,.atlas-account-primary:hover{background:#2F6FED;border-color:#2F6FED;transform:translateY(-1px);box-shadow:0 5px 0 #1746B4}
.play-button:active,.primary:active,.atlas-action-primary:active,.atlas-account-primary:active{transform:translateY(3px);box-shadow:0 1px 0 #1746B4}
.play-button:disabled{background:#DFEAF7;border-color:#D7E4F2;color:#5A7592;box-shadow:0 3px 0 #C7D8E9;transform:none}
.secondary,.atlas-action-secondary{background:#FFFFFF;border:2px solid #C4D9F1;border-radius:12px;color:#315F91;box-shadow:0 3px 0 #DCE7F4;font-weight:700}
.secondary:hover,.atlas-action-secondary:hover{background:#EEF5FF;border-color:#A9C9F0}
.secondary:active,.atlas-action-secondary:active{transform:translateY(2px);box-shadow:0 1px 0 #DCE7F4}

/* Green is the reward color; the orange flame stays the streak cue. */
.atlas-progress{background:#F7FFF2;border:2px solid #CEE8B6;border-radius:18px;box-shadow:0 4px 0 #D8EBC6}
.atlas-progress-heading{color:#315C36;font-weight:750}
.atlas-progress-level{color:#25762E;background:#E1F5D3;border:1px solid #C5E6AF;border-radius:8px;padding:4px 7px;font-weight:750}
.atlas-progress-track{height:10px;background:#DDEED3;border:1px solid #D4E7C8}
.atlas-progress-track>span{background:#59BC33;box-shadow:inset 0 2px 0 #8BDA64}
.atlas-progress-xp{color:#267A35;font-weight:700}
.atlas-progress-xp>span{color:#50764B;font-weight:500}
.atlas-progress-stats{gap:8px}
.atlas-progress-stats>div{padding:10px 8px;border-radius:12px}
.atlas-progress-stats>div:nth-child(1){background:#FFE3AF}
.atlas-progress-stats>div:nth-child(2){background:#CEF0BC}
.atlas-progress-stats>div:nth-child(3){background:#C8EAFF}
.atlas-progress-stats>div:nth-child(1) strong{color:#B9580C}
.atlas-progress-stats>div:nth-child(2) strong{color:#287D34}
.atlas-progress-stats>div:nth-child(3) strong{color:#1746B4}
.atlas-progress-stats span{color:#506A7F}
.aulix-streak-icon{fill:#FF8A16;stroke:#EC650A}
.atlas-earned-xp{color:#2B8B30;font-weight:800}
.atlas-completion-mark{background:#E3F6D5;color:#378A2B;border:2px solid #B4DF92;box-shadow:0 3px 0 #D2E8BF}
.atlas-achievement.is-unlocked .atlas-achievement-symbol{color:#439229;background:#EDF9DC;border-color:#BBDFA0}

/* The playing surface stays calm; blue and cyan identify game controls. */
.game-screen{border:2px solid #D4E3F0;border-radius:22px}
.game-toolbar{background:#FAFCFF}
.game-mode-label{color:#1D4ED8}
.game-mode-label select{color:#1D4ED8;background:#E4F6FF;border:2px solid #73C9EF;border-radius:10px;font-weight:650}
.answer-form{border:2px solid #BBD5F2;border-radius:12px;background:#FFFFFF;box-shadow:0 2px 0 #E2ECF6}
.answer-form button{background:#EBF3FF;color:#2563EB}
.map-card{border:2px solid #C9DFEC;border-radius:16px}
.map-tools,.map-bottom{background:#F1F8FC}
.activity-card{background:#F0F9FF;border:2px solid #8FCBEE;border-top:4px solid #2563EB;border-radius:16px;box-shadow:0 3px 0 #D5EBFA}
.activity-card .eyebrow{color:#1D4ED8}
.activity-card h2{color:#254B6E}
.activity-card .place-heading{flex-wrap:wrap;gap:8px 10px}
.activity-card .place-heading>span{flex:0 1 auto;max-width:100%}
.feedback{border:1px solid #DAE7F4;background:#EFF5FC}
.feedback.good{background:#E9F8DD;color:#367B2D;border-color:#CBE6B6}
.feedback.bad{background:#FFF0F0;color:#B83E4B;border-color:#F4CFD4}
.score>div:nth-child(1){background:#E9F6DE}
.score>div:nth-child(1) strong{color:#3B802D}
.score>div:nth-child(2){background:#FFF0DE}
.score>div:nth-child(2) strong{color:#A85E18}
.sprint-clock{background:#E8F3FF;color:#2169B4;border:1px solid #C5DFFA}
.sprint-clock.is-ending{background:#FFF0D6;color:#A65C0B;border-color:#F3D5A4}
.hardcore-record{background:#FFF3E1;border:1px solid #F2D6A7;color:#9A5B18;border-radius:10px;padding:9px 11px}
.browser-map-row{border-width:2px;border-radius:13px}
.browser-map-row:hover{background:#F0F7FF;border-color:#9BC3FA}
#browser-levels [aria-pressed="true"]{box-shadow:0 3px 0 #1746B4}

@media(max-width:760px){
  .setup-screen{border-radius:22px}
  .setup-content>h1{font-size:35px;letter-spacing:-1.2px}
  .setup-content>.eyebrow{font-size:9px;padding:6px 8px}
  .atlas-progress-stats>div{padding:9px 8px}
  .setup-shade{background:linear-gradient(110deg,#F7FAFCEB,#F7FAFC90 63%,#F7FAFC42)}
}
@media(prefers-reduced-motion:reduce){
  .play-button,.primary,.secondary,.atlas-action-primary,.atlas-action-secondary,.atlas-account-primary{transition:none}
  .play-button:hover,.primary:hover,.atlas-action-primary:hover,.atlas-account-primary:hover{transform:none}
}

/* The profile ends the header; the photo stays stable while progress updates. */
.site-header{gap:14px}
.header-profile{display:flex;align-items:center;gap:8px;border-inline-start:1px solid #7EA7FF;padding-inline-start:16px;flex-shrink:0}
.header-profile .atlas-account-button{max-width:200px;min-height:44px;gap:9px;padding:6px 12px}
.atlas-user-avatar{display:grid;place-items:center;flex:0 0 30px;width:30px;height:30px;overflow:hidden;border-radius:50%;color:#2563EB;background:#EBF3FF}
.atlas-user-avatar img{display:block;width:100%;height:100%;object-fit:cover}
.atlas-user-avatar svg{width:21px;height:21px}
.atlas-user-avatar .atlas-avatar-initial{color:#FFFFFF;font-size:17px;font-weight:750;line-height:1;user-select:none}
.atlas-account-identity{align-items:center;margin-bottom:12px}
.atlas-account-identity>.atlas-user-avatar{flex-basis:68px;width:68px;height:68px;border:2px solid #D3E3FB}
.atlas-account-identity .atlas-user-avatar svg{width:34px;height:34px}
.atlas-account-identity .atlas-user-avatar .atlas-avatar-initial{font-size:34px}
.atlas-photo-controls{margin:0 0 22px}
.atlas-photo-controls>div{display:flex;flex-wrap:wrap;gap:8px}
.atlas-photo-controls button{color:#2563EB;background:#EFF6FF;border:1px solid #C9DDF8;border-radius:9px;padding:9px 12px;min-height:40px;font-size:.84rem}
.atlas-photo-controls button:hover{background:#E2EEFF;border-color:#92B9F0}
.atlas-photo-controls button:disabled{opacity:.55;cursor:wait}
.atlas-photo-controls [data-account-action="remove-photo"]{color:#A94650;background:#FFF3F3;border-color:#F0D6D9}
.atlas-photo-controls .atlas-account-help{margin:8px 0 0}
@media(max-width:1150px){.site-header{gap:10px}.header-profile{padding-inline-start:10px}.header-profile .atlas-account-button{max-width:155px;font-size:12px}.atlas-header-actions{margin-inline-start:auto}}
@media(max-width:760px){
 .site-header{display:grid;grid-template-columns:minmax(0,1fr) auto auto;height:auto;gap:10px;min-height:76px;padding:12px 14px}
 .site-header .brand{grid-column:1;grid-row:1}.atlas-header-actions{grid-column:2;grid-row:1;margin:0}
 .header-profile{grid-column:3;grid-row:1;padding-inline-start:10px}.header-profile .atlas-account-button{padding:5px;min-width:42px;justify-content:center}
 .header-profile .atlas-account-name{display:none}.header-profile .atlas-save-status{display:none}
 .site-header .header-note{grid-column:1/-1;grid-row:2;justify-content:flex-end;flex-wrap:nowrap;margin:0;gap:10px;width:100%}
 .site-header .language{margin:0;padding:0;border:0}.site-header .language-toggle{max-width:180px}
 .site-header .voice-control{margin:0}.site-header .voice-control select{max-width:150px}
}