/* Scoped to the separate manual rosters; leaves Filling Now untouched. */
.roster-panel{box-sizing:border-box;position:relative;isolation:isolate;overflow:hidden;width:100%;padding:26px;border:1px solid #a882e65c;border-radius:25px;background:linear-gradient(135deg,#17112bf5,#090c1af5 70%);color:#f8f5ff;font-family:Inter,ui-sans-serif,system-ui,sans-serif;box-shadow:inset 0 0 40px #6542b41a,0 4px 24px #0003}
.roster-panel *{box-sizing:border-box}.roster-panel>:not(.roster-ink-dust){position:relative;z-index:1}
.roster-brand{display:flex;justify-content:space-between;gap:12px;font-size:11px;font-weight:800;letter-spacing:.19em}.roster-type{color:#d4aeff}
.roster-logo{height:116px;width:100%;display:flex;justify-content:center;margin:14px 0 8px}.roster-logo svg{max-width:80%;height:100%;filter:drop-shadow(0 4px 9px #0006)}
.roster-panel .roster-title{font-family:Georgia,serif;color:#ffe3a1;font-size:32px;line-height:1.1;text-align:center;margin:18px 0;overflow-wrap:anywhere;text-wrap:balance}
.roster-summary{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:12px;color:#c4badb;margin-bottom:16px}.roster-summary .roster-open{color:#7ceca7}.roster-summary .roster-full{color:#e7c176}
.roster-summary span:first-child{text-transform:uppercase;letter-spacing:.12em;font-weight:800}.roster-summary span:first-child::before{content:'';display:inline-block;width:7px;height:7px;border-radius:50%;background:currentColor;margin-right:8px;box-shadow:0 0 9px currentColor}
.roster-slots{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.roster-slot{position:relative;display:flex;align-items:center;gap:12px;min-height:83px;padding:12px 14px;border:1px solid rgba(var(--slot-rgb),.56);border-radius:17px;background:linear-gradient(115deg,rgba(var(--slot-rgb),.08),#0b0b180a);box-shadow:0 0 13px rgba(var(--slot-rgb),.12),inset 0 0 17px rgba(var(--slot-rgb),.055);overflow:hidden}
.roster-slot::after{content:'';position:absolute;inset:-80% -10% -80% 60%;background:radial-gradient(ellipse,rgba(var(--slot-rgb),.14),transparent 64%);transform:rotate(24deg);pointer-events:none}
.roster-number{flex:none;display:grid;place-items:center;width:35px;height:35px;border:1px solid rgba(var(--slot-rgb),.4);border-radius:10px;font-size:15px;font-weight:700;color:var(--slot-ink)}
.roster-slot-copy{min-width:0;flex:1;position:relative;z-index:1}.roster-ink-name{display:block;color:var(--slot-ink);font-size:10px;letter-spacing:.15em;text-transform:uppercase;font-weight:800}.roster-name{display:block;font-size:23px;line-height:1.17;margin-top:5px;overflow-wrap:anywhere}.roster-slot.is-open .roster-name{color:var(--slot-ink)}
.roster-slot.is-highlighted{box-shadow:0 0 16px #ffd37230,inset 0 0 0 1px #ffdf8455}.roster-star{color:#ffdc79;font-size:22px;flex:none;z-index:1}
.roster-ink-dust{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;border-radius:inherit}.roster-ink-dust::before,.roster-ink-dust::after{content:'';position:absolute;inset:-26px;background-repeat:repeat;pointer-events:none}
.roster-ink-dust::before{opacity:.4;background-image:radial-gradient(circle at 16% 19%,#f5bc42 0 1px,transparent 2px),radial-gradient(circle at 74% 31%,#34c7ff 0 1px,transparent 2px),radial-gradient(circle at 43% 76%,#f04dff 0 1px,transparent 2px);background-size:156px 176px,214px 198px,268px 246px;animation:roster-dust 20s -7s linear infinite alternate}
.roster-ink-dust::after{opacity:.22;background-image:radial-gradient(circle at 91% 23%,#bb9dff 0 1.5px,transparent 5px),radial-gradient(circle at 68% 87%,#f5bc42 0 1px,transparent 3px);background-size:270px 230px,370px 310px;animation:roster-dust 14s -3s ease-in-out infinite alternate-reverse}
@keyframes roster-dust{from{transform:translate(-10px,22px)}to{transform:translate(20px,-24px)}}
.roster-viewer{margin:0!important;background:transparent!important;color:white;font-family:system-ui,sans-serif}.roster-viewer #roster-output{width:min(940px,calc(100vw - 32px));margin:16px}.roster-viewer .roster-connection{position:relative;margin:8px 20px;font-size:12px;color:#f6d58c;background:#101020cc;border-radius:6px;padding:6px;width:fit-content}.roster-viewer [hidden]{display:none!important}
/* Admin controls inherit their own namespace, not the site's generic live forms. */
.roster-workspace{margin-top:30px;padding-top:24px;border-top:1px solid #c9afff30;min-width:0}.roster-workspace h3{font:700 25px/1.2 system-ui,sans-serif;letter-spacing:-.02em;margin:0 0 10px;color:#fff}.roster-workspace .roster-help{font:400 14px/1.6 system-ui,sans-serif;color:#c9bfdc;margin:0 0 16px}.roster-tabs{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0}.roster-workspace .roster-tabs button{min-height:46px;border:1px solid #9b78d16b;border-radius:12px;padding:10px 18px;background:#1b1730;color:#efe8ff;font:700 15px system-ui;cursor:pointer}.roster-tabs button[aria-selected=true]{background:#a77aee;color:#100b20}
.roster-editor-grid{display:grid;grid-template-columns:minmax(260px,.9fr) minmax(0,1.3fr);gap:24px;align-items:start}.roster-workspace .roster-form{display:grid;gap:14px;min-width:0}.roster-workspace .roster-form label{display:grid;gap:7px;font:600 14px/1.5 system-ui;color:#e7dff6}.roster-workspace .roster-form input,.roster-workspace .roster-form select{box-sizing:border-box;min-width:0;width:100%;min-height:46px;border:1px solid #a58bc244;border-radius:10px;padding:10px 12px;background:#0b0d1d;color:#fff;font:400 15px system-ui}.roster-workspace input:focus-visible,.roster-workspace select:focus-visible,.roster-workspace button:focus-visible{outline:2px solid #c9a1ff;outline-offset:3px}.roster-settings-row{display:grid;grid-template-columns:1fr 130px;gap:12px}.roster-workspace .roster-form .roster-check{display:flex;gap:10px;align-items:center}.roster-workspace .roster-check input{width:20px;min-height:20px;height:20px;flex:none;accent-color:#b58afa}
.roster-name-rows{display:grid;gap:9px}.roster-name-row{display:grid;grid-template-columns:90px minmax(0,1fr) 44px;gap:10px;align-items:center}.roster-name-row>label{color:var(--slot-ink)!important}.roster-workspace .roster-highlight{height:44px;width:44px;min-width:44px;padding:0;border:1px solid #ae93cf44;border-radius:10px;background:#171427;color:#88799c;font-size:21px;cursor:pointer}.roster-workspace .roster-highlight[aria-pressed=true]{color:#ffdb78;border-color:#ffdb7880}.roster-workspace button:disabled{opacity:.45;cursor:not-allowed}.roster-actions{display:flex;gap:10px;flex-wrap:wrap}.roster-workspace .roster-actions button{min-height:44px;padding:11px 16px;border:1px solid #aa86d866;border-radius:10px;background:#252036;color:#eee6ff;font:600 14px system-ui;cursor:pointer}.roster-workspace .roster-actions .roster-save{background:#b28aee;color:#160d26;font-weight:800}.roster-feedback{font:400 14px/1.5 system-ui!important;color:#d5c1ed;min-height:22px;margin:0!important}.roster-feedback.is-error{color:#ffb8b8}.roster-workspace .roster-preview-label{display:block;font:700 11px/1.5 system-ui;letter-spacing:.14em;text-transform:uppercase;color:#d3b4ff;margin-bottom:10px}.roster-preview{min-width:0;padding:12px;border:1px solid #9d77cb33;border-radius:19px;background:repeating-conic-gradient(#141223 0% 25%,#1b182b 0% 50%) 50% / 22px 22px}.roster-preview .roster-panel{padding:18px}.roster-preview .roster-logo{height:92px}.roster-preview .roster-title{font-size:25px}.roster-preview .roster-name{font-size:18px}.roster-preview .roster-slot{gap:9px;padding:10px;min-height:76px}.roster-preview .roster-number{width:28px;height:30px;font-size:12px}.roster-preview .roster-slots{gap:9px}.roster-overlay-link{display:grid;gap:9px;margin-top:16px}.roster-workspace .roster-overlay-link input{box-sizing:border-box;width:100%;min-width:0;min-height:44px;background:#0b0d1b;color:#d8caee;border:1px solid #9376ba55;border-radius:10px;padding:8px;font:12px ui-monospace,monospace}.roster-workspace .roster-overlay-link a{color:#cfb1fa;font-size:14px}.roster-workspace .roster-overlay-link button{min-height:44px;background:#262037;color:#fff;border:1px solid #a284c555;border-radius:10px;padding:8px 14px;font-size:14px;cursor:pointer}.roster-overlay-link .roster-help{font-size:12px}
@media(max-width:1100px){.roster-editor-grid{grid-template-columns:1fr}.roster-preview{max-width:850px}}
@media(max-width:580px){.roster-name-row{grid-template-columns:73px minmax(0,1fr) 40px;gap:7px}.roster-settings-row{grid-template-columns:1fr}.roster-preview .roster-slots{grid-template-columns:1fr}.roster-brand{font-size:9px}.roster-summary{font-size:11px}.roster-panel .roster-title{font-size:25px}.roster-viewer .roster-slots{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.roster-ink-dust::before,.roster-ink-dust::after{animation:none!important}}

/* Instance picker is only for the host controls, not the broadcast panel. */
.roster-workspace .roster-instance-picker{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:0 0 18px}
.roster-workspace .roster-instance-button{display:grid;gap:5px;min-width:0;min-height:70px;padding:12px;border:1px solid #a58bc255;border-radius:12px;background:#151226;color:#eee6ff;text-align:left;cursor:pointer}
.roster-workspace .roster-instance-button strong{font:700 15px/1.3 system-ui}
.roster-workspace .roster-instance-button small{font:400 12px/1.3 system-ui;color:#c1b2d9}
.roster-workspace .roster-instance-button[aria-pressed=true]{background:#352344;border-color:#c59bff;box-shadow:inset 0 0 0 1px #c59bff44}
.roster-workspace .roster-editing-label{font:700 17px/1.4 system-ui;color:#e8d7ff;margin:0 0 18px}
@media(max-width:580px){.roster-workspace .roster-instance-picker{grid-template-columns:repeat(2,minmax(0,1fr))}}


/* Single-column broadcast names. Keep the old grid's exact minimum footprint:
   83px per paired row + 12px gaps (76px / 9px in the dashboard preview).
   The transparent 1000 x 1000 browser source and all outer panel rules stay as-is. */
.roster-panel.roster-readable {
  --roster-old-rows: var(--roster-paired-rows);
  --roster-old-row-height: 83px;
  --roster-old-gap: 12px;
  --roster-name-size: 36px;
}
.roster-preview .roster-panel.roster-readable {
  --roster-old-row-height: 76px;
  --roster-old-gap: 9px;
  --roster-name-size: 28px;
}
.roster-panel.roster-readable[data-roster-slots="2"] { --roster-name-size: 32px; }
.roster-preview .roster-panel.roster-readable[data-roster-slots="2"] { --roster-name-size: 28px; }
.roster-panel.roster-readable .roster-slots {
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: repeat(var(--roster-slot-count), minmax(0, 1fr));
  height: calc(var(--roster-old-rows) * var(--roster-old-row-height) + (var(--roster-old-rows) - 1) * var(--roster-old-gap));
  gap: 5px;
}
.roster-panel.roster-readable .roster-slot {
  min-height: 0;
  height: 100%;
  padding: 1px 12px;
  gap: 12px;
  border-radius: 10px;
}
.roster-panel.roster-readable .roster-number { width: 28px; height: 28px; font-size: 14px; border-radius: 8px; }
.roster-panel.roster-readable .roster-slot-copy { display: flex; align-items: center; gap: 14px; }
.roster-panel.roster-readable .roster-ink-name { flex: 0 0 88px; font-size: 12px; letter-spacing: .08em; }
.roster-panel.roster-readable[data-roster-format="pack"] .roster-ink-name { display: none; }
.roster-panel.roster-readable .roster-name {
  flex: 1;
  min-width: 0;
  margin: 0;
  font-size: var(--roster-name-size);
  font-weight: 800;
  line-height: 1;
  letter-spacing: -.02em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.roster-panel.roster-readable .roster-star { font-size: 20px; }
.roster-preview .roster-panel.roster-readable .roster-ink-name { flex-basis: 72px; font-size: 10px; }
.roster-preview .roster-panel.roster-readable .roster-slot-copy { gap: 10px; }
/* Small screens already used one column; retain that existing taller footprint. */
@media (max-width: 580px) {
  .roster-panel.roster-readable { --roster-old-rows: var(--roster-slot-count); }
  .roster-panel.roster-readable .roster-slot { padding-inline: 8px; gap: 8px; }
  .roster-panel.roster-readable .roster-slot-copy { gap: 8px; }
  .roster-panel.roster-readable .roster-ink-name { flex-basis: 66px; font-size: 10px; }
  .roster-panel.roster-readable .roster-number { width: 24px; height: 26px; font-size: 12px; }
}

/* Approved one-third-size layout; shared by all eight sources and their previews. */
.roster-panel.roster-readable.roster-compact {
  width:313.3333px;max-width:100%;height:var(--compact-height,191px);padding:8px;border-radius:11px;
  display:grid;grid-template-rows:34px minmax(0,1fr);gap:5px;
  box-shadow:inset 0 0 20px #6542b41a,0 4px 18px #0003;
}
.roster-panel.roster-readable.roster-compact .compact-header {display:grid;grid-template-columns:48px minmax(0,1fr) 27px;gap:6px;align-items:center;min-width:0}
.roster-panel.roster-readable.roster-compact .roster-logo {height:32px;width:48px;margin:0;display:flex;align-items:center;justify-content:center}
.roster-panel.roster-readable.roster-compact .roster-logo svg {width:100%;max-width:100%;height:32px;filter:drop-shadow(0 2px 4px #0006)}
.roster-panel.roster-readable.roster-compact .compact-copy{min-width:0}
.roster-panel.roster-readable.roster-compact .roster-brand{font-size:6.7px;line-height:1;letter-spacing:.13em;margin:0 0 3px;opacity:.72}
.roster-panel.roster-readable.roster-compact .roster-type{display:none}
.roster-panel.roster-readable.roster-compact .roster-title{font:700 13px/1.03 Georgia,serif;letter-spacing:0;text-align:left;margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
.roster-panel.roster-readable.roster-compact .compact-counter{font:700 10px/1.25 system-ui,sans-serif;text-align:center;color:#c9bfdc;white-space:nowrap}
.roster-panel.roster-readable.roster-compact .compact-counter::before{content:'';display:block;width:4px;height:4px;background:#70eaa8;border-radius:50%;margin:0 auto 4px;box-shadow:0 0 6px #70eaa877}
.roster-panel.roster-readable.roster-compact .roster-slots{height:auto;grid-template-columns:minmax(0,1fr);grid-template-rows:repeat(var(--roster-slot-count),minmax(0,1fr));gap:2px;min-height:0}
.roster-panel.roster-readable.roster-compact .roster-slot{min-height:0;height:100%;padding:0 5px;gap:5px;border-radius:5px;box-shadow:0 0 7px rgba(var(--slot-rgb),.09),inset 0 0 8px rgba(var(--slot-rgb),.04)}
.roster-panel.roster-readable.roster-compact .roster-number{width:15px;height:15px;border-radius:4px;font-size:8px;border-color:rgba(var(--slot-rgb),.27);flex:none}
.roster-panel.roster-readable.roster-compact .roster-slot-copy{display:flex;align-items:center;gap:6px;min-width:0}
.roster-panel.roster-readable.roster-compact .roster-ink-name{flex:0 0 51px;font-size:7px;line-height:1;letter-spacing:.04em}
.roster-panel.roster-readable.roster-compact .roster-name{font-size:var(--compact-name-size,18px);font-weight:800;line-height:1;letter-spacing:-.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.roster-panel.roster-readable.roster-compact .roster-star{font-size:12px;line-height:1}
.roster-panel.roster-readable.roster-compact .roster-ink-dust::before{opacity:.35;background-size:95px 110px,160px 128px,210px 198px}
.roster-panel.roster-readable.roster-compact .roster-ink-dust::after{opacity:.15;background-size:140px 150px,190px 200px}

.roster-panel.roster-readable.roster-compact .roster-logo {font:800 12px/1 system-ui,sans-serif;color:#ffe3a1}
.roster-panel.roster-readable.roster-compact .compact-counter.is-full::before {background:#e7c176;box-shadow:0 0 6px #e7c17677}
/* Keep the 1000 x 1000 Meld source canvas and origin. Only its visible panel shrinks. */
.roster-viewer #roster-output {width:min(313.3333px,calc(100vw - 32px))}
.roster-preview {display:flex;justify-content:center;align-items:flex-start}


.roster-purchase-connection { display:flex; flex-wrap:wrap; gap:10px; padding:16px; margin:16px 0; border:1px solid rgba(191,140,255,.3); border-radius:12px; background:rgba(34,20,53,.6); }
.roster-purchase-connection h4,.roster-purchase-connection p { flex-basis:100%; margin:0; }
.roster-purchase-connection select { flex:1 1 260px; min-width:0; max-width:100%; padding:12px; color:#f5edff; background:#20162e; border:1px solid #685077; border-radius:8px; }
.roster-purchase-connection button { min-height:44px; }

/* Purchase provenance: subtle name tint, without changing each ink's identity. */
.roster-panel .roster-slot.is-automatic .roster-name { color:#bde6f7; text-shadow:0 0 8px rgba(103,192,226,.18); }