:root{--ground:#f5ead2;--panel:#fffaf0;--ink:#241a12;--ink-soft:#6b5a45;--mango:#f2c14e;--chili:#e8663d;--jade:#2e6b52;--water:#2f9bd4;--line:#e3d4b3;--shadow:#3c28142e}@media (prefers-color-scheme:dark){:root{--ground:#17140f;--panel:#211b14;--ink:#f4ead6;--ink-soft:#b39f80;--line:#35291a;--shadow:#00000080}}:root[data-theme=dark]{--ground:#17140f;--panel:#211b14;--ink:#f4ead6;--ink-soft:#b39f80;--line:#35291a;--shadow:#00000080}:root[data-theme=light]{--ground:#f5ead2;--panel:#fffaf0;--ink:#241a12;--ink-soft:#6b5a45;--line:#e3d4b3;--shadow:#3c28142e}*{box-sizing:border-box}body{background:radial-gradient(circle at 20% 0%, color-mix(in srgb, var(--mango) 22%, transparent), transparent 45%), radial-gradient(circle at 90% 100%, color-mix(in srgb, var(--water) 16%, transparent), transparent 45%), var(--ground);min-height:100vh;color:var(--ink);margin:0;font-family:Trebuchet MS,Segoe UI,system-ui,sans-serif}#app{flex-direction:column;align-items:center;gap:16px;padding:24px 14px 56px;display:flex}.pixel{letter-spacing:.5px;font-family:Courier New,monospace;font-weight:700}.stage{background:var(--panel);border:3px solid var(--ink);width:100%;max-width:520px;box-shadow:0 14px 0 -4px var(--shadow), 0 22px 40px -18px var(--shadow);border-radius:18px;overflow:hidden}.top{border-bottom:3px dashed var(--line);justify-content:space-between;align-items:center;gap:10px;padding:14px 18px 10px;display:flex}.title-block h1{margin:0;font-size:19px;line-height:1.1}.title-block .sub{color:var(--ink-soft);margin-top:3px;font-size:11px}.top-right{flex-direction:column;align-items:flex-end;gap:4px;display:flex}.lang-toggle{gap:4px;display:flex}.lang-toggle button{border:2px solid var(--line);background:var(--panel);color:var(--ink-soft);cursor:pointer;border-radius:6px;padding:3px 7px;font-size:10px;font-weight:700}.lang-toggle button.active{background:var(--jade);color:#fff;border-color:var(--jade)}.top-controls{align-items:center;gap:8px;display:flex}.sound-toggle{cursor:pointer;border:2px solid var(--line);background:var(--panel);border-radius:8px;width:30px;height:30px;padding:0;font-size:15px;line-height:1}.sound-toggle[aria-pressed=false]{opacity:.6}.char-toggle{gap:4px;display:flex}.char-toggle[hidden],.char-toggle button[hidden]{display:none}.char-toggle button{cursor:pointer;border:2px solid var(--line);background:var(--panel);border-radius:8px;width:34px;height:34px;padding:0;transition:border-color .15s,transform .15s;overflow:hidden}.char-toggle button img{width:100%;height:100%;image-rendering:pixelated;filter:grayscale()brightness(.85);opacity:.7;transition:filter .15s,opacity .15s;display:block}.char-toggle button:hover img{opacity:.9}.char-toggle button.active{border-color:var(--chili);transform:translateY(-1px)}.char-toggle button.active img{filter:none;opacity:1}.puzzle-no{text-align:right;color:var(--ink-soft);font-size:10px}.puzzle-no b{color:var(--chili);font-size:14px}.board-wrap{background:radial-gradient(ellipse at 50% 35%, color-mix(in srgb, var(--mango) 14%, transparent), transparent 62%), color-mix(in srgb, var(--jade) 6%, var(--panel));padding:8px 8px 14px}.hint{text-align:center;color:var(--ink-soft);min-height:15px;margin:4px 0 6px;font-size:12px}.hint b{color:var(--jade)}canvas#game{cursor:pointer;touch-action:manipulation;width:100%;height:auto;display:block}.status{justify-content:center;gap:22px;margin-top:6px;font-size:13px;display:flex}.status b{color:var(--chili)}.controls{border-top:3px dashed var(--line);flex-direction:column;align-items:center;gap:10px;padding:12px 18px 16px;display:flex}.restart{background:var(--jade);color:#fff;border:3px solid var(--ink);box-shadow:0 4px 0 var(--ink);cursor:pointer;border-radius:10px;padding:10px 22px;font-family:Courier New,monospace;font-size:13px;font-weight:700}.restart:active{box-shadow:0 1px 0 var(--ink);transform:translateY(3px)}.restart:focus-visible{outline:3px solid var(--water);outline-offset:3px}.badge{color:var(--ink-soft);font-size:10px}.modal-backdrop{z-index:50;background:color-mix(in srgb, var(--ink) 62%, transparent);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);justify-content:center;align-items:center;padding:20px;display:none;position:fixed;inset:0}.modal-backdrop.open{display:flex}.modal{background:var(--panel);border:3px solid var(--ink);text-align:center;width:100%;max-width:360px;box-shadow:0 16px 0 -4px var(--shadow), 0 30px 60px -20px #00000080;border-radius:18px;padding:24px 22px 20px;animation:.25s cubic-bezier(.34,1.5,.5,1) pop}@keyframes pop{0%{opacity:0;transform:scale(.85)}to{opacity:1;transform:scale(1)}}@media (prefers-reduced-motion:reduce){.modal{animation:none}}.modal h2{text-wrap:balance;margin:0 0 4px;font-size:22px}.modal .day{color:var(--ink-soft);margin-bottom:16px;font-size:12px}.modal .result-grid{letter-spacing:4px;margin:8px 0 18px;font-family:Courier New,monospace;font-size:26px;line-height:1}.modal .stat-row{color:var(--ink-soft);justify-content:center;gap:24px;margin-bottom:18px;font-size:11px;display:flex}.modal .stat{flex-direction:column;align-items:center;gap:2px;display:flex}.modal .stat-icon{width:34px;height:34px;image-rendering:pixelated}.modal .stat b{color:var(--chili);font-size:20px;line-height:1}.modal .stat.streak b{color:var(--jade)}.modal-actions{gap:10px;display:flex}.modal-actions button{border:3px solid var(--ink);box-shadow:0 4px 0 var(--ink);cursor:pointer;border-radius:10px;flex:1;padding:12px;font-family:inherit;font-size:13px;font-weight:700}.modal-actions button:active{box-shadow:0 1px 0 var(--ink);transform:translateY(3px)}.btn-share{background:var(--jade);color:#fff}.btn-copy{background:var(--mango);color:#2a1d12}.btn-share{justify-content:center;align-items:center;gap:6px;display:inline-flex}.btn-share img{width:18px;height:18px;image-rendering:pixelated}.after-actions{gap:10px;margin:10px 8px 0;display:flex}.after-actions[hidden]{display:none}.after-actions button{cursor:pointer;border:3px solid var(--ink);box-shadow:0 4px 0 var(--ink);border-radius:10px;flex:1;padding:11px;font-family:inherit;font-size:14px;font-weight:700}.after-actions button:active{box-shadow:0 1px 0 var(--ink);transform:translateY(3px)}.btn-result,.btn-close{background:var(--panel);color:var(--ink)}.site-footer{color:var(--ink-soft);align-items:center;gap:10px;font-size:12px;display:flex}.site-footer a{color:var(--jade);font-weight:700;text-decoration:none}.site-footer a:hover{text-decoration:underline}.canvas-box{position:relative}.intro{z-index:5;cursor:pointer;perspective:700px;background:radial-gradient(#14080640,#140806b3);justify-content:center;align-items:center;animation:.35s ease-out both intro-bg;display:flex;position:absolute;inset:0}.intro[hidden]{display:none}.intro.out{animation:.45s ease-in forwards intro-bg-out}.intro-card{color:#fff;text-align:center;transform-style:preserve-3d;flex-direction:column;align-items:center;gap:2px;padding:10px 14px 14px;font-family:Kanit,Trebuchet MS,sans-serif;font-style:italic;font-weight:900;line-height:1.35;animation:1.1s cubic-bezier(.2,1.4,.4,1) both intro-flip;display:flex;position:relative}.intro.out .intro-card{animation:.45s ease-in forwards intro-zoom}.intro-card span{letter-spacing:-.5px;white-space:nowrap;-webkit-text-stroke:.16em #111;paint-order:stroke fill;text-shadow:.025em .025em #111,.05em .05em #111,.075em .075em #111,.1em .1em #111,.125em .125em #111,.17em .24em .25em #00000080;display:block}.intro-l1{opacity:.95;font-size:clamp(18px,5.4vw,30px);animation:.6s .35s both intro-word}.intro-l2{font-size:clamp(26px,8.4vw,46px);animation:.7s .6s both intro-word}@keyframes intro-bg{0%{opacity:0}to{opacity:1}}@keyframes intro-bg-out{to{opacity:0}}@keyframes intro-flip{0%{opacity:0;transform:rotateX(85deg)rotateY(-25deg)scale(1.8)}60%{opacity:1}to{transform:rotateX(8deg)rotateY(-6deg)scale(1)}}@keyframes intro-zoom{to{opacity:0;transform:rotateX(0)scale(1.6)}}@keyframes intro-word{0%{opacity:0;filter:blur(4px);transform:translateZ(120px)scale(1.4)}to{opacity:1;filter:none;transform:none}}@media (prefers-reduced-motion:reduce){.intro,.intro-card,.intro-card span{animation:none!important}}