:root{--paper: #FAF8F3;--paper-soft: #FFFFFF;--cream: #FFF8EC;--ink: #2C1A08;--ink-soft: #6B4C2A;--amber: #FF7A45;--amber-soft: #FFD3BD;--wood: #7A5230;--wood-dark: #3B1C08;--wood-light: #C8A060;--forest: #2D6A4F;--forest-soft: #D6E7DD;--sky: #4A90D9;--sky-soft: #C8E0F8;--danger: #B23A2E;--danger-soft: #F4D8D3;--workshop-bg: #3B2208;--radius-card: 20px;--radius-pill: 999px;--shadow-card: 0 1px 2px rgba(60, 28, 8, .18), 0 12px 32px rgba(60, 28, 8, .28);--shadow-soft: 0 8px 24px rgba(60, 28, 8, .16);--font-display: "Fredoka", "Nunito", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;--font-body: "Inter", system-ui, -apple-system, Segoe UI, Roboto, sans-serif}*{box-sizing:border-box}html,body{margin:0;padding:0;height:100%;overflow:hidden}html{background:var(--workshop-bg)}body{font-family:var(--font-body);color:var(--ink);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;overscroll-behavior:none;touch-action:manipulation}button{font-family:inherit;cursor:pointer}.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}#workshop{position:fixed;inset:0;width:100%;height:100%;z-index:0;background:radial-gradient(80% 60% at 60% 0%,rgba(255,200,100,.18),transparent 60%),linear-gradient(180deg,#3b2208,#5c3d1e 55%,#7a5230)}.app{position:fixed;inset:0;z-index:1;display:flex;align-items:stretch;justify-content:stretch;padding:env(safe-area-inset-top,0) env(safe-area-inset-right,0) env(safe-area-inset-bottom,0) env(safe-area-inset-left,0)}.scene-root{position:relative;flex:1;display:flex;flex-direction:column;overflow:hidden}.boris-hud{position:absolute;left:clamp(12px,3vw,28px);bottom:clamp(12px,3vw,28px);display:flex;align-items:flex-end;gap:12px;z-index:4;pointer-events:none;max-width:min(440px,80vw)}.boris-avatar{width:clamp(64px,12vw,96px);height:clamp(64px,12vw,96px);flex-shrink:0;filter:drop-shadow(0 4px 12px rgba(60,28,8,.45));transition:transform .22s cubic-bezier(.5,0,.2,1)}.boris-avatar.is-bounce{animation:boris-bounce .7s cubic-bezier(.5,0,.2,1)}@keyframes boris-bounce{0%{transform:translateY(0) scale(1)}35%{transform:translateY(-8px) scale(1.05)}to{transform:translateY(0) scale(1)}}.boris-bubble{background:var(--paper);color:var(--ink);padding:10px 14px;border-radius:18px 18px 18px 6px;box-shadow:var(--shadow-soft);font-size:clamp(.875rem,2.2vw,1rem);line-height:1.4;max-width:320px;animation:bubble-in .28s cubic-bezier(.2,.8,.2,1);pointer-events:none}@keyframes bubble-in{0%{opacity:0;transform:translateY(6px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}.top-hud{position:absolute;top:clamp(10px,2.5vw,20px);right:clamp(12px,3vw,28px);display:flex;gap:8px;z-index:4;pointer-events:auto}.chip{background:#3c1c0899;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:var(--paper);font-family:var(--font-display);font-weight:500;font-size:.95rem;padding:8px 14px;border-radius:var(--radius-pill);border:1px solid rgba(255,200,80,.2);display:inline-flex;align-items:center;gap:6px}.chip svg{width:18px;height:18px}.chip-screws{color:var(--amber-soft)}.overlay{position:absolute;inset:0;z-index:5;display:flex;align-items:center;justify-content:center;padding:clamp(20px,4vw,40px);background:radial-gradient(60% 60% at 50% 50%,#3c1c084d,#140a02b8);animation:overlay-in .28s ease-out}@keyframes overlay-in{0%{opacity:0}to{opacity:1}}.panel{background:var(--paper);color:var(--ink);border-radius:var(--radius-card);padding:clamp(24px,5vw,40px);box-shadow:var(--shadow-card);max-width:540px;width:100%;text-align:center;animation:panel-in .36s cubic-bezier(.2,.8,.2,1)}@keyframes panel-in{0%{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}.panel h1,.panel h2{font-family:var(--font-display);margin:0 0 8px;color:var(--ink);letter-spacing:-.01em}.panel h1{font-size:clamp(1.5rem,5vw,2.2rem)}.panel h2{font-size:clamp(1.2rem,4vw,1.6rem)}.panel p{margin:0 0 16px;color:var(--ink-soft);font-size:clamp(.95rem,2.4vw,1.05rem);line-height:1.55}.panel-mascot{width:96px;height:96px;margin:0 auto 12px;display:block}.btn-primary{background:var(--amber);color:var(--ink);border:none;font-family:var(--font-display);font-weight:500;font-size:1.125rem;padding:14px 28px;min-height:52px;border-radius:var(--radius-pill);box-shadow:0 6px 16px #ff7a4559;transition:transform .12s ease,box-shadow .12s ease,background .12s ease}.btn-primary:hover{background:#ff8a5a}.btn-primary:active{transform:translateY(1px);box-shadow:0 3px 10px #ff7a454d}.btn-primary:focus-visible{outline:3px solid var(--ink);outline-offset:2px}.btn-secondary{background:transparent;color:var(--ink-soft);border:none;font-family:var(--font-body);font-size:.95rem;padding:10px 14px;margin-top:8px;text-decoration:underline;text-underline-offset:3px}.btn-secondary:hover{color:var(--ink)}.btn-secondary:focus-visible{outline:2px solid var(--ink);outline-offset:2px;border-radius:6px}.card-backdrop{position:absolute;inset:0;z-index:6;display:flex;align-items:center;justify-content:center;padding:clamp(12px,3vw,24px);background:#140a028c;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);animation:overlay-in .22s ease-out;overflow-y:auto}.card{background:var(--cream);color:var(--ink);border-radius:var(--radius-card);padding:clamp(18px,4vw,32px);box-shadow:var(--shadow-card);max-width:580px;width:100%;animation:panel-in .32s cubic-bezier(.2,.8,.2,1)}.card-kicker{text-transform:uppercase;letter-spacing:.08em;font-size:.72rem;color:var(--amber);font-weight:600;margin-bottom:6px}.card-prompt{font-family:var(--font-display);font-size:clamp(1.15rem,3.2vw,1.5rem);margin:0 0 16px;line-height:1.25;color:var(--ink)}.card-hint{color:var(--ink-soft);font-size:.9rem;margin:0 0 12px}.card-target{font-family:var(--font-display);font-weight:500;font-size:clamp(2.2rem,8vw,3.2rem);text-align:center;letter-spacing:.04em;margin:4px 0 20px;color:var(--amber);background:var(--paper);border-radius:14px;padding:14px}.piece-pool{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;padding:12px 0 4px}.piece-tray{min-height:64px;background:var(--paper);border:2px dashed var(--amber-soft);border-radius:14px;padding:10px;display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:flex-start;margin:8px 0;transition:border-color .2s,background .2s}.piece-tray.is-correct{border-style:solid;border-color:var(--forest);background:var(--forest-soft)}.piece-tray.is-zone-hover{border-color:var(--amber);background:#ffd3bd33}.tray-sum{font-family:var(--font-display);font-size:1rem;color:var(--ink-soft);text-align:right;margin-bottom:4px}.tray-sum-value{font-size:1.4rem;font-weight:600;color:var(--amber)}.piece-btn{width:clamp(48px,11vw,64px);height:clamp(48px,11vw,64px);background:var(--piece-color, var(--sky));border:2px solid rgba(0,0,0,.15);border-radius:10px;color:#fff;font-family:var(--font-display);font-weight:600;font-size:clamp(.9rem,2.5vw,1.1rem);cursor:pointer;box-shadow:0 3px 8px #0003;transition:transform .1s ease,box-shadow .1s ease,opacity .12s;display:flex;align-items:center;justify-content:center;touch-action:none;user-select:none}.piece-btn:hover:not(:disabled){transform:translateY(-2px) scale(1.05);box-shadow:0 6px 16px #00000040}.piece-btn:focus-visible{outline:3px solid var(--ink);outline-offset:2px}.piece-btn.is-ghost{opacity:.3;pointer-events:none}.piece-btn.is-kb-selected{outline:3px solid var(--ink);outline-offset:2px;transform:scale(1.08)}.piece-btn.in-tray{box-shadow:0 2px 6px #00000026}.piece-btn.is-dragging{box-shadow:0 12px 32px #0006;transform:scale(1.08) rotate(4deg)}.piece-ten{width:clamp(80px,18vw,110px);background:var(--piece-color, #E05050);font-size:clamp(.85rem,2.2vw,1rem)}.piece-label{pointer-events:none}.balance-scale{margin:12px 0;position:relative;height:140px}.balance-arm{position:absolute;inset:0;display:flex;align-items:flex-start;justify-content:center;transition:transform .4s cubic-bezier(.4,0,.2,1);transform-origin:center 24px}.balance-beam{width:70%;height:6px;background:var(--wood);border-radius:3px;position:absolute;top:24px;left:15%;box-shadow:0 2px 6px #3c1c084d}.balance-arm:before{content:"";position:absolute;top:0;left:50%;transform:translate(-50%);width:6px;height:28px;background:var(--wood-dark);border-radius:3px}.balance-plate{position:absolute;bottom:0;width:80px;min-height:48px;background:var(--cream);border:2px solid var(--wood-light);border-radius:8px;padding:6px;display:flex;flex-direction:column;align-items:center;gap:4px}.balance-plate-left{left:8%}.balance-plate-right{right:8%}.balance-plate-value{font-family:var(--font-display);font-size:1.4rem;font-weight:600;color:var(--amber)}.balance-arm.is-balanced .balance-plate{border-color:var(--forest);background:var(--forest-soft)}.decompose-boxes{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin:16px 0 8px}.decompose-box{background:var(--paper);border:2px solid var(--amber-soft);border-radius:14px;padding:14px 16px;min-width:90px;text-align:center}.decompose-label{display:block;font-size:.78rem;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.06em;margin-bottom:8px}.decompose-controls{display:flex;align-items:center;gap:10px;justify-content:center}.decompose-dec,.decompose-inc{background:var(--paper-soft);border:2px solid var(--amber-soft);border-radius:8px;width:36px;height:36px;font-size:1.3rem;font-weight:700;color:var(--ink);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .1s,transform .1s}.decompose-dec:hover,.decompose-inc:hover{background:var(--amber-soft);transform:scale(1.08)}.decompose-dec:focus-visible,.decompose-inc:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.decompose-val{font-family:var(--font-display);font-size:1.6rem;font-weight:600;color:var(--amber);min-width:36px;text-align:center}.decompose-sum{text-align:center;font-size:.9rem;color:var(--ink-soft);margin:6px 0 12px}.machine-table{background:var(--paper);border-radius:12px;padding:12px;margin:8px 0 16px;display:flex;flex-direction:column;gap:6px}.machine-row{display:grid;grid-template-columns:1fr 40px 1fr;align-items:center;padding:6px 8px;border-radius:8px}.machine-header{font-size:.75rem;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-soft)}.machine-arrow{text-align:center;font-size:1.2rem;color:var(--amber)}.machine-test{background:var(--amber-soft);border-radius:8px}.machine-unknown{font-family:var(--font-display);font-size:1.4rem;font-weight:700;color:var(--amber);text-align:center}.rect-grid{display:grid;gap:4px;margin:12px auto;width:fit-content;touch-action:none;user-select:none}.rect-cell{width:clamp(28px,7vw,40px);height:clamp(28px,7vw,40px);background:var(--paper);border:2px solid var(--amber-soft);border-radius:6px;cursor:pointer;transition:background .1s,border-color .1s}.rect-cell.is-selected{background:var(--amber-soft);border-color:var(--amber)}.rect-grid.is-correct .rect-cell.is-selected{background:var(--forest-soft);border-color:var(--forest)}.rect-grid.is-wrong .rect-cell.is-selected{background:var(--danger-soft);border-color:var(--danger);animation:shake .22s ease-in-out 2}.rect-cell:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.share-counter{text-align:center;font-family:var(--font-display);font-size:1rem;color:var(--ink-soft);margin:8px 0}.pieces-left{font-size:1.6rem;color:var(--amber)}.share-boxes{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin:12px 0}.share-box{background:var(--paper);border:2px solid var(--amber-soft);border-radius:14px;padding:12px 14px;min-width:80px;text-align:center}.share-box-label{font-size:.75rem;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-soft);margin-bottom:8px;display:block}.share-box-controls{display:flex;align-items:center;gap:8px;justify-content:center}.share-dec,.share-inc{background:var(--paper-soft);border:2px solid var(--amber-soft);border-radius:8px;width:36px;height:36px;font-size:1.3rem;font-weight:700;color:var(--ink);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .1s,transform .1s}.share-dec:hover,.share-inc:hover{background:var(--amber-soft);transform:scale(1.08)}.share-dec:focus-visible,.share-inc:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.share-val{font-family:var(--font-display);font-size:1.6rem;font-weight:600;color:var(--amber);min-width:32px;text-align:center}.options{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:12px}.opt{background:var(--paper-soft);color:var(--ink);border:2px solid transparent;border-radius:14px;padding:14px 12px;min-height:56px;font-family:var(--font-display);font-weight:500;font-size:clamp(1rem,2.6vw,1.15rem);box-shadow:0 2px 6px #3c1c080f;transition:transform .12s ease,box-shadow .12s ease,border-color .12s ease}.opt:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 6px 16px #3c1c081a;border-color:var(--amber-soft)}.opt:focus-visible{outline:3px solid var(--ink);outline-offset:2px}.opt:disabled{cursor:default;opacity:.85}.opt.is-correct{background:var(--forest-soft);border-color:var(--forest);color:var(--forest)}.opt.is-wrong{background:var(--danger-soft);border-color:var(--danger);color:var(--danger)}.opt.is-faded{opacity:.55}.feedback{margin-top:14px;padding:12px 14px;border-radius:12px;font-size:.95rem;line-height:1.5;animation:bubble-in .24s ease-out}.feedback-correct{background:var(--forest-soft);color:var(--forest)}.feedback-wrong{background:var(--danger-soft);color:var(--danger)}.feedback strong{font-family:var(--font-display);font-weight:500}.card-actions{display:flex;justify-content:flex-end;margin-top:16px}.result-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:18px 0 6px}.stat{background:var(--paper-soft);border-radius:14px;padding:12px 8px}.stat-value{font-family:var(--font-display);font-size:1.6rem;color:var(--amber);line-height:1.1}.stat-label{font-size:.75rem;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.06em}.chip-back{background:#3c1c0899;color:var(--paper);border:1px solid rgba(255,200,80,.2);cursor:pointer;font-family:var(--font-display);gap:6px}.chip-back:hover{background:#3c1c08cc}.chip-back:focus-visible{outline:3px solid var(--paper);outline-offset:2px}.chip-back svg{width:18px;height:18px}.chip-combo{background:linear-gradient(135deg,#ff7a458c,#c878288c);color:var(--paper);border:1px solid rgba(255,200,80,.25);transition:transform .2s ease,box-shadow .2s ease;animation:combo-pop .28s cubic-bezier(.2,.8,.2,1)}.chip-combo.is-tier-1{box-shadow:0 0 18px #ffd3bd73}.chip-combo.is-tier-2{box-shadow:0 0 22px #ff9c508c}.chip-combo.is-tier-3{box-shadow:0 0 28px #ffc850b3;animation:combo-pulse 1.8s ease-in-out infinite}@keyframes combo-pop{0%{transform:scale(.86);opacity:0}to{transform:scale(1);opacity:1}}@keyframes combo-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.combo-icon{font-size:1.1em}.panel-kicker{font-family:var(--font-display);text-transform:uppercase;font-size:.75rem;letter-spacing:.12em;color:var(--amber);margin-bottom:6px}.panel-meta{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-bottom:18px}.meta-chip{background:var(--forest-soft);color:var(--forest);font-size:.8rem;padding:6px 12px;border-radius:var(--radius-pill);font-family:var(--font-display)}.meta-chip-warm{background:var(--amber-soft);color:var(--amber)}.result-badge{margin:16px 0 0;padding:14px;border-radius:14px;background:var(--cream);display:flex;align-items:center;justify-content:center;gap:10px;border:2px solid var(--amber-soft)}.result-badge .badge-icon{font-size:2rem;line-height:1}.result-badge strong{font-family:var(--font-display);font-weight:500;color:var(--ink)}.result-unlock{margin:14px 0 0;padding:14px;border-radius:14px;background:var(--forest-soft);color:var(--forest);display:flex;flex-direction:column;align-items:center;gap:4px;animation:bubble-in .3s ease-out}.result-unlock strong{font-family:var(--font-display);font-weight:500}.result-actions{display:flex;flex-direction:column;gap:6px;align-items:center;margin-top:18px}.overlay-map{background:radial-gradient(60% 60% at 50% 50%,#3c1c0873,#140802e0);padding:clamp(12px,3vw,28px)}.map-frame{background:var(--paper);border-radius:var(--radius-card);box-shadow:var(--shadow-card);max-width:760px;width:100%;height:100%;max-height:min(92vh,100%);min-height:0;overflow:hidden;display:flex;flex-direction:column;position:relative;animation:panel-in .36s cubic-bezier(.2,.8,.2,1)}.map-header{display:flex;align-items:center;justify-content:space-between;padding:clamp(14px,2.5vw,22px) clamp(16px,3vw,28px) 8px;flex-wrap:wrap;gap:10px}.map-title{font-family:var(--font-display);font-size:clamp(1.3rem,4vw,1.8rem);margin:0;color:var(--ink)}.map-stats{display:flex;gap:8px;flex-wrap:wrap}.map-stats .chip{background:var(--cream);color:var(--ink);border:1px solid var(--amber-soft)}.map-stage{position:relative;flex:1 1 auto;min-height:0;background:linear-gradient(180deg,#3b2208,#5c3010 70%,#7a4820);overflow:hidden}.map-svg{width:100%;height:100%;display:block}.map-trail{fill:none;stroke:url(#trail-grad);stroke-width:1.3;stroke-linecap:round;stroke-dasharray:2 1.6;opacity:.85}.map-node{cursor:pointer;transition:transform .2s ease}.map-node:focus{outline:none}.map-node:focus-visible .map-node-bg{stroke:var(--paper);stroke-width:.6}.map-node-bg{fill:var(--cream);stroke:#fff6;stroke-width:.3;transition:fill .24s ease}.map-node-ring{fill:none;stroke:transparent;stroke-width:.6;transition:stroke .2s ease}.map-node-icon{font-size:5.2px;pointer-events:none;user-select:none}.map-node-label{fill:var(--paper);font-family:var(--font-display);font-weight:500;pointer-events:none;paint-order:stroke;stroke:#3c1c0899;stroke-width:.3}.map-node-star{fill:var(--amber);pointer-events:none}.map-node.is-locked{cursor:not-allowed}.map-node.is-locked .map-node-bg{fill:#ffffff1f}.map-node.is-locked .map-node-icon,.map-node.is-locked .map-node-label{opacity:.5}.map-node.is-unlocked .map-node-bg{fill:var(--cream)}.map-node.is-pulse .map-node-bg{fill:var(--amber-soft)}.map-node.is-pulse .map-node-ring{stroke:var(--amber);animation:map-pulse 2.2s ease-in-out infinite}@keyframes map-pulse{0%,to{stroke-opacity:.4;transform:scale(1)}50%{stroke-opacity:1;transform:scale(1.4)}}.map-node.is-completed .map-node-bg{fill:var(--forest-soft)}.map-node.is-mastery .map-node-bg{fill:#ffe48a}.map-node.is-mastery .map-node-ring{stroke:#ffd37a;stroke-opacity:.9}.map-mascot{position:absolute;bottom:clamp(40px,8%,88px);right:clamp(8px,2vw,18px);width:clamp(48px,10vw,80px);height:clamp(48px,10vw,80px);pointer-events:none;filter:drop-shadow(0 4px 12px rgba(60,28,8,.45))}@media (max-height: 480px){.map-mascot{display:none}}.map-badges{display:grid;grid-template-columns:repeat(6,1fr);gap:4px;padding:14px clamp(14px,3vw,22px) 18px;background:var(--paper-soft);border-top:1px solid var(--amber-soft)}.badge{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 4px;border-radius:12px;opacity:.35;transition:opacity .2s ease}.badge.is-got{opacity:1}.badge.is-gold{background:linear-gradient(135deg,#ffe9b0,#ffd37a)}.badge .badge-icon{font-size:1.4rem;line-height:1}.badge .badge-name{font-size:.65rem;text-align:center;line-height:1.1;color:var(--ink-soft);font-family:var(--font-display)}.badge.is-got .badge-name{color:var(--ink)}@media (max-width: 520px){.map-badges{grid-template-columns:repeat(3,1fr)}}@media (max-height: 480px){.map-badges{padding:6px 10px;gap:2px}.map-badges .badge{padding:4px 2px}.map-badges .badge .badge-name{display:none}.map-header{padding:8px 16px 4px}.map-title{font-size:clamp(1rem,3vw,1.3rem)}}@media (max-width: 480px){.map-node-label{font-size:4.8px}.map-node-icon{font-size:6px}}.gadget-panel{text-align:center}.gadget-icon{width:120px;height:120px;margin:0 auto 12px;transition:transform .3s cubic-bezier(.2,.8,.2,1)}.gadget-icon-on{animation:gadget-appear .6s cubic-bezier(.2,.8,.2,1)}@keyframes gadget-appear{0%{transform:scale(.7) rotate(-6deg);opacity:.3}60%{transform:scale(1.12) rotate(3deg)}to{transform:scale(1) rotate(0);opacity:1}}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-4px)}75%{transform:translate(4px)}}@media (prefers-reduced-motion: reduce){.overlay,.panel,.card-backdrop,.card,.boris-bubble,.chip-combo,.result-unlock,.map-frame,.gadget-icon-on,.boris-avatar.is-bounce,.map-node.is-pulse .map-node-ring,.rect-grid.is-wrong .rect-cell{animation:none!important}.btn-primary,.opt,.piece-btn,.share-dec,.share-inc,.decompose-dec,.decompose-inc,.balance-arm{transition:none!important}}