.ocard{--c1:#f7d965;--c2:#d6a11c;--edge:#7a5508;aspect-ratio:3/4;border:1px solid var(--edge);background:radial-gradient(120% 90% at 50% 35%, color-mix(in srgb, var(--c1) 92%, #fff), var(--c2) 78%);color:#2a1a06;border-radius:9%/7%;place-items:center;display:grid;position:relative;box-shadow:inset 0 1px #fff6,inset 0 -2px #0002,0 2px 5px #0007;container-type:inline-size}.ocard:before{content:"";background:radial-gradient(circle at 0 0, color-mix(in srgb, var(--edge) 55%, transparent) 0 9cqw, transparent 9.5cqw), radial-gradient(circle at 100% 0, color-mix(in srgb, var(--edge) 55%, transparent) 0 9cqw, transparent 9.5cqw), radial-gradient(circle at 0 100%, color-mix(in srgb, var(--edge) 55%, transparent) 0 9cqw, transparent 9.5cqw), radial-gradient(circle at 100% 100%, color-mix(in srgb, var(--edge) 55%, transparent) 0 9cqw, transparent 9.5cqw);pointer-events:none;border:max(1px,2.4cqw) solid #ffffff6b;border-radius:6%/4.5%;position:absolute;inset:7%}.ocard__value{font:400 68cqw/1 var(--font-display);letter-spacing:0;-webkit-text-stroke:max(.5px, 1.6cqw) currentColor;paint-order:stroke fill;text-shadow:0 2cqw #fff5;font-variant-numeric:lining-nums;position:relative}.ocard--red{--c1:#f16550;--c2:#bb2718;--edge:#64110a;color:#2a0905}.ocard--blue{--c1:#67b3f2;--c2:#2565ba;--edge:#0f3466;color:#07182f}.ocard--mini{width:26px}.ocard--micro{width:20px}.ocard--mini:before,.ocard--micro:before{background:0 0;border-width:1px}.otable{border:1px solid var(--line);border-radius:var(--radius-md);background:radial-gradient(120% 140% at 50% 0%, color-mix(in srgb, var(--accent) 7%, var(--surface-2)), var(--bg-2));grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(8px,1.8vw,16px);max-width:500px;margin-inline:auto;padding:16px clamp(12px,2.4vw,22px) 30px;display:grid;box-shadow:inset 0 1px #ffffff0a}.otable__slot{aspect-ratio:3/4;cursor:pointer;transition:transform var(--ease), filter var(--ease);background:0 0;border:0;border-radius:9%/7%;place-items:center;padding:0;display:grid;position:relative}.otable__slot .ocard{width:100%;transition:box-shadow var(--ease)}.otable__slot:not(.is-empty):hover .ocard{box-shadow:0 0 0 2px var(--fg), 0 2px 5px #0007}.otable__slot.is-empty{cursor:default;border:1.5px dashed var(--line);color:var(--muted);font:400 clamp(18px, 3vw, 26px) var(--font-display)}.otable__slot.is-waiting{border-color:color-mix(in srgb, var(--accent) 70%, transparent);color:var(--accent);animation:1.6s ease-in-out infinite slot-wait}@keyframes slot-wait{50%{border-color:color-mix(in srgb, var(--accent) 25%, transparent)}}.otable__slot.is-play,.otable__slot.is-discard{transform:translateY(-6px)}.otable__slot.is-play .ocard{box-shadow:0 0 0 2px var(--bg-2), 0 0 0 4px var(--c-tool), 0 8px 18px -6px color-mix(in srgb, var(--c-tool) 70%, transparent)}.otable__slot.is-discard .ocard{box-shadow:0 0 0 2px var(--bg-2), 0 0 0 4px var(--accent), 0 8px 18px -6px color-mix(in srgb, var(--accent) 70%, transparent)}.otable__slot.is-dim{filter:brightness(.55)saturate(.55)}.otable__tag{font:500 10px/1.5 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;color:#fff;background:color-mix(in srgb, var(--c-tool) 82%, #000);border-radius:4px;padding:1px 6px;position:absolute;top:calc(100% + 6px);left:50%;transform:translate(-50%)}.otable__tag--discard{background:var(--accent-solid)}@media (max-width:480px){.otable{padding-bottom:16px}.otable__tag{display:none}}.advice__title .points,.move__label .points{font:500 14px var(--font-mono);color:var(--c-tool)}@media (max-width:560px){.board .advice--draw{display:none}.board .panel__meta{flex-basis:100%}.board .seg{flex:1}}.moves__list{list-style:none}.move{align-items:center;gap:var(--space-3);border-top:1px solid color-mix(in srgb, var(--line) 60%, transparent);transition:background var(--ease);grid-template-columns:76px minmax(0,1fr) minmax(40px,110px) 58px 58px 40px auto;padding:7px 18px;font-size:14.5px;display:grid}.move--head{font:500 10.5px var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);border-top:0;padding-block:6px}.move--head .move__pct,.move--head .move__mean{font:inherit}.move:not(.move--head):hover{background:var(--surface-2)}.move--best{background:color-mix(in srgb, var(--c-tool) 8%, transparent)}.move__cards{gap:3px;display:flex}.move__bar{border-radius:var(--radius-pill);background:var(--surface-2);height:6px;overflow:hidden}.move__bar span{background:var(--accent);height:100%;display:block}.move--best .move__bar span{background:var(--c-tool)}.move__pct,.move__mean{font:500 13px var(--font-mono);text-align:end;color:var(--muted)}.move__pct.is-target{color:var(--fg)}.move--head .move__pct.is-target{color:var(--accent)}.move__pct small{color:var(--accent);font-size:11px;display:block}@media (max-width:640px){.move{gap:var(--space-2);grid-template-columns:52px minmax(0,1fr) 50px 50px auto;padding-inline:12px}.move__bar,.move__mean{display:none}.move .btn--small{padding:0 8px}}.deck__grid{gap:8px;width:100%;max-width:480px;margin-inline:auto;padding:14px 18px 10px;display:grid}.deck__row{grid-template-columns:repeat(8,minmax(0,1fr));gap:6px;display:grid}.deck__card{transition:transform var(--ease), opacity var(--ease);background:0 0;border:0;border-radius:9%/7%;padding:0;display:block;position:relative}.deck__card .ocard{width:100%}button.deck__card:not(:disabled){cursor:pointer}button.deck__card:not(:disabled):hover{transform:translateY(-3px)}button.deck__card:disabled{opacity:.8;cursor:default}.deck__card.is-used{opacity:.16;filter:grayscale(.8)}.deck__card.is-hand{opacity:.5}.deck__card.is-hand .ocard{box-shadow:0 0 0 2px var(--fg)}.deck.is-active{border-color:color-mix(in srgb, var(--accent) 60%, var(--line))}.deck__legend{color:var(--muted);flex-wrap:wrap;gap:4px 16px;padding:0 18px;font-size:13px;list-style:none;display:flex}.deck__legend li{align-items:center;gap:6px;display:flex}.deck__key{background:#e2b335;border-radius:2px;width:10px;height:13px}.deck__key.is-hand{opacity:.5;box-shadow:0 0 0 1.5px var(--fg)}.deck__key.is-used{opacity:.18}.deck__hint{border-radius:var(--radius-sm);background:var(--surface-2);color:var(--muted);margin:10px 18px 16px;padding:9px 12px;font-size:13.5px}.deck.is-active .deck__hint{color:var(--fg);background:color-mix(in srgb, var(--accent) 12%, var(--surface-2))}
