.santong-main:not([data-phase=paper]){background:var(--wood)}.santong-main[data-phase=paper] .stage,.santong-main[data-phase=paper] .soban-board{display:none}.soban-board{padding:var(--space-5) 0 var(--space-8);color:#f3e9d2}.soban-inner{gap:var(--space-4);text-align:center;justify-items:center;display:grid}.soban-copy .play-lead{margin-bottom:0}.soban-props{gap:var(--space-3);grid-template-columns:minmax(0,1fr);justify-self:stretch;justify-items:center;display:grid;position:relative}.soban-mount,.soban-arrive{text-align:left;width:100%}.soban-mount:empty,.soban-arrive:empty{display:none}.soban-arrive .arrive-slip{--slip-behind:var(--wood)}.st-tube{transform-origin:50% 92%;width:120px;height:180px}.st-tube svg{width:100%;height:100%;display:block;overflow:visible}.st-tube.is-shaking{animation:.16s ease-in-out infinite alternate st-shake}@keyframes st-shake{0%{rotate:-8deg}to{rotate:8deg}}.st-pop{transform-box:fill-box;transform-origin:50% 100%;transition:transform .3s var(--spring);transform:translateY(70px)}.st-tube.is-popped .st-pop-a{transform:translateY(-6px)rotate(-9deg)}.st-tube.is-popped .st-pop-b{transform:translateY(-16px)rotate(7deg)}.st-stem{fill:#1e1b16;font-family:var(--font-serif);font-size:12px;font-weight:700}.st-dots{gap:10px;margin:0;padding:0;list-style:none;display:flex}.st-dots li{background:#33235a;border:2px solid #1e1b16;border-radius:50%;width:14px;height:14px;transition:background-color .12s ease-out}.st-dots li.is-on{background:#fed73c}.soban-action{gap:var(--space-2);justify-items:center;display:grid}.st-press{color:#1b2b3a;width:96px;height:96px;font:inherit;cursor:pointer;touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;background:#fed73c;border:2px solid #1e1b16;border-radius:50%;place-content:center;font-size:15px;font-weight:800;line-height:1.25;display:grid;box-shadow:0 5px #b8891b,0 5px 0 2px #1e1b16}.st-press:active,.st-press.is-holding{translate:0 3px;box-shadow:0 2px #b8891b,0 2px 0 2px #1e1b16}.st-press:disabled{cursor:default;opacity:.6}.st-press:focus-visible{outline:none;box-shadow:0 0 0 3px #5a3a28,0 0 0 6px #f3e9d2,0 5px #b8891b}.st-free{margin:var(--space-2) 0 0;border-radius:var(--radius-full);color:#fed73c;background:#33235a;border:2px solid #1e1b16;padding:4px 14px;font-size:13px;font-weight:800}.st-free:empty{display:none}.st-note{color:#d9c8b4;margin:0;font-size:13px}.yakjang{background:var(--wood-dark);border-radius:8px;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;width:min(100%,360px);margin:0;padding:8px;list-style:none;display:none;box-shadow:0 4px #1e1b16}.yakjang li{border:2px solid var(--wood-edge);color:#f3e9d2;font-family:var(--font-serif);background:#4a2e1f;border-radius:4px;justify-items:center;gap:6px;padding:8px 0 10px;font-size:18px;font-weight:700;line-height:1;display:grid}.yakjang li:after{content:"";background:#fed73c;border-radius:50%;width:10px;height:10px;box-shadow:0 0 0 2px #1e1b16}.yakjang li.is-open{color:#1e1b16;animation:st-drawer .32s var(--spring) both;background:#f3e9d2;border-color:#fed73c;box-shadow:0 0 0 2px #fed73c}@keyframes st-drawer{0%{translate:0;scale:1}to{translate:0 5px;scale:1.06}}.santong-main:is([data-phase=drawer],[data-phase=arrive]) :is(.soban-copy,.st-tube,.st-dots,.soban-action){display:none}.santong-main:is([data-phase=drawer],[data-phase=arrive]) .yakjang{display:grid}.santong-main[data-phase=gate] :is(.soban-props,.soban-action){display:none}.st-stalk{color:#1e1b16;width:22px;height:64px;font-family:var(--font-serif);background:linear-gradient(#c8392b 0 8px,#f3e9d2 8px);border-radius:3px;justify-items:center;padding-top:12px;font-size:13px;font-weight:700;line-height:1;display:grid;box-shadow:0 2px #1e1b1659}.paper-cards .st-stalk{width:18px;height:52px;font-size:12px}@media (width>=768px){.soban-inner{column-gap:var(--space-6);grid-template-columns:minmax(0,1fr) 300px;grid-template-areas:"props copy""props action""mount mount""arrive arrive";align-items:center}.soban-props{column-gap:var(--space-6);padding:var(--space-5);border:1px solid #f3e9d22e;border-radius:12px;grid-area:props;grid-template-columns:160px auto;grid-template-areas:"tube drawers""dots drawers";justify-content:center;justify-self:stretch;align-items:center}.soban-copy{grid-area:copy;align-self:end}.soban-action{grid-area:action;align-self:start}.soban-mount{grid-area:mount}.soban-arrive{max-width:var(--col);grid-area:arrive;justify-self:center}.st-tube{grid-area:tube;width:160px;height:240px}.st-dots{grid-area:dots;justify-self:center}.yakjang{grid-area:drawers;grid-template-columns:repeat(5,60px);width:auto;display:grid}.st-press{width:112px;height:112px;font-size:16px}.santong-main:is([data-phase=drawer],[data-phase=arrive]) :is(.soban-copy,.st-tube,.st-dots){display:revert}.santong-main:is([data-phase=drawer],[data-phase=arrive]) .st-tube{display:block}.santong-main:is([data-phase=drawer],[data-phase=arrive]) .st-dots{display:flex}}@media (prefers-reduced-motion:reduce){.st-tube.is-shaking,.yakjang li.is-open{animation:none}.st-pop{transition:none}}.santong-main[data-phase=gate] .soban-copy .play-lead{display:none}