.tool{--gap:12px;padding:0 16px calc(var(--kbd-h,300px) + 24px);margin:-24px -16px 0;position:relative}.tool-head h1{line-height:1.3}.tool-head{padding:18px 0 8px}.tool-head h1{margin:0;font-size:20px}.tool-head p{color:var(--muted);margin:0;font-size:13px}.board{z-index:5;background:linear-gradient(180deg, #13603d, var(--felt));margin:0 -16px;padding:10px 16px 8px;position:sticky;top:0;box-shadow:0 6px 16px -10px #00000080}.hand{grid-template-columns:repeat(13,1fr) 6px 1fr;align-items:end;gap:2px;max-width:560px;display:grid}.hand .tile,.melds .tile{width:100%}.tile{filter:drop-shadow(0 2px #b9ad8f);cursor:pointer;background:url(/tiles/front.svg) 50%/100% 100% no-repeat}.tile.slot{filter:none;cursor:default;background:#ffffff14;border:1.5px dashed #ffffff59;border-radius:4px;place-items:center;display:grid}.tile.slot-win small{color:#ffffffb3;writing-mode:vertical-rl;font-size:9px}.tile.is-win{border-radius:4px;box-shadow:0 0 0 2px #ffd166}.hand .tile:empty:not(.slot){visibility:hidden}.hand>.tile:not(.slot){animation:.16s ease-out drop}@keyframes drop{0%{opacity:0;transform:translateY(-8px)}}.melds{flex-wrap:wrap;gap:8px;margin-top:6px;display:flex}.meld{cursor:pointer;background:#0000002e;border:0;border-radius:6px;align-items:flex-end;gap:1px;padding:3px 5px;display:inline-flex}.meld small{color:#d8eadf;align-self:center;margin-right:3px;font-size:10px}.meld .tile{width:22px}.meld .tile.back{filter:none;background:#1d6f9a;border-radius:3px}.meld .tile.back img{visibility:hidden}.status{margin-top:var(--gap);min-height:64px}.msg{border:1px solid var(--line);border-radius:var(--radius);background:#fff;padding:12px 14px;font-size:14px}.msg p{margin:2px 0 0}.msg-err{color:var(--accent);background:#fff6f5;border-color:#f1b7b0}.presets{color:var(--muted);flex-wrap:wrap;align-items:center;gap:6px;margin-top:10px;font-size:13px;display:flex}.presets button{border:1px solid var(--felt);color:var(--felt);cursor:pointer;background:#fff;border-radius:999px;min-height:40px;padding:0 14px;font-size:13px}.res{background:radial-gradient(120% 140% at 0% 0%, #1b7a4e, var(--felt) 55%, var(--felt-dark));color:#fff;border-radius:16px;padding:12px 14px 10px;animation:.2s ease-out pop;position:relative;box-shadow:0 10px 24px -14px #0a3a24cc}@keyframes pop{0%{opacity:.4;transform:scale(.97)}}.res-top{align-items:center;gap:8px;font-size:13px;display:flex}.res-who{background:#ffffff29;border-radius:999px;padding:1px 10px}.res-rank{color:#5b3b00;background:#ffd166;border-radius:999px;padding:1px 10px;font-weight:800}.res-pts{align-items:baseline;gap:4px;margin-top:2px;display:flex}.res-pts output{letter-spacing:-.02em;font-variant-numeric:tabular-nums;font-size:44px;font-weight:800;line-height:1.1}.res-pts span{font-size:18px;font-weight:700}.res-sub{flex-wrap:wrap;align-items:baseline;gap:4px 12px;font-size:15px;display:flex}.res-sub b{font-size:20px}.res-pay{opacity:.9;font-size:14px}.res-yaku{flex-wrap:wrap;gap:5px;margin:8px 0 0;padding:0;list-style:none;display:flex}.res-yaku li{background:#ffffff24;border-radius:8px;padding:3px 8px;font-size:13px}.res-yaku b{color:#ffd166;margin-left:6px;font-weight:700}.res-fu{margin-top:8px;font-size:13px}.res-fu summary{cursor:pointer;opacity:.9}.res-fu ul{margin:6px 0 0;padding:0;list-style:none}.res-fu li{border-bottom:1px dotted #ffffff40;justify-content:space-between;padding:2px 0;display:flex}.res-fu p{opacity:.85;margin:4px 0 0}.res-share{color:#fff;cursor:pointer;background:#ffffff1f;border:1px solid #ffffff59;border-radius:999px;min-height:36px;padding:0 14px;font-size:13px;position:absolute;top:8px;right:8px}.waits{border:2px solid var(--felt);border-radius:var(--radius);background:#fff;padding:10px 12px}.waits-title{margin:0 0 8px;font-size:15px}.waits-title b{color:var(--accent)}.waits-title small{color:var(--muted);font-size:12px;display:block}.waits ul{grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:6px;margin:0;padding:0;list-style:none;display:grid}.waits li button{text-align:left;border:1px solid var(--line);cursor:pointer;background:#f6f2e8;border-radius:10px;grid-template-rows:auto auto;grid-template-columns:28px 1fr;align-items:center;column-gap:6px;width:100%;padding:6px 8px;display:grid}.waits li button:active{transform:scale(.97)}.waits .tile{aspect-ratio:3/4;grid-row:span 2;width:28px;display:block;position:relative}.w-pts{color:var(--felt);font-variant-numeric:tabular-nums;font-size:15px;font-weight:800}.w-sub{color:var(--muted);font-size:11px}.w-none{color:#a49b86;grid-row:span 2;font-size:12px}.conds{margin-top:var(--gap);gap:8px;display:grid}.seg{background:#ebe5d6;border-radius:10px;gap:2px;padding:3px;display:flex}.seg label{flex:1;position:relative}.seg input{opacity:0;cursor:pointer;margin:0;position:absolute;inset:0}.seg span{text-align:center;color:#4a5650;border-radius:8px;justify-content:center;align-items:center;min-height:42px;padding:0 4px;font-size:14px;font-weight:600;transition:background .12s;display:flex}.seg input:checked+span{color:var(--felt);background:#fff;box-shadow:0 1px 3px #00000026}.seg input:disabled+span{opacity:.35}.seg input:focus-visible+span{outline:2px solid var(--felt)}.seg-label{color:var(--muted);align-self:center;padding:0 6px;font-size:12px}.cond-2{grid-template-columns:2fr 3fr;gap:8px;display:grid}.cond-row{justify-content:space-between;align-items:center;gap:8px;display:flex}.chip{display:inline-block;position:relative}.chip input{opacity:0;cursor:pointer;margin:0;position:absolute;inset:0}.chip span{border:1.5px solid var(--line);color:#4a5650;background:#fff;border-radius:999px;align-items:center;min-height:44px;padding:0 16px;font-size:14px;font-weight:600;display:inline-flex}.chip input:checked+span{background:var(--felt);border-color:var(--felt);color:#fff}.chip input:disabled+span{opacity:.35}.chips{flex-wrap:wrap;gap:6px;display:flex}.stepper{border:1.5px solid var(--line);background:#fff;border-radius:999px;align-items:center;display:inline-flex;overflow:hidden}.stepper-label{color:var(--muted);padding:0 4px 0 12px;font-size:13px}.stepper button{width:44px;height:44px;color:var(--felt);cursor:pointer;background:0 0;border:0;font-size:20px}.stepper button:active{background:#f1ece0}.stepper input{text-align:center;-moz-appearance:textfield;background:0 0;border:0;width:28px;padding:0;font-size:17px;font-weight:800}.stepper input::-webkit-inner-spin-button{display:none}.more{border:1px solid var(--line);border-radius:var(--radius);background:#fff}.more summary{cursor:pointer;min-height:44px;color:var(--muted);align-items:center;padding:0 14px;font-size:14px;display:flex}.more-body{gap:10px;padding:0 12px 12px;display:grid}.kbd{z-index:20;padding:6px 8px calc(8px + env(safe-area-inset-bottom));background:#e9e3d4;border-top:1px solid #d6cdb7;transition:transform .22s;position:fixed;bottom:0;left:0;right:0;box-shadow:0 -8px 24px -12px #00000059}.kbd.is-away{transform:translateY(calc(100% + 12px))}.kbd-body,.kbd-expand{max-width:520px;margin:0 auto}.kbd-expand{background:var(--felt);color:#fff;cursor:pointer;border:0;border-radius:12px;width:100%;padding:12px;font-size:15px;font-weight:700;display:none}.kbd.is-min .kbd-body{display:none}.kbd.is-min .kbd-expand{display:block}.kbd-bar{justify-content:space-between;gap:6px;display:flex}.kbd-modes,.kbd-tools{gap:4px;display:flex}.kbd-bar{scrollbar-width:none;overflow-x:auto}.kbd-bar button{color:#3d4a43;cursor:pointer;background:#fff;border:0;border-radius:10px;min-width:40px;min-height:40px;padding:0 10px;font-size:13px;font-weight:700;box-shadow:0 1px #cfc5ad}.kbd-bar button[aria-pressed=true]{background:var(--accent);color:#fff}.kbd-hint b{color:var(--accent);font-size:13px}.kbd-hint{color:#6b6450;min-height:1.5em;margin:4px 2px;font-size:12px;line-height:1.5}.kbd-grid{grid-template-columns:repeat(9,1fr);gap:5px 4px;display:grid}.ktile,.kback{aspect-ratio:3/4;cursor:pointer;filter:drop-shadow(0 2px #b9ad8f);touch-action:manipulation;-webkit-tap-highlight-color:transparent;background:url(/tiles/front.svg) 50%/100% 100% no-repeat;border:0;padding:0;transition:transform 60ms;position:relative}.ktile img{pointer-events:none;width:100%;height:100%;display:block}.ktile:active:not(:disabled),.kback:active{filter:drop-shadow(0 0 #b9ad8f);transform:translateY(2px)scale(.95)}.ktile:disabled{opacity:.28;cursor:default}.ktile[data-left]:not([data-left=""]):after{content:attr(data-left);color:#fff;text-align:center;background:#3d4a43;border-radius:8px;min-width:15px;height:15px;font-size:10px;font-weight:700;line-height:15px;position:absolute;top:-4px;right:-3px}.kback{aspect-ratio:auto;color:#3d4a43;filter:none;background:#cfc5ad;border-radius:6px;grid-column:span 2;font-size:22px}.pop{z-index:30;background:#222a26;border-radius:10px;gap:2px;padding:4px;display:flex;position:fixed;box-shadow:0 8px 24px #0000004d}.pop button{color:#fff;cursor:pointer;white-space:nowrap;background:0 0;border:0;border-radius:7px;padding:8px 12px;font-size:14px}.pop button:active{background:#ffffff1f}.pop button.danger{color:#ff9b8f}.quick{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.quick select{padding:4px;font-size:16px}.quick-out{flex-basis:100%;font-size:17px;font-weight:700}.sheet{background:var(--paper);border:0;border-radius:18px 18px 0 0;width:100%;max-width:520px;max-height:75vh;margin:auto auto 0;padding:0}.sheet::backdrop{background:#0a1e1473}.sheet[open]{animation:.22s ease-out sheet-up}@keyframes sheet-up{0%{opacity:.4;transform:translateY(40%)}}.sheet-head{background:var(--paper);border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;padding:6px 8px 6px 18px;display:flex;position:sticky;top:0}.sheet-head button{cursor:pointer;background:0 0;border:0;width:44px;height:44px;font-size:18px}.sheet-body{padding:8px 12px calc(16px + env(safe-area-inset-bottom))}.hist-list{gap:6px;margin:0;padding:0;list-style:none;display:grid}.hist-list button{text-align:left;border:1px solid var(--line);cursor:pointer;background:#fff;border-radius:12px;gap:4px;width:100%;padding:10px 12px;display:grid}.hist-list button:active{background:#f1ece0}.hist-tiles{flex-wrap:wrap;gap:1px;display:flex}.hist-tiles img{background:url(/tiles/front.svg) 50%/100% 100%;width:15px;height:20px}.hist-tiles img:last-child{border-radius:2px;margin-left:4px;box-shadow:0 0 0 1.5px #e0a800}.hist-meta{color:var(--muted);font-size:13px}.hist-meta b{color:var(--felt);margin-right:4px;font-size:16px}.hist-meta small{font-size:12px;display:block}.hist-empty{color:var(--muted);padding:12px 6px;font-size:14px}.toast{left:50%;bottom:calc(var(--kbd-h,0px) + 16px);z-index:40;color:#fff;opacity:0;pointer-events:none;white-space:nowrap;background:#222a26;border-radius:999px;padding:10px 16px;font-size:14px;transition:all .2s;position:fixed;transform:translate(-50%,20px)}.toast.show{opacity:1;transform:translate(-50%)}.kbd-bar button{white-space:nowrap;flex:none}.kbd-tools{margin-left:auto}@media (width<=374px){.kbd-bar{gap:4px}.kbd-modes,.kbd-tools{gap:3px}.kbd-bar button{min-width:36px;padding:0 7px;font-size:12px}.tool-head p{display:none}.seg span{font-size:13px}}@media (prefers-reduced-motion:reduce){.res,.hand>.tile{animation:none}}@media (width>=900px){.tool{grid-template-columns:minmax(0,1fr) 380px;grid-template-areas:"head head""board side""kbd side";align-items:start;column-gap:24px;margin:0;padding:0 0 24px;display:grid}.tool-head{grid-area:head}.board{border-radius:14px;grid-area:board;margin:0;position:static}.side{grid-area:side}.conds{margin-top:0}.kbd{box-shadow:none;border:1px solid #d6cdb7;border-radius:14px;grid-area:kbd;margin-top:12px;position:static;transform:none!important}.kbd.is-min .kbd-body{display:block}.kbd.is-min .kbd-expand{display:none}.kbd-body{max-width:none}}