.fan{position:relative;height:420px;perspective:1200px}.fan .fc{position:absolute;left:50%;top:50%;width:220px;height:300px;margin:-150px 0 0 -110px;border-radius:24px;padding:22px;display:grid;align-content:space-between;color:#111;box-shadow:0 30px 60px -30px #0000008c;transform-style:preserve-3d;transition:transform .6s var(--ease-out)}.fan .fc b{font-weight:900;font-size:22px;line-height:1.1}.fan .fc .suit{width:46px;height:46px;border-radius:50%;background:#ffffff8c;display:grid;place-items:center;font-weight:900;font-size:20px}.fan .fc small{font-weight:700;font-size:12px;letter-spacing:.16em;text-transform:uppercase}.table{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:24px;align-items:start}.hand{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}.card{font:inherit;text-align:left;min-height:120px;padding:14px;border-radius:16px;border:0;background:var(--surface);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line),0 10px 24px -16px #0006;cursor:grab;font-size:14px;font-weight:700;line-height:1.35;display:grid;align-content:space-between;gap:10px;transition:transform .3s var(--ease-spring),box-shadow .2s}.card:before{content:"?";width:26px;height:26px;border-radius:8px;background:var(--bg-2);display:grid;place-items:center;font-weight:900;color:var(--muted)}.card:hover{transform:translateY(-4px) rotate(-1deg)}.card[aria-pressed=true]{box-shadow:inset 0 0 0 2.5px var(--green),0 16px 30px -16px #00000080;transform:translateY(-8px)}.card.placed{cursor:default;background:color-mix(in srgb,var(--sc) 22%,var(--surface));box-shadow:inset 0 0 0 1.5px var(--sc);transform:none;min-height:0}.card.placed:before{content:"\2713";background:var(--sc);color:#111}.card.nope{animation:nope .4s}@keyframes nope{25%{transform:translate(-8px)}75%{transform:translate(8px)}}.suits{display:grid;gap:12px;position:sticky;top:90px}.suit-col{border-radius:20px;padding:14px;background:var(--glass);box-shadow:inset 0 0 0 1.5px var(--sc);display:grid;gap:8px}.suit-col.drop{background:color-mix(in srgb,var(--sc) 18%,transparent)}.suit-head{display:flex;align-items:center;gap:10px;justify-content:space-between}.suit-head b{font-weight:900}.suit-head .cnt{font-weight:900;font-variant-numeric:tabular-nums;font-size:14px;color:var(--muted)}.place-btn{font:inherit;font-weight:700;font-size:13px;min-height:40px;padding:0 14px;border-radius:999px;border:1.5px solid var(--sc);background:transparent;color:var(--ink);cursor:pointer}.suit-cards{display:grid;gap:6px}.gauge{height:14px;border-radius:8px;background:var(--line);overflow:hidden;margin-top:6px}.gauge i{display:block;height:100%;width:0;background:var(--green);transition:width .6s var(--ease-out)}.modes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.mode{padding:20px;border-radius:20px;background:var(--surface);box-shadow:inset 0 0 0 1px var(--line)}.mode b{display:block;font-weight:900;font-size:19px;margin-bottom:6px}@media (max-width: 900px){.table{grid-template-columns:minmax(0,1fr)}.suits{position:static}.fan{height:360px}}@media (max-width: 600px){.modes{grid-template-columns:minmax(0,1fr)}.fan{height:300px;overflow:hidden}.fan .fc{width:150px;height:210px;margin:-105px 0 0 -75px;padding:14px}.fan .fc b{font-size:17px}.fan .fc:nth-child(1){transform:rotate(-12deg) translate(-84px,16px)!important}.fan .fc:nth-child(2){transform:rotate(-4deg) translate(-28px,-4px)!important}.fan .fc:nth-child(3){transform:rotate(4deg) translate(28px,-4px)!important}.fan .fc:nth-child(4){transform:rotate(12deg) translate(84px,16px)!important}}.hand .card b,.suit-cards .card b{display:block}.card .cd{display:none;font-weight:400;font-size:13px;line-height:1.45;margin-top:6px;opacity:.85}.card.placed .cd{display:block}.anchors-full{margin-top:22px;border-radius:22px;box-shadow:inset 0 0 0 1px var(--line);background:var(--surface);padding:6px 20px}.anchors-full summary{cursor:pointer;font-weight:900;padding:14px 0}.anchors-full .cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:18px;padding-bottom:18px}.anchors-full h3{font-weight:900;font-size:15px;margin-bottom:8px}.anchors-full li{color:var(--muted);font-size:14px;line-height:1.5;margin:0 0 8px 18px}.layers{display:grid;gap:10px;margin-top:24px}.layer{display:grid;grid-template-columns:minmax(150px,220px) 1fr;gap:14px;align-items:center;padding:14px 18px;border-radius:18px;background:var(--surface);box-shadow:inset 0 0 0 1px var(--line)}.layer b{font-weight:900;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-ink)}.layer span{display:flex;flex-wrap:wrap;gap:8px}.layer i{font-style:normal;font-weight:700;padding:6px 12px;border-radius:999px;background:var(--bg-2)}@media (max-width: 560px){.layer{grid-template-columns:minmax(0,1fr)}}
