:root{--mat:#1e5550;--mat-line:#2c6d66;--mat-deep:#143f3b;--beech:#b98548;--beech-light:#dcb47a;--beech-dark:#8a5a2b;--slate:#263238;--slate-2:#32424a;--slate-3:#40525b;--paper:#f4f1e6;--ink:#15181a;--tape-yellow:#ffc233;--tape-yellow-dark:#c98f00;--copper:#c8743a;--danger:#e5484d;--ok:#58c98b;--muted:#a9b8bd;--font:"Barlow", "Segoe UI", system-ui, sans-serif;--font-display:"Barlow Condensed", "Arial Narrow", "Segoe UI", sans-serif;--safe-b:env(safe-area-inset-bottom,0px)}*{box-sizing:border-box}html,body{height:100%;margin:0}body{font-family:var(--font);color:var(--paper);background:var(--slate);-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;font-size:16px;line-height:1.45;overflow:hidden}#app{height:100dvh}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:0;padding:0}button:focus-visible,a:focus-visible{outline:3px solid var(--tape-yellow);outline-offset:2px}h1,h2,h3,p{margin:0}.tape{font-family:var(--font-display);letter-spacing:.09em;text-transform:uppercase;color:#fbfaf5;text-shadow:0 1px #000,0 -1px #ffffff59;white-space:nowrap;background:linear-gradient(#1c2023,#0e1012);border-radius:2px;padding:3px 12px 2px;font-size:19px;font-weight:700;display:inline-block;box-shadow:0 2px 3px #0006,inset 0 1px #ffffff24}.tape.red{background:linear-gradient(#c5262b,#8f161a)}.tape.blue{background:linear-gradient(#2a66aa,#173f70)}.btn{background:var(--slate-3);min-height:48px;color:var(--paper);border-radius:10px;justify-content:center;align-items:center;gap:8px;padding:0 18px;font-size:16px;font-weight:600;transition:transform 60ms,box-shadow 60ms,background .15s;display:inline-flex;box-shadow:0 3px #1a2328}.btn:hover{background:#4b606a}.btn:active{transform:translateY(3px);box-shadow:0 0 #1a2328}.btn:disabled{opacity:.45;cursor:default;transform:none;box-shadow:0 3px #1a2328}.btn svg{flex:none;width:20px;height:20px}.btn.primary{background:var(--tape-yellow);color:#1d1600;font-family:var(--font-display);letter-spacing:.04em;box-shadow:0 4px 0 var(--tape-yellow-dark);padding:0 28px;font-size:22px;font-weight:700}.btn.primary:hover{background:#ffd05c}.btn.primary:active{box-shadow:0 0 0 var(--tape-yellow-dark);transform:translateY(4px)}.btn.primary.stop{background:var(--danger);color:#fff;box-shadow:0 4px #9c2327}.icon-btn{background:var(--slate-2);border-radius:10px;flex:none;place-items:center;width:48px;height:48px;display:grid}.icon-btn:hover{background:var(--slate-3)}.icon-btn svg{width:24px;height:24px}.level{grid-template:"top top""tray board"minmax(0,1fr)"tray tools"/236px minmax(0,1fr);height:100%;display:grid}.topbar{background:var(--slate);border-bottom:3px solid #1a2328;grid-area:top;align-items:center;gap:14px;padding:10px 14px;display:flex}.topbar .heading{flex-direction:column;flex:1;gap:4px;min-width:0;display:flex}.topbar .task{color:var(--paper);max-width:75ch;font-size:17px;font-weight:500}.tray{background:repeating-linear-gradient(90deg, #5a320a14 0 2px, transparent 2px 9px), linear-gradient(90deg, var(--beech), var(--beech-light) 45%, var(--beech));border-right:4px solid var(--beech-dark);color:#33210c;flex-direction:column;grid-area:tray;min-height:0;display:flex}.tray-title{font-family:var(--font-display);padding:12px 14px 4px;font-size:20px;font-weight:700}.tray-help{color:#5b3d18;padding:0 14px 8px;font-size:13px}.tray-list{touch-action:pan-y;flex-direction:column;gap:8px;min-height:0;padding:4px 10px 14px;display:flex;overflow-y:auto}.tray-item{text-align:left;color:#2b1c08;touch-action:pan-y;background:#fffaeb8c;border-radius:10px;grid-template-columns:76px 1fr;align-items:center;gap:8px;padding:6px 10px 6px 6px;display:grid;position:relative;box-shadow:inset 0 0 0 2px #6e461447}.tray-item:hover{background:#fffaebd9}.tray-item svg{width:76px;height:60px;display:block}.tray-item .name{font-size:15px;font-weight:600;line-height:1.2}.tray-item .count{text-align:center;background:var(--slate);min-width:26px;color:var(--paper);border-radius:13px;padding:1px 6px;font-size:13px;font-weight:700;position:absolute;top:-5px;right:-4px}.tray-item.empty{opacity:.38;cursor:default}.tray-item.empty .count{display:none}.board-host{background:var(--mat-deep);grid-area:board;min-height:0;position:relative;overflow:hidden}.board-svg{touch-action:none;width:100%;height:100%;font-family:var(--font);cursor:grab;position:absolute;inset:0}.board-svg.live{cursor:default}.board-svg [data-part]{cursor:grab}.board-svg.live [data-part]{cursor:default}.board-svg.live [data-part].clickable,.board-svg [data-wire],.board-svg [data-act]{cursor:pointer}.board-svg text{pointer-events:none}.fit-btn{background:#142826cc;position:absolute;bottom:12px;right:12px}.live-badge{color:var(--tape-yellow);background:#15181ad9;border-radius:8px;align-items:center;gap:8px;padding:6px 12px;font-weight:600;display:none;position:absolute;top:12px;left:12px}.live-badge:before{content:"";background:var(--tape-yellow);border-radius:50%;width:10px;height:10px;animation:1s steps(2,end) infinite blink}.level.is-live .live-badge{display:flex}.toolbar{padding:10px 14px calc(12px + var(--safe-b));background:var(--slate);border-top:3px solid #1a2328;grid-area:tools;align-items:center;gap:10px;display:flex}.toolbar .spacer{flex:1}.notice{background:var(--paper);width:min(560px,100% - 24px);color:var(--ink);border-left:8px solid var(--tape-yellow);-webkit-user-select:text;user-select:text;border-radius:12px;padding:14px 16px;position:absolute;bottom:16px;left:50%;transform:translate(-50%);box-shadow:0 8px 24px #00000073}.notice.fail{border-left-color:var(--danger)}.notice .notice-title{font-family:var(--font-display);margin-bottom:2px;font-size:20px;font-weight:700}.notice .notice-row{flex-wrap:wrap;gap:10px;margin-top:10px;display:flex}.notice .btn{background:var(--slate);min-height:42px;box-shadow:0 3px #0e1417}.notice .btn.link{box-shadow:none;color:#3d4b52;background:0 0;padding:0 6px;text-decoration:underline}.notice .steps{color:#5a666c;margin-top:6px;font-size:13px}.modal-back{z-index:50;background:#081012b8;place-items:center;padding:16px;display:grid;position:fixed;inset:0}.modal-back.over-board{background:#08101261;align-items:end;padding-bottom:28px}.modal{background:var(--paper);width:min(480px,100%);max-height:calc(100dvh - 32px);color:var(--ink);text-align:center;border-radius:16px;padding:24px;overflow:auto;box-shadow:0 20px 60px #0009}.modal h2{font-family:var(--font-display);margin-bottom:8px;font-size:34px;font-weight:700;line-height:1.1}.modal p{max-width:42ch;margin:8px auto;font-size:17px}.modal .small{color:#56646a;font-size:15px}.modal .actions{flex-wrap:wrap;justify-content:center;gap:10px;margin-top:18px;display:flex}.modal .btn{background:var(--slate);color:var(--paper);box-shadow:0 3px #0e1417}.modal .btn.primary{background:var(--tape-yellow);color:#1d1600;box-shadow:0 4px 0 var(--tape-yellow-dark)}.modal .btn.quiet{color:var(--ink);background:#dcd8cb;box-shadow:0 3px #b2ae9f}.modal.danger{border-top:10px solid var(--danger)}.modal .sign{width:84px;margin:0 auto 8px;display:block}.stars{justify-content:center;gap:8px;margin:12px 0;display:flex}.stars svg{width:58px;height:58px}.stars .star{fill:#d5d0c0;stroke:#a9a492;stroke-width:1.5px}.stars .star.won{fill:var(--tape-yellow);stroke:var(--tape-yellow-dark);animation:.45s cubic-bezier(.2,1.6,.4,1) both star-in}.stars .star.won:nth-child(2){animation-delay:.25s}.stars .star.won:nth-child(3){animation-delay:.5s}.badge-won{text-align:left;background:#e9e4d3;border-radius:12px;align-items:center;gap:12px;max-width:360px;margin:14px auto 0;padding:10px 14px;display:flex}.badge-won svg{flex:none;width:56px;height:56px}.map{-webkit-user-select:none;user-select:none;background:radial-gradient(circle,#28160480 2.4px,#0000 3px) 0 0/30px 30px,linear-gradient(#c9a26a,#b98b52);height:100%;overflow-y:auto}.map-inner{max-width:1180px;padding:20px 16px calc(32px + var(--safe-b));margin:0 auto}.map-head{flex-wrap:wrap;align-items:center;gap:16px;margin-bottom:20px;display:flex}.logo{font-family:var(--font-display);letter-spacing:.01em;color:#1c1305;align-items:center;gap:6px;font-size:54px;font-weight:700;line-height:1;display:flex}.logo svg{width:40px;height:54px}.map-head .sub-wrap{flex:1;min-width:200px}.map-head .sub{color:var(--ink);background:var(--paper);border-radius:8px;padding:6px 12px;font-size:17px;font-weight:500;display:inline-block}.map-head .logo{background:linear-gradient(#c9a26a,#c39c63);border-radius:10px;padding:2px 10px 2px 4px}.map-actions{align-items:center;gap:10px;display:flex}.star-count{background:var(--slate);border-radius:10px;align-items:center;gap:6px;height:48px;padding:0 14px;font-size:18px;font-weight:700;display:inline-flex}.star-count svg{width:22px;height:22px;fill:var(--tape-yellow)}.chapters{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;display:grid}.chapter{background:var(--slate);border-radius:12px;padding:18px 16px 16px;position:relative;box-shadow:0 6px #162025,0 14px 24px #28140059}.chapter.locked{background:#3d4a50;box-shadow:0 6px #2a363b,0 14px 24px #28140040}.chapter.locked .tile{background:#46545a}.chapter.locked .tape{opacity:.75}.chapter-head{justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px;display:flex}.chapter-note{color:var(--muted);font-size:14px}.tiles{gap:8px;margin:0;padding:0;list-style:none;display:grid}.tile{text-align:left;background:var(--slate-2);border-radius:10px;grid-template-columns:40px 1fr auto;align-items:center;gap:12px;width:100%;min-height:56px;padding:6px 12px 6px 8px;display:grid}.tile:hover:not(:disabled){background:var(--slate-3)}.tile .num{width:40px;height:40px;font-family:var(--font-display);color:var(--paper);background:#1a2328;border-radius:50%;place-items:center;font-size:22px;font-weight:700;display:grid}.tile .title{font-size:17px;font-weight:600}.tile .tile-stars{gap:2px;display:flex}.tile .tile-stars svg{fill:#51626a;width:20px;height:20px}.tile .tile-stars svg.won{fill:var(--tape-yellow)}.tile.next{background:var(--tape-yellow);color:#1d1600}.tile.next:hover:not(:disabled){background:#ffd05c}.tile.next .num{color:var(--tape-yellow);background:#1d1600}.tile.next .tile-stars svg{fill:#1d160040}.tile:disabled{cursor:default;color:#7f9199}.tile:disabled .num{color:#7f9199;background:#2b393f}.tile .lock{fill:#7f9199;width:20px;height:20px}.banner{background:var(--paper);color:var(--ink);border-left:8px solid var(--tape-yellow);border-radius:10px;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px;padding:10px 14px;display:flex}.badges{grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px;display:grid}.badge{background:var(--slate);border-radius:12px;grid-template-columns:72px 1fr;align-items:center;gap:12px;padding:14px;display:grid;box-shadow:0 5px #162025}.badge svg{width:72px;height:72px}.badge h3{font-family:var(--font-display);font-size:22px;font-weight:700;line-height:1.1}.badge p{color:var(--muted);font-size:14px}.badge.locked svg{filter:grayscale()brightness(.55)}.badge.locked h3{color:var(--muted)}.drag-ghost{z-index:60;pointer-events:none;filter:drop-shadow(0 10px 10px #00000073);font-family:var(--font);position:fixed;top:0;left:0}.flow{animation:linear infinite flow}.flow.rev{animation-direction:reverse}@keyframes flow{to{stroke-dashoffset:-28px}}.hammer.ringing{animation:90ms linear infinite alternate hammer}@keyframes hammer{0%{transform:rotate(0)}to{transform:rotate(-9deg)}}.gong.ringing{animation:70ms linear infinite alternate gong}@keyframes gong{0%{transform:translate(0)}to{transform:translate(-1.3px,.8px)}}.waves{animation:.3s steps(2,end) infinite blink}.glow{animation:2.2s ease-in-out infinite alternate glow}@keyframes glow{0%{opacity:.92}to{opacity:1}}.smoke{animation:1.6s ease-out infinite smoke}@keyframes smoke{0%{opacity:.8;transform:translateY(0)}to{opacity:0;transform:translateY(-16px)}}.spark{animation:.16s steps(2,end) infinite blink}.hl{animation:.8s ease-in-out infinite alternate hl}@keyframes hl{0%{opacity:.35}to{opacity:1}}@keyframes blink{50%{opacity:.25}}@keyframes star-in{0%{opacity:0;transform:scale(0)rotate(-40deg)}to{opacity:1;transform:scale(1)rotate(0)}}.stars .star{transform-origin:50%;transform-box:fill-box}@media (width<=819px){.level{grid-template:"top""board"minmax(0,1fr)"tray""tools"/minmax(0,1fr)}.topbar{gap:10px;padding:8px 10px}.topbar .task{font-size:15px;line-height:1.3}.tape{font-size:16px}.tray{border-right:0;border-top:4px solid var(--beech-dark)}.tray-title,.tray-help{display:none}.tray-list{touch-action:pan-x;scrollbar-width:none;flex-direction:row;padding:10px;overflow:auto hidden}.tray-list::-webkit-scrollbar{display:none}.tray-item{text-align:center;touch-action:pan-x;flex:none;grid-template-columns:1fr;justify-items:center;gap:2px;width:96px;padding:4px 4px 6px}.tray-item svg{width:80px;height:50px}.tray-item .name{font-size:12.5px}.toolbar{padding:8px 10px calc(10px + var(--safe-b));gap:6px}.toolbar .btn{flex:none;padding:0 12px}.toolbar .spacer{min-width:0}.toolbar .btn .label{display:none}.toolbar .btn.hint .label,.toolbar .btn.primary .label{display:inline}.btn.primary{padding:0 16px;font-size:20px}.chapters{grid-template-columns:minmax(0,1fr)}.logo{font-size:44px}.stars svg{width:48px;height:48px}.notice{bottom:10px}}@media (prefers-reduced-motion:reduce){.flow,.glow,.smoke,.waves,.spark,.hl,.hammer.ringing,.gong.ringing,.live-badge:before,.stars .star.won{animation:none}.btn{transition:none}}