:root{--bg:#2b2622;--serif:Georgia, "Times New Roman", serif;--panel:#1c1815db;--ink:#f2e9d8;--muted:#b9ab93;--accent:#d8a24a;--accent-ink:#2b2014;--danger:#d9534f;--line:#ffffff1f;color:var(--ink);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}html,body,#app{background:var(--bg);height:100%;margin:0;overflow:hidden}button{font:inherit;color:var(--ink);border:1px solid var(--line);cursor:pointer;touch-action:manipulation;background:#4a3f35;border-radius:10px;min-height:44px;padding:10px 14px}button:disabled{opacity:.45;cursor:default}button.primary{background:var(--accent);color:var(--accent-ink);border-color:#0000;font-weight:700}button.ghost{background:0 0;border-color:#0000;min-width:44px}button.big{text-align:left;flex-direction:column;gap:2px;width:100%;padding:14px;font-size:1.05rem;display:flex}button.big.primary{text-align:center;align-items:center}button.big small{color:var(--muted);font-size:.8rem}button.big.primary small{color:#4a3416}.muted{color:var(--muted)}.hint{color:var(--muted);font-size:.9rem}.home{height:100%;padding:16px;padding-top:max(16px, env(safe-area-inset-top));background:radial-gradient(circle at 30% 20%,#4a3b2e,#241e1a 70%);place-items:center;display:grid;overflow:auto}.home-card{flex-direction:column;gap:12px;width:min(440px,100%);display:flex}.home-card.wide{width:min(640px,100%)}.home h1{letter-spacing:.05em;margin:0;font-family:Georgia,Times New Roman,serif;font-size:clamp(2.4rem,9vw,4rem)}.home h2{color:var(--muted);margin:8px 0 4px;font-size:1rem}.home label{color:var(--muted);margin-top:6px;font-size:.85rem}.sub{color:var(--muted);margin:0 0 8px}.saves{flex-direction:column;gap:8px;display:flex}.save{gap:6px;display:flex}.chips{flex-wrap:wrap;gap:8px;display:flex}.chip{background:#3d342c;align-items:center;gap:6px;display:inline-flex}.chip.on{background:var(--accent);color:var(--accent-ink);font-weight:700}.chip i,.turn i,.side i,.log i,.score i{border:1px solid #ffffff59;border-radius:50%;width:12px;height:12px;display:inline-block}.row{align-items:center;gap:8px;display:flex}.row.wrap{flex-wrap:wrap}.row>.big{flex:1}.game{position:fixed;inset:0}.board{position:absolute;inset:0}.panel{background:var(--panel);border:1px solid var(--line);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:12px}.topbar{top:max(8px, env(safe-area-inset-top));pointer-events:none;justify-content:space-between;gap:8px;display:flex;position:absolute;left:8px;right:8px}.topbar>*{pointer-events:auto}.turn,.sides{background:var(--panel);border:1px solid var(--line);border-radius:12px;flex-wrap:wrap;align-items:center;gap:8px;padding:6px 10px;font-size:.92rem;display:flex}.dice{font-variant-numeric:tabular-nums;background:#0004;border-radius:8px;padding:2px 8px}.pts{color:var(--accent);font-weight:700}.side{align-items:center;gap:4px;display:inline-flex}.side.out{opacity:.4;text-decoration:line-through}.side small{color:var(--muted)}.menu{z-index:6;flex-direction:column;gap:8px;width:260px;max-height:calc(100% - 140px);padding:12px;display:flex;position:absolute;top:64px;right:8px;overflow:auto}.hand{flex-direction:column;gap:6px;max-width:min(46vw,420px);padding:8px;display:flex;position:absolute;bottom:72px;right:8px}.kit,.cards{flex-wrap:wrap;gap:6px;display:flex}.tag{background:#3d342c;border-radius:8px;padding:4px 8px;font-size:.8rem}.tag.kit-on{background:#2f6b3a}.tag.eq{background:#6b5432}.card{color:#2b2014;text-align:left;background:#f3ead6;border:2px solid #b8862f;border-radius:8px;align-items:center;gap:6px;max-width:170px;min-height:40px;padding:4px 8px 4px 4px;font-size:.82rem;display:flex}.card img{object-fit:cover;border-radius:5px;flex:none;width:34px;height:34px}.card.sec{color:#f3ead6;background:#3a3a3a;border-color:#8f2a22}.tag img{object-fit:cover;vertical-align:-4px;border-radius:4px;width:18px;height:18px;margin-right:4px}.card-dialog{text-align:center;align-items:center}.card-art{aspect-ratio:1;object-fit:cover;border:3px solid #b8862f;border-radius:10px;width:min(260px,60vw);box-shadow:0 8px 24px #0008}.card-dialog .row{justify-content:center}.home.titled{background:linear-gradient(90deg,#1b1512f0 0%,#1b1512b8 45%,#1b151240 100%),url(art/title.webp) 50%/cover no-repeat,#241e1a}input[type=range]{width:100%;accent-color:var(--accent)}.actions{left:8px;right:8px;bottom:max(8px, env(safe-area-inset-bottom));background:var(--panel);border:1px solid var(--line);border-radius:12px;flex-wrap:wrap;align-items:center;gap:8px;min-height:58px;padding:8px 10px;display:flex;position:absolute}.actions span{flex:1;min-width:120px;font-size:.92rem}.actions .claim{background:#2f6b3a}.log{cursor:pointer;max-width:min(52vw,460px);padding:6px 10px;font-size:.82rem;position:absolute;bottom:76px;left:8px}.log.open{z-index:4;max-height:55vh;overflow:auto}.log .line{align-items:baseline;gap:6px;padding:1px 0;display:flex}.log .line i{flex:none;width:8px;height:8px}.log:not(.open) .line:nth-last-child(n+4){display:none}.toast{background:var(--danger);color:#fff;z-index:9;border-radius:10px;max-width:90vw;padding:10px 16px;position:absolute;top:70px;left:50%;transform:translate(-50%)}.modal{z-index:8;background:#00000073;place-items:center;padding:16px;display:grid;position:absolute;inset:0}.dialog{border:1px solid var(--line);background:#2f2822;border-radius:14px;flex-direction:column;gap:10px;width:min(520px,100%);max-height:90vh;padding:16px;display:flex;overflow:auto}.dialog h2,.dialog h3{font-family:var(--serif);letter-spacing:.02em;margin:0}.dialog{background:linear-gradient(#3a3027,#2c241e);border-color:#b8862f66;box-shadow:0 16px 48px #000a}.dialog p{margin:0;line-height:1.4}.score{border-collapse:collapse}.score td{padding:4px 10px 4px 0}@media (height<=480px){.hand{max-width:42vw;bottom:66px}.log{max-width:46vw;bottom:66px}.actions{min-height:50px;padding:6px 8px}button{min-height:40px;padding:8px 12px}}@media (width<=600px) and (orientation:portrait){.hand{max-width:none;bottom:130px;left:8px;right:8px}.log{max-width:calc(100vw - 16px);bottom:210px}}.keys td{vertical-align:top;padding:4px 12px 4px 0}.banner{border:2px solid var(--accent);color:var(--ink);font-family:var(--serif);pointer-events:none;z-index:7;background:#1b1512e6;border-radius:14px;padding:10px 28px;font-size:clamp(1.4rem,4vw,2.2rem);animation:1.5s both bannerIn;position:absolute;top:30%;left:50%;transform:translate(-50%)}@keyframes bannerIn{0%{opacity:0;transform:translate(-50%,10px)}15%,75%{opacity:1;transform:translate(-50%)}to{opacity:0}}.checklist{color:var(--muted);flex-direction:column;gap:2px;font-size:.78rem;display:flex}.checklist span{white-space:nowrap;margin-right:8px}.checklist span.ok{color:#8fd18f;font-weight:700}.tutorial{z-index:7;border-color:var(--accent);flex-direction:column;gap:6px;width:min(560px,100% - 16px);padding:12px 14px;display:flex;position:absolute;top:64px;left:50%;transform:translate(-50%)}.tutorial p{margin:0;font-size:.95rem;line-height:1.45}@media (height<=480px){.tutorial{padding:8px 10px;top:54px}.tutorial p{font-size:.85rem}}.home.scroll{align-items:start;overflow:auto}.home .home-card{padding:8px 0 24px}.avatar{color:#fff;border-radius:50%;flex:none;place-items:center;font-family:system-ui,sans-serif;font-weight:800;display:inline-grid;box-shadow:inset 0 -3px #0003,0 2px 6px #0006}.avatar.plus{background:#4a3f35;width:52px;height:52px;font-size:1.6rem}.profiles{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px;display:grid}.profile{background:#3a3129cc;flex-direction:column;align-items:center;gap:6px;padding:14px 8px;display:flex}.profile.last{border-color:var(--accent)}.profile small{color:var(--muted);font-size:.75rem}.new-profile{flex-direction:column;gap:10px;display:flex}input:not([type]),input[type=text]{font:inherit;border:1px solid var(--line);color:var(--ink);background:#1f1a16;border-radius:10px;width:100%;min-height:48px;padding:12px 14px;font-size:1.1rem}.error{color:#ff8a80;margin:0}.who{background:#00000040;border-radius:12px;align-items:center;gap:10px;padding:8px 10px;display:flex}.who b{display:block}.who small{color:var(--muted)}.grow{flex-direction:column;flex:1;min-width:0;display:flex}.save.done{background:#00000030;border-radius:10px;align-items:center;gap:8px;padding:6px 8px;font-size:.9rem}.save.done small{color:var(--muted);font-size:.78rem}.result{color:#ff8a80;min-width:40px;font-weight:800}.result.won{color:#8fd18f}button.danger{background:var(--danger);color:#fff}.swatch{border:3px solid #0000;border-radius:50%;width:36px;height:36px;min-height:36px;padding:0}.swatch.on{border-color:#fff}.row.spread{justify-content:space-between}.rules h1{font-size:clamp(1.8rem,6vw,2.6rem)}.rules-text{line-height:1.5}.rules-text ul{margin:6px 0;padding-left:1.2em}.rules-text li{margin:4px 0}.rules-text h3,.rules-cards h3{font-family:var(--serif);color:var(--accent);margin:14px 0 4px}.rule-card{border-bottom:1px solid var(--line);align-items:flex-start;gap:10px;padding:6px 0;display:flex}.rule-card img{object-fit:cover;border-radius:8px;flex:none;width:64px;height:64px}.rule-card p{color:var(--muted);margin:2px 0 0;font-size:.9rem}.rules-modal{background:#1b1512f2;align-items:start;overflow:auto}.rules-modal .home-card{margin:0 auto}.timeline summary{cursor:pointer;color:var(--muted)}.timeline .line{align-items:baseline;gap:6px;padding:2px 0;font-size:.85rem;display:flex}.timeline .line i{border-radius:50%;flex:none;width:8px;height:8px}.keys td:first-child{color:var(--muted);white-space:nowrap}@media (width>=1100px) and (height>=600px){body{font-size:15px}.hand{place-content:flex-start;width:300px;max-width:none;top:76px;bottom:96px;overflow:auto}.hand .cards{flex-direction:column}.hand .card{width:100%;max-width:none}.log{width:330px;max-width:none;top:76px;bottom:96px;overflow:auto}.log:not(.open) .line:nth-last-child(n+4){display:flex}.actions{left:350px;right:320px}.board{cursor:pointer}}.card-art.small{align-self:center;width:120px}.toast.note{background:#2f5d3a}.code-box{border:1px dashed var(--accent);background:#00000040;border-radius:12px;align-items:center;gap:12px;padding:10px 14px;display:flex}.code-box small{color:var(--muted)}.code-box b{letter-spacing:.12em;color:var(--accent);flex:1;font-family:ui-monospace,Consolas,monospace;font-size:clamp(1.6rem,7vw,2.4rem)}input.code-input{letter-spacing:.15em;text-align:center;text-transform:uppercase;padding:10px;font-family:ui-monospace,Consolas,monospace;font-size:2rem}.seats{flex-direction:column;gap:6px;display:flex}.seat{background:#00000030;border-radius:10px;flex-wrap:wrap;align-items:center;gap:8px;min-height:44px;padding:6px 8px;display:flex}.seat>i{border:1px solid #ffffff59;border-radius:50%;flex:none;width:14px;height:14px}.seat .grow{flex-direction:column;min-width:7em;display:flex}.seat .grow small{color:var(--muted);font-size:.8rem}.seat.closed{opacity:.55}.seat.player{background:#ffffff14}.seat select{color:var(--ink);border:1px solid var(--line);background:#3d342c;border-radius:8px;padding:6px}.players{flex-wrap:wrap;gap:10px;font-size:.9rem;display:flex}.players span{align-items:center;gap:6px;display:inline-flex}.players .away{opacity:.5}.online-bar{top:calc(max(8px, env(safe-area-inset-top)) + 46px);z-index:3;flex-wrap:wrap;align-items:center;gap:4px 10px;max-width:calc(100% - 16px);padding:4px 10px;font-size:.82rem;display:flex;position:absolute;left:8px}.online-bar .op{align-items:center;gap:5px;display:inline-flex}.online-bar .op i{border-radius:50%;width:10px;height:10px;display:inline-block}.online-bar .op.away{opacity:.55}.online-bar small{color:var(--muted)}button.tiny{min-height:0;padding:0 6px;font-size:.85rem}.online-alert{text-align:center;z-index:8;flex-direction:column;align-items:center;gap:8px;width:min(420px,100% - 16px);padding:12px 14px;display:flex;position:absolute;top:38%;left:50%;transform:translate(-50%)}.online-alert p{margin:0}