:root{--bg:#f6f3ee;--surface:#fff;--surface-2:#faf8f4;--text:#1f1b16;--muted:#6b645a;--line:#e4ded4;--line-strong:#cfc6b8;--accent:#b8641c;--accent-hover:#a0561a;--accent-soft:#fbefe2;--accent-ink:#fff;--ok:#2f8a5a;--warn:#b7791f;--bad:#c8412f;--shadow:0 1px 2px #1f1b160f, 0 4px 16px #1f1b1614;--shadow-lg:0 8px 40px #1f1b162e;--radius:12px;--display:"Dela Gothic One", "Hiragino Kaku Gothic StdN", "Yu Gothic", sans-serif;--body:"Zen Kaku Gothic New", "Hiragino Sans", "Yu Gothic", system-ui, sans-serif;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--text);font-family:var(--body);margin:0;line-height:1.6}[hidden]{display:none!important}img{max-width:100%;display:block}.muted{color:var(--muted)}.small{font-size:12px}.sp{display:none}#c{touch-action:none;cursor:default;width:100%;height:100%;display:block;position:fixed;inset:0}body.in-menu #c{visibility:hidden}body.in-menu{overflow:auto}body.in-room{background:#2a241e;overflow:hidden}#c.grab{cursor:grab}#c.grabbing{cursor:grabbing}button{font:700 14px var(--body);color:var(--text);background:var(--surface);border:1px solid var(--line-strong);cursor:pointer;white-space:nowrap;-webkit-user-select:none;user-select:none;border-radius:8px;justify-content:center;align-items:center;gap:6px;padding:8px 14px;transition:background .12s,border-color .12s,color .12s;display:inline-flex}button:hover{border-color:var(--muted);background:var(--surface-2)}button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline-offset:1px;outline:3px solid #b8641c59}button.primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}button.primary:hover{background:var(--accent-hover);border-color:var(--accent-hover)}button.ghost{color:var(--muted);background:0 0;border-color:#0000}button.ghost:hover{color:var(--text);background:#1f1b160d}button.link{color:var(--muted);background:0 0;border:none;padding:6px 8px;font-weight:500}button.link:hover{color:var(--text);background:0 0}button.tiny,button.sm{padding:4px 10px;font-size:12px}button.big,button.lg{padding:12px 22px;font-size:16px}button.xl{border-radius:999px;padding:15px 40px;font-size:18px}button:disabled{opacity:.45;cursor:not-allowed}input,select{font:500 15px var(--body);color:var(--text);background:var(--surface);border:1px solid var(--line-strong);border-radius:8px;width:100%;min-width:0;padding:10px 12px}input::placeholder{color:#a39b8f}kbd{font:12px var(--body);border:1px solid var(--line-strong);background:var(--surface);border-bottom-width:2px;border-radius:4px;padding:0 5px}fieldset{border:0;min-width:0;margin:0;padding:0}.menus{flex-direction:column;min-height:100%;display:flex}.topbar{z-index:5;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);background:#ffffffeb;position:sticky;top:0}.topbar-in{justify-content:space-between;align-items:center;gap:12px;max-width:1080px;margin:0 auto;padding:10px 20px;display:flex}.brand{font-family:var(--display);color:var(--text);background:0 0;border:none;gap:10px;padding:4px 0;font-size:20px;font-weight:400}.brand:hover{background:0 0}.brand-mark{background:var(--accent);border-radius:3px;width:14px;height:24px;margin-right:14px;transform:rotate(-8deg);box-shadow:6px 2px 0 -1px #2f6b5a,12px 4px 0 -2px #1f2a44}.topnav{align-items:center;gap:8px;display:flex}.user-chip{border-radius:999px;padding:4px 12px 4px 4px;font-weight:500}.avatar{background:var(--accent-soft);width:26px;height:26px;color:var(--accent);border-radius:50%;place-items:center;font-size:13px;font-weight:700;display:grid}.pages{flex:1;width:100%;max-width:1080px;margin:0 auto;padding:32px 20px 48px}.page{gap:28px;display:grid}.page.narrow{width:100%;max-width:520px;margin:0 auto}h1,h2,h3{margin:0;line-height:1.3}h2{font-size:24px}.hero{text-align:center;justify-items:center;gap:14px;padding:24px 0 8px;display:grid}.eyebrow{color:var(--accent);letter-spacing:.08em;margin:0;font-size:13px;font-weight:700}.hero h1{font-family:var(--display);letter-spacing:.02em;font-size:clamp(30px,5vw,48px);font-weight:400}.hero-lead{max-width:620px;color:var(--muted);margin:0;font-size:16px}.hero button{margin-top:8px}.steps{grid-template-columns:repeat(4,1fr);gap:16px;margin:0;padding:0;list-style:none;display:grid}.step{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);flex-direction:column;display:flex;overflow:hidden}.step img{aspect-ratio:16/10;object-fit:cover;background:#e9e3d8;width:100%;height:auto}.step-body{grid-template-columns:auto 1fr;align-items:center;gap:4px 10px;padding:14px 16px 18px;display:grid}.step-no{background:var(--accent);color:#fff;border-radius:50%;place-items:center;width:26px;height:26px;font-size:14px;font-weight:700;display:grid}.step h3{font-size:17px}.step p{color:var(--muted);grid-column:1/-1;margin:0;font-size:14px}.page-foot{text-align:center;justify-items:center;gap:8px;display:grid}.stepper{color:var(--muted);counter-reset:s;gap:6px;margin:0 auto;padding:0;font-size:13px;list-style:none;display:flex}.stepper li{counter-increment:s;align-items:center;gap:6px;display:flex}.stepper li:before{content:counter(s);border:1px solid var(--line-strong);background:var(--surface);border-radius:50%;place-items:center;width:22px;height:22px;font-size:12px;display:grid}.stepper li+li:after{content:"";background:var(--line-strong);order:-1;width:24px;height:1px;margin-right:2px}.stepper li.done:before{content:"✓";background:var(--ok);border-color:var(--ok);color:#fff}.stepper li.now{color:var(--text);font-weight:700}.stepper li.now:before{background:var(--accent);border-color:var(--accent);color:#fff}.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);gap:18px;padding:28px;display:grid}.panel-head{justify-content:space-between;align-items:center;display:flex}.panel p{margin:-10px 0 0}.field{gap:6px;display:grid}.label{color:var(--text);font-size:13px;font-weight:700}legend.label{margin-bottom:6px}.hint{color:var(--muted);font-size:12px}.actions{justify-content:flex-end;gap:10px;display:flex}.grid2{grid-template-columns:1fr 1fr;gap:14px;display:grid}.grid3{grid-template-columns:repeat(3,1fr);gap:14px;display:grid}.err{color:var(--bad);min-height:1.2em;margin:0;font-weight:700}.page-head{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px;display:flex}.page-head p{margin:4px 0 0}.searchbar{gap:10px;display:grid}.searchbar input{border-radius:10px;padding:12px 14px;font-size:16px}.filters{gap:8px;display:flex}.chip{border-radius:999px;padding:5px 14px;font-size:13px;font-weight:500}.chip.on,.chip.on:hover{background:var(--text);color:#fff;border-color:var(--text)}.code-hit{background:var(--accent-soft);border:1px solid #f0d2b0;border-radius:10px;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;display:flex}.code-hit b{font-family:var(--display);letter-spacing:.15em;font-weight:400}.room-list{gap:8px;margin:0;padding:0;list-style:none;display:grid}.room-row{background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:10px;grid-template-columns:minmax(0,1fr) 160px 130px 88px;align-items:center;gap:16px;padding:12px 16px;display:grid}.room-row:hover{border-color:var(--line-strong)}.rr-main{gap:4px;min-width:0;display:grid}.rr-main h3{text-overflow:ellipsis;white-space:nowrap;font-size:16px;overflow:hidden}.rr-host{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;font-size:13px;overflow:hidden}.rr-seats{color:var(--muted);align-items:center;gap:8px;font-size:13px;display:flex}.room-row>button{width:100%}.net{color:var(--muted);font-variant-numeric:tabular-nums;align-items:center;gap:6px;font-size:12px;display:inline-flex}.net i{background:var(--line-strong);border-radius:50%;width:8px;height:8px}.net.good i{background:var(--ok)}.net.fair i{background:var(--warn)}.net.poor i,.net.off i{background:var(--bad)}.net-inline{margin-left:6px;font-size:12px}.ping{font-variant-numeric:tabular-nums;color:var(--muted);font-size:11px}.ping.good{color:var(--ok)}.ping.fair{color:var(--warn)}.ping.poor{color:var(--bad)}.room-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);gap:10px;padding:16px;display:grid}.room-card h3{text-overflow:ellipsis;white-space:nowrap;font-size:17px;overflow:hidden}.room-meta{color:var(--muted);flex-wrap:wrap;align-items:center;gap:8px;font-size:13px;display:flex}.seats{gap:4px;display:flex}.seats i{background:var(--line);border-radius:50%;width:10px;height:10px}.seats i.on{background:var(--ok)}.room-card .row-end{justify-content:space-between;align-items:center;gap:8px;display:flex}.empty-state{text-align:center;border:1px dashed var(--line-strong);border-radius:var(--radius);color:var(--muted);grid-column:1/-1;justify-items:center;gap:12px;padding:40px 16px;display:grid}.badge{color:var(--muted);white-space:nowrap;background:#efeae2;border-radius:999px;align-items:center;padding:1px 10px;font-size:12px;font-weight:700;display:inline-flex}.badge.game,.mode-tag.game{background:var(--accent-soft);color:var(--accent)}.badge.state{border:1px solid var(--line-strong);background:0 0}.mode-pick{grid-template-columns:1fr 1fr;gap:10px;display:grid}.mode-pick label{border:1px solid var(--line-strong);cursor:pointer;border-radius:10px;align-items:flex-start;gap:10px;padding:12px 14px;display:flex}.mode-pick label:has(input:checked){border-color:var(--accent);background:var(--accent-soft);box-shadow:0 0 0 1px var(--accent) inset}.mode-pick input{accent-color:var(--accent);width:auto;margin-top:5px}.mode-pick span{gap:2px;display:grid}.mode-pick b{font-size:15px}.mode-pick small{color:var(--muted);font-size:12px;line-height:1.6}.mode-pick.compact label{padding:8px 10px}.footer{border-top:1px solid var(--line);justify-content:space-between;width:100%;max-width:1080px;margin:0 auto;padding:16px 20px 24px;font-size:12px;display:flex}.hud{border-radius:var(--radius);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#fffffff0;border:1px solid #1f1b1614;flex-direction:column;gap:8px;padding:12px 14px;display:flex;position:fixed}.room{top:calc(16px + env(safe-area-inset-top,0px));width:236px;left:16px}.room-name{text-overflow:ellipsis;white-space:nowrap;font-size:16px;font-weight:700;overflow:hidden}.room-sub{align-items:center;gap:8px;display:flex}.mode-tag{color:var(--muted);white-space:nowrap;background:#efeae2;border-radius:999px;padding:1px 9px;font-size:11px;font-weight:700}.mode-tag.big{background:var(--accent-soft);color:var(--accent);justify-self:start;padding:3px 12px;font-size:12px}.code{font-family:var(--display);letter-spacing:.18em;color:var(--muted);font-size:13px}.players{gap:2px;margin:0;padding:0;list-style:none;display:grid}.players li{border:1px solid #0000;border-radius:6px;align-items:center;gap:8px;padding:4px 6px;font-size:13px;display:flex}.players li.turn{border-color:var(--accent);background:var(--accent-soft)}.players li.off{opacity:.45}.players .dot{border-radius:50%;flex:none;width:10px;height:10px}.players .nm{text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.players .you{color:var(--muted);font-size:11px}.players .kick{opacity:0;padding:1px 8px;font-size:11px}.players li:hover .kick,.players .kick:focus-visible{opacity:1}@media (hover:none){.players .kick{opacity:.8}}.wait-players li{border-color:var(--line);padding:8px 10px;font-size:15px}.wait-players li.empty-seat{color:var(--muted);border-style:dashed}.status{width:fit-content;max-width:calc(100% - 520px);left:0;right:0;top:calc(16px + env(safe-area-inset-top,0px));text-align:center;box-shadow:var(--shadow);background:#fffffff0;border-radius:999px;justify-items:center;gap:0;margin:0 auto;padding:8px 18px;display:grid;position:fixed}.status b{font-size:15px}.status span{color:var(--muted);font-size:12px}.status.mine{box-shadow:0 0 0 2px var(--accent), var(--shadow)}.status.mine b{color:var(--accent)}.stats{top:calc(16px + env(safe-area-inset-top,0px));flex-direction:row;gap:18px;right:16px}.stat{text-align:center;gap:0;display:grid}.stat b{font-variant-numeric:tabular-nums;font-size:22px;line-height:1.1}.stat span{color:var(--muted);font-size:11px}.stat.hurry b{color:var(--bad)}.banner{font-family:var(--display);color:#fff;text-shadow:0 4px 24px #0009;pointer-events:none;opacity:0;white-space:nowrap;font-size:clamp(26px,6vw,48px);transition:opacity .3s,transform .3s;position:fixed;top:32%;left:50%;transform:translate(-50%,-50%)scale(.96)}.banner.show{opacity:1;transform:translate(-50%,-50%)scale(1)}.toolbar{width:fit-content;max-width:calc(100% - 32px);left:0;right:0;bottom:calc(16px + env(safe-area-inset-bottom,0px));box-shadow:var(--shadow);background:#fffffff0;border-radius:14px;flex-wrap:wrap;justify-content:center;gap:6px;margin:0 auto;padding:8px;display:flex;position:fixed}.toolbar .grp{display:contents}.toolbar .sep{background:var(--line);width:1px;margin:4px 2px}.vote-pop{width:min(380px,100% - 32px);left:0;right:0;top:calc(80px + env(safe-area-inset-top,0px));z-index:25;background:var(--surface);border:2px solid var(--accent);box-shadow:var(--shadow-lg);border-radius:14px;gap:10px;margin:0 auto;padding:16px 18px;display:grid;position:fixed}.vote-title{text-align:center;margin:0;font-size:16px;font-weight:700}.vote-sub{color:var(--muted);text-align:center;margin:0;font-size:12px}.vote-bar{background:#efeae2;border-radius:3px;height:6px;overflow:hidden}.vote-bar span{background:var(--accent);height:100%;transition:width .2s;display:block}.center-row{justify-content:center}.center-row button{min-width:110px}.overlay{background:#1f1b1659;place-items:center;padding:16px;display:grid;position:fixed;inset:0;overflow:auto}.card{background:var(--surface);width:min(620px,100%);box-shadow:var(--shadow-lg);border-radius:16px;gap:14px;margin:auto;padding:24px;display:grid}.card.small{width:min(440px,100%)}.title2{font-size:21px}.invite{color:var(--muted);align-items:center;gap:10px;font-size:13px;display:flex}.invite b{font-family:var(--display);letter-spacing:.2em;color:var(--text);font-size:20px;font-weight:400}.row{flex-wrap:wrap;justify-content:flex-end;gap:8px;display:flex}.row-between{justify-content:space-between;align-items:center;gap:8px;display:flex}.col{gap:8px;display:grid}.col .row{justify-content:stretch}.col .row button{flex:1}.note{color:var(--muted);margin:0;font-size:13px;line-height:1.7}.note b{color:var(--text)}.center{text-align:center}.card>.ghost.tiny{justify-self:center}.result-big{justify-content:center;align-items:baseline;gap:10px;display:flex}.result-big b{font-family:var(--display);color:var(--accent);font-variant-numeric:tabular-nums;font-size:64px;font-weight:400;line-height:1}.result-big span{color:var(--muted);font-size:15px}.result-big i{color:var(--text);font-style:normal;font-weight:700}.result-pads,.result-comment{text-align:center;margin:0}.result-pads{color:var(--muted);font-size:13px}.result-comment{font-size:18px;font-weight:700}dialog{box-shadow:var(--shadow-lg);color:var(--text);border:none;border-radius:16px;padding:0}dialog::backdrop{background:#1f1b1666}.settings{gap:14px;width:min(460px,86vw);max-height:86vh;padding:20px 22px;display:grid;overflow:auto}.set-sec{border-top:1px solid var(--line);gap:10px;padding-top:14px;display:grid}.set-sec h3{color:var(--muted);align-items:baseline;gap:8px;font-size:13px;display:flex}.set-sec h3 small{font-size:11px;font-weight:400}.switch{cursor:pointer;align-items:center;gap:10px;font-size:14px;font-weight:700;display:flex}.switch input{width:18px;height:18px;accent-color:var(--accent);flex:none;margin:0}.switch span{gap:0;display:grid}.switch small{color:var(--muted);font-size:12px;font-weight:400}.help-list{color:var(--muted);gap:4px;margin:0;padding:0;font-size:13px;list-style:none;display:grid}.help-list b{color:var(--text);margin-right:4px}#roomSet:disabled{opacity:.55}.cursor-tag{pointer-events:none;box-shadow:var(--shadow);white-space:nowrap;font-variant-numeric:tabular-nums;z-index:5;background:#fffffff5;border-radius:999px;gap:10px;padding:4px 9px;font-size:12px;font-weight:700;display:flex;position:fixed}.ok{color:var(--ok)}.warn{color:var(--warn)}.bad{color:var(--bad)}.toast{left:50%;bottom:calc(84px + env(safe-area-inset-bottom,0px));color:#fff;pointer-events:none;opacity:0;white-space:nowrap;z-index:40;text-overflow:ellipsis;background:#1f1b16eb;border-radius:999px;max-width:calc(100% - 32px);padding:10px 18px;font-size:14px;font-weight:700;transition:opacity .3s;position:fixed;overflow:hidden;transform:translate(-50%)}.toast.show{opacity:1}body.in-menu .toast{bottom:24px}.loading{color:var(--muted);background:var(--bg);z-index:50;place-items:center;font-weight:700;display:grid;position:fixed;inset:0}@media (width<=900px){.steps{grid-template-columns:repeat(2,1fr)}}@media (width<=1000px){.status{padding:6px 14px}.status b{font-size:14px}.status span{font-size:11px}body.in-room .toast{bottom:calc(150px + env(safe-area-inset-bottom,0px))}}@media (width<=760px){.status{top:auto;bottom:calc(150px + env(safe-area-inset-bottom,0px));max-width:calc(100% - 32px)}body.in-room .toast{bottom:calc(220px + env(safe-area-inset-bottom,0px))}}@media (width<=640px){.sp{display:inline}.pages{padding:20px 16px 40px}.panel{padding:20px}.steps,.mode-pick,.grid2{grid-template-columns:1fr}.grid3{gap:8px}.room-row{grid-template-columns:minmax(0,1fr) auto;gap:6px 12px}.rr-host{grid-area:2/1}.rr-seats{grid-area:1/2}.room-row>button{grid-area:2/2}.page-head>button{width:100%}.room{width:170px;padding:8px 10px}#btnCopy{display:none}.stats{gap:10px;padding:8px 10px}.stat b{font-size:17px}.toolbar button{padding:8px 10px;font-size:12px}.status{bottom:calc(170px + env(safe-area-inset-bottom,0px))}body.in-room .toast{bottom:calc(240px + env(safe-area-inset-bottom,0px))}}@media (prefers-reduced-motion:reduce){.toast,.banner{transition:none}}.build-version{right:calc(8px + env(safe-area-inset-right,0px));bottom:calc(2px + env(safe-area-inset-bottom,0px));z-index:1;color:var(--muted);pointer-events:none;-webkit-user-select:none;user-select:none;background:#ffffffbf;border-radius:4px;padding:0 5px;font:10.5px/12px ui-monospace,Menlo,Consolas,monospace;position:fixed}body.in-room .build-version{color:#fff9;text-shadow:0 1px 2px #0009;background:0 0}