:root {
  color-scheme: dark;
  --canvas: #0b1018;
  --surface: rgba(19, 27, 39, .88);
  --surface-raised: rgba(28, 38, 53, .9);
  --surface-soft: rgba(31, 43, 59, .65);
  --line: rgba(191, 210, 233, .12);
  --line-strong: rgba(191, 210, 233, .22);
  --text: #eff5fc;
  --muted: #9eacbf;
  --faint: #6f7e92;
  --blue: #87baff;
  --blue-strong: #579cff;
  --mint: #6ed8ba;
  --amber: #ffcf7d;
  --red: #ff969c;
  font-family: "Segoe UI Variable", "Segoe UI", sans-serif;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

* { box-sizing: border-box; }
select {
  color-scheme: dark;
}
select option,
select optgroup {
  color: #e4edf8;
  background-color: #1c2635;
}
select option:checked {
  color: #f4f8ff;
  background-color: #31547a;
}
body { margin: 0; min-width: 320px; min-height: 100vh; color: var(--text); background: var(--canvas); overflow-x: hidden; }
button, input, textarea { font: inherit; }
button { color: inherit; }
.ambient { position: fixed; pointer-events: none; filter: blur(100px); opacity: .16; z-index: 0; border-radius: 50%; }
.ambient-a { width: 380px; height: 380px; top: -140px; left: 17%; background: #316cc7; }
.ambient-b { width: 300px; height: 340px; right: -120px; bottom: 3%; background: #315b79; opacity: .1; }
.app-shell { position: relative; z-index: 1; width: min(1480px, calc(100% - 72px)); margin: 0 auto; }
.topbar { height: 84px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(192, 210, 233, .1); }
.brand { display: inline-flex; align-items: center; gap: 13px; text-decoration: none; color: inherit; }
.brand > span:last-child { display: grid; gap: 3px; }
.brand strong { font-size: 15px; font-weight: 650; letter-spacing: .01em; }
.brand small { font-size: 9px; letter-spacing: .18em; color: var(--faint); font-weight: 700; }
.brand-mark { width: 34px; height: 34px; display: flex; align-items: flex-end; justify-content: center; gap: 3px; padding: 8px; border: 1px solid rgba(135, 186, 255, .24); border-radius: 11px; background: linear-gradient(145deg, rgba(86, 150, 239, .24), rgba(75, 115, 172, .08)); box-shadow: inset 0 1px rgba(255,255,255,.1); }
.brand-mark span { display: block; width: 4px; border-radius: 3px; background: #a9d0ff; }
.brand-mark span:nth-child(1) { height: 9px; opacity: .75; }.brand-mark span:nth-child(2) { height: 15px; }.brand-mark span:nth-child(3) { height: 11px; opacity: .85; }
.topbar-right { display: flex; align-items: center; gap: 14px; }
.identity-badge { display: flex; align-items: center; gap: 8px; font-size: 11px; color: #bdc9d8; border: 1px solid var(--line); background: rgba(20, 30, 42, .68); border-radius: 99px; padding: 8px 12px; }
.identity-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--blue); box-shadow: 0 0 12px rgba(135,186,255,.6); }
.icon-button { display: inline-grid; place-items: center; border: 1px solid var(--line); background: rgba(24, 34, 47, .66); color: #aebbd0; width: 36px; height: 36px; border-radius: 11px; cursor: pointer; transition: .16s ease; }
.icon-button:hover { background: rgba(47, 66, 91, .72); border-color: var(--line-strong); color: white; }
.icon-button svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.icon-button.small { width: 30px; height: 30px; border-radius: 9px; }
.icon-button:disabled { opacity: .45; cursor: not-allowed; }
.spinning svg { animation: spin .8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.welcome-row { display: flex; justify-content: space-between; align-items: flex-end; gap: 28px; padding: 44px 0 28px; }
.eyebrow { margin: 0 0 9px; color: #7f91a9; font-size: 9px; font-weight: 750; letter-spacing: .17em; }
h1 { margin: 0; font-size: clamp(28px, 3vw, 37px); line-height: 1.12; letter-spacing: -.045em; font-weight: 620; }
.welcome-copy { margin: 10px 0 0; color: var(--muted); font-size: 13px; }
.welcome-actions { display: flex; gap: 9px; margin-top: 15px; }
.welcome-actions [hidden] { display: none; }
.connection-card { display: flex; align-items: center; gap: 11px; min-width: 280px; border: 1px solid var(--line); border-radius: 14px; padding: 11px 13px; background: linear-gradient(130deg, rgba(26, 37, 52, .8), rgba(16, 24, 35, .76)); box-shadow: 0 10px 30px rgba(0, 0, 0, .12); }
.connection-indicator { width: 8px; height: 8px; flex: 0 0 auto; border-radius: 50%; background: #78879a; }
.connection-card.connected .connection-indicator { background: var(--mint); box-shadow: 0 0 14px rgba(110,216,186,.6); }
.connection-card span:nth-child(2) { display: grid; gap: 2px; min-width: 0; flex: 1; }
.connection-card strong { font-size: 11px; font-weight: 650; }
.connection-card small { color: var(--faint); font-size: 10px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 210px; }
.text-button { color: var(--blue); background: transparent; border: 0; padding: 5px; font-size: 10px; font-weight: 650; cursor: pointer; }
.text-button:hover { color: #bedcff; }
.workspace { display: grid; grid-template-columns: minmax(260px, 315px) minmax(0, 1fr); align-items: stretch; gap: 16px; min-height: 610px; }
.panel { border: 1px solid var(--line); border-radius: 18px; background: linear-gradient(145deg, rgba(24, 34, 48, .88), rgba(16, 24, 35, .93)); box-shadow: 0 22px 64px rgba(0, 0, 0, .19), inset 0 1px rgba(255,255,255,.025); }
.roster-panel { display: flex; flex-direction: column; min-height: 610px; overflow: hidden; }
.panel-heading { display: flex; align-items: center; justify-content: space-between; }
.roster-heading { padding: 21px 20px 17px; }
.roster-heading .eyebrow { margin-bottom: 5px; }
h2 { font-size: 17px; line-height: 1.3; letter-spacing: -.02em; font-weight: 620; margin: 0; }
.roster-summary { display: flex; align-items: center; justify-content: space-between; margin: 0 20px; padding: 10px 0 12px; color: var(--muted); border-top: 1px solid var(--line); font-size: 10px; }
.live-label { display: flex; align-items: center; gap: 6px; color: #8191a5; }
.live-label span { width: 6px; height: 6px; border-radius: 50%; background: #546579; }
.user-presence-indicator { display: inline-block; width: 9px; height: 9px; flex: 0 0 9px; border: 1px solid rgba(255, 255, 255, .15); border-radius: 50%; }
.user-presence-indicator.logged-in { background: #38c978; box-shadow: 0 0 7px rgba(56, 201, 120, .34); }
.user-presence-indicator.not-logged-in { background: #e35b66; box-shadow: 0 0 7px rgba(227, 91, 102, .28); }
.user-presence-indicator.unknown { background: #77869a; }
.user-list { flex: 1; overflow-y: auto; min-height: 280px; padding: 0 10px 12px; }
.user-row { width: 100%; display: flex; align-items: center; gap: 8px; text-align: left; border: 1px solid transparent; border-radius: 12px; background: transparent; padding: 11px 10px; cursor: pointer; color: var(--text); transition: background .15s ease, border-color .15s ease; }
.user-row:hover { background: rgba(62, 80, 103, .18); }
.user-row.selected { border-color: rgba(112, 170, 242, .23); background: linear-gradient(105deg, rgba(63, 116, 187, .22), rgba(48, 72, 102, .16)); box-shadow: inset 2px 0 #78b1fa; }
.user-row-avatar,.user-avatar { display: grid; place-items: center; flex: 0 0 auto; width: 34px; height: 34px; border-radius: 11px; background: linear-gradient(145deg, rgba(100, 158, 230, .26), rgba(67, 97, 140, .18)); color: #bdd9ff; border: 1px solid rgba(150, 191, 242, .17); font-size: 12px; font-weight: 700; }
.user-row > .user-presence-indicator { margin-left: 2px; }
.user-row-copy { min-width: 0; display: grid; gap: 4px; flex: 1; }
.user-row-copy strong { font-size: 11px; font-weight: 620; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.user-row-copy small { color: #8090a4; font-size: 9px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.user-row-arrow { width: 14px; height: 14px; color: #708096; }
.roster-footnote { display: flex; align-items: flex-start; gap: 8px; padding: 14px 17px; border-top: 1px solid var(--line); color: #8594a7; font-size: 9px; line-height: 1.5; background: rgba(10, 16, 24, .24); }
.info-icon { display: grid; place-items: center; width: 14px; height: 14px; flex: 0 0 auto; border: 1px solid #63758c; border-radius: 50%; color: #a5b6ca; font-size: 9px; font-family: Georgia,serif; font-style: italic; }
.editor-panel { min-width: 0; min-height: 610px; padding: 25px 28px; }
.editor-empty { min-height: 555px; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; padding: 24px; }
.editor-empty h2 { font-size: 20px; margin-bottom: 8px; }
.editor-empty > p:last-child { max-width: 330px; margin: 0; color: var(--muted); font-size: 12px; line-height: 1.6; }
.empty-illustration { position: relative; width: 120px; height: 108px; margin-bottom: 25px; display: grid; place-items: center; }
.orbit { position: absolute; border: 1px solid rgba(129, 176, 235, .12); border-radius: 50%; transform: rotate(-27deg); }
.orbit-one { width: 104px; height: 58px; }.orbit-two { width: 78px; height: 94px; transform: rotate(31deg); }
.person-mark { display: grid; place-items: center; width: 62px; height: 62px; border-radius: 21px; background: radial-gradient(circle at 30% 20%, rgba(112, 166, 235, .27), rgba(48, 72, 104, .12)); border: 1px solid rgba(136, 184, 242, .2); box-shadow: 0 14px 42px rgba(35,91,160,.1), inset 0 1px rgba(255,255,255,.08); }
.person-mark i { width: 14px; height: 14px; border-radius: 50%; background: #83b8fa; opacity: .85; margin-top: 2px; }
.person-mark b { width: 28px; height: 13px; border-radius: 14px 14px 8px 8px; background: #719fd7; opacity: .72; margin-top: -3px; }
.hidden { display: none !important; }
.editor-content { display: block; }
.user-header { display: flex; align-items: center; gap: 14px; }
.user-avatar { width: 46px; height: 46px; border-radius: 14px; font-size: 16px; }
.user-title-wrap { min-width: 0; flex: 1; }
.user-title-wrap .eyebrow { margin-bottom: 4px; }
.user-title-wrap h2 { font-size: 20px; margin-bottom: 3px; }
.user-sid { max-width: 560px; color: #7f90a5; font: 10px/1.4 ui-monospace, "Cascadia Code", Consolas, monospace; overflow-wrap: anywhere; }
.policy-version { align-self: flex-start; color: #9abce4; border: 1px solid rgba(122, 171, 230, .2); background: rgba(65, 107, 158, .15); padding: 6px 9px; border-radius: 8px; font-size: 9px; white-space: nowrap; }
.identity-meta { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 12px; margin: 19px 0 28px; padding: 12px 0 17px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.identity-meta div { display: grid; gap: 5px; min-width: 0; }
.identity-meta span { color: var(--faint); font-size: 9px; }
.identity-meta strong { color: #c2cddc; font-size: 10px; font-weight: 580; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.policy-intro { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 14px; }
.policy-intro .eyebrow { margin-bottom: 4px; }
.policy-intro h3 { margin: 0; font-size: 15px; font-weight: 620; }
.unrestricted-pill { display: inline-flex; align-items: center; gap: 7px; color: #8ec9b9; border: 1px solid rgba(93, 190, 160, .2); background: rgba(60, 139, 116, .12); border-radius: 99px; padding: 6px 9px; font-size: 9px; white-space: nowrap; }
.unrestricted-pill span { width: 6px; height: 6px; border-radius: 50%; background: var(--mint); }
.unrestricted-pill.restricted { color: var(--amber); border-color: rgba(255, 207, 125, .22); background: rgba(255, 186, 73, .08); }
.unrestricted-pill.restricted span { background: var(--amber); }
.editor-grid { display: grid; grid-template-columns: 1fr; gap: 12px; }
.rule-card { min-width: 0; border: 1px solid var(--line); border-radius: 14px; background: linear-gradient(150deg, rgba(26, 37, 52, .7), rgba(16, 24, 35, .58)); padding: 15px; }
.rule-heading { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.rule-heading-with-action { margin-bottom: 14px; }
.rule-heading-with-action > span:nth-child(2) { flex: 1; }
.scope-pause,.app-pause { display: inline-grid; place-items: center; flex: 0 0 auto; width: 38px; height: 36px; border: 1px solid rgba(255, 207, 125, .42); border-radius: 10px; background: rgba(110, 72, 23, .22); color: #ffdfaa; cursor: pointer; transition: .15s ease; }
.scope-pause:hover:not(:disabled),.app-pause:hover:not(:disabled) { background: rgba(138, 91, 29, .38); border-color: rgba(255, 207, 125, .65); }
.scope-pause.resume,.app-pause.paused { color: #bdf0df; border-color: rgba(110, 216, 186, .42); background: rgba(28, 85, 68, .23); }
.scope-pause.resume:hover:not(:disabled),.app-pause.paused:hover:not(:disabled) { background: rgba(36, 111, 88, .35); border-color: rgba(110, 216, 186, .64); }
.scope-pause:disabled,.app-pause:disabled { opacity: .45; cursor: not-allowed; }
.scope-pause svg,.app-pause svg { width: 15px; height: 15px; fill: currentColor; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.application-rule-list { display: grid; gap: 8px; margin: 0 0 12px; }
.application-rule-row { display: flex; align-items: center; gap: 12px; min-width: 0; border: 1px solid rgba(191, 210, 233, .11); border-radius: 11px; padding: 11px 12px; background: rgba(10, 16, 24, .28); }
.application-rule-copy { display: grid; gap: 4px; flex: 1; min-width: 0; }
.application-rule-copy strong { font-size: 11px; font-weight: 620; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.application-rule-copy small { color: var(--faint); font-size: 9px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.application-state { color: #a6d9c9; border: 1px solid rgba(110, 216, 186, .18); background: rgba(60, 139, 116, .1); border-radius: 99px; padding: 5px 8px; font-size: 9px; white-space: nowrap; }
.application-state.paused { color: var(--amber); border-color: rgba(255, 207, 125, .2); background: rgba(255, 186, 73, .08); }
.application-empty { margin: 0 0 12px; border: 1px dashed rgba(191, 210, 233, .16); border-radius: 10px; padding: 15px; color: var(--faint); font-size: 10px; }
.rule-heading > span:nth-child(2) { display: grid; gap: 3px; }
.rule-heading strong { font-size: 11px; font-weight: 640; }
.rule-heading small { color: var(--faint); font-size: 9px; }
.rule-icon { display: grid; place-items: center; width: 29px; height: 29px; border-radius: 9px; font-size: 17px; }
.time-icon { color: var(--amber); background: rgba(219, 164, 67, .12); }.app-icon { color: var(--blue); background: rgba(80, 143, 225, .13); font-size: 14px; }
textarea { display: block; width: 100%; min-height: 208px; resize: vertical; border: 1px solid rgba(175, 197, 224, .12); border-radius: 10px; padding: 12px; background: rgba(8, 13, 20, .62); color: #cfe2fa; outline: none; font: 10px/1.65 ui-monospace, "Cascadia Code", Consolas, monospace; tab-size: 2; }
textarea:focus { border-color: rgba(112, 171, 244, .48); box-shadow: 0 0 0 3px rgba(69, 135, 218, .08); }
textarea.invalid,textarea.invalid:focus { border-color: rgba(255, 101, 111, .96); box-shadow: 0 0 0 2px rgba(255, 101, 111, .28), 0 0 13px rgba(255, 70, 82, .42); }
.rule-help { min-height: 28px; margin: 9px 1px 0; color: #8291a5; font-size: 9px; line-height: 1.45; }
.rule-help code { color: #aabdd4; font-size: 9px; }
.editor-actions { display: flex; align-items: center; gap: 9px; margin-top: 17px; }
.save-hint { margin-right: auto; color: var(--faint); font-size: 9px; }
.primary-button,.secondary-button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 36px; border-radius: 10px; padding: 0 13px; font-size: 10px; font-weight: 650; cursor: pointer; transition: .16s ease; }
.primary-button { border: 1px solid rgba(141, 190, 252, .45); color: #f4f8ff; background: linear-gradient(135deg, #4187d5, #3375c2); box-shadow: inset 0 1px rgba(255,255,255,.16), 0 6px 18px rgba(37, 104, 186, .17); }
.primary-button:hover:not(:disabled) { background: linear-gradient(135deg, #5198e8, #3f81cc); border-color: rgba(172, 210, 255, .65); transform: translateY(-1px); }
.primary-button:disabled { opacity: .55; cursor: not-allowed; }
.primary-button svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.secondary-button { border: 1px solid var(--line-strong); background: rgba(29, 41, 56, .48); color: #b7c5d7; }
.secondary-button:hover { background: rgba(50, 67, 89, .5); color: white; }
.empty-state { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 8px; padding: 44px 23px; color: var(--muted); }
.empty-state strong { color: #c4d0df; font-size: 11px; font-weight: 620; }
.empty-state small { color: var(--faint); font-size: 10px; line-height: 1.5; }
.empty-icon { color: #8298b5; font-size: 27px; transform: rotate(-20deg); }
footer { display: flex; justify-content: space-between; gap: 20px; padding: 18px 2px 28px; color: #647286; font-size: 9px; }
.connection-dialog { width: min(470px, calc(100vw - 30px)); max-width: none; border: 1px solid rgba(178, 199, 226, .18); border-radius: 18px; padding: 24px; color: var(--text); background: linear-gradient(145deg, #182333, #101925); box-shadow: 0 28px 100px rgba(0,0,0,.6), inset 0 1px rgba(255,255,255,.04); }
.connection-dialog::backdrop { background: rgba(3, 7, 12, .7); backdrop-filter: blur(6px); }
.dialog-close-row { display: flex; justify-content: flex-end; margin: -10px -10px 12px; }
.dialog-close-row button { color: var(--muted); font-size: 20px; }
.connection-dialog h2 { font-size: 21px; }
.dialog-copy { color: var(--muted); font-size: 11px; line-height: 1.6; margin: 8px 0 20px; }
.connection-dialog:not(.schedule-dialog) label { display: block; margin: 15px 0 7px; color: #b7c5d7; font-size: 10px; font-weight: 620; }
.connection-dialog:not(.schedule-dialog) input { display: block; width: 100%; border: 1px solid var(--line-strong); border-radius: 10px; padding: 10px 12px; outline: none; background: rgba(7, 12, 19, .56); color: var(--text); font-size: 11px; }
.connection-dialog:not(.schedule-dialog) input:focus { border-color: rgba(112, 171, 244, .5); box-shadow: 0 0 0 3px rgba(69, 135, 218, .09); }
.access-override-duration { display: block; width: 100%; min-height: 42px; border: 1px solid var(--line-strong); border-radius: 10px; padding: 0 12px; color: var(--text); background: rgba(7, 12, 19, .56); font-size: 12px; }
.access-override-duration:focus { outline: none; border-color: rgba(112, 171, 244, .5); box-shadow: 0 0 0 3px rgba(69, 135, 218, .09); }
.transport-warning { padding: 9px 10px; border: 1px solid rgba(247, 184, 86, .23); border-radius: 9px; background: rgba(173, 121, 43, .11); color: #e6c487; font-size: 10px; line-height: 1.5; }
.dialog-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 22px; }
.security-dialog { max-height: min(88vh, 860px); overflow: auto; }
.enrollment-code-row { display: flex; align-items: stretch; gap: 9px; }
.enrollment-code-row input { min-width: 0; flex: 1; color: #e7f1ff; font: 14px/1.4 ui-monospace, "Cascadia Code", Consolas, monospace; letter-spacing: .02em; }
.enrollment-expiry { margin: 10px 0; color: #b9c8dc; font-size: 12px; }
.enrollment-instructions { margin: 16px 0 0; color: var(--muted); font-size: 12px; line-height: 1.55; }
.enrollment-instructions code { color: #dbe9ff; font-size: 12px; }
.mfa-panel { margin-top: 16px; padding-top: 15px; border-top: 1px solid var(--line); color: var(--muted); font-size: 11px; line-height: 1.6; }
.mfa-panel > p { margin: 0 0 12px; }
.mfa-panel > .secondary-button, .mfa-panel > .primary-button { margin-top: 13px; }
.mfa-qr { display: block; width: min(240px, 70vw); height: auto; margin: 17px auto; padding: 10px; border-radius: 12px; background: white; }
.mfa-manual-key { overflow-wrap: anywhere; }
.mfa-manual-key code, .mfa-recovery-codes code { color: #dbe9ff; font: 12px/1.6 ui-monospace, "Cascadia Code", Consolas, monospace; letter-spacing: .06em; }
.mfa-management-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.danger-button { color: #ffc0bd; border-color: rgba(255, 132, 127, .25); }
.mfa-recovery-codes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 16px; margin: 12px 0; padding: 14px 18px; border: 1px solid var(--line); border-radius: 11px; background: rgba(8, 13, 20, .45); list-style: none; }
.mfa-saved-check { display: flex !important; align-items: center; gap: 9px; margin: 12px 0 !important; }
.mfa-saved-check input { width: auto; }
@media (max-width: 520px) { .mfa-recovery-codes { grid-template-columns: 1fr; } }
.message-dialog .message-copy { white-space: pre-line; overflow-wrap: anywhere; }
.message-dialog.error .eyebrow { color: #ffc0bd; }
.notice-toast { position: fixed; z-index: 100; top: max(12px, env(safe-area-inset-top)); left: 50%; display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; width: min(560px, calc(100vw - 24px)); padding: 15px 16px 15px 18px; transform: translateX(-50%); border: 1px solid rgba(178, 199, 226, .2); border-radius: 14px; color: var(--text); background: linear-gradient(145deg, rgba(30, 43, 60, .97), rgba(17, 27, 41, .97)); box-shadow: 0 14px 40px rgba(0, 0, 0, .35), inset 0 1px rgba(255,255,255,.04); backdrop-filter: blur(18px); }
.notice-toast[hidden] { display: none; }
.notice-toast-copy { min-width: 0; }
.notice-toast-copy .eyebrow { margin: 0 0 6px; color: #8fa8c5; }
.notice-toast-copy strong { display: block; color: #edf4fc; font-size: 15px; font-weight: 640; }
.notice-toast-copy > p:last-child { margin: 5px 0 0; color: #b2c1d3; font-size: 12px; line-height: 1.5; overflow-wrap: anywhere; }
.notice-toast-dismiss { flex: 0 0 auto; display: grid; place-items: center; width: 32px; height: 32px; padding: 0; border: 1px solid rgba(178, 199, 226, .18); border-radius: 9px; color: #b6c5d8; background: rgba(255,255,255,.04); font: 22px/1 "Segoe UI", sans-serif; cursor: pointer; }
.notice-toast-dismiss:hover,.notice-toast-dismiss:focus-visible { color: white; background: rgba(255,255,255,.1); outline: 2px solid rgba(124, 185, 255, .7); outline-offset: 1px; }
.schedule-dialog { width: min(980px, calc(100vw - 32px)); max-width: none; max-height: min(90dvh, 900px); padding: 0; overflow: hidden; display: none; grid-template-rows: auto auto minmax(0, 1fr) auto; }
.schedule-dialog[open] { display: grid; }
.schedule-dialog-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 22px 24px 0; }
.schedule-dialog-header .eyebrow { margin: 0 0 5px; }
.schedule-dialog-header h2 { margin: 0; }
.schedule-dialog-header .icon-button { flex: 0 0 auto; color: var(--muted); font-size: 24px; }
.schedule-dialog > .dialog-copy { margin: 8px 24px 16px; }
.schedule-dialog-content { min-height: 0; overflow: auto; overscroll-behavior: contain; padding: 0 24px 20px; }
.schedule-dialog-content .schedule-editor-host.hidden { display: none; }
.schedule-dialog-footer { position: sticky; bottom: 0; display: flex; align-items: center; gap: 10px; margin: 0; padding: 12px 24px calc(12px + env(safe-area-inset-bottom)); border-top: 1px solid var(--line); background: rgba(15, 23, 34, .97); backdrop-filter: blur(16px); }
.schedule-dialog-footer .save-hint { flex: 1; }
.schedule-dialog-footer .primary-button,.schedule-dialog-footer .secondary-button { min-height: 42px; }
.discovered-app-heading { position: sticky; top: 0; z-index: 4; padding: 5px 0; background: rgba(14, 21, 31, .97); }
.app-inventory-tools { position: sticky; top: 37px; z-index: 3; display: grid; grid-template-columns: minmax(160px, 2fr) repeat(3, minmax(105px, 1fr)); align-items: end; gap: 8px; padding: 9px; border: 1px solid rgba(135, 186, 255, .15); border-radius: 10px; background: rgba(17, 26, 38, .96); box-shadow: 0 6px 18px rgba(0, 0, 0, .16); backdrop-filter: blur(14px); }
.app-inventory-search,.app-inventory-select { display: grid; gap: 4px; min-width: 0; color: #91a3ba; font-size: 10px; }
.app-inventory-search input,.app-inventory-select select { width: 100%; min-width: 0; min-height: 36px; border: 1px solid rgba(175, 197, 224, .16); border-radius: 8px; padding: 0 9px; outline: none; color: #e4edf8; background: rgba(7, 12, 19, .62); font: 12px "Segoe UI Variable", "Segoe UI", sans-serif; }
.app-inventory-search input:focus,.app-inventory-select select:focus { border-color: rgba(112, 171, 244, .5); box-shadow: 0 0 0 3px rgba(69, 135, 218, .09); }
.app-inventory-search input::placeholder { color: #718199; }
.app-inventory-pager { display: flex; align-items: center; justify-content: flex-end; gap: 12px; color: #91a3ba; font-size: 11px; }
.app-inventory-page-controls { display: flex; align-items: center; gap: 8px; }
.app-inventory-page-controls button { min-height: 34px; border: 1px solid rgba(135, 186, 255, .2); border-radius: 8px; padding: 0 10px; color: #c5deff; background: rgba(32, 53, 75, .45); font: inherit; cursor: pointer; }
.app-inventory-page-controls button:disabled { opacity: .45; cursor: default; }
.app-inventory-page-controls span { white-space: nowrap; }
.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; }

@media (max-width: 940px) {
  .app-shell { width: min(100% - 36px, 760px); }
  .workspace { grid-template-columns: 1fr; }
  .roster-panel { min-height: 330px; max-height: 400px; }
  .user-list { min-height: 150px; }
  .editor-empty { min-height: 440px; }
}
@media (max-width: 640px) {
  .app-shell { width: calc(100% - 24px); }
  .topbar { height: 70px; }.brand-mark { width: 31px; height: 31px; }.brand strong { font-size: 13px; }
  .identity-badge { font-size: 0; padding: 9px; }.identity-dot { width: 8px; height: 8px; }
  .welcome-row { align-items: flex-start; flex-direction: column; padding: 30px 0 20px; gap: 18px; }
  .connection-card { width: 100%; }
  .workspace { gap: 12px; }.editor-panel { padding: 20px 15px; }
  .editor-grid { grid-template-columns: 1fr; }
  .identity-meta { gap: 8px; }.identity-meta strong { font-size: 9px; }
  .policy-intro { align-items: flex-start; flex-direction: column; gap: 10px; }
  .editor-actions { flex-wrap: wrap; }.save-hint { width: 100%; margin-bottom: 3px; }
  footer { flex-direction: column; gap: 5px; }
}