:root{--navy:#061523;--blue:#102f44;--gold:#ffc545;--ink:#dbeaf3}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:var(--navy);font-family:Arial,Helvetica,sans-serif}.topbar{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.8rem clamp(1rem,4vw,4rem);border-bottom:1px solid #c8973655;background:#03121e}.brand{display:flex;align-items:center;gap:.55rem;color:#fff;text-decoration:none;font-weight:900}.brand>b{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;color:#08263c;background:var(--gold)}.brand span{font-size:1.15rem}.brand small{display:block;color:#c8dbe6;font-size:.65rem;letter-spacing:.08em}.mission{padding:.45rem .75rem;border:1px solid #b98726;border-radius:999px;color:#ffd36c;font-size:.73rem;font-weight:900;text-transform:uppercase}.hero{display:grid;grid-template-columns:.85fr 1.15fr;align-items:center;gap:clamp(1.5rem,4vw,4rem);width:min(1200px,calc(100% - 2rem));margin:auto;padding:clamp(3rem,7vw,5.5rem) 0}.hero>div>p:first-child{color:#ffc846;font-weight:900;letter-spacing:.13em}.hero h1{margin:.4rem 0;color:#fff;font:900 clamp(2.5rem,6vw,5rem)/.96 Georgia,serif}.hero h1 em{display:block;color:#ffc43d;font-style:normal}.hero>div>p:nth-of-type(2){max-width:42rem;color:#d4e4ed;font-size:1.12rem;line-height:1.6}.hero a{display:inline-block;margin-top:.7rem;padding:.8rem 1.1rem;border-radius:999px;color:#09283e;background:var(--gold);font-weight:900;text-decoration:none}.hero img{display:block;width:100%;border:4px solid #ce9627;border-radius:1.3rem;box-shadow:0 1.5rem 3rem #0008}.principle{width:min(1200px,calc(100% - 2rem));margin:0 auto 2.5rem;padding:1rem;border:1px solid #bd923d88;border-radius:1rem;color:#fff0cf;background:#103a54;text-align:center;line-height:1.5}.principle b{color:#ffd369}.game-area{padding:4rem 1rem;background:linear-gradient(#101a2df5,#161326f8)}.heading{text-align:center}.heading p{margin:0;color:#ffc754;font-size:.8rem;font-weight:900;letter-spacing:.12em}.heading h2{margin:.4rem 0 1rem;color:#fff9e8;font:900 clamp(2rem,4vw,3.3rem) Georgia,serif}.levels{display:flex;justify-content:center;gap:.7rem;flex-wrap:wrap;margin-bottom:1.3rem}.levels button{min-width:175px;padding:.65rem .9rem;border:2px solid #9fb5c2;border-radius:.75rem;color:#dbe9f0;background:#142b3b;font:inherit;cursor:pointer}.levels b,.levels small{display:block}.levels small{font-size:.68rem}.levels .active{color:#09263d;border-color:#d0931c;background:#ffc64b}.game-shell{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:1rem;width:min(1180px,100%);min-height:750px;margin:auto}.panel,.notes{border:2px solid #8a6d3b;border-radius:1.15rem;background:#081c2b;box-shadow:0 1rem 2.5rem #0006}.panel{padding:1rem;overflow:hidden}.toolbar{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.8rem 1rem;border:1px solid #415e70;border-radius:.8rem;background:var(--blue)}.toolbar>div{display:flex;gap:.5rem;flex-wrap:wrap}.toolbar>div span{padding:.35rem .55rem;border-radius:.5rem;background:#ffffff14}.toolbar b{color:#ffd05e}.progress{display:grid;grid-template-columns:repeat(8,1fr);gap:.4rem;margin:1rem 0}.progress>div{display:flex;align-items:center;gap:.3rem;min-width:0;padding:.4rem;border:1px solid #415462;border-radius:.6rem;color:#8ca1ad;background:#0b2231}.progress span{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;color:#dce8ef;background:#405968;font-size:.68rem;font-weight:900}.progress small{overflow:hidden;font-size:.59rem;font-weight:800;text-overflow:ellipsis;white-space:nowrap}.progress .current{color:#fff0bf;border-color:#c9952d;background:#2b2b33}.progress .current span{color:#09283e;background:#ffc13e}.progress .done{color:#cce9d4;border-color:#4c8963;background:#133326}.progress .done span{background:#4d9568}.stage{position:relative;min-height:555px;overflow:hidden;border:1px solid #536879;border-radius:1rem;background:radial-gradient(circle at 72% 28%,#c8d6ff26,transparent 15rem),linear-gradient(135deg,#101b30,#050d17 72%);box-shadow:inset 0 0 70px #000}.stage>header{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;padding:1rem 1.2rem;border-bottom:1px solid #536677;background:#091927aa}.stage>header span{color:#f6bd45;font-size:.7rem;font-weight:900;letter-spacing:.1em}.stage h3{margin:.2rem 0;color:#fff8e8;font:900 clamp(1.5rem,3vw,2.2rem) Georgia,serif}.stage>header p{margin:0;color:#a9c0ce}.stage>header>b{display:grid;place-items:center;width:54px;height:54px;border:1px solid #bcd1ff66;border-radius:50%;color:#e7eaff;background:#25315a;font-size:1.8rem}.console{display:grid;grid-template-columns:1fr auto;align-items:center;gap:.7rem;padding:1rem 1.2rem;border-bottom:1px solid #3d5361;background:#0c2333cc}.wave{display:flex;align-items:center;justify-content:center;gap:5px;height:58px;padding:0 1rem;border-radius:.8rem;background:#061623}.wave i{display:block;width:5px;height:12px;border-radius:999px;background:#d39c2c}.wave i:nth-child(2n){height:24px}.wave i:nth-child(3n){height:36px}.playing .wave i{animation:pulse .55s ease-in-out infinite alternate}.playing .wave i:nth-child(2n){animation-delay:.12s}.playing .wave i:nth-child(3n){animation-delay:.25s}@keyframes pulse{from{height:8px}to{height:50px;background:#ffd364}}.play{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:.4rem;min-width:205px;padding:.7rem .8rem;border:0;border-radius:.75rem;color:#08263d;background:#ffc444;font:inherit;font-weight:900;cursor:pointer}.play small{flex-basis:100%;font-size:.62rem}.play:disabled{opacity:.55}.text-mode{grid-column:1/-1;justify-self:center;border:0;color:#b9d2df;background:transparent;font:inherit;font-size:.78rem;text-decoration:underline;cursor:pointer}.clue{grid-column:1/-1;margin:0;padding:.65rem;border-left:4px solid #c79229;border-radius:.4rem;color:#f4e6be;background:#2a2631}.source,.interpret,.review{padding:1rem 1.2rem}.source>p,.interpret h4{margin:0 0 .8rem;color:#fff7e2;font-weight:900}.shadows{display:grid;grid-template-columns:repeat(3,1fr);gap:.7rem}.shadows button{min-height:145px;padding:.8rem;border:2px solid #516978;border-radius:.85rem;color:#d8e7ef;background:linear-gradient(160deg,#26384a,#0a1620);font:inherit;font-weight:900;cursor:pointer}.shadows button:hover,.observations button:hover{border-color:#d7a139}.shadows button>span{display:block;margin-bottom:.5rem;filter:grayscale(1) brightness(.15);font-size:4rem;text-shadow:0 10px 18px #000}.wrong{color:#ffd8d5!important;border-color:#c65b54!important;background:#4a1f24!important}.stamp{display:inline-block;padding:.35rem .5rem;border:2px solid #57a070;border-radius:.35rem;color:#bce5c8;background:#143724;font-size:.68rem;font-weight:900}.interpret h4{margin-top:1rem}.observations{display:grid;gap:.6rem}.observations button{display:flex;align-items:center;gap:.65rem;padding:.78rem .9rem;border:2px solid #526a79;border-radius:.7rem;color:#d7e6ee;background:#112839;font:inherit;font-weight:700;text-align:left;cursor:pointer}.observations button span{display:grid;place-items:center;width:29px;height:29px;border-radius:50%;color:#08263c;background:#ffc64b;font-size:.75rem;font-weight:900}.review{display:grid;grid-template-columns:140px 1fr;gap:1rem}.reveal{display:grid;place-items:center;min-height:230px;border:2px solid #8d713b;border-radius:.85rem;background:#0a1520}.reveal span{filter:grayscale(1) brightness(.2);font-size:5.5rem}.review>div:last-child>span{color:#7fc697;font-size:.7rem;font-weight:900}.review h4{margin:.3rem 0;color:#ffd068;font:900 1.55rem Georgia,serif}.review p{color:#cfdee6;line-height:1.5}.review blockquote{margin:.7rem 0;padding:.65rem;border-left:4px solid #d59b2c;color:#ffefc5;background:#292633}.review button{padding:.65rem .85rem;border:0;border-radius:999px;color:#09283e;background:#ffc343;font-weight:900;cursor:pointer}.status{display:flex;align-items:center;gap:.65rem;margin-top:.8rem;padding:.7rem .8rem;border:1px solid #405867;border-radius:.7rem;color:#c5d8e3;background:#102839;font-weight:700}.status>b{display:grid;place-items:center;width:27px;height:27px;border-radius:50%;color:#09283e;background:#ffc74e}.notes{padding:1.1rem;color:#17364b;background:repeating-linear-gradient(#f8f1dd 0 30px,#bdd2de 31px 32px)}.notes>p{margin:0;color:#8e5c18;font-size:.7rem;font-weight:900;letter-spacing:.1em}.notes h3{margin:.35rem 0 1rem;font:900 1.5rem Georgia,serif}#sound-map{display:grid;gap:.45rem}#sound-map>div{display:flex;align-items:center;gap:.5rem;padding:.45rem;border:1px solid #d3c099;border-radius:.6rem;background:#fff9e9}#sound-map>div>span{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;color:#fff;background:#8f8064;font-size:1.15rem;filter:grayscale(1)}#sound-map strong,#sound-map small{display:block}#sound-map strong{font-size:.74rem}#sound-map small{color:#746449;font-size:.62rem}#sound-map .done{color:#22593a;border-color:#7da78a;background:#e8f5e9}#sound-map .done>span{background:#4c9567;filter:none}.meter{margin-top:1rem;padding-top:.8rem;border-top:2px solid #25465b33}.meter>b{display:flex;justify-content:space-between}.meter>i{display:block;height:10px;margin:.45rem 0;border-radius:999px;background:#d7cfb9;overflow:hidden}.meter>i span{display:block;width:100%;height:100%;background:linear-gradient(90deg,#d79b24,#4b9868)}.meter small{color:#675940}.tip{margin-top:1rem;padding:.7rem;border:1px solid #ae8ec0;border-radius:.6rem;color:#4a335e;background:#f5eff8}.tip p{margin:.25rem 0 0;font-size:.77rem}.notes>button{width:100%;margin-top:1rem;padding:.7rem;border:0;border-radius:.65rem;color:#fff;background:#173f5b;font-weight:900;cursor:pointer}.overlay{position:absolute;z-index:5;inset:0;display:grid;place-items:center;padding:1rem;border-radius:1.15rem;color:#fff8e7;background:radial-gradient(circle at 50% 30%,#3b3b654c,transparent 28rem),#041724fa;text-align:center}.overlay>div{max-width:650px}.seal{display:grid;place-items:center;width:112px;height:112px;margin:auto;border:4px double #ffcb54;border-radius:50%;color:#ffcb54;font-size:.72rem;font-weight:900;line-height:1.5;transform:rotate(-4deg)}.overlay h2{margin:.5rem 0;color:#ffd166;font:900 clamp(1.8rem,4vw,2.8rem) Georgia,serif}.overlay p{line-height:1.5}.overlay button{padding:.8rem 1rem;border:0;border-radius:999px;color:#09283e;background:#ffc13c;font:inherit;font-weight:900;cursor:pointer}.overlay small{display:block;margin-top:.7rem;color:#a2b8c4}.result{display:grid;grid-template-columns:repeat(3,1fr);gap:.7rem;margin:1rem 0}.result>div{padding:.7rem;border:1px solid #476273;border-radius:.6rem;background:#0d293a}.result b,.result small{display:block}.result b{color:#ffd063;font-size:1.4rem}.overlay blockquote{padding:.75rem;border:1px solid #a387b5;border-radius:.6rem;color:#f1e1ff;background:#372c48}.skills{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;width:min(1180px,calc(100% - 2rem));margin:auto;padding:4rem 0}.skills article{padding:1.15rem;border-top:4px solid var(--gold);border-radius:.8rem;color:#dbe8ef;background:#10364f}.skills article>b,.skills h3{color:#ffd064}.skills h3{margin:.45rem 0}.skills p{margin:0;line-height:1.45}body>footer{padding:1.3rem;color:#c1d4de;border-top:1px solid #9e773055;background:#03131f;text-align:center}@media(max-width:1000px){.hero,.game-shell{grid-template-columns:1fr}.hero>div{text-align:center}.notes{min-height:300px}}@media(max-width:720px){.topbar{align-items:flex-start;flex-direction:column}.hero{width:calc(100% - 1rem)}.game-area{padding:3rem .5rem}.toolbar{align-items:flex-start;flex-direction:column}.progress{grid-template-columns:repeat(4,1fr)}.stage{min-height:680px}.console{grid-template-columns:1fr}.play{justify-self:center}.shadows{grid-template-columns:1fr}.shadows button{display:flex;align-items:center;gap:1rem;min-height:92px;text-align:left}.shadows button>span{margin:0;font-size:3rem}.review{grid-template-columns:1fr}.reveal{min-height:145px}.skills{grid-template-columns:1fr;width:calc(100% - 1rem)}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.playing .wave i{animation:none}}