.app-shell{color:#f9fafb;background:#000;grid-template-rows:auto 1fr;min-height:100svh;display:grid;overflow:hidden}h1,h2,h3,p{margin:0}.app-shell :where(button,input,select){font:inherit}.app-shell button{cursor:pointer;border:0}.app-shell button:disabled{cursor:not-allowed;opacity:.46}.card-art-region{border-radius:inherit;position:absolute;inset:0;overflow:hidden}.card-art-region-image{-webkit-user-select:none;user-select:none;pointer-events:none;max-width:none;position:absolute}.card-art-region-mask{display:none}.card-art-fill,.pile-card-art{position:absolute;inset:0}.playing-card.revealed.custom-art-card .card-art-fill{border-radius:inherit;inset:5%}.playing-card.revealed.custom-art-card:before{display:none}.app-shell :where(button,input,select):focus-visible{outline-offset:2px;outline:3px solid #f6a21a}.card-stage{perspective:1800px;grid-template-columns:minmax(0,1fr) minmax(280px,360px);align-items:center;gap:clamp(18px,4vw,42px);min-height:0;padding:0 clamp(16px,4vw,44px) clamp(18px,3vw,34px);display:grid}.card-board{justify-self:center;gap:clamp(12px,2vh,22px);width:min(100%,71.4286svh - 135.714px);min-width:280px;max-width:820px;display:grid}.active-card-slot{place-items:center;display:grid;position:relative}.playing-card{aspect-ratio:5/7;width:100%;color:var(--card-ink);transform-origin:50%;transform-style:preserve-3d;will-change:transform, opacity;background:linear-gradient(145deg,#fffffffa,#f5f5f1f0),#fff;border:1px solid #ffffffd1;border-radius:clamp(18px,3vw,34px);justify-self:center;position:relative;overflow:hidden;box-shadow:0 24px 70px #00000061}.card-motion-forward{animation:.52s cubic-bezier(.22,.8,.2,1) both flip-from-unflipped}.card-motion-backward{animation:.52s cubic-bezier(.22,.8,.2,1) both flip-from-flipped}.card-motion-reset{animation:.26s ease-out both reset-card}.exit-card{z-index:3;pointer-events:none;position:absolute;inset:0}.exit-forward{animation:.52s cubic-bezier(.22,.8,.2,1) both card-to-flipped}.exit-backward{animation:.52s cubic-bezier(.22,.8,.2,1) both card-to-unflipped}.playing-card.revealed:before{content:"";border-radius:inherit;pointer-events:none;position:absolute;inset:5%}.playing-card.revealed:not(.sprite-card){box-shadow:none;background:0 0;border:0}.playing-card.revealed:not(.sprite-card):before{background:linear-gradient(145deg,#fffffffa,#f5f5f1f0),#fff;box-shadow:0 24px 70px #00000061}.playing-card.red{color:#c8465f}.playing-card.sprite-card{box-shadow:none;background:0 0;border:0}.playing-card.sprite-card:before{display:none}.playing-card.card-back{color:#fff;background:0 0;border:0}.back-pattern{border-radius:inherit;background-image:linear-gradient(45deg,#ffffff14 25%,#0000 25%),linear-gradient(-45deg,#ffffff14 25%,#0000 25%);background-size:34px 34px;border:4px double #ffffffbd;place-items:center;display:grid;position:absolute;inset:8%}.back-mark{aspect-ratio:1;background:#0003;border:2px solid #ffffffb8;border-radius:50%;place-items:center;width:min(40%,220px);font-size:clamp(34px,8vw,96px);font-weight:900;display:grid}.card-image{object-fit:cover;width:100%;height:100%;display:block}.card-image.full{object-fit:contain;position:absolute;inset:0}.card-image.character{object-fit:contain;width:74%;height:76%;position:absolute;inset:12% 13%}.face-card-sprite{background-repeat:no-repeat;background-size:300% 400%;position:absolute;inset:0}.corner{z-index:2;justify-items:center;gap:2px;font-size:clamp(56px,12vw,148px);line-height:.9;display:grid;position:absolute}.corner strong{font-size:.9em}.corner span{font-size:.68em}.top-left{top:6%;left:6%}.bottom-right{bottom:6%;right:6%;transform:rotate(180deg)}.suit-portrait{text-align:center;background:linear-gradient(145deg, color-mix(in srgb, var(--card-accent) 18%, transparent), transparent 72%), #ffffff94;border-radius:26px;place-items:center;display:grid;position:absolute;inset:14%}.suit-symbol{color:var(--card-ink);font-size:clamp(130px,24vw,280px);line-height:.85}.joker-face{text-transform:uppercase;color:currentColor;background:linear-gradient(135deg,#00a9a529,#0000 46%),linear-gradient(225deg,#f6a21a38,#0000 44%);border:4px solid;border-radius:28px;align-content:center;place-items:center;gap:24px;display:grid;position:absolute;inset:10%}.joker-face span{font-size:clamp(42px,11vw,130px);font-weight:950;line-height:.9}.joker-face strong{font-size:clamp(120px,22vw,260px);line-height:.8}.deck-pile{width:min(38%,230px);min-width:120px}.deck-pile.flipped{justify-self:end}.pile-side{--base-width:100%;--pile-corner-radius:6px;--pile-top-lift:0px;height:70px;opacity:var(--pile-opacity);transition:opacity .26s,transform .26s;position:relative}.pile-top,.pile-edge{border-radius:7px;position:absolute;left:0;right:0}.pile-top{--pile-top-depth:52px;bottom:calc(var(--pile-height) - var(--pile-top-lift));z-index:1;height:var(--pile-top-depth);transform:perspective(160px) rotateX(28deg) translateY(var(--pile-top-lift)) translateX(-2px) scaleX(.99);transform-origin:bottom;transform-style:preserve-3d;border-radius:var(--pile-corner-radius);overflow:hidden;box-shadow:0 2px #ffffff4d,0 8px 14px #00000052;container-type:inline-size}.pile-edge{--pile-edge-fill:#151922;--pile-line-color:#ffffff85;z-index:0;height:max(var(--pile-height), 2px);box-sizing:border-box;border-radius:0 0 var(--pile-corner-radius) var(--pile-corner-radius);background:var(--pile-edge-fill);transform-origin:0 100%;border:1px solid #ffffff47;border-top-width:0;min-height:2px;transition:height .26s;bottom:0;overflow:visible;transform:perspective(260px)rotateX(1deg)scaleX(.98);box-shadow:inset 8px 0 14px #ffffff14,inset -12px 0 16px #00000038,0 8px 14px #00000047}.pile-edge:before{content:"";border-radius:0 0 var(--pile-corner-radius) var(--pile-corner-radius);pointer-events:none;inset:calc(-1 * var(--pile-corner-fill)) 0 0 0;background:linear-gradient(90deg, #ffffff2e, transparent 18%, transparent 76%, #0000003d), var(--pile-edge-fill);position:absolute}.pile-edge-lines{inset:calc(-1 * var(--pile-corner-fill)) 0 0 0;width:100%;height:calc(100% + var(--pile-corner-fill));color:var(--pile-line-color);opacity:.72;clip-path:inset(0 0 0 0 round 0 0 var(--pile-corner-radius) var(--pile-corner-radius));pointer-events:none;position:absolute;overflow:hidden}.pile-edge-lines path{fill:none;stroke:currentColor;stroke-linecap:round;stroke-width:var(--pile-line-stroke-width)}.deck-pile.unflipped .pile-top{background:#11151d;border:1px solid #ffffff61}.deck-pile.unflipped .pile-top:before,.deck-pile.unflipped .pile-top:after{display:none}.deck-pile.unflipped .pile-edge{--pile-edge-fill:linear-gradient(90deg, #2c313b, #151922 48%, #090b10), #151922;--pile-line-color:#ffffff80}.deck-pile.flipped .pile-top{background:linear-gradient(145deg,#fff,#ecece6),#fff;border:1px solid #1118276b}.pile-card-face{width:var(--pile-top-depth);box-sizing:border-box;height:100cqw;color:var(--pile-card-ink);border:1px solid color-mix(in srgb, var(--pile-card-accent) 44%, transparent);transform-origin:50%;background:linear-gradient(145deg,#fffffffa,#f5f5f1f0),#fff;border-radius:8%;position:absolute;top:50%;left:50%;overflow:hidden;transform:translate(-50%,-50%)rotate(-90deg)}.pile-card-face:before{content:"";background:linear-gradient(145deg, color-mix(in srgb, var(--pile-card-accent) 12%, transparent), transparent 68%);border-radius:7%;position:absolute;inset:7%}.pile-card-back-face:before{display:none}.pile-card-back-image{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.pile-card-face-sprite{background-repeat:no-repeat;background-size:300% 400%;position:absolute;inset:0}.pile-card-face-corner{z-index:1;justify-items:center;font-size:18px;font-weight:900;line-height:.9;display:grid;position:absolute;top:8%;left:8%}.pile-card-face-corner span{font-size:.72em}.pile-card-face-center,.pile-card-face-joker{z-index:1;place-items:center;font-size:42px;font-weight:900;line-height:1;display:grid;position:absolute;inset:0}.pile-card-face-joker{color:#101820;text-transform:uppercase;font-size:20px}.deck-pile.flipped .pile-edge{--pile-edge-fill:linear-gradient(90deg, #fff, #ebece7 48%, #c5c7c0), #fff;--pile-line-color:#11182757;border-color:#1118275c}.audio-spinner{box-sizing:border-box;border:2px solid #ffffff52;border-top-color:#ffffffeb;border-radius:50%;width:16px;height:16px;animation:.72s linear infinite audio-spinner-rotate}.deck-studio-overlay{opacity:0;transition:opacity .22s}.deck-studio-overlay.is-open{opacity:1}.deck-studio-panel{opacity:0;transition:opacity .22s,transform .22s;transform:translate(26px)}.deck-studio-overlay.is-open .deck-studio-panel{opacity:1;transform:translate(0)}.deck-detection-spinner{animation:.9s linear infinite audio-spinner-rotate}.deck-detection-log ul{background:#f5f7f2;border:1px solid #e2e7dd;border-radius:10px;max-height:160px;margin:0;padding:10px 12px;list-style:none;overflow:auto}.deck-detection-log li{color:#495463;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:11px;line-height:1.45}.deck-detection-log li+li{margin-top:5px}.deck-studio-image-stage{touch-action:none;background:#101820;border:1px solid #dfe1da;border-radius:18px;width:min(100%,820px);position:relative;overflow:hidden}.deck-studio-image-stage.is-drawing{cursor:crosshair}.deck-studio-image{-webkit-user-select:none;user-select:none;pointer-events:none;width:100%;height:auto;display:block}.deck-region{background:#ffffff0f;border:2px solid #7dd3fc;border-radius:10px;padding:0;display:block;position:absolute;box-shadow:inset 0 0 0 999px #7dd3fc14}.deck-region.is-manual{border-color:#f6a21a;box-shadow:inset 0 0 0 999px #f6a21a1a}.deck-region.is-selected{z-index:2;box-shadow:0 0 0 2px #ffffffb8,inset 0 0 0 999px #ffffff0f}.deck-region-draft{border-style:dashed}.deck-region-label{color:#fff;white-space:nowrap;text-overflow:ellipsis;background:#000000a3;border-radius:999px;max-width:calc(100% - 12px);padding:4px 8px;font-size:11px;font-weight:800;position:absolute;bottom:6px;left:6px;overflow:hidden}.deck-region-handle{background:#fff;border:2px solid;border-radius:50%;width:12px;height:12px;position:absolute}.deck-region-handle.top-left{top:-7px;left:-7px}.deck-region-handle.top-right{top:-7px;right:-7px}.deck-region-handle.bottom-left{bottom:-7px;left:-7px}.deck-region-handle.bottom-right{bottom:-7px;right:-7px}.deck-contour-details{gap:8px;display:grid}.deck-contour-details summary{cursor:pointer;color:#2f3946;font-size:12px;font-weight:700}.deck-contour-table-wrap{border:1px solid #e2e7dd;border-radius:10px;max-height:260px;overflow:auto}.deck-contour-table{border-collapse:collapse;width:100%;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:11px}.deck-contour-table th,.deck-contour-table td{text-align:left;white-space:nowrap;border-bottom:1px solid #edf0ea;padding:6px 8px}.deck-contour-table th{color:#44505f;background:#f6f8f3;font-weight:800;position:sticky;top:0}.deck-debug-candidate-list ol{gap:6px;margin:0;padding-left:18px;display:grid}.deck-debug-candidate-list li{color:#66707c;justify-content:space-between;align-items:baseline;gap:12px;font-size:12px;display:flex}.deck-debug-candidate-list li span:first-child{overflow-wrap:anywhere;min-width:0}.deck-debug-preview-canvas{width:100%;min-height:72px;image-rendering:pixelated;background:#fff;border:1px solid #d8ded2;border-radius:8px}@media (width<=860px){.app-shell{overflow:hidden}.card-stage{grid-template-rows:minmax(0,auto) auto;grid-template-columns:1fr;align-content:center;gap:12px;min-height:0;padding-bottom:16px}.card-board{gap:8px;width:min(92vw,71.4286svh - 228.571px);min-width:220px}.pile-side{height:42px}}@media (width>=861px) and (height<=760px){.card-stage{padding-bottom:14px}.card-board{gap:10px;width:min(100%,71.4286svh - 107.143px)}.pile-side{height:48px}}@media (width<=560px){.card-stage{padding-inline:10px;gap:8px;padding-bottom:10px}.card-board{gap:6px;width:min(88vw,71.4286svh - 208.571px);min-width:190px}.deck-pile{min-width:88px}.pile-side{height:36px}}@keyframes flip-from-unflipped{0%{opacity:.2;transform:translate(-36%,54%)rotateY(-84deg)rotate(-4deg)scale(.18)}58%{opacity:1;transform:translate(3%,-1%)rotateY(7deg)rotate(1deg)scale(1.02)}to{opacity:1;transform:translate(0)rotateY(0)rotate(0)scale(1)}}@keyframes flip-from-flipped{0%{opacity:.2;transform:translate(36%,54%)rotateY(84deg)rotate(4deg)scale(.18)}58%{opacity:1;transform:translate(-3%,-1%)rotateY(-7deg)rotate(-1deg)scale(1.02)}to{opacity:1;transform:translate(0)rotateY(0)rotate(0)scale(1)}}@keyframes card-to-flipped{0%{opacity:1;transform:translate(0)rotateY(0)rotate(0)scale(1)}to{opacity:0;transform:translate(36%,54%)rotateY(82deg)rotate(4deg)scale(.18)}}@keyframes card-to-unflipped{0%{opacity:1;transform:translate(0)rotateY(0)rotate(0)scale(1)}to{opacity:0;transform:translate(-36%,54%)rotateY(-82deg)rotate(-4deg)scale(.18)}}@keyframes reset-card{0%{opacity:.65;transform:scale(.98)}to{opacity:1;transform:scale(1)}}@keyframes audio-spinner-rotate{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.card-motion-forward,.card-motion-backward,.card-motion-reset,.exit-card,.audio-spinner{animation:none}.deck-studio-overlay,.deck-studio-panel,.pile-side,.pile-edge{transition:none}}:root{color:#f9fafb;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#111318;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html{background:#111318;min-height:100%}body{min-width:320px;min-height:100svh;margin:0}#root{min-height:100svh}