:root{font-synthesis:none;-webkit-text-size-adjust:100%;background:#102e27;font-family:-apple-system,PingFang TC,Noto Sans TC,Microsoft JhengHei,sans-serif}*{box-sizing:border-box}body{margin:0}button,select{font:inherit;touch-action:manipulation}button{cursor:pointer}button:focus-visible,select:focus-visible{outline:3px solid var(--text);outline-offset:5px}.app{--table-background:radial-gradient(ellipse at 25% 40%, #285a46, #102e27 75%);--text:#fbf5e6;--muted:#c0cebb;--accent:#e9c786;--button-background:#e9c786;--button-text:#302719;--tile-back:#26765b;--surface:#193e32;--line:#718a69;color:var(--text);background:var(--table-background);min-height:100svh;overflow-x:clip}.app[data-theme=class-115b]{--table-background:#08090b;--text:#f7f0df;--muted:#bcb5a4;--accent:#d8b45f;--button-background:#d8b45f;--button-text:#18140b;--tile-back:#3b3b3b;--surface:#17181c;--line:#62563b}.table-emblem{pointer-events:none;place-items:center;display:grid;position:absolute;overflow:hidden}.table-emblem img{object-fit:contain;opacity:.48;width:auto;max-width:70%;height:82%;max-height:285px;display:block}.app[data-theme=wood]{--table-background:repeating-linear-gradient(94deg, #ffffff03 0 2px, transparent 2px 16px), radial-gradient(ellipse at 25% 40%, #795735, #3b2a20 75%);--text:#fff3df;--muted:#deccb4;--accent:#f1c791;--button-background:#f1c791;--button-text:#39271a;--tile-back:#956337;--surface:#503a29;--line:#a38764}.app[data-theme=night]{--table-background:radial-gradient(ellipse at 25% 40%, #303c62, #151a2d 75%);--text:#f0f3ff;--muted:#bcc6e0;--accent:#b6c6fa;--button-background:#b6c6fa;--button-text:#1c294c;--tile-back:#56669e;--surface:#242d49;--line:#7381a5}.app[data-theme=festive]{--table-background:radial-gradient(ellipse at 25% 40%, #8c3437, #481c24 75%);--text:#fff2de;--muted:#e9c8bb;--accent:#f5cd82;--button-background:#f5cd82;--button-text:#4d241b;--tile-back:#ab3f43;--surface:#66272d;--line:#b77b69}.home{max-width:1240px;min-height:100svh;padding:max(20px, env(safe-area-inset-top)) max(32px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(32px, env(safe-area-inset-left));flex-direction:column;gap:24px;margin-inline:auto;display:flex}.header,.brand,.theme-picker,.footer{align-items:center;display:flex}.header,.footer{justify-content:space-between;gap:16px}.brand{letter-spacing:.12em;white-space:nowrap;gap:10px;font-size:14px}.brand-mark{border:1px solid var(--accent);width:32px;height:36px;color:var(--accent);border-radius:6px;place-items:center;font-size:21px;display:grid}.theme-picker{color:var(--muted);gap:10px;font-size:13px}.theme-picker select{border:1px solid var(--line);background:var(--surface);max-width:100%;min-height:44px;color:var(--text);cursor:pointer;border-radius:8px;padding:8px 12px}.welcome{flex:1;grid-template-columns:1fr 1.12fr;align-items:center;gap:clamp(24px,5vw,72px);width:100%;margin-block:24px;display:grid}.welcome-content{min-width:0}.eyebrow{color:var(--accent);letter-spacing:.18em;margin:0 0 16px;font-size:13px}h1{letter-spacing:-.04em;margin:0;font-size:clamp(30px,4vw,52px);font-weight:650;line-height:1.25}.subtitle{color:var(--muted);letter-spacing:.08em;margin:14px 0 32px;font-size:16px}.actions{gap:12px;display:grid}.play-button{text-align:left;border:1px solid var(--accent);border-radius:12px;justify-content:space-between;align-items:center;gap:16px;width:100%;min-height:80px;padding:16px 22px;transition:transform .15s,box-shadow .15s;display:flex}.primary{background:var(--button-background);color:var(--button-text)}.secondary{background:var(--surface);color:var(--text);border-color:var(--line)}.play-button strong{font-size:21px;font-weight:650;display:block}.play-button small{margin-top:5px;font-size:12px;display:block}.secondary small{color:var(--muted)}.button-arrow{font-size:28px;font-weight:400}.play-button:active{transform:translateY(2px)}.notice{min-height:20px;color:var(--accent);margin:12px 0 0;font-size:13px;line-height:20px}.footer{color:var(--muted);font-size:12px;line-height:1.6}.tile-scene{aspect-ratio:1.15;justify-self:center;width:100%;max-width:440px;position:relative}.table-ring{border:1px solid var(--line);opacity:.45;border-radius:50%;position:absolute;inset:3%}.table-ring:after{content:"";border:1px solid var(--line);border-radius:50%;position:absolute;inset:12%}.tile{width:30%;height:49%;box-shadow:0 6px 0 #c5bfaa, 0 10px 0 var(--tile-back), 0 24px 28px #0004;border-radius:12%;place-items:center;font-size:clamp(44px,7vw,88px);line-height:1;display:grid;position:absolute}.tile-front{color:#254b3a;background:linear-gradient(135deg,#fffdf3,#e8e1cd);border:1px solid #fff9}.tile-red-dragon{color:#b32f35;top:25%;left:23%;transform:rotate(-13deg)}.tile-dragon{top:29%;left:52%;transform:rotate(12deg)}.tile-back{background:var(--tile-back);color:#fff8;border:6px solid #e9e2cf;font-size:64px;top:9%;left:39%;transform:rotate(5deg);box-shadow:0 6px #c5bfaa,0 20px 28px #0004}.tile-back span{border:1px solid #fff6;border-radius:8%;place-items:center;width:80%;height:86%;display:grid}.scene-caption{text-align:center;width:100%;color:var(--muted);letter-spacing:.15em;font-size:13px;position:absolute;bottom:4%}.rotate-hint{z-index:10;padding:max(24px, env(safe-area-inset-top)) max(24px, env(safe-area-inset-right)) max(24px, env(safe-area-inset-bottom)) max(24px, env(safe-area-inset-left));background:var(--table-background);text-align:center;flex-direction:column;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.rotate-icon{width:96px;height:96px;color:var(--accent)}.rotate-hint h2{margin:24px 0 12px;font-size:clamp(20px,6vw,28px)}.rotate-hint p{color:var(--muted);margin:0;font-size:14px}@media (hover:hover){.play-button:hover{transform:translateY(-2px);box-shadow:0 8px 20px #0003}}@media (height<=520px) and (width>=700px){.home{padding-top:max(10px, env(safe-area-inset-top));padding-bottom:max(8px, env(safe-area-inset-bottom));gap:8px}.welcome{grid-template-columns:.9fr 1.2fr;gap:30px;margin-block:0}.tile-scene{max-width:260px}.tile{font-size:60px}.eyebrow{margin-bottom:6px;font-size:11px}h1{font-size:32px}.subtitle{margin:6px 0 14px;font-size:13px}.actions{gap:8px}.play-button{border-radius:9px;min-height:58px;padding:9px 16px}.play-button strong{font-size:18px}.play-button small{margin-top:3px;font-size:11px}.notice{margin-top:6px}.footer{font-size:10px}}@media (width<=699px){.home{padding-inline:max(20px, env(safe-area-inset-left)) max(20px, env(safe-area-inset-right));gap:16px}.header{flex-wrap:wrap}.theme-picker{margin-left:auto}.welcome{grid-template-columns:1fr;gap:24px;margin-block:8px}.tile-scene{max-width:240px}.tile{font-size:56px}.welcome-content{justify-self:center;width:100%;max-width:440px}.footer{text-align:center;flex-wrap:wrap;justify-content:center;gap:4px 16px}}@media (prefers-reduced-motion:reduce){.play-button{transition:none}}.tile-overview-content{max-width:1440px;padding:max(24px, env(safe-area-inset-top)) max(24px, env(safe-area-inset-right)) max(48px, env(safe-area-inset-bottom)) max(24px, env(safe-area-inset-left));margin-inline:auto}.tile-overview-header{border-bottom:1px solid var(--line);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:24px;padding-block:8px 24px;display:flex}.tile-overview-home{color:var(--accent);text-underline-offset:4px;margin-bottom:12px;padding-block:12px;display:inline-block}.tile-overview-home:focus-visible{outline:3px solid var(--text);outline-offset:4px}.tile-overview-header p{color:var(--muted);margin-bottom:0;line-height:1.6}.tile-overview-group{margin-top:32px}.tile-overview-group h2{align-items:baseline;gap:16px;margin:0 0 16px;font-size:20px;display:flex}.tile-overview-group h2 span{color:var(--muted);font-size:13px;font-weight:400}.tile-overview-grid{grid-template-columns:repeat(auto-fit,minmax(175px,1fr));gap:16px;display:grid}.tile-sample{border:1px solid var(--line);border-radius:12px;margin:0;padding:16px 12px 12px}.tile-sample-images{justify-content:center;align-items:end;gap:12px;display:flex}.tile-sample-size{flex-shrink:0;justify-items:center;gap:8px;display:grid}.tile-sample-size img{filter:drop-shadow(0 3px 3px #0003);display:block}.tile-sample-size small{color:var(--muted);font-size:11px}.tile-sample figcaption{justify-content:center;align-items:baseline;gap:10px;margin-top:12px;font-size:15px;display:flex}.tile-sample code{color:var(--accent);font-size:12px}.tile-overview .tile-back-picker{width:fit-content;margin-left:0}.tile-overview .tile-back-note{color:var(--muted);line-height:1.6}.tile-overview .tile-back-grid{grid-template-columns:repeat(3,minmax(195px,1fr));gap:16px;padding:3px 3px 12px;display:grid;overflow-x:auto}.tile-overview .tile-back-option{border:2px solid var(--line);border-radius:14px;padding:8px}.tile-overview .tile-back-option[data-selected=true]{border-color:var(--accent)}.tile-overview .tile-back-status{text-align:center;margin:4px 0 12px;font-size:14px}.tile-overview .tile-back-grid{grid-template-columns:repeat(4,minmax(195px,1fr))}html:has(.table-page){overscroll-behavior:none;width:100%;height:100%;overflow:hidden}body:has(.table-page){overscroll-behavior:none;width:100%;height:100%;overflow:hidden}#root:has(.table-page){overscroll-behavior:none;width:100%;height:100%;overflow:hidden}.table-page{width:100%;height:100vh;min-height:0;padding:env(safe-area-inset-top,0px) env(safe-area-inset-right,0px) env(safe-area-inset-bottom,0px) env(safe-area-inset-left,0px);overscroll-behavior:none;position:fixed;inset:0;overflow:hidden}@supports (height:100dvh){.table-page{height:100dvh}}.table-viewport,.table-canvas-host{width:100%;height:100%;position:relative}.table-canvas-host canvas{touch-action:none;display:block}.table-status{border:1px solid var(--line);background:var(--surface);color:var(--text);text-align:center;border-radius:12px;margin:0;padding:16px;position:absolute;inset:40% 16px auto}.lobby{flex:1;padding-block:8px 24px}.lobby h1{font-size:clamp(26px,4vw,40px)}.lobby .subtitle{margin-block:10px 20px}.lobby-columns{grid-template-columns:1.3fr 1fr;gap:32px;display:grid}.lobby label{gap:8px;display:grid}.lobby button,.lobby select,.lobby input{font:inherit;border:1px solid var(--line);background:var(--surface);min-height:44px;color:var(--text);border-radius:8px;max-width:100%;padding:10px 12px}.lobby input{min-width:0;font-size:16px}.lobby .primary{background:var(--button-background);color:var(--button-text)}.lobby button:disabled{opacity:.5;cursor:default}.lobby .lobby-back{margin-bottom:16px}.player-list{border:1px solid var(--line);border-radius:12px;flex-wrap:wrap;gap:8px;padding:12px;display:flex}.lobby .player-choice{border:1px solid var(--line);cursor:pointer;border-radius:8px;align-items:center;gap:8px;min-height:48px;padding:4px 12px;display:flex}.player-choice[data-selected=true]{outline:2px solid var(--accent)}.player-choice input{min-height:24px}.new-player{grid-template-columns:minmax(0,1fr) auto auto;align-items:end;gap:8px;margin-top:16px;display:grid}.solo-settings{align-content:start;gap:16px;display:grid}.solo-settings p{color:var(--muted);margin:0;font-size:13px;line-height:1.7}@media (width<=699px){.lobby-columns{grid-template-columns:1fr}.new-player{grid-template-columns:minmax(0,1fr) auto}}.room-rules{border:1px solid var(--line);border-radius:12px;grid-template-columns:1fr 1fr;gap:12px;padding:14px;display:grid}.room-rules label{align-items:center;gap:8px;display:flex}.room-rules input[type=number]{width:80px}.room-rules .room-password-field,.room-rules small{grid-column:1/-1}.room-rules .room-password-field{display:grid}.room-rules small{color:var(--muted)}.room-browser{order:-1}.room-browser form{flex-wrap:wrap;align-items:end;gap:12px;margin-top:16px;display:flex}.room-browser input{max-width:150px}.room-browser h2{font-size:18px}.room-list-item{text-align:left;flex-direction:column;gap:6px;width:100%;margin-bottom:8px;display:flex}.room-browser .room-list-item span,.room-browser p{font-size:13px}