:root{--edge-top:max(12px, env(safe-area-inset-top));--edge-left:max(12px, env(safe-area-inset-left));--edge-right:max(12px, env(safe-area-inset-right));--bg:#f5efe6;--ink:#222;--muted:#6b6258;--accent:#e0662a;--panel:#fffaf2;--line:#d9cfc2;--mark:#a63a0a;--edge:#1d1a17;color:var(--ink);background:var(--bg);font-family:system-ui,-apple-system,Segoe UI,sans-serif}*{box-sizing:border-box}body{margin:0}button{font:inherit;color:inherit;cursor:pointer}button,a,.board{touch-action:manipulation}button:disabled{opacity:.4;cursor:default}.home,.screen{--pad-t:max(16px, env(safe-area-inset-top));--pad-l:max(16px, env(safe-area-inset-left));--pad-r:max(16px, env(safe-area-inset-right));max-width:480px;padding:var(--pad-t) var(--pad-r) max(24px, env(safe-area-inset-bottom)) var(--pad-l);flex-direction:column;gap:10px;margin:0 auto;display:flex}.home{min-height:100dvh}.home-top{justify-content:space-between;align-items:center;display:flex}.streak{border:1px solid var(--line);background:var(--panel);min-width:44px;height:44px;color:var(--mark);border-radius:12px;align-items:center;gap:4px;padding:0 12px;font-size:18px;font-weight:700;display:inline-flex}.home-left{align-items:center;gap:8px;display:flex}.shop{border:1px solid var(--line);background:var(--panel);width:44px;height:44px;color:var(--ink);border-radius:12px;justify-content:center;align-items:center;padding:0;font-size:18px;font-weight:700;display:inline-flex}.hints-have{color:var(--muted)}.hints-note{color:var(--mark);font-weight:700}.brand{text-align:center;margin:32px 0 auto}.brand h1{margin:0;font-family:Georgia,Times New Roman,serif;font-size:34px;line-height:1.1}.brand .mascot{border-radius:50%;width:160px;height:160px;margin:0 auto 8px;display:block}.brand p{color:var(--muted);margin:8px 0 0;font-size:16px}.gift-claim{border:2px dashed var(--mark);min-height:48px;color:var(--mark);background:#fff6e8;border-radius:12px;justify-content:center;align-items:center;gap:8px;font-size:16px;font-weight:700;display:flex}.gift-wait{min-height:48px;color:var(--muted);justify-content:center;align-items:center;gap:8px;margin:0;font-size:14px;display:flex}.gift-time{font-variant-numeric:tabular-nums;color:var(--ink);font-weight:700}.eyebrow{letter-spacing:.08em;text-transform:uppercase;color:var(--mark);font-size:11px;font-weight:700}.resume{border:2px solid var(--accent);background:var(--panel);color:var(--ink);border-radius:14px;grid-template-columns:1fr auto;gap:2px 8px;padding:12px 14px;text-decoration:none;display:grid}.resume .meta{color:var(--muted);text-align:right;font-size:13px}.resume b{grid-column:1/-1;font-size:17px}.resume .progress{grid-column:1/-1;align-items:center;gap:8px;font-size:13px;display:flex}.resume-go{border:2px solid var(--mark);min-height:40px;color:var(--mark);background:#fff;border-radius:10px;grid-column:1/-1;justify-content:center;align-items:center;gap:6px;margin-top:8px;font-size:15px;font-weight:700;display:flex}.primary{background:var(--mark);color:#fff;text-align:center;border-radius:14px;min-height:52px;padding:14px 16px;font-size:18px;font-weight:700;text-decoration:none;display:block}.resume .progress .bar{flex:1}.bar{background:#f0d9c8;border-radius:3px;height:6px;display:block;overflow:hidden}.bar i{background:var(--mark);height:100%;display:block}.screen-head,.top,.howto-top,.brief-top{margin:calc(var(--edge-top) - var(--pad-t)) calc(var(--edge-right) - var(--pad-r)) 0 calc(var(--edge-left) - var(--pad-l))}.screen-head>.icon:first-child,.top>.icon:first-child,.howto-top>.icon:first-child,.brief-top>.icon:first-child{align-self:flex-start}.screen-head{align-items:center;gap:10px;display:flex}.screen-head .icon{color:var(--ink);justify-content:center;align-items:center;text-decoration:none;display:inline-flex}.screen-head .heading{flex-direction:column;flex:1;min-width:0;display:flex}.screen-head .eyebrow{color:var(--muted)}.screen-head h1{margin:0;font-family:Georgia,Times New Roman,serif;font-size:24px}.screen-head .count{color:#2f6b2b;white-space:nowrap;background:#dcebd6;border-radius:12px;align-items:center;gap:4px;padding:4px 10px;font-size:13px;font-weight:700;display:inline-flex}.tile{border:1px solid var(--line);background:var(--panel);min-height:44px;color:var(--ink);border-radius:14px;flex-direction:column;gap:4px;padding:14px;text-decoration:none;display:flex}.tile-title{font-family:Georgia,Times New Roman,serif;font-size:18px}.tile-meta{color:var(--muted);justify-content:space-between;font-size:13px;display:flex}.soon,.empty{text-align:center;color:var(--muted);font-size:14px}.tile.folder{background:0 0;border:none;border-radius:0;min-height:0;padding:26px 0 0;display:block;position:relative}.folder-tab{z-index:0;color:#4a3412;background:#d9b878;border:1px solid #c49a55;border-bottom:none;border-radius:10px 10px 0 0;align-items:flex-start;height:30px;padding:7px 16px 0;display:flex;position:absolute;top:0;left:14px}.folder-sheet{z-index:0;background:repeating-linear-gradient(#fffaf2 0 6px,#e9e1d4 6px 7px);border:1px solid #e1d6c4;border-radius:3px;height:30px;position:absolute;top:16px;left:46%;right:18px;transform:rotate(2deg)}.folder-body{z-index:1;box-sizing:border-box;background:linear-gradient(#ecd3a0,#e6cb93);border:1px solid #c49a55;border-radius:4px 14px 14px;flex-direction:column;gap:6px;min-height:168px;padding:18px 16px 16px;display:flex;position:relative;box-shadow:0 2px #b98c45,0 10px 20px #50371429}.folder .tile-title{color:#1f1b16;background:#fffaf2;border:1px solid #d9cfc2;border-radius:3px;align-self:flex-start;max-width:calc(100% - 104px);padding:6px 12px;font-size:22px;transform:rotate(-1deg);box-shadow:0 1px #c49a55}.folder .tile-meta{color:#5a4526;margin-top:auto}.folder .tile-meta b{color:#1f1b16}.folder .bar{background:#f6e9cf}.folder-stamp{color:#8a2e0a;letter-spacing:.08em;text-transform:uppercase;border:2px solid #8a2e0a;border-radius:6px;padding:2px 8px;font-size:12px;font-weight:700;position:absolute;top:14px;right:14px;transform:rotate(-6deg)}.tile.locked .folder-tab{color:#4d453c;background:#ddd4c6;border-color:#cfc4b3}.tile.locked .folder-body{background:#e9e3d9;border-color:#cfc4b3;box-shadow:0 2px #cfc4b3}.tile.locked .tile-meta{align-items:center;margin-top:0}.tile.locked .tile-title{max-width:none;box-shadow:none;color:#5c544b;background:0 0;border:none;padding:0;font-size:18px;transform:none}.wip{color:#4d453c;text-transform:uppercase;letter-spacing:.06em;border:2px solid #4d453c;border-radius:6px;align-items:center;gap:4px;padding:2px 10px;font-size:12px;font-weight:700;display:inline-flex;transform:rotate(-4deg)}.screen.levels{min-height:100dvh}.tile.level{border-width:2px;flex:1 1 0;gap:8px;min-height:150px}.tile.level .tile-meta{align-items:baseline}.tile.level .tile-title{font-size:24px}.level-sizes{color:var(--muted);font-size:13px}.level-art{flex:1 1 0;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;min-height:44px;display:grid}.level-art img{object-fit:cover;border-radius:8px;width:100%;height:100%;min-height:0;display:block}.level-easy{background:#eaf3e6;border-color:#2f6b2b}.level-easy .tile-title,.level-easy .tile-meta b{color:#2f6b2b}.level-easy .bar i{background:#2f6b2b}.level-medium{background:#fbefdc;border-color:#8a5200}.level-medium .tile-title,.level-medium .tile-meta b{color:#8a5200}.level-medium .bar i{background:#8a5200}.level-hard{background:#f9e4e1;border-color:#a81c1c}.level-hard .tile-title,.level-hard .tile-meta b{color:#a81c1c}.level-hard .bar i{background:#a81c1c}.tile.level .bar{background:#ffffffa0}.level-switch{border:1px solid var(--line);background:var(--panel);border-radius:14px;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;padding:4px;display:grid}.level-switch a{min-height:44px;color:var(--ink);background:0 0;border:none;border-radius:10px;justify-content:center;align-items:center;gap:8px;font-size:15px;font-weight:700;text-decoration:none;display:flex}.level-switch a:before{content:"";background:var(--lv);border-radius:3px;flex:none;width:10px;height:10px}.level-switch a.level-easy{--lv:#2f6b2b;--lv-bg:#dcebd6}.level-switch a.level-medium{--lv:#7a5300;--lv-bg:#f4e5c4}.level-switch a.level-hard{--lv:#9a2f1f;--lv-bg:#f6dcd5}.lv-easy{--lv:#2f6b2b;--lv-bg:#dcebd6}.lv-medium{--lv:#7a5300;--lv-bg:#f4e5c4}.lv-hard{--lv:#9a2f1f;--lv-bg:#f6dcd5}.lv-scope .screen-head .count{background:var(--lv-bg);color:var(--lv)}.lv-scope .filter button[aria-pressed=true]{background:var(--lv-bg);border-color:var(--lv);color:var(--lv)}.level-switch a[aria-current=page]{background:var(--lv-bg);color:var(--lv);box-shadow:inset 0 0 0 1px var(--lv)}.level-switch a[aria-current=page]:before{display:none}.filter{gap:8px;display:flex}.filter button{border:1px solid var(--line);background:var(--panel);border-radius:22px;min-height:44px;padding:0 14px}.filter button[aria-pressed=true]{color:#2f6b2b;background:#dcebd6;border-color:#2f6b2b;font-weight:700}.rows{flex-direction:column;gap:6px;margin:0;padding:0;list-style:none;display:flex}.row{border:1px solid var(--line);background:var(--panel);min-height:56px;color:var(--ink);border-radius:12px;align-items:center;gap:12px;padding:8px 12px;text-decoration:none;display:flex}.row .num{min-width:36px;color:var(--muted);text-align:center;font-variant-numeric:tabular-nums;background:#e9e1d5;border-radius:8px;padding:6px 0;font-weight:700}.row .row-art{object-fit:cover;border-radius:6px;flex:none;width:64px;height:36px}.row-text{flex-direction:column;min-width:0;display:flex}.row .status{letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-size:11px}.row.started .status{color:var(--mark)}.row.solved .status{color:#2f6b2b}.row .row-setting{color:var(--muted);font-size:12px}.result .streak-line{margin:0;font-weight:700}.case{--pad-t:max(8px, env(safe-area-inset-top));--pad-l:max(12px, env(safe-area-inset-left));--pad-r:max(12px, env(safe-area-inset-right));max-width:480px;padding:var(--pad-t) var(--pad-r) max(24px, env(safe-area-inset-bottom)) var(--pad-l);flex-direction:column;gap:10px;margin:0 auto;display:flex}.top{align-items:center;gap:6px;display:flex}.top .title{text-align:center;flex-direction:column;flex:1;align-items:center;min-width:0;display:flex}.top .title b{white-space:nowrap;max-width:100%;font-size:14px;line-height:1.2}.top .brief-open{background:0 0;border:none;border-radius:8px;align-items:center;gap:4px;min-width:0;max-width:100%;min-height:24px;padding:0 4px;display:flex}.top .brief-open b{min-width:0}.top .sub{white-space:nowrap;align-items:center;gap:6px;max-width:100%;margin-top:2px;display:flex}.top .clock .dot{background:currentColor;border-radius:50%;width:6px;height:6px}.top .clock{color:#fff;font-variant-numeric:tabular-nums;background:#222;border-radius:12px;flex:none;align-items:center;gap:6px;padding:2px 10px;font-size:13px;display:inline-flex}.icon{border:1px solid var(--line);background:var(--panel);border-radius:10px;flex:none;justify-content:center;align-items:center;width:36px;height:36px;padding:0;font-size:18px;display:inline-flex}.board{-webkit-user-select:none;user-select:none;border:3px solid #333;border-radius:4px;width:100%;height:auto;display:block}.board .cell{cursor:pointer}.board .grid{fill:none;stroke:#2b221a;stroke-opacity:.28;stroke-width:1px;pointer-events:none}.board .wall{stroke:#333;stroke-width:3px;stroke-linecap:square;pointer-events:none}.board .obj{fill:#333;text-anchor:middle;pointer-events:none;font-size:9px}.board .notes{font-size:calc(11px * var(--k,1));fill:#1a4fc4;pointer-events:none;font-weight:700}.board .cross{stroke:#a81c1c;stroke-width:4px;stroke-linecap:round;fill:none;pointer-events:none}.board .cross.auto{stroke:#1d1a17;stroke-width:3px}.board .note-face-ring{fill:none;stroke:#fffaf0;stroke-width:1.5px;pointer-events:none}.board .obj-art{pointer-events:none}.board .mention{fill:none;stroke:var(--mark);stroke-width:1.5px;pointer-events:none}.board .token{fill:#fde7c7;stroke:var(--edge);stroke-width:1px}.board .token.victim{fill:#f4c7c7;stroke-dasharray:3 2}.board .token.selected{stroke-width:2.5px}.board .token-halo{fill:none;stroke:#fffaf0;stroke-width:1.5px;pointer-events:none}.board .token-color{fill:none;stroke-width:3px;pointer-events:none}.board .token-ring{fill:none;stroke:var(--edge);stroke-width:1px}.board .token-ring.victim{stroke-dasharray:3 2}.board .token-ring.selected{stroke-width:2.5px}.board .token-victim{fill:none;stroke:#c0392b;stroke-width:2px}.board .token-face,.board .note-face,.board .marks{pointer-events:none}.board .token-text{text-anchor:middle;pointer-events:none;font-size:15px;font-weight:700}.board .token-text.long{font-size:11px}.board .tokens,.board .plate{pointer-events:none}.board .plate rect{fill:#ffffffd9}.board .plate text{font-size:calc(10px * var(--k,1));text-anchor:middle;font-weight:700}.board .plate.mentioned rect{fill:#fff;stroke:var(--mark);stroke-width:1.5px}.tools{grid-template-columns:repeat(4,1fr);gap:6px;display:grid}.tools button{border:1px solid var(--line);background:var(--panel);border-radius:12px;flex-direction:column;align-items:center;gap:2px;min-width:0;padding:8px 2px;font-size:11px;display:flex;position:relative}.tools button[aria-pressed=true]{border-color:var(--mark);box-shadow:inset 0 0 0 1px var(--mark);color:var(--mark);background:#f6e1d3;font-weight:700}.glyph{justify-content:center;align-items:center;line-height:1;display:inline-flex}.tools .glyph{font-size:18px;line-height:1}.tools .badge{background:var(--mark);color:#fff;border-radius:10px;padding:1px 6px;font-size:11px;position:absolute;top:-6px;right:-4px}.tools .badge.gift{padding:2px 4px;display:flex}.tray{background:var(--panel);border:1px solid var(--line);border-radius:14px;justify-content:space-between;gap:6px;padding:8px;display:flex;overflow-x:auto}.tray button{background:0 0;border:none;flex-direction:column;flex:1 1 0;align-items:center;gap:3px;min-width:0;padding:0;display:flex}.tray .face{aspect-ratio:1;background:#fde7c7;border:3px solid #0000;border-radius:10px;justify-content:center;align-items:center;width:min(44px,100%);height:auto;font-size:17px;font-weight:700;display:flex;overflow:hidden}.tray .face.long{font-size:13px}.tray-wrap{position:relative}.tray.many{justify-content:flex-start;gap:3px;padding:7px 6px;position:relative}.tray.many button{flex:none;width:44px}.tray-arrow{z-index:1;width:34px;color:var(--ink);border:none;justify-content:center;align-items:center;padding:0;display:flex;position:absolute;top:1px;bottom:1px}.tray-arrow[hidden]{display:none}.tray-arrow.left{background:linear-gradient(90deg, var(--panel) 60%, #fffaf200);border-radius:13px 0 0 13px;justify-content:flex-start;padding-left:4px;left:1px}.tray-arrow.right{background:linear-gradient(270deg, var(--panel) 60%, #fffaf200);border-radius:0 13px 13px 0;justify-content:flex-end;padding-right:4px;right:1px}.tray.many .face{border-width:2px;width:44px;font-size:13px}.tray.many button[aria-pressed=true] .face{border-width:4px}.tray .victim .face{border-style:dashed;border-color:var(--muted);background:#f4c7c7}.tray .placed .face{opacity:.55}.tray button[aria-pressed=true] .face{opacity:1;border-width:5px}.tray .face.art{background:#e9e1d5 padding-box padding-box;position:relative}.tray .face img{object-fit:cover;width:100%;height:100%;display:block}.tray .victim .face.art:after{content:"";pointer-events:none;border-radius:7px;position:absolute;inset:0;box-shadow:inset 0 0 0 2px #c0392b}.card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:10px 12px}.card p{margin:4px 0 0}.clues{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:10px 12px}.clues .card{background:0 0;border:none;border-radius:0;padding:0}.toggle-all{float:right;z-index:1;background:var(--panel);min-height:44px;color:var(--muted);border:none;border-radius:0 12px;align-items:flex-start;margin:-10px -12px 0 8px;padding:0 12px;font-size:13px;line-height:21px;text-decoration:underline;display:flex;position:sticky;top:0}.clues .all-clues{clear:both;border:none;border-top:1px solid var(--line);background:0 0;border-radius:0;margin-top:8px;padding:4px 0 0}.action{justify-content:center;align-items:stretch;min-height:44px;display:flex}.action-hint{color:var(--muted);text-align:center;align-self:center;font-size:13px}.submit{background:var(--mark);color:#fff;border:none;border-radius:12px;flex:1;min-height:44px;padding:10px;font-size:16px;font-weight:700}.reopen{border:1px solid var(--line);background:var(--panel);border-radius:10px;flex:1;min-height:44px;padding:10px;font-weight:700}.all-clues{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:4px 12px;font-size:14px}.pause,.result,.fail{background:var(--panel);border:1px solid var(--line);border-radius:14px;flex-direction:column;gap:8px;padding:16px;display:flex}.pause button,.result button,.fail button{border:1px solid var(--line);background:#fff;border-radius:10px;min-height:44px;padding:10px}.pause .danger{color:#a81c1c;border-color:#a81c1c;font-weight:700}.pause button{justify-content:center;align-items:center;gap:8px;display:flex}.pause button .glyph{text-align:center;width:1.2em}.pause .primary-action,.result .primary-action,.fail .primary-action{border-color:var(--mark);background:var(--mark);color:#fff;font-weight:700}.pause:focus,.result:focus,.fail:focus{outline:none}.pause h2,.result h2,.fail h2{margin:0 0 4px;font-family:Georgia,Times New Roman,serif}.stage[inert]>.board{filter:blur(14px)}.pause{box-sizing:border-box;border-radius:20px;width:100%;max-width:360px;max-height:100%;margin:0 auto;overflow-y:auto;box-shadow:0 12px 40px #0004}.pause .pop-icon{align-self:center;margin-bottom:2px}.pause>h2{text-align:center}.result{z-index:5;left:max(12px, env(safe-area-inset-left));right:max(12px, env(safe-area-inset-right));bottom:calc(12px + env(safe-area-inset-bottom));max-width:456px;margin:0 auto;position:fixed;box-shadow:0 8px 30px #0003}.detector{margin:0;font-weight:700}.result .stats span{white-space:nowrap}.veil{z-index:5;padding:12px max(12px, env(safe-area-inset-right)) calc(12px + env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));background:#0006;flex-direction:column;justify-content:flex-end;display:flex;position:fixed;inset:0}.fail{width:100%;max-width:456px;margin:0 auto;box-shadow:0 8px 30px #0003}.fail p{margin:0}.veil.center{justify-content:center}.hints-pop{box-sizing:border-box;text-align:center;background:var(--panel);border:1px solid var(--line);border-radius:20px;flex-direction:column;align-items:center;gap:10px;width:100%;max-width:360px;max-height:100%;margin:0 auto;padding:20px 16px 12px;display:flex;overflow-y:auto;box-shadow:0 12px 40px #0004}.hints-pop:focus{outline:none}.pop-icon{width:64px;height:64px;box-shadow:inset 0 0 0 2px var(--line);color:var(--ink);background:#efe7da;border-radius:50%;flex:none;justify-content:center;align-items:center;font-size:34px;display:flex}.hints-pop h2{margin:0;font-family:Georgia,Times New Roman,serif;font-size:22px}.hints-pop p{margin:0}.hints-pop button{border:1px solid var(--line);min-height:44px;color:var(--ink);background:#fff;border-radius:12px}.hints-pop .primary-action{border-color:var(--mark);background:var(--mark);color:#fff;justify-content:center;align-items:center;gap:8px;width:100%;min-height:48px;font-size:16px;font-weight:700;display:flex}.hints-or{align-items:center;gap:10px;width:100%;display:flex}.hints-or:before,.hints-or:after{content:"";background:var(--line);flex:1;height:1px}.hints-offer{color:var(--mark);justify-content:center;align-items:center;gap:8px;font-weight:700;display:flex}.hints-offer svg{flex:none}.hints-or{color:var(--muted);font-size:13px}.hints-packs{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;width:100%;display:grid}.hints-pop .hints-pack{background:#fff6df;border-color:#e2b54a;flex-direction:column;justify-content:center;align-items:center;gap:2px;min-height:60px;padding:6px 4px;display:flex}.hints-pack b{font-variant-numeric:tabular-nums;font-size:20px}.hints-pop .hints-pack:disabled{opacity:.6}.hints-soon{color:var(--muted);font-size:12px}.hints-pop .hints-close{width:100%;color:var(--muted);background:0 0;border:none;text-decoration:underline}@supports (container-type:size){.case{--clues-h:104px;height:100dvh;padding-bottom:max(12px, env(safe-area-inset-bottom))}.stage{flex:1000 1 0;justify-content:center;align-items:center;min-height:0;max-height:calc(min(480px,100vw) - 24px);display:flex;container-type:size}.stage>.board{flex:none;width:min(100cqw,100cqh);height:min(100cqw,100cqh)}.clues{flex:1 0 var(--clues-h);overscroll-behavior:contain;min-height:0;overflow-y:auto}.clues.open{flex:1000 1 0}}@media (width<=380px){.top{gap:4px}}@media (width<=360px){.case{--pad-l:max(10px, env(safe-area-inset-left));--pad-r:max(10px, env(safe-area-inset-right))}.top{gap:3px}.top .sub{gap:4px}.top .clock{padding:2px 8px;font-size:12px}.top .brief-open{padding:0}.tray{gap:4px}}@media (height<=760px){.case{--clues-h:88px;--pad-t:max(6px, env(safe-area-inset-top));padding-bottom:max(8px, env(safe-area-inset-bottom));gap:6px}.tools button{padding:4px 2px}.tray{padding:6px}.tray .face{width:min(40px,100%)}.clues{padding:7px 10px;font-size:14px}.clues .toggle-all{margin:-7px -10px 0 6px}.pause{gap:6px;padding:12px}.pause h2{font-size:20px}}.toast{left:50%;bottom:calc(24px + env(safe-area-inset-bottom));color:#fff;background:#222;border-radius:10px;padding:8px 14px;font-size:14px;position:fixed;transform:translate(-50%)}.howto{overscroll-behavior:contain;z-index:10;background:var(--bg);position:fixed;inset:0;overflow-y:auto}.howto:focus{outline:none}.howto-body{--pad-t:max(12px, env(safe-area-inset-top));--pad-l:max(16px, env(safe-area-inset-left));--pad-r:max(16px, env(safe-area-inset-right));max-width:480px;min-height:100%;padding:var(--pad-t) var(--pad-r) max(16px, env(safe-area-inset-bottom)) var(--pad-l);flex-direction:column;gap:12px;margin:0 auto;display:flex}.howto-top{align-items:center;gap:8px;display:flex}.howto-head{flex-direction:column;flex:1;align-items:center;min-width:0;display:flex}.howto-head b{font-size:17px}.howto-count{color:var(--muted);font-variant-numeric:tabular-nums;font-size:13px}.howto .skip{min-height:44px;color:var(--mark);background:0 0;border:none;padding:0 8px;font-size:15px;font-weight:700}.howto h2{text-align:center;margin:4px 0 0;font-family:Georgia,Times New Roman,serif;font-size:26px;line-height:1.15}.howto-example{background:var(--panel);border:1px solid var(--line);border-radius:16px;flex-direction:column;gap:8px;padding:12px;display:flex}.howto-example .board{max-width:320px;margin:0 auto}.howto-card{min-height:64px;display:grid}.howto-card>*{grid-area:1/1}.howto-card .ghost{visibility:hidden;border:1px solid #0000;padding:10px 12px}.howto-card .ghost p{margin:4px 0 0}.howto-text{text-align:center;margin:0;font-size:16px;line-height:1.4}.howto .primary{width:100%;bottom:max(12px, env(safe-area-inset-bottom));box-shadow:0 -8px 16px var(--bg);border:none;margin-top:auto;position:sticky}.howto-main{flex-direction:column;gap:12px;display:flex}@supports (container-type:size){.howto{overflow:hidden}.howto-body{height:100%;min-height:0}.howto-main{overscroll-behavior:contain;flex:1 1 0;min-height:0;overflow-y:auto}.howto-main>*{flex-shrink:0}.howto .primary{box-shadow:none;flex:none;margin-top:0;position:static}.howto-main>.has-board{flex:1 0 auto}.howto-board{flex:1 1 0;justify-content:center;align-items:center;min-height:180px;display:flex;container-type:size}.howto-board>.board{flex:none;width:min(100cqw,100cqh,320px);height:min(100cqw,100cqh,320px);margin:0}}@media (height<=760px){.howto-body,.howto-main{gap:8px}.howto h2{margin-top:0;font-size:21px}.howto-example{gap:6px;padding:8px}.howto-text{font-size:15px;line-height:1.35}.howto .primary{min-height:48px;padding:12px 16px}}@media (height<=640px){.howto-body{--pad-t:max(8px, env(safe-area-inset-top));padding-bottom:max(10px, env(safe-area-inset-bottom));gap:6px}.howto-main{gap:6px}.howto h2{font-size:20px;line-height:1.1}.howto-example{gap:4px;padding:6px}.howto-example .tray{padding:4px 6px}.howto-card{min-height:0;font-size:14px}.howto-card .card,.howto-card .ghost{padding:6px 10px}.howto-card .card p,.howto-card .ghost p{margin-top:2px}.howto-text{font-size:14px;line-height:1.3}.howto .primary{min-height:44px;padding:10px 16px}}@supports (container-type:size){@media (height<=640px){.howto-board{min-height:150px}}}.beside{border:3px solid #333;border-radius:4px;width:180px;max-width:60%;margin:8px auto;display:block}.beside .spot{fill:#efe6da;stroke:var(--line);stroke-width:1px}.beside .spot.yes{fill:#cfe8d3}.beside .spot.no{fill:#f1d6d0}.beside .spot-frame{fill:none;stroke:#2f6b2b;stroke-width:1px}.beside .spot-mark{color:#222;stroke-width:3px}.beside .spot-obj{text-anchor:middle;fill:#222;font-size:11px;font-weight:700}.objects h3{align-items:center;gap:6px;margin:0 0 8px;font-size:14px;display:flex}.objects .can h3{color:#2f6b2b}.objects .cannot h3{color:#a81c1c}.objects ul{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin:0;padding:0;list-style:none;display:grid}.objects li{border:1px solid var(--line);text-align:center;background:#fff;border-radius:10px;flex-direction:column;align-items:center;gap:4px;padding:8px 4px 6px;font-size:13px;line-height:1.15;display:flex}.objects li img{object-fit:contain;width:48px;height:48px;display:block}.objects .cannot li{background:#fbf1ef}.howto-tools{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.howto-tools li{border:1px solid var(--line);background:var(--panel);border-radius:14px;align-items:center;gap:12px;padding:10px 12px;display:flex}.howto-tools .glyph{border:1px solid var(--line);border-radius:12px;flex:none;justify-content:center;align-items:center;width:40px;height:40px;font-size:18px;display:flex}.howto-tools .tool-text{margin-top:2px;font-size:14px;display:block}.brief{overscroll-behavior:contain;z-index:10;background:var(--bg);scrollbar-width:none;position:fixed;inset:0;overflow-y:auto}.brief::-webkit-scrollbar{display:none}.brief-body{--pad-t:max(12px, env(safe-area-inset-top));--pad-l:max(16px, env(safe-area-inset-left));--pad-r:max(16px, env(safe-area-inset-right));max-width:480px;min-height:100%;padding:var(--pad-t) var(--pad-r) max(16px, env(safe-area-inset-bottom)) var(--pad-l);flex-direction:column;gap:10px;margin:0 auto;display:flex}.brief-top{justify-content:space-between;align-items:center;gap:8px;display:flex}.brief-plate{color:var(--muted);white-space:nowrap;background:#e9e1d5;border-radius:12px;padding:4px 10px;font-size:13px;font-weight:700}.brief-art{margin:0;position:relative}.brief-art img{aspect-ratio:16/9;object-fit:cover;border-radius:14px;width:100%;height:auto;display:block}.brief-art figcaption{color:#fff;background:#000a;border-radius:8px;align-items:center;gap:4px;padding:2px 8px;font-size:13px;display:flex;position:absolute;bottom:8px;left:10px}.brief .eyebrow{margin:0}.brief h2{margin:0;font-family:Georgia,Times New Roman,serif;font-size:26px;line-height:1.15}.brief h2:focus{outline:none}.brief-story{margin:0;font-size:16px;line-height:1.4}.brief h3{color:var(--muted);margin:4px 0 0;font-size:14px}.suspects{background:var(--panel);border:1px solid var(--line);border-radius:14px;gap:6px;margin:0;padding:8px;list-style:none;display:flex}.suspects li{flex-direction:column;flex:1 1 0;align-items:center;gap:3px;min-width:0;display:flex}.suspects .face{aspect-ratio:1;width:min(44px,100%);box-shadow:0 0 0 1px var(--edge);background:#fde7c7;border:3px solid #0000;border-radius:10px;justify-content:center;align-items:center;font-size:17px;font-weight:700;display:flex;overflow:hidden}.suspects .face.long{font-size:13px}.suspects .face.art{background:#e9e1d5 padding-box padding-box}.suspects .face img{object-fit:cover;width:100%;height:100%;display:block}.suspects .victim .face{border-style:dashed;border-color:var(--muted);background:#f4c7c7}.suspects.many{flex-wrap:wrap;row-gap:8px}.suspects.many li{flex:0 0 calc(20% - 4.8px)}.suspects .name{white-space:nowrap;text-overflow:ellipsis;max-width:100%;font-size:11px;overflow:hidden}.suspects .tag{color:#a81c1c;font-size:10px;font-weight:700}.brief .primary{width:100%;bottom:max(12px, env(safe-area-inset-bottom));box-shadow:0 -8px 16px var(--bg);border:none;margin-top:auto;position:sticky}@media (height<=640px){.brief-body{gap:6px}.brief h2{font-size:21px}.brief-story{font-size:15px;line-height:1.3}}.under{display:contents}.tray,.clues,.pause,.howto,.howto-main{scrollbar-width:none}.tray::-webkit-scrollbar{display:none}.clues::-webkit-scrollbar{display:none}.pause::-webkit-scrollbar{display:none}.howto::-webkit-scrollbar{display:none}.howto-main::-webkit-scrollbar{display:none}@media (height<=600px){.brand .mascot{width:96px;height:96px}}.result.victory{z-index:5;max-width:none;box-shadow:none;color:#fbf3e8;background:#17130f;border:none;border-radius:0;margin:0;padding:0;display:block;position:fixed;inset:0;overflow-y:auto}.victory .v-scene{object-fit:cover;opacity:.55;width:100%;height:300px;position:absolute;top:0;left:0;-webkit-mask-image:linear-gradient(#000 40%,#0000);mask-image:linear-gradient(#000 40%,#0000)}.victory .v-body{box-sizing:border-box;max-width:480px;min-height:100%;padding:max(20px, env(safe-area-inset-top)) max(20px, env(safe-area-inset-right)) max(20px, env(safe-area-inset-bottom)) max(20px, env(safe-area-inset-left));flex-direction:column;align-items:center;gap:12px;margin:0 auto;display:flex;position:relative}.victory .v-plate{color:#d8c8b4;letter-spacing:.04em;align-self:stretch;margin:0;font-size:13px}.victory .v-stamp{color:#ff6a4f;letter-spacing:.06em;text-transform:uppercase;background:#17130f8c;border:4px solid #e0472f;border-radius:10px;margin:14px 0 0;padding:6px 16px;font-size:30px;transform:rotate(-8deg)}.victory .v-portrait{justify-content:center;align-items:center;width:150px;height:150px;margin-top:6px;display:flex;position:relative}.victory .v-bars{pointer-events:none;border-radius:50%;width:140px;height:140px;position:absolute;overflow:hidden}.victory .v-bars:before{content:"";background:repeating-linear-gradient(90deg,#0000 0 17px,#1d1a17e0 17px 25px);position:absolute;inset:0}.victory .v-bars:after{content:"";border-radius:50%;position:absolute;inset:0;box-shadow:inset 0 0 0 4px #3a332c}.victory .v-portrait img,.victory .v-initial{border:4px solid var(--mark);object-fit:cover;background:#e9e1d5;border-radius:50%;width:140px;height:140px;position:relative}.victory .v-initial{color:var(--ink);justify-content:center;align-items:center;font-size:56px;font-weight:700;display:flex}.victory .v-who{text-align:center;flex-direction:column;align-items:center;gap:2px;margin:0;display:flex}.victory .v-label{letter-spacing:.12em;text-transform:uppercase;color:#d8c8b4;font-size:12px}.victory .v-who b{font-family:Georgia,Times New Roman,serif;font-size:32px}.victory .v-who span:last-child{color:#e7d9c6;font-size:15px}.victory .v-stats{grid-template-columns:repeat(3,minmax(0,1fr));align-self:stretch;gap:8px;margin:4px 0 0;display:grid}.victory .v-stats div{text-align:center;background:#2a231c;border-radius:12px;flex-direction:column-reverse;gap:2px;padding:10px 4px;display:flex}.victory .v-stats dd{font-variant-numeric:tabular-nums;margin:0;font-size:22px;font-weight:700}.victory .v-stats dt{color:#d8c8b4;font-size:12px}.victory .v-badges{flex-wrap:wrap;justify-content:center;gap:8px;margin:0;padding:0;list-style:none;display:flex}.victory .v-badges li{color:#d6f0cf;background:#2f4a2c;border-radius:16px;padding:6px 12px;font-size:13px;font-weight:700}.victory .v-badges li+li{color:#d0e6f5;background:#2c3d4a}.victory .v-badges .v-streak{color:#f6dcc0;background:#4a3420}.victory .v-actions{grid-template-columns:repeat(2,minmax(0,1fr));align-self:stretch;gap:8px;margin-top:auto;padding-top:12px;display:grid}.victory .v-actions button{color:#fbf3e8;background:0 0;border:1px solid #5a4c3e;border-radius:12px;min-height:44px;font-size:15px}.victory .v-actions .primary-action{border-color:var(--mark);background:var(--mark);color:#fff;grid-column:1/-1;min-height:52px;font-size:18px;font-weight:700}.victory .v-stamp{white-space:nowrap}@media (width<=360px){.victory .v-stamp{padding:4px 12px;font-size:24px}}@media (height<=700px){.victory .v-body{padding-top:max(12px, env(safe-area-inset-top));padding-bottom:max(12px, env(safe-area-inset-bottom));gap:8px}.victory .v-scene{height:200px}.victory .v-stamp{border-width:3px;margin-top:4px;padding:4px 12px;font-size:22px}.victory .v-portrait{width:96px;height:96px;margin-top:2px}.victory .v-bars{width:90px;height:90px}.victory .v-bars:before{background:repeating-linear-gradient(90deg,#0000 0 11px,#1d1a17e0 11px 16px)}.victory .v-portrait img,.victory .v-initial{border-width:3px;width:90px;height:90px}.victory .v-who b{font-size:24px}.victory .v-who span:last-child{font-size:13px}.victory .v-stats div{padding:6px 4px}.victory .v-stats dd{font-size:18px}.victory .v-stats dt{font-size:11px}.victory .v-badges li{padding:4px 10px;font-size:12px}.victory .v-actions{gap:6px;padding-top:6px}.victory .v-actions .primary-action{min-height:46px;font-size:16px}}@keyframes v-fade{0%{opacity:0}}@keyframes v-stamp{0%{opacity:0;transform:rotate(-8deg)scale(2.4)}60%{opacity:1;transform:rotate(-8deg)scale(.92)}to{opacity:1;transform:rotate(-8deg)scale(1)}}@keyframes v-rise{0%{opacity:0;transform:translateY(18px)}}@keyframes v-pop{0%{opacity:0;transform:scale(.6)}70%{opacity:1;transform:scale(1.08)}}@keyframes v-reveal{0%{opacity:0;filter:grayscale();transform:scale(.7)}60%{opacity:1;filter:grayscale();transform:scale(1.05)}to{filter:grayscale(0)}}@keyframes v-bars{0%{transform:translateY(-100%)}80%{transform:translateY(4%)}to{transform:translateY(0)}}@media (prefers-reduced-motion:no-preference){.victory{animation:.3s ease-out both v-fade}.victory .v-stamp{animation:.55s cubic-bezier(.2,.9,.3,1.2) .35s both v-stamp}.victory .v-portrait img,.victory .v-initial{animation:.7s ease-out .8s both v-reveal}.victory .v-bars:before{animation:.5s ease-in 1.5s both v-bars}.victory .v-bars:after{animation:.3s 1.5s both v-fade}.victory .v-who{animation:.45s ease-out 1.2s both v-rise}.victory .v-stats{animation:.45s ease-out 1.4s both v-rise}.victory .v-badges li{animation:.4s 1.7s both v-pop}.victory .v-badges li+li{animation-delay:1.85s}.victory .v-badges li+li+li{animation-delay:2s}.victory .v-actions{animation:.5s ease-out 2.2s both v-rise}}@keyframes in-rise{0%{opacity:0;transform:translateY(14px)}}@keyframes in-drop{0%{opacity:0;transform:translateY(-10px)}}@keyframes in-zoom{0%{opacity:0;transform:scale(.94)}}@keyframes in-pop{0%{opacity:0;transform:scale(.6)}70%{opacity:1;transform:scale(1.08)}}@keyframes in-pan{0%{opacity:0;transform:scale(1.12)}}@media (prefers-reduced-motion:no-preference){.brief .brief-top{animation:.35s ease-out both in-drop}.brief .brief-art{border-radius:14px;overflow:hidden}.brief .brief-art img{animation:.9s ease-out both in-pan}.brief .brief-art figcaption{animation:.4s ease-out .45s both in-rise}.brief .eyebrow{animation:.4s ease-out .3s both in-rise}.brief h2{animation:.4s ease-out .4s both in-rise}.brief .brief-story{animation:.4s ease-out .5s both in-rise}.brief .suspects li{animation:.35s .6s both in-pop}.brief .suspects li:nth-child(2){animation-delay:.66s}.brief .suspects li:nth-child(3){animation-delay:.72s}.brief .suspects li:nth-child(4){animation-delay:.78s}.brief .suspects li:nth-child(5){animation-delay:.84s}.brief .suspects li:nth-child(6){animation-delay:.9s}.brief .suspects li:nth-child(7){animation-delay:.96s}.brief .suspects li:nth-child(8){animation-delay:1.02s}.brief .suspects li:nth-child(9){animation-delay:1.08s}.brief .suspects li:nth-child(10){animation-delay:1.14s}.brief .primary{animation:.45s ease-out 1s both in-rise}.case:not(.behind) .top{animation:.35s ease-out both in-drop}.case:not(.behind) .stage>.board{animation:.45s ease-out .1s both in-zoom}.case:not(.behind) .action{animation:.35s ease-out .3s both in-rise}.case:not(.behind) .tools{animation:.35s ease-out .35s both in-rise}.case:not(.behind) .tray button{animation:.3s .45s both in-pop}.case:not(.behind) .tray button:nth-child(2){animation-delay:.5s}.case:not(.behind) .tray button:nth-child(3){animation-delay:.55s}.case:not(.behind) .tray button:nth-child(4){animation-delay:.6s}.case:not(.behind) .tray button:nth-child(5){animation-delay:.65s}.case:not(.behind) .tray button:nth-child(6){animation-delay:.7s}.case:not(.behind) .tray button:nth-child(7){animation-delay:.75s}.case:not(.behind) .tray button:nth-child(8){animation-delay:.8s}.case:not(.behind) .tray button:nth-child(9){animation-delay:.85s}.case:not(.behind) .tray button:nth-child(10){animation-delay:.9s}.case:not(.behind) .clues{animation:.4s ease-out .6s both in-rise}}
