:root{--bg: #efeef5;--surface: #ffffff;--surface-2: #f6f5fb;--ink: #2b2735;--muted: #6c6780;--line: #dddae7;--accent: #34887e;--accent-ink: #ffffff;--accent-soft: #dcefeb;--warm: #e9993f;--danger: #d4566f;--cell: #fbfaff;--grid: #d8d4e5;--grid-major: #9d97b5;--hl: rgba(52, 136, 126, .1);--x-mark: #a7a1bb;--ring: rgba(40, 30, 60, .3);--shadow: 0 1px 2px rgba(43, 39, 53, .06), 0 6px 20px rgba(43, 39, 53, .06);--display: "Noto Serif TC", "Songti TC", "PMingLiU", serif;--body: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", system-ui, -apple-system, sans-serif;--num: "Manrope", "Helvetica Neue", Arial, system-ui, sans-serif;--radius: 18px;color-scheme:light}@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--bg: #15141c;--surface: #201e2a;--surface-2: #1a1923;--ink: #ebe8f4;--muted: #a29db6;--line: #34313f;--accent: #6cc4b6;--accent-ink: #10201d;--accent-soft: #1f3833;--warm: #f2b25f;--danger: #ef7d94;--cell: #26242f;--grid: #383545;--grid-major: #6b6683;--hl: rgba(108, 196, 182, .12);--x-mark: #6f6a84;--ring: rgba(255, 255, 255, .2);--shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 8px 24px rgba(0, 0, 0, .25);color-scheme:dark}}:root[data-theme=dark]{--bg: #15141c;--surface: #201e2a;--surface-2: #1a1923;--ink: #ebe8f4;--muted: #a29db6;--line: #34313f;--accent: #6cc4b6;--accent-ink: #10201d;--accent-soft: #1f3833;--warm: #f2b25f;--danger: #ef7d94;--cell: #26242f;--grid: #383545;--grid-major: #6b6683;--hl: rgba(108, 196, 182, .12);--x-mark: #6f6a84;--ring: rgba(255, 255, 255, .2);--shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 8px 24px rgba(0, 0, 0, .25);color-scheme:dark}*{box-sizing:border-box}[hidden]{display:none!important}html,body{height:100%}body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--body);font-size:15px;line-height:1.6;-webkit-tap-highlight-color:transparent;overscroll-behavior:none}#root{min-height:100%}button{font:inherit;color:inherit;cursor:pointer}button:disabled{cursor:default;opacity:.35}:focus-visible{outline:3px solid var(--accent);outline-offset:2px;border-radius:10px}h1,h2,h3{font-family:var(--display);margin:0;text-wrap:balance;letter-spacing:.02em}.tabular{font-family:var(--num);font-variant-numeric:tabular-nums}.eyebrow{font-size:12px;font-weight:700;letter-spacing:.1em;color:var(--accent)}.meta{font-size:13px;color:var(--muted)}.note{font-size:13px;color:var(--muted);text-align:center;margin:20px 0 0}.lead{color:var(--muted);margin:0 0 16px}.shell{max-width:560px;margin:0 auto;min-height:100%;display:flex;flex-direction:column;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));padding-block:calc(env(safe-area-inset-top,0px) + 12px) calc(env(safe-area-inset-bottom,0px) + 16px)}.shell main{flex:1}.brand{font-size:11px;color:var(--muted);text-align:center;padding-top:28px;opacity:.85}.topbar{display:flex;align-items:center;gap:8px;margin-bottom:16px}.topbar h1{flex:1;text-align:center;font-size:20px}.icon-btn-space{width:44px}.icon-btn{position:relative;width:44px;height:44px;display:grid;place-items:center;border:0;border-radius:14px;background:transparent;color:var(--ink);flex:none}.icon-btn:active:not(:disabled){background:var(--surface-2);transform:scale(.94)}.btn{border:0;border-radius:999px;min-height:46px;padding:0 22px;font-weight:700;background:var(--accent);color:var(--accent-ink);transition:transform .1s}.btn:active:not(:disabled){transform:scale(.97)}.btn.ghost{background:var(--surface-2);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line)}.btn.danger{background:var(--danger);color:#fff}.btn.ghost.danger{background:transparent;color:var(--danger);box-shadow:inset 0 0 0 1px var(--danger)}.home{display:flex;flex-direction:column;gap:14px}.home-head{display:flex;align-items:center;gap:14px;padding:8px 0 10px}.home-head>div:nth-child(2){flex:1;min-width:0}.home-head h1{font-size:26px;font-weight:900;line-height:1.2}.sub{margin:2px 0 0;color:var(--muted);font-size:13px}.logo{display:grid;grid-template-columns:repeat(3,12px);gap:3px;flex:none}.logo i{width:12px;height:12px;border-radius:3px;border:2px solid}.card{display:flex;align-items:center;gap:14px;width:100%;text-align:left;border:0;border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow);padding:14px 16px;transition:transform .12s}.card:active{transform:scale(.985)}.card-text{display:flex;flex-direction:column;flex:1;min-width:0;line-height:1.35;gap:2px}.card-text strong{font-family:var(--display);font-size:17px}.go{width:40px;height:40px;border-radius:50%;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;flex:none}.resume-art{width:64px;height:64px;display:grid;place-items:center;background:var(--surface-2);border-radius:12px;flex:none}.daily-date{width:64px;height:64px;border-radius:14px;flex:none;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1;background:var(--warm);color:#fff}.daily-date span{font-size:12px;font-weight:700}.daily-date strong{font-size:28px;font-weight:900}.daily.done .daily-date{background:var(--accent)}.menu-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.tile{border:0;border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow);padding:16px 8px 14px;display:flex;flex-direction:column;align-items:center;gap:4px;line-height:1.3;color:var(--ink)}.tile svg{color:var(--accent);margin-bottom:4px}.tile strong{font-family:var(--display);font-size:15px}.tile span{font-size:12px;color:var(--muted)}.tile:active{transform:scale(.97)}.howto{background:var(--surface-2);border-radius:var(--radius);padding:16px 18px;box-shadow:inset 0 0 0 1px var(--line)}.howto h2{font-size:16px;margin-bottom:6px}.howto ul{margin:0;padding-left:1.1em;display:flex;flex-direction:column;gap:4px;font-size:14px;color:var(--muted)}.chapters{display:flex;flex-direction:column;gap:26px}.chapter{display:flex;flex-direction:column;gap:12px}.chapter-head{display:flex;align-items:center;gap:12px}.chapter-head>div{flex:1;min-width:0;line-height:1.3}.chapter-head h2{font-size:19px}.chapter-head p{margin:2px 0 0;font-size:13px;color:var(--muted)}.chapter-no{font-size:13px;font-weight:800;color:var(--accent);border:1.5px solid currentColor;border-radius:8px;padding:2px 6px}.chapter-count{font-size:13px;font-weight:700;color:var(--muted)}.chapter-count.full{color:var(--accent)}.level-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:10px}.level{position:relative;border:0;border-radius:16px;background:var(--surface);box-shadow:var(--shadow);padding:22px 6px 10px;display:flex;flex-direction:column;align-items:center;gap:4px;line-height:1.25;min-width:0}.level-no{position:absolute;top:7px;left:9px;font-size:11px;color:var(--muted);font-weight:800}.level-art{width:68px;height:68px;display:grid;place-items:center}.level strong{font-family:var(--display);font-size:14px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.level .meta{font-size:12px}.level.done{box-shadow:var(--shadow),inset 0 0 0 2px var(--accent-soft)}.level.started strong{color:var(--warm);font-family:var(--body);font-size:13px}.stars{color:var(--warm);letter-spacing:1px;font-size:11px}.tier-list{display:flex;flex-direction:column;gap:10px}.tier{display:flex;align-items:center;gap:14px;border:0;border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow);padding:14px 16px;text-align:left}.tier:active{transform:scale(.985)}.tier-dots{display:grid;grid-template-columns:repeat(5,7px);gap:3px;flex:none}.tier-dots i{width:7px;height:18px;border-radius:3px;background:var(--line)}.tier-dots i.on{background:var(--accent)}.count{font-size:12px;color:var(--accent);font-weight:800;flex:none}.code-form{margin-top:22px;display:flex;flex-direction:column;gap:8px}.code-form label{font-weight:700;font-size:14px}.code-row{display:flex;gap:8px}.code-row input{flex:1;min-width:0;height:46px;border-radius:14px;border:1px solid var(--line);background:var(--surface);color:var(--ink);padding:0 14px;font-family:var(--num);font-size:16px;letter-spacing:.06em}.error{color:var(--danger);font-size:13px;margin:0}.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:10px}.frame{aspect-ratio:1;max-width:100%;border:0;border-radius:14px;background:var(--surface);box-shadow:var(--shadow);display:grid;place-items:center;padding:6px}.empty{display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center;padding:40px 12px;color:var(--muted)}.settings{display:flex;flex-direction:column;gap:4px}.settings h2{font-size:14px;color:var(--muted);margin:18px 0 4px;letter-spacing:.08em}.settings>.btn{margin-top:8px}.toggle,.slider{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:54px;padding:8px 14px;background:var(--surface);border-radius:14px;cursor:pointer;position:relative}.toggle span,.slider span{display:flex;flex-direction:column;line-height:1.35}.toggle small{color:var(--muted);font-size:12px}.toggle input{position:absolute;opacity:0;pointer-events:none}.toggle i{width:48px;height:28px;border-radius:999px;background:var(--line);position:relative;flex:none;transition:background .2s}.toggle i:after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #0003;transition:transform .2s}.toggle input:checked+i{background:var(--accent)}.toggle input:checked+i:after{transform:translate(20px)}.toggle input:focus-visible+i{outline:3px solid var(--accent);outline-offset:2px}.slider input{width:50%;accent-color:var(--accent)}.seg{display:grid;grid-template-columns:repeat(3,1fr);background:var(--surface);border-radius:14px;padding:4px;gap:4px}.seg button{border:0;background:transparent;border-radius:10px;min-height:42px;font-size:14px}.seg button.on{background:var(--accent-soft);color:var(--accent);font-weight:700}.confirm{background:var(--surface);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:10px}.confirm p{margin:0;font-size:14px}.play{position:fixed;inset:0;display:flex;flex-direction:column;background:var(--bg);padding-top:env(safe-area-inset-top,0px);padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px);user-select:none;-webkit-user-select:none}.play-top{display:flex;align-items:center;gap:2px;padding:6px 8px}.play-title{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.25;padding:0 4px}.play-title strong{font-family:var(--display);font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.play-title span{font-size:12px;color:var(--muted)}.hint-btn{color:var(--warm)}.badge{position:absolute;top:4px;right:3px;min-width:16px;height:16px;padding:0 4px;border-radius:8px;background:var(--warm);color:#fff;font-size:10px;font-weight:800;line-height:16px;font-family:var(--num)}.board-area{flex:1;min-height:0;overflow:auto;position:relative;display:grid;place-items:center;padding:6px}.board{display:grid;touch-action:none;position:relative;margin:auto}.b-corner{position:sticky;top:0;left:0;z-index:3;background:var(--bg);display:grid;place-items:center}.corner-art{border-radius:4px;background:var(--cell);box-shadow:0 0 0 1px var(--grid)}.b-colclue,.b-rowclue{display:flex;gap:1px;background:var(--bg);z-index:2;transition:opacity .25s}.b-colclue{position:sticky;top:0;flex-direction:column;justify-content:flex-end;align-items:center;padding-bottom:4px}.b-rowclue{position:sticky;left:0;justify-content:flex-end;align-items:center;padding-right:4px}.clue{display:grid;place-items:center;border-radius:calc(var(--slot) * .24);box-shadow:inset 0 0 0 1px var(--ring);font-family:var(--num);font-weight:800;font-size:max(9px,calc(var(--slot) * .56));line-height:1;flex:none}.clue.two{font-size:max(8px,calc(var(--slot) * .46));letter-spacing:-.03em;padding:0 1px}.clue.zero{color:var(--muted);font-weight:700;box-shadow:none}.b-colclue.hl,.b-rowclue.hl{background:color-mix(in srgb,var(--accent) 12%,var(--bg));border-radius:8px}.b-colclue.sat .clue,.b-rowclue.sat .clue{opacity:.28}.b-colclue.pop,.b-rowclue.pop{animation:pop .6s ease-out}@keyframes pop{0%{transform:scale(1)}35%{transform:scale(1.12)}to{transform:scale(1)}}.b-cell{background:var(--cell);box-shadow:inset -1px -1px 0 var(--grid);position:relative}.b-cell.c5{box-shadow:inset -2px -1px 0 var(--grid-major)}.b-cell.r5{box-shadow:inset -1px -2px 0 var(--grid-major)}.b-cell.c5.r5{box-shadow:inset -2px -2px 0 var(--grid-major)}.b-cell.hl:not(.f){background:color-mix(in srgb,var(--accent) 9%,var(--cell))}.b-cell.f{animation:fillin .14s ease-out}.b-cell.f:after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 1px var(--ring),inset 0 -2px #00000014,inset 0 2px #ffffff38}@keyframes fillin{0%{transform:scale(.7);border-radius:30%}to{transform:scale(1)}}.b-cell.x:before,.b-cell.x:after{content:"";position:absolute;left:26%;right:26%;top:50%;height:2px;margin-top:-1px;background:var(--x-mark);border-radius:2px}.b-cell.x:before{transform:rotate(45deg)}.b-cell.x:after{transform:rotate(-45deg)}.b-cell.err{animation:err .5s ease-out;z-index:1}@keyframes err{0%,to{transform:translate(0);background:var(--cell)}15%{background:var(--danger);transform:translate(-3px)}35%{transform:translate(3px)}55%{transform:translate(-2px);background:color-mix(in srgb,var(--danger) 50%,var(--cell))}}.b-cell.hinted{z-index:1;animation:hinted 1.4s ease-out}@keyframes hinted{0%{box-shadow:0 0 0 0 var(--warm)}30%{box-shadow:0 0 0 5px var(--warm)}to{box-shadow:0 0 0 0 transparent}}.toast{position:absolute;left:50%;top:10px;transform:translate(-50%);z-index:5;background:var(--ink);color:var(--bg);padding:6px 14px;border-radius:999px;font-size:13px;font-weight:700;white-space:nowrap;pointer-events:none;animation:toast 2.2s ease-out forwards}@keyframes toast{0%{opacity:0;transform:translate(-50%,-6px)}10%,80%{opacity:1;transform:translate(-50%)}to{opacity:0}}.bubble{position:fixed;z-index:20;pointer-events:none;transform:translate(-50%,-150%);min-width:36px;height:36px;padding:0 10px;border-radius:18px;display:grid;place-items:center;font-weight:900;font-size:18px;box-shadow:0 4px 14px #0003}.play-bottom{display:flex;flex-direction:column;gap:2px;padding:2px 10px calc(env(safe-area-inset-bottom,0px) + 10px);background:var(--surface);box-shadow:0 -1px 0 var(--line)}.actions{display:flex;align-items:center;justify-content:flex-end;gap:2px}.actions .zoom-btn{margin-right:auto}.play.left .actions{flex-direction:row-reverse}.play.left .actions .zoom-btn{margin-right:0;margin-left:auto}.tools{display:flex;justify-content:center;gap:8px;min-width:0;overflow-x:auto;padding:6px 2px 2px;scrollbar-width:none}.tools::-webkit-scrollbar{display:none}.pot{width:46px;height:46px;flex:none;border-radius:50%;border:0;padding:0;background:var(--surface-2);display:grid;place-items:center;position:relative;transition:transform .15s}.pot-fill{width:34px;height:34px;border-radius:50%;background:var(--pot);box-shadow:inset 0 0 0 1px var(--ring),inset 0 -3px #0000001f;transition:transform .15s}.pot.on{box-shadow:0 0 0 3px var(--surface),0 0 0 5px var(--ink);transform:translateY(-3px)}.pot.on .pot-fill{transform:scale(1.08)}.xpot{color:var(--muted)}.xpot.on{color:var(--ink)}.sheet-wrap{position:fixed;inset:0;z-index:30;background:#14121c73;display:flex;align-items:flex-end;justify-content:center;animation:fade .2s}.sheet{width:100%;max-width:520px;background:var(--bg);border-radius:22px 22px 0 0;padding:20px max(16px,env(safe-area-inset-left,0px)) calc(env(safe-area-inset-bottom,0px) + 20px);display:flex;flex-direction:column;gap:8px;animation:up .25s ease-out}.sheet.center{align-items:center;text-align:center}.sheet h3{font-size:18px;margin-bottom:6px}.sheet-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:8px;width:100%}@keyframes fade{0%{opacity:0}}@keyframes up{0%{transform:translateY(40px);opacity:0}}.play.won .board-area .b-colclue,.play.won .board-area .b-rowclue,.play.won .b-corner{opacity:.15}.play.won .b-cell{box-shadow:none;transition:box-shadow .6s}.play.won .b-cell.x:before,.play.won .b-cell.x:after{opacity:0;transition:opacity .4s}.win{position:fixed;inset:0;z-index:25;display:flex;align-items:flex-end;justify-content:center;background:linear-gradient(to bottom,transparent 20%,color-mix(in srgb,var(--bg) 85%,transparent) 55%);animation:fade .6s .5s both}.win-card{width:100%;max-width:440px;margin:0 12px calc(env(safe-area-inset-bottom,0px) + 14px);background:var(--surface);border-radius:26px;box-shadow:var(--shadow);padding:22px 20px 18px;display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;animation:up .5s .6s ease-out both}.win-art{padding:14px;background:var(--surface-2);border-radius:18px;box-shadow:inset 0 0 0 1px var(--line);animation:shine 1.2s .9s ease-out both}@keyframes shine{0%{transform:scale(.8) rotate(-4deg);opacity:0}60%{transform:scale(1.04) rotate(1deg)}to{transform:none;opacity:1}}.win-card h2{font-size:22px}.perfect{margin:0;color:var(--warm);font-weight:900;font-family:var(--display);letter-spacing:.15em}.win-stats{display:grid;grid-template-columns:repeat(3,1fr);width:100%;margin:4px 0}.win-stats div{display:flex;flex-direction:column}.win-stats dt{font-size:12px;color:var(--muted);font-family:var(--body)}.win-stats dd{margin:0;font-size:20px;font-weight:800;display:flex;flex-direction:column;align-items:center;line-height:1.2}.win-stats em{font-style:normal;font-size:11px;color:var(--warm);font-family:var(--body)}.share{margin:0;font-size:13px;color:var(--muted)}.share code{font-family:var(--num);font-weight:800;color:var(--ink);background:var(--surface-2);padding:2px 8px;border-radius:6px;user-select:all}.win-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;width:100%;margin-top:6px}.win-actions .btn:only-child{grid-column:1 / -1}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-delay:0ms!important;transition:none!important}}@media(min-width:700px){.play-bottom{align-items:center}.actions{width:100%;max-width:520px}}@media(max-width:400px){.tools{gap:6px}.pot{width:44px;height:44px}.pot-fill{width:32px;height:32px}}