:root{color-scheme:light;--ink:#285746;--teal:#267c75;--cream:#fffdf2;--wood:#dfbc83;--edge:#b18b54}
body[data-dm-site-theme="game"]{color:var(--ink);font-family:"BIZ UDPGothic","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif}
body[data-dm-site-theme="game"] #main-content button.primary{background:var(--teal);border-color:#216963;color:white;box-shadow:0 4px 0 #195b55;border-radius:14px;white-space:nowrap}
body[data-dm-site-theme="game"] #main-content button.primary:hover:not(:disabled){background:#1f6d66}
*{box-sizing:border-box}body{margin:0;color:var(--ink);font-family:"BIZ UDPGothic","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;background:#e7efcf url('./assets/forest.webp') center center/cover fixed;line-height:1.65}button,input{font:inherit}button{min-height:46px;border:1px solid #a5bda1;border-radius:14px;padding:10px 18px;color:var(--ink);background:#fffef5;cursor:pointer;font-weight:700;box-shadow:0 2px 0 #6c856d1c}button:hover{background:#f0f5df}button:disabled{opacity:.5;cursor:default}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #ac600d;outline-offset:3px}button.primary{background:var(--teal);border-color:#216963;color:white;box-shadow:0 4px 0 #195b55}button.primary:hover{background:#1f6d66}a{color:#1c706d}h1,h2,p{margin-top:0}h2{font-size:1.35rem}main{max-width:1080px;padding:24px 24px 48px;margin:auto;min-height:calc(100vh - 140px)}.title{text-align:center;position:relative;margin:0 auto 24px}.title p{font-weight:700;letter-spacing:.12em;margin:0;font-size:13px}.title h1{font-size:clamp(32px,5vw,48px);letter-spacing:.08em;margin:0;text-shadow:0 2px white,2px 0 white,-2px 0 white}.panel{background:#fffdf3f5;border:1px solid #cdbb93;border-radius:24px;padding:28px;box-shadow:0 6px 0 #ad976525,0 12px 30px #42603910}.home{max-width:900px;margin:auto;text-align:center}.lead{font-size:24px;font-weight:700}.example{display:flex;justify-content:center;align-items:center;gap:12px;margin:20px}.example span{background:#fff2b7;border:2px solid #d8bb70;border-radius:14px;font-size:32px;font-weight:700;width:62px;line-height:62px;box-shadow:0 4px #d8bb7040}.example i{font-style:normal}.example b{font-size:22px}.modes{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:24px 0}.modes article{background:#f3f2df;border-radius:18px;padding:22px;display:flex;flex-direction:column;align-items:center}.modes h2{margin:12px 0}.modes button{margin-top:auto;width:100%}.tag{font-size:13px;font-weight:700;color:#537246}.small{font-size:13px;line-height:1.8}.consent{display:flex;gap:8px;text-align:left;align-items:center;font-size:14px;min-height:44px}.consent input{width:21px;height:21px;flex-shrink:0}.home details{text-align:left;margin-top:24px}summary{cursor:pointer;min-height:44px;padding:8px}.status:empty{display:none}.mobile-break{display:none}
.play-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:15px}.play-heading h2{margin:0}.play-heading button{font-size:13px}.game-layout{display:grid;grid-template-columns:minmax(0,570px) minmax(230px,1fr);grid-template-areas:'board stats' 'board found' 'answer found';gap:20px 28px;align-items:start;max-width:960px;margin:auto}.stats{grid-area:stats;display:flex;gap:12px}.stat{flex:1;min-width:0;text-align:center;background:linear-gradient(110deg,#f7e7c5,#fff6df 50%,#efd8ac);border:2px solid #c3a06b;border-radius:16px;padding:12px 6px;box-shadow:0 4px #ad8c5630}.stat span{font-size:14px;display:block;font-weight:700}.stat strong{font-size:32px;white-space:nowrap;line-height:1.4}.stat small{font-size:14px;margin-left:4px}.stat b{font-weight:inherit}#time.low{color:#aa3e25}.board-frame{grid-area:board;position:relative;padding:18px;border:2px solid #bb9868;border-radius:24px;background:repeating-linear-gradient(2deg,#ead0a0 0px,#efdab4 10px,#e5c89a 13px,#f0dbb3 18px);box-shadow:inset 0 2px 1px #fff6dd,0 7px 0 #bb9561,0 12px 18px #48653223}.board{display:grid;grid-template-columns:repeat(var(--size,4),1fr);gap:10px;background:#b7c49c;padding:10px;border-radius:14px;touch-action:none;user-select:none;position:relative}.cell{aspect-ratio:1;min-height:0;min-width:0;padding:0;position:relative;border:2px solid #d1bf91;background:linear-gradient(#fffef4,#fff6dc);border-radius:12px;box-shadow:0 4px 0 #a5946d;line-height:1;font-size:clamp(25px,4.5vw,43px);font-weight:800;z-index:2}.cell:focus-visible{outline:2px solid #ac600d;outline-offset:2px}.cell.selected{background:#ffe489;border-color:#b7891d;box-shadow:0 5px #b28a25,inset 0 0 0 2px #fff5bb;transform:translateY(-2px)}.cell .order{position:absolute;left:5px;top:4px;font-size:11px;line-height:1;border-radius:50%;color:#fff;background:#926c17;width:16px;height:16px;padding-top:2px}.cell.hint{outline:3px dashed #916615;outline-offset:-5px}.cell:disabled{opacity:1;color:var(--ink)}#path-line{position:absolute;inset:18px;z-index:3;width:calc(100% - 36px);height:calc(100% - 36px);pointer-events:none;overflow:visible}#path-line polyline{stroke:#c08a24;stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round;opacity:.65}#countdown{position:absolute;inset:0;z-index:4;border-radius:22px;background:#fffdefdd;display:flex;align-items:center;justify-content:center;font-size:60px;font-weight:800}#countdown[hidden]{display:none}.answer-area{grid-area:answer;display:grid;gap:10px;text-align:center}.selection-display{border:1px solid #cdbb93;border-radius:14px;background:#fffdf2f2;padding:10px;min-height:78px}.selection-display span{display:block;font-size:12px}.selection-display strong{display:block;font-size:23px;letter-spacing:.12em;overflow-wrap:anywhere}.answer-area>.primary{font-size:22px;min-height:55px}.undo{display:flex;gap:10px}.undo button{flex:1;padding:9px 6px;font-size:14px}.feedback{min-height:3.3em;font-size:14px;margin:0;background:#fffef0cf;border-radius:12px;padding:6px 12px}.feedback.correct{color:#216044;font-weight:700}.found{grid-area:found;min-height:200px;padding:20px;align-self:stretch}.found h2{font-size:18px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #dbd9bb;padding-bottom:12px}.found h2 span{border-radius:50%;background:#e7edcf;min-width:32px;text-align:center}.found ul{padding:0;list-style:none;margin:0;max-height:330px;overflow:auto}.found li{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px dashed #d5d8bf;gap:8px;font-size:16px}.found li small{font-size:12px}.score-guide{margin:20px 0 0;border-top:1px solid #dedfca;padding-top:12px}.result,.ranking{max-width:660px;margin:auto}.result{text-align:center}.result-score{font-size:52px;font-weight:800;margin:10px 0}.result dl{text-align:left}.result dl div{display:flex;justify-content:space-between;gap:20px;padding:10px;border-bottom:1px solid #dfdfc5}.result dd{margin:0;font-weight:700}.result-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:24px}#new-best{color:#805e19;font-weight:700;animation:best .6s ease-out}#practice-tools{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;font-size:13px}.ranking ol{padding:0;list-style:none}.ranking li{display:flex;justify-content:space-between;gap:15px;border-bottom:1px solid #dddcc4;padding:15px 0}.ranking li span{overflow-wrap:anywhere}.mine{padding:15px;border-radius:12px;background:#e9f1de}.ranking #ranking-content{min-height:100px}dialog{width:min(850px,calc(100% - 24px));max-height:88dvh;border:1px solid #b5bb99;background:#fffdf2;border-radius:24px;color:var(--ink);padding:22px}dialog::backdrop{background:#243d3899}dialog>header{display:flex;align-items:center;justify-content:space-between;gap:10px}dialog h2{margin:0;font-size:20px}dialog>header button{flex-shrink:0}.review-layout{display:grid;grid-template-columns:1fr 1fr;gap:22px}.review-board{display:grid;grid-template-columns:repeat(var(--size),1fr);gap:6px;background:#cbd0ab;padding:9px;border-radius:12px}.review-board span{aspect-ratio:1;display:grid;place-items:center;background:#fff9e7;border-radius:6px;font-size:25px;position:relative}.review-board span.selected{background:#ffe489;outline:2px solid #b68c23}.review-board small{position:absolute;top:1px;left:4px;font-size:10px}.review-layout p{margin:12px 0}#answer-list{display:flex;flex-wrap:wrap;gap:8px;align-content:start;max-height:45vh;overflow:auto}#answer-list button{font-size:14px;padding:8px 12px}#answer-list button[aria-pressed=true]{background:#dcecca;border:2px solid #4b8061}footer{background:#fffdf1c9;padding:22px;display:flex;justify-content:center;gap:30px;font-size:13px}[hidden]{display:none!important}@keyframes best{from{transform:scale(.94);opacity:.4}to{transform:scale(1);opacity:1}}
@media(max-width:700px){body{background-image:url('./assets/forest-mobile.webp');background-attachment:scroll}main{padding:18px 12px 30px}.title{margin-bottom:18px}.title h1{font-size:32px}.title p{font-size:10px}.panel{padding:20px 16px;border-radius:18px}.modes{grid-template-columns:1fr;gap:16px}.modes article{padding:20px}.home>.lead{font-size:21px}.mobile-break{display:initial}.home>p{font-size:14px}.play-heading{margin-bottom:12px}.play-heading h2{font-size:16px}.game-layout{grid-template-columns:minmax(0,1fr);grid-template-areas:'stats' 'board' 'answer' 'found';gap:14px;max-width:470px}.stats{gap:12px}.stat{padding:5px;display:flex;align-items:center;justify-content:center;gap:12px}.stat span{font-size:12px}.stat strong{font-size:26px}.board-frame{padding:10px;border-radius:18px}.board{gap:7px;padding:7px;border-radius:10px}.cell{font-size:30px;border-radius:10px}.cell .order{font-size:9px;width:13px;height:13px;left:3px;top:3px}#path-line{inset:10px;width:calc(100% - 20px);height:calc(100% - 20px)}.selection-display{min-height:64px;padding:6px}.selection-display strong{font-size:21px}.answer-area{gap:8px}.answer-area>.primary{font-size:20px;min-height:51px}.feedback{font-size:13px}.found{min-height:150px}.found ul{max-height:220px}.result-actions{grid-template-columns:1fr}.review-layout{grid-template-columns:1fr}.review-board{max-width:300px;margin:auto}.review-board span{font-size:22px}#answer-list{max-height:none}dialog{padding:18px 14px}.result dl div{font-size:14px}.result-score{font-size:44px}}
@media(min-width:701px){.game-layout{grid-template-columns:minmax(0,460px) minmax(230px,1fr);max-width:820px}.found{align-self:start;min-height:260px}.title{margin-bottom:16px}.title h1{font-size:40px}.play-heading{max-width:820px;margin-left:auto;margin-right:auto}}
body:has(#play:not([hidden])) .title p{display:none}
body:has(#play:not([hidden])) .title h1{font-size:32px}
@media(min-width:701px){.answer-area{grid-template-columns:minmax(0,1fr)}.answer-area .selection-display{min-height:62px;padding:6px}.answer-area>.primary{grid-column:2;grid-row:1;font-size:20px;padding:10px 8px}.answer-area>.undo,.answer-area>.feedback,.answer-area>#practice-tools{grid-column:1/-1}}
@media(min-width:701px) and (max-height:850px){.game-layout{grid-template-columns:minmax(0,320px) minmax(230px,1fr);max-width:680px;gap:14px 24px}.board-frame{padding:12px}.board{padding:7px;gap:7px}.cell{font-size:30px}#path-line{inset:12px;width:calc(100% - 24px);height:calc(100% - 24px)}.play-heading{max-width:680px;margin-bottom:10px}.title{margin-bottom:10px}main{padding-top:12px}.feedback{min-height:2.8em;padding:4px 8px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;scroll-behavior:auto!important}}
.board{overflow:hidden}
.cell.clearing{animation:letter-clear 140ms ease-in forwards}
.cell.falling{animation:letter-fall 180ms ease-out both}
.cell.rearranged{animation:letter-arrive 180ms ease-out both}
@keyframes letter-clear{to{opacity:0;transform:scale(.65)}}
@keyframes letter-fall{from{transform:translateY(var(--drop-y))}to{transform:translateY(0)}}
@keyframes letter-arrive{from{opacity:.3}to{opacity:1}}
#review-scenes{display:flex;align-items:center;gap:12px;margin-bottom:16px;flex-wrap:wrap}
#review-scene{font:inherit;min-height:44px;max-width:100%;color:var(--ink);background:var(--cream);border:1px solid #a5bda1;border-radius:10px;padding:8px}

.input-help{margin:0;font-size:15px;font-weight:700;line-height:1.6;padding:6px 10px;border-radius:12px;background:#fffdf2e8}.input-help small{display:block;font-size:12px;font-weight:400}.answer-area>.input-help{grid-column:1/-1}

footer{flex-wrap:wrap;gap:12px 24px}

.home-actions{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:10px;margin-bottom:12px}.play-heading{flex-wrap:wrap;gap:8px}.play-actions{display:flex;gap:6px;flex-shrink:0}.play-actions button{font-size:12px;padding:8px 9px;min-height:44px}[data-sound-toggle]{white-space:nowrap}[data-sound-toggle][aria-pressed="true"]{background:#e2efd5;border-color:#527e55}

.ranking-period{display:flex;gap:.65rem;margin:1rem 0}.ranking-period button{min-width:5rem}.ranking-period button[aria-pressed="true"]{background:#257974;color:#fff;border-color:#175b57}