/* Presentation layer only. World canvas, collision and scientific models are untouched. */
@font-face{font-family:'Press Start 2P';src:url('assets/fonts/press-start-2p.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:'Pixelify Sans';src:url('assets/fonts/pixelify-regular.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:'Pixelify Sans';src:url('assets/fonts/pixelify-bold.ttf') format('truetype');font-style:normal;font-weight:500 900;font-display:swap}
:root{--ink:#183a50;--cream:#f2e4ba;--green:#317a65;--lime:#f2c75a;--line:#8e9c7d;--gold:#f2c75a;--blue:#183a50;--terracotta:#c77a47;--aqua:#9bcfdf;--pixel-border:0 0 0 2px #183a50,0 0 0 5px #f2e4ba,0 0 0 7px #183a50,4px 7px 0 7px #0c2838}
body{background-color:#102e40;background-image:repeating-linear-gradient(0deg,transparent 0 7px,#183a5040 7px 8px);font-family:'Pixelify Sans',monospace;font-size:19px;color:var(--ink);min-height:100vh;padding:0 22px 20px}
button,a,input,textarea,select{font-family:'Pixelify Sans',monospace}button{position:relative;font-size:17px;font-weight:400;letter-spacing:.1px;color:var(--ink);background:var(--cream);border:2px solid var(--blue);padding:9px 15px;box-shadow:inset 2px 2px 0 #fff3d2,inset -2px -2px 0 #c5ac7f,2px 3px 0 #0c2838;border-radius:0;transition:background-color 80ms steps(2),transform 80ms steps(2);isolation:isolate}button:hover:not(:disabled),button:focus-visible:not(:disabled){background:#f7db85;color:var(--blue);outline:2px solid var(--gold);outline-offset:2px;transform:translateY(-1px)}button:active:not(:disabled){transform:translate(1px,2px);box-shadow:inset 2px 2px 0 #baa179,1px 1px 0 #0c2838}button:disabled{opacity:.5;filter:saturate(.5);box-shadow:none}button::before{content:'';position:absolute;left:4px;top:calc(50% - 4px);width:0;height:0;border-top:4px solid transparent;border-bottom:4px solid transparent;border-left:6px solid var(--blue);opacity:0;pointer-events:none}button:hover:not(:disabled)::before,button:focus-visible:not(:disabled)::before{opacity:1;animation:selectionArrow .65s steps(2,end) infinite}.primary{background:var(--gold);color:var(--blue);border-color:var(--blue);font-weight:700}.primary:hover{background:#ffe3a1}header{max-width:1280px;margin:0 auto;height:70px;border:0;padding:0 12px;gap:12px;color:var(--cream)}#logo{font-family:'Press Start 2P',monospace;font-size:11px;letter-spacing:0;color:var(--gold);line-height:1.7;text-shadow:2px 2px 0 #081d2d}#logo span{color:var(--gold)}.brand-gem{font-family:'Pixelify Sans';font-size:18px}header>div{gap:8px}header button{border:2px solid #8cad9a;background:#183a50;color:var(--cream);font-size:16px;padding:5px 12px;box-shadow:inset 1px 1px 0 #557d7d,2px 2px 0 #092536}header button::before{border-left-color:var(--gold)}main{max-width:1280px}#home{position:relative;isolation:isolate;min-height:0;height:min(76vw,800px);min-height:660px;margin:7px auto 28px;padding:54px 20px 20px;overflow:hidden;border:4px solid var(--blue);box-shadow:0 0 0 3px var(--gold),0 0 0 7px var(--blue),0 0 0 9px #729c8d,7px 11px 0 9px #061c2c;text-align:center;background:#183a50}#home>.title-kicker{position:relative;z-index:2;width:auto;font-size:16px;letter-spacing:2px;margin:4px 0 24px;color:#c8dfd7;text-shadow:2px 2px 0 #102f42}#home h1{position:relative;z-index:2;font-family:'Press Start 2P',monospace;font-size:clamp(28px,4.5vw,59px);font-weight:400;line-height:1.5;letter-spacing:-1px;margin:0;color:var(--gold);-webkit-text-stroke:2px var(--blue);paint-order:stroke fill;text-shadow:3px 0 0 var(--blue),-3px 0 0 var(--blue),0 -3px 0 var(--blue),0 3px 0 var(--blue),4px 4px 0 var(--blue),6px 7px 0 #092739;animation:titleShimmer 6s steps(8,end) infinite}.title-subtitle{position:relative;z-index:2;font-family:'Pixelify Sans',monospace;color:var(--cream);font-size:30px;font-weight:700;letter-spacing:5px;margin:8px 0 0;text-shadow:2px 2px 0 #12334a,3px 3px 0 #12334a}#hero{z-index:-2;position:absolute;inset:0;width:100%;height:100%;margin:0;border:0;box-shadow:none;background:#183a50 url('assets/jaguarlandia-title.png') center center/cover no-repeat;overflow:hidden;image-rendering:pixelated}#heroCanvas,#hero .location,#hero .hero-note{display:none}#hero::after{content:'';position:absolute;inset:0;box-shadow:inset 0 0 0 5px #071e3255;pointer-events:none}#hero::before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(0deg,#0b2b3d08 0px,#0b2b3d08 1px,transparent 1px,transparent 4px);pointer-events:none}.ambient-mist{position:absolute;left:34%;top:51%;width:34%;height:23%;background:radial-gradient(ellipse,#9bcfdf35 0%,transparent 68%);opacity:.6;animation:valleyMist 10s steps(24,end) infinite alternate;pointer-events:none}.ambient-motes{position:absolute;inset:10%;background:radial-gradient(circle at 12% 74%,#f2c75a 0 1px,transparent 2px),radial-gradient(circle at 28% 60%,#f2e4ba 0 1px,transparent 2px),radial-gradient(circle at 78% 68%,#f2c75a 0 2px,transparent 3px),radial-gradient(circle at 90% 36%,#f2e4ba 0 1px,transparent 2px),radial-gradient(circle at 62% 80%,#f2c75a 0 1px,transparent 2px);animation:fireflyDrift 7s steps(16,end) infinite alternate;pointer-events:none}#home .actions{position:absolute;z-index:3;bottom:100px;left:50%;transform:translateX(-50%);width:310px;max-width:82%;display:flex;flex-direction:column;gap:3px;padding:13px 18px;margin:0;background:var(--cream);border:3px solid var(--blue);box-shadow:inset 0 0 0 2px #fff4d0,0 0 0 2px var(--cream),0 0 0 5px var(--blue),4px 7px 0 5px #08283a99}#home .actions::before{content:'';position:absolute;left:8px;top:8px;right:8px;bottom:8px;border:1px solid #c2ab7b;pointer-events:none}#home .actions button{background:none;box-shadow:none;border:0;color:var(--ink);text-align:left;font-family:'Pixelify Sans';font-size:22px;font-weight:700;padding:8px 12px 8px 27px}#home .actions button b{display:none}#home .actions button:hover,#home .actions button:focus-visible{outline:0;background:#e4cd93;transform:none}#home .actions button::before{left:12px;border-left-width:7px;border-top-width:5px;border-bottom-width:5px;top:calc(50% - 5px)}#home .home-bottom{position:absolute;left:12px;right:12px;bottom:43px;margin:0;gap:4px;color:var(--cream);font-size:13px;letter-spacing:1px;line-height:1.3;text-shadow:2px 2px 0 var(--blue)}#home .home-bottom span+span{opacity:.85;font-size:12px}#home .under{z-index:2;position:absolute;left:14px;right:14px;bottom:13px;display:flex;justify-content:space-between;padding:0;margin:0;border:0;color:#e0e8ca;font-size:12px;letter-spacing:1px;text-shadow:2px 2px 0 var(--blue)}
/* Shared HUD and parchment menu panels. The playable canvas is not filtered or repainted. */
#game{padding:10px 8px 0}.game-top{color:var(--cream);margin:6px 0 18px;gap:16px;align-items:center}.game-top .eyebrow{color:var(--gold);font-size:13px;letter-spacing:1px}h2,h3{font-family:'Pixelify Sans',monospace;letter-spacing:0}h2{font-size:30px;font-weight:700;line-height:1.1}h3{font-size:26px;font-weight:700}.game-top h2{font-size:28px;margin:9px 0 0}.game-top>div:last-child{max-width:570px;display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px}.game-top button{margin:0;font-size:16px;padding:8px 12px}.play-layout{background:var(--cream);border:3px solid var(--blue);box-shadow:0 0 0 2px #f2e4ba,0 0 0 5px var(--blue),3px 6px 0 5px #061e30;grid-template-columns:minmax(0,1fr) 250px}.viewport{border-right:3px solid var(--blue)}aside{padding:20px 18px;background:var(--cream);box-shadow:inset 3px 3px 0 #fff1cc,inset -3px -3px 0 #c8ae7e}.eyebrow{font-family:'Pixelify Sans',monospace;font-size:13px;letter-spacing:1px;color:var(--green)}.quest{font-size:17px;line-height:1.45;padding:12px 0;border-bottom:2px dotted #baab84}.done{color:var(--green)}.tip{font-size:16px;line-height:1.45;color:#4c685e;margin-top:20px}#badge{color:#916030;font-size:17px}footer{color:#c4d6c7;font-size:14px;letter-spacing:.4px;padding:20px 5px}#prompt{font-family:'Pixelify Sans';font-size:16px;border:2px solid var(--blue);color:var(--ink);background:var(--cream);box-shadow:0 0 0 2px #fff1cc,2px 3px 0 2px #123245;padding:8px 12px} .pad button{font-family:'Pixelify Sans';font-size:16px;border:2px solid var(--blue);color:var(--ink);background:#f2e4bae8;padding:4px 13px;box-shadow:1px 2px 0 #173c50}.pad button::before{display:none}#toast{font-family:'Pixelify Sans';font-size:18px;background:var(--cream);color:var(--ink);border:2px solid var(--blue);box-shadow:0 0 0 2px #f2c75a,0 0 0 4px #183a50;padding:12px 20px;max-width:90%;text-align:center}
/* Rectangular handheld dialogue windows, inventory, character cards, field menus. */
dialog{width:min(710px,92vw);max-height:86vh;border:3px solid var(--blue);background:var(--cream);box-shadow:inset 0 0 0 2px #fff1d0,0 0 0 2px #f2e4ba,0 0 0 5px #183a50,0 0 0 7px #9bcfdf,6px 10px 0 7px #061f3099;color:var(--ink);animation:menuAppear 130ms steps(3,end)}dialog::backdrop{background:#09283dbc;backdrop-filter:none}.dialog-head{background:var(--blue);color:var(--cream);border-bottom:3px solid #c77a47;padding:12px 22px;font-family:'Pixelify Sans';font-size:19px;font-weight:700;letter-spacing:.6px}#close{color:var(--cream);background:var(--blue);font-size:26px;padding:0 9px;box-shadow:none;border:0}#close::before{display:none}#content{font-size:21px;line-height:1.45;padding:26px}#content>h2{font-size:31px;line-height:1.2;margin:0 0 18px}#content button{font-size:18px;margin:7px 5px 7px 0;padding:9px 17px}#content p{margin-top:0}.evidence{font-size:19px;line-height:1.5;background:#e3d5a9;border:2px solid #a3a07f;padding:16px;box-shadow:inset 2px 2px 0 #f8e9bf}.evidence p{margin-bottom:10px}.mini{font-size:16px;line-height:1.4;color:#5e7364}.row{padding:15px 0;border-bottom:2px dotted #b7a681;line-height:1.35;font-size:19px}select{font-family:'Pixelify Sans';font-size:19px;color:var(--blue);border:2px solid #526f70;background:#fff0cc;border-radius:0;box-shadow:inset 2px 2px 0 #c9c09c;padding:8px}.selected{background:var(--gold);color:var(--blue)}.sample-tabs{gap:6px;flex-wrap:wrap}.particles{border:2px solid var(--blue);background:#183a50}.atom{box-shadow:2px 2px 0 #0b2b3e}.badge-large{color:#c77a47;text-shadow:2px 2px 0 #f2c75a}.avatar-grid{gap:14px;margin:20px 0 28px}.avatar-card{background:#c3d2b1;border:3px solid var(--blue);box-shadow:inset 2px 2px 0 #e5edca,3px 4px 0 #6b816e;padding:16px 9px 10px!important;transition:none}.avatar-card canvas{width:112px;height:112px;background:#c3d2b1;image-rendering:pixelated}.avatar-card.selected{background:var(--gold);border:3px solid var(--blue);outline:2px solid var(--gold);outline-offset:2px;box-shadow:inset 2px 2px 0 #ffdfa0,3px 4px 0 #826b44}.avatar-card.selected canvas{background:#e7cf89}.avatar-card.selected::after{content:'◆';position:absolute;right:8px;top:4px;font-size:20px;color:var(--blue)}.avatar-card span{font-size:17px;font-weight:700}.avatar-card::before{left:7px}#playerName{font-size:24px;color:var(--blue);background:#fff0cb;border:2px solid #5e7774;box-shadow:inset 2px 2px 0 #c8bb95;padding:12px;border-radius:0}#playerName:focus{outline:2px solid var(--gold);outline-offset:2px}#nameError{font-size:18px;color:#98502f}.unit-card{background:#e9dcb4;border:2px solid #87977c;box-shadow:inset 2px 2px 0 #fff0c6;padding:16px;margin:14px 0}.unit-card.current{border:2px solid var(--blue);border-left:8px solid var(--green)}.unit-card strong{font-size:20px;font-weight:700;line-height:1.4}.unit-card p{font-size:16px;margin:8px 0}.unit-card button{font-size:17px!important}.map-list p{font-size:19px;border-left-color:var(--green)}#missionCanvas{border:2px solid var(--blue)}.model-readout{font-size:18px;line-height:1.4;color:var(--blue);background:#e1d2a7;border:2px solid #a1a485;padding:14px}.parameter{border-bottom:2px dotted #b7a681}.parameter label{font-size:19px;font-weight:400}.parameter input[type=number]{font-size:20px;background:#fff0cb;color:var(--blue);border:2px solid #597674;border-radius:0}.parameter input[type=range]{accent-color:var(--green)}.feedback{font-size:19px;color:#8b542f}#reportFields label{font-size:20px;font-weight:400}textarea{font-family:'Pixelify Sans';font-size:20px;line-height:1.4;background:#fff0cb;color:var(--blue);border:2px solid #5e7774;border-radius:0;box-shadow:inset 2px 2px 0 #c8bb95}input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--green);outline-offset:2px}
@keyframes selectionArrow{0%,100%{translate:0 0}50%{translate:3px 0}}@keyframes titleShimmer{0%,65%,100%{color:#f2c75a}75%{color:#fff0aa}85%{color:#f2c75a}}@keyframes valleyMist{from{transform:translate(-10px,0);opacity:.3}to{transform:translate(12px,-5px);opacity:.7}}@keyframes fireflyDrift{from{transform:translate(0,0);opacity:.25}to{transform:translate(5px,-8px);opacity:.7}}@keyframes menuAppear{from{opacity:.3;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
@media(min-width:1550px){#home{height:800px;padding-top:58px}}
@media(max-width:1000px){body{padding:0 16px 16px}.game-top{align-items:flex-start;flex-direction:column}.game-top>div:last-child{justify-content:flex-start;max-width:100%}.play-layout{grid-template-columns:minmax(0,1fr) 220px}aside{padding:15px}.quest{font-size:16px}.tip{font-size:15px}#home{height:72vw;min-height:600px;padding-top:60px}#home h1{font-size:clamp(24px,4.6vw,50px)}#home>.title-kicker{font-size:14px;letter-spacing:1px}.title-subtitle{font-size:28px;letter-spacing:4px}#home .under{font-size:11px;letter-spacing:0}}
@media(max-width:700px){body{padding:0 11px 14px}header{height:65px;padding:0 3px}#logo{font-size:8px}.brand-gem{display:none}header button{font-size:15px;padding:5px 8px}header>div{gap:5px}#home{min-height:650px;height:calc(100svh - 110px);max-height:800px;padding:54px 8px 16px;margin-top:5px}#home h1{font-size:clamp(20px,5.2vw,36px);letter-spacing:-1px;-webkit-text-stroke:1px var(--blue);text-shadow:2px 0 0 var(--blue),-2px 0 0 var(--blue),0 -2px 0 var(--blue),0 2px 0 var(--blue),3px 4px 0 #092739}#home>.title-kicker{font-size:11px;letter-spacing:0;margin-bottom:20px}.title-subtitle{font-size:24px;letter-spacing:2px;margin-top:10px}#hero{background-position:43% center}#home .actions{bottom:120px;width:285px}#home .home-bottom{bottom:62px;font-size:12px;padding:0 8px}#home .home-bottom span+span{font-size:11px}#home .under{bottom:15px;flex-direction:column;gap:7px;font-size:11px}.play-layout{grid-template-columns:1fr}.viewport{border:0;border-bottom:3px solid var(--blue)}.game-top h2{font-size:25px}.game-top button{font-size:15px;padding:7px 9px}.quest{display:block;width:100%;font-size:17px;padding:10px 0}aside{padding:18px}.tip{font-size:17px}#content{padding:20px;font-size:20px}#content>h2{font-size:27px}#content button{font-size:17px}#prompt{font-size:13px;left:55%;width:44%;bottom:9px;padding:6px;line-height:1.2}.pad button{font-size:15px;padding:4px 11px}.avatar-grid{gap:9px}.avatar-card canvas{width:80px;height:80px}.row{font-size:17px}select{font-size:17px}.model-readout{font-size:17px}footer{font-size:12px}}
@media(max-width:380px){#logo{font-size:7px}header button{font-size:13px;padding:5px 6px}#home h1{font-size:19px}#home>.title-kicker{font-size:10px}.avatar-card canvas{width:64px;height:64px}#content{padding:17px}.dialog-head{font-size:17px;padding:10px 15px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

/* Readable numerals: keep retro lettering while clarifying digits and Z/z.
   Declared after the full faces so only these Unicode ranges take precedence. */
@font-face{font-family:'Pixelify Sans';src:url('assets/fonts/clear-numerals-regular.ttf?v=2') format('truetype');font-style:normal;font-weight:400;font-display:swap;unicode-range:U+0030-0039,U+005A,U+007A,U+00B2-00B3,U+00B9,U+2070-2079}
@font-face{font-family:'Pixelify Sans';src:url('assets/fonts/clear-numerals-bold.ttf?v=2') format('truetype');font-style:normal;font-weight:500 900;font-display:swap;unicode-range:U+0030-0039,U+005A,U+007A,U+00B2-00B3,U+00B9,U+2070-2079}

.route-items{display:grid;grid-template-columns:1fr;gap:7px;margin:12px 0}.route-items .route-item{width:100%;text-align:left;font-size:18px!important;margin:0!important;line-height:1.3}.route-bins{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}.route-bins .route-bin{background:#c6d4ae;flex:1 1 130px;min-height:60px;font-size:18px!important;margin:0!important}.route-items .selected{background:#f2c75a;outline:2px solid #317a65;outline-offset:1px}#questLabel{font-size:17px}.quest{font-size:16px;line-height:1.35;padding:9px 0}#prompt{max-width:72%;line-height:1.25}@media(max-width:700px){.route-items .route-item,.route-bins .route-bin{font-size:17px!important}#prompt{width:49%;max-width:49%;left:50%;font-size:12px}.quest{font-size:17px}}

.avatar-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.avatar-card canvas{width:96px;height:96px}.avatar-card .avatar-description{font-size:15px;font-weight:400;line-height:1.2;min-height:36px;display:block;overflow-wrap:anywhere}@media(max-width:600px){.avatar-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.avatar-card canvas{width:80px;height:80px}.avatar-card .avatar-description{font-size:14px}}@media(max-width:380px){.avatar-card canvas{width:64px;height:64px}}

.music-volume{display:flex;align-items:center;gap:20px;margin:20px 0 26px}.music-volume input{width:80%;accent-color:var(--green)}.music-volume output{font-family:monospace;font-size:18px;min-width:50px}#music{color:var(--gold)}header button{white-space:nowrap}@media(max-width:700px){header{height:auto;min-height:84px;flex-wrap:wrap;justify-content:center;gap:8px;padding:10px 0}#logo{width:100%;text-align:center}header>div{justify-content:center}header button{font-size:14px;padding:5px 9px}}

/* The reference uses its own top-layer window; the active challenge remains intact. */
#periodicDialog{width:min(1220px,94vw);max-height:92vh}#periodicDialog .dialog-head{position:sticky;top:0;z-index:2;gap:15px}#periodicClose{font-size:17px;flex-shrink:0}#periodicBody{padding:18px 22px;font-size:18px}#periodicSearch{width:100%;font:inherit;padding:10px 13px;background:#fff0cb;color:var(--blue);border:2px solid #597674;border-radius:0}#periodicHelp{font-size:16px;line-height:1.35;margin:14px 0 8px}#periodicStatus{font-size:15px;margin:8px 0}.periodic-scroll{max-height:44vh;overflow:auto;overscroll-behavior:contain;border:2px solid var(--blue);background:#dfd2aa;padding:5px;scrollbar-color:#317a65 #dfd2aa}#periodicGrid{display:grid;grid-template-columns:repeat(18,minmax(48px,1fr));grid-template-rows:22px repeat(7,62px) 14px repeat(2,62px);gap:4px;min-width:1020px;padding:3px}.periodic-group{text-align:center;font-size:16px;line-height:22px;font-family:monospace}.element-tile{display:grid;grid-template-rows:13px 23px 13px;min-width:0;text-align:center;margin:0;padding:3px 2px;border:1px solid #49666a;box-shadow:inset 1px 1px 0 #fff7d699;line-height:1;background:#cee0bc;color:#183a50}.element-tile::before{display:none}.element-tile strong{font-size:23px;line-height:23px;font-weight:700}.element-number{font-size:12px;text-align:left;padding-left:2px}.element-mass{font-size:12px;line-height:13px;white-space:nowrap}.element-tile:hover:not(:disabled),.element-tile:focus-visible:not(:disabled){background:#f2c75a;transform:none;z-index:1}.element-tile.element-selected{outline:3px solid #183a50;outline-offset:0;z-index:1}.element-dimmed{opacity:.24}.element-series{display:flex;align-items:center;justify-content:center;text-align:center;font-size:13px;color:#496767;border:1px dashed #718375}.family-nonmetal{background-color:#bbd28f}.family-noble-gas{background-color:#b5c9e3}.family-alkali-metal{background-color:#e7af81}.family-alkaline-earth-metal{background-color:#eed593}.family-metalloid{background-color:#8fb9a0}.family-halogen{background-color:#a4d4c6}.family-post-transition-metal{background-color:#9bcfdf}.family-transition-metal{background-color:#d9b79d}.family-lanthanide{background-color:#c9c7e0}.family-actinide{background-color:#d9b7cc}#elementDetails{border:2px solid #718778;background:#e4d6ac;padding:12px 16px;margin:14px 0}#elementDetails h3{font-size:24px;margin:0 0 9px}.element-detail-row{display:flex;gap:10px 24px;flex-wrap:wrap;font-size:18px}#elementDetails p{font-size:18px;margin:9px 0 0}#elementDetails .mini{font-size:16px}.electron-configuration{font-family:monospace;font-size:14px}#periodicLegend{display:flex;flex-wrap:wrap;gap:6px}.family-key{display:inline-block;border:1px solid #526e6c;padding:3px 8px;font-size:14px}#periodicSource{font-size:14px;line-height:1.4;margin-bottom:0}#periodicSource a{color:#183a50}#periodicTool{background:#c6d4ae}@media(max-width:700px){#periodicBody{padding:13px}#periodicHeading{font-size:17px}#periodicClose{font-size:15px;padding:7px 10px}.periodic-scroll{max-height:38vh}#periodicHelp{font-size:15px}.element-detail-row{font-size:17px;gap:6px 16px}#elementDetails{padding:11px}#elementDetails h3{font-size:23px}}
