/* Fonts hosted on this site (Playfair Display and Source Sans 3, SIL Open Font License). No requests to Google. */
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:600 800;font-display:swap;src:url(../fonts/PlayfairDisplay-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:600 800;font-display:swap;src:url(../fonts/PlayfairDisplay-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Source Sans 3';font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/SourceSans3-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Source Sans 3';font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/SourceSans3-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
:root{
  --navy:#0F2233; --navy2:#16304a; --cream:#F3E9D2; --paper:#FBF5E6; --gold:#C9993A; --goldl:#E8C877;
  --teal:#1B4B49; --ink:#1d2430; --muted:#6b6455; --ok:#2f7d4f; --bad:#a63d32;
  --serif:'Playfair Display',Georgia,serif; --sans:'Source Sans 3','Segoe UI',system-ui,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0}
body{font-family:var(--sans);color:var(--ink);background:var(--navy);min-height:100vh;
  background-image:radial-gradient(1200px 600px at 50% -10%,#1d4263 0%,var(--navy) 60%);background-attachment:fixed}
button{font-family:inherit;cursor:pointer}
.wrap{max-width:1000px;margin:0 auto;padding:0 16px 60px;overflow-x:hidden}
header.top{display:flex;align-items:center;gap:12px;padding:14px 0;border-bottom:1px solid rgba(201,153,58,.35);flex-wrap:wrap}
header.top .logo{display:flex;align-items:center;gap:10px;background:none;border:0;color:var(--goldl)}
header.top .logo b{font-family:var(--serif);font-size:20px;letter-spacing:.14em;display:block;text-align:left}
header.top .logo small{display:block;font-size:10px;letter-spacing:.22em;color:#b9c4cf;text-align:left}
nav{margin-left:auto;display:flex;gap:4px;flex-wrap:wrap}
nav button{background:none;border:1px solid transparent;color:#d8dee5;padding:8px 12px;border-radius:999px;font-weight:600;font-size:14px}
nav button:hover,nav button.on{border-color:var(--gold);color:var(--goldl)}
.pill{display:inline-block;background:var(--gold);color:var(--navy);font-weight:700;font-size:12px;letter-spacing:.08em;padding:4px 10px;border-radius:999px}
h1,h2,h3,h4{font-family:var(--serif);margin:0}
.view{animation:fadeup .45s ease both}
@keyframes fadeup{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.hero{padding:30px 0 6px;text-align:center;color:var(--cream)}
.hero h1{overflow-wrap:anywhere;font-size:clamp(26px,6vw,50px);letter-spacing:.04em;color:var(--goldl)}
.hero p{max-width:660px;margin:12px auto 0;color:#cfd8e0;font-size:18px;line-height:1.5}
.agent{display:flex;align-items:center;flex-wrap:wrap;gap:14px;background:rgba(255,255,255,.06);border:1px solid rgba(201,153,58,.4);border-radius:14px;padding:12px 16px;margin:22px 0;color:var(--cream)}
.agent .badge{width:46px;height:46px;border-radius:50%;background:var(--gold);color:var(--navy);display:grid;place-items:center;font-family:var(--serif);font-weight:800;font-size:20px}
.agent .lab{color:#a9b6c3;font-size:12px;letter-spacing:.14em}
.agent input{background:transparent;border:0;border-bottom:1px dashed var(--gold);color:var(--cream);font-size:16px;font-weight:700;width:150px;font-family:var(--sans)}
.agent .rk{flex:1;min-width:140px}.rkn{font-weight:700;color:var(--goldl)}
.agent .bar{height:8px;border-radius:99px;background:rgba(255,255,255,.15);overflow:hidden;margin-top:4px}
.agent .bar i{display:block;height:100%;background:linear-gradient(90deg,var(--gold),var(--goldl));transition:width .6s}
.agent .cnt{font-size:13px;color:#a9b6c3}
.grid{display:grid;gap:18px}
.g2{grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr))}
.card{background:var(--paper);border:1px solid var(--gold);border-radius:12px;padding:0 0 18px;position:relative;box-shadow:0 8px 20px rgba(0,0,0,.25);overflow:hidden}
.card h3{font-size:21px;color:var(--navy);padding:0 18px;margin-top:12px}
.card p{margin:6px 0;line-height:1.5;padding:0 18px}
.card .theme{font-weight:700;color:var(--teal);font-size:13px;letter-spacing:.06em;text-transform:uppercase}
.card .btn{margin:8px 18px 0}
.casecard .thumb{height:140px;overflow:hidden;border-bottom:2px solid var(--ac,var(--gold))}
.casecard .thumb svg{width:100%;height:100%;display:block}
.casecard{transition:transform .25s,box-shadow .25s}.casecard:hover{transform:translateY(-4px);box-shadow:0 14px 28px rgba(0,0,0,.4)}
.mini{height:6px;background:#e5dcc4;margin:10px 18px 4px;border-radius:99px;overflow:hidden}.mini i{display:block;height:100%;background:var(--teal);transition:width .6s}
.muted{color:var(--muted)}
.btn{background:var(--navy);color:var(--goldl);border:1px solid var(--gold);padding:10px 18px;border-radius:10px;font-weight:700;font-size:15px;transition:background .2s,transform .1s}
.btn:hover{background:var(--teal)}.btn:active{transform:scale(.97)}
.btn.gold{background:var(--gold);color:var(--navy)}.btn.gold:hover{background:var(--goldl)}
.btn.ghost{background:transparent;color:var(--navy);border-color:var(--navy)}.btn.ghost:hover{background:#efe6cc}
.btn[disabled]{opacity:.45;cursor:not-allowed}
.stamp{position:absolute;top:12px;right:12px;border:2px solid #fff;color:#fff;background:rgba(15,34,51,.6);padding:2px 8px;font-weight:800;font-size:11px;letter-spacing:.14em;transform:rotate(6deg);border-radius:4px;z-index:2}
.stamp.done{color:#bff0d0;border-color:#bff0d0}
.section{margin-top:34px}.section>h2{color:var(--goldl);font-size:26px;margin-bottom:14px}
/* banner / scenes */
.banner{position:relative;height:230px;border-radius:14px;overflow:hidden;border:1px solid var(--gold);margin-top:22px}
.banner .scene{width:100%;height:100%;display:block}
.banner .bt{position:absolute;left:0;right:0;bottom:0;padding:40px 20px 14px;background:linear-gradient(transparent,rgba(5,12,22,.85))}
.banner h1{color:var(--goldl);font-size:clamp(26px,5.5vw,44px);margin-top:6px}
.scene .tw{animation:tw 3s ease-in-out infinite}@keyframes tw{0%,100%{opacity:.25}50%{opacity:1}}
.scene .wave{animation:wave 6s linear infinite}.scene .w2{animation-duration:9s;animation-direction:reverse}
@keyframes wave{from{transform:translateX(0)}to{transform:translateX(-100px)}}
.scene .beamwrap{animation:spin 8s linear infinite;transform-box:view-box}
@keyframes spin{to{transform:rotate(360deg)}}
.scene .flick{animation:flick 1.6s ease-in-out infinite}@keyframes flick{0%,100%{opacity:1}50%{opacity:.6}}
.scene .fog{animation:fog 14s ease-in-out infinite alternate}@keyframes fog{from{transform:translateX(-30px)}to{transform:translateX(30px)}}
.scene .comet{animation:comet 9s linear infinite}@keyframes comet{0%{transform:translate(850px,20px)}60%,100%{transform:translate(-100px,150px)}}
.scene .slit{animation:slit 6s ease-in-out infinite}@keyframes slit{0%,100%{opacity:.7}50%{opacity:1}}
.scene .scope{animation:scope 7s ease-in-out infinite;transform-origin:398px 66px}@keyframes scope{0%,100%{transform:rotate(0)}50%{transform:rotate(14deg)}}
.scene .sway{animation:sway 4s ease-in-out infinite}.scene .s2{animation-duration:5.5s;animation-delay:-1.5s}@keyframes sway{0%,100%{transform:rotate(-2.5deg)}50%{transform:rotate(2.5deg)}}
.scene .sun{animation:flick 5s ease-in-out infinite}
.scene .pollen{animation:pol 6s ease-in-out infinite}.scene .p2{animation-delay:-2s}.scene .p3{animation-delay:-4s}.scene .p4{animation-delay:-1s}
@keyframes pol{0%,100%{transform:translate(0,0);opacity:.2}50%{transform:translate(18px,-26px);opacity:1}}
.scene .aur{animation:aur 7s ease-in-out infinite alternate}.scene .a2{animation-duration:10s}@keyframes aur{from{transform:translateX(-24px)}to{transform:translateX(24px)}}
.scene .fall{animation:fall linear infinite}@keyframes fall{to{transform:translateY(320px)}}
.scene .pg{animation:pg 3s ease-in-out infinite;transform-box:fill-box;transform-origin:bottom}.scene .pg.p2{animation-delay:-1.4s}@keyframes pg{0%,100%{transform:rotate(-3deg)}50%{transform:rotate(3deg)}}
/* panels */
.panel{background:var(--paper);border:1px solid var(--gold);border-radius:14px;padding:22px;margin-top:18px;color:var(--ink)}
.panel h2{color:var(--navy);margin-bottom:6px}
.panel .sub{font-size:17px;margin:14px 0 8px}
.story{font-style:italic;color:#4a4333;line-height:1.55}
.suspects{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(150px,45%),1fr));gap:14px}
.sus{display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;background:#fff;border:1px solid #e1d6b8;border-radius:12px;padding:12px 8px}
.sus b{font-family:var(--serif);color:var(--navy);font-size:15px}.sus span{font-size:13px;color:var(--muted);line-height:1.3}
.avatar{border-radius:10px;display:block;animation:bob 5s ease-in-out infinite}.sus:nth-child(2) .avatar{animation-delay:-1s}.sus:nth-child(3) .avatar{animation-delay:-2s}.sus:nth-child(4) .avatar{animation-delay:-3s}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
.avatar .eyes{animation:blink 5s infinite;transform-box:fill-box;transform-origin:center}@keyframes blink{0%,94%,100%{transform:scaleY(1)}97%{transform:scaleY(.1)}}
.levels{display:grid;gap:12px}
.lvl{display:flex;gap:14px;align-items:center;background:var(--paper);border:1px solid var(--gold);border-radius:12px;padding:14px 16px;text-align:left;width:100%;transition:transform .2s}
.lvl:not(.locked):hover{transform:translateX(4px)}
.lvl .n{width:42px;height:42px;border-radius:50%;background:var(--navy);color:var(--goldl);display:grid;place-items:center;font-family:var(--serif);font-weight:800;flex:none}
.lvl.done .n{background:var(--ok);color:#fff}.lvl.locked{opacity:.5;cursor:not-allowed}
.lvl b{font-size:17px;color:var(--navy)}.lvl span{display:block;color:var(--muted);font-size:14px}
.topline{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.topline .muted{font-size:12px;letter-spacing:.12em}
.facts{display:grid;gap:10px;margin:16px 0}
.fact{display:flex;gap:12px;background:var(--navy2);color:var(--cream);border-radius:10px;padding:12px 14px;line-height:1.5;font-size:15px;border-left:4px solid var(--goldl)}
.fact h4{font-size:15px;color:var(--goldl);margin-bottom:2px}.fact p{margin:0}.fact b{color:var(--goldl)}
.fact .fi{color:var(--goldl);flex:none;padding-top:2px}
.fact.f-dyk{background:#fff3d1;color:#4a3a14;border-left-color:var(--gold)}.fact.f-dyk h4{color:#8a6a1c}.fact.f-dyk .fi{color:#8a6a1c}.fact.f-dyk b{color:#6a4f10}
.fact.f-history{background:#efe4c8;color:#3d3420;border-left-color:#8a6a38}.fact.f-history h4,.fact.f-history b,.fact.f-history .fi{color:#6a4f20}
.fact.f-lesson{background:var(--teal);border-left-color:#8fd0c8}.fact.f-lesson h4,.fact.f-lesson .fi,.fact.f-lesson b{color:#bff0e8}
.fact.locked{background:#e5dcc4;color:#8a8168;border-left-color:#cfc29b}.fact.locked h4{color:#8a8168}
.facts.lib{grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr))}
.puzzle{margin:18px 0 6px;padding:16px;background:#fffdf5;border:1px dashed var(--gold);border-radius:12px;overflow-x:auto}
.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.msg{min-height:24px;margin-top:10px;font-weight:700}.msg.ok{color:var(--ok)}.msg.bad{color:var(--bad)}
.hintbox{margin-top:8px;background:#e8f3ef;border:1px solid #9fcfc3;border-radius:8px;padding:10px 12px}
.stamp-big{display:inline-block;margin:16px 0 8px;border:4px solid var(--ok);color:var(--ok);font-weight:800;letter-spacing:.2em;font-size:22px;padding:4px 16px;border-radius:6px;transform:rotate(-5deg);animation:stampin .45s cubic-bezier(.2,1.6,.4,1) both}
@keyframes stampin{from{opacity:0;transform:rotate(-5deg) scale(2.4)}to{opacity:1;transform:rotate(-5deg) scale(1)}}
.clue{background:#fff8dc;border:1px solid var(--gold);border-radius:6px;padding:10px 12px;font-size:15px;line-height:1.4;transform:rotate(-.6deg);box-shadow:0 3px 8px rgba(0,0,0,.2)}
.board{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr))}
.clue:nth-child(even){transform:rotate(.7deg)}.clue.empty{background:transparent;border:1px dashed rgba(201,153,58,.55);color:#8ea0b2;box-shadow:none}
.newclue{margin:12px 0;animation:pop .5s both}@keyframes pop{from{opacity:0;transform:scale(.9)}to{opacity:1;transform:rotate(-.6deg)}}
/* puzzle widgets */
input.txt{font:inherit;font-size:20px;letter-spacing:.2em;text-transform:uppercase;padding:10px 12px;border:2px solid var(--navy);border-radius:10px;background:#fff;width:100%;max-width:360px}
.cipher{font-family:'Courier New',monospace;font-size:24px;letter-spacing:.22em;margin:8px 0;color:var(--navy);word-break:break-all}.cipher.dec{color:var(--teal)}
.slider{width:100%;max-width:360px;accent-color:var(--gold)}
.sudoku{display:grid;grid-template-columns:repeat(4,60px);border:3px solid var(--navy);width:max-content;margin:6px 0}
.sudoku button{width:60px;height:60px;font-size:26px;font-family:var(--serif);font-weight:800;background:#fff;border:1px solid #bbb;color:var(--teal)}
.sudoku button.given{background:#ece4cf;color:var(--navy);cursor:default}
.sudoku button.rb{border-right:3px solid var(--navy)}.sudoku button.bb{border-bottom:3px solid var(--navy)}
table.lg{border-collapse:collapse;margin:10px 0}table.lg td{padding:6px 10px;border-bottom:1px solid #d9cfb6}
select{font:inherit;font-size:16px;padding:8px;border-radius:8px;border:2px solid var(--navy);background:#fff;max-width:100%}
ol.clues{padding-left:20px;line-height:1.6}
.lamp{width:110px;height:110px;border-radius:50%;background:#2a3846;border:4px solid var(--navy);margin:10px 0;display:grid;place-items:center;color:#4a5a6c;transition:all .05s}
.lamp.on{background:radial-gradient(circle,#fff6c9 0%,#f6cf5a 55%,#c9993a 100%);box-shadow:0 0 60px 20px rgba(246,207,90,.7);color:#8a6a1c}
.morse{display:grid;grid-template-columns:repeat(auto-fit,minmax(80px,1fr));gap:6px;font-family:'Courier New',monospace;margin:10px 0}.morse div{background:#fff;border:1px solid #d9cfb6;border-radius:6px;padding:4px 8px}
.order{padding:0;margin:8px 0}.order li{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid #d9cfb6;border-radius:10px;padding:8px 12px;margin:6px 0;list-style:none}
.order .pos{width:26px;height:26px;border-radius:50%;background:var(--navy);color:var(--goldl);display:grid;place-items:center;font-size:13px;font-weight:700}
.order button{background:var(--navy);color:var(--goldl);border:0;border-radius:6px;width:32px;height:32px;font-size:16px}
.nono{display:grid;grid-template-columns:auto repeat(var(--m,5),44px);grid-template-columns:auto repeat(var(--n),44px);gap:2px;width:max-content;align-items:stretch}
.nono .corner{}.nono .ch{display:flex;flex-direction:column;justify-content:flex-end;align-items:center;font-weight:700;color:var(--navy);font-size:14px;padding-bottom:2px;min-height:48px}
.nono .rh{display:flex;align-items:center;justify-content:flex-end;padding-right:8px;font-weight:700;color:var(--navy);font-size:14px;white-space:nowrap}
.nc{width:44px;height:44px;background:#fff;border:2px solid #b9ae8c;color:#a63d32;font-size:24px;line-height:1;transition:background .1s}
.nc.f{background:var(--navy);border-color:var(--navy)}
.lu{display:grid;grid-template-columns:repeat(var(--n),48px);gap:2px;width:max-content}
.lb{width:48px;height:48px;background:var(--navy);color:var(--goldl);display:grid;place-items:center;font-weight:800;font-size:22px;border-radius:3px}
.lw{width:48px;height:48px;background:#fff;border:2px solid #b9ae8c;font-size:24px;transition:background .15s;border-radius:3px}.lw.lit{background:#fff0a8}.lw.bad{background:#f6b9b1}
.hi{display:grid;grid-template-columns:repeat(var(--n),48px);gap:2px;width:max-content}
.hc{width:48px;height:48px;background:#fff;border:2px solid #b9ae8c;font-family:var(--serif);font-size:22px;font-weight:700;color:var(--navy);border-radius:3px}.hc.s{background:var(--navy);color:#6c7f94}
table.guess{border-collapse:collapse;margin:8px 0}table.guess td{padding:6px 14px;border-bottom:1px solid #d9cfb6;font-family:'Courier New',monospace;font-size:20px}.gp{color:var(--teal);letter-spacing:.2em}
.dial{margin:10px 0}.drow{display:flex;gap:4px;align-items:flex-end;margin:6px 0;flex-wrap:wrap}.dl{font-size:12px;color:var(--muted);width:52px}
.dc{display:inline-flex;flex-direction:column;align-items:center;width:28px;background:#fff;border:1px solid #d9cfb6;border-radius:6px;font-weight:700;font-size:16px;padding:2px 0}.dc i{font-style:normal;font-size:10px;color:var(--muted)}.dc.pick{background:var(--gold);color:var(--navy)}
.digits{display:flex;gap:8px}.dg{width:54px;height:60px;text-align:center;font-size:26px;font-weight:700;border:2px solid var(--navy);border-radius:10px;background:#fff}
.ws{display:grid;grid-template-columns:repeat(var(--n),38px);gap:2px;width:max-content}
.wc{width:38px;height:38px;background:#fff;border:1px solid #d9cfb6;font-weight:700;font-size:17px;color:var(--navy);border-radius:4px;padding:0}.wc.h{background:var(--goldl)}.wc.st{background:#9fd0c8}
.wl{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}.wl span{background:#fff;border:1px solid #d9cfb6;border-radius:99px;padding:3px 12px;font-weight:700;font-size:14px}.wl .fd{background:var(--ok);color:#fff;text-decoration:line-through}
.rail{display:grid;grid-template-columns:repeat(var(--c),34px);gap:2px;width:max-content;margin:10px 0}.rc{width:34px;height:34px;text-align:center;text-transform:uppercase;font-weight:700;font-size:16px;border:2px solid var(--navy);border-radius:5px;padding:0}.rail span{height:34px}
.opt{display:block;width:100%;text-align:left;background:#fff;border:2px solid #d9cfb6;border-radius:10px;padding:12px 14px;margin:8px 0;font-size:16px;line-height:1.4;transition:border-color .15s}.opt:hover{border-color:var(--gold)}.opt.sel{border-color:var(--navy);background:#f1ecdb}
.books{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr));gap:18px}
.bk{border-radius:10px;overflow:hidden;box-shadow:0 10px 24px rgba(0,0,0,.35);border:1px solid var(--gold)}
.bk .cv{height:170px;display:grid;place-items:center;text-align:center;padding:14px;color:#fff}.bk .cv b{font-family:var(--serif);font-size:22px;letter-spacing:.06em;line-height:1.15}.bk .cv small{display:block;font-size:10px;letter-spacing:.2em;margin-bottom:6px;opacity:.85}
.bk .in{background:var(--paper);padding:14px}.bk .in p{margin:4px 0 10px;font-size:14px;color:var(--muted);line-height:1.4}
.cta{margin-top:18px;background:linear-gradient(90deg,var(--teal),var(--navy2));border:1px solid var(--gold);border-radius:12px;padding:16px 18px;color:var(--cream);display:flex;gap:14px;align-items:center;flex-wrap:wrap}.cta b{color:var(--goldl)}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(120px);background:var(--gold);color:var(--navy);font-weight:700;padding:12px 20px;border-radius:999px;box-shadow:0 8px 24px rgba(0,0,0,.4);transition:transform .35s;z-index:10;max-width:90vw;text-align:center}.toast.show{transform:translateX(-50%) translateY(0)}
#confetti{position:fixed;inset:0;pointer-events:none;display:none;z-index:20}
.foot{text-align:center;color:#8ea0b2;font-size:13px;margin-top:40px}.foot button{background:none;border:0;color:#8ea0b2;text-decoration:underline;font-size:13px}
/* certificate */
.nameinp{font:inherit;font-size:16px;padding:8px 10px;border:2px solid var(--gold);border-radius:8px;margin-right:8px}
.noprint{color:var(--cream)}.noprint p{color:#cfd8e0}.noprint label{color:var(--cream)}
.cert{background:#fffaf0;border:10px double var(--gold);border-radius:6px;padding:10px;margin:18px auto;max-width:900px;aspect-ratio:1.414;color:var(--navy);display:flex}
.cin{flex:1;border:2px solid var(--navy);padding:4% 6%;display:flex;flex-direction:column;align-items:center;text-align:center;justify-content:space-between;background:radial-gradient(circle at 50% 40%,#fffdf6,#f6ecd2)}
.cin h1{font-size:clamp(22px,4.6vw,44px);color:var(--navy);margin:2px 0}
.ck{letter-spacing:.3em;font-size:clamp(9px,1.6vw,14px);color:var(--teal);font-weight:700}
.cs{margin:0;font-size:clamp(12px,2vw,18px);color:#4a4333}
.cname{font-family:var(--serif);font-style:italic;font-size:clamp(28px,6vw,56px);border-bottom:2px solid var(--gold);padding:0 30px;min-width:50%}
.cb{margin:0;max-width:680px;font-size:clamp(11px,1.8vw,16px);line-height:1.5;color:#4a4333}
.cfoot{display:flex;width:100%;justify-content:space-between;align-items:flex-end;gap:12px}
.cfoot>div{flex:1;text-align:center;font-size:clamp(10px,1.5vw,13px);color:var(--muted)}.cfoot .line{border-top:1px solid var(--navy);margin:0 14%;margin-bottom:4px}
.crank b{display:block;font-family:var(--serif);font-size:clamp(14px,2.4vw,22px);color:var(--navy)}
.cseal{margin-bottom:-4px}
@media (max-width:560px){.sudoku{grid-template-columns:repeat(4,54px)}.sudoku button{width:54px;height:54px}.cert{aspect-ratio:auto}.banner{height:190px}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
@page{size:A4 landscape;margin:0}
@media print{
  body{background:#fff!important}
  .noprint,header,.foot,.toast,#confetti{display:none!important}
  .wrap{max-width:none;padding:0}
  .cert{margin:0;max-width:none;width:297mm;height:210mm;border-width:14px;-webkit-print-color-adjust:exact;print-color-adjust:exact;page-break-inside:avoid}
  .view{animation:none}
}
.noprint .btn.ghost{color:var(--goldl);border-color:var(--gold)}.noprint .btn.ghost:hover{background:var(--navy2)}

/* ---------------- v3: sections, filters, new scenes, academy, news */
.scene .sunp{animation:sunp 5s ease-in-out infinite;transform-origin:560px 130px}@keyframes sunp{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}}
.scene .scan{animation:scan 6s ease-in-out infinite}@keyframes scan{0%,100%{transform:translate(-110px,10px)}50%{transform:translate(110px,-10px)}}
.scene .prints{animation:tw 4s ease-in-out infinite}
.scene .flag{animation:flagw 2.2s ease-in-out infinite}@keyframes flagw{0%,100%{transform:skewY(0)}50%{transform:skewY(6deg)}}
.scene .dust{animation:dust 3.5s ease-in-out infinite}@keyframes dust{0%{transform:translate(0,0);opacity:.8}100%{transform:translate(18px,-30px);opacity:0}}
.scene .cloud{animation:cloud 30s linear infinite alternate}.scene .c2{animation-duration:42s}@keyframes cloud{from{transform:translateX(-40px)}to{transform:translateX(90px)}}
.scene .glint{animation:glint 4s ease-in-out infinite}.scene .g2{animation-delay:-1.3s}.scene .g3{animation-delay:-2.6s}@keyframes glint{0%,80%,100%{opacity:0}90%{opacity:1}}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr));gap:14px;margin-top:22px}
.tile{background:var(--paper);border:1px solid var(--gold);border-radius:12px;padding:16px;text-align:left;display:flex;flex-direction:column;gap:6px;box-shadow:0 8px 20px rgba(0,0,0,.25);transition:transform .25s,box-shadow .25s;color:var(--navy)}
.tile:hover{transform:translateY(-4px);box-shadow:0 14px 28px rgba(0,0,0,.4)}
.tile .ti{width:46px;height:46px;border-radius:12px;background:var(--navy);display:grid;place-items:center;font-size:24px}
.tile b{font-family:var(--serif);font-size:19px}.tile span{font-size:14px;line-height:1.4;color:var(--muted)}.tile em{font-style:normal;font-weight:700;font-size:12px;letter-spacing:.08em;color:var(--teal);text-transform:uppercase}
.filters{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0 6px}
.filters button{background:transparent;border:1px solid var(--gold);color:var(--goldl);padding:8px 14px;border-radius:999px;font-weight:700;font-size:14px}
.filters button.on{background:var(--gold);color:var(--navy)}
.badges{display:flex;gap:6px;flex-wrap:wrap;padding:12px 18px 0}
.badge2{font-size:11px;font-weight:800;letter-spacing:.08em;padding:3px 9px;border-radius:999px;border:1.5px solid var(--navy);color:var(--navy);text-transform:uppercase}
.badge2.q{background:#d8efe3;border-color:#2f7d46;color:#1c5a30}.badge2.s{background:#f3e7c6;border-color:#a87c1e;color:#6b4d0b}.badge2.m{background:#16304a;border-color:#16304a;color:var(--goldl)}
.explain{background:var(--paper);border:1px solid var(--gold);border-radius:12px;padding:14px 18px;margin-top:18px;display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr))}
.explain div b{display:block;font-family:var(--serif);color:var(--navy)}.explain div span{font-size:14px;color:var(--muted);line-height:1.4}
.feat{background:linear-gradient(120deg,#16304a,#1B4B49);border:1px solid var(--gold);border-radius:14px;overflow:hidden;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);margin-top:22px;color:var(--cream)}
.feat .fi{height:100%;min-height:180px}.feat .fi svg{width:100%;height:100%;display:block}
.feat .ft{padding:18px 20px}.feat h3{color:var(--goldl);font-size:24px;margin:8px 0}.feat p{line-height:1.5;color:#d6dfe7}
@media(max-width:640px){.feat{grid-template-columns:1fr}}
.news{background:var(--paper);border:1px solid var(--gold);border-radius:12px;padding:14px 18px;margin:12px 0;color:var(--navy)}
.news .nd{font-size:12px;font-weight:800;letter-spacing:.1em;color:var(--teal);text-transform:uppercase}.news h3{font-size:20px;margin:4px 0}.news p{line-height:1.55;margin:4px 0}
.obgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(86px,1fr));gap:8px;margin:10px 0;max-width:520px}
.obi{background:#fff;border:2px solid #d9cfb6;border-radius:10px;text-align:center;padding:8px 4px}.obi span{display:block;font-size:34px}.obi small{font-size:12px;color:var(--navy);font-weight:700}
.drill{display:flex;align-items:center;gap:14px;background:var(--paper);border:1px solid var(--gold);border-radius:12px;padding:12px 14px;text-align:left;width:100%;margin:8px 0;color:var(--navy)}
.drill.done{background:#e6f0d9}.drill .n{width:42px;height:42px;border-radius:50%;background:var(--navy);color:var(--goldl);display:grid;place-items:center;font-weight:800;flex:none;font-size:20px}
.drill b{font-size:17px}.drill span{display:block;font-size:14px;color:var(--muted)}.drill em{margin-left:auto;font-style:normal;font-size:11px;font-weight:800;letter-spacing:.08em;color:var(--teal);text-transform:uppercase;white-space:nowrap}
.inside{margin:6px 0 10px 20px;line-height:1.6}.inside li{margin:3px 0}.peeka{background:#e6f0d9;border-radius:8px;padding:8px 10px !important;margin-top:6px !important;color:var(--navy)}
.obgrid[hidden]{display:none}
.badge2.w{background:var(--gold);border-color:var(--gold);color:var(--navy)}
.steps{margin:6px 0 10px 22px;line-height:1.65}.steps li{margin:6px 0}
.fpev{display:flex;justify-content:center;margin:8px 0}.fpgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px;margin:10px 0}.fpc{background:#fff;border:2px solid #d9cfb6;border-radius:12px;padding:8px;display:flex;flex-direction:column;align-items:center;gap:4px;color:var(--navy)}button.fpc:hover{border-color:var(--gold)}.fpc.sel{border-color:var(--navy);background:#f1ecdb}.fpc b{font-size:14px}.gel{width:100%;max-width:460px;background:#fff;border:2px solid #d9cfb6;border-radius:10px;display:block;margin:8px 0}.gelpick{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px}
.four{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:12px;margin:10px 0}.fw{background:#fff;border:1px solid #d9cfb6;border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:6px;color:var(--navy)}.fw b{font-family:var(--serif);font-size:17px}.fw p{margin:0;font-size:14px;line-height:1.4;color:var(--muted);flex:1}.fw .btn{margin:0;align-self:flex-start}.fwi{font-size:26px}.fwrow{letter-spacing:.3em}