.sp-wrap{--sp-face: #F0EADA;--sp-face-edge: #CFC7B2;--sp-ink: #22242A;--sp-red: #A03329;--sp-back: color-mix(in srgb, var(--accent) 34%, #20222a);--sp-back-line: color-mix(in srgb, #fff 12%, transparent);--sp-w: min(100%, 1080px, calc((100dvh - 288px)*2) );--sp-gx: clamp(3px, 1vw, 8px);display:flex;flex-direction:column;align-items:center;gap:clamp(.5rem,1.6vw,.8rem);width:100%}.sp-diffs,.sp-meta,.sp-top,.sp-stage,.sp-actions,.sp-hint-line,.sp-rotate{width:var(--sp-w)}.sp-diffs{display:flex;gap:.2rem;padding:.22rem;max-width:420px;border:1px solid var(--border);border-radius:12px;background:var(--surface-2)}.sp-diff{flex:1;padding:.42rem .3rem;border:0;border-radius:8px;background:transparent;color:var(--muted);font-family:var(--font-ui);font-size:.8rem;font-weight:600;letter-spacing:-.01em;cursor:pointer;transition:background .15s ease,color .15s ease,box-shadow .15s ease}.sp-diff.is-active{background:var(--surface);color:var(--text);box-shadow:var(--shadow-raised)}@media(hover:hover)and (pointer:fine){.sp-diff:not(.is-active):hover{color:var(--text)}}.sp-meta{display:flex;align-items:center;justify-content:space-between;gap:.7rem;flex-wrap:wrap;font-family:var(--font-ui);font-size:.78rem;color:var(--muted)}.sp-meta-right{display:flex;align-items:center;gap:clamp(.55rem,2.2vw,1.15rem);flex-wrap:wrap}.sp-stat{font-variant-numeric:tabular-nums;white-space:nowrap}.sp-stat b{color:var(--text);font-weight:600;font-family:var(--font-mono)}.sp-timer{font-family:var(--font-mono);font-variant-numeric:tabular-nums;color:var(--text);font-weight:600}.sp-top{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}.sp-founds{display:flex;gap:clamp(3px,.8vw,7px)}.sp-found{width:clamp(30px,6vw,52px);aspect-ratio:5 / 7;padding:0;position:relative;border-radius:clamp(4px,2vw,9px);border:1.5px dashed color-mix(in srgb,var(--text) 24%,transparent);background:color-mix(in srgb,var(--surface-2) 55%,transparent);display:grid;place-items:center;color:color-mix(in srgb,var(--text) 30%,transparent)}.sp-found.is-done{border-style:solid;border-color:var(--sp-face-edge);background:var(--sp-face);color:var(--sp-ink)}.sp-found.is-done.is-red{color:var(--sp-red)}.sp-found svg{width:46%;fill:currentColor}.sp-found .sp-found-k{position:absolute;top:6%;left:10%;font-family:var(--font-display);font-weight:600;font-size:clamp(.55rem,2.4vw,.82rem);line-height:1}.sp-stockwrap{display:flex;align-items:center;gap:.5rem}.sp-stock{position:relative;width:clamp(38px,8vw,62px);aspect-ratio:5 / 7;padding:0;flex:none;background:none;border:0;cursor:pointer}.sp-stock:disabled{cursor:default}.sp-stock .sp-fan{position:absolute;top:0;height:100%;border-radius:clamp(3px,1.6vw,8px);background:repeating-linear-gradient(-45deg,var(--sp-back-line) 0 3px,transparent 3px 7px),var(--sp-back);border:1px solid color-mix(in srgb,#000 30%,var(--sp-back));box-shadow:0 1px 2px color-mix(in srgb,#000 30%,transparent)}.sp-stock.is-empty{border:1.5px dashed color-mix(in srgb,var(--text) 24%,transparent);border-radius:clamp(3px,1.6vw,8px);background:color-mix(in srgb,var(--surface-2) 55%,transparent)}.sp-stock:focus-visible{outline:3px solid var(--ring);outline-offset:2px;border-radius:8px}.sp-stock-count{font-family:var(--font-mono);font-size:.74rem;color:var(--muted);font-variant-numeric:tabular-nums;line-height:1.2;max-width:5.5rem}.sp-stock-count b{color:var(--text);font-weight:600;display:block;font-size:.95rem}@media(hover:hover)and (pointer:fine){.sp-stock:not(:disabled):hover .sp-fan{filter:brightness(1.12)}}.sp-stage{position:relative;border-radius:var(--radius-card)}.sp-scroll{position:relative;z-index:0;overflow-x:auto;overscroll-behavior-x:contain;border-radius:inherit;padding-bottom:2px;-webkit-user-select:none;user-select:none}.sp-board{position:relative;z-index:0;width:max(100%,640px)}.sp-cols{display:grid;grid-template-columns:repeat(10,1fr);gap:var(--sp-gx);align-items:start}.sp-col{position:relative;z-index:0;min-width:0;container-type:inline-size}.sp-col.is-drop{outline:3px dashed var(--accent);outline-offset:2px;border-radius:8px}.sp-slot{display:grid;place-items:center;width:100%;aspect-ratio:5 / 7;padding:0;border:1.5px dashed color-mix(in srgb,var(--text) 26%,transparent);border-radius:clamp(4px,9cqw,10px);background:color-mix(in srgb,var(--surface-2) 55%,transparent);color:color-mix(in srgb,var(--text) 30%,transparent);cursor:pointer}.sp-slot:after{content:"";width:30%;aspect-ratio:1;border-radius:4px;border:1.5px dashed color-mix(in srgb,var(--text) 26%,transparent)}.sp-card{display:block;width:100%;aspect-ratio:5 / 7;padding:0;margin:0;position:absolute;left:0;top:0;border-radius:clamp(4px,9cqw,10px);border:1px solid var(--sp-face-edge);text-align:left;box-shadow:0 1px 2px color-mix(in srgb,#000 22%,transparent);transition:transform .12s ease,box-shadow .12s ease}.sp-card.is-up{background:var(--sp-face);color:var(--sp-ink)}.sp-card.is-red{color:var(--sp-red)}.sp-card.is-down{border-color:color-mix(in srgb,#000 30%,var(--sp-back));background:repeating-linear-gradient(-45deg,var(--sp-back-line) 0 4px,transparent 4px 9px),var(--sp-back)}button.sp-card{cursor:pointer;touch-action:none;-webkit-tap-highlight-color:transparent}button.sp-card:focus-visible{outline:3px solid var(--ring);outline-offset:2px;z-index:60}.sp-idx{position:absolute;top:5%;left:8%;display:flex;align-items:center;gap:5%;max-width:84%;pointer-events:none}.sp-idx b{font-family:var(--font-display);font-weight:600;font-variation-settings:"opsz" 30;line-height:1;letter-spacing:-.02em;font-size:clamp(.66rem,26cqw,1.4rem)}.sp-idx svg{width:clamp(.46rem,18cqw,1rem);flex:none;fill:currentColor}.sp-pip{position:absolute;left:50%;top:57%;transform:translate(-50%,-50%);width:40%;fill:currentColor;pointer-events:none}.sp-court{position:absolute;inset:14% 0 0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4%;pointer-events:none}.sp-court b{font-family:var(--font-display);font-weight:500;font-variation-settings:"opsz" 72;line-height:1;font-size:clamp(1.05rem,48cqw,2.6rem)}.sp-court svg{width:24%;fill:currentColor}.sp-card.is-sel{outline:3px solid var(--accent);outline-offset:-1px;transform:translateY(-6%);z-index:55;box-shadow:0 6px 14px color-mix(in srgb,#000 35%,transparent)}.sp-ghost{position:fixed;left:0;top:0;z-index:220;pointer-events:none;container-type:inline-size;filter:drop-shadow(0 8px 14px color-mix(in srgb,#000 40%,transparent))}.sp-ghost .sp-card{position:absolute;left:0;transition:none}.sp-card.is-dragging{opacity:.35}@keyframes sp-shake{10%,90%{transform:translate(-1px)}20%,80%{transform:translate(2px)}30%,50%,70%{transform:translate(-3px)}40%,60%{transform:translate(3px)}}.sp-col.sp-shake,.sp-stock.sp-shake{animation:sp-shake .38s cubic-bezier(.36,.07,.19,.97) both}.sp-actions{display:flex;gap:.6rem;justify-content:center;flex-wrap:wrap}.sp-actions .btn{cursor:pointer}.sp-actions .btn:disabled{opacity:.45;cursor:default;transform:none;box-shadow:var(--shadow-raised)}.sp-hint-line{color:var(--muted);font-size:.78rem;text-align:center;line-height:1.5}.sp-hint-line kbd{font-family:var(--font-mono);font-size:.82em;padding:.05em .35em;border:1px solid var(--border);border-radius:5px;background:var(--surface-2);color:var(--text)}.sp-rotate{display:none;color:var(--muted);font-size:.78rem;text-align:center;line-height:1.5}@media(max-width:560px)and (orientation:portrait){.sp-rotate{display:block}}.sp-overlay{position:absolute;inset:0;display:none;place-items:center;text-align:center;z-index:10;padding:1.1rem;border-radius:var(--radius-card);background:color-mix(in srgb,var(--surface-2) 84%,transparent);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);animation:sp-fade .2s ease both}@keyframes sp-fade{0%{opacity:0}to{opacity:1}}.sp-overlay.show{display:grid}.sp-stage:has(.sp-overlay.show){min-height:260px}.sp-over-kicker{font-family:var(--font-ui);font-size:.64rem;text-transform:uppercase;letter-spacing:.16em;font-weight:700;color:var(--ink-gold);margin-bottom:.35rem}.sp-over-title{font-family:var(--font-display);font-weight:600;font-variation-settings:"opsz" 40;font-size:clamp(1.6rem,6.5vw,2.2rem);letter-spacing:-.02em;color:var(--text);line-height:1.05}.sp-over-sub{color:var(--muted);font-size:.95rem;line-height:1.5;margin:.5rem auto 1.05rem;max-width:44ch}.sp-over-sub b{color:var(--text);font-weight:700}.sp-over-actions{display:flex;gap:.55rem;flex-wrap:wrap;justify-content:center}.modal-mini{font-size:.82rem;color:var(--muted)}.modal-confirm-msg{color:var(--muted);font-size:.95rem;line-height:1.55}.modal-actions{display:flex;gap:.6rem;justify-content:flex-end;flex-wrap:wrap}.modal-actions .btn{cursor:pointer}#statsModal .rp-stats{flex-wrap:wrap;row-gap:.9rem;gap:clamp(.9rem,4vw,1.8rem)}.sp-statbuckets{display:flex;gap:.2rem;padding:.22rem;margin-bottom:.2rem;border:1px solid var(--border);border-radius:12px;background:var(--surface-2)}.sp-statbucket{flex:1;padding:.4rem .3rem;border:0;border-radius:8px;background:transparent;color:var(--muted);font-family:var(--font-ui);font-size:.78rem;font-weight:600;cursor:pointer;transition:background .15s ease,color .15s ease,box-shadow .15s ease}.sp-statbucket.is-active{background:var(--surface);color:var(--text);box-shadow:var(--shadow-raised)}@media(prefers-reduced-motion:reduce){.sp-card{transition:none}.sp-col.sp-shake,.sp-stock.sp-shake,.sp-overlay{animation:none}}@media(max-width:640px){.sp-wrap{--sp-gx: clamp(2px, .8vw, 4px)}.sp-meta{font-size:.68rem;gap:.4rem}.sp-hint-line{display:none}.sp-idx{top:4%;left:6%}.sp-founds{gap:2px}}.sp-copy{max-width:var(--readw, 68ch);margin:clamp(1.8rem,5vw,2.8rem) auto 0}.sp-copy h2{font-family:var(--font-display);font-weight:500;font-variation-settings:"opsz" 40;font-size:clamp(1.25rem,3.6vw,1.6rem);letter-spacing:-.01em;color:var(--text);margin:clamp(1.4rem,3.5vw,2rem) 0 .6rem}.sp-copy h2:first-child{margin-top:0}.sp-copy p{color:var(--muted);font-size:1rem;line-height:1.7;margin:0 0 .9rem}.sp-copy p strong,.sp-copy li strong{color:var(--text);font-weight:600}.sp-copy a{color:var(--accent-hover);text-decoration:underline;text-underline-offset:2px}[data-theme=light] .sp-copy a{color:var(--accent)}.sp-copy ul{list-style:none;margin:0 0 .9rem;padding:0;display:grid;gap:.7rem}.sp-copy li{position:relative;padding-left:1.35rem;color:var(--muted);font-size:1rem;line-height:1.65}.sp-copy li:before{content:"";position:absolute;left:0;top:.6em;width:7px;height:7px;border-radius:2px;background:var(--ink-gold)}.sp-copy kbd{font-family:var(--font-mono);font-size:.84em;padding:.05em .35em;border:1px solid var(--border);border-radius:5px;background:var(--surface-2);color:var(--text)}.sp-ad{display:flex;justify-content:center;margin:clamp(1.6rem,4vw,2.6rem) 0 clamp(1rem,2.5vw,1.4rem)}
