:root{font-family:ui-rounded,"Nunito",system-ui,sans-serif;color:#21394e;background:#f4f8ff;font-synthesis:none;--blue:#2158ad;--gold:#d98622;--mint:#168071;--paper:#fff;--outline:#234f9d}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(ellipse at 8% 2%,#dff7e9,transparent 55%),radial-gradient(ellipse at 98% 22%,#e6e6ff,transparent 50%),#f4f8ff}a{color:#164e9c}button,select{font:inherit}button{cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}button:disabled{cursor:default}button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid var(--outline);outline-offset:4px}header,main,footer{width:min(1040px,100% - 32px);margin:auto}header{display:flex;align-items:center;gap:18px;padding:18px 0;border-bottom:1px solid #b9d2e7}header img{width:150px;height:69px;object-fit:contain}header nav{margin-left:auto;display:flex;gap:16px;align-items:center;flex-wrap:wrap}header a{font-weight:750;font-size:.95rem;text-decoration:none}main{padding:26px 0 34px}h1{font-size:clamp(1.65rem,4.7vw,2.6rem);margin:6px 0 10px;color:#17365b;letter-spacing:-.04em;line-height:1.1}.eyebrow{font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;font-weight:800;color:#256453}.intro{max-width:730px;margin:0 0 22px;line-height:1.6}.layout{display:grid;grid-template-columns:minmax(0,680px) minmax(230px,1fr);gap:20px}.game-card,.instructions{background:rgba(255,255,255,.95);border:1px solid #cadceb;border-radius:24px;box-shadow:0 12px 35px #264a7d0d}.game-card{overflow:hidden}.toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:16px;border-bottom:1px solid #dfebf4;background:#fafdff}.toolbar button,.toolbar select{min-height:44px;border:1px solid #b6cfe3;border-radius:12px;padding:8px 13px;background:white;color:#20436a;font-weight:700}.toolbar button[aria-pressed=true]{background:#e2f4ee}.toolbar label{font-size:.8rem;font-weight:700}.toolbar select{max-width:150px}.status-wrap{padding:14px 18px;background:#edf8f3;min-height:90px}.status{font-weight:800;margin:0 0 4px;line-height:1.4}.meta{font-size:.88rem;margin:0;color:#3c5a70}.board-wrap{padding:20px;min-height:300px;display:flex;flex-direction:column;justify-content:center}.instructions{align-self:start;padding:21px}.instructions h2{font-size:1.15rem;margin:0 0 10px}.instructions p{font-size:.95rem;line-height:1.65;margin:10px 0}.instructions .tag{display:inline-block;background:#e9f0fb;color:#244b78;padding:6px 10px;border-radius:8px;font-size:.8rem;font-weight:800}.board{display:grid;gap:6px;width:100%;margin:0 auto}.cell{border:1px solid #c0d0dd;min-width:0;aspect-ratio:1;border-radius:12px;color:#203f5c;font-weight:800;font-size:clamp(1.2rem,4vw,2.1rem);display:flex;align-items:center;justify-content:center;padding:0;background:#f7fbff}.cell.legal{box-shadow:inset 0 0 0 2px #1a6d73}.cell.selected{outline:3px solid #bd681b;outline-offset:2px}.p1{--piece:#225cba;--light:#a4caff}.p2{--piece:#be6524;--light:#ffd599}.piece{width:76%;height:76%;border-radius:50%;background:radial-gradient(circle at 35% 25%,var(--light),var(--piece) 75%);border:2px solid #ffffff99;box-shadow:0 3px 5px #18345444;color:white;display:flex;align-items:center;justify-content:center;font-size:clamp(.75rem,2.7vw,1rem);text-shadow:0 1px 2px #152a49}.reversi{grid-template-columns:repeat(8,1fr);padding:9px;gap:4px;background:#1e7168;border:8px solid #d1eae3;border-radius:20px}.reversi .cell{border:0;background:#ffffff20;border-radius:5px}.reversi .legal:empty:after{content:"";width:20%;height:20%;background:#fff6;border-radius:50%}.reversi .cell.legal{box-shadow:inset 0 0 0 2px #b5eadf}.kalah{display:grid;grid-template-columns:.85fr repeat(6,1fr) .85fr;grid-template-rows:repeat(2,minmax(58px,1fr));gap:7px;background:linear-gradient(130deg,#f0ddba,#e4bc8b);padding:13px;border-radius:30px;border:1px solid #bd986b;min-height:210px}.pit,.store{border:2px solid #b08453;border-radius:40%;background:linear-gradient(150deg,#b68d5b,#f3deba);color:#2f2924;box-shadow:inset 0 4px 6px #5a371d33;position:relative;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:5px 0;font-size:clamp(1rem,4vw,1.55rem);font-weight:850}.pit.legal{border-color:#164f9b;outline:2px solid #e8f3ff}.pit small,.store small{font-size:.63rem;font-weight:750}.store{grid-row:1/3;border-radius:36px;font-size:1.7rem}.store.one{grid-column:8}.store.two{grid-column:1}.dots{display:grid;aspect-ratio:1;gap:0;max-width:460px}.dot{background:#416082;border-radius:50%;margin:3px}.edge{border:0;border-radius:12px;background:#e7edf5;padding:0;min-width:0;min-height:0}.edge.p1{background:#2868c6}.edge.p2{background:#c3772f}.box{display:flex;align-items:center;justify-content:center;margin:4px;border-radius:9px;font-weight:850}.box.p1{background:#e0ecff;color:#1f539a}.box.p2{background:#fff0d8;color:#8f4d17}.peg{grid-template-columns:repeat(10,1fr);gap:9px;background:linear-gradient(145deg,#edf6ec,#d6e9df);padding:22px 14px;border-radius:24px;max-width:490px}.peg .cell{grid-column:span 1;background:#8cba9c;border:2px solid #6b9d7c;border-radius:50%;box-shadow:inset 0 3px 6px #17452c33}.peg .cell .piece{width:90%;height:90%}.lights{max-width:430px;padding:10px;background:#283b59;border-radius:20px;gap:10px}.lights .cell{background:#425571;border:2px solid #5d7394;color:#d6e3f3;font-size:1.1rem;box-shadow:inset 0 2px 5px #18243888}.lights .cell.on{background:radial-gradient(circle at 30% 25%,#fff9d6,#f8bc52);border-color:#ffd387;color:#65421c;box-shadow:0 0 12px #ffbf6522}.slide{max-width:450px;background:#dce8f2;padding:9px;border-radius:20px}.slide .cell{background:linear-gradient(150deg,#fff,#d7edff);border-color:#99bfdc;box-shadow:0 3px 0 #86b3d0}.slide .empty{background:#bdd2e2;box-shadow:inset 0 2px 7px #315d7d33;border-color:transparent}.hanoi{display:flex;gap:12px;background:linear-gradient(170deg,#eef2ff,#dbebf7);border-radius:20px;padding:20px 10px;min-height:250px;align-items:stretch}.tower{position:relative;display:flex;flex:1;min-width:0;min-height:210px;flex-direction:column-reverse;align-items:center;justify-content:flex-start;border:2px solid #c5d8e5;border-bottom:12px solid #7494b2;border-radius:10px;padding:22px 4px 6px;background:linear-gradient(90deg,transparent 47%,#8ca8bf 47%,#8ca8bf 53%,transparent 53%);isolation:isolate}.tower.selected{border-color:#c28232;background-color:#fff8e6}.tower .disk{height:29px;border:2px solid #ffffffbb;border-radius:9px;position:relative;z-index:1;color:#142e4d;font-size:.85rem;font-weight:850;display:flex;justify-content:center;align-items:center;box-shadow:0 2px 3px #354b6633}.tower-label{position:absolute;top:0;left:0;right:0;font-size:.8rem;color:#224569;background:#edf4fc;border-radius:7px 7px 0 0;padding:3px}.code{display:flex;flex-direction:column;gap:10px}.symbol-icon{vertical-align:middle;flex-shrink:0}.symbol{display:flex;align-items:center;justify-content:center;gap:8px}.guess-code .symbol-icon{width:18px;height:18px}.code-key .symbol-icon{width:17px;height:17px}.code-symbols{display:flex;gap:7px;justify-content:center}.symbol{border:2px solid #b5c9dd;border-radius:11px;min-height:50px;min-width:50px;width:20%;font-size:1.3rem;font-weight:850;background:#eff5ff;color:#214d7f}.code-entry{display:flex;gap:8px;justify-content:center;padding:13px;background:#eef4fb;border-radius:15px}.submit{min-height:48px;border:0;border-radius:11px;background:#245cab;color:white;padding:10px 18px;font-weight:800}.code-history{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px}.code-history li{display:flex;gap:8px;align-items:center;justify-content:space-between;border:1px solid #d3e0ed;border-radius:12px;padding:8px 10px;background:#fbfdff;font-size:.83rem}.guess-code{font-weight:850;letter-spacing:.1em;font-size:1.15rem;white-space:nowrap}.code-key{line-height:1.9;font-size:.85rem;background:#f4f7fb;padding:10px;border-radius:10px}.reveal{padding:13px;border:2px solid #5e8b78;border-radius:13px;font-weight:800;background:#effaf3;text-align:center}.assist{font-size:.8rem;text-align:center;color:#47617b;margin:12px 0 0;line-height:1.5}footer{font-size:.78rem;color:#42647a;line-height:1.7;padding:18px 0 25px;border-top:1px solid #c4d8e6}footer a{font-weight:700}.confetti{background:#eefaf1;color:#215443}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}@media(max-width:760px){.layout{grid-template-columns:1fr}.instructions{order:2}.board-wrap{padding:15px}header img{width:125px;height:55px}header nav{gap:9px}header a{font-size:.82rem}.kalah{gap:4px;padding:9px;min-height:172px;grid-template-rows:repeat(2,minmax(55px,1fr))}.pit small{font-size:.55rem}.store small{font-size:.52rem}.board-wrap:has(.kalah){padding:15px 8px}.peg{gap:6px;padding:20px 8px}.reversi{gap:3px;padding:6px;border-width:5px}.status-wrap{min-height:92px}.toolbar{padding:12px}.hanoi{gap:7px;padding:15px 5px}.code-history li{gap:6px;padding:8px}.guess-code{font-size:1rem}.symbol{min-width:44px;min-height:48px}}@media(prefers-reduced-motion:no-preference){.cell,.pit,.edge,.tower,.symbol{transition:background .12s,border-color .12s;}.piece{animation:appear .15s ease-out}@keyframes appear{from{transform:scale(.8)}to{transform:scale(1)}}}