:root{color-scheme:light dark;--bg: #f3eee3;--surface: #fbf8f1;--surface-2: #ebe5d7;--ink: #22302b;--muted: #66716c;--line: #ddd5c4;--board: #fbf8f1;--grid: #dcd5c6;--target: #22302b;--draw: #1f7a61;--extra: #e0661f;--extra-text: #a84b14;--accent: #1f7a61;--accent-ink: #ffffff;--move: #23775f;--move-bg: #dbefe6;--turn: #5747b8;--turn-bg: #e6e2f8;--loop: #9a6406;--loop-bg: #f6e8c6;--pen: #5f6c67;--pen-bg: #e5e8e4;--shell: #4f9a5c;--shell-dark: #2f6b3c;--skin: #8cc58a;--shadow: 0 10px 30px rgba(34, 48, 43, .18);--radius: 14px;--font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", sans-serif}@media(prefers-color-scheme:dark){:root{--bg: #121816;--surface: #1a2220;--surface-2: #232d2a;--ink: #e6eee9;--muted: #93a19b;--line: #2d3935;--board: #171f1c;--grid: #3b4a44;--target: #e6eee9;--draw: #4fd3a3;--extra: #ff9652;--extra-text: #ff9652;--accent: #3cc391;--accent-ink: #0b1411;--move: #6dd6b2;--move-bg: #1d3830;--turn: #ada2f6;--turn-bg: #2a2746;--loop: #f1b748;--loop-bg: #3a2f18;--pen: #aab6b1;--pen-bg: #29322f;--shell: #5eb06b;--shell-dark: #2f6b3c;--skin: #9bd598;--shadow: 0 10px 30px rgba(0, 0, 0, .45)}}*{box-sizing:border-box}html,body{height:100%;margin:0}body{background:var(--bg);color:var(--ink);font:16px/1.35 var(--font);-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;overflow:hidden}button{font:inherit;color:inherit;border:0;background:none;padding:0;cursor:pointer;touch-action:manipulation;-webkit-user-select:none;user-select:none}button:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.icon{flex:none}#app,.app{height:100%}.app{display:flex;flex-direction:column;height:100vh;height:100dvh;max-width:1120px;margin:0 auto;padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}.preview-bar{flex:none;display:flex;align-items:center;gap:6px;padding:calc(6px + env(safe-area-inset-top)) 12px 6px;background:var(--loop-bg);color:var(--loop);font-size:13px}.preview-text{flex:1;min-width:0;text-align:center;line-height:1.3}.preview-nav,.preview-today{flex:none;display:inline-flex;align-items:center;justify-content:center;min-width:36px;min-height:32px;border-radius:9px;background:var(--surface);color:var(--loop);font-weight:750}.preview-today{padding:0 10px}.preview-nav:disabled{opacity:.35}.preview-bar+.top{padding-top:6px}.top{flex:none;display:flex;align-items:center;gap:6px;padding:calc(8px + env(safe-area-inset-top)) 16px 4px}.title{flex:1;min-width:0;display:flex;flex-direction:column}.brand{font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);white-space:nowrap}@media(max-width:370px){.brand{white-space:normal}}.puzzle-name{font-size:clamp(16px,4.8vw,20px);font-weight:750;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.par-pill{flex:none;padding:6px 10px;border-radius:999px;background:var(--ink);color:var(--bg);font-weight:700;font-size:15px;font-variant-numeric:tabular-nums}.lang-btn{flex:none;min-width:44px;min-height:36px;padding:0 10px;border-radius:10px;border:1px solid var(--line);font-size:13px;font-weight:700;color:var(--muted)}.main{flex:1;min-height:0;display:flex;flex-direction:column}.board-wrap{flex:1 1 auto;min-height:170px;display:flex;flex-direction:column;padding:0 16px}.board-frame{position:relative;flex:1;min-height:0;border-radius:var(--radius);border:1px solid var(--line);background:var(--board);overflow:hidden}.board{display:block;width:100%;height:100%}.status{flex:none;min-height:2.6em;margin:0;padding:6px 4px 2px;font-size:14px;line-height:1.3;color:var(--muted);text-align:center}.status--hint{color:var(--ink)}.panel{flex:none;display:flex;flex-direction:column;min-height:0}.grid-dot{fill:var(--grid)}.target line{stroke:var(--target);stroke-opacity:.18;stroke-width:11px;stroke-linecap:round;vector-effect:non-scaling-stroke}@media(prefers-color-scheme:dark){.target line{stroke-opacity:.22}}.start-mark{fill:none;stroke:var(--muted);stroke-width:1.5px;stroke-dasharray:3 3;vector-effect:non-scaling-stroke}.piece{stroke-width:4.5px;stroke-linecap:round;vector-effect:non-scaling-stroke}.piece.hit{stroke:var(--draw)}.piece.extra{stroke:var(--extra)}.ghost{opacity:.32}.board.is-matched .drawing .piece.hit{animation:glow 1.1s ease-out 1}@keyframes glow{0%{stroke-width:11px}to{stroke-width:4.5px}}.turtle .skin{fill:var(--skin)}.turtle .shell{fill:var(--shell)}.turtle .shell-line{fill:none;stroke:var(--shell-dark);stroke-width:.045;stroke-linejoin:round}.turtle .eye{fill:#1b2a22}.turtle.pen-up{opacity:.5}.card{display:grid;grid-template-columns:1fr auto;align-items:center;gap:6px 12px;margin:6px 16px 0;padding:10px 12px;border-radius:var(--radius);background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow);animation:pop .28s ease-out}@keyframes pop{0%{opacity:0;transform:translateY(10px) scale(.97)}}.card-title{font-size:13px;font-weight:700;color:var(--muted)}.card-grade{font-size:26px;font-weight:800;line-height:1.1}.card-side{text-align:right}.card-body{font-size:15px;font-weight:600;font-variant-numeric:tabular-nums}.card-scores{display:flex;justify-content:flex-end;gap:10px;font-size:13px;color:var(--muted)}.card-grade.is-good{color:var(--accent)}.card-actions{grid-column:1 / -1;display:grid;grid-template-columns:1.3fr auto 1fr;gap:8px}.card-actions--two{grid-template-columns:1fr auto}.card-btn,.card-icon-btn{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 10px;border-radius:10px;background:var(--surface-2);font-size:14px;font-weight:700}.card-icon-btn{min-width:44px}.share-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:42px;padding:0 14px;border-radius:10px;background:var(--accent);color:var(--accent-ink);font-weight:750}.link-btn{position:relative;display:inline-flex;align-items:center;gap:4px;margin-left:8px;padding:4px 8px;border-radius:8px;color:var(--accent);font-weight:700;vertical-align:middle}.link-btn:after{content:"";position:absolute;inset:-10px -6px}.link-btn:active{background:var(--surface-2)}.link-btn .icon{width:16px;height:16px}@media(min-width:860px),(orientation:landscape)and (max-height:500px)and (min-width:560px){.card{background:var(--bg)}}.panel-head{display:flex;align-items:baseline;gap:10px;padding:2px 16px 0}.count{flex:none;font-size:14px;color:var(--muted);font-variant-numeric:tabular-nums}.count b{color:var(--ink);font-size:17px}.rule{flex:1;min-width:0;font-size:12.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@media(max-width:340px){.rule{white-space:normal}}.mode-btn{flex:none;align-self:center;padding:4px 10px;border-radius:8px;border:1px solid var(--line);font-size:13px;font-weight:600}.clear-btn{display:inline-flex;align-items:center;padding:3px 7px;color:var(--muted)}.clear-btn svg{width:17px;height:17px}.desktop-only{display:none}@media(hover:hover)and (pointer:fine){.desktop-only{display:inline-flex}}.program{display:flex;flex-wrap:wrap;align-items:center;align-content:flex-start;gap:6px;min-height:60px;max-height:24vh;overflow-y:auto;padding:8px 16px 10px;cursor:text;position:relative;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.program.is-dragging{cursor:grabbing}.chip.is-dragged,.group.is-dragged{opacity:.35}.drop-line{position:absolute;width:3px;margin-left:-1.5px;border-radius:2px;background:var(--accent);pointer-events:none}.chip.drag-ghost{position:fixed;left:0;top:0;z-index:40;visibility:hidden;pointer-events:none;transition:none;box-shadow:var(--shadow)}.chip-more{opacity:.7}.program-empty{font-size:14px;color:var(--muted);padding:0 4px}.chip{display:inline-flex;align-items:center;gap:6px;min-height:38px;padding:0 11px;border-radius:10px;font-size:14px;font-weight:750;letter-spacing:.02em;transition:transform .12s ease,box-shadow .12s ease}.chip-n{font-variant-numeric:tabular-nums;font-weight:800}.chip-iter{padding:1px 6px;border-radius:6px;font-size:12px;background:var(--surface);color:var(--ink);font-variant-numeric:tabular-nums}.chip--move{background:var(--move-bg);color:var(--move)}.chip--turn{background:var(--turn-bg);color:var(--turn)}.chip--loop{background:var(--loop-bg);color:var(--loop)}.chip--pen{background:var(--pen-bg);color:var(--pen)}.chip.is-selected{box-shadow:0 0 0 2.5px var(--ink)}.chip.is-active{transform:scale(1.08);box-shadow:0 0 0 2.5px currentColor}.group{display:inline-flex;flex-wrap:wrap;align-items:center;gap:6px;max-width:100%;padding:4px 6px 4px 4px;border-radius:13px;border:1.5px solid var(--loop-bg);box-shadow:inset 4px 0 0 var(--loop-bg)}.group.is-running,.group.is-selected{border-color:var(--loop)}.group--tail{padding:4px 4px 4px 6px;box-shadow:inset -4px 0 0 var(--loop-bg)}.group-body{display:contents}.add-slot{min-width:38px;min-height:34px;border-radius:9px;border:1.5px dashed var(--loop);color:var(--loop);font-size:18px;font-weight:700;line-height:1}.add-slot.is-cursor{border-style:solid;background:var(--surface);box-shadow:inset 3px 0 0 var(--accent)}.add-slot--top{border-color:var(--muted);color:var(--muted)}.caret{width:3px;height:30px;border-radius:2px;background:var(--accent);animation:blink 1.1s steps(2,jump-none) infinite}@keyframes blink{50%{opacity:.2}}.palette{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;padding:6px 16px}.pal{min-height:46px;padding:2px 4px;border-radius:12px;font-size:13.5px;font-weight:750;letter-spacing:.02em;line-height:1.1;display:inline-flex;align-items:center;justify-content:center;text-align:center}.pal:active,.tray-btn:active,.preset:active,.key:active,.ctl:active{transform:scale(.96)}.pal--del{background:var(--surface-2);color:var(--ink)}.tray{display:flex;flex-direction:column;gap:8px;margin:2px 16px 0;padding:10px;border-radius:var(--radius);background:var(--surface);border:1px solid var(--line)}.tray-row{display:flex;align-items:center;gap:8px}.tray-kind{flex:1;min-width:0;display:inline-flex;align-items:center;min-height:44px;padding:0 12px;border-radius:10px;font-weight:800;letter-spacing:.02em}.stepper{display:flex;align-items:center;gap:6px}.stepper-value{min-width:64px;min-height:44px;border-radius:10px;border:1.5px solid var(--line);font-size:20px;font-weight:800;font-variant-numeric:tabular-nums}.stepper-value.is-typing{border-color:var(--accent)}.tray-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:44px;min-height:44px;padding:0 10px;border-radius:10px;background:var(--surface-2);font-size:14px;font-weight:700}.tray-actions .tray-btn--danger{margin-left:auto;color:var(--extra-text)}.tray-btn--done{background:var(--ink);color:var(--bg)}.presets{display:grid;grid-template-columns:repeat(6,1fr);gap:6px}.preset{min-height:40px;border-radius:10px;background:var(--surface-2);font-weight:700;font-variant-numeric:tabular-nums}.preset.is-on{background:var(--ink);color:var(--bg)}.keypad{display:grid;grid-template-columns:repeat(6,1fr);gap:6px}.key{display:inline-flex;align-items:center;justify-content:center;min-height:42px;border-radius:10px;background:var(--surface-2);font-size:18px;font-weight:700}.key--ok{background:var(--ink);color:var(--bg)}.text-editor{padding:8px 16px 0}.text-editor textarea{width:100%;min-height:120px;resize:vertical;padding:10px 12px;border-radius:12px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font:600 15px/1.5 ui-monospace,SF Mono,Menlo,Consolas,monospace}.text-hint,.text-error{margin:6px 2px 0;font-size:13px;color:var(--muted)}.text-error{color:var(--extra-text)}.controls{display:grid;grid-template-columns:1.15fr 1fr 1.5fr;gap:8px;padding:8px 16px calc(10px + env(safe-area-inset-bottom))}.ctl{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:52px;border-radius:14px;background:var(--surface-2);font-weight:700;font-size:15px}.ctl span{white-space:nowrap}@media(max-width:359px){.ctl{gap:4px;font-size:14px}}.ctl--run{background:var(--accent);color:var(--accent-ink);font-size:17px}@media(max-height:700px){.program{max-height:18vh;max-height:18svh}.board-wrap{min-height:130px}.tray{padding:8px;gap:6px}.preset{min-height:36px}.key{min-height:38px}.pal{min-height:42px}.ctl{min-height:48px}}@media(min-width:860px),(orientation:landscape)and (max-height:500px)and (min-width:560px){.main{flex-direction:row;gap:16px;padding:0 16px 16px}.board-wrap{flex:1 1 auto;padding:0}.panel{flex:0 0 min(390px,55%);overflow-y:auto;padding-top:8px;border-radius:var(--radius);border:1px solid var(--line);background:var(--surface)}.tray{background:var(--bg)}.program{flex:1;max-height:none}.rule{white-space:normal}}@media(orientation:landscape)and (max-height:500px){.brand{display:none}.top{padding-top:calc(4px + env(safe-area-inset-top))}.main{padding-bottom:8px}.program{min-height:44px}}.icon-btn{flex:none;display:inline-flex;align-items:center;justify-content:center;width:36px;height:38px;border-radius:10px;color:var(--ink)}.icon-btn:active{background:var(--surface-2)}.toast{position:fixed;left:50%;top:calc(12px + env(safe-area-inset-top));transform:translate(-50%);z-index:30;max-width:calc(100% - 32px - env(safe-area-inset-left) - env(safe-area-inset-right));padding:10px 16px;border-radius:12px;background:var(--ink);color:var(--bg);font-size:14px;font-weight:600;box-shadow:var(--shadow);animation:drop .22s ease-out}@keyframes drop{0%{opacity:0;transform:translate(-50%,-8px)}}.new-day{position:fixed;left:50%;top:calc(8px + env(safe-area-inset-top));transform:translate(-50%);z-index:25;display:flex;align-items:center;gap:12px;width:max-content;max-width:calc(100% - 32px - env(safe-area-inset-left) - env(safe-area-inset-right));padding:6px 6px 6px 14px;border-radius:12px;background:var(--ink);color:var(--bg);font-size:14px;font-weight:600;box-shadow:var(--shadow);animation:drop .22s ease-out}.new-day button{flex:none;min-height:36px;padding:0 14px;border-radius:9px;background:var(--accent);color:var(--accent-ink);font-weight:750}.modal-backdrop{position:fixed;inset:0;z-index:20;display:flex;align-items:flex-end;justify-content:center;background:#12181673;animation:fade .2s ease-out}@keyframes fade{0%{opacity:0}}.modal{width:min(440px,100%);max-height:92dvh;overflow-y:auto;padding:16px 16px calc(16px + env(safe-area-inset-bottom));border-radius:20px 20px 0 0;background:var(--surface);box-shadow:var(--shadow);animation:rise .25s ease-out}@keyframes rise{0%{transform:translateY(24px);opacity:0}}@media(min-width:600px){.modal-backdrop{align-items:center}.modal{border-radius:20px;padding-bottom:16px}}.modal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.modal h2{margin:0;font-size:18px}.modal h3{margin:16px 0 8px;font-size:14px;color:var(--muted)}.stat-numbers{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;text-align:center}.stat b{display:block;font-size:28px;font-weight:800;font-variant-numeric:tabular-nums}.stat span{font-size:12px;color:var(--muted)}.dist{display:flex;flex-direction:column;gap:6px}.dist-row{display:grid;grid-template-columns:84px 1fr;align-items:center;gap:8px;font-size:13px}.dist-label{color:var(--muted);font-weight:600}.dist-bar{display:inline-block;min-width:26px;padding:3px 8px;border-radius:6px;background:var(--surface-2);font-weight:700;text-align:right;font-variant-numeric:tabular-nums}.dist-bar.is-today{background:var(--accent);color:var(--accent-ink)}.modal-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:18px}.next{display:flex;flex-direction:column;font-size:12px;color:var(--muted)}.countdown{font-size:22px;font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums}.next-open{align-self:flex-start;min-height:36px;margin-top:4px;padding:0 14px;border-radius:9px;background:var(--accent);color:var(--accent-ink);font-size:14px;font-weight:750}.tut-board{height:min(36dvh,240px);border-radius:var(--radius);border:1px solid var(--line);background:var(--board);overflow:hidden}.tut-chips{display:flex;flex-wrap:wrap;align-items:center;gap:6px;min-height:52px;margin-top:10px}.tut-chips .group{padding:4px 6px 4px 4px}.tut-chips .group--tail{padding:4px 4px 4px 6px}.tut-text{min-height:3.2em;margin:10px 0 0;font-size:15px;line-height:1.4}.tut-foot{display:flex;align-items:center;justify-content:space-between;margin-top:12px}.tut-buttons{display:flex;gap:8px}.dots{display:flex;gap:6px}.dot{width:8px;height:8px;border-radius:50%;background:var(--line)}.dot.is-on{background:var(--accent)}