/* Radio workspace only. The established login/registration design is untouched. */
.app-shell { --panel: #0b0b0c; --line: #272729; color: #f2f2f2; }
.app-shell button:focus-visible, .workspace-modal button:focus-visible, .admin-page button:focus-visible { outline: 2px solid #a3c4ff; outline-offset: 3px; }
.app-shell .topbar { background: #090909; min-height: 84px; }
.app-shell .workspace { grid-template-columns: 260px minmax(370px, 1fr) 300px; min-height: calc(100dvh - 126px); }
.app-shell .metal-panel { background: #0a0a0b; min-width: 0; }
.app-shell .channel-rack { display: flex; flex-direction: column; }
.channel-search { display: block; padding: 0 16px; }
.channel-search input, .workspace-modal input:not([type=checkbox]), .workspace-modal select, .workspace-modal textarea, .admin-channel-search { width: 100%; border: 1px solid #333; border-radius: 8px; padding: 12px; color: #f0f0f0; background: #111113; font: inherit; min-width: 0; }
.channel-filters { display: flex; gap: 4px; padding: 12px 16px 8px; flex-wrap: wrap; }
.channel-filters button, .code-categories button { border: 1px solid #303034; border-radius: 20px; background: transparent; color: #a9a9b0; padding: 8px 10px; font-size: 11px; cursor: pointer; min-height: 36px; }
.channel-filters button.is-active, .code-categories button.is-active { color: #111; background: #ececee; border-color: #ececee; }
.app-shell .channel-list { padding: 6px 10px; flex: 1; max-height: 65dvh; overflow-y: auto; }
.channel-row { position: relative; display: flex; min-width: 0; border-bottom: 1px solid #222; }
.app-shell .channel-row .channel-card { flex: 1; grid-template-columns: 24px minmax(0,1fr); min-width: 0; padding: 16px 32px 16px 8px; gap: 8px; border: 0; border-radius: 6px; margin: 0; }
.app-shell .channel-card .channel-icon { width: 24px; flex: 0 0 24px; font-size: 17px; }
.app-shell .channel-card .channel-copy { min-width: 0; }
.app-shell .channel-card .channel-copy strong { font-size: 12px; overflow-wrap: anywhere; }
.app-shell .channel-card .channel-copy small { font-size: 8px; line-height: 1.8; white-space: normal; }
.app-shell .channel-card .channel-chevron { display: none; }
.channel-star { position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 34px; height: 40px; color: #68686e; background: transparent; border: 0; font-size: 21px; cursor: pointer; }
.channel-star[aria-pressed=true] { color: #f2f2f2; }
.app-shell .settings-button { margin-top: auto; }
.app-shell .radio-console { display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 28px clamp(16px, 3vw, 52px); gap: 18px; background: radial-gradient(ellipse at 50% 60%, #151517, #09090a 75%); }
.console-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; width: min(100%, 520px); }
.console-heading__actions { display: flex; align-items: center; justify-content: flex-end; gap: 7px; flex-wrap: wrap; }
.console-heading h1 { font-size: 23px; margin: 4px 0 0; font-weight: 600; letter-spacing: -.03em; }
.tool-button { display: inline-flex; justify-content: center; align-items: center; gap: 8px; padding: 11px 13px; min-height: 42px; border: 1px solid #333337; border-radius: 8px; background: #141416; color: #ccc; font-size: 12px; cursor: pointer; }
.tool-button:hover { background: #232326; color: white; }
.tool-button span { border: 1px solid #555; border-radius: 4px; padding: 3px 4px; font: 700 10px var(--font-mono); }
.tool-button:disabled { opacity: .4; cursor: not-allowed; }
.app-shell .radio-hardware { width: min(100%, 520px); border-radius: 20px; background: linear-gradient(125deg, #27272a, #121214 35%, #1b1b1d); border: 1px solid #3a3a3f; box-shadow: 0 28px 65px #0009, inset 0 1px #ffffff18; }
.app-shell .radio-topline { height: 24px; padding: 0 18px; background: #171719; border-radius: 20px 20px 0 0; }
.app-shell .radio-face { padding: 0 20px 12px; }
.app-shell .screen-bezel { background: #060606; border-color: #333; border-radius: 12px; padding: 7px; }
.app-shell .lcd-screen { background: linear-gradient(140deg, #1b1d20, #101114); border: 1px solid #383a40; border-radius: 7px; min-height: 0; padding: 14px; box-shadow: inset 0 3px 18px #0008; }
.app-shell .lcd-scanline { opacity: .2; }
.app-shell .frequency { font-size: clamp(44px, 5vw, 54px); color: #f0f0f1; letter-spacing: -.055em; margin: 8px 0; }
.app-shell .channel-readout { gap: 8px; }
.app-shell .channel-readout strong { font-size: 11px; line-height: 1.5; overflow-wrap: anywhere; }
.app-shell .lcd-foot { display: none; }
.app-shell #tx-countdown { font: 600 10px var(--font-mono); color: #999; }
.speaker-card { display: flex; align-items: center; gap: 10px; margin-top: 10px; border-top: 1px solid #ffffff12; padding-top: 10px; min-width: 0; }
.speaker-avatar { width: 40px; height: 40px; border-radius: 10px; background: #ffffff09; border: 1px solid #ffffff1c; display: grid; place-items: center; overflow: hidden; flex-shrink: 0; font-size: 19px; }
.speaker-avatar img { width: 100%; height: 100%; object-fit: cover; }
.speaker-card > div { min-width: 0; flex: 1; }
.speaker-card strong { display: block; font-size: 12px; color: #e7e7e9; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; }
.speaker-card small { display: block; font-size: 10px; color: #96969c; margin-top: 5px; }
.speaker-card meter { width: 48px; height: 18px; }
.app-shell .radio-message { min-height: 0; padding: 12px 0 2px; background: transparent; border: 0; margin: 0; }
.app-shell .radio-message strong { font-size: 12px; }
.app-shell .radio-message p { font-size: 11px; }
.app-shell[data-has-channel=true] .radio-message { display: none; }
.audio-health { margin: 8px 0 0; font-size: 10px; line-height: 1.5; color: #91919a; min-height: 15px; }
.audio-health.is-warning { color: #e4b970; }
.app-shell .ptt-cluster { border-radius: 18px; padding: 12px 0 16px; margin: 8px -8px 0; }
.app-shell .ptt-cluster::before { width: 145%; height: 130%; top: -15%; filter: blur(36px) saturate(1.5); opacity: .58; }
.app-shell .ptt-button { width: clamp(148px, 16vw, 164px); margin-top: 12px; }
.app-shell .keyboard-hint { margin-top: 12px; }
.app-shell .keyboard-hint kbd { padding: 3px 5px; }
.app-shell .keyboard-hint small { display: none; }
.app-shell .radio-footer { padding: 0 22px; height: 24px; color: #65656c; background: #151518; border-radius: 0 0 20px 20px; }
.console-tools { display: flex; align-items: center; justify-content: center; gap: 7px; width: min(100%, 520px); flex-wrap: wrap; }
.console-tools .tool-button { flex: 1; background: #0e0e10; white-space: nowrap; font-size: 11px; }
.app-shell .sos-control { margin: 10px 0; padding: 9px; }
.app-shell .sos-control p { font-size: 9px; }
.app-shell .sos-button { min-height: 43px; }
.app-shell .member-rack { max-height: calc(100dvh - 128px); overflow: auto; }
.app-shell .rack-tabs { position: sticky; top: 0; background: #0b0b0c; z-index: 2; }
.app-shell .member-card { display: grid; grid-template-columns: 34px minmax(0,1fr) auto; }
.member-volume { grid-column: 1 / -1; display: flex; align-items: center; gap: 9px; padding: 5px 0 0 45px; width: 100%; font-size: 10px; color: #97979e; }
.member-volume input { min-width: 40px; width: 100%; height: 18px; accent-color: #e8e8eb; }
.member-volume output { min-width: 32px; }
.chat-retention { padding: 0 15px; color: #8a8a93; font-size: 10px; line-height: 1.5; }
.chat-code { display: inline-block; padding: 4px 7px; margin: 7px 0 1px; background: #29292d; border: 1px solid #414147; border-radius: 5px; color: white; font: 700 12px var(--font-mono); }
.chat-code.is-urgent { border-color: #a34350; color: #ffb1bc; background: #4b2026; }
.announcement-banner { width: min(100%, 520px); border: 1px solid #494953; border-left: 3px solid #dddded; background: linear-gradient(110deg, #232329, #141416); border-radius: 10px; padding: 13px 15px; box-shadow: 0 12px 25px #0004; }
.announcement-banner.is-urgent { border-left-color: #ff5e79; background: linear-gradient(110deg, #331a23, #161418); }
.announcement-banner header { display: flex; gap: 10px; align-items: center; justify-content: space-between; }
.announcement-banner header small { font-size: 9px; color: #afafb9; letter-spacing: .08em; }
.announcement-banner h2 { margin: 4px 0; font-size: 13px; line-height: 1.4; }
.announcement-text { font-size: 12px; line-height: 1.5; margin: 4px 0; max-height: 90px; overflow: auto; overflow-wrap: anywhere; }
.announcement-banner .announcement-actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 9px; }
.ack-button { min-height: 40px; border: 1px solid #dfdfe7; border-radius: 6px; padding: 9px 13px; background: #ececf3; color: #16161a; cursor: pointer; font-size: 12px; font-weight: 700; }
.ack-button:disabled { background: #222227; color: #aaa; border-color: #444; }
.announcement-banner details { flex: 1; min-width: 115px; }
.announcement-banner summary { cursor: pointer; font-size: 11px; color: #b0b0bc; min-height: 32px; display: flex; align-items: center; }
.ack-list { list-style: none; padding: 8px 0; margin: 0; max-height: 150px; overflow: auto; font-size: 11px; }
.ack-list li { padding: 7px 0; border-bottom: 1px solid #ffffff0c; }
.ack-list small { display: block; color: #91919c; margin-top: 5px; line-height: 1.5; }
.announcement-author { color: #9b9ba7; font-size: 10px; }
.announcement-remove { background: transparent; color: #aaa; border: 0; min-height: 30px; cursor: pointer; font-size: 10px; }
.workspace-modal { background: #101012; color: #ededf0; border: 1px solid #3b3b40; border-radius: 18px; padding: 28px; width: min(620px, calc(100vw - 28px)); max-height: calc(100dvh - 32px); overflow-y: auto; overscroll-behavior: contain; }
.workspace-modal header { padding-right: 22px; }
.workspace-modal header h2 { font-size: 25px; line-height: 1.25; letter-spacing: -.03em; margin: 8px 0 12px; }
.workspace-modal header > p:not(.micro-label) { color: #a1a1ac; font-size: 12px; line-height: 1.7; }
.workspace-modal label:not(.emergency-check):not(.motion-setting), .workspace-modal form > label { display: block; font-size: 12px; margin: 16px 0 7px; color: #c0c0ca; }
.workspace-modal textarea { min-height: 110px; resize: vertical; }
.workspace-modal .primary-action { margin-top: 18px; min-height: 44px; justify-content: center; font-size: 12px; }
.workspace-modal .secondary-submit { min-height: 42px; }
.code-categories { display: flex; flex-wrap: wrap; gap: 6px; padding: 13px 0; }
.code-categories button { font-size: 11px; }
.codes-list { overflow-y: auto; max-height: 37dvh; padding-right: 4px; }
.codes-group-title { font: 600 10px var(--font-mono); text-transform: uppercase; color: #90909d; letter-spacing: .08em; margin: 18px 0 8px; }
.code-row { display: flex; gap: 14px; align-items: center; width: 100%; padding: 12px; min-height: 53px; text-align: left; border: 1px solid #29292e; border-bottom-width: 0; background: #18181b; color: #d5d5dc; cursor: pointer; }
.code-row:last-child { border-bottom-width: 1px; }
.code-row > b { flex: 0 0 55px; color: #f4f4f6; font: 700 15px var(--font-mono); }
.code-row span { font-size: 12px; line-height: 1.65; }
.code-row small { display: block; color: #94949e; }
.code-row.is-selected, .code-row:hover { background: #2a2a31; border-color: #666675; }
.code-row.is-urgent > b { color: #ffadb9; }
.codes-warning { font-size: 10px; color: #a8a8b4; line-height: 1.7; padding: 12px; background: #ffffff05; border-radius: 6px; }
.code-compose { border-top: 1px solid #3a3a42; margin-top: 15px; padding-top: 15px; }
.code-compose > div > b { font: 800 24px var(--font-mono); }
.code-compose p { font-size: 12px; line-height: 1.6; color: #bdbdc7; }
.emergency-check, .motion-setting { display: flex; align-items: flex-start; gap: 10px; margin: 14px 0; font-size: 12px; line-height: 1.7; color: #e4b0ba; }
.emergency-check input, .motion-setting input { margin-top: 5px; flex-shrink: 0; accent-color: #eee; }
.dialog-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: end; }
.dialog-actions > button { flex: 1; }
.mic-test-panel { border: 1px solid #34343c; border-radius: 10px; margin-top: 18px; padding: 16px; display: grid; gap: 12px; }
.mic-test-panel meter { width: 100%; height: 20px; }
.mic-test-panel p { margin: 0; color: #acacb6; font-size: 12px; line-height: 1.5; }
.workspace-modal .audio-control { padding: 20px 0; border-bottom: 1px solid #333; }
.archive-filters { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; align-items: end; }
.archive-filters label:first-child { grid-column: 1 / -1; }
.archive-filters button { grid-column: 1 / -1; }
.archive-results { margin-top: 15px; }
.archive-record { border: 1px solid #303036; background: #17171a; border-radius: 8px; margin: 8px 0; padding: 13px; }
.archive-record header { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; font-size: 12px; }
.archive-record header small { color: #a1a1ac; font-size: 10px; }
.archive-record p { overflow-wrap: anywhere; font-size: 13px; line-height: 1.6; }
.archive-record pre { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 11px; color: #a1a1ac; }
.mobile-nav { display: none; }
.app-shell.is-compact .workspace { grid-template-columns: 1fr; }
.app-shell.is-compact .channel-rack, .app-shell.is-compact .member-rack { display: none; }
.app-shell.is-compact .radio-console { padding: 20px; }
.app-shell.is-compact .radio-hardware { max-width: 430px; }
.app-shell.is-compact .console-heading, .app-shell.is-compact .console-tools { max-width: 430px; }
.app-shell.is-compact .console-heading h1 { font-size: 18px; }
.app-shell.is-compact .announcement-banner { max-width: 430px; }
.app-shell.no-siren .ptt-cluster::before { animation: none; opacity: .15; }
.app-shell .safety-footer { position: relative; height: 38px; bottom: auto; }
.app-shell { padding-bottom: 0; }
.admin-channel-layout { display: grid; grid-template-columns: 230px minmax(0,1fr); gap: 22px; margin-top: 20px; align-items: start; }
.admin-channel-nav { position: sticky; top: 20px; min-width: 0; max-width: 100%; padding: 12px; border: 1px solid #2c2c30; border-radius: 10px; background: #111; }
.admin-channel-nav button { width: 100%; padding: 15px 12px; margin-top: 4px; background: transparent; border: 1px solid transparent; border-radius: 6px; color: #b8b8c0; text-align: left; cursor: pointer; }
.admin-channel-nav button.is-active { background: #24242b; border-color: #5a5a69; color: white; }
.admin-channel-nav button strong, .admin-channel-nav button small { display: block; overflow-wrap: anywhere; }
.admin-channel-nav button small { margin-top: 7px; font-size: 10px; color: #9b9ba8; }
.admin-page .channel-admin-card { margin: 0; min-width: 0; padding: 22px; border-radius: 12px; }
.admin-page .channel-admin-grid input, .admin-page .channel-admin-grid label { min-width: 0; }
.admin-page .channel-admin-grid { grid-template-columns: 1fr 120px; }
.admin-page .channel-admin-grid > label:last-child { grid-column: 1 / -1; }
.admin-page .channel-person-access > div { flex-wrap: wrap; }
.admin-page .channel-person-access select { min-width: 0; width: 100%; flex: 1 1 200px; }
.admin-page .channel-create-form { margin-top: 20px; }
.admin-page .channel-denied-pill { display: flex; justify-content: space-between; gap: 10px; width: 100%; padding: 12px; white-space: normal; }
.admin-page .channel-denied-pill small { display: block; font-size: 10px; color: #c397a0; line-height: 1.6; margin-top: 4px; }
.admin-page .channel-person-search { width: 100%; background: #111; color: white; border: 1px solid #3b3b40; border-radius: 6px; padding: 12px; margin: 8px 0; }
.admin-log-filters { display: flex; gap: 10px; flex-wrap: wrap; align-items: end; }
.admin-log-filters label { display: grid; gap: 7px; color: #aaa; font-size: 12px; flex: 1 1 155px; }
.admin-log-filters input, .admin-log-filters select { width: 100%; background: #141417; color: white; border: 1px solid #393940; border-radius: 6px; padding: 11px; min-width: 0; }
.admin-page .archive-record { max-width: 100%; }
.admin-page .channel-create-toggle { min-height: 44px; margin-top: 16px; }
@media (min-width: 801px) and (max-width: 1179px) {
  .app-shell .workspace { grid-template-columns: 220px minmax(340px,1fr); }
  .app-shell .member-rack { grid-column: 1 / -1; max-height: none; border-top: 1px solid #333; }
  .app-shell .radio-console { padding: 24px; }
  .app-shell .member-list { max-height: 350px; }
  .app-shell .chat-messages { max-height: 350px; }
  .admin-channel-layout { grid-template-columns: 190px minmax(0,1fr); gap: 14px; }
}
@media (max-width: 800px) {
  .app-shell { padding-bottom: calc(76px + env(safe-area-inset-bottom)); }
  .app-shell .topbar { position: relative; height: 75px; min-height: 75px; padding: 12px 16px; gap: 9px; flex-wrap: nowrap; }
  .app-shell .compact-brand { flex: 1; }
  .app-shell .compact-brand strong { font-size: 17px; }
  .app-shell .top-profile-avatar { width: 46px; height: 46px; }
  .app-shell .network-state { display: flex; position: absolute; top: 49px; left: 74px; width: auto; padding: 0; border: 0; gap: 5px; }
  .app-shell .network-state .status-led { width: 5px; height: 5px; }
  .app-shell .compact-brand small { visibility: hidden; }
  .app-shell .network-state small { display: none; }
  .app-shell .network-state strong { font-size: 8px; }
  .app-shell .operator-id, #compact-toggle { display: none; }
  .app-shell .top-actions { gap: 6px; }
  .app-shell .management-button, .app-shell .logout-button { font-size: 9px; padding: 9px; min-height: 36px; }
  .app-shell .workspace, .app-shell.is-compact .workspace { display: block; min-height: auto; }
  .app-shell .workspace > aside, .app-shell.is-compact .workspace > aside { display: none; }
  .app-shell .workspace > .radio-console { display: flex; }
  .app-shell[data-mobile-view=channels] .workspace > .channel-rack { display: flex; }
  .app-shell[data-mobile-view=members] .workspace > .member-rack { display: block; }
  .app-shell:not([data-mobile-view=radio]) .workspace > .radio-console { display: none; }
  .app-shell .radio-console, .app-shell.is-compact .radio-console { padding: 14px 16px 20px; gap: 12px; }
  .console-heading h1 { font-size: 21px; }
  .console-heading .micro-label { font-size: 8px; }
  .console-heading .tool-button { font-size: 11px; padding: 9px; }
  .app-shell .radio-hardware { border-radius: 17px; max-width: 460px; }
  .app-shell .radio-topline { display: flex; height: 22px; }
  .app-shell .radio-face { padding: 0 13px 8px; }
  .app-shell .lcd-screen { min-height: 0; padding: 10px 12px; }
  .app-shell .frequency { font-size: 44px; }
  .app-shell .radio-message { padding-top: 10px; }
  .app-shell .radio-message p { font-size: 10px; }
  .app-shell .ptt-button { width: 148px; }
  .app-shell .sos-control { grid-template-columns: 94px minmax(0,1fr); padding: 6px; margin: 7px 0; gap: 8px; }
  .app-shell .sos-button { min-height: 38px; min-width: 94px; }
  .app-shell .sos-button small { font-size: 7px; }
  .app-shell .sos-control p { font-size: 9px; }
  .app-shell .radio-topline { display: grid; height: 20px; }
  .app-shell .radio-footer { display: none; }
  .app-shell .announcement-banner { padding: 9px 12px; }
  .app-shell .announcement-banner .announcement-actions { margin-top: 7px; gap: 7px; }
  .app-shell .announcement-banner .announcement-author { font-size: 9px; }
  .app-shell .announcement-banner .announcement-remove { min-height: 20px; }
  .app-shell .announcement-banner .ack-button { min-height: 34px; padding: 7px 10px; font-size: 11px; }
  .app-shell .keyboard-hint { display: none; }
  .app-shell .ptt-cluster { padding: 10px 0 22px; }
  .app-shell .ptt-status-line { font-size: 10px; }
  .app-shell .channel-list { display: block; overflow-x: hidden; max-height: none; }
  .app-shell .channel-row .channel-card { width: auto; min-width: 0; flex: 1; padding: 18px 44px 18px 10px; }
  .app-shell .channel-card .channel-copy strong { font-size: 14px; }
  .app-shell .channel-card .channel-copy small { font-size: 10px; }
  .channel-star { width: 44px; height: 48px; }
  .app-shell .settings-button, .app-shell .rack-legend { display: none; }
  .app-shell .member-rack { max-height: none; padding-bottom: 16px; }
  .app-shell .rack-panel { min-height: 50dvh; }
  .app-shell .chat-messages { max-height: 50dvh; }
  .app-shell .member-list { display: block; max-height: none; }
  .app-shell .member-card { padding: 16px; }
  .app-shell .safety-footer { position: relative; padding: 12px 16px; margin: 0; bottom: auto; font-size: 8px; }
  .app-shell .safety-footer p, .app-shell #footer-clock { display: none; }
  .mobile-nav { position: fixed; bottom: 0; left: 0; right: 0; display: grid; grid-template-columns: repeat(4,1fr); z-index: 30; padding: 7px 10px calc(7px + env(safe-area-inset-bottom)); background: #111114f5; border-top: 1px solid #36363f; backdrop-filter: blur(16px); }
  .mobile-nav button { display: flex; flex-direction: column; align-items: center; gap: 4px; background: transparent; color: #777783; border: 0; padding: 6px 0; min-height: 48px; border-radius: 9px; font-size: 21px; cursor: pointer; }
  .mobile-nav button span { font-size: 10px; }
  .mobile-nav button.is-active { color: #eeeef5; background: #27272e; }
  .mobile-nav b { font-size: 10px; border-radius: 8px; background: #e4e4ed; color: #111; padding: 1px 4px; }
  .app-shell ~ .toast-region { top: 82px; bottom: auto; max-height: 120px; overflow: hidden; pointer-events: none; }
  .workspace-modal { padding: 22px 18px; max-height: calc(100dvh - 20px); width: calc(100vw - 20px); }
  .workspace-modal header h2 { font-size: 23px; }
  .workspace-modal input:not([type=checkbox]), .workspace-modal select, .workspace-modal textarea { font-size: 16px; }
  .codes-list { max-height: 33dvh; }
  .codes-group-title { font-size: 9px; }
  .code-row { padding: 11px 9px; gap: 8px; }
  .code-row > b { flex-basis: 52px; font-size: 14px; }
  .code-row span { font-size: 12px; }
  .code-categories button { padding: 8px; font-size: 10px; }
  .admin-channel-layout { grid-template-columns: minmax(0,1fr); }
  .admin-page .admin-page-sidebar nav { display: flex; overflow-x: auto; max-width: 100%; gap: 6px; }
  .admin-page .admin-page-sidebar nav button { display: flex; flex: 0 0 auto; min-height: 44px; gap: 8px; white-space: nowrap; }
  .admin-page .admin-page-sidebar { padding: 9px 12px; }
  .admin-channel-nav { position: static; }
  #admin-channel-options { display: flex; gap: 6px; overflow: auto; max-width: 100%; }
  .admin-channel-nav button { min-width: 145px; width: 145px; flex-shrink: 0; }
  .admin-page .channel-admin-grid { grid-template-columns: 1fr; }
  .admin-page .channel-admin-card { padding: 15px; }
  .admin-page .channel-admin-card > header { flex-wrap: wrap; }
  .admin-page .page-heading h1 { font-size: 26px; }
}
@media (prefers-reduced-motion: reduce) {
  .app-shell .ptt-cluster::before { animation: none; opacity: .15; }
}

/* Status accents carry meaning; radio chrome stays monochrome. */
[data-severity] { --status-color: #b8bec8; --status-bg: #b8bec810; }
[data-severity=success] { --status-color: #79e6ad; --status-bg: #2bd17c13; }
[data-severity=info] { --status-color: #91caff; --status-bg: #389bff14; }
[data-severity=warning] { --status-color: #f5cc7c; --status-bg: #efab3514; }
[data-severity=critical] { --status-color: #ff9a9d; --status-bg: #fc41551a; }
.app-shell .chat-message.status-message, .status-message.archive-record { border: 1px solid #ffffff16; border-left: 3px solid var(--status-color); background: var(--status-bg); border-radius: 10px; padding: 14px; margin-bottom: 12px; }
.status-message-title { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; margin: 12px 0 7px; }
.status-message-title strong { color: var(--status-color); font-size: 16px; line-height: 1.4; }
.status-level { display: inline-flex; border: 1px solid currentColor; color: var(--status-color); border-radius: 4px; padding: 3px 6px; font: 700 9px var(--font-mono, monospace); letter-spacing: .06em; }
.app-shell .status-message > p, .status-message.archive-record > p { color: #eceef3; font-size: 13px; line-height: 1.65; }
.status-message .status-source { display: block; color: var(--status-color); margin-top: 10px; font-size: 10px; }
.app-shell .status-message .chat-code { background: #0003; color: var(--status-color); border-color: #ffffff20; }
.status-dock { width: min(100%, 520px); display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; border: 1px solid #2b2b30; border-radius: 10px; background: #101012; }
.status-dock > div { min-width: 0; }
.status-dock small { display: block; color: #868691; font-size: 8px; letter-spacing: .12em; margin-bottom: 5px; }
.status-dock strong { display: block; font-size: 11px; font-weight: 500; color: #dddddf; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.status-dock button { background: #212124; border: 1px solid #38383d; color: #d9d9e0; border-radius: 7px; min-height: 38px; padding: 8px 10px; font-size: 10px; white-space: nowrap; cursor: pointer; }
.voice-status-feedback { width: min(100%, 520px); color: #c3c7d0; font-size: 11px; line-height: 1.6; padding: 10px 13px; background: #151519; border-radius: 8px; margin: 0; }
.status-examples { display: flex; flex-wrap: wrap; gap: 8px; margin: 18px 0; }
.status-examples span { border: 1px solid var(--status-color); color: var(--status-color); background: var(--status-bg); padding: 9px; border-radius: 8px; font-size: 11px; }
.workspace-modal .voice-consent { display: flex; align-items: flex-start; gap: 10px; border: 1px solid #51515a; border-radius: 9px; padding: 14px; margin: 18px 0; color: #f0f0f3; font-size: 13px; line-height: 1.7; }
.voice-consent input { flex-shrink: 0; width: 18px; height: 18px; margin-top: 2px; accent-color: #e9e9f0; }
.voice-privacy { font-size: 12px; color: #a5a5af; line-height: 1.8; }
.app-shell .directory-status-note { color: #9797a2; font-size: 11px; line-height: 1.7; margin: 0 18px 12px; }
.app-shell .directory-card { display: flex; flex-wrap: wrap; gap: 10px; padding: 16px; border-bottom: 1px solid #303034; }
.app-shell .directory-info { flex: 1; min-width: 150px; }
.person-last-status { border-left: 2px solid var(--status-color, #51515a); background: var(--status-bg, #151517); padding: 10px; margin-top: 12px; border-radius: 0 7px 7px 0; }
.person-last-status strong { display: block; color: var(--status-color); font-size: 12px; line-height: 1.5; margin-top: 7px; }
.person-last-status small { display: block; font-size: 10px; color: #a6a6b0; line-height: 1.7; margin-top: 6px; }
.person-last-status.is-empty { color: #95959d; font-size: 11px; }
.app-shell .directory-card .appointment-request { margin-left: auto; }
.forgot-password { display: block; width: 100%; text-align: center; background: none; border: 0; border-bottom: 1px solid #323238; padding: 10px 5px; font-size: 11px; color: #bbbcc7; cursor: pointer; }
.renew-screen { min-height: 100dvh; display: grid; place-items: center; padding: 24px; background: radial-gradient(ellipse at top, #23232c, #08080b 65%); }
.recovery-card { width: min(100%, 510px); padding: clamp(20px, 5vw, 40px); background: #101013; border: 1px solid #36363f; border-radius: 20px; box-shadow: 0 28px 100px #0008; }
.recovery-card h1 { color: #fafafa; font-size: 32px; letter-spacing: -.04em; }
.recovery-card p { color: #aaaab5; line-height: 1.8; font-size: 13px; }
.recovery-card label { color: #e6e6ec; display: block; margin: 16px 0 8px; font-size: 13px; }
.recovery-card input { width: 100%; border: 1px solid #454550; border-radius: 8px; background: #18181e; color: white; font: inherit; padding: 14px; }
.recovery-card .primary-action, #forgot-form .primary-action { margin-top: 22px; }
.recovery-card a { color: #c5c5d0; font-size: 12px; }
.password-request-card { display: flex; justify-content: space-between; align-items: center; gap: 20px; border: 1px solid #33333a; background: #111115; border-radius: 10px; padding: 20px; margin: 12px 0; }
.password-request-card strong { font-size: 16px; color: #f2f2f5; }
.password-request-card p { color: #a2a2af; font-size: 12px; overflow-wrap: anywhere; }
.password-request-card span { font-size: 11px; color: #cbd4e5; }
.password-request-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.password-request-actions small { color: #9e9eac; max-width: 230px; line-height: 1.6; }
#temporary-password-value { font-family: monospace; font-size: 18px; letter-spacing: .03em; color: #91edb9; }
.renew-screen[hidden], .voice-consent[hidden], .voice-status-feedback[hidden] { display: none; }
@media (min-width: 1200px) {
  .app-shell .workspace { grid-template-columns: 238px minmax(400px, 1fr) minmax(340px, 390px); }
  .app-shell .radio-console { justify-content: flex-start; padding: 24px clamp(20px, 2vw, 36px); gap: 14px; }
  .app-shell .member-rack { max-height: calc(100dvh - 112px); position: sticky; top: 12px; align-self: start; border-left: 1px solid #34343a; }
  .app-shell .chat-messages { max-height: calc(100dvh - 345px); min-height: 270px; }
  .app-shell .directory-list { max-height: calc(100dvh - 400px); overflow-y: auto; }
  .app-shell .console-heading h1 { font-size: 26px; }
  .app-shell .ptt-cluster { padding-top: 14px; padding-bottom: 22px; }
  .app-shell .radio-face { padding-bottom: 6px; }
}
@media (max-width: 800px) {
  .status-dock { padding: 7px 10px; gap: 7px; }
  .status-dock small { font-size: 7px; }
  .status-dock strong { max-width: 155px; font-size: 10px; }
  .status-dock button { padding: 7px; font-size: 9px; }
  .app-shell .radio-console { gap: 9px; }
  .app-shell .status-message > p { font-size: 14px; }
  .status-message-title strong { font-size: 17px; }
  .password-request-card { flex-direction: column; align-items: stretch; gap: 12px; padding: 16px; }
}

/* 1.2.3 — readable, adjustable radio desk */
.app-shell { --left-rail: 252px; --right-rail: 360px; font-weight: 550; }
.app-shell button, .app-shell input, .app-shell select, .app-shell textarea,
.workspace-modal button, .workspace-modal input, .workspace-modal select, .workspace-modal textarea { font-weight: 650; }
.app-shell .channel-card .channel-copy strong { font-size: 13px; font-weight: 750; line-height: 1.35; }
.app-shell .channel-card .channel-copy small { font-size: 9px; font-weight: 650; }
.app-shell .rack-tab, .app-shell .tool-button, .app-shell .settings-button strong { font-weight: 800; }
.app-shell .member-card strong, .app-shell .chat-message strong { font-weight: 750; }
.app-shell .status-dock strong { font-size: 12px; font-weight: 700; }

.channel-rack, .member-rack { position: relative; }
.rack-collapse { position: absolute; z-index: 7; top: 9px; right: 8px; display: grid; place-items: center; width: 31px; height: 31px; border: 1px solid #414147; border-radius: 7px; background: #17171a; color: #e8e8eb; font: 900 19px/1 var(--font-mono); cursor: pointer; box-shadow: 0 4px 14px #0006; }
.rack-collapse-right { right: 8px; }
.rack-resizer { position: absolute; z-index: 8; top: 0; right: -5px; width: 10px; height: 100%; cursor: col-resize; touch-action: none; }
.rack-resizer::after { content: ""; position: absolute; top: 14%; bottom: 14%; left: 4px; width: 2px; border-radius: 3px; background: transparent; transition: background .16s, box-shadow .16s; }
.rack-resizer:hover::after, .rack-resizer:focus-visible::after, .is-resizing-rack .rack-resizer::after { background: #aeb0ba; box-shadow: 0 0 9px #fff5; }
.rack-resizer-left { left: -5px; right: auto; }
.is-resizing-rack { cursor: col-resize; user-select: none; }
.channel-rack > .rack-header { padding-right: 52px; }
.member-rack > .rack-tabs { padding-right: 42px; }

.desktop-radio-controls { width: 100%; display: grid; grid-template-columns: minmax(155px, .78fr) minmax(270px, 1.22fr); align-items: stretch; gap: 18px; margin-top: 13px; }
.channel-crown-panel { position: relative; display: grid; grid-template-columns: 112px minmax(0,1fr); grid-template-rows: auto 1fr; gap: 8px 13px; align-items: center; min-width: 0; padding: 14px; border: 1px solid #38383e; border-radius: 16px; background: linear-gradient(145deg, #121214, #080809); box-shadow: inset 0 1px #ffffff0d, 0 12px 22px #0005; }
.channel-crown-panel > small { grid-column: 1 / -1; color: #898992; font: 800 9px var(--font-mono); letter-spacing: .12em; }
.channel-crown-panel > div { min-width: 0; }
.channel-crown-panel > div strong, .channel-crown-panel > div small { display: block; }
.channel-crown-panel > div strong { color: #f1f1f3; font-size: 12px; line-height: 1.45; overflow-wrap: anywhere; }
.channel-crown-panel > div small { margin-top: 8px; color: #8f8f98; font-size: 9px; font-weight: 650; line-height: 1.5; }
.channel-crown { --crown-angle: 0deg; position: relative; width: 108px; height: 108px; display: grid; place-items: center; border: 8px solid #080809; border-radius: 50%; color: #101012; background: repeating-conic-gradient(from var(--crown-angle), #777 0 3deg, #e5e5e7 3deg 7deg, #888 7deg 10deg); box-shadow: 0 11px 20px #000b, 0 0 0 1px #5d5d64, inset 0 0 0 8px #b8b8bc; cursor: ns-resize; transition: filter .15s, transform .12s; }
.channel-crown::before { content: ""; position: absolute; inset: 15px; border-radius: 50%; background: radial-gradient(circle at 40% 30%, #f7f7f8, #b6b6b9 52%, #626267); box-shadow: inset 0 3px 5px #fff9, inset 0 -7px 10px #0005; }
.channel-crown span { position: absolute; z-index: 2; top: 12px; left: 50%; width: 4px; height: 17px; border-radius: 3px; background: #161619; transform: translateX(-50%) rotate(var(--crown-angle)); transform-origin: 50% 42px; transition: transform .16s; }
.channel-crown b { position: relative; z-index: 2; font: 950 21px var(--font-mono); }
.channel-crown:not(:disabled):hover { filter: brightness(1.1); }
.channel-crown.is-turning { transform: scale(.96); }
.channel-crown:disabled { filter: grayscale(1) brightness(.55); cursor: not-allowed; }

.emergency-alert-overlay { position: fixed; z-index: 150; top: 96px; left: 50%; width: min(680px, calc(100vw - 28px)); transform: translateX(-50%); display: grid; grid-template-columns: 48px minmax(0,1fr) auto; align-items: center; gap: 14px; padding: 15px 17px; border: 1px solid #ff697b; border-radius: 13px; background: linear-gradient(110deg, #4b0712f5, #17070bf5 70%); color: #fff; box-shadow: 0 18px 65px #000c, 0 0 34px #ff244c45; }
.emergency-alert-overlay[hidden] { display: none; }
.emergency-alert-overlay > span { display: grid; place-items: center; width: 44px; height: 44px; border: 2px solid currentColor; border-radius: 50%; font: 950 27px var(--font-mono); }
.emergency-alert-overlay strong { display: block; font: 950 20px var(--font-ui); letter-spacing: .08em; }
.emergency-alert-overlay p { margin: 4px 0 0; color: #ffdce1; font-size: 12px; font-weight: 700; overflow-wrap: anywhere; }
.emergency-alert-overlay button { min-height: 38px; border: 1px solid #fff9; border-radius: 7px; background: #fff; color: #3b050d; padding: 8px 11px; font: 900 10px var(--font-mono); cursor: pointer; }
.emergency-alert-overlay.is-pulsing { animation: emergency-entry .28s ease-out, emergency-pulse .8s ease-in-out .3s 3 alternate; }
@keyframes emergency-entry { from { opacity: 0; transform: translate(-50%, -20px) scale(.97); } }
@keyframes emergency-pulse { to { box-shadow: 0 18px 65px #000c, 0 0 55px #ff244c80; border-color: #fff; } }
.emergency-audio-settings { display: grid; gap: 10px; margin-top: 18px; padding: 16px; border: 1px solid #4a2930; border-radius: 11px; background: #2a11161f; }
.emergency-audio-settings > div strong, .emergency-audio-settings > div small { display: block; }
.emergency-audio-settings > div strong { color: #ffb0bb; font-size: 12px; letter-spacing: .08em; }
.emergency-audio-settings > div small { margin-top: 7px; color: #aaaab3; font-size: 11px; line-height: 1.6; }
.emergency-audio-settings label[for=emergency-alert-volume] { display: flex !important; justify-content: space-between; margin-bottom: 0 !important; }
.emergency-audio-settings input[type=range] { width: 100%; accent-color: #ff5269; }

@media (min-width: 1180px) {
  .app-shell .workspace { grid-template-columns: var(--left-rail) minmax(500px, 1fr) var(--right-rail); transition: grid-template-columns .2s ease; }
  .app-shell.channels-collapsed .workspace { grid-template-columns: 54px minmax(500px, 1fr) var(--right-rail); }
  .app-shell.members-collapsed .workspace { grid-template-columns: var(--left-rail) minmax(500px, 1fr) 54px; }
  .app-shell.channels-collapsed.members-collapsed .workspace { grid-template-columns: 54px minmax(500px, 1fr) 54px; }
  .app-shell.is-compact .workspace, .app-shell.is-compact.channels-collapsed .workspace,
  .app-shell.is-compact.members-collapsed .workspace { grid-template-columns: 1fr; }
  .app-shell.channels-collapsed .channel-rack > :not(.rack-collapse):not(.rack-resizer),
  .app-shell.members-collapsed .member-rack > :not(.rack-collapse):not(.rack-resizer) { display: none; }
  .app-shell.channels-collapsed .channel-rack, .app-shell.members-collapsed .member-rack { overflow: visible; }
  .app-shell.channels-collapsed .rack-collapse, .app-shell.members-collapsed .rack-collapse { right: 11px; }
  .app-shell .radio-console { padding-inline: clamp(18px, 2vw, 34px); }
  .app-shell .radio-hardware, .app-shell .console-heading, .app-shell .console-tools, .app-shell .announcement-banner, .app-shell .status-dock, .app-shell .voice-status-feedback { width: min(100%, 680px); }
  .app-shell .ptt-cluster { min-height: 158px; display: grid; align-content: center; justify-items: center; padding: 13px 16px 18px; margin: 0; }
  .app-shell .ptt-button { width: min(100%, 292px); height: 104px; aspect-ratio: auto; margin-top: 11px; border-width: 8px; border-radius: 22px; background: linear-gradient(155deg, #f5f5f6, #c8c8cb 48%, #77777c); }
  .app-shell .ptt-button__inner { flex-direction: row; gap: 11px; }
  .app-shell .ptt-button__inner b { font-size: 30px; }
  .app-shell .ptt-button__inner small { margin: 3px 0 0; }
  .app-shell .keyboard-hint { margin-top: 10px; }
}

@media (min-width: 801px) and (max-width: 1179px) {
  .rack-collapse, .rack-resizer { display: none; }
  .desktop-radio-controls { grid-template-columns: minmax(145px,.72fr) minmax(245px,1.28fr); }
  .channel-crown-panel { grid-template-columns: 94px minmax(0,1fr); padding: 11px; }
  .channel-crown { width: 91px; height: 91px; }
  .channel-crown span { transform-origin: 50% 34px; }
  .app-shell .ptt-button { width: min(100%, 250px); height: 98px; aspect-ratio: auto; border-radius: 20px; }
  .app-shell .ptt-button__inner { flex-direction: row; gap: 10px; }
}

@media (max-width: 800px) {
  .rack-collapse, .rack-resizer, .channel-crown-panel, .theme-quick-toggle { display: none; }
  .desktop-radio-controls { display: block; width: 100%; margin-top: 0; }
  .app-shell .ptt-button { width: 148px; height: auto; aspect-ratio: 1; border-radius: 50%; }
  .app-shell .ptt-button__inner { flex-direction: column; }
  .emergency-alert-overlay { top: 83px; grid-template-columns: 38px minmax(0,1fr); padding: 12px; }
  .emergency-alert-overlay > span { width: 36px; height: 36px; font-size: 22px; }
  .emergency-alert-overlay strong { font-size: 16px; }
  .emergency-alert-overlay button { grid-column: 1 / -1; width: 100%; min-height: 34px; }
}

/* Optional light theme. Login/registration intentionally keeps its existing art direction. */
html[data-theme=light] .app-shell { --panel: #f5f6f8; --line: #c9ccd2; color: #191b20; background: #e9ebef; }
html[data-theme=light] .app-shell .topbar { background: #f8f9fbeF; border-color: #cfd2d8; }
html[data-theme=light] .app-shell .compact-brand strong, html[data-theme=light] .app-shell .network-state strong,
html[data-theme=light] .app-shell .network-state small { color: #1c1f24; }
html[data-theme=light] .app-shell .management-button, html[data-theme=light] .app-shell .logout-button { color: #202329; background: #fff; border-color: #bfc4cc; }
html[data-theme=light] .app-shell .workspace, html[data-theme=light] .app-shell .metal-panel { background: #f3f4f6; }
html[data-theme=light] .app-shell .channel-rack { border-color: #c9ccd2; }
html[data-theme=light] .app-shell .radio-console { background: radial-gradient(ellipse at 50% 55%, #fff, #e4e6ea 78%); }
html[data-theme=light] .app-shell .member-rack, html[data-theme=light] .app-shell .rack-tabs { background: #f5f6f8; border-color: #c9ccd2; }
html[data-theme=light] .app-shell .rack-tab, html[data-theme=light] .app-shell .rack-header h2,
html[data-theme=light] .app-shell .console-heading h1, html[data-theme=light] .app-shell .operator-id strong { color: #17191d; }
html[data-theme=light] .app-shell .micro-label, html[data-theme=light] .app-shell .channel-copy small,
html[data-theme=light] .app-shell .member-copy small, html[data-theme=light] .app-shell .directory-status-note { color: #5d626b; }
html[data-theme=light] .app-shell .channel-row, html[data-theme=light] .app-shell .member-card,
html[data-theme=light] .app-shell .directory-card { border-color: #d4d6db; }
html[data-theme=light] .app-shell .channel-card, html[data-theme=light] .app-shell .member-card,
html[data-theme=light] .app-shell .directory-card { color: #23262b; }
html[data-theme=light] .app-shell .channel-icon { color: #30343a; border-color: #bcc1c9; }
html[data-theme=light] .app-shell .channel-star { color: #6c717a; }
html[data-theme=light] .app-shell .channel-card:hover, html[data-theme=light] .app-shell .channel-card.is-active { background: #dfe3e9; }
html[data-theme=light] .app-shell .channel-search input, html[data-theme=light] .app-shell .chat-form input { background: #fff; color: #16181c; border-color: #bfc3ca; }
html[data-theme=light] .app-shell .channel-filters button { color: #43474f; border-color: #bfc3ca; }
html[data-theme=light] .app-shell .channel-filters button.is-active { color: #fff; background: #25282e; border-color: #25282e; }
html[data-theme=light] .app-shell .tool-button, html[data-theme=light] .app-shell .status-dock,
html[data-theme=light] .app-shell .voice-status-feedback, html[data-theme=light] .app-shell .settings-button { color: #25282d; background: #fff; border-color: #c2c5cb; }
html[data-theme=light] .app-shell .status-dock strong { color: #272a30; }
html[data-theme=light] .app-shell .status-dock button { color: #24272c; background: #e8eaee; border-color: #c7cad0; }
html[data-theme=light] .app-shell .chat-message:not(.status-message), html[data-theme=light] .app-shell .chat-retention { color: #30343a; }
html[data-theme=light] .app-shell .chat-message:not(.status-message) { background: #fff; border-color: #d2d5da; }
html[data-theme=light] .app-shell .chat-message:not(.status-message) > p { color: #30343a; }
html[data-theme=light] .app-shell .chat-message time,
html[data-theme=light] .app-shell .chat-message > small,
html[data-theme=light] .app-shell .chat-empty { color: #5d626b; }
html[data-theme=light] .app-shell .mini-action { color: #30343a; background: #fff; border-color: #bfc3ca; }
html[data-theme=light] .app-shell .directory-search input { color: #16181c; background: #fff; border-color: #bfc3ca; }
html[data-theme=light] .app-shell .status-message > p { color: #282b30; }
html[data-theme=light] .app-shell .radio-hardware { color: #f2f2f2; }
html[data-theme=light] .app-shell .safety-footer { background: #f8f9fb; color: #30343a; border-color: #c9cdd3; }
html[data-theme=light] .rack-collapse { color: #17191d; background: #fff; border-color: #bfc3ca; box-shadow: 0 4px 14px #25304520; }
html[data-theme=light] .mobile-nav { background: #f7f8faf4; border-color: #c9ccd2; }
html[data-theme=light] .mobile-nav button { color: #626873; }
html[data-theme=light] .mobile-nav button.is-active { color: #111318; background: #dfe2e8; }
html[data-theme=light] .workspace-modal { background: #f8f9fb; color: #191b20; border-color: #c1c5cc; }
html[data-theme=light] .workspace-modal header > p:not(.micro-label), html[data-theme=light] .voice-privacy,
html[data-theme=light] .emergency-audio-settings > div small { color: #555b65; }
html[data-theme=light] .workspace-modal input:not([type=checkbox]), html[data-theme=light] .workspace-modal select,
html[data-theme=light] .workspace-modal textarea { color: #181a1f; background: #fff; border-color: #b9bdc5; }
html[data-theme=light] .workspace-modal .voice-consent { color: #25282e; border-color: #babec6; }
html[data-theme=light] .code-row, html[data-theme=light] .archive-record { color: #25282e; background: #fff; border-color: #d0d3d8; }
html[data-theme=light] .code-row > b { color: #15171a; }
html[data-theme=light] .code-row.is-selected, html[data-theme=light] .code-row:hover { background: #e4e7ec; }
html[data-theme=light] .renew-screen { background: radial-gradient(ellipse at top, #fff, #e5e8ec 70%); }
html[data-theme=light] .recovery-card { background: #fff; border-color: #c9cdd4; box-shadow: 0 28px 80px #39435326; }
html[data-theme=light] .recovery-card h1, html[data-theme=light] .recovery-card label { color: #191b20; }
html[data-theme=light] .recovery-card p, html[data-theme=light] .recovery-card a { color: #575d67; }
html[data-theme=light] .recovery-card input { color: #17191d; background: #fff; border-color: #bfc3ca; }

html[data-theme=light] .admin-page-body { background: #edf0f4; color: #191b20; }
html[data-theme=light] .admin-page-topbar, html[data-theme=light] .admin-page-sidebar { background: #f8f9fbf5; border-color: #c9cdd3; }
html[data-theme=light] .admin-page-session a, html[data-theme=light] .admin-page-session button { color: #202329; background: #fff; border-color: #bfc4cc; }
html[data-theme=light] .admin-page-sidebar nav button { color: #555b65; }
html[data-theme=light] .admin-page-sidebar nav button:hover, html[data-theme=light] .admin-page-sidebar nav button.is-active { color: #17191d; background: #e1e5eb; border-color: #b9bec7; }
html[data-theme=light] .admin-page-content, html[data-theme=light] .admin-page-view { color: #1b1e23; }
html[data-theme=light] .admin-page .page-heading h1, html[data-theme=light] .admin-page .dashboard-metrics strong,
html[data-theme=light] .admin-page .dashboard-feed strong { color: #17191d; }
html[data-theme=light] .admin-page .dashboard-metrics article, html[data-theme=light] .admin-page .dashboard-grid > section,
html[data-theme=light] .admin-page .channel-admin-card, html[data-theme=light] .admin-page .admin-channel-nav,
html[data-theme=light] .password-request-card { background: #fff; border-color: #cbd0d7; }
html[data-theme=light] .admin-page input, html[data-theme=light] .admin-page select, html[data-theme=light] .admin-page textarea { color: #17191d; background: #fff; border-color: #bfc4cc; }
html[data-theme=light] .admin-page .user-table-wrap { border-color: #c7ccd4; background: #fff; box-shadow: 0 12px 30px #2530470a; }
html[data-theme=light] .admin-page .user-table { color: #202329; background: #fff; }
html[data-theme=light] .admin-page .user-table th { color: #59616d; background: #eef1f5; border-color: #d4d7dc; }
html[data-theme=light] .admin-page .user-table td { color: #343b45; background: #fff; border-color: #d4d7dc; }
html[data-theme=light] .admin-page .user-table tbody tr:hover td { background: #f6f8fa; }
html[data-theme=light] .admin-page .table-user > span { color: #303740; background: #f1f3f6; border-color: #b7bec8; }
html[data-theme=light] .admin-page .table-user strong { color: #171b20; }
html[data-theme=light] .admin-page .table-user small { color: #646d79; }
html[data-theme=light] .admin-page .table-badge,
html[data-theme=light] .admin-page .status-pill { color: #343b45; background: #f8f9fb; border-color: #aeb5bf; }
html[data-theme=light] .admin-page .status-pill.is-active { color: #17663e; background: #edf8f2; border-color: #75b491; }
html[data-theme=light] .admin-page .admin-page-note { color: #262b32; background: #fff; border-color: #7b8491; }
html[data-theme=light] .admin-page .admin-page-note p { color: #59616c; }
html[data-theme=light] .admin-page .page-heading, html[data-theme=light] .admin-page .dashboard-grid > section > header { border-color: #cbd0d7; }
html[data-theme=light] .admin-page .page-heading p:last-child, html[data-theme=light] .admin-page .dashboard-metrics span,
html[data-theme=light] .admin-page .dashboard-metrics small, html[data-theme=light] .admin-page .feed-item small { color: #606873; }
html[data-theme=light] .admin-page .dashboard-feed .feed-item { color: #22272e; background: #f0f2f5; border-color: #7d8794; }
html[data-theme=light] .admin-page .dashboard-feed .feed-item span { color: #4e5662; }
html[data-theme=light] .admin-page .page-toolbar, html[data-theme=light] .admin-page .admin-log-filters { background: #fff; border-color: #cbd0d7; }
html[data-theme=light] .admin-page .pagination button, html[data-theme=light] .admin-page .table-actions button,
html[data-theme=light] .admin-page .admin-request-card button, html[data-theme=light] .admin-page .sos-log-actions button { color: #22272e; background: #fff; border-color: #aeb5bf; }
html[data-theme=light] .admin-page .table-actions button:first-child, html[data-theme=light] .admin-page .admin-request-card .is-approve { color: #fff; background: #22272e; border-color: #22272e; }
html[data-theme=light] .admin-page .admin-request-card, html[data-theme=light] .admin-page .sos-log-card,
html[data-theme=light] .admin-page .channel-create-form { color: #20252c; background: #fff; border-color: #cbd0d7; }
html[data-theme=light] .admin-page .admin-request-card blockquote, html[data-theme=light] .admin-page .sos-log-card blockquote { color: #343a43; background: #f0f2f5; border-color: #7b8491; }
html[data-theme=light] .admin-page .request-route b, html[data-theme=light] .admin-page .request-route strong,
html[data-theme=light] .admin-page .sos-log-meta > * { color: #3e4651; border-color: #b9c0c9; }
html[data-theme=light] .admin-page .channel-role-picks { color: #293039; background: #f3f5f8; border-color: #c7ccd4; }
html[data-theme=light] .admin-page .channel-role-picks label, html[data-theme=light] .admin-page .channel-lock-option { color: #343b45; }
html[data-theme=light] .admin-page .admin-channel-nav button { color: #515a66; }
html[data-theme=light] .admin-page .admin-channel-nav button.is-active { color: #fff; background: #303640; border-color: #303640; }
html[data-theme=light] .admin-page .admin-channel-nav button small { color: #747d89; }
html[data-theme=light] .admin-page .admin-channel-nav button.is-active small { color: #d8dde4; }
html[data-theme=light] .admin-page .channel-person-search, html[data-theme=light] .admin-page .admin-log-filters input,
html[data-theme=light] .admin-page .admin-log-filters select { color: #171b20; background: #fff; border-color: #bfc5ce; }
html[data-theme=light] .admin-page .admin-log-filters label { color: #4e5662; }
html[data-theme=light] .admin-edit-dialog, html[data-theme=light] .complaint-dialog { color: #1b1f25; background: #f8f9fb; border-color: #bfc5ce; }
html[data-theme=light] .admin-edit-dialog .field-wrap, html[data-theme=light] .admin-edit-dialog input,
html[data-theme=light] .admin-edit-dialog select, html[data-theme=light] .complaint-dialog textarea { color: #171b20; background: #fff; border-color: #b9c0c9; }
html[data-theme=light] .admin-edit-dialog .modal-close, html[data-theme=light] .complaint-dialog .modal-close { color: #252b33; background: #fff; border-color: #b7bec8; }
html[data-theme=light] .admin-page-error { color: #1b1f25; background: #eef1f5; }
html[data-theme=light] .admin-page-error a { color: #fff; background: #242a32; border-color: #242a32; }

@media (prefers-reduced-motion: reduce) {
  .emergency-alert-overlay.is-pulsing, .channel-crown { animation: none; transition: none; }
}

/* Hilal / Merkez — private AI dispatcher drawer. */
.hilal-open-button { border-color: #565b69; background: linear-gradient(135deg, #20242d, #111318); color: #f5f7fb; }
.hilal-open-button > span { display: grid; place-items: center; width: 24px; height: 24px; padding: 0; border-radius: 50%; border-color: #8994aa; background: #e7ebf3; color: #171a20; font-weight: 950; }
.hilal-open-button:hover { border-color: #929bad; background: linear-gradient(135deg, #2c323e, #171a20); }
.hilal-center { --hilal-panel: #0b0d11; --hilal-raised: #14171d; --hilal-line: #303641; position: fixed; z-index: 140; inset: 0 0 0 auto; width: min(460px, calc(100vw - 28px)); display: grid; grid-template-rows: auto auto auto minmax(150px,1fr) auto auto auto; color: #eff2f7; background: radial-gradient(circle at 82% 0, #263045 0, transparent 260px), linear-gradient(160deg, #11141a, var(--hilal-panel) 45%); border-left: 1px solid #434b59; box-shadow: -24px 0 70px #000b; transform: translateX(calc(100% + 34px)); visibility: hidden; transition: transform .24s ease, visibility 0s linear .24s; }
.hilal-center.is-open { transform: translateX(0); visibility: visible; transition-delay: 0s; }
.hilal-center__header { min-height: 94px; display: grid; grid-template-columns: 52px minmax(0,1fr) 38px; align-items: center; gap: 13px; padding: max(18px, env(safe-area-inset-top)) 18px 16px; border-bottom: 1px solid var(--hilal-line); background: #0a0c10bd; backdrop-filter: blur(18px); }
.hilal-center__header > div:nth-child(2) { min-width: 0; }
.hilal-center__header .micro-label { color: #a9b5ca; font-size: 8px; }
.hilal-center__header h2 { margin: 3px 0 1px; font-size: 24px; line-height: 1; letter-spacing: -.025em; }
.hilal-center__header p:last-child { margin: 5px 0 0; color: #939baa; font-size: 10px; font-weight: 650; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hilal-avatar { position: relative; width: 50px; height: 50px; display: grid; place-items: center; border: 1px solid #697489; border-radius: 50%; background: radial-gradient(circle at 34% 28%, #f6f8fc, #b8c0cf 50%, #596274); color: #151922; box-shadow: 0 0 0 5px #dce4f00b, 0 8px 22px #0007; }
.hilal-avatar span { font: 950 22px var(--font-ui); }
.hilal-avatar i { position: absolute; right: -1px; bottom: 2px; width: 12px; height: 12px; border: 2px solid #10141b; border-radius: 50%; background: #667080; }
.hilal-avatar i.is-online { background: #7ee0a3; box-shadow: 0 0 10px #59d98d; }
.hilal-center__close { width: 38px; height: 38px; border: 1px solid #38404d; border-radius: 8px; background: #12161d; color: #cbd1dc; font: 500 25px/1 var(--font-ui); cursor: pointer; }
.hilal-center__close:hover { background: #242a34; color: white; }
.hilal-presence { min-height: 59px; display: grid; grid-template-columns: 10px minmax(0,1fr) auto; align-items: center; gap: 10px; padding: 11px 18px; border-bottom: 1px solid var(--hilal-line); background: #0d1015; }
.hilal-presence__led { width: 8px; height: 8px; border-radius: 50%; background: #69717e; box-shadow: 0 0 0 4px #69717e19; }
.hilal-presence__led.is-ready { background: #78dfa0; box-shadow: 0 0 10px #52d687; }
.hilal-presence__led.is-listening { background: #ff5d72; box-shadow: 0 0 13px #ff405d; animation: hilal-listening .75s ease-in-out infinite alternate; }
.hilal-presence__led.is-thinking { background: #e4bf6a; box-shadow: 0 0 11px #e4b64c; animation: hilal-listening 1.1s ease-in-out infinite alternate; }
.hilal-presence__led.is-speaking { background: #78b9ff; box-shadow: 0 0 12px #4ea3ff; }
.hilal-presence > div small, .hilal-presence > div strong { display: block; }
.hilal-presence > div small { color: #747e8e; font: 800 8px var(--font-mono); letter-spacing: .12em; }
.hilal-presence > div strong { margin-top: 4px; color: #e4e8ef; font-size: 11px; letter-spacing: .04em; }
.hilal-mode-label { max-width: 108px; padding: 6px 8px; border: 1px solid #343c49; border-radius: 16px; color: #aab2bf; background: #171b22; font: 800 8px var(--font-mono); letter-spacing: .08em; text-align: center; }
@keyframes hilal-listening { to { transform: scale(1.35); opacity: .7; } }

.hilal-admin-alerts { margin: 12px 16px 0; border: 1px solid #633d45; border-left: 3px solid #ff6378; border-radius: 10px; background: #2a1117; overflow: hidden; }
.hilal-admin-alerts > header { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 12px; }
.hilal-admin-alerts > header small, .hilal-admin-alerts > header strong { display: block; }
.hilal-admin-alerts > header small { color: #ff95a4; font: 800 8px var(--font-mono); letter-spacing: .12em; }
.hilal-admin-alerts > header strong { margin-top: 4px; font-size: 12px; }
.hilal-admin-alerts > header > span { min-width: 26px; height: 26px; display: grid; place-items: center; border-radius: 50%; background: #ff5a70; color: #22050a; font: 900 11px var(--font-mono); }
.hilal-admin-alerts > div { max-height: 126px; overflow: auto; border-top: 1px solid #633d45; }
.hilal-admin-alert { padding: 10px 12px; border-bottom: 1px solid #ffffff0c; }
.hilal-admin-alert:last-child { border-bottom: 0; }
.hilal-admin-alert strong, .hilal-admin-alert small { display: block; }
.hilal-admin-alert strong { font-size: 11px; line-height: 1.45; }
.hilal-admin-alert p { margin: 5px 0; color: #e9bbc2; font-size: 10px; line-height: 1.5; overflow-wrap: anywhere; }
.hilal-admin-alert small { color: #a98d92; font-size: 9px; }

.hilal-conversation { min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 18px 16px; scroll-behavior: smooth; }
.hilal-empty { min-height: 100%; display: grid; place-content: center; justify-items: center; text-align: center; padding: 28px; color: #9ba4b3; }
.hilal-empty > span { width: 58px; height: 58px; display: grid; place-items: center; margin-bottom: 15px; border: 1px solid #4a5362; border-radius: 50%; color: #dfe4ed; background: #171c24; font-size: 23px; font-weight: 950; }
.hilal-empty strong { color: #e3e7ee; font-size: 14px; }
.hilal-empty p { max-width: 310px; margin: 8px 0 0; color: #8f98a7; font-size: 11px; line-height: 1.65; }
.hilal-message { max-width: 88%; margin: 0 0 13px; }
.hilal-message.is-user { margin-left: auto; }
.hilal-message > small { display: block; margin: 0 7px 5px; color: #788291; font-size: 9px; font-weight: 700; }
.hilal-message.is-user > small { text-align: right; }
.hilal-message > div { padding: 11px 13px; border: 1px solid #343b47; border-radius: 6px 15px 15px 15px; background: var(--hilal-raised); color: #e9ecf2; font-size: 13px; font-weight: 600; line-height: 1.55; white-space: pre-wrap; overflow-wrap: anywhere; }
.hilal-message.is-user > div { border-color: #626b7a; border-radius: 15px 6px 15px 15px; background: #e5e9f0; color: #171a20; }
.hilal-message.is-system { max-width: 100%; }
.hilal-message.is-system > div { border-style: dashed; border-radius: 8px; color: #abb3c0; background: #0c0f14; font-size: 11px; }
.hilal-message audio { width: 100%; height: 34px; margin-top: 9px; }
.hilal-feedback { min-height: 18px; margin: 0; padding: 0 17px 7px; color: #98a2b1; font-size: 10px; font-weight: 650; line-height: 1.5; }
.hilal-feedback.is-error { color: #ff9cab; }

.hilal-voice-control { padding: 10px 16px 12px; border-top: 1px solid var(--hilal-line); background: #0d1015; }
.hilal-voice-control > p { margin: 8px 2px 0; color: #7d8796; font-size: 9px; line-height: 1.5; text-align: center; }
.hilal-ptt { position: relative; width: 100%; min-height: 66px; display: grid; place-items: center; overflow: hidden; border: 1px solid #616b7c; border-radius: 14px; background: linear-gradient(155deg, #e9edf3, #aeb7c6); color: #151922; cursor: pointer; box-shadow: inset 0 1px #fff, 0 8px 22px #0007; touch-action: none; user-select: none; }
.hilal-ptt > span:last-child { position: relative; z-index: 1; }
.hilal-ptt b, .hilal-ptt small { display: block; }
.hilal-ptt b { font: 950 16px var(--font-ui); letter-spacing: .06em; }
.hilal-ptt small { margin-top: 4px; font: 800 8px var(--font-mono); letter-spacing: .13em; }
.hilal-ptt__pulse { position: absolute; width: 18px; height: 18px; border-radius: 50%; background: #ff3d58; opacity: 0; }
.hilal-ptt.is-held { color: #fff; border-color: #ff7184; background: linear-gradient(145deg, #861827, #3a0d14); }
.hilal-ptt.is-held .hilal-ptt__pulse { opacity: .75; animation: hilal-ptt-wave 1s ease-out infinite; }
.hilal-ptt:disabled { cursor: not-allowed; opacity: .42; box-shadow: none; }
@keyframes hilal-ptt-wave { from { transform: scale(.5); } to { transform: scale(20); opacity: 0; } }
.hilal-voice-preview { width: 100%; min-height: 34px; margin-top: 8px; border: 1px solid #4d596a; border-radius: 9px; background: #171c24; color: #cbd5e4; font: 850 9px var(--font-mono); letter-spacing: .08em; cursor: pointer; }
.hilal-voice-preview:hover { border-color: #8da0bd; background: #202733; color: #fff; }
.hilal-voice-preview:disabled { cursor: wait; opacity: .55; }
.hilal-message-form { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 8px; padding: 12px 16px; border-top: 1px solid var(--hilal-line); background: #0a0d12; }
.hilal-message-form textarea { width: 100%; min-height: 46px; max-height: 120px; resize: none; border: 1px solid #3a424f; border-radius: 10px; padding: 12px; color: #f1f3f7; background: #151920; font: 600 14px/1.4 var(--font-ui); outline: none; }
.hilal-message-form textarea:focus { border-color: #9aa7bc; box-shadow: 0 0 0 3px #8495af25; }
.hilal-message-form textarea:disabled { opacity: .55; }
.hilal-message-form button { min-width: 76px; border: 1px solid #c9d0dc; border-radius: 9px; background: #e9edf3; color: #151820; font: 900 10px var(--font-mono); cursor: pointer; }
.hilal-message-form button:disabled { cursor: not-allowed; opacity: .45; }
.hilal-privacy { margin: 0; padding: 0 17px max(14px, env(safe-area-inset-bottom)); color: #687282; background: #0a0d12; font-size: 8px; font-weight: 650; line-height: 1.5; }
.hilal-panel-backdrop { display: none; position: fixed; z-index: 139; inset: 0; width: 100%; height: 100%; border: 0; background: #0009; backdrop-filter: blur(2px); }

html[data-theme=light] .hilal-center { --hilal-panel: #f5f7fa; --hilal-raised: #fff; --hilal-line: #cbd1da; color: #191d24; background: radial-gradient(circle at 82% 0, #dfe7f4 0, transparent 260px), linear-gradient(160deg, #fff, var(--hilal-panel) 45%); border-color: #b9c0cb; box-shadow: -24px 0 60px #33405535; }
html[data-theme=light] .hilal-center__header, html[data-theme=light] .hilal-presence { background: #f7f9fce8; }
html[data-theme=light] .hilal-center__header h2, html[data-theme=light] .hilal-presence > div strong, html[data-theme=light] .hilal-empty strong { color: #171b22; }
html[data-theme=light] .hilal-center__header p:last-child, html[data-theme=light] .hilal-empty p { color: #5d6673; }
html[data-theme=light] .hilal-center__close, html[data-theme=light] .hilal-mode-label { color: #303640; background: #fff; border-color: #bdc4cf; }
html[data-theme=light] .hilal-empty > span { color: #202630; background: #e7ebf1; border-color: #b8c0cc; }
html[data-theme=light] .hilal-message > div { color: #252a32; background: #fff; border-color: #cbd1da; }
html[data-theme=light] .hilal-message.is-user > div { color: #fff; background: #2d3440; border-color: #2d3440; }
html[data-theme=light] .hilal-message.is-system > div { color: #5c6572; background: #eef1f5; }
html[data-theme=light] .hilal-voice-control, html[data-theme=light] .hilal-message-form, html[data-theme=light] .hilal-privacy { background: #f2f4f7; }
html[data-theme=light] .hilal-message-form textarea { color: #171b21; background: #fff; border-color: #b8c0cc; }
html[data-theme=light] { color-scheme: light; }
html[data-theme=dark] { color-scheme: dark; }

/* Account security and phishing-resistant sign-in */
.auth-divider { display: flex; align-items: center; gap: 12px; margin: 18px 0 12px; color: #74747d; font: 700 10px/1 var(--font-mono); text-transform: uppercase; letter-spacing: .12em; }
.auth-divider::before, .auth-divider::after { content: ""; flex: 1; height: 1px; background: #303035; }
.discord-auth-button { width: 100%; min-height: 56px; display: grid; grid-template-columns: 36px minmax(0, 1fr); grid-template-rows: auto auto; column-gap: 11px; row-gap: 2px; align-items: center; border: 1px solid #5865f2; border-radius: 8px; padding: 9px 12px; color: #fff; background: #313a93; text-align: left; cursor: pointer; }
.discord-auth-button > span { grid-row: 1 / 3; width: 34px; height: 34px; display: grid; place-items: center; border-radius: 9px; color: #313a93; background: #fff; font: 900 15px var(--font-mono); }
.discord-auth-button strong { font: 800 11px/1.2 var(--font-mono); letter-spacing: .04em; }.discord-auth-button small { margin-top: 3px; color: #dfe2ff; font-size: 10px; }
.auth-form > .passkey-login-button + .discord-auth-button { margin-top: 10px; }
.discord-registration-notice { display: grid; gap: 4px; margin: 0 0 20px; border: 1px solid #5865f2; border-radius: 8px; padding: 12px 13px; background: rgba(88,101,242,.12); }.discord-registration-notice strong { color: #9ca5ff; font: 900 10px var(--font-mono); letter-spacing: .08em; }.discord-registration-notice span { color: #fff; font-weight: 800; }.discord-registration-notice small { color: #b9b9c3; line-height: 1.5; }
.auth-form.requires-discord:not(.discord-verified) > :not(header):not(#discord-register):not(#register-status) { display: none !important; }
.auth-form.requires-discord:not(.discord-verified) #discord-register { display: grid; margin-top: 20px; }
.discord-link-card { position: relative; width: min(100%, 590px); overflow: hidden; }
.discord-link-card::before { content: ""; position: absolute; inset: 0 0 auto; height: 5px; background: #5865f2; }
.discord-link-emblem { width: 58px; height: 58px; display: grid; place-items: center; margin-bottom: 18px; border-radius: 17px; color: #5865f2; background: #fff; font: 950 25px/1 var(--font-mono); box-shadow: 0 0 0 1px #5865f2, 0 12px 30px #5865f230; }
.discord-link-card > label { display: block; margin: 22px 0 7px; font-weight: 800; }
.discord-link-card > input { width: 100%; min-height: 48px; border: 1px solid #3d3e47; border-radius: 8px; padding: 10px 12px; color: #f4f4f6; background: #0a0a0d; }
.discord-link-action { margin-top: 12px; }
.windows-download-card { display: grid; grid-template-columns: 56px minmax(0, 1fr) auto; align-items: center; gap: 14px; margin-top: 22px; border: 1px solid #38445a; border-radius: 12px; padding: 15px; background: linear-gradient(135deg, #111722, #0e1015); }
.windows-download-card[hidden] { display: none !important; }
.windows-download-icon { width: 52px; height: 52px; display: grid; place-items: center; border: 1px solid #58739e; border-radius: 11px; color: #dce9ff; background: #17243a; font: 900 10px/1 var(--font-mono); letter-spacing: .08em; }
.windows-download-card > div { min-width: 0; }
.windows-download-card > div > small { color: #7897c8; font: 850 9px/1 var(--font-mono); letter-spacing: .09em; }
.windows-download-card > div > strong { display: block; margin-top: 5px; color: #f2f5fa; font-size: 15px; }
.windows-download-card > div > p { margin: 5px 0 0; color: #99a3b1; font-size: 10px; line-height: 1.45; }
.windows-download-card > a { border: 1px solid #e8edf5; border-radius: 8px; padding: 11px 13px; color: #10141a; background: #f2f5fa; font: 900 9px/1 var(--font-mono); letter-spacing: .06em; text-decoration: none; white-space: nowrap; }
.windows-download-card > small:last-child { grid-column: 2 / -1; margin: -8px 0 0; color: #6f7987; font: 700 9px/1 var(--font-mono); }
.passkey-login-button { width: 100%; display: grid; grid-template-columns: 34px 1fr; grid-template-rows: auto auto; align-items: center; text-align: left; gap: 3px 10px; border: 1px solid #55565f; border-radius: 8px; padding: 11px 13px; color: #eeeef2; background: #141419; cursor: pointer; }
.passkey-login-button > span { grid-row: 1 / 3; display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid #777884; border-radius: 50%; font-size: 18px; }
.passkey-login-button strong { font: 800 11px/1.2 var(--font-mono); letter-spacing: .05em; }
.passkey-login-button small { color: #999aa5; font-size: 10px; }
.passkey-login-button:hover, .passkey-login-button:focus-visible { border-color: #eeeef2; background: #1b1b22; outline: none; }
.mfa-login-card { width: min(100%, 570px); }
.mfa-method-buttons { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 22px 0 14px; }
.mfa-method-buttons button { min-height: 48px; border: 1px solid #3e3e48; border-radius: 8px; padding: 10px; color: #c7c7cf; background: #16161b; font: 700 11px/1.3 var(--font-mono); cursor: pointer; }
.mfa-method-buttons button.is-active { color: #111; border-color: #f1f1f3; background: #f1f1f3; }

.settings-modal { width: min(94vw, 940px); height: min(92dvh, 880px); max-height: calc(100dvh - 24px); border-radius: 14px; overflow: hidden; }
.settings-modal__inner { height: 100%; min-height: 0; max-height: none; padding: 0; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; background: #0b0b0e; scrollbar-gutter: stable; }
.settings-modal .modal-close { position: sticky; z-index: 4; top: 14px; float: right; margin: 0 14px -36px 0; border-radius: 8px; }
.settings-heading { min-height: 126px; display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; padding: 28px 68px 22px 28px; border-bottom: 1px solid #303036; background: radial-gradient(circle at 82% 0, #2b2b33, transparent 220px), #111116; }
.settings-heading h2 { margin: 5px 0 0; font-size: clamp(24px, 4vw, 34px); letter-spacing: -.035em; }
.settings-heading p:last-child { max-width: 590px; margin: 8px 0 0; }
.settings-heading__status { flex: 0 0 auto; border: 1px solid #474750; border-radius: 999px; padding: 7px 10px; color: #aaaab4; font: 800 9px/1 var(--font-mono); letter-spacing: .09em; }
.settings-tabs { position: sticky; z-index: 3; top: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-bottom: 1px solid #303036; background: #0d0d11ed; backdrop-filter: blur(16px); }
.settings-tabs button { min-width: 0; min-height: 68px; display: grid; grid-template-columns: 28px minmax(0, 1fr); grid-template-rows: auto auto; align-content: center; gap: 3px 9px; border: 0; border-right: 1px solid #2d2d33; border-bottom: 3px solid transparent; padding: 11px 18px; color: #8f8f99; background: transparent; text-align: left; cursor: pointer; }
.settings-tabs button:last-child { border-right: 0; }
.settings-tabs button > span { grid-row: 1 / 3; align-self: center; color: #686872; font: 800 10px/1 var(--font-mono); }
.settings-tabs button strong { color: inherit; font: 900 12px/1 var(--font-mono); letter-spacing: .08em; }
.settings-tabs button small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #74747e; font-size: 10px; }
.settings-tabs button:hover { color: #d5d5dc; background: #17171c; }
.settings-tabs button.is-active { color: #f4f4f6; border-bottom-color: #f4f4f6; background: #18181e; }
.settings-tabs button.is-active > span { color: #f4f4f6; }
.settings-panel { min-height: 420px; margin: 0; border: 0; padding: 28px 28px max(42px, env(safe-area-inset-bottom)); background: #0b0b0e; }
.settings-panel[hidden] { display: none !important; }
.settings-panel .field-label { margin-top: 15px; }
.settings-panel > .primary-action { margin-top: 20px; }
.settings-panel .settings-profile-row { margin-bottom: 18px; border: 1px solid #303036; border-radius: 12px; padding: 16px; background: #111116; }
.settings-panel .password-change { margin-top: 18px; border: 1px solid #303036; border-radius: 10px; padding: 13px 15px; background: #101014; }
.settings-panel .password-change[open] summary { margin-bottom: 12px; }
.settings-panel .password-change summary { font-weight: 800; }
.role-derivation { display: grid; gap: 5px; margin-top: 14px; border: 1px solid #34343b; border-left: 4px solid #7f8a9d; border-radius: 8px; padding: 11px 13px; background: #111116; }
.role-derivation > span { color: #858691; font: 800 9px/1 var(--font-mono); letter-spacing: .09em; }
.role-derivation > strong { color: #f1f1f3; font-size: 13px; }
.role-derivation > small { color: #8f9099; font-size: 10px; line-height: 1.45; }

.security-settings { --security-card: #101014; --security-raised: #15151a; --security-line: #34343b; }
.security-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(260px, .72fr); align-items: stretch; gap: 14px; }
.security-hero > header { padding: 6px 2px; }
.security-settings h3 { margin: 6px 0 0; color: #f4f4f6; font-size: clamp(20px, 3vw, 26px); letter-spacing: -.025em; }
.security-hero > header > p:last-child { max-width: 520px; margin-top: 8px; color: #9696a0; font-size: 11px; line-height: 1.55; }
.security-summary { min-height: 100%; display: grid; align-content: center; gap: 8px; border: 1px solid #46464e; border-left-width: 4px; border-radius: 12px; padding: 16px; background: linear-gradient(145deg, #16161c, #101014); }
.security-summary strong { color: #f0f0f2; font: 900 11px/1 var(--font-mono); letter-spacing: .1em; }
.security-summary span { color: #aaaab3; font-size: 11px; line-height: 1.55; }
.security-summary.is-protected { border-left-color: #60d394; background: linear-gradient(145deg, #132019, #101514); }
.security-summary.is-protected strong { color: #82e5ac; }
.security-summary.is-warning { border-left-color: #ffb74d; background: linear-gradient(145deg, #211b13, #14120f); }
.security-summary.is-warning strong { color: #ffc46b; }
.security-password-gate { display: grid; grid-template-columns: minmax(240px, .9fr) minmax(300px, 1.15fr); align-items: center; gap: 22px; margin-top: 18px; border: 1px solid #45454e; border-radius: 12px; padding: 16px; background: #131318; box-shadow: inset 0 1px #ffffff08; }
.security-password-copy { display: grid; grid-template-columns: 38px minmax(0, 1fr); align-items: center; gap: 12px; }
.security-password-copy > span { width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid #5a5a65; border-radius: 10px; color: #e8e8ed; background: #1d1d24; font: 900 10px/1 var(--font-mono); }
.security-password-copy strong, .security-password-copy small { display: block; }
.security-password-copy strong { color: #f0f0f3; font-size: 13px; }
.security-password-copy small { margin-top: 5px; color: #8d8d97; font-size: 10px; line-height: 1.45; }
.security-password-control > label { display: block; margin-bottom: 6px; color: #c1c1c9; font-size: 11px; font-weight: 800; }
.security-password-control > small { display: block; margin-top: 5px; color: #777782; font-size: 9px; }
.security-password-control .field-wrap { border-radius: 8px; background: #09090c; }
.security-group-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-top: 28px; padding: 0 2px 11px; border-bottom: 1px solid #303036; }
.security-group-heading h4 { margin: 5px 0 0; color: #ededf0; font-size: 15px; }
.security-group-heading > span { color: #81818b; font: 700 9px/1.3 var(--font-mono); text-align: right; }
.security-method-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-top: 14px; }
.security-method-card { position: relative; display: flex; min-width: 0; flex-direction: column; overflow: hidden; border: 1px solid var(--security-line); border-radius: 12px; padding: 16px; background: linear-gradient(150deg, var(--security-raised), var(--security-card)); transition: border-color .18s, transform .18s, box-shadow .18s; }
.security-method-card:hover { border-color: #555561; box-shadow: 0 12px 28px #0000002e; }
.security-method-card.is-configured { border-color: #3d7658; box-shadow: inset 0 3px #55c487; }
.security-method-card.is-unavailable { opacity: .68; }
.security-method-card.is-recommended:not(.is-configured)::before { content: "ÖNERİLEN"; position: absolute; top: 0; right: 16px; padding: 4px 8px; border-radius: 0 0 6px 6px; color: #111318; background: #e8e9ed; font: 900 8px/1 var(--font-mono); letter-spacing: .08em; }
.security-method-head { display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; align-items: start; gap: 11px; min-height: 66px; }
.security-method-icon { width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid #51515c; border-radius: 11px; color: #e2e2e8; background: #202027; font: 900 12px/1 var(--font-mono); }
.security-method-icon.is-discord { color: #fff; background: #5865f2; border-color: #7580ff; }
.security-method-head strong, .security-method-head small { display: block; }
.security-method-head strong { color: #eeeef1; font-size: 13px; line-height: 1.3; }
.security-method-head small { margin-top: 5px; color: #8f8f99; font-size: 10px; line-height: 1.45; }
.security-method-head em { align-self: start; border: 1px solid #4b4b55; border-radius: 999px; padding: 5px 7px; color: #8f8f99; background: #0d0d11; font: 800 7px/1 var(--font-mono); font-style: normal; letter-spacing: .06em; white-space: nowrap; }
.security-method-card.is-configured .security-method-head em { color: #85e2ab; background: #102019; border-color: #377251; }
.security-method-card > input, .totp-setup-panel input, #email-setup-panel input { width: 100%; min-height: 42px; margin-top: 10px; border: 1px solid #41414a; border-radius: 8px; outline: none; padding: 9px 11px; color: #eee; background: #09090c; font-size: 12px; }
.security-method-card > input:focus, .totp-setup-panel input:focus, #email-setup-panel input:focus { border-color: #a0a0aa; box-shadow: 0 0 0 3px #ffffff0b; }
.security-method-card .secondary-submit { min-height: 44px; margin-top: 10px; border-radius: 8px; }
.security-method-head + .secondary-submit { margin-top: auto; }
.security-remove { align-self: flex-start; margin-top: 12px; border: 0; padding: 4px 0; color: #ff98a7; background: transparent; text-decoration: underline; text-underline-offset: 3px; font-size: 10px; cursor: pointer; }
.totp-setup-panel, #email-setup-panel { margin-top: 12px; padding-top: 12px; border-top: 1px solid #333339; }
.totp-setup-panel img { display: block; width: min(100%, 220px); margin: 0 auto; border-radius: 10px; background: #fff; box-shadow: 0 8px 24px #0005; }
.totp-setup-panel code { display: block; margin: 10px 0; overflow-wrap: anywhere; color: #d3d3dc; text-align: center; font-size: 11px; }
.security-device-list { display: grid; gap: 7px; margin-top: 11px; }
.security-device { display: flex; align-items: center; justify-content: space-between; gap: 9px; border-top: 1px solid #303036; padding-top: 9px; }
.security-device > span { min-width: 0; }
.security-device strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; }
.security-device button { border: 1px solid #573640; border-radius: 6px; padding: 6px 8px; color: #ff9eab; background: #1c1014; font: 700 8px/1 var(--font-mono); cursor: pointer; }
.security-empty { padding-top: 4px; }
.recovery-method-card { grid-column: 1 / -1; }
.recovery-method-card .security-method-head { min-height: auto; }
.recovery-method-action { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 16px; margin-top: 13px; border-top: 1px solid #303036; padding-top: 13px; }
.recovery-method-action p { margin: 0; color: #898994; font-size: 10px; line-height: 1.55; }
.recovery-method-action .secondary-submit { width: auto; min-width: 180px; margin: 0; padding: 0 14px; }
.security-settings > .form-status { position: sticky; z-index: 2; bottom: -22px; min-height: 0; margin: 14px -8px -18px; border-radius: 8px; padding: 0; background: #0b0b0eed; backdrop-filter: blur(12px); }
.security-settings > .form-status:not(:empty) { min-height: 42px; display: flex; align-items: center; border: 1px solid #3b3b43; padding: 10px 12px; }
.security-table-note { display: block; margin-top: 5px; color: #888e98; font: 700 9px/1.2 var(--font-mono); }
.security-table-note.is-on { color: #46b978; }
.recovery-codes-modal > div { position: relative; padding: 28px; }
.recovery-codes-modal pre { columns: 2; margin: 18px 0; border: 1px solid #3d3d45; border-radius: 9px; padding: 15px; color: #f2f2f5; background: #08080b; font: 700 13px/1.9 var(--font-mono); user-select: all; }

html[data-theme=light] .settings-modal, html[data-theme=light] .recovery-codes-modal { color: #1b1e23; background: #f8f9fb; border-color: #bfc4cc; }
html[data-theme=light] .settings-modal__inner, html[data-theme=light] .settings-section, html[data-theme=light] .settings-panel { background: #f8f9fb; }
html[data-theme=light] .settings-heading { background: radial-gradient(circle at 82% 0, #d9dee7, transparent 220px), #f4f6f9; border-color: #cbd0d7; }
html[data-theme=light] .settings-heading__status { color: #535a65; border-color: #bfc5ce; }
html[data-theme=light] .settings-tabs { background: #f7f8faed; border-color: #cbd0d7; }
html[data-theme=light] .settings-tabs button { color: #626873; border-color: #d1d5db; }
html[data-theme=light] .settings-tabs button small, html[data-theme=light] .settings-tabs button > span { color: #707782; }
html[data-theme=light] .settings-tabs button:hover { color: #181b20; background: #e9ecf1; }
html[data-theme=light] .settings-tabs button.is-active { color: #16191e; border-bottom-color: #16191e; background: #fff; }
html[data-theme=light] .settings-panel .settings-profile-row, html[data-theme=light] .settings-panel .password-change { background: #fff; border-color: #cbd0d7; }
html[data-theme=light] .settings-avatar-preview { color: #303640; background: #eef1f5; border-color: #aeb5bf; }
html[data-theme=light] .settings-profile-row input[type=file], html[data-theme=light] .text-action, html[data-theme=light] .password-change summary { color: #4e5662; }
html[data-theme=light] .settings-panel .secondary-submit { color: #fff; background: #20242a; border-color: #20242a; }
html[data-theme=light] .settings-panel .secondary-submit:hover { background: #343943; border-color: #343943; }
html[data-theme=light] .role-derivation { background: #fff; border-color: #c4c9d1; }
html[data-theme=light] .role-derivation > strong { color: #181b20; }
html[data-theme=light] .role-derivation > span, html[data-theme=light] .role-derivation > small { color: #606773; }
html[data-theme=light] .settings-section, html[data-theme=light] .security-method-card { border-color: #ccd0d7; }
html[data-theme=light] .security-settings { --security-card: #fff; --security-raised: #f8fafc; --security-line: #c7ccd4; }
html[data-theme=light] .security-settings h3, html[data-theme=light] .security-group-heading h4 { color: #17191d; }
html[data-theme=light] .security-hero > header > p:last-child, html[data-theme=light] .security-group-heading > span { color: #5b6370; }
html[data-theme=light] .security-summary { color: #1b1e23; background: linear-gradient(145deg, #fff, #f4f6f9); border-color: #b9c0ca; }
html[data-theme=light] .security-summary.is-protected { background: linear-gradient(145deg, #f5fcf8, #edf7f1); }
html[data-theme=light] .security-summary.is-warning { background: linear-gradient(145deg, #fffaf2, #f8f2e8); }
html[data-theme=light] .security-password-gate { background: #fff; border-color: #c7ccd4; box-shadow: 0 10px 26px #2530470b; }
html[data-theme=light] .security-password-copy > span { color: #fff; background: #252b34; border-color: #252b34; }
html[data-theme=light] .security-password-copy strong, html[data-theme=light] .security-password-control > label { color: #1b1e23; }
html[data-theme=light] .security-password-copy small, html[data-theme=light] .security-password-control > small { color: #606874; }
html[data-theme=light] .security-password-control .field-wrap { background: #fff; border-color: #b9c0ca; }
html[data-theme=light] .security-group-heading { border-color: #ccd1d8; }
html[data-theme=light] .security-method-card { color: #1b1e23; background: linear-gradient(150deg, var(--security-raised), var(--security-card)); border-color: var(--security-line); }
html[data-theme=light] .security-method-card { background-color: #fff; }
html[data-theme=light] .security-method-card:hover { border-color: #979faa; box-shadow: 0 12px 28px #25304712; }
html[data-theme=light] .security-method-card.is-configured { border-color: #68a883; box-shadow: inset 0 3px #3ea66d; }
html[data-theme=light] .security-method-icon { color: #303741; background: #edf0f4; border-color: #aeb6c1; }
html[data-theme=light] .security-method-icon.is-discord { color: #fff; background: #5865f2; border-color: #4652d0; }
html[data-theme=light] .security-method-head em { color: #606874; background: #f1f3f6; border-color: #b8bfc9; }
html[data-theme=light] .security-method-card.is-configured .security-method-head em { color: #17663e; background: #edf8f2; border-color: #75b491; }
html[data-theme=light] .security-method-card.is-recommended:not(.is-configured)::before { color: #fff; background: #282e37; }
html[data-theme=light] .security-method-card strong, html[data-theme=light] .security-summary strong { color: #17191d; }
html[data-theme=light] .security-summary.is-protected strong { color: #167a48; }
html[data-theme=light] .security-summary.is-warning strong { color: #915600; }
html[data-theme=light] .security-method-card small, html[data-theme=light] .security-summary span { color: #5b616b; }
html[data-theme=light] .recovery-method-action { border-color: #d2d6dc; }
html[data-theme=light] .recovery-method-action p { color: #5e6672; }
html[data-theme=light] .security-settings > .form-status { background: #f8f9fbed; }
html[data-theme=light] .security-method-card > input, html[data-theme=light] .totp-setup-panel input, html[data-theme=light] #email-setup-panel input,
html[data-theme=light] .settings-modal .field-wrap, html[data-theme=light] .settings-modal .field-wrap input, html[data-theme=light] .settings-modal .field-wrap select,
html[data-theme=light] .settings-modal textarea { color: #17191d; background: #fff; border-color: #bdc2ca; }
html[data-theme=light] .recovery-codes-modal pre { color: #17191d; background: #fff; border-color: #c3c8d0; }
html[data-theme=light] .discord-link-card > input { color: #17191d; background: #fff; border-color: #bdc2ca; }
html[data-theme=light] .windows-download-card { background: linear-gradient(135deg, #fff, #edf2f8); border-color: #bac5d4; }
html[data-theme=light] .windows-download-icon { color: #fff; background: #243854; border-color: #506b91; }
html[data-theme=light] .windows-download-card > div > strong { color: #18202c; }
html[data-theme=light] .windows-download-card > div > p, html[data-theme=light] .windows-download-card > small:last-child { color: #5d6673; }
html[data-theme=light] .windows-download-card > a { color: #fff; background: #202b3b; border-color: #202b3b; }

@media (max-width: 760px) {
  .security-hero, .security-password-gate, .security-method-grid { grid-template-columns: 1fr; }
  .security-summary { min-height: 82px; }
}

@media (max-width: 680px) {
  .settings-modal { width: 100vw; max-width: none; height: 100dvh; max-height: 100dvh; border: 0; border-radius: 0; }
  .settings-modal__inner { height: 100%; max-height: none; }
  .settings-heading { min-height: 118px; padding: 24px 58px 18px 18px; }
  .settings-heading__status { display: none; }
  .settings-tabs button { min-height: 62px; grid-template-columns: 1fr; grid-template-rows: auto auto; gap: 4px; padding: 10px 8px; text-align: center; }
  .settings-tabs button > span { display: none; }
  .settings-tabs button strong { font-size: 10px; }
  .settings-tabs button small { font-size: 9px; }
  .settings-panel { min-height: calc(100dvh - 180px); padding: 20px 16px max(28px, env(safe-area-inset-bottom)); }
  .security-hero { gap: 12px; }
  .security-summary { min-height: 76px; }
  .security-password-gate { gap: 15px; padding: 14px; }
  .security-password-copy { align-items: start; }
  .security-group-heading { align-items: flex-start; flex-direction: column; gap: 7px; margin-top: 23px; }
  .security-group-heading > span { text-align: left; }
  .security-method-grid { grid-template-columns: 1fr; gap: 12px; }
  .security-method-card { padding: 14px; }
  .security-method-head { grid-template-columns: 42px minmax(0, 1fr); min-height: 0; }
  .security-method-head em { grid-column: 2; width: max-content; }
  .recovery-method-card { grid-column: auto; }
  .recovery-method-action { grid-template-columns: 1fr; gap: 11px; }
  .recovery-method-action .secondary-submit { width: 100%; min-width: 0; }
  .security-settings > .form-status { bottom: -12px; margin: 12px -4px -10px; }
  .mfa-method-buttons { grid-template-columns: 1fr; }
  .recovery-codes-modal pre { columns: 1; }
  .windows-download-card { grid-template-columns: 48px minmax(0, 1fr); }
  .windows-download-card > a { grid-column: 1 / -1; text-align: center; }
  .windows-download-card > small:last-child { grid-column: 1 / -1; margin: 0; text-align: center; }
}
html[data-theme=light] .hilal-open-button { border-color: #7c8798; background: linear-gradient(135deg, #eef2f7, #d8dee8); color: #17202b; }
html[data-theme=light] .hilal-open-button > span { background: #202a36; color: #fff; border-color: #5e6a79; }
html[data-theme=light] .hilal-open-button:hover { background: linear-gradient(135deg, #fff, #e1e7ef); color: #0d141d; }
html[data-theme=light] .console-heading__actions .tool-button:not(.hilal-open-button) { color: #25282d; background: #fff; border-color: #c2c5cb; }

@media (max-width: 800px) {
  .mobile-nav { grid-template-columns: repeat(5,1fr); }
  .hilal-panel-backdrop:not([hidden]) { display: block; }
  .mobile-hilal-button { position: relative; font-weight: 950; }
  .mobile-hilal-button > b { position: absolute; top: 1px; right: calc(50% - 22px); background: #ff526b; color: #fff; }
  .hilal-center { width: 100%; top: max(8px, env(safe-area-inset-top)); border: 1px solid #424a58; border-bottom: 0; border-radius: 18px 18px 0 0; }
  .hilal-center__header { min-height: 82px; padding-top: 14px; }
  .hilal-admin-alerts > div { max-height: 100px; }
  .hilal-conversation { padding: 14px 12px; }
  .hilal-voice-control { padding: 8px 12px 10px; }
  .hilal-ptt { min-height: 62px; }
  .hilal-message-form { padding: 10px 12px; }
  .console-heading { align-items: flex-start; flex-direction: column; gap: 10px; }
  .console-heading__actions { width: 100%; justify-content: flex-start; }
  .console-heading__actions .tool-button { flex: 1 1 0; min-width: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .hilal-center { transition: none; }
  .hilal-presence__led, .hilal-ptt__pulse { animation: none !important; }
}