:root{color-scheme:light;--bg: #eef1f4;--surface: #ffffff;--surface-soft: #f8fafc;--line: #e5e8ec;--line-strong: #d5dbe2;--text: #1b1f24;--text-soft: #3d444d;--muted: #6d7681;--accent: #2f6feb;--accent-soft: #eaf0fe;--danger: #d6455d;--win: #1f9d63;--felt: #e9efe7;--shadow-sm: 0 1px 2px rgba(16, 24, 40, .04), 0 1px 3px rgba(16, 24, 40, .05);--shadow-md: 0 6px 16px rgba(16, 24, 40, .1)}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--bg);color:var(--text);font-family:Segoe UI,Microsoft YaHei,system-ui,sans-serif;font-size:15px;-webkit-font-smoothing:antialiased}button{font-family:inherit;color:inherit}.app{max-width:960px;margin:0 auto;padding:28px 20px 56px;display:flex;flex-direction:column;gap:16px}.app-game{max-width:1280px;display:grid;grid-template-columns:minmax(0,1fr) 330px;grid-template-areas:"top    sidebar" "table  sidebar";align-content:start;align-items:start;gap:14px 16px}.title h1{margin:0;font-size:28px;letter-spacing:.04em}.title p{margin:6px 0 0;color:var(--muted)}.setup{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:20px;display:flex;flex-direction:column;gap:16px;box-shadow:var(--shadow-sm)}.setup h2{margin:0;font-size:17px}.hero-choices{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}.hero-choice{text-align:left;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:16px;cursor:pointer;display:flex;flex-direction:column;gap:8px;transition:border-color .15s ease,box-shadow .15s ease,transform .15s ease}.hero-choice:hover{border-color:var(--accent);box-shadow:var(--shadow-md);transform:translateY(-2px)}.hero-choice-active{border-color:var(--accent);box-shadow:0 0 0 2px #2f6feb29}.hero-choice strong{font-size:18px}.hero-choice-head{display:flex;align-items:center;gap:10px}.hero-choice-title{display:flex;flex-direction:column;gap:2px}.hero-thumb{position:relative;flex:0 0 auto;display:block;width:46px;height:58px;border-radius:7px;overflow:hidden;color:#fff;box-shadow:inset 0 0 0 1px #ffffff47,0 1px 2px #10182829}.hero-art{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block}.hero-hp{color:var(--accent);font-size:12px;font-weight:600}.hero-choice ul{margin:0;padding-left:18px;color:var(--muted);font-size:12.5px;line-height:1.65}.seed{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:13px}.seed input,.seed select{width:90px;background:var(--surface);border:1px solid var(--line-strong);border-radius:8px;padding:6px 8px;color:var(--text)}.seed select{width:auto;min-width:160px}.setup>.btn{align-self:flex-start;padding-inline:28px}.setup-mode{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.mode-choice{text-align:left;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:12px 14px;cursor:pointer;display:flex;flex-direction:column;gap:4px;transition:border-color .15s ease,box-shadow .15s ease}.mode-choice:hover{border-color:var(--accent)}.mode-choice-active{border-color:var(--accent);box-shadow:0 0 0 2px #2f6feb29}.mode-choice strong{font-size:15px}.topbar{grid-area:top;display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}.topbar strong{font-size:16px}.muted{color:var(--muted)}.table{grid-area:table;display:flex;flex-direction:column;gap:12px;padding:16px;border-radius:18px;border:1px solid #dbe3dd;background:radial-gradient(120% 100% at 50% 0%,#f6faf5 0%,var(--felt) 45%,#dde6de 100%);box-shadow:inset 0 0 40px #5a786414,var(--shadow-sm)}.seats{display:flex;justify-content:center;flex-wrap:wrap;gap:12px}.seat{position:relative;flex:1 1 0;min-width:300px;max-width:420px;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:10px 12px;display:flex;align-items:stretch;justify-content:space-between;gap:12px;box-shadow:var(--shadow-sm);transition:border-color .15s ease,box-shadow .15s ease,transform .15s ease,background .15s ease}.seat-me{flex:1 1 100%;max-width:none}.seat-foe{border-left:3px solid var(--line-strong)}.seat-ally{border-left:3px solid #7c8cf8;background:#fbfcff}.seat-me{border-left:3px solid var(--accent);flex-direction:column;gap:8px}.seat-active{border-color:var(--accent);box-shadow:0 0 0 2px #2f6feb29,var(--shadow-sm)}.seat-dead{opacity:.55;filter:grayscale(.7)}.seat-targetable{cursor:pointer;border-color:var(--accent);background:#f7faff}.seat-targetable:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}.seat-targetable:after{content:"";position:absolute;top:-3px;right:-3px;bottom:-3px;left:-3px;border-radius:17px;border:2px solid rgba(47,111,235,.5);animation:target-pulse 1.6s ease-out infinite;pointer-events:none}.seat-picked{border-color:var(--accent);background:#eef3fe;box-shadow:0 0 0 2px var(--accent),var(--shadow-sm)}.pick-chip{font-size:10px;font-weight:700;letter-spacing:.08em;color:#fff;background:#1f9d63;border-radius:999px;padding:1px 8px}.seat-main{display:flex;align-items:center;gap:12px;min-width:0}.seat-info{display:flex;flex-direction:column;gap:5px;min-width:0}.seat-name{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.seat-name strong{font-size:15px}.seat-hero{font-size:12px;color:var(--text-soft);background:var(--surface-soft);border:1px solid var(--line);border-radius:5px;padding:0 6px}.turn-chip{font-size:10px;font-weight:700;letter-spacing:.08em;color:#fff;background:var(--accent);border-radius:999px;padding:1px 8px}.seat-zones{display:flex;flex-wrap:wrap;gap:5px}.skill-chips{display:flex;flex-wrap:wrap;gap:4px}.skill-chip{font-size:11px;font-weight:700;letter-spacing:.04em;color:#9a5a10;background:#fdf6ea;border:1px solid #f0e0c6;border-radius:4px;padding:0 6px;cursor:help}.skill-chip-off{color:#8b8b8b;background:#f1f1f1;border-color:#d9d9d9;text-decoration:line-through}.zone-pill{display:inline-flex;align-items:center;gap:4px;font-size:11px;line-height:1.6;color:var(--muted);background:var(--surface-soft);border:1px solid var(--line);border-radius:6px;padding:0 7px;max-width:100%}.zone-pill-on{color:#1d6a4c;background:#edf7f2;border-color:#c8e6d9}.zone-pill-warn{color:#9a5a10;background:#fdf4e7;border-color:#f2ddbb}.zone-pill .general-card,.zone-pill .equipment-card{background:transparent;border:0;padding:0;color:inherit;font-size:inherit}.portrait{flex:0 0 auto;width:66px;height:92px;border-radius:8px;display:flex;align-items:center;justify-content:center;color:#fff;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px #ffffff47,0 1px 2px #1018281f}.portrait:after{content:"";position:absolute;top:4px;right:4px;bottom:4px;left:4px;border:1px solid rgba(255,255,255,.22);border-radius:5px;pointer-events:none}.portrait-hp{position:absolute;right:4px;bottom:4px;display:flex;flex-direction:column-reverse;gap:2px;z-index:1}.portrait-hp .hp-bead{width:7px;height:7px;box-shadow:0 0 0 1px #0000002e}.portrait-hp .hp-off{background:#ffffff59;box-shadow:inset 0 0 0 1px #0000001f}.portrait-h1,.hero-thumb-h1{background:linear-gradient(155deg,#4a5568,#171c24)}.portrait-h2,.hero-thumb-h2{background:linear-gradient(155deg,#b1483f,#5d1d1b)}.portrait-h3,.hero-thumb-h3{background:linear-gradient(155deg,#7b8794,#3a434e)}.portrait-h4,.hero-thumb-h4{background:linear-gradient(155deg,#c07a3e,#6b3a15)}.portrait-h5,.hero-thumb-h5{background:linear-gradient(155deg,#8a5cc7,#3b2166)}.portrait-h6,.hero-thumb-h6{background:linear-gradient(155deg,#2f8f7a,#12453a)}.portrait-h7,.hero-thumb-h7{background:linear-gradient(155deg,#7f6a52,#2f2519)}.portrait-h8,.hero-thumb-h8{background:linear-gradient(155deg,#c9a227,#4f3c07)}.portrait-h9,.hero-thumb-h9{background:linear-gradient(155deg,#5a6f8f,#1d2739)}.portrait-h10,.hero-thumb-h10{background:linear-gradient(155deg,#7c7a4a,#2b2a16)}.portrait-h11,.hero-thumb-h11{background:linear-gradient(155deg,#9a8f7a,#3a3327)}.portrait-h12,.hero-thumb-h12{background:linear-gradient(155deg,#3f7fa6,#12314a)}.portrait-h14,.hero-thumb-h14{background:linear-gradient(155deg,#8f6b4a,#36220f)}.portrait-h15,.hero-thumb-h15{background:linear-gradient(155deg,#c9713a,#4a1f10)}.portrait-h13,.hero-thumb-h13{background:linear-gradient(155deg,#6f8f9c,#23343d)}.portrait-h16,.hero-thumb-h16{background:linear-gradient(155deg,#a8792f,#35240c)}.portrait-h17,.hero-thumb-h17{background:linear-gradient(155deg,#5f5e93,#191826)}.seat-hand{display:flex;flex-direction:column;align-items:flex-end;justify-content:center;gap:4px;flex:0 0 auto}.card-backs{display:flex}.card-back{width:30px;height:42px;border-radius:4px;background:repeating-linear-gradient(45deg,#2b3648 0,#2b3648 3px,#232e3d 3px,#232e3d 6px);border:1px solid #16202b;box-shadow:0 1px 2px #10182838;position:relative;display:flex;align-items:center;justify-content:center}.card-back+.card-back{margin-left:-15px}.card-back-mini{width:24px;height:34px}.card-back-mini+.card-back-mini{margin-left:-13px}.card-back-mark{width:42%;height:42%;border:1px solid rgba(255,255,255,.34);transform:rotate(45deg)}.seat-hand-count{font-size:11px;color:var(--muted);font-weight:600}.seat-hp{font-size:11.5px;font-weight:600;color:var(--muted)}.hp-bead{width:10px;height:10px;border-radius:50%;display:inline-block;transition:background-color .25s ease,box-shadow .25s ease,transform .25s ease}.hp-on{background:radial-gradient(circle at 32% 28%,#ff9a9a,#d6455d 72%);box-shadow:inset 0 0 0 1px #7810242e}.hp-off{background:#e8ebee;box-shadow:inset 0 0 0 1px #dce1e6}.general-cards{display:inline-flex;gap:5px;flex-wrap:wrap}.general-card{background:var(--accent-soft);border:1px solid #cfdcfb;color:#2b4c8c;border-radius:6px;padding:2px 8px;font-size:12px}.equipment-card{background:#edf7f2;border:1px solid #c8e6d9;color:#1d6a4c;border-radius:6px;padding:2px 8px;font-size:12px}.middle{display:flex;flex-direction:column;gap:10px}.board{display:grid;grid-template-columns:78px minmax(0,1fr) 78px;gap:12px;align-items:center}.status{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:12px 14px;font-size:14px;box-shadow:var(--shadow-sm);display:flex;align-items:center;min-height:64px}.win{color:var(--win)}.lose{color:var(--danger)}.warn{color:#b45309}.status-card{position:relative;flex:0 0 auto;margin-left:auto;width:72px;height:100px;background:var(--surface);color:var(--text);border:1px solid var(--line-strong);border-radius:8px;padding:14px 5px 16px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;overflow:hidden;box-shadow:0 2px 6px #1018281f}.status-card-in{animation:card-flip .42s ease-out;transform-style:preserve-3d}.status-card .card-art{width:26px;opacity:.5}.status-card:before{content:attr(data-suit);position:absolute;right:4px;top:3px;font-size:20px;line-height:1;opacity:.12}.status-card .card-corner{top:3px;left:4px}.status-card .card-rank{font-size:12px}.status-card .card-suit{font-size:10px}.status-card .card-face-name{font-size:14px;width:2.2em;line-height:1.1}.status-card .card-kind{bottom:5px;font-size:8px;letter-spacing:.1em}.status-card-red{color:#c0392b}.pile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px}.pile-stack{position:relative;width:62px;height:86px}.pile-stack:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:7px;background:#c9d2dc;border:1px solid #b6c0cc;transform:translate(3px,3px);z-index:0}.pile-empty{border:1px dashed #c3cdc7;border-radius:8px;background:#ffffff80}.pile-empty:before{display:none}.pile .card-back{position:absolute;top:0;right:0;bottom:0;left:0;width:auto;height:auto;border-radius:7px;z-index:1}.pile-top{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;background:var(--surface);border:1px solid var(--line-strong);border-radius:7px;padding:12px 3px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;transform:rotate(-6deg);box-shadow:0 1px 3px #10182824;animation:pile-drop .26s ease-out}.pile-top .card-art{width:20px;opacity:.5}.pile-top-red{color:#c0392b}.pile-top .card-corner{top:3px;left:4px}.pile-top .card-rank{font-size:12px}.pile-top .card-suit{font-size:10px}.pile-top .card-face-name{font-size:11px;width:2.2em;line-height:1.05}.pile-top .card-kind{bottom:4px;font-size:7.5px;letter-spacing:.1em}.pile-label{font-size:11px;color:var(--muted);white-space:nowrap}.pile-label strong{color:var(--text-soft)}.middle>.actions{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:10px 12px;box-shadow:var(--shadow-sm)}.middle>.discard-actions{background:#fffaf2;border-color:#f2ddbb;color:#7a4a12}.sidebar{grid-area:sidebar;position:sticky;top:16px;display:flex;flex-direction:column;gap:8px;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:12px 14px 8px;box-shadow:var(--shadow-sm);max-height:calc(100vh - 32px)}.sidebar-head{font-size:11.5px;font-weight:700;letter-spacing:.1em;color:var(--muted)}.log{overflow-y:auto;padding:2px 2px 6px;font-size:12.5px;line-height:1.7;min-height:120px}.log-round+.log-round{margin-top:10px;padding-top:8px;border-top:1px solid var(--line)}.log-round-head{display:flex;align-items:center;gap:8px;margin-bottom:2px;font-size:11.5px;font-weight:700;letter-spacing:.04em}.log-round-no{color:var(--muted)}.log-actor-me{color:#1f7a55}.log-actor-ai{color:#a8541a}.log-line{color:var(--text-soft);padding-left:8px;animation:log-in .22s ease-out}.log-type-card-discarded,.log-type-cards-drawn,.log-type-pindian-resolved{color:#9aa3ad;font-size:12px}.log-type-damaged,.log-type-dying,.log-type-death,.log-type-game-ended,.log-type-game-draw{color:var(--danger);font-weight:600}.log-type-skill-used,.log-type-xiaogan,.log-type-jixing,.log-type-gaoxing,.log-type-chuanming,.log-type-chuanming-heal,.log-type-chuanming-flip{color:#a9611a}.log-type-trick-used,.log-type-nullify-used,.log-type-sha-used{color:#2f6feb}.log-type-jev-action{color:#6d4bd6}.log-type-jev-fallback{color:#b45309}.banner{border-radius:10px;padding:10px 12px;font-size:13px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}.banner-error{background:#fdeef0;border:1px solid #f6c9d0;color:#8a2233}.banner-info{background:#eef3fe;border:1px solid #cfe0ff;color:#1f3d7a}.judgment-panel,.target-panel{flex-direction:column;align-items:flex-start;gap:6px}.judgment-card{font-size:13px}.judgment-card strong{color:#1f3d7a}.actions{display:flex;gap:8px;align-items:center}.actions-wrap{flex-wrap:wrap}.btn{background:var(--surface);border:1px solid var(--line-strong);border-radius:9px;padding:8px 14px;font-size:14px;cursor:pointer;box-shadow:0 1px 1px #1018280a;transition:border-color .15s ease,background .15s ease,color .15s ease,transform .1s ease}.btn:hover:not(:disabled){border-color:var(--accent);color:var(--accent)}.btn:disabled{opacity:.45;cursor:not-allowed;box-shadow:none}.btn-primary{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}.btn-primary:hover:not(:disabled){background:#245ad0;border-color:#245ad0;color:#fff}.btn-danger{background:var(--surface);border-color:var(--line-strong);color:var(--danger)}.btn-danger:hover:not(:disabled){border-color:var(--danger);color:var(--danger)}.btn-ghost{background:transparent;border-color:transparent;box-shadow:none;color:var(--muted)}.btn-ghost:hover:not(:disabled){color:var(--text);background:var(--surface-soft)}.btn-small{padding:4px 10px;font-size:12px;border-radius:7px}.hand-tray{border-top:1px dashed var(--line-strong);padding-top:8px;margin-top:2px}.hand-tray-head{display:flex;justify-content:space-between;align-items:baseline;font-size:11px;font-weight:700;letter-spacing:.1em;color:var(--muted);text-transform:uppercase}.hand{display:flex;gap:6px;flex-wrap:nowrap;overflow-x:auto;padding:8px 2px 10px;align-items:flex-start;min-height:148px}.card{position:relative;flex:0 0 auto;width:96px;height:134px;background:var(--surface);color:var(--text);border:1px solid var(--line-strong);border-radius:10px;padding:8px 6px 12px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;cursor:pointer;overflow:hidden;box-shadow:0 1px 2px #1018280f;transition:transform .12s ease,box-shadow .12s ease,border-color .12s ease}.card-art{display:flex;align-items:center;justify-content:center;width:52%;max-width:46px;opacity:.5;pointer-events:none}.card-art-svg{display:block;width:100%;height:auto}.card:before{content:attr(data-suit);position:absolute;right:5px;top:4px;font-size:26px;line-height:1;opacity:.12;pointer-events:none}.card-basic{border-color:#d7e1ef}.card-trick{border-color:#e0d7ee}.card-equipment{border-color:#d5e7dd}.card:hover:not(:disabled){transform:translateY(-6px);box-shadow:var(--shadow-md);border-color:var(--accent)}.card-red{color:#c0392b}.card.card-selected,.card.card-selected:hover:not(:disabled){border-color:var(--accent);box-shadow:0 0 0 2px var(--accent),0 6px 14px #2f6feb2e;transform:translateY(-8px);z-index:2}.card-dimmed{opacity:.45}.hand .card{animation:card-in .18s ease-out}.card:active:not(:disabled){transform:translateY(-2px) scale(.985)}.btn:active:not(:disabled){transform:translateY(1px);box-shadow:none}.card-corner{position:absolute;top:5px;left:6px;display:flex;flex-direction:column;align-items:center;line-height:1;color:inherit}.card-rank{font-size:14px;font-weight:700}.card-suit{font-size:12px}.card-face-name{position:relative;font-size:20px;font-weight:700;line-height:1.12;letter-spacing:.04em;text-align:center;width:2.2em;word-break:break-all;color:inherit;text-shadow:0 0 6px rgba(255,255,255,.9)}.card-kind{position:absolute;left:0;right:0;bottom:6px;text-align:center;font-size:9px;font-weight:600;letter-spacing:.16em;color:#a3abb5}.card-kind-basic{color:#6b7f9c}.card-kind-trick{color:#8a6bb8}.card-kind-equipment{color:#3f8a68}.card-range{position:absolute;left:5px;bottom:5px;font-size:9px;font-weight:600;color:#2f7a5a}.pile-top .card-range,.status-card .card-range{left:3px;bottom:3px;font-size:8px}.card-label{position:absolute;top:-7px;right:-4px;font-size:10px;font-weight:600;color:#fff;background:var(--accent);border-radius:999px;padding:1px 7px;box-shadow:0 1px 2px #1018282e}.card-actions{border-top:1px solid var(--line);padding-top:10px}.xing-actions{display:inline-flex;align-items:center;gap:6px;background:var(--accent-soft);border:1px solid #cfdcfb;border-radius:8px;padding:3px 8px}.xing-row{max-height:118px;overflow-y:auto;align-items:flex-start;padding-top:4px}.seat-fx-hit{animation:seat-hit .36s ease-out,seat-flash-danger .8s ease-out}.seat-fx-heal{animation:seat-pop .42s ease-out,seat-flash-heal .8s ease-out}.seat-fx-dying{animation:seat-sink .55s ease-out,seat-flash-danger 1s ease-out}@keyframes seat-hit{0%,to{transform:translate(0)}15%{transform:translate(-5px)}30%{transform:translate(4px)}45%{transform:translate(-3px)}60%{transform:translate(2px)}}@keyframes seat-pop{0%{transform:scale(1)}40%{transform:scale(1.015)}to{transform:scale(1)}}@keyframes seat-sink{0%{transform:translateY(0) scale(1)}30%{transform:translateY(3px) scale(.995)}to{transform:translateY(0) scale(1)}}@keyframes seat-flash-danger{0%{outline:2px solid rgba(214,69,93,.6);outline-offset:0}to{outline:2px solid rgba(214,69,93,0);outline-offset:6px}}@keyframes seat-flash-heal{0%{outline:2px solid rgba(31,157,99,.55);outline-offset:0}to{outline:2px solid rgba(31,157,99,0);outline-offset:6px}}@keyframes target-pulse{0%{opacity:.9;transform:scale(1)}70%{opacity:0;transform:scale(1.02)}to{opacity:0;transform:scale(1.02)}}@keyframes card-in{0%{opacity:0;transform:translateY(14px) scale(.92)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes pile-drop{0%{opacity:0;transform:rotate(-6deg) translateY(-14px) scale(.9)}to{opacity:1;transform:rotate(-6deg) translateY(0) scale(1)}}@keyframes card-flip{0%{opacity:0;transform:rotateY(-84deg)}60%{opacity:1;transform:rotateY(8deg)}to{opacity:1;transform:rotateY(0)}}@keyframes log-in{0%{opacity:0;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}.tip-layer{position:fixed;z-index:80;width:max-content;max-width:min(320px,calc(100vw - 24px));padding:8px 10px;border-radius:10px;border:1px solid rgba(255,255,255,.08);background:#262420f2;color:#f8f5ef;font-size:12px;line-height:1.6;letter-spacing:.01em;white-space:pre-line;overflow-wrap:break-word;box-shadow:0 10px 28px #1e1a143d;pointer-events:none;animation:tip-in .12s ease-out}.tip-layer.tip-above{transform:translate(-50%,-100%)}.tip-layer.tip-below{transform:translate(-50%)}@keyframes tip-in{0%{opacity:0}to{opacity:1}}.zone-pill[data-tip],.seat-hero[data-tip],.seat-hp[data-tip],.seat-hand[data-tip],.portrait[data-tip],.pile[data-tip],.tip-wrap[data-tip]{cursor:help}.tip-wrap{display:inline-flex;align-items:stretch}.tip-wrap .btn:disabled{pointer-events:none}@media (prefers-reduced-motion: reduce){.seat-fx-hit,.seat-fx-heal,.seat-fx-dying,.seat-targetable:after,.hand .card,.pile-top,.status-card-in,.tip-layer,.log-line{animation:none}}@media (max-width: 1080px){.app-game{grid-template-columns:minmax(0,1fr);grid-template-areas:"top" "table" "sidebar"}.sidebar{position:static;max-height:none}.log{max-height:300px}}@media (max-width: 720px){.app{padding:16px 12px 40px}.seats,.setup-mode{grid-template-columns:minmax(0,1fr)}.table{padding:12px}.board{grid-template-columns:60px minmax(0,1fr) 60px}.pile-stack{width:50px;height:72px}.seat{flex-direction:column;align-items:flex-start}.seat-hand{align-items:flex-start}.card{width:78px;height:110px}.card-face-name{font-size:16px}.hand{min-height:128px}}