:root{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC",sans-serif;color:#263a30;background:#f7f6f0;font-synthesis:none;--green:#27794d;--muted:#7b8177;--line:#e4e5da}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button{cursor:pointer;transition:background .16s,transform .16s;border:0}button:active{transform:scale(.97)}button:disabled{cursor:not-allowed;opacity:.5}button:focus-visible,a:focus-visible{outline:3px solid #84b898;outline-offset:4px}a{color:inherit;text-decoration:none}header,main,footer{max-width:1160px;margin:auto}header{height:78px;display:flex;align-items:center;justify-content:space-between;padding:0 32px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:10px;font-size:25px;font-weight:750;letter-spacing:-.6px}.brand>span:first-child{display:grid;place-items:center;background:var(--green);color:#fff;width:34px;height:34px;border-radius:50%;font-size:24px}.brand small{font-size:11px;color:var(--muted);font-weight:500;letter-spacing:.4px;margin-left:9px}.connection{font-size:11px;color:var(--muted);white-space:nowrap}.connection:before{content:"";display:inline-block;width:6px;height:6px;background:#aeb5a7;border-radius:100%;margin-right:6px}.connection.online{color:var(--green)}.connection.online:before{background:var(--green)}main{padding:0 32px}.room-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;margin:27px 0 18px}h1{font-size:23px;line-height:1.4;letter-spacing:-.5px;margin:0;overflow-wrap:anywhere}.room-tag{font-size:11px;color:var(--muted);white-space:nowrap}.room-top{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:45px;align-items:stretch;padding-bottom:24px;border-bottom:1px solid var(--line)}.stage-heading{display:flex;justify-content:space-between;align-items:center;height:30px;gap:8px}.stage-heading p{font-size:12px;color:var(--muted);margin:0}.text-button{background:transparent;color:var(--green);padding:8px 0;font-size:12px;white-space:nowrap;min-height:36px}.text-button:hover{text-decoration:underline}.stage{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px 20px;margin-top:10px}.seat{background:transparent;display:flex;flex-direction:column;align-items:center;min-width:0;padding:0 5px;position:relative;opacity:1!important;color:inherit}.portrait{width:82px;height:82px;border-radius:50%;position:relative;background:#e9e5d5;box-shadow:0 0 0 3px transparent;transition:box-shadow .18s,transform .18s}.portrait:before{content:"";position:absolute;inset:2px;background-image:url('./avatars.png');background-size:400% 200%;background-repeat:no-repeat;border-radius:50%}.face-0:before{background-position:0% 0%}.face-1:before{background-position:33.333% 0%}.face-2:before{background-position:66.667% 0%}.face-3:before{background-position:100% 0%}.face-4:before{background-position:0% 100%}.face-5:before{background-position:33.333% 100%}.face-6:before{background-position:66.667% 100%}.face-7:before{background-position:100% 100%}.seat.available:hover .portrait{transform:translateY(-3px);box-shadow:0 0 0 3px #b8d4bd}.seat.mine .portrait{box-shadow:0 0 0 3px var(--green)}.seat.claimed:not(.mine) .portrait{box-shadow:0 0 0 2px #c7cabe}.seat.empty-seat .portrait{filter:grayscale(1);opacity:.35;background:#dedfd8}.seat-name{font-size:12px;margin-top:8px;max-width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;line-height:1.4;font-weight:550}.seat-status{font-size:10px;line-height:1.3;color:var(--muted);margin-top:3px}.seat.mine .seat-status{color:var(--green)}.seat-marker{position:absolute;right:-2px;bottom:0;display:grid;place-items:center;border-radius:50%;background:var(--green);color:white;width:20px;height:20px;font-size:11px;border:2px solid #f7f6f0}.stage-foot{color:var(--muted);font-size:10px;line-height:1.6;margin:15px 0 0;min-height:16px}.now-playing{border-left:1px solid var(--line);display:flex;align-items:center;flex-direction:column;justify-content:center;gap:18px;padding:12px 20px;text-align:center;min-width:0}.record{width:108px;height:108px;border-radius:50%;background:repeating-radial-gradient(circle,#2c4234 0,#2c4234 2px,#3f5545 3px,#2c4234 4px);display:grid;place-items:center;flex-shrink:0;box-shadow:0 10px 20px #263a3018}.record span{display:grid;place-items:center;border-radius:50%;background:#e2d9b8;width:34px;height:34px;font-size:23px}.now-copy{min-width:0}.now-copy>p:first-child{font-size:10px;color:var(--green);letter-spacing:1px;margin:0 0 9px}.now-copy h2{font-size:20px;line-height:1.5;margin:0;overflow-wrap:anywhere;font-weight:640}.now-copy>p:last-child{font-size:12px;color:var(--muted);margin:7px 0 0}.equalizer{height:17px;display:flex;align-items:center;gap:4px}.equalizer i{height:4px;width:3px;border-radius:3px;background:var(--green)}.playing .equalizer i{animation:bars .8s ease-in-out infinite alternate}.equalizer i:nth-child(2){animation-delay:-.3s}.equalizer i:nth-child(3){animation-delay:-.6s}.equalizer i:nth-child(4){animation-delay:-.1s}@keyframes bars{to{height:17px}}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:45px;margin-top:26px;align-items:start}.search-form{display:flex;gap:10px;align-items:center;border:1px solid #cbd5c5;background:#fff;padding:5px 5px 5px 14px;border-radius:8px}.search-form>span{font-size:27px;color:var(--muted);line-height:1}.search-form input{font:inherit;min-width:0;flex:1;border:0;outline:0;background:transparent;font-size:14px;color:#253b2d;padding:9px 0}.search-form:focus-within{border-color:var(--green);box-shadow:0 0 0 2px #27794d12}.primary{padding:11px 18px;background:var(--green);color:white;font-size:13px;border-radius:5px;min-height:42px}.primary:hover:not(:disabled){background:#1f633f}.section-top{display:flex;align-items:center;justify-content:space-between;margin:22px 0 3px;gap:12px;min-height:35px}.section-top h2{font-size:15px;font-weight:620;margin:0}.section-top h2 span{font-size:11px;color:var(--muted);font-weight:400;margin-left:6px}.search-note{font-size:11px;line-height:1.6;color:var(--muted);margin:0 0 14px}.track{display:grid;grid-template-columns:minmax(0,1fr) 65px;align-items:center;gap:14px;border-bottom:1px solid var(--line);padding:15px 1px;min-height:72px}.track-name{font-size:14px;line-height:1.5;font-weight:560;overflow-wrap:anywhere}.track-artist{font-size:11px;color:var(--muted);line-height:1.5;margin-top:4px}.add{font-size:12px;border:1px solid #bdd0bd;border-radius:5px;color:var(--green);background:transparent;min-height:40px;padding:8px}.add:hover:not(:disabled){background:var(--green);color:white}.add.added{background:#e6eddf;border-color:transparent}.tracks .empty{padding:26px 10px;font-size:12px;color:var(--muted);line-height:1.7}.queue{border-left:1px solid var(--line);padding-left:20px;position:sticky;top:20px}.queue-toggle{display:flex;justify-content:space-between;align-items:center;background:transparent;padding:0;width:100%;text-align:left;cursor:default;min-height:40px}.queue-toggle>span:first-child{font-size:16px;font-weight:650}.queue-toggle b{font-size:12px;font-weight:400;color:var(--muted);margin-left:6px}.queue-toggle>span:last-child{font-size:10px;color:var(--muted)}.queue-item{display:flex;align-items:flex-start;gap:10px;padding:15px 0;border-bottom:1px solid var(--line);animation:arrive .2s ease-out}.queue-number{font-size:11px;color:#98a290;min-width:16px;padding-top:3px}.queue-item:first-child .queue-number{color:var(--green)}.queue-name{font-size:13px;line-height:1.5;overflow-wrap:anywhere}.queue-by{font-size:10px;color:var(--muted);line-height:1.5;margin-top:4px}.queue .empty{font-size:12px;color:#959d8e;line-height:1.8;padding:30px 0}.queue-rules{font-size:10px;line-height:1.8;color:var(--muted);margin:18px 0}.queue #queue-list{max-height:480px;overflow:auto;scrollbar-width:thin}footer{font-size:10px;line-height:1.7;color:var(--muted);padding:28px 32px;margin-top:26px;border-top:1px solid var(--line)}#toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,10px);background:#263e2c;color:white;padding:12px 18px;border-radius:7px;font-size:12px;line-height:1.6;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;max-width:90vw;z-index:20}#toast.show{opacity:1;transform:translate(-50%,0)}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@keyframes arrive{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@media(max-width:850px){.room-top,.workspace{grid-template-columns:minmax(0,1fr) 220px;gap:25px}.portrait{width:68px;height:68px}.stage{gap:14px 8px}.brand small{display:none}.now-playing{padding:12px}.record{width:85px;height:85px}}@media(max-width:640px){header{height:61px;padding:0 18px}.brand{font-size:22px}.brand>span:first-child{width:29px;height:29px;font-size:21px}main{padding:0 18px}.room-heading{margin:20px 0 10px;gap:8px}h1{font-size:20px}.room-tag{font-size:10px}.room-top{display:block;padding-bottom:18px}.stage-heading p{font-size:11px}.stage{gap:14px 8px;margin-top:8px}.portrait{width:64px;height:64px}.seat{padding:0}.seat-name{font-size:11px;margin-top:6px}.seat-status{font-size:9px}.stage-foot{margin-top:13px;font-size:9px}.now-playing{border:0;background:#e8eddf;flex-direction:row;text-align:left;justify-content:flex-start;gap:12px;padding:12px 14px;border-radius:6px;margin-top:17px}.record{width:46px;height:46px;box-shadow:none}.record span{width:18px;height:18px;font-size:14px}.now-copy{flex:1}.now-copy>p:first-child{font-size:9px;margin-bottom:3px}.now-copy h2{font-size:15px;line-height:1.35}.now-copy>p:last-child{font-size:10px;margin-top:3px}.equalizer{margin-left:auto}.workspace{display:block;margin-top:18px}.search-form{border-radius:6px;gap:7px;padding-left:11px}.primary{padding:10px 14px}.section-top{margin-top:16px}.search-note{font-size:10px}.track{padding:14px 0;grid-template-columns:minmax(0,1fr) 64px}.track-name{font-size:13px}.add{min-height:42px}.queue{position:fixed;top:auto;bottom:0;left:0;right:0;border-left:0;border-top:1px solid #dce1d2;background:#fbfbf5;padding:0 18px;padding-bottom:env(safe-area-inset-bottom);z-index:10;box-shadow:0 -6px 22px #263e2c08}.queue-toggle{min-height:59px;cursor:pointer}.queue-toggle>span:first-child{font-size:14px}.queue-toggle>span:last-child{color:var(--green);font-size:11px}#queue-body{display:none}.queue.expanded #queue-body{display:block;animation:arrive .18s ease-out}.queue.expanded #queue-list{max-height:46vh;overflow:auto}.queue-rules{margin:12px 0 15px}.queue-item{padding:12px 0}.queue .empty{padding:15px 0}footer{padding:22px 18px 92px;margin-top:20px}#toast{bottom:80px;max-width:calc(100vw - 36px);width:max-content}.queue.expanded~#toast{bottom:80px}}@media(max-width:360px){main,header{padding-left:14px;padding-right:14px}.portrait{width:57px;height:57px}.stage{gap:13px 5px}.room-tag{font-size:9px}.stage-heading p{font-size:10px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Language switching keeps seats, searches and queue state intact. */
.brand{white-space:nowrap}.header-tools{display:flex;align-items:center;gap:18px}.language-picker{display:flex;gap:2px;padding:3px;border:1px solid var(--line);border-radius:7px;background:#fff}.language-picker button{min-height:32px;min-width:38px;padding:5px 8px;background:transparent;border-radius:4px;color:var(--muted);font-size:11px}.language-picker button[aria-pressed="true"]{background:var(--green);color:#fff}.stage-heading{height:auto;min-height:30px}.stage-heading p{line-height:1.5;overflow-wrap:anywhere}.stage-foot{min-height:32px}html[lang="en"] .track{grid-template-columns:minmax(0,1fr) 86px}html[lang="en"] .brand{font-size:22px}html[lang="en"] .brand small{font-size:10px}html[lang="en"] .room-tag{white-space:normal;text-align:right}html[lang="en"] .primary{padding-left:13px;padding-right:13px}html[lang="en"] .queue-toggle{gap:10px}
@media(max-width:640px){header{height:72px}.header-tools{flex-direction:column-reverse;align-items:flex-end;gap:3px}.language-picker{padding:2px}.language-picker button{min-height:28px;min-width:33px;padding:3px 6px}.connection{font-size:9px}html[lang="en"] .brand{font-size:18px;gap:7px}html[lang="en"] .stage-heading p{font-size:10px}html[lang="en"] .stage-foot{font-size:10px;line-height:1.6}html[lang="en"] .room-heading{align-items:flex-start}.stage-foot{min-height:0}}
@media(max-width:360px){html[lang="en"] .room-tag{max-width:100px}html[lang="en"] .brand{font-size:17px}}

/* Keep mobile input at 16px: small iOS text fields trigger focus zoom. */
.search-form{min-width:0;max-width:100%}
.search-form>span{flex:0 0 auto}
.search-form input{flex:1 1 0%;width:100%;min-width:0;line-height:1.4}
.search-form .primary{flex:0 0 auto;white-space:nowrap}
@media(max-width:850px),(hover:none) and (pointer:coarse){
  .search-form input{font-size:16px;min-height:44px;padding:10px 0;scroll-margin-block:24px 100px}
  .search-form .primary{min-height:44px}
}