.together-trigger{display:flex;align-items:center;justify-content:center;gap:5px;border:1px solid #ddba817a;background:#eac2831b;color:#ffdfa7;padding:8px 10px;font-weight:750;border-radius:11px;font-size:11px;white-space:nowrap}
.together-trigger.shared{background:#edc68a;color:#18384a;border-color:#edc68a}
.together-sheet{width:min(calc(100vw - 24px),440px);padding:20px 20px 22px}
.together-sheet h2{margin:13px 0 12px;font-size:30px}
.together-sheet h2 em{color:#f0cb90;font-weight:400}
.together-intro{margin:0 0 15px}
.together-sheet .field-select{margin-bottom:1px}
.together-sheet .sheet-primary{margin:12px 0}
.together-room{padding-top:9px}
.together-room[hidden]{display:none}
.room-code-row{display:flex;align-items:center;gap:8px;background:#0a273d;border:1px solid #557a8b;border-radius:12px;padding:9px}
.room-code-row span{color:#a0c3ca;letter-spacing:1px;font-size:10px}
.room-code-row strong{font:16px Georgia,serif;letter-spacing:1px;color:#f0d6a9;margin-left:auto}
.room-code-row button{background:#ffffff14;border:1px solid #547c8c;color:#fff;border-radius:8px;padding:6px 10px;font-size:12px}
.share-tabs{display:grid;grid-template-columns:1fr 1fr;gap:5px;background:#07273a;border-radius:13px;padding:4px;margin:14px 0 11px}
.share-tab{border:0;border-radius:9px;background:transparent;color:#9fc0c9;min-height:36px;font-weight:700;font-size:13px}
.share-tab.active{background:#355971;color:#fff4df}
.qr-card{display:flex;flex-direction:column;align-items:center;gap:9px;padding:14px 10px 13px;border:1px solid #5a81915c;border-radius:17px;background:#ffffff06}
.qr-visual{height:188px;width:188px;background:#fffaf0;border-radius:11px;padding:10px;display:flex;align-items:center;justify-content:center}
.qr-visual svg{width:100%;height:100%;shape-rendering:crispEdges}
.qr-caption{font-size:12px;color:#bed1d3;text-align:center;max-width:260px;line-height:1.5}
.share-buttons{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:10px 0}
.share-button{border:1px solid #63899a;color:#e9efef;background:#ffffff13;min-height:40px;border-radius:10px;font-weight:700;font-size:13px}
.share-button.primary-share{background:#eac78e;color:#15374b;border-color:#eac78e}
.together-divider{font-size:10px;color:#dbbc8c;font-weight:800;letter-spacing:2px;margin:17px 0 8px;border-bottom:1px solid #5c829063;padding-bottom:8px}
.standings{display:flex;flex-direction:column;gap:7px}
.standing{display:flex;align-items:center;gap:10px;background:#ffffff0b;padding:10px 12px;border-radius:11px;min-height:45px}
.standing-rank{width:22px;color:#e7be83;font-family:Georgia,serif}
.standing-name{flex:1;color:#f7f0e5;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.standing-name small{display:block;color:#9dbec8;font-size:10px}
.standing-score{font:20px Georgia,serif;color:#edcc93}
.together-join{padding-top:13px;border-top:1px solid #ffffff22;margin-top:12px}
.join-line{display:flex;gap:7px}
.join-line input{min-width:0;flex:1;border:1px solid #557e92;background:#08283b;color:white;border-radius:9px;padding:11px;font-size:13px}
.join-line button{border:1px solid #e6c189;background:#e6c189;color:#173348;border-radius:9px;padding:8px 13px;font-weight:750}
.together-status{font-size:12px;color:#efca8f;min-height:20px;padding-top:6px}
.sound-choice{display:flex;align-items:center;justify-content:space-between;gap:14px;background:#ffffff10;padding:11px 12px;border-radius:12px;margin:19px 0 10px;cursor:pointer}
.sound-choice strong{display:block;font-size:14px;font-weight:700}
.sound-choice small{display:block;color:#b0c5cc;font-size:11px;margin-top:2px}
.sound-choice input{appearance:none;position:relative;width:43px;height:25px;background:#72818b;border-radius:30px;flex:none;transition:background .2s;cursor:pointer}
.sound-choice input::after{content:"";display:block;width:19px;height:19px;position:absolute;top:3px;left:3px;background:white;border-radius:50%;transition:transform .2s}
.sound-choice input:checked{background:#e7c18a}
.sound-choice input:checked::after{transform:translateX(18px)}
@media(max-width:390px){.brand-name{font-size:16px}.top-buttons{gap:5px}.together-trigger{font-size:10px;padding:7px}.icon-button{width:29px;height:31px}.identity{gap:5px}.brand-mark{width:29px;height:29px}}
@media(max-height:710px){.together-sheet{max-height:90dvh}.qr-visual{width:160px;height:160px}}

/* Universal mobile overlay: avoids iOS native dialog inconsistencies. */
.together-backdrop{position:fixed;inset:0;z-index:5000;display:flex;align-items:center;justify-content:center;padding:calc(12px + env(safe-area-inset-top)) 12px calc(12px + env(safe-area-inset-bottom));background:#061727dc;backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)}
.together-backdrop[hidden]{display:none!important}
.together-backdrop .together-sheet{position:relative;flex:none;min-width:0;width:min(100%,440px);max-height:100%;overflow:auto;overscroll-behavior:contain;background:#15384c;color:#f8f1e2;border:1px solid #7897a3;border-radius:23px;box-shadow:0 24px 70px #000b;-webkit-overflow-scrolling:touch}
.together-backdrop .together-sheet h2{color:#f8f1e2}
.sound-test{width:100%;border:1px solid #7299a6;background:#ffffff15;color:#f8f1e2;border-radius:10px;padding:11px;cursor:pointer;font-weight:750;text-align:center}
.sound-test small{color:#a7c7cf;font-weight:400}
.sound-feedback{color:#ecc790;font-size:12px;min-height:19px;padding-top:5px}

.together-sheet [hidden], .together-sheet button[hidden]{display:none!important}