body:has(.sequence-screen){overflow:hidden}
.sequence-screen{position:fixed;inset:0;z-index:1000;height:100dvh;box-sizing:border-box;background-color:#09182f;background-size:cover;background-position:center;background-repeat:no-repeat;color:#f0f5ff;padding:12px;display:flex;flex-direction:column;gap:10px;overflow:hidden}
.sequence-screen *{box-sizing:border-box}
.seq-header{background:rgba(9,24,47,.82);border-radius:10px;padding:6px 8px;display:flex;justify-content:space-between;align-items:center;gap:12px;flex:none}
.seq-header h2{margin:0;font-size:clamp(16px,2vw,25px)}
.seq-header .qol-round-status{background:none;border:0;padding:0;margin:4px 0 0;font-size:13px;display:block}
.seq-actions{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.sequence-screen button{padding:7px 10px;font-size:13px}
.seq-body{display:grid;grid-template-columns:minmax(0,1fr) clamp(220px,23vw,340px);gap:12px;flex:1;min-height:0}
.seq-board{display:flex;flex-direction:column;min-height:0;min-width:0;background:rgba(9,24,47,.16);border-radius:12px;padding:8px}
.seq-grid-space{flex:1;min-height:0;display:grid;place-items:center;overflow:hidden}
.seq-grid{display:flex;flex-wrap:wrap;justify-content:center;align-content:center;gap:6px;width:calc(var(--seq-cols,1)*(var(--seq-size,44px) + 6px) - 6px);max-width:100%}
.sequence-screen .seq-tile{width:var(--seq-size,44px);height:var(--seq-size,44px);flex:0 0 var(--seq-size,44px);padding:0;aspect-ratio:1;min-width:0;min-height:0;border:1px solid #426494;border-radius:6px;box-shadow:none;background:#16345c;position:relative;overflow:hidden;display:grid;place-items:center;opacity:1;transform:none}
.sequence-screen .seq-tile:hover:not(:disabled){border-color:#fff;transform:none;box-shadow:none}
.seq-tile img,.seq-preview-image img{width:100%;height:100%;object-fit:contain}
.seq-tile.is-revealed{outline:none;border:2px solid #62dc9b;background:#163b36}
.seq-number{position:absolute;bottom:0;left:0;background:#071525e8;padding:1px 4px;font-size:11px;color:white;border-radius:0 4px 0 0}
.seq-question{font-size:clamp(18px,3vw,40px);font-weight:bold}
.seq-pages,.seq-team-pages{height:30px;flex:none;display:flex;align-items:center;justify-content:center;gap:12px;font-size:12px}
.seq-pages button,.seq-team-pages button{padding:2px 12px}
.seq-side{display:grid;grid-template-rows:minmax(80px,var(--seq-preview-share,40%)) minmax(0,1fr);gap:10px;min-height:0}
.seq-preview{display:flex;flex-direction:column;min-height:0;background:#102847;border-radius:10px;padding:8px;text-align:center;gap:4px;font-size:12px}
.seq-preview-image{flex:1;min-height:0;display:grid;place-items:center;overflow:hidden;font-size:40px}
.seq-scores{display:flex;flex-direction:column;min-height:0;background:#102847;border-radius:10px;padding:8px}
.seq-scores h3{font-size:15px;margin:0 0 6px}
.seq-team-list{flex:1;min-height:0;overflow:hidden}
.seq-team{display:flex;align-items:center;gap:7px;height:54px;margin-bottom:4px;padding:5px 7px;border:1px solid #385679;border-radius:7px;font-size:13px}
.seq-team>div{display:flex;flex-direction:column;flex:1;min-width:0}.seq-team b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.seq-team span{color:#ff98a9}.seq-team strong{white-space:nowrap}.seq-team button{padding:4px;font-size:11px}.seq-active{border:2px solid #62dc9b;background:#184332}
.sequence-screen [hidden]{display:none!important}
@media(max-width:760px){.sequence-screen{padding:6px;gap:6px}.seq-header{align-items:flex-start}.seq-header h2{font-size:16px}.seq-header .qol-round-status{font-size:11px}.seq-actions{max-width:45%;gap:3px}.seq-actions button{font-size:10px;padding:5px}.seq-body{display:flex;flex-direction:column-reverse;gap:6px}.seq-board{flex:1;padding:4px}.seq-side{flex:0 0 132px;display:grid;grid-template-columns:100px minmax(0,1fr);grid-template-rows:minmax(0,1fr);gap:6px}.seq-scores{padding:4px}.seq-scores h3{display:none}.seq-preview{padding:4px;font-size:10px}.seq-team{height:50px}.seq-team-pages{height:20px}.seq-pages{height:26px}}
@media(max-height:480px) and (min-width:761px){.seq-header h2{font-size:16px}.seq-header .qol-round-status{font-size:11px}.sequence-screen{padding:6px;gap:4px}.seq-side{grid-template-rows:minmax(60px,32%) minmax(0,1fr)}}

/* Membership is visible to host and players; host controls belong to each team. */
.seq-team{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;height:auto;min-height:54px;overflow:auto}
.seq-team .seq-members{display:block;color:#d7e9f4;white-space:normal;overflow-wrap:anywhere;font-size:11px;line-height:1.4;margin-top:4px}
.seq-team>.seq-team-controls{grid-column:1 / -1;display:flex;flex-direction:row;justify-content:flex-end;gap:8px}
.seq-team-controls button{min-width:45px}
@media(max-width:760px){.seq-side{flex-basis:180px}.seq-team{height:auto}}



.seq-tools{display:flex;align-items:center;justify-content:space-between;gap:10px;flex:none}.seq-tools:not(.seq-tools-host):has([hidden]){display:none}.seq-tools-host{background:#102847dd;border-radius:10px;padding:8px 12px}.seq-timer-controls{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.seq-timer-controls label{margin:0;font-size:12px}.seq-timer-controls input{width:75px;padding:6px}.seq-timer-controls small{color:#adc9de;font-size:11px}.seq-turn-clock{display:flex;gap:10px;align-items:center;background:#123f4f;border:1px solid #5fe6d3;border-radius:10px;padding:7px 14px;white-space:nowrap}.seq-turn-clock strong{font-size:26px;min-width:30px;text-align:center;font-variant-numeric:tabular-nums}.seq-turn-clock.expired{background:#5c2930;border-color:#ff987e}.seq-turn-clock span{font-size:13px}.seq-search{display:flex;flex-wrap:wrap;align-items:center;gap:8px;flex:none;padding:0 0 8px}.seq-search label{margin:0;font-size:12px}.seq-search input{flex:1;min-width:120px;max-width:360px;padding:8px}.seq-search small{color:#bbd2e5;font-size:11px}.seq-team .seq-joker{color:#9ee5d1;font-size:11px;margin:4px 0}.seq-team .seq-joker.used{color:#a9b4c5}.seq-team .seq-pass{margin-top:3px;font-size:11px;padding:4px;align-self:flex-start}.seq-name-editor{padding:8px;display:flex;flex-direction:column;gap:5px}.seq-name-editor label{font-size:12px;margin:0}.seq-name-editor input,.seq-name-editor textarea{width:100%;min-width:0;font-size:13px;padding:6px}.seq-name-editor button{font-size:12px;padding:6px}.seq-number{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(max-width:760px){.seq-tools{gap:5px;flex-wrap:wrap}.seq-tools-host{padding:6px}.seq-timer-controls{gap:4px}.seq-timer-controls small{display:none}.seq-turn-clock{padding:4px 8px}.seq-turn-clock strong{font-size:20px}.seq-search{gap:4px}.seq-search label{width:100%}.seq-search input{padding:5px}.seq-search small{width:100%}.seq-team .seq-pass{padding:3px}.seq-side{flex-basis:205px}}

.seq-side,.seq-scores,.seq-team-list{min-width:0}.seq-team .seq-pass{max-width:100%;white-space:normal}
