:root {
  --bg: #080d18; --surface: #101a2b; --surface-2: #142238; --surface-3: #1a2b44; --line: #263b5b;
  --text: #f2f7ff; --muted: #91a4c0; --subtle: #617693; --cyan: #5de5dc; --blue: #50bfff;
  --violet: #9d8aff; --green: #4fe09d; --amber: #f6c65e; --red: #ff6f83; --gray: #738198;
  --shadow: 0 18px 60px rgba(0, 0, 0, .26); --radius: 14px; --rail: 250px;
}

:root[data-theme="alliance"] { --cyan: #b59aff; --blue: #8d7bff; --surface-2: #1d2140; }
:root[data-theme="clan"] { --cyan: #58edb0; --blue: #43d1bc; --surface-2: #122e35; }
:root[data-theme="personal"] { --cyan: #ffd475; --blue: #ffad5a; --surface-2: #332b24; }
:root[data-density="compact"] { --radius: 10px; }
* { box-sizing: border-box; }
html { min-width: 320px; background: var(--bg); }
body { margin: 0; min-width: 0; color: var(--text); background: radial-gradient(circle at 100% -10%, #204365 0, transparent 32rem), radial-gradient(circle at 0 100%, #17153c 0, transparent 32rem), var(--bg); font: 14px/1.5 Inter, "Segoe UI", system-ui, sans-serif; }
button, input, select, textarea { font: inherit; }
button { color: inherit; cursor: pointer; }
button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid var(--cyan); outline-offset: 2px; }
.app-shell { display: flex; min-height: 100vh; }
.sidebar { width: 264px; flex: 0 0 264px; min-height: 100vh; padding: 24px 16px 18px; display: flex; flex-direction: column; border-right: 1px solid var(--line); background: rgba(7, 15, 27, .88); backdrop-filter: blur(18px); z-index: 20; }
.brand, .profile-chip, .topbar, .top-actions, .topbar-leading, .card-heading, .welcome-row, .quick-actions, .filter-row, .subnav, .cp-toolbar, .event-title-row, .event-meta, .event-actions, .drop-row, .post-top, .setting-row, .session-summary, .role-switch, .connection-row, .widget-card-top, .widget-card-bottom, .widget-banner, .widget-banner-actions, .permission-note, .table-footer { display: flex; align-items: center; }
.brand { gap: 11px; padding: 0 10px 24px; }
.brand-mark { width: 36px; height: 36px; display: grid; place-items: center; color: var(--cyan); border: 1px solid var(--cyan); border-radius: 11px; box-shadow: 0 0 25px color-mix(in srgb, var(--cyan) 30%, transparent); font-size: 18px; }
.brand strong { display: block; font-size: 21px; line-height: 1; letter-spacing: .02em; }
.brand small, small, .eyebrow { color: var(--muted); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
.brand small { font-size: 8px; letter-spacing: .16em; }
.sidebar-close, .mobile-menu { display: none; }
.profile-chip { gap: 10px; padding: 11px; margin: 0 0 18px; border: 1px solid var(--line); border-radius: 12px; background: linear-gradient(135deg, #172942, #0d1727); }
.profile-chip b, .profile-chip small { display: block; }.profile-chip small { font-size: 10px; text-transform: none; letter-spacing: 0; }.profile-chip .status-dot { margin-left: auto; }
.avatar { width: 31px; height: 31px; flex: 0 0 auto; display: grid; place-items: center; overflow: hidden; border-radius: 9px; color: #09121e; background: linear-gradient(135deg, var(--violet), var(--cyan)); font-size: 11px; font-weight: 800; }.avatar img { width: 100%; height: 100%; display: block; object-fit: cover; }.avatar.mini { width: 25px; height: 25px; border-radius: 7px; }.avatar.small { width: 27px; height: 27px; border-radius: 8px; font-size: 10px; }
.scope-switcher { margin: 0 5px 20px; }.scope-switcher label { display: block; margin-bottom: 6px; color: var(--subtle); font-size: 10px; text-transform: uppercase; letter-spacing: .1em; }
.select, .input, .textarea { min-height: 37px; color: var(--text); border: 1px solid var(--line); border-radius: 9px; background: var(--surface); padding: 8px 11px; }.select option { background: var(--surface); }.compact-select { width: 100%; font-size: 12px; }
nav { display: grid; gap: 18px; overflow: auto; }.nav-group { display: grid; gap: 3px; }.nav-group-label { padding: 0 11px 6px; color: var(--subtle); font-size: 9px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
.nav-item { width: 100%; border: 0; border-radius: 9px; padding: 10px 11px; display: flex; gap: 12px; align-items: center; color: var(--muted); background: transparent; text-align: left; transition: .18s ease; }.nav-item b { width: 17px; color: var(--subtle); text-align: center; font-size: 15px; }.nav-item span { flex: 1; }.nav-item:hover, .nav-item.active { color: var(--text); background: linear-gradient(90deg, rgba(47, 101, 128, .45), rgba(25, 41, 66, .52)); }.nav-item.active { box-shadow: inset 2px 0 var(--cyan), 0 8px 20px rgba(0,0,0,.14); }.nav-item.active b { color: var(--cyan); }.nav-item.locked { opacity: .45; }.nav-item .lock { margin-left: auto; color: var(--subtle); font-size: 12px; }.sidebar-foot { margin-top: auto; padding: 18px 10px 0; border-top: 1px solid var(--line); }.sidebar-foot small { display: block; margin-top: 9px; font-size: 10px; letter-spacing: 0; text-transform: none; line-height: 1.35; }
.main { width: min(100%, 1600px); min-width: 0; flex: 1; margin: 0 auto; padding: 28px clamp(18px, 4vw, 54px) 60px; }.topbar { justify-content: space-between; gap: 20px; margin-bottom: 23px; }.topbar-leading { gap: 12px; }.top-actions { gap: 12px; }.eyebrow { color: var(--cyan); font-size: 10px; font-weight: 700; letter-spacing: .17em; }.view-subtitle { margin: 5px 0 0; color: var(--muted); font-size: 13px; }.topbar h1 { margin: 4px 0 0; font-size: 28px; line-height: 1.1; letter-spacing: -.04em; }
.connection-state { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: 11px; }.status-dot { display: inline-block; width: 7px; height: 7px; flex: 0 0 auto; border-radius: 50%; background: var(--gray); }.status-dot.active { background: var(--green); box-shadow: 0 0 11px var(--green); }.status-dot.pending { background: var(--amber); box-shadow: 0 0 11px var(--amber); }.status-dot.off { background: var(--gray); }.icon-button, .user-button, .row-menu { border: 1px solid var(--line); border-radius: 9px; background: var(--surface); }.icon-button { width: 36px; height: 36px; padding: 0; font-size: 16px; }.user-button { display: flex; gap: 8px; align-items: center; padding: 5px 10px 5px 5px; font-size: 12px; font-weight: 700; }.user-button > span:last-child { color: var(--muted); margin-left: 3px; }.notice-bar { min-height: 40px; margin-bottom: 24px; padding: 10px 14px; display: flex; align-items: center; gap: 9px; color: #c8d7e9; border: 1px solid #344363; border-radius: 10px; background: rgba(24, 38, 62, .72); font-size: 12px; transition: .2s; }.notice-bar.syncing { border-color: var(--cyan); box-shadow: 0 0 20px rgba(93,229,220,.14); }.notice-icon { color: var(--cyan); font-size: 16px; }.notice-bar .link-button { margin-left: auto; }
.user-menu-wrap { position: relative; }
.user-menu-popover { position: absolute; z-index: 90; top: calc(100% + 8px); right: 0; min-width: 224px; padding: 8px; border: 1px solid var(--line); border-radius: 12px; background: rgba(12, 23, 39, .98); box-shadow: 0 18px 46px rgba(0,0,0,.42); }
.user-menu-popover[hidden] { display: none; }
.user-menu-heading { display: grid; gap: 3px; padding: 8px 10px 10px; border-bottom: 1px solid rgba(76, 106, 143, .38); }
.user-menu-heading strong { color: var(--text); font-size: 12px; }
.user-menu-heading small { color: var(--muted); font-size: 10px; }
.user-menu-popover [role="menuitem"] { display: block; width: 100%; padding: 10px; border: 0; border-radius: 8px; color: var(--text); background: transparent; text-align: left; font: inherit; cursor: pointer; }
.user-menu-popover [role="menuitem"]:hover, .user-menu-popover [role="menuitem"]:focus-visible { background: rgba(74, 135, 177, .2); outline: none; }
.user-menu-popover [role="menuitem"].danger { color: #ff9b9b; }
.user-menu-divider { height: 1px; margin: 6px 4px; background: rgba(76, 106, 143, .38); }
.link-button, .row-link { border: 0; padding: 0; color: var(--cyan); background: transparent; font-size: 11px; }.link-button:hover, .row-link:hover { text-decoration: underline; }.view { min-width: 0; }.page-heading { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; margin-bottom: 24px; }.page-heading h2 { margin: 6px 0 3px; font-size: 22px; letter-spacing: -.02em; }.page-heading p { margin: 0; color: var(--muted); }.content-layout { display: grid; grid-template-columns: minmax(0, 1fr) var(--rail); gap: 20px; align-items: start; }.content-primary { min-width: 0; }.context-rail { position: sticky; top: 24px; display: grid; gap: 14px; }.context-card { padding: 17px; border: 1px solid var(--line); border-top: 2px solid var(--cyan); border-radius: var(--radius); background: linear-gradient(150deg, rgba(25, 44, 68, .82), rgba(12, 21, 35, .84)); }.context-card strong { display: block; margin-top: 9px; font-size: 17px; }.context-card p { margin: 8px 0 16px; color: var(--muted); font-size: 12px; }
.welcome-row { justify-content: space-between; gap: 20px; padding: 24px; margin-bottom: 16px; border: 1px solid var(--line); border-radius: var(--radius); background: linear-gradient(110deg, rgba(28, 51, 78, .9), rgba(13, 25, 42, .85)); }.welcome-row h3 { margin: 5px 0 4px; font-size: 21px; }.welcome-row p { margin: 0; color: var(--muted); }.live-label { margin-left: 9px; color: var(--green); font-size: 10px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; }.live-label i { display: inline-block; width: 6px; height: 6px; margin-right: 4px; border-radius: 50%; background: var(--green); }.quick-actions { gap: 8px; }
.button { min-height: 34px; padding: 7px 11px; border: 1px solid var(--line); border-radius: 8px; color: var(--text); background: transparent; font-size: 11px; font-weight: 700; white-space: nowrap; }.button:hover { border-color: var(--cyan); color: var(--cyan); }.button.primary { border-color: var(--cyan); color: #07151f; background: var(--cyan); }.button.primary:hover { color: #07151f; filter: brightness(1.08); }.button.text { border-color: transparent; color: var(--cyan); padding-inline: 0; }.button.text:hover { background: transparent; }.button:disabled { opacity: .4; cursor: not-allowed; }
.kpi-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 13px; margin-bottom: 16px; }.kpi-card { min-width: 0; padding: 17px; border: 1px solid var(--line); border-radius: var(--radius); background: linear-gradient(145deg, var(--surface-2), var(--surface)); box-shadow: var(--shadow); }.kpi-card > strong { display: block; margin: 8px 0 2px; font-size: 28px; letter-spacing: -.04em; }.kpi-label, .kpi-card > small { color: var(--muted); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }.kpi-card > small { color: var(--cyan); letter-spacing: 0; text-transform: none; }.kpi-card.green > strong { color: var(--green); }.kpi-card.violet > strong { color: var(--violet); }.kpi-card.amber > strong { color: var(--amber); }.kpi-card.red > strong { color: var(--red); }
.overview-grid, .two-column-grid, .settings-grid, .community-layout { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: 16px; margin-bottom: 16px; }.overview-grid.lower { margin-top: 0; }.stack { display: grid; gap: 16px; align-content: start; }.card { min-width: 0; padding: 19px; border: 1px solid var(--line); border-radius: var(--radius); background: rgba(14, 25, 42, .82); box-shadow: var(--shadow); }.card-heading { justify-content: space-between; gap: 15px; margin-bottom: 17px; }.card-heading h3 { margin: 0; font-size: 14px; }.card-heading small { display: block; margin-top: 3px; text-transform: none; letter-spacing: 0; }.card-heading .button { min-height: auto; }.accent-card { border-color: #433d75; background: linear-gradient(145deg, rgba(36, 32, 72, .8), rgba(16, 24, 42, .85)); }.muted-copy { color: var(--muted); font-size: 12px; }.permission-note { gap: 6px; color: var(--green); font-size: 11px; }.permission-note i { font-style: normal; }
.health-list { margin-bottom: 15px; }.health-row { gap: 12px; min-height: 38px; padding: 8px 0; border-bottom: 1px solid rgba(38, 59, 91, .65); }.health-row:last-child { border-bottom: 0; }.health-label { min-width: 0; flex: 1; display: flex; align-items: center; gap: 8px; color: var(--muted); }.health-row b { color: var(--text); font-size: 11px; }.health-row small { width: 58px; text-align: right; letter-spacing: 0; text-transform: none; }.health-row.warning b { color: var(--amber); }.inline-alert { display: flex; align-items: flex-start; gap: 9px; margin-top: 13px; padding: 10px 11px; border-left: 2px solid var(--cyan); border-radius: 0 8px 8px 0; color: #b9d0df; background: rgba(32, 68, 84, .34); font-size: 11px; }.inline-alert i { color: var(--cyan); font-style: normal; font-weight: 800; }.inline-alert.warning { border-color: var(--amber); color: #e4d0a4; background: rgba(74, 54, 21, .38); }.inline-alert.warning i { color: var(--amber); }.inline-alert.danger { border-color: var(--red); color: #ffc0c9; background: rgba(75, 26, 42, .35); }.inline-alert.danger i { color: var(--red); }
.cp-summary { display: grid; gap: 12px; }.cp-summary-row { display: flex; align-items: center; gap: 10px; }.cp-icon { width: 32px; height: 32px; flex: 0 0 auto; display: grid; place-items: center; border: 1px solid var(--cyan); border-radius: 9px; color: var(--cyan); background: rgba(33, 89, 104, .45); }.cp-icon.violet { border-color: var(--violet); color: var(--violet); background: rgba(66, 47, 115, .35); }.cp-icon.amber { border-color: var(--amber); color: var(--amber); background: rgba(91, 65, 24, .35); }.cp-icon.pink { border-color: #ed8bff; color: #ed8bff; background: rgba(102, 38, 108, .35); }.cp-summary-main { min-width: 0; flex: 1; }.cp-summary-main strong, .cp-summary-main small { display: block; }.cp-summary-main small { overflow: hidden; color: var(--muted); text-overflow: ellipsis; text-transform: none; letter-spacing: 0; white-space: nowrap; }.cp-summary-main .progress { margin-top: 7px; }.cp-summary-meta { display: grid; justify-items: end; gap: 5px; }.cp-summary-meta b { font-size: 11px; }.badge { display: inline-flex; align-items: center; gap: 5px; width: max-content; padding: 4px 7px; border: 1px solid transparent; border-radius: 5px; font-size: 10px; line-height: 1.1; white-space: nowrap; }.badge i { font-style: normal; font-size: 10px; }.badge.success { color: var(--green); border-color: rgba(79,224,157,.22); background: rgba(39, 113, 86, .2); }.badge.pending { color: var(--amber); border-color: rgba(246,198,94,.22); background: rgba(107, 78, 26, .2); }.badge.danger { color: var(--red); border-color: rgba(255,111,131,.22); background: rgba(113, 36, 57, .22); }.badge.off, .badge.neutral { color: #a2afc2; border-color: rgba(128,145,169,.23); background: rgba(91, 105, 128, .2); }.badge.info { color: var(--blue); border-color: rgba(80,191,255,.22); background: rgba(28, 94, 130, .2); }
.event-list { display: grid; gap: 9px; }.event-row { min-width: 0; display: flex; align-items: center; gap: 12px; padding: 7px 0; }.date-tile { width: 52px; flex: 0 0 auto; padding: 6px 5px; border: 1px solid var(--line); border-radius: 7px; color: var(--cyan); text-align: center; }.date-tile b, .date-tile strong { display: block; font-size: 9px; }.date-tile strong { margin-top: 2px; font-size: 11px; }.event-main { min-width: 0; flex: 1; }.event-main strong, .event-main small { display: block; }.event-main strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.event-main small { margin-top: 2px; color: var(--muted); text-transform: none; letter-spacing: 0; }.activity-list { display: grid; gap: 13px; }.activity-row { display: flex; gap: 10px; color: var(--muted); font-size: 12px; }.activity-dot { width: 7px; height: 7px; flex: 0 0 auto; margin-top: 6px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 8px var(--cyan); }.activity-dot.pending { background: var(--amber); box-shadow: 0 0 8px var(--amber); }.activity-dot.off { background: var(--gray); box-shadow: none; }.activity-row strong { color: var(--text); }.activity-row small { display: block; margin-top: 3px; text-transform: none; letter-spacing: 0; }.drop-highlight { display: flex; align-items: center; gap: 12px; }.drop-orb { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 12px; color: var(--amber); background: rgba(111, 79, 24, .4); box-shadow: 0 0 22px rgba(246,198,94,.1); }.drop-highlight > div:nth-child(2) { flex: 1; }.drop-highlight strong, .drop-highlight small { display: block; }.drop-highlight small { margin-top: 3px; text-transform: none; letter-spacing: 0; }.community-preview, .mini-post { display: grid; gap: 10px; }.mini-post { grid-template-columns: auto 1fr; align-items: center; padding: 8px 0; border-bottom: 1px solid rgba(38,59,91,.6); }.mini-post:last-child { border-bottom: 0; }.mini-post strong, .mini-post small { display: block; }.mini-post strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }.mini-post small { margin-top: 2px; text-transform: none; letter-spacing: 0; }
.filter-row { justify-content: flex-end; gap: 8px; margin-bottom: 13px; }.toolbar { flex: 1; display: flex; gap: 8px; }.search-field { min-width: 180px; flex: 1; display: flex; align-items: center; gap: 8px; padding: 0 10px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface); color: var(--muted); }.search-field input { width: 100%; min-height: 35px; color: var(--text); border: 0; outline: 0; background: transparent; }.search-field input::placeholder { color: var(--subtle); }.filter-row > .toolbar .select { width: 150px; }.table-wrap { overflow-x: auto; }.data-table { width: 100%; min-width: 720px; border-collapse: collapse; }.data-table th { padding: 0 10px 11px; color: var(--subtle); font-size: 9px; font-weight: 700; letter-spacing: .12em; text-align: left; text-transform: uppercase; }.data-table td { padding: 13px 10px; border-top: 1px solid rgba(38,59,91,.65); color: #d9e4f1; font-size: 12px; vertical-align: middle; }.data-table tr:hover td { background: rgba(39, 68, 100, .22); }.data-table td small { display: block; margin-top: 2px; color: var(--muted); font-size: 10px; text-transform: none; letter-spacing: 0; }.person-cell { display: flex; align-items: center; gap: 9px; }.person-cell strong { display: block; }.metric-cell { min-width: 74px; }.metric-cell b { display: block; margin-bottom: 4px; font-size: 11px; }.progress { width: 100%; height: 4px; overflow: hidden; border-radius: 6px; background: #223149; }.progress i { display: block; height: 100%; border-radius: inherit; background: var(--cyan); }.progress i.green { background: var(--green); }.progress i.violet { background: var(--violet); }.progress i.amber { background: var(--amber); }.progress i.pink { background: #ed8bff; }.row-menu { width: 29px; height: 27px; padding: 0; color: var(--muted); }.row-menu:hover { color: var(--cyan); border-color: var(--cyan); }.table-footer { justify-content: space-between; gap: 12px; padding-top: 14px; color: var(--muted); font-size: 11px; }.pagination { display: flex; align-items: center; gap: 7px; }.pagination button { width: 24px; height: 24px; color: var(--muted); border: 1px solid var(--line); border-radius: 5px; background: transparent; }.pagination button:disabled { opacity: .4; }
.period-tabs, .segmented, .subnav { display: flex; align-items: center; gap: 4px; }.period-tabs { margin-bottom: 14px; padding-bottom: 11px; border-bottom: 1px solid var(--line); }.period-tab, .segmented button, .subnav-item { border: 0; border-radius: 7px; padding: 7px 10px; color: var(--muted); background: transparent; font-size: 11px; }.period-tab.active, .segmented button.active, .subnav-item.active { color: var(--text); background: var(--surface-3); }.period-note { margin-left: auto; color: var(--subtle); font-size: 10px; }.compact-kpis { grid-template-columns: repeat(3, 1fr); }.bar-chart { display: grid; gap: 18px; }.bar-row > div { display: flex; justify-content: space-between; margin-bottom: 8px; }.bar-row span { color: var(--cyan); font-size: 12px; }.sparkline { height: 120px; display: flex; align-items: end; gap: 8px; padding: 0 3px; border-bottom: 1px solid var(--line); background: repeating-linear-gradient(to bottom, transparent, transparent 28px, rgba(38,59,91,.25) 29px); }.sparkline i { flex: 1; min-height: 4px; border-radius: 4px 4px 0 0; background: linear-gradient(to top, var(--violet), var(--cyan)); }.chart-labels { display: flex; justify-content: space-between; padding-top: 8px; color: var(--subtle); font-size: 10px; }.signal-list { display: grid; gap: 13px; }.signal-list > div { display: flex; align-items: center; gap: 9px; }.signal-list > div > div { flex: 1; }.signal-list strong, .signal-list small { display: block; }.signal-list small { margin-top: 2px; text-transform: none; letter-spacing: 0; }.signal-icon { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 8px; font-weight: 800; }.signal-icon.green { color: var(--green); background: rgba(79,224,157,.12); }.signal-icon.amber { color: var(--amber); background: rgba(246,198,94,.12); }.signal-icon.violet { color: var(--violet); background: rgba(157,138,255,.12); }.positive { color: var(--green); font-size: 11px; }.negative { color: var(--amber); font-size: 11px; }
.event-card { display: flex; align-items: center; gap: 15px; padding: 17px; margin-bottom: 10px; border: 1px solid var(--line); border-radius: var(--radius); background: rgba(14, 25, 42, .82); }.event-date { width: 75px; flex: 0 0 auto; padding-right: 14px; border-right: 1px solid var(--line); color: var(--cyan); }.event-date span, .event-date b { display: block; }.event-date span { font-size: 10px; text-transform: uppercase; }.event-date b { margin-top: 3px; font-size: 16px; }.event-card-main { min-width: 0; flex: 1; }.event-title-row { justify-content: space-between; gap: 12px; }.event-title-row h3 { margin: 0; font-size: 14px; }.event-title-row small { display: block; margin-top: 4px; text-transform: none; letter-spacing: 0; }.event-meta { flex-wrap: wrap; gap: 13px; margin-top: 14px; color: var(--muted); font-size: 11px; }.event-meta .progress { width: 90px; }.event-actions { gap: 11px; }.random-hero, .widget-banner { justify-content: space-between; gap: 20px; padding: 23px; margin-bottom: 16px; border: 1px solid #443d75; border-radius: var(--radius); background: radial-gradient(circle at 15% 50%, rgba(124,100,227,.27), transparent 30%), linear-gradient(110deg, #222149, #151b35); }.random-hero h3, .widget-banner h3 { margin: 5px 0 5px; font-size: 19px; }.random-hero p, .widget-banner p { margin: 0; color: var(--muted); }.random-graphic { width: 66px; height: 66px; position: relative; display: grid; place-items: center; color: var(--violet); font-size: 26px; }.random-graphic:before { position: absolute; inset: 4px; content: ''; border: 1px solid var(--violet); transform: rotate(45deg); }.random-graphic i { position: absolute; width: 4px; height: 4px; border-radius: 50%; background: var(--cyan); }.random-graphic i:nth-child(2) { top: 0; right: 7px; }.random-graphic i:nth-child(3) { right: 0; bottom: 14px; }.random-graphic i:nth-child(4) { bottom: 3px; left: 7px; }.random-hero > div:nth-child(2), .widget-banner > div:first-child { flex: 1; }.random-list, .drop-list, .channel-list, .timer-list { display: grid; gap: 4px; }.random-row { display: grid; grid-template-columns: auto 1fr auto auto; gap: 10px; align-items: center; padding: 12px 0; border-bottom: 1px solid rgba(38,59,91,.6); }.random-row:last-child { border-bottom: 0; }.random-index { color: var(--violet); font-size: 10px; }.random-row strong, .random-row small { display: block; }.random-row small { margin-top: 2px; text-transform: none; letter-spacing: 0; }.clean-list { margin: 0; padding: 0; display: grid; gap: 18px; list-style: none; }.clean-list li { display: flex; gap: 11px; }.clean-list li > span { color: var(--violet); font-size: 11px; }.clean-list strong, .clean-list small { display: block; }.clean-list small { margin-top: 3px; text-transform: none; letter-spacing: 0; }
.cp-toolbar { justify-content: space-between; margin-bottom: 14px; }.segmented.compact button { padding: 5px 8px; font-size: 10px; }.segmented span, .subnav-item span { margin-left: 4px; color: var(--subtle); }.cp-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }.cp-card { padding: 18px; border: 1px solid var(--line); border-top: 2px solid var(--cyan); border-radius: var(--radius); background: linear-gradient(145deg, rgba(20,39,61,.95), rgba(12,22,37,.9)); }.cp-card.violet { border-top-color: var(--violet); }.cp-card.amber { border-top-color: var(--amber); }.cp-card.pink { border-top-color: #ed8bff; }.cp-card-top { display: flex; justify-content: space-between; align-items: center; }.cp-card-heading { margin: 16px 0; }.cp-card-heading h3 { margin: 0; font-size: 17px; }.cp-card-heading small { display: block; margin-top: 3px; text-transform: none; letter-spacing: 0; }.cp-stat > div { display: flex; justify-content: space-between; margin-bottom: 6px; }.cp-stat span, .cp-roles span { color: var(--muted); font-size: 11px; }.cp-stat strong { font-size: 12px; }.cp-roles { display: grid; gap: 7px; margin-top: 15px; padding: 12px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }.cp-roles span { display: flex; align-items: center; gap: 7px; }.cp-roles b { margin-left: auto; color: var(--text); font-weight: 500; }.role-dot { width: 6px; height: 6px; border-radius: 50%; }.role-dot.caller { background: var(--violet); }.role-dot.healer { background: var(--green); }.cp-card-footer { display: flex; justify-content: space-between; align-items: center; padding-top: 12px; }.subnav { margin-bottom: 13px; padding-bottom: 10px; border-bottom: 1px solid var(--line); }.subnav-spacer { flex: 1; }.drop-row { gap: 12px; padding: 12px 0; border-bottom: 1px solid rgba(38,59,91,.6); }.drop-row:last-child { border-bottom: 0; }.drop-art { width: 40px; height: 40px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 10px; color: var(--amber); background: linear-gradient(135deg, #604a25, #2c2630); }.drop-main { min-width: 0; flex: 1; }.drop-main strong, .drop-main small, .drop-main span { display: block; }.drop-main small { margin-top: 2px; text-transform: none; letter-spacing: 0; }.drop-main span { margin-top: 6px; color: var(--muted); font-size: 11px; }.drop-status { display: flex; align-items: center; gap: 11px; }
.community-layout { grid-template-columns: minmax(0, 1.3fr) minmax(280px, .7fr); }.post-list { display: grid; gap: 0; }.post { padding: 13px 0; border-bottom: 1px solid rgba(38,59,91,.6); }.post:first-child { padding-top: 0; }.post:last-child { padding-bottom: 0; border-bottom: 0; }.post-top { gap: 9px; }.post-top > div { flex: 1; }.post-top strong, .post-top small { display: block; }.post-top small { margin-top: 2px; text-transform: none; letter-spacing: 0; }.post-top .tag { margin-left: auto; }.tag { padding: 3px 6px; border-radius: 5px; color: var(--violet); background: rgba(104,84,185,.2); font-size: 9px; }.post h3 { margin: 13px 0 4px; font-size: 14px; }.post p { margin: 0; color: var(--muted); font-size: 12px; }.post-actions { display: flex; gap: 14px; margin-top: 12px; }.composer { display: grid; gap: 7px; }.composer label, .modal-field { color: var(--muted); font-size: 11px; }.composer .button { margin-top: 6px; }.textarea { min-height: 110px; resize: vertical; }.channel-list > div, .connection-row { display: flex; align-items: center; gap: 10px; padding: 10px 0; border-bottom: 1px solid rgba(38,59,91,.6); }.channel-list > div:last-child, .connection-row:last-child { border-bottom: 0; }.channel-icon { width: 27px; height: 27px; display: grid; place-items: center; color: var(--cyan); border-radius: 7px; background: rgba(53, 101, 129, .3); }.channel-list > div > div, .connection-row > div { flex: 1; }.channel-list strong, .channel-list small, .connection-row strong, .connection-row small { display: block; }.channel-list small, .connection-row small { margin-top: 2px; color: var(--muted); font-size: 10px; text-transform: none; letter-spacing: 0; }.unread { color: var(--cyan); font-size: 10px; }
.timeline { position: relative; padding-left: 15px; }.timeline:before { position: absolute; top: 6px; bottom: 6px; left: 4px; width: 1px; content: ''; background: var(--line); }.timeline-item { position: relative; display: flex; gap: 13px; align-items: flex-start; padding: 10px 0 18px; }.timeline-item > div { flex: 1; }.timeline-item small { display: block; margin-top: 4px; text-transform: none; letter-spacing: 0; }.timeline-marker { width: 9px; height: 9px; flex: 0 0 auto; margin: 5px 0 0 -15px; border: 2px solid var(--surface); border-radius: 50%; background: var(--cyan); box-shadow: 0 0 0 1px var(--cyan); }.timeline-marker.pending { background: var(--amber); box-shadow: 0 0 0 1px var(--amber); }.timeline-marker.off { background: var(--gray); box-shadow: 0 0 0 1px var(--gray); }
.widget-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }.widget-card { min-width: 0; padding: 17px; border: 1px solid var(--line); border-radius: var(--radius); background: linear-gradient(145deg, rgba(20,39,61,.95), rgba(12,22,37,.9)); }.widget-card-top { gap: 9px; }.widget-card-top .badge { margin-left: auto; }.widget-symbol { width: 30px; height: 30px; display: grid; place-items: center; border: 1px solid var(--cyan); border-radius: 8px; color: var(--cyan); }.widget-card h3 { margin: 16px 0 3px; font-size: 15px; }.widget-card p { min-height: 38px; margin: 0; color: var(--muted); font-size: 11px; }.widget-card-bottom { justify-content: space-between; margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--line); color: var(--subtle); font-size: 10px; }.toggle { width: 33px; height: 19px; padding: 2px; border: 1px solid var(--line); border-radius: 20px; background: var(--surface); }.toggle i { display: block; width: 13px; height: 13px; border-radius: 50%; background: var(--gray); transition: .15s; }.toggle.on { border-color: var(--cyan); background: rgba(93,229,220,.2); }.toggle.on i { margin-left: 14px; background: var(--cyan); }.timer-list { margin-top: 14px; }.timer-list div { display: flex; justify-content: space-between; padding: 5px 0; border-top: 1px solid rgba(38,59,91,.6); color: var(--muted); font-size: 10px; }.timer-list b { color: var(--cyan); }.widget-banner-actions { gap: 8px; }.widget-six-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 12px; padding-top: 11px; border-top: 1px solid var(--line); }.widget-six-controls .segmented { margin-right: auto; }.widget-hidden-state { display: block; padding: 10px 0; color: var(--muted); font-size: 11px; }
 .timer-row.timer-compact { gap: 6px; padding: 4px 0; font-size: 9px; }.timer-row.timer-compact small { display: none; }.timer-row.timer-compact .timer-actions { gap: 4px; }.timer-row.timer-compact .timer-actions .button { padding: 3px 5px; font-size: 9px; }
.settings-grid { grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr); }.setting-row { justify-content: space-between; gap: 20px; padding: 14px 0; border-bottom: 1px solid rgba(38,59,91,.6); }.setting-row:first-child { padding-top: 0; }.setting-row:last-child { border-bottom: 0; padding-bottom: 0; }.setting-row > div:first-child { min-width: 0; }.setting-row strong, .setting-row small { display: block; }.setting-row small { max-width: 390px; margin-top: 4px; color: var(--muted); text-transform: none; letter-spacing: 0; }.setting-row .select { min-width: 150px; }.session-summary { gap: 10px; padding-bottom: 15px; border-bottom: 1px solid var(--line); }.session-summary > div { flex: 1; }.session-summary strong, .session-summary small { display: block; }.session-summary small { margin-top: 2px; text-transform: none; letter-spacing: 0; }.session-summary .status-pill { margin-left: auto; }.role-switch { flex-wrap: wrap; gap: 8px; padding: 16px 0 4px; }.role-switch label { flex: 1 1 100%; color: var(--muted); font-size: 11px; }.role-switch .select { flex: 1; }.connection-row .badge { margin-left: auto; }
.settings-content-layout { grid-template-columns: minmax(0, 1fr) var(--rail); }.settings-content-layout .context-rail { display: grid; }.settings-content-layout .settings-grid { grid-template-columns: minmax(0, 1.4fr) minmax(360px, .8fr); }
@media (min-width: 941px) {
  .settings-content-layout .settings-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
  .settings-content-layout .settings-grid > .stack { display: contents; }
  .settings-content-layout .settings-grid > .stack > .card { min-width: 0; }
  .settings-content-layout .settings-grid > .stack > [data-settings-card] { min-width: 0; }
  .settings-content-layout .settings-grid > .stack > [data-settings-card="identity"] { grid-column: 1; grid-row: 1; }
  .settings-content-layout .settings-grid > .stack > [data-settings-card="profile"] { grid-column: 2; grid-row: 1; }
  .settings-content-layout .settings-grid > .stack > [data-settings-card="timezone"] { grid-column: 1; grid-row: 2; }
  .settings-content-layout .settings-grid > .stack > [data-settings-card="ashenvale"] { grid-column: 2; grid-row: 2; }
  .settings-content-layout .settings-grid > .stack > [data-settings-card="appearance"] { grid-column: 1; grid-row: 3; }
  .settings-content-layout .settings-grid > .stack > [data-settings-card="session"] { grid-column: 2; grid-row: 3; }
  .settings-content-layout .settings-grid > .stack > [data-settings-card="connections"] { grid-column: 1; grid-row: 4; }
  .settings-content-layout .settings-grid > .stack > [data-settings-card="admin"] { grid-column: 2; grid-row: 4; }
  .settings-content-layout .settings-grid > .stack > [data-settings-card="clans"] { grid-column: 1 / -1; grid-row: 5; }
  .settings-content-layout .settings-grid > .stack > [data-settings-card="auth"] { grid-column: 1; grid-row: 6; }
  .settings-content-layout .settings-grid > .stack > [data-settings-card="mfa"] { grid-column: 2; grid-row: 6; }
  .settings-content-layout .settings-grid > .stack > [data-settings-card="guests"] { grid-column: 1; grid-row: 7; }
}
.state-block { min-height: 220px; display: grid; place-items: center; align-content: center; gap: 7px; padding: 24px; border: 1px dashed var(--line); border-radius: var(--radius); color: var(--muted); text-align: center; }.state-block strong { color: var(--text); }.state-block p { margin: 0; font-size: 12px; }.state-icon { color: var(--cyan); font-size: 27px; }.spinner { width: 26px; height: 26px; border: 2px solid var(--line); border-top-color: var(--cyan); border-radius: 50%; animation: spin .8s linear infinite; }.empty-state .button { margin-top: 6px; }.modal-backdrop { position: fixed; inset: 0; z-index: 60; display: grid; place-items: center; padding: 20px; background: rgba(2, 6, 14, .76); backdrop-filter: blur(7px); }.modal { position: relative; width: min(100%, 500px); padding: 25px; border: 1px solid var(--line); border-top: 2px solid var(--cyan); border-radius: var(--radius); background: linear-gradient(145deg, #162740, #0c1728); box-shadow: 0 28px 100px rgba(0,0,0,.5); }.modal-close { position: absolute; top: 15px; right: 15px; border: 0; color: var(--muted); background: transparent; font-size: 20px; }.modal h2 { margin: 8px 0 12px; font-size: 20px; }.modal-body { color: var(--muted); font-size: 13px; }.modal-body p { margin: 0 0 14px; }.modal-field { display: grid; gap: 6px; margin-top: 11px; }.modal-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 22px; }.toast { position: fixed; right: 24px; bottom: 24px; z-index: 70; max-width: min(360px, calc(100vw - 32px)); display: flex; align-items: center; gap: 9px; padding: 12px 15px; border: 1px solid var(--cyan); border-radius: 9px; color: var(--text); background: #173743; box-shadow: var(--shadow); transform: translateY(16px); opacity: 0; pointer-events: none; transition: .2s; font-size: 12px; }.toast.show { opacity: 1; transform: none; }.toast > i { color: var(--cyan); font-style: normal; font-weight: 800; }.toast.warning { border-color: var(--amber); background: #44361f; }.toast.warning > i { color: var(--amber); }.toast.danger { border-color: var(--red); background: #45222d; }.toast.danger > i { color: var(--red); }
.auth-fallback { align-items: start; }.auth-fallback h2, .auth-fallback > p { width: min(100%, 520px); margin-inline: auto; text-align: center; }.auth-fallback form { width: min(100%, 520px); margin: 0 auto; display: grid; gap: 12px; text-align: left; }.auth-fallback .modal-field { margin-top: 0; }.auth-form-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 8px; padding-top: 14px; border-top: 1px solid rgba(38,59,91,.65); }.auth-form-actions .button { flex: 0 0 auto; }.auth-password-rules { display: block; max-width: 520px; margin-top: 2px; padding: 9px 11px; border: 1px solid rgba(38,59,91,.65); border-radius: 7px; color: var(--muted); font-size: 11px; line-height: 1.45; background: rgba(10,23,41,.55); }.auth-contact-grid { display: grid; grid-template-columns: minmax(155px, .8fr) minmax(0, 1.2fr); gap: 12px; width: 100%; }.auth-contact-grid .modal-field { min-width: 0; }
.sidebar-scrim { display: none; }
@keyframes spin { to { transform: rotate(360deg); } }
.auth-fallback { width: min(100%, 760px); justify-items: center; }
.auth-fallback form { box-sizing: border-box; }
.auth-form-actions { width: 100%; justify-content: flex-start; }
.auth-form-actions .button { min-width: 132px; min-height: 38px; text-align: center; }
.auth-form-actions .button.text { min-width: 152px; }
.auth-form-actions .button.primary { min-width: 118px; }
@media (max-width: 560px) {
  .auth-fallback { padding: 20px 16px; }
  .auth-contact-grid { grid-template-columns: 1fr; gap: 10px; }
  .auth-form-actions { align-items: stretch; flex-direction: column; gap: 9px; }
  .auth-form-actions .button,
  .auth-form-actions .button.primary,
  .auth-form-actions .button.text { width: 100%; min-width: 0; }
}
@media (max-width: 1180px) { .content-layout { grid-template-columns: minmax(0, 1fr) 210px; }.widget-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }.main { padding-inline: 28px; } }
@media (max-width: 940px) { .sidebar { width: 220px; flex-basis: 220px; }.content-layout { grid-template-columns: 1fr; }.context-rail { position: static; grid-template-columns: minmax(0, 1fr); }.context-card { padding: 14px; }.overview-grid, .two-column-grid, .settings-grid, .community-layout { grid-template-columns: 1fr; }.kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.page-heading { align-items: flex-start; }.page-heading > :last-child { flex-shrink: 0; } }
@media (max-width: 700px) { .app-shell { display: block; }.sidebar { position: fixed; inset: 0 auto 0 0; width: min(82vw, 290px); transform: translateX(-105%); transition: transform .2s ease; box-shadow: 20px 0 60px rgba(0,0,0,.35); }.sidebar-open .sidebar { transform: none; }.sidebar-open .sidebar-scrim { display: block; position: fixed; inset: 0; z-index: 10; background: rgba(0,0,0,.55); }.sidebar-close, .mobile-menu { display: grid; place-items: center; }.sidebar-close { margin-left: auto; border: 0; background: transparent; }.main { padding: 18px 15px 42px; }.mobile-menu { flex: 0 0 auto; }.topbar { align-items: flex-start; }.topbar h1 { font-size: 23px; }.view-subtitle { max-width: 240px; }.connection-state span, .user-button-label { display: none; }.user-button { border: 0; padding: 0; background: transparent; }.notice-bar { align-items: flex-start; font-size: 11px; }.notice-bar .link-button { align-self: center; }.page-heading { display: block; }.page-heading > :last-child { margin-top: 13px; }.welcome-row, .random-hero, .widget-banner { align-items: flex-start; flex-wrap: wrap; }.quick-actions, .widget-banner-actions { width: 100%; }.quick-actions .button, .widget-banner-actions .button { flex: 1; }.kpi-grid, .compact-kpis { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 9px; }.kpi-card { padding: 13px; }.kpi-card > strong { font-size: 23px; }.filter-row { align-items: stretch; flex-wrap: wrap; }.filter-row > .toolbar { flex-basis: 100%; }.toolbar { width: 100%; }.filter-row > .button { flex: 1; }.search-field { min-width: 0; }.period-tabs { overflow-x: auto; }.period-note { display: none; }.cp-grid, .widget-grid { grid-template-columns: 1fr; }.event-card { align-items: flex-start; flex-wrap: wrap; }.event-card-main { flex-basis: calc(100% - 90px); }.event-actions { width: 100%; justify-content: flex-end; }.drop-row { align-items: flex-start; flex-wrap: wrap; }.drop-main { flex: 1; }.drop-status { width: 100%; margin-left: 52px; justify-content: space-between; }.setting-row { align-items: flex-start; flex-direction: column; gap: 10px; }.setting-row .select, .setting-row .segmented { width: 100%; }.connection-row { align-items: flex-start; }.context-rail { display: none; }.data-table { min-width: 680px; } }
@media (max-width: 420px) { .top-actions { gap: 5px; }.topbar { gap: 8px; }.icon-button { width: 33px; height: 33px; }.kpi-card > small { font-size: 9px; }.event-date { width: 64px; padding-right: 9px; }.welcome-row, .card, .random-hero, .widget-banner { padding: 15px; }.subnav { overflow-x: auto; }.subnav-spacer { min-width: 8px; }.subnav .button { flex: 0 0 auto; } }
@media (max-width: 700px) { .context-rail { display: grid; position: static; } }
.widget-six[data-mode="compact"] .timer-list div:nth-child(n+3) { display: none; }
.widget-card[style] { opacity: var(--widget-opacity, .86); }
.widget-card.widget-disabled { opacity: .42; filter: saturate(.5); }
.timer-row { display: grid; grid-template-columns: minmax(0,1fr) auto auto; gap: 8px; align-items: center; padding: 8px 0; border-top: 1px solid rgba(38,59,91,.6); }
.timer-row strong, .timer-row small { display: block; }
.timer-row small { margin-top: 2px; color: var(--subtle); font-size: 9px; text-transform: none; letter-spacing: 0; }
.timer-row > b { color: var(--cyan); font-size: 11px; white-space: nowrap; }
.timer-row.timer-hidden { opacity: .65; }
.timer-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 3px; }
.timer-actions .button { padding: 3px 5px; font-size: 9px; }
.widget-session-bar { display: flex; justify-content: space-between; align-items: center; gap: 18px; padding: 17px; margin-bottom: 14px; border: 1px solid var(--line); border-left: 2px solid var(--cyan); border-radius: var(--radius); background: rgba(10, 23, 41, .86); }
.widget-session-bar h3 { margin: 5px 0 3px; font-size: 16px; }
.widget-session-bar p { margin: 0; color: var(--muted); font-size: 11px; }
.widget-session-bar label { display: grid; gap: 6px; min-width: 260px; color: var(--muted); font-size: 10px; }
.widget-card-actions { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 12px; }
.widget-card-actions .button { flex: 1; min-width: 86px; }
.widget-locked { border-style: dashed; opacity: .7; }
.widget-config-panel { display: grid; gap: 8px; margin-top: 13px; padding-top: 12px; border-top: 1px solid var(--line); color: var(--muted); font-size: 10px; }
.widget-config-panel label { display: grid; gap: 4px; }
.widget-config-panel input { accent-color: var(--cyan); }
.widget-config-actions { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.widget-stage { margin-top: 16px; padding: 19px; border: 1px solid rgba(93,229,220,.3); border-radius: var(--radius); background: linear-gradient(145deg, rgba(10, 27, 45, .92), rgba(7, 16, 30, .94)); box-shadow: 0 18px 50px rgba(0,0,0,.2); }
.widget-stage-floating { position:fixed; right:calc(var(--rail) + 20px); bottom:20px; z-index:80; width:min(560px,calc(100vw - var(--rail) - 48px)); max-height:calc(100vh - 40px); overflow:auto; margin:0; padding:14px; background:rgba(7,16,30,.98); box-shadow:0 24px 80px rgba(0,0,0,.55),0 0 0 1px rgba(93,229,220,.18); }
.widget-stage-empty { min-height: 120px; padding: 18px; border-color: rgba(93,229,220,.2); }
.widget-window { position: relative; display: grid; gap: 13px; margin-top: 12px; padding: 16px; border: 1px solid var(--cyan); border-top: 2px solid var(--cyan); border-radius: 11px; background: rgba(8, 20, 36, .98); box-shadow: 0 16px 42px rgba(0,0,0,.35), 0 0 24px rgba(93,229,220,.08); }
.widget-window-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.widget-window-head h3 { margin: 5px 0 0; font-size: 16px; }
.widget-window-head > div:last-child { display: flex; align-items: center; gap: 9px; }
.widget-live-grid, .widget-control-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 9px; }
.widget-live-grid > div, .widget-control-grid > div { display: grid; gap: 5px; padding: 11px; border: 1px solid var(--line); border-radius: 8px; background: rgba(17, 35, 56, .7); }
.widget-live-grid small, .widget-control-grid small { color: var(--muted); font-size: 10px; }
.widget-control-grid strong { font-size: 13px; }
.widget-window-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding-top: 12px; border-top: 1px solid var(--line); }
.revive-list { display: grid; gap: 5px; }
.revive-list > div { display: flex; align-items: center; gap: 9px; padding: 9px; border-bottom: 1px solid rgba(38,59,91,.6); }
.revive-list > div > div { flex: 1; }
.revive-list strong, .revive-list small { display: block; }
.revive-list small { margin-top: 3px; color: var(--muted); font-size: 10px; }
.widget-visual-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 12px; color: var(--muted); font-size: 10px; }
.widget-visual-controls input { width: 100px; accent-color: var(--cyan); vertical-align: middle; }
.widget-detail-note { display: block; min-height: auto; margin-top: 8px; color: var(--subtle); font-size: 9px; }
/* Allyclan visual direction: richer fantasy atmosphere without compromising readability. */
body { background-image: linear-gradient(180deg, rgba(4,10,20,.82), rgba(4,10,20,.96)), url('/frontend/assets/allyclan-world-bg.png'); background-size: cover; background-attachment: fixed; background-position: center top; }
.app-shell { position: relative; z-index: 1; }
.visual-hero { position: relative; min-height: 126px; display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; overflow: hidden; padding: 22px 24px; margin-bottom: 16px; border: 1px solid rgba(93,229,220,.24); border-radius: var(--radius); background: linear-gradient(90deg, rgba(7,19,35,.94), rgba(11,26,48,.76)), url('/frontend/assets/allyclan-world-bg.png') center 52%/cover; box-shadow: 0 18px 55px rgba(0,0,0,.2); }
.visual-hero:after { position: absolute; inset: 0; content: ''; pointer-events: none; background: linear-gradient(110deg, rgba(73,39,140,.18), transparent 55%, rgba(0,215,220,.12)); }
.visual-hero > div, .hero-mark { position: relative; z-index: 1; }
.visual-hero h2 { max-width: 720px; margin: 5px 0 4px; font-size: 22px; letter-spacing: -.03em; }
.visual-hero p { margin: 0; color: var(--muted); font-size: 12px; }
.route-beta-badge { display: inline-block; margin-left: 7px; padding: 2px 6px; border: 1px solid rgba(247,188,87,.62); border-radius: 5px; color: var(--amber); background: rgba(247,188,87,.14); font-size: 9px; font-weight: 800; letter-spacing: .08em; vertical-align: 2px; }
.hero-mark { display: grid; width: 58px; height: 58px; place-items: center; border: 1px solid rgba(93,229,220,.5); border-radius: 16px; color: var(--cyan); font-size: 25px; background: rgba(4,18,34,.5); }
.visual-hero-community, .community-banner { background-image: linear-gradient(90deg, rgba(8,13,31,.9), rgba(20,18,54,.55)), url('/frontend/assets/allyclan-community-banner.png'); background-position: center; background-size: cover; }
.clan-summary { display: grid; grid-template-columns: auto repeat(3, minmax(0,1fr)); align-items: center; gap: 12px; padding: 12px 15px; margin-bottom: 14px; border: 1px solid var(--line); border-radius: var(--radius); background: rgba(14,27,47,.72); }
.clan-summary > span { margin-right: 5px; }
.clan-summary > div { display: grid; grid-template-columns: auto auto; column-gap: 8px; align-items: baseline; padding-left: 12px; border-left: 1px solid var(--line); }
.clan-summary > div span { color: var(--text); font-size: 12px; font-weight: 700; }.clan-summary > div strong { color: var(--cyan); font-size: 15px; }.clan-summary > div small { grid-column: 2; color: var(--muted); font-size: 10px; }
.alliance-integration-note { grid-column: 1 / -1; display:flex; align-items:center; gap:10px; margin-top:2px; padding:9px 10px; border:1px solid rgba(181,154,255,.32); border-radius:8px; background:rgba(31,26,66,.46); }.alliance-integration-note > div { display:grid; gap:2px; min-width:0; flex:1; }.alliance-integration-note strong { color:var(--text); font-size:11px; }.alliance-integration-note small { color:var(--muted); font-size:10px; }.alliance-integration-note .status-pill { white-space:nowrap; }
.overview-community-card { overflow: hidden; }.community-mini-banner { height: 78px; margin: -2px -2px 13px; border-radius: 8px; background: linear-gradient(90deg, rgba(9,17,34,.18), rgba(9,17,34,.45)), url('/frontend/assets/allyclan-community-banner.png') center/cover; }.overview-posts { display: grid; gap: 10px; }.overview-posts > div { display: grid; grid-template-columns: max-content 1fr; gap: 6px 9px; align-items: center; padding-bottom: 9px; border-bottom: 1px solid rgba(38,59,91,.55); }.overview-posts > div:last-child { border-bottom: 0; padding-bottom: 0; }.overview-posts strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; }.overview-posts small { grid-column: 2; color: var(--muted); font-size: 10px; }
.stats-revision { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; margin-bottom: 16px; }.stats-revision .card { margin: 0; }.metric-warning { color: var(--amber); font-size: 22px; }.metric-positive { color: var(--green); font-size: 22px; }
.cp-grid { grid-template-columns: repeat(auto-fit,minmax(255px,1fr)); }.cp-member-row { display: flex; align-items: center; gap: 8px; padding: 7px 0; border-bottom: 1px solid rgba(38,59,91,.5); }.cp-member-row:last-of-type { border-bottom: 0; }.cp-member-row > div { min-width: 0; flex: 1; }.cp-member-row strong, .cp-member-row small { display: block; }.cp-member-row strong { font-size: 11px; }.cp-member-row small { margin-top: 2px; color: var(--muted); font-size: 10px; }.cp-online { color: var(--green); font-size: 10px; }.cp-role-note { display: block; margin-top: 9px; color: var(--subtle); font-size: 9px; }
.sortable { cursor: pointer; user-select: none; }.sortable:hover { color: var(--cyan); }.attendance-evidence { margin-top: 16px; }.evidence-actions { display: flex; gap: 9px; flex-wrap: wrap; }.community-banner { min-height: 154px; display: flex; align-items: end; padding: 22px 24px; margin-bottom: 16px; border: 1px solid rgba(157,138,255,.35); border-radius: var(--radius); }.community-banner h2 { margin: 5px 0; font-size: 23px; }.community-banner p { margin: 0; color: #cad7ea; }.admin-controls { margin-top: 16px; }.admin-action-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }.admin-action-grid .button { min-height: 38px; text-align: center; }
:root[data-density="compact"] .card { padding: 13px; }:root[data-density="compact"] .visual-hero { min-height: 94px; padding: 15px 18px; }:root[data-density="compact"] .overview-grid, :root[data-density="compact"] .two-column-grid, :root[data-density="compact"] .community-layout { gap: 10px; }:root[data-density="compact"] .kpi-card { padding: 12px; }:root[data-density="compact"] .kpi-card > strong { font-size: 23px; }:root[data-density="comfortable"] .card { padding: 21px; }:root[data-density="comfortable"] .kpi-card { min-height: 93px; }
@media (min-width: 1500px) { .cp-grid { grid-template-columns: repeat(4,minmax(0,1fr)); } }
@media (max-width: 700px) { .visual-hero { min-height: 104px; padding: 16px; }.visual-hero h2 { font-size: 18px; }.hero-mark { width: 42px; height: 42px; }.clan-summary { grid-template-columns: 1fr 1fr; }.clan-summary > span { grid-column: 1/-1; }.stats-revision { grid-template-columns: 1fr; }.admin-action-grid { grid-template-columns: 1fr; }.community-banner { min-height: 132px; padding: 16px; } }
/* Revisión de supervisión: escalado, filtros y controles responsive. */
.stats-revision { grid-template-columns: repeat(3,minmax(0,1fr)); }
.metric-violet { color: var(--violet); font-size: 22px; }
.admin-action-grid { grid-template-columns: repeat(auto-fit,minmax(220px,1fr)); }
.admin-action-grid .button { width: 100%; min-width: 0; white-space: normal; }
.cp-toolbar { align-items: center; flex-wrap: wrap; }
.cp-search { min-width: 220px; flex: 1 1 260px; display: flex; align-items: center; gap: 8px; min-height: 35px; padding: 0 10px; border: 1px solid var(--line); border-radius: 9px; color: var(--muted); background: var(--surface); }
.cp-search input { width: 100%; min-height: 33px; border: 0; outline: 0; color: var(--text); background: transparent; }
.cp-search input::placeholder { color: var(--subtle); }
.cp-status-filter { min-width: 150px; }
.cp-card[hidden] { display: none; }
@media (max-width: 1100px) { .stats-revision { grid-template-columns: 1fr; } }
@media (max-width: 700px) { .cp-search { min-width: 0; flex-basis: 100%; } }

/* Final responsive safeguards for the P1/P2 review. */
.admin-action-grid { grid-template-columns: repeat(auto-fit,minmax(180px,1fr)); }
.admin-action-grid .button { min-width: 0; width: 100%; white-space: normal; overflow-wrap: anywhere; line-height: 1.25; text-align: left; }
.cp-view-toggle { display: flex; flex-wrap: wrap; gap: 4px; margin-left: auto; }
.cp-view-toggle .button { white-space: normal; }
.cp-view-toggle .button.active { color: var(--cyan); border-color: var(--cyan); background: rgba(93,229,220,.1); }
.cp-list-mode { grid-template-columns: 1fr; }
.cp-list-mode .cp-card { display: grid; grid-template-columns: minmax(150px,1fr) minmax(190px,1.3fr) minmax(120px,.8fr) auto; gap: 12px; align-items: center; }
.cp-list-mode .cp-card-heading, .cp-list-mode .cp-stat, .cp-list-mode .cp-roles, .cp-list-mode .cp-card-footer { margin: 0; padding: 0; border: 0; }
.cp-list-mode .cp-card-heading { grid-column: 1; grid-row: 1; }
.cp-list-mode .cp-stat { grid-column: 2; grid-row: 1; }
.cp-list-mode .cp-roles { grid-column: 3; grid-row: 1; }
.cp-list-mode .cp-card-footer { grid-column: 4; grid-row: 1; }
.cp-list-mode .cp-card-top { position: absolute; inset: 15px 15px auto auto; }
.cp-list-mode .cp-role-note { display: none; }
.cp-pagination { display: flex; align-items: center; justify-content: flex-end; gap: 7px; margin-top: 14px; color: var(--muted); font-size: 11px; }
.cp-pagination [data-cp-page] { min-width: 32px; padding-inline: 8px; }
.drop-list { width: 100%; min-width: 0; }
.source-note { padding: 10px 13px; margin: 0 0 14px; border: 1px solid rgba(93,229,220,.2); border-radius: 9px; color: var(--muted); background: rgba(9,25,40,.58); font-size: 11px; }
.drop-row { min-width: 0; flex-wrap: wrap; }
.drop-main { overflow-wrap: anywhere; }
.drop-status { min-width: 0; flex-wrap: wrap; }
.visual-hero-warehouse ~ .card .table-wrap { width: 100%; max-width: 100%; overflow-x: auto; }
.visual-hero-warehouse ~ .card .data-table { min-width: 620px; table-layout: fixed; }
.visual-hero-warehouse ~ .card .data-table th, .visual-hero-warehouse ~ .card .data-table td { overflow-wrap: anywhere; }
@media (max-width: 700px) {
  .admin-action-grid { grid-template-columns: 1fr; }
  .admin-action-grid .button { width: 100%; }
  .cp-view-toggle { width: 100%; margin-left: 0; }
  .cp-view-toggle .button { flex: 1; }
  .cp-list-mode .cp-card { display: block; }
  .cp-list-mode .cp-card-top { position: static; }
  .cp-list-mode .cp-card-heading, .cp-list-mode .cp-stat, .cp-list-mode .cp-roles, .cp-list-mode .cp-card-footer { margin-top: 12px; }
  .cp-pagination { justify-content: space-between; }
}

/* P1: roster controls and predictable sidebar geometry */
#nav {
  min-height: 0;
  flex: 1 1 auto;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 4px 4px 8px 0;
  scrollbar-gutter: stable;
  align-content: start;
}

#nav .nav-block {
  gap: 4px;
}

#nav .nav-item {
  min-height: 40px;
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 9px 12px;
  box-sizing: border-box;
}

#nav .nav-item .nav-glyph {
  width: 22px;
  min-width: 22px;
  text-align: center;
}

#nav .nav-item > span:not(.nav-glyph) {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#nav .nav-item.active {
  box-shadow: inset 3px 0 var(--cyan), 0 8px 20px rgba(0, 0, 0, .14);
}

.roster-filter-panel {
  display: grid;
  grid-template-columns: minmax(200px, 2fr) repeat(6, minmax(120px, 1fr)) auto;
  gap: 8px;
  align-items: end;
  margin-bottom: 13px;
}

.roster-filter-control {
  display: grid;
  gap: 4px;
  color: var(--muted);
  font-size: 10px;
}

.roster-filter-control .select {
  min-width: 0;
  width: 100%;
}

.roster-filter-search {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: var(--surface);
  color: var(--muted);
}

.roster-filter-search input {
  width: 100%;
  min-height: 35px;
  color: var(--text);
  border: 0;
  outline: 0;
  background: transparent;
}

.roster-filter-results {
  color: var(--cyan);
  font-size: 10px;
  white-space: nowrap;
}

/* El roster vive dentro de una columna con chat lateral: mantener sus filtros legibles. */
.roster-filter-panel {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.roster-filter-search,
.roster-filter-results {
  grid-column: 1 / -1;
}

.roster-table th[data-roster-sort] {
  cursor: pointer;
  user-select: none;
  white-space: nowrap;
}

.roster-table th[data-roster-sort]:hover,
.roster-table th[data-roster-sort]:focus-visible {
  color: var(--cyan);
}

.roster-access-metrics {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 10px 0 8px;
}

.roster-access-metrics > span {
  min-width: 100px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(8, 18, 32, .42);
}

.roster-access-metrics b,
.roster-access-metrics small {
  display: block;
}

.roster-access-metrics b {
  font-size: 17px;
}

.roster-access-metrics small {
  margin-top: 2px;
  color: var(--muted);
  font-size: 9px;
  text-transform: none;
  letter-spacing: 0;
}

@media (max-width: 1180px) {
  .roster-filter-panel {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .roster-filter-search,
  .roster-filter-results {
    grid-column: 1 / -1;
  }
}

@media (max-width: 700px) {
  .roster-filter-panel {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .roster-filter-search {
    grid-column: 1 / -1;
  }

  .roster-filter-control .select {
    max-width: 100%;
  }
}

@media (max-width: 420px) {
  .roster-filter-panel {
    grid-template-columns: 1fr;
  }
}

/* P1 responsive closure: keep dense tools inside the primary column. */
@media (max-width: 1400px) and (min-width: 701px) {
  .roster-filter-panel {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .roster-filter-search,
  .roster-filter-results {
    grid-column: 1 / -1;
  }
}

@media (max-width: 1100px) {
  .community-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .community-layout > .stack,
  .community-layout .card,
  .community-layout .composer,
  .community-layout .composer label,
  .community-layout .composer .input,
  .community-layout .composer .select,
  .community-layout .composer .textarea {
    min-width: 0;
    max-width: 100%;
  }
}

/* Paneles flotantes persistentes: quedan sobre la aplicación y debajo de los modales. */
#widget-floating-root { position: fixed; inset: 0; z-index: 55; pointer-events: none; }
.widget-portal { position: absolute; right: calc(var(--rail) + 20px); bottom: 20px; width: min(860px, calc(100vw - var(--rail) - 48px)); max-height: min(44vh, 520px); display: grid; grid-template-columns: repeat(2, minmax(280px, 1fr)); align-items: start; gap: 10px; overflow: auto; padding: 12px; pointer-events: none; }
.widget-portal-heading { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 8px 12px; border: 1px solid rgba(93,229,220,.3); border-radius: 9px; color: var(--muted); background: rgba(7,16,30,.96); box-shadow: 0 18px 50px rgba(0,0,0,.4); }
.widget-portal-heading { grid-column: 1 / -1; }
.widget-portal-heading small { color: var(--muted); letter-spacing: 0; text-transform: none; }
.widget-portal .widget-window { margin: 0; pointer-events: auto; }
.widget-portal .widget-window[data-widget-readonly="true"] button, .widget-portal .widget-window[data-widget-readonly="true"] select { pointer-events: none; opacity: .56; }
.widget-portal .widget-window[data-widget-readonly="true"] button:disabled, .widget-portal .widget-window[data-widget-readonly="true"] select:disabled { cursor: not-allowed; filter: grayscale(.25); }
.widget-portal .widget-window[data-widget-readonly="true"]:after { content: 'Lectura en vivo'; justify-self: end; color: var(--cyan); font-size: 10px; }
@media (max-width: 1100px) { .widget-portal { grid-template-columns: 1fr; width: min(620px, calc(100vw - var(--rail) - 32px)); } }
@media (max-width: 940px) { .widget-portal { right: 12px; bottom: 12px; width: min(560px, calc(100vw - 24px)); max-height: 52vh; } }
/* Host nativo: el proceso Electron aporta la ventana always-on-top sobre L2. */
html.desktop-widget-overlay, body.desktop-widget-overlay { width:100%; height:100%; min-height:100%; overflow:hidden; background:transparent !important; }
body.desktop-widget-overlay > .app-shell, body.desktop-widget-overlay > .toast, body.desktop-widget-overlay > #modal-root { display:none !important; }
body.desktop-widget-overlay #widget-floating-root { position:fixed; inset:0; z-index:9999; pointer-events:none; }
body.desktop-widget-overlay .widget-portal { position:fixed; inset:0; width:100%; height:100%; max-height:none; display:block; padding:0; overflow:visible; pointer-events:none; }
body.desktop-widget-overlay .widget-portal-heading { display:none; }
body.desktop-widget-overlay .widget-portal .widget-window { position:fixed !important; inset:0 !important; width:100% !important; height:100% !important; max-width:none; max-height:none; margin:0; padding:12px; border-radius:10px; overflow:auto; pointer-events:auto; }
body.desktop-widget-overlay .widget-window-head { min-height:28px; padding:3px 2px 7px; border-bottom:1px solid rgba(93,229,220,.2); cursor:move; }
body.desktop-widget-overlay .widget-window-head h3 { margin:2px 0 0; font-size:14px; }
body.desktop-widget-overlay .widget-window-head .eyebrow { font-size:8px; }
body.desktop-widget-overlay .widget-window-controls { gap:6px; padding-top:8px; }
body.desktop-widget-overlay .widget-resize-handle { position:fixed; right:4px; bottom:4px; width:16px; height:16px; cursor:nwse-resize; opacity:.75; }
body.desktop-widget-overlay .widget-resize-handle::after { content:'◢'; color:var(--cyan); font-size:13px; }
.desktop-overlay-tools { display:flex; align-items:center; gap:4px; }
.desktop-overlay-button { width:24px; height:22px; padding:0; border:1px solid rgba(93,229,220,.35); border-radius:5px; color:var(--text); background:rgba(9,24,41,.9); cursor:pointer; line-height:1; }
.desktop-overlay-button:hover { border-color:var(--cyan); color:var(--cyan); }
.desktop-overlay-button.danger:hover { border-color:#ff708b; color:#ff9aae; }
.widget-window-head-actions { display:flex; align-items:center; gap:7px; }
body.desktop-widget-overlay .widget-window-head-actions > .button[data-action="close-widget"] { display:none; }
body.desktop-widget-overlay .widget-window-head { user-select:none; }
body.desktop-widget-overlay .widget-window { border-color:rgba(93,229,220,.85); box-shadow:0 8px 28px rgba(0,0,0,.45),0 0 18px rgba(93,229,220,.12); }
.widget-portal .widget-window { overflow:auto; scrollbar-width:thin; scrollbar-color:rgba(93,229,220,.7) rgba(7,16,30,.7); }
.widget-portal .widget-window::-webkit-scrollbar { width:8px; height:8px; }
.widget-portal .widget-window::-webkit-scrollbar-track { background:rgba(7,16,30,.75); border-radius:8px; }
.widget-portal .widget-window::-webkit-scrollbar-thumb { background:linear-gradient(var(--cyan),#4b91aa); border-radius:8px; border:2px solid rgba(7,16,30,.75); }
.widget-resize-handle { position:absolute; right:4px; bottom:4px; width:16px; height:16px; cursor:nwse-resize; opacity:.7; z-index:4; }
.widget-resize-handle::after { content:'◢'; color:var(--cyan); font-size:13px; }
.caller-board { display:grid; gap:8px; }
.caller-board-section { padding:9px; border:1px solid rgba(93,229,220,.22); border-radius:8px; background:rgba(11,25,43,.72); }
.caller-board-title, .caller-board-columns, .caller-board-row { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(65px,.7fr) minmax(70px,.7fr) minmax(70px,.7fr); align-items:center; gap:8px; }
.caller-board-title { grid-template-columns:1fr auto; padding-bottom:7px; border-bottom:1px solid rgba(38,59,91,.7); }
.caller-board-title strong { color:var(--text); font-size:12px; }
.caller-board-title small, .caller-board-columns, .caller-board-row small { color:var(--muted); font-size:9px; text-transform:none; letter-spacing:0; }
.caller-board-columns { padding:6px 4px 4px; color:var(--subtle); font-size:8px; text-transform:uppercase; }
.caller-board-row { min-height:25px; padding:5px 4px; border-bottom:1px solid rgba(38,59,91,.45); }
.caller-board-row:last-child { border-bottom:0; }
.caller-board-row strong { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:11px; }
.caller-avatar { color:var(--violet); font-size:12px; text-align:center; }
.caller-state { display:inline-flex; align-items:center; gap:4px; font-size:9px; white-space:nowrap; }
.caller-state i { width:6px; height:6px; border-radius:50%; background:var(--amber); }
.caller-state.is-live i { background:var(--green); box-shadow:0 0 6px var(--green); }
.caller-state.is-off i { background:var(--danger); }
.caller-static { color:var(--muted); }
.caller-static i { background:var(--cyan); }
.caller-board-cps .caller-board-row { grid-template-columns:minmax(0,1fr) minmax(90px,.8fr) minmax(70px,.7fr) minmax(70px,.7fr); }
.caller-board-off { display:flex; flex-wrap:wrap; align-items:center; gap:10px; padding:8px; color:var(--muted); font-size:10px; border:1px solid rgba(143,112,255,.25); border-radius:8px; background:rgba(57,40,106,.18); }
.caller-board-off strong { color:var(--text); margin-right:auto; }
/* CP toolbar: separate search/status from operational filters for readability. */
.cp-toolbar { display: grid; grid-template-columns: minmax(240px,1fr) minmax(150px,auto) auto; align-items: center; gap: 12px; padding: 4px 0 2px; }
.cp-toolbar > [data-cp-filters] { grid-column: 1 / -1; display: flex; align-items: center; gap: 7px; padding-top: 7px; border-top: 1px solid rgba(38,59,91,.5); }
.cp-toolbar > [data-cp-filters] button { min-height: 31px; padding: 6px 11px; }
.cp-toolbar > [data-cp-filters] button.active { color: var(--cyan); border-color: var(--cyan); background: rgba(93,229,220,.1); }
.cp-toolbar .cp-view-toggle { grid-column: 2 / -1; justify-self: end; margin-left: 0; }
@media (max-width: 700px) { .cp-toolbar { grid-template-columns: 1fr; gap: 9px; }.cp-toolbar > [data-cp-filters] { grid-column: 1; overflow-x: auto; }.cp-toolbar .cp-view-toggle { grid-column: 1; justify-self: start; } }
/* Administración: nunca comprimir acciones hasta truncar sus etiquetas. */
.admin-controls .admin-action-grid { grid-template-columns: repeat(auto-fit,minmax(min(100%,260px),1fr)); }
.admin-controls .admin-action-grid > .button { display: flex; align-items: center; justify-content: center; min-width: 0; width: 100%; overflow-wrap: anywhere; white-space: normal; }
/* Evidencias agrupadas dentro del evento, nunca como módulos huérfanos. */
.event-evidence-sections { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.event-evidence-sections section { padding: 13px; border: 1px solid var(--line); border-radius: 9px; background: rgba(8,18,32,.42); }
.event-evidence-sections .button { margin-top: 5px; }
.event-contract-note, .event-evidence-contract, .evidence-pending-note { padding: 11px 13px; margin: 0 0 14px; border: 1px solid rgba(93,229,220,.2); border-radius: 9px; color: var(--muted); background: rgba(9,25,40,.58); font-size: 11px; }
.event-contract-note code, .event-evidence-contract span { color: var(--cyan); }
.event-evidence-contract { display: grid; gap: 4px; margin-top: 12px; }
.event-evidence-flow section { min-height: 330px; }
.cp-whatsapp-banner { display:flex; align-items:center; gap:12px; margin:0 0 14px; padding:12px 14px; border:1px solid rgba(37,211,102,.42); border-radius:10px; background:linear-gradient(100deg,rgba(16,65,50,.68),rgba(8,24,35,.62)); }
.cp-whatsapp-banner img { width:34px; height:34px; flex:0 0 auto; }
.cp-whatsapp-banner > div { display:grid; gap:3px; flex:1; min-width:0; }
.cp-whatsapp-banner strong { color:var(--text); }
.cp-whatsapp-banner small { color:var(--muted); }
.cp-whatsapp-banner .button { flex:0 0 auto; }
.attendance-evidence-panel { grid-column: 1 / -1; }
.attendance-source-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:10px; }
.attendance-source-card { min-width:0; padding:11px; border:1px solid rgba(93,229,220,.18); border-radius:8px; background:rgba(7,18,32,.52); }
.attendance-source-card h3 { font-size:13px; }
.attendance-source-card .evidence-preview { max-height:82px; }
.attendance-compare { display:grid; gap:4px; margin-top:11px; padding:10px 12px; border:1px solid rgba(93,229,220,.3); border-radius:8px; color:var(--muted); background:rgba(8,34,42,.5); font-size:11px; }
.attendance-compare strong { color:var(--cyan); }
.attendance-compare-warning { border-color:rgba(244,184,72,.62); background:rgba(67,47,18,.45); }
.attendance-compare-warning strong { color:var(--amber); }
.attendance-compare-ok strong { color:var(--green); }
.evidence-section-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.evidence-section-heading h3 { margin: 4px 0 0; font-size: 14px; }
.evidence-status-row { display: grid; gap: 5px; margin: 12px 0 5px; }
.evidence-status-row small, .evidence-file-name { color: var(--muted); font-size: 10px; }
.evidence-state { width: fit-content; padding: 4px 7px; border: 1px solid var(--line); border-radius: 99px; color: var(--text); font-size: 10px; }
.evidence-state.cargada { border-color: var(--cyan); color: var(--cyan); }.evidence-state.analizando { border-color: var(--violet); color: var(--violet); }.evidence-state.propuesta, .evidence-state.requiere-revisión { border-color: var(--amber); color: var(--amber); }.evidence-state.aceptada { border-color: var(--green); color: var(--green); }
.evidence-preview { display: block; width: 100%; max-height: 120px; object-fit: cover; margin-top: 9px; border: 1px solid var(--line); border-radius: 7px; opacity: .86; }
.accepted-copy { margin-top: 12px; padding: 9px; border-left: 2px solid var(--green); color: var(--muted); background: rgba(51,196,137,.07); font-size: 11px; }
.accepted-copy strong { color: var(--green); }.accepted-copy small { display: inline-block; margin-top: 4px; color: var(--text); }
@media (max-width: 700px) { .event-evidence-sections { grid-template-columns: 1fr; }.attendance-source-grid { grid-template-columns:1fr; }.attendance-evidence-panel { grid-column:auto; } }
@media (max-width: 700px) { .cp-whatsapp-banner { align-items:flex-start; flex-wrap:wrap; }.cp-whatsapp-banner .button { margin-left:46px; } }
.random-contract-note, .random-pending-note { padding: 11px 13px; margin: 0 0 14px; border: 1px solid rgba(157,138,255,.25); border-radius: 9px; color: var(--muted); background: rgba(27,21,58,.5); font-size: 11px; }
.random-invite-groups { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; max-height: 260px; overflow: auto; padding: 10px 0; }
.random-invite-groups > div { display: grid; gap: 6px; align-content: start; }
.random-invite-option, .random-participant-option { display: flex; align-items: flex-start; gap: 8px; padding: 8px; border: 1px solid rgba(38,59,91,.65); border-radius: 7px; background: rgba(8,18,32,.4); cursor: pointer; }
.random-invite-option:hover, .random-participant-option:hover { border-color: var(--violet); }
.random-invite-option input, .random-participant-option input { margin-top: 2px; accent-color: var(--violet); }
.random-invite-option span, .random-participant-option span { min-width: 0; }.random-invite-option strong, .random-invite-option small, .random-participant-option strong, .random-participant-option small { display: block; }.random-invite-option small, .random-participant-option small { margin-top: 2px; color: var(--muted); font-size: 10px; }
.random-detail-meta { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; color: var(--muted); font-size: 10px; }.random-detail-meta > span { padding: 5px 7px; border: 1px solid var(--line); border-radius: 99px; }.random-detail-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }.random-detail-grid section { min-width: 0; padding: 13px; border: 1px solid var(--line); border-radius: 9px; background: rgba(8,18,32,.42); }.random-participant-list { display: grid; gap: 5px; max-height: 230px; overflow: auto; margin: 10px 0; }.random-draw-result { display: grid; gap: 5px; padding: 12px; margin: 12px 0; border: 1px solid rgba(93,229,220,.35); border-radius: 8px; color: var(--cyan); background: rgba(93,229,220,.08); }.random-draw-result small { color: var(--muted); }.random-close-note { display: inline-block; align-self: center; color: var(--muted); font-size: 10px; }.random-result-mark { color: var(--violet); font-size: 10px; white-space: nowrap; }.random-invite-copy { display: grid; gap: 3px; margin-top: 14px; }.random-invite-copy small { color: var(--muted); }.random-row .button { margin-left: auto; }.random-row { grid-template-columns: auto minmax(0,1fr) auto auto; }
@media (max-width: 900px) { .random-detail-grid { grid-template-columns: 1fr; }.random-detail-grid section { min-height: auto; } }
@media (max-width: 700px) { .random-invite-groups { grid-template-columns: 1fr; max-height: 340px; }.random-row { grid-template-columns: auto minmax(0,1fr) auto; }.random-result-mark { grid-column: 2/-1; }.random-row .button { grid-column: 3; grid-row: 1; } }
.widget-profile-actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px;max-width:320px}.widget-profile-actions .button{padding:6px 9px;font-size:11px}.widget-profile-actions .button.active{border-color:var(--cyan);color:var(--cyan);background:rgba(91,226,255,.08)}
/* Resumen y comunidad: componentes compartidos de lectura táctica. */
.overview-grid > .stack { display: contents; }
.context-card { box-shadow: 0 0 0 1px rgba(93,229,220,.04), var(--shadow); }
.community-banner { position: relative; overflow: hidden; box-shadow: 0 18px 55px rgba(0,0,0,.2); }
.community-banner::after { position: absolute; inset: 0; content: ''; pointer-events: none; background: linear-gradient(110deg, rgba(73,39,140,.14), transparent 55%, rgba(0,215,220,.1)); }
.community-banner > div { position: relative; z-index: 1; }

/* Global roster context: useful on every tab without consuming the page header. */
.global-clan-summary { margin-bottom: 12px; padding: 9px 13px; }
.global-clan-summary > div { min-height: 32px; }
.global-clan-summary > div strong { font-size: 14px; }
.global-clan-summary > div small { font-size: 9px; }

/* Page descriptions are orientation only; keep the working surface visible. */
.visual-hero { min-height: 82px; padding: 14px 18px; margin-bottom: 12px; }
.visual-hero h2 { margin: 3px 0 2px; font-size: 18px; }
.visual-hero p { font-size: 10px; }
.hero-mark { width: 42px; height: 42px; border-radius: 12px; font-size: 19px; }
.roster-history-card { margin-bottom: 12px; }
.roster-history-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.roster-history-grid > div { display:grid; gap:4px; padding:10px 12px; border:1px solid var(--line); border-radius:9px; background:rgba(9,22,39,.58); }
.roster-history-grid strong { font-size:22px; }
.roster-history-grid small, .history-footnote, .history-first-snapshot small { color:var(--muted); font-size:10px; }
.history-first-snapshot { display:grid; gap:4px; padding:10px 12px; border-left:2px solid var(--cyan); background:rgba(9,25,40,.58); }
.history-footnote { display:block; margin-top:10px; }
@media (max-width:700px) { .roster-history-grid { grid-template-columns:1fr; } }
.roster-access-card,.access-stat-card { margin-top: 14px; }.access-state { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; font-weight: 700; }.access-granted { color: var(--green); }.access-missing { color: var(--amber); }.roster-access-card strong,.access-stat-card strong { color: inherit; }
.community-rail-card { padding: 14px; border: 1px solid var(--line); border-top: 2px solid var(--violet); border-radius: var(--radius); background: linear-gradient(155deg, rgba(30,28,65,.88), rgba(12,21,35,.9)); box-shadow: var(--shadow); }.community-rail-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:10px; margin-bottom:12px; }.community-rail-heading h3 { margin:5px 0 0; font-size:14px; }.community-channel-tabs { display:grid; gap:3px; margin-bottom:12px; }.community-channel-tab { display:flex; align-items:center; gap:7px; min-height:30px; padding:6px 8px; border:0; border-radius:7px; color:var(--muted); background:transparent; text-align:left; font-size:11px; }.community-channel-tab:hover,.community-channel-tab.active { color:var(--text); background:rgba(83,71,137,.28); }.community-channel-tab > span { color:var(--violet); font-weight:800; }.community-channel-tab strong { flex:1; font-weight:700; }.community-channel-tab b { min-width:16px; padding:2px 4px; border-radius:5px; color:#fff; background:var(--violet); font-size:9px; text-align:center; }.community-chat-preview { padding-top:11px; border-top:1px solid var(--line); }.community-chat-title { display:flex; justify-content:space-between; gap:8px; margin-bottom:9px; }.community-chat-title small { color:var(--muted); font-size:10px; }.community-message-list { display:grid; gap:9px; max-height:210px; overflow:auto; }.community-message { display:flex; gap:7px; min-width:0; }.community-message > div { min-width:0; flex:1; }.community-message strong { font-size:10px; }.community-message small { margin-left:5px; color:var(--subtle); font-size:9px; }.community-message p { margin:2px 0 0; color:#c9d4e2; font-size:10px; line-height:1.35; overflow-wrap:anywhere; }.community-chat-compose { display:flex; gap:6px; margin-top:11px; }.community-chat-compose .input { min-width:0; min-height:31px; padding:6px 8px; font-size:10px; }.community-chat-compose .button { min-height:31px; padding:6px 8px; font-size:10px; }
.access-request-row { display:flex; justify-content:space-between; align-items:center; gap:18px; padding:13px 0; border-bottom:1px solid rgba(38,59,91,.65); }.access-request-row:last-child { border-bottom:0; }.access-request-main { display:flex; align-items:flex-start; gap:10px; min-width:0; flex:1; }.access-request-main > div { min-width:0; }.access-request-main strong,.access-request-main small,.access-request-main p { display:block; }.access-request-main small { margin-top:3px; color:var(--muted); font-size:10px; text-transform:none; letter-spacing:0; }.access-request-main p { margin:6px 0 0; color:var(--subtle); font-size:10px; }.access-request-icon { width:23px; height:23px; flex:0 0 auto; display:grid; place-items:center; border:1px solid currentColor; border-radius:7px; font-weight:800; }.access-request-icon.accepted,.access-request-status.accepted { color:var(--green); }.access-request-icon.pending,.access-request-status.pending { color:var(--amber); }.access-request-icon.rejected,.access-request-status.rejected { color:var(--red); }.access-request-actions { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:6px; }.access-request-actions .button { min-height:29px; padding:5px 8px; font-size:10px; }.access-request-status { min-width:60px; font-size:10px; font-weight:700; text-align:right; }
.button.danger { border-color: rgba(255,108,137,.55); color: #ff9ab2; background: rgba(116,34,58,.28); }.button.danger:hover { border-color: var(--red); color: #ffd4dd; background: rgba(144,43,68,.5); }.access-request-actions .access-action-button { min-height:32px; padding:6px 9px; border-radius:7px; font-size:10px; }.access-request-actions .button.secondary { border-color:#617592; color:#d7e5f5; background:rgba(44,65,91,.5); }.access-request-actions .button.secondary:hover { border-color:var(--amber); color:#ffe29a; background:rgba(98,74,28,.42); }
.widget-character-selector { display:grid; gap:6px; margin:12px 0; padding:10px; border:1px solid rgba(93,229,220,.25); border-radius:8px; background:rgba(8,18,32,.45); color:var(--muted); font-size:10px; }.widget-character-selector .select { min-height:32px; }.widget-character-selector small { color:var(--subtle); font-size:9px; }
.community-message-image { display:block; width:auto; max-width:100%; height:auto; max-height:220px; margin-top:6px; object-fit:contain; border:1px solid var(--line); border-radius:8px; cursor:zoom-in; }.community-chat-compose { position:relative; flex-wrap:wrap; }.community-paste-hint { flex-basis:100%; color:var(--subtle); font-size:9px; }.image-viewer-backdrop { position:fixed; inset:0; z-index:1000; display:grid; place-items:center; padding:24px; background:rgba(1,5,14,.96); backdrop-filter:blur(12px); cursor:zoom-out; }.image-viewer-shell { position:relative; display:grid; place-items:center; max-width:96vw; max-height:94vh; padding:8px; cursor:default; }.image-viewer-image { display:block; width:auto; max-width:94vw; height:auto; max-height:86vh; object-fit:contain; border:1px solid rgba(93,229,220,.5); border-radius:10px; background:#050b16; box-shadow:0 22px 80px rgba(0,0,0,.6); }.image-viewer-shell small { margin-top:8px; color:#a9bad3; font-size:10px; }.image-viewer-close { position:absolute; top:-12px; right:-12px; z-index:1; width:34px; height:34px; border:1px solid rgba(93,229,220,.7); border-radius:50%; color:var(--text); background:#102039; font-size:22px; line-height:1; }.image-viewer-close:hover { color:#06101a; background:var(--cyan); }
@media (min-width: 1401px) { :root { --rail: 375px; } }
@media (min-width: 941px) and (max-width: 1400px) { :root { --rail: 320px; } }
@media (max-width: 1180px) and (min-width: 941px) { :root { --rail: 280px; }.content-layout { grid-template-columns: minmax(0,1fr) var(--rail); } }

/* v8 visual audit: keep the primary reading column usable at intermediate widths. */
.sidebar { z-index: 60 !important; }
.sidebar #nav { position: relative; z-index: 61 !important; }

/* v9 mobile shell: keep the main view in flow and make the navigation recoverable. */
@media (max-width: 700px) {
  .topbar-leading { min-width: 0; flex: 1 1 auto; align-items: flex-start; }
  .topbar-leading .location { min-width: 0; }
  .mobile-menu { width: 36px; height: 36px; flex: 0 0 36px; padding: 0; border: 1px solid var(--line); border-radius: 9px; color: var(--cyan); background: rgba(14, 25, 42, .92); font-size: 18px; line-height: 1; }
  .mobile-menu:focus-visible { outline: 2px solid var(--cyan); outline-offset: 2px; }
  .sidebar-open .mobile-menu { color: var(--amber); border-color: rgba(246, 198, 94, .45); }
  .sidebar { z-index: 60 !important; }
  .sidebar-scrim { z-index: 55 !important; }
}

/* v10 mobile shell: force the visible state to win over the off-canvas base rule. */
@media (max-width: 700px) {
  body:not(.sidebar-open) .sidebar { transform: translate3d(-105%, 0, 0) !important; }
  body.sidebar-open .sidebar { left: 0 !important; transform: translate3d(0, 0, 0) !important; visibility: visible !important; }
}
.content-layout { grid-template-columns: minmax(0, 1fr); }
.content-layout:has(> .context-rail) { grid-template-columns: minmax(0, 1fr) minmax(250px, var(--rail)); }
@media (max-width: 1180px) {
  .content-layout:has(> .context-rail) { grid-template-columns: minmax(0, 1fr); }
  .context-rail { position: static; grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .widget-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
  .context-rail { grid-template-columns: minmax(0, 1fr); }
  .widget-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 940px) { .widget-stage-floating { right:12px; bottom:12px; width:min(560px,calc(100vw - 24px)); max-height:70vh; } }

/* Eventos: estado y acciones comparten una escala y una línea visual estable. */
.event-card { align-items: stretch; }
.event-card-main { display: grid; align-content: center; gap: 2px; }
.event-title-row { align-items: center; }
.event-title-row > .badge { min-width: 88px; min-height: 34px; justify-content: center; padding: 7px 10px; border-radius: 8px; font-size: 10px; line-height: 1; box-sizing: border-box; }
.event-actions { align-self: center; min-width: 136px; justify-content: flex-end; gap: 8px; }
.event-actions > .button.primary { min-width: 112px; min-height: 34px; justify-content: center; padding-inline: 10px; text-align: center; }
.event-actions > .button { min-width: 78px; min-height: 34px; justify-content: center; padding: 8px 12px; text-align: center; box-sizing: border-box; }
.event-actions > .button.primary { min-width: 86px; }
.event-actions > .button.text { border: 1px solid rgba(99,237,241,.3); border-radius: 8px; background: rgba(17,32,51,.86); color: #dffaff; }
.event-card { display: grid; grid-template-columns: 90px minmax(0, 1fr) auto; align-items: center; }
.event-actions { display: flex; align-items: center; justify-content: flex-end; min-width: 258px; gap: 8px; }
.event-actions > .button, .event-actions > .button.primary { flex: 0 0 78px; width: 78px; min-width: 78px !important; height: 36px; padding-inline: 8px; }
.event-actions > .button.primary { flex-basis: 86px; width: 86px; }
.event-actions > .row-menu { width: 34px; height: 34px; flex: 0 0 34px; }
.event-actions > .attendance-action { flex-basis: 104px; width: 104px; min-width: 104px !important; }
.event-actions > .badge { flex: 0 0 auto; height: 36px !important; min-height: 36px !important; box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; white-space: nowrap; }

/* Modal de detalle Random: el ancho acompaña las tres columnas y evita texto estrangulado. */
.modal:has(.random-detail-grid) { width: min(1040px, calc(100vw - 32px)); max-height: calc(100vh - 32px); overflow-y: auto; }
.modal:has(.random-detail-grid) .random-detail-grid { grid-template-columns: repeat(3, minmax(220px, 1fr)); gap: 14px; align-items: start; }
.modal:has(.random-detail-grid) .random-detail-grid section { min-height: 0; padding: 15px; }
.modal:has(.random-detail-grid) .random-detail-grid h3 { line-height: 1.25; }
.modal:has(.random-detail-grid) .random-participant-list { max-height: 260px; }
.modal:has(.random-detail-grid) .random-edit-controls { display:grid; grid-template-columns:1.2fr repeat(3,minmax(0,1fr)); gap:8px; align-items:end; margin-bottom:12px; padding:10px 12px; border:1px solid var(--line); border-radius:10px; background:rgba(8,18,32,.46); }
.modal:has(.random-detail-grid) .random-edit-controls > div { min-width:0; }
.modal:has(.random-detail-grid) .random-edit-controls > div strong,.modal:has(.random-detail-grid) .random-edit-controls > div small { display:block; }
.modal:has(.random-detail-grid) .random-edit-controls .modal-field { margin:0; }
.modal:has(.random-detail-grid) .random-edit-controls .button { min-height:36px; }
.modal:has(.random-detail-grid) .random-wheel-stage { margin-top:4px; }

@media (max-width: 1080px) {
  .modal:has(.random-detail-grid) .random-detail-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 700px) {
  .event-card { align-items: flex-start; }
  .event-title-row { align-items: flex-start; }
  .event-title-row > .badge { min-width: 82px; }
  .event-actions { width: 100%; min-width: 0; justify-content: flex-end; }
  .event-actions > .attendance-action { flex: 1 1 0; width: auto; min-width: 0 !important; }
  .modal:has(.random-detail-grid) { width: min(100%, calc(100vw - 24px)); max-height: calc(100vh - 24px); padding: 18px; }
  .modal:has(.random-detail-grid) .random-detail-grid { grid-template-columns: 1fr; gap: 10px; }
  .modal:has(.random-detail-grid) .random-detail-grid section { min-height: 0; }
}
.random-wheel-stage{position:relative;width:min(270px,80vw);height:calc(min(270px,80vw) + 24px);margin:12px auto 16px;display:grid;place-items:end center}.random-wheel-pointer{position:absolute;top:0;left:50%;z-index:4;transform:translateX(-50%);font-style:normal;color:#f2d18a;font-size:22px;line-height:1;text-shadow:0 2px 4px #000;filter:drop-shadow(0 0 5px rgba(242,209,138,.55))}.random-wheel{position:relative;width:min(250px,76vw);height:min(250px,76vw);border:7px solid #b58a42;border-radius:50%;display:grid;place-items:center;background:conic-gradient(#263d83,#793c7c,#2b8a83,#8d5a2c,#263d83);box-shadow:0 0 30px rgba(181,138,66,.25),inset 0 0 0 4px rgba(255,255,255,.12);overflow:hidden;transform:rotate(var(--roulette-stop-angle,0deg))}.random-wheel>b{position:relative;z-index:2;width:42px;height:42px;display:grid;place-items:center;border:2px solid #f2d18a;border-radius:50%;color:#f2d18a;background:#12142a;font-size:22px}.random-wheel-labels{position:absolute;inset:0}.random-wheel-labels span{position:absolute;left:50%;top:50%;transform:rotate(var(--angle)) translateY(calc(min(125px,40vw) * -1 + 22px)) rotate(calc(var(--angle) * -1 - var(--roulette-stop-angle,0deg)));transform-origin:center;color:#fff;font-size:10px;font-weight:700;white-space:nowrap;text-shadow:0 1px 3px #000}.random-wheel.spinning{animation:random-wheel-spin 20s cubic-bezier(.12,.8,.2,1) forwards}.random-wheel.spun{box-shadow:0 0 36px rgba(93,229,220,.35),inset 0 0 0 4px rgba(255,255,255,.16)}@keyframes random-wheel-spin{from{transform:rotate(0deg)}to{transform:rotate(calc(2160deg + var(--roulette-stop-angle,0deg)))}}
.random-empty-wheel{margin:18px auto;padding:28px 18px;max-width:300px;text-align:center;border:1px dashed var(--line);border-radius:12px;color:var(--muted);background:rgba(8,18,32,.42)}
.random-wheel-labels span{width:var(--label-width,72px);padding:3px 4px;box-sizing:border-box;transform:rotate(var(--angle)) translateY(-74px) rotate(calc(var(--angle) * -1 - var(--roulette-stop-angle,0deg)));font-size:clamp(8px,1.45vw,10px);font-weight:800;line-height:1.12;text-align:center;white-space:normal;overflow-wrap:anywhere;background:rgba(7,15,28,.38);border:1px solid rgba(255,255,255,.16);border-radius:5px}
.random-wheel.spinning .random-wheel-labels span{background:rgba(7,15,28,.2);border-color:transparent}
.random-wheel-labels span{padding:0;background:transparent;border:0;transform:rotate(var(--angle)) translateY(-74px) rotate(calc(var(--angle) * -1))}
.random-wheel-labels span b{display:block;width:100%;padding:3px 4px;box-sizing:border-box;color:#fff;font:inherit;line-height:1.12;text-align:center;white-space:normal;overflow-wrap:anywhere;background:rgba(7,15,28,.48);border:1px solid rgba(255,255,255,.18);border-radius:5px;transform:rotate(calc(var(--roulette-stop-angle,0deg) * -1));}
.random-wheel.spinning .random-wheel-labels{visibility:visible}
.random-wheel.spinning .random-wheel-labels span b{animation:random-wheel-label-counter 20s cubic-bezier(.12,.8,.2,1) forwards;background:rgba(7,15,28,.3);border-color:rgba(255,255,255,.1)}
@keyframes random-wheel-label-counter{from{transform:rotate(0deg)}to{transform:rotate(-2160deg)}}
.modal:has(.fresh-event-grid){width:min(1180px,calc(100vw - 32px));max-height:calc(100vh - 32px);overflow-y:auto}
.fresh-event-form{display:grid;grid-template-columns:1.2fr repeat(4,minmax(0,1fr));gap:10px;align-items:end;padding:13px 15px;margin-bottom:14px;border:1px solid rgba(93,229,220,.3);border-radius:12px;background:linear-gradient(135deg,rgba(13,34,50,.9),rgba(8,18,32,.78))}
.fresh-event-form>div{display:grid;gap:3px}.fresh-event-form>div strong{font-size:14px}.fresh-event-form>div small{color:var(--muted);font-size:10px}.fresh-event-form label{display:grid;gap:5px;color:var(--muted);font-size:10px;font-weight:700}.fresh-event-form .button{min-height:38px}
.fresh-event-summary{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0 0 14px;color:var(--muted);font-size:10px}.fresh-event-summary>span{padding:6px 8px;border:1px solid var(--line);border-radius:999px}.fresh-event-grid{display:grid;grid-template-columns:minmax(210px,.85fr) minmax(300px,1.15fr) minmax(240px,1fr);gap:12px;align-items:start}.fresh-event-card{min-width:0;padding:14px;border:1px solid var(--line);border-radius:11px;background:rgba(8,18,32,.55)}.fresh-card-heading{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}.fresh-card-heading h3{margin:4px 0 0;font-size:15px}.fresh-participant-list{display:grid;gap:6px;max-height:300px;overflow:auto;margin:12px 0}.fresh-participant{display:grid;grid-template-columns:auto minmax(0,1fr);gap:9px;align-items:start;padding:9px;border:1px solid var(--line);border-radius:8px;background:rgba(19,34,55,.58);cursor:pointer}.fresh-participant:hover{border-color:var(--cyan)}.fresh-participant input{margin-top:3px;accent-color:var(--violet)}.fresh-participant strong,.fresh-participant small{display:block}.fresh-participant small{margin-top:3px;color:var(--muted);font-size:9px}.fresh-participant.external{opacity:.7}.fresh-external-field{display:grid;gap:5px;color:var(--muted);font-size:10px;font-weight:700}.fresh-event-card>.button{width:100%;margin-top:8px}.fresh-roulette-card{text-align:center}.fresh-roulette-card .fresh-card-heading{text-align:left}.fresh-roulette-stage{position:relative;width:min(260px,100%);margin:16px auto 10px;padding-top:18px}.fresh-roulette-pointer{position:absolute;top:0;left:50%;z-index:3;transform:translateX(-50%);color:#f2d18a;font-size:23px;line-height:1;text-shadow:0 2px 5px #000}.fresh-roulette-svg{display:block;width:100%;height:auto;overflow:visible;filter:drop-shadow(0 8px 18px rgba(0,0,0,.5))}.fresh-roulette-glow{fill:none;stroke:#c9973f;stroke-width:7}.fresh-roulette-wheel{transform-origin:120px 120px}.fresh-roulette-segment{stroke:rgba(242,209,138,.5);stroke-width:1.5;transition:filter .2s}.fresh-roulette-segment.winner{stroke:#fff0a6;stroke-width:4;filter:brightness(1.18) drop-shadow(0 0 6px rgba(242,209,138,.8))}.fresh-roulette-label{fill:#fff;font-family:inherit;font-size:10px;font-weight:800;text-anchor:middle;paint-order:stroke;stroke:rgba(5,12,24,.8);stroke-width:3px;stroke-linejoin:round}.fresh-roulette-hub{fill:#101b30;stroke:#f2d18a;stroke-width:2}.fresh-roulette-hub-mark{fill:#f2d18a;font-size:16px;font-weight:800}.fresh-roulette-sweep{stroke:#fff0a6;stroke-width:3;stroke-linecap:round;filter:drop-shadow(0 0 5px rgba(255,240,166,.9));transform-origin:120px 120px;animation:fresh-roulette-sweep 2.4s linear infinite}.fresh-roulette-status,.fresh-roulette-note{display:block;color:var(--muted);font-size:10px;line-height:1.45}.fresh-roulette-result{display:grid;gap:4px;margin:8px 0;padding:12px;border:1px solid rgba(93,229,220,.4);border-radius:9px;background:rgba(37,153,157,.12);text-align:left}.fresh-roulette-result strong{color:var(--cyan);font-size:18px}.fresh-roulette-result small{color:var(--muted);font-size:9px}.fresh-roulette-inactive{padding:28px 14px;text-align:center;color:var(--muted);border:1px dashed var(--line);border-radius:10px}.fresh-inventory-card .random-inventory-grid{margin-top:10px}.fresh-inventory-card .random-inventory-item{padding:7px}.fresh-inventory-card .random-inventory-art{width:34px;height:34px}.fresh-inventory-card .random-inventory-item strong{font-size:11px}.fresh-inventory-card .random-inventory-item small{font-size:8px}@keyframes fresh-roulette-sweep{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
@media (max-width:1050px){.fresh-event-form{grid-template-columns:repeat(2,minmax(0,1fr))}.fresh-event-form>div{grid-column:1/-1}.fresh-event-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.fresh-inventory-card{grid-column:1/-1}}
@media (max-width:700px){.modal:has(.fresh-event-grid){width:calc(100vw - 20px);max-height:calc(100vh - 20px);padding:14px}.fresh-event-form,.fresh-event-grid{grid-template-columns:1fr}.fresh-inventory-card{grid-column:auto}.fresh-event-form .button{width:100%}}
.random-audit-section{margin-top:14px;padding:13px;border:1px solid var(--line);border-radius:9px;background:rgba(8,18,32,.42)}.random-audit-row{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-top:1px solid rgba(38,59,91,.55);font-size:11px}.random-audit-row small{color:var(--muted)}
/* Avisos de comunidad: resumen y ciclo de vida visible para su creador. */
.community-announcement-summary { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.community-announcement-summary article { display:grid; grid-template-columns:1fr auto; gap:4px 10px; padding:14px 16px; border:1px solid var(--line); border-radius:var(--radius); background:rgba(14,25,42,.82); }
.community-announcement-summary .eyebrow,.community-announcement-summary small { grid-column:1; }
.community-announcement-summary strong { grid-column:2; grid-row:1/3; align-self:center; color:var(--cyan); font-size:28px; }
.community-announcement-summary .row-link { grid-column:1; text-align:left; }
.community-post-filters { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:13px; }
.community-post-filters .button.active { color:var(--text); background:rgba(83,71,137,.35); border-color:rgba(93,229,220,.55); }
.community-announcement .post-actions { align-items:center; flex-wrap:wrap; }
.community-announcement .button { min-height:32px; }
@media (max-width:700px) { .community-announcement-summary { grid-template-columns:1fr; } }

/* Cierre visual de publicación: una escala común para acciones y estados. */
.button,
.event-actions > .button,
.access-request-actions .button,
.modal-actions .button {
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1.2;
}

.quick-actions,
.widget-banner-actions,
.event-actions,
.access-request-actions,
.modal-actions,
.auth-form-actions {
  align-items: center;
  gap: 10px;
}

.event-title-row > .badge,
.event-actions > .button.primary,
.event-actions > .row-menu {
  min-height: 36px;
}

.event-title-row > .badge {
  min-width: 96px;
  padding-inline: 12px;
}

.event-actions > .button.primary {
  min-width: 126px;
}

.event-actions > .row-menu {
  width: 36px;
  height: 36px;
}

.modal-actions {
  flex-wrap: wrap;
  margin-top: 24px;
  padding-top: 16px;
  border-top: 1px solid rgba(38, 59, 91, .65);
}

.modal-actions .button:first-child {
  margin-left: auto;
}

.access-request-row {
  align-items: flex-start;
  gap: 20px;
}

.access-request-actions {
  flex: 0 0 auto;
  min-width: 220px;
  padding-top: 1px;
}

.access-request-actions .button {
  min-width: 88px;
  padding-inline: 11px;
}

.access-request-actions .access-action-button {
  min-height: 36px;
}

.community-layout {
  align-items: start;
}

.community-rail-card {
  min-width: 0;
}

.community-message-list {
  scrollbar-gutter: stable;
}

.community-chat-compose {
  align-items: stretch;
}

.community-chat-compose .input {
  flex: 1 1 180px;
}

.community-chat-compose .button {
  flex: 0 0 auto;
  min-width: 72px;
}

.auth-fallback {
  gap: 0;
}

.auth-fallback form {
  gap: 14px;
}

.auth-fallback .modal-field {
  gap: 7px;
}

.auth-fallback .modal-field > .input,
.auth-fallback .modal-field > .select {
  width: 100%;
}

.auth-form-actions {
  justify-content: flex-start;
  margin-top: 10px;
  padding-top: 16px;
}

.auth-form-actions .button {
  min-width: 132px;
}

.auth-form-actions .button.text {
  min-width: 152px;
}

@media (max-width: 860px) {
  .access-request-row {
    flex-direction: column;
    gap: 12px;
  }

  .access-request-actions {
    width: 100%;
    min-width: 0;
    justify-content: flex-start;
  }
}

@media (max-width: 700px) {
  .event-title-row > .badge {
    min-width: 88px;
  }

  .event-actions {
    justify-content: stretch;
  }

  .event-actions > .button.primary {
    flex: 1 1 auto;
    min-width: 0;
  }

  .event-actions > .row-menu {
    flex: 0 0 36px;
  }

  .modal-actions {
    justify-content: stretch;
  }

  .modal-actions .button,
  .modal-actions .button:first-child {
    flex: 1 1 140px;
    margin-left: 0;
  }
}

.chat-pending-attachment{display:flex;align-items:center;gap:8px;margin:6px 0;padding:6px 8px;border:1px solid var(--aqua);border-radius:6px;background:rgba(20,57,69,.65);font-size:11px}.chat-pending-attachment img{width:36px;height:36px;object-fit:cover;border-radius:4px}.chat-pending-attachment span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.chat-pending-attachment button{border:0;background:transparent;color:#ffb5ae;font-size:18px;cursor:pointer}
.product-signature{position:fixed;right:18px;bottom:12px;z-index:8;display:grid;place-items:center;width:150px;height:46px;pointer-events:none;opacity:.88}
.product-signature img{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 1px 5px rgba(0,0,0,.55))}
.settings-content-layout .settings-grid{align-items:start;grid-template-columns:repeat(2,minmax(0,1fr))}
.settings-content-layout .settings-grid>.stack{min-width:0;align-content:start}
.settings-content-layout .settings-grid>.stack>.card{min-width:0;overflow:hidden}
.settings-content-layout [data-profile-visual]{border-color:rgba(119,228,227,.38);background:linear-gradient(145deg,rgba(18,48,62,.78),rgba(14,25,42,.9))}
.settings-content-layout [data-identity-panel]{border-color:rgba(185,240,109,.34);background:linear-gradient(145deg,rgba(38,52,35,.72),rgba(14,25,42,.9))}
.settings-content-layout [data-identity-panel] .branding-preview{margin-top:0}
.settings-content-layout .settings-panels-arranged{column-gap:18px}
@media(max-width:940px){.settings-content-layout .settings-grid{grid-template-columns:minmax(0,1fr)}}
.branding-preview{display:flex;align-items:center;gap:12px;min-width:0;margin:10px 0 14px;padding:10px;border:1px solid var(--line-soft);border-radius:8px;background:rgba(255,255,255,.025)}
.branding-preview img{width:52px;height:52px;flex:0 0 52px;object-fit:contain;display:block}
.branding-preview strong,.branding-preview small{display:block;min-width:0;overflow-wrap:anywhere}.branding-preview small{margin-top:3px;color:var(--muted);font-size:10px}
@media (max-width:520px){.product-signature{right:10px;bottom:8px;width:108px;height:34px}}
.product-signature{right:34px;bottom:28px}.war-intel-form-intro{margin:0 0 14px;color:var(--muted);font-size:11px;line-height:1.45}.war-intel-compact-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 14px}.war-intel-form-note{display:block;margin-top:14px;color:var(--muted);font-size:10px;line-height:1.4}@media(max-width:620px){.war-intel-compact-form{grid-template-columns:1fr}} 
.incident-launcher{position:fixed;right:34px;bottom:82px;z-index:20;display:inline-flex;align-items:center;gap:8px;min-height:38px;padding:8px 13px;border:1px solid rgba(255,177,77,.72);border-radius:8px;color:#ffe1a8;background:linear-gradient(135deg,rgba(56,35,20,.96),rgba(30,28,38,.96));box-shadow:0 8px 24px rgba(0,0,0,.35),0 0 0 1px rgba(255,177,77,.08);font:inherit;font-size:11px;font-weight:900;letter-spacing:.04em;cursor:pointer}.incident-launcher:hover,.incident-launcher:focus-visible{border-color:#ffd27a;color:#fff3d5;transform:translateY(-1px)}.incident-launcher-icon{display:grid;place-items:center;width:21px;height:21px;border-radius:50%;color:#1a1720;background:#ffb14d;font-size:14px;font-weight:1000}.incident-intro,.incident-inbox-intro{display:grid;gap:5px;margin-bottom:16px;padding:12px 13px;border:1px solid rgba(255,177,77,.28);border-left:3px solid #ffb14d;border-radius:8px;background:rgba(255,177,77,.06)}.incident-intro span,.incident-inbox-intro span{color:var(--muted);font-size:11px;line-height:1.45}.incident-upload-preview{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0 4px}.incident-upload-preview span{padding:5px 8px;border:1px solid var(--line-soft);border-radius:6px;color:var(--muted);font-size:10px;overflow-wrap:anywhere}.incident-mailboxes{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.incident-report-list{display:grid;gap:10px}.incident-report-card{padding:13px;border:1px solid var(--line-soft);border-radius:9px;background:rgba(10,20,34,.7)}.incident-report-head{display:flex;align-items:start;justify-content:space-between;gap:12px}.incident-report-head h3{margin:4px 0 0;font-size:15px}.incident-report-card p{margin:10px 0;color:var(--text);line-height:1.5;white-space:pre-wrap}.incident-report-meta{color:var(--muted);font-size:10px}.incident-report-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:10px}.incident-evidence-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(90px,1fr));gap:7px;margin-top:10px}.incident-evidence-image{display:block;width:100%;height:92px;object-fit:cover;border:1px solid var(--line-soft);border-radius:6px}.incident-evidence-image:hover{border-color:var(--aqua)}
@media(max-width:520px){.incident-launcher{right:12px;bottom:54px}.incident-launcher span:last-child{display:none}.incident-launcher{width:42px;height:42px;padding:0;justify-content:center;border-radius:50%}.incident-report-head{display:grid}.incident-report-actions{justify-content:stretch}.incident-report-actions .button{flex:1}}
.crest[data-emblem="HK"]{color:#fff;background:linear-gradient(145deg,#b52431 0 46%,#fff 47% 53%,#b52431 54%);text-shadow:0 1px 3px #3c0d13;letter-spacing:-.08em}
.fresh-roulette-wheel{transform-box:fill-box!important;transform-origin:center!important;will-change:transform}.fresh-roulette-wheel.is-spinning{animation:fresh-roulette-spin var(--fresh-roulette-duration,20s) cubic-bezier(.12,.72,.15,1) forwards!important}.fresh-roulette-wheel.is-still{transform-box:fill-box;transform-origin:center}.fresh-roulette-segment.target{stroke:#fff0a6;stroke-width:3;filter:brightness(1.1) drop-shadow(0 0 4px rgba(242,209,166,.65))}.fresh-roulette-sweep{display:none}@keyframes fresh-roulette-spin{from{transform:rotate(0deg)}to{transform:rotate(var(--fresh-roulette-target,1800deg))}}
.settings-content-layout .settings-grid{gap:16px;align-items:start}.settings-content-layout .settings-grid>.stack{display:grid;align-content:start;gap:16px;min-width:0}.settings-content-layout .settings-grid>.stack>.card{margin:0;min-width:0}.settings-content-layout [data-timezone-settings]{order:2}.settings-content-layout [data-ashenvale-card]{order:3}.settings-content-layout [data-timezone-settings] .button{min-width:142px}.settings-content-layout .card-heading{min-width:0}.settings-content-layout .card-heading>div{min-width:0}
.compact-community-rail .community-rail-heading{margin-bottom:9px}.compact-community-channel{display:flex;align-items:center;gap:9px;padding:9px;border:1px solid rgba(157,138,255,.24);border-radius:8px;background:rgba(10,17,31,.42)}.compact-community-channel strong,.compact-community-channel small{display:block}.compact-community-channel strong{font-size:12px}.compact-community-channel small{margin-top:2px;color:var(--muted);font-size:10px}.compact-community-rail .muted-copy{margin:9px 0 0;font-size:10px;line-height:1.35}.clan-admin-list{display:grid;gap:8px;margin-bottom:12px}.clan-admin-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px;border:1px solid var(--line);border-radius:8px;background:rgba(11,20,34,.58)}.clan-admin-row.is-disabled{opacity:.66}.clan-admin-row>div:first-child{min-width:0}.clan-admin-row strong,.clan-admin-row small,.clan-admin-meta{display:block}.clan-admin-row strong{font-size:13px}.clan-admin-row small,.clan-admin-meta{margin-top:3px;color:var(--muted);font-size:10px}.clan-admin-meta{color:var(--subtle)}.clan-admin-actions{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex-wrap:wrap}.clan-admin-actions .button{min-height:28px;padding:5px 8px;font-size:10px}.clan-active-setting{margin:8px 0}.clan-active-setting input{accent-color:var(--cyan)}
.random-inventory-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:8px;margin:10px 0 14px}.random-inventory-item{display:grid;grid-template-columns:36px minmax(0,1fr) 68px;gap:8px;align-items:center;min-width:0;padding:8px;border:1px solid var(--line-soft);background:rgba(255,255,255,.025);border-radius:8px}.random-inventory-art{display:grid;place-items:center;width:34px;height:34px;border-radius:6px;background:rgba(119,228,227,.08);color:var(--aqua);font-weight:900}.random-inventory-art img{width:34px;height:34px;object-fit:contain;border-radius:6px}.random-inventory-art>span[hidden]{display:none}.random-inventory-item>span:nth-child(2){min-width:0}.random-inventory-item strong,.random-inventory-item small{display:block;overflow-wrap:anywhere;word-break:normal}.random-inventory-item strong{line-height:1.15}.random-inventory-item small{margin-top:2px;color:var(--muted);font-size:9px}.random-inventory-item .input{width:100%;min-width:0;padding:7px 5px;text-align:center}@media(max-width:520px){.random-inventory-grid{grid-template-columns:1fr}.random-inventory-item{grid-template-columns:36px minmax(0,1fr) 62px}}
.random-build-mark{margin:8px 0;padding:7px 10px;border:1px solid var(--aqua);border-radius:7px;color:var(--aqua);font-size:10px;letter-spacing:.12em;font-weight:800;background:rgba(48,210,203,.08)}
.desktop-install-card{position:relative;margin:0 0 14px;padding:18px;border:1px solid rgba(185,240,109,.42);background:linear-gradient(135deg,rgba(185,240,109,.10),rgba(119,228,227,.06) 55%,rgba(18,28,43,.92));clip-path:var(--cut);box-shadow:0 12px 34px rgba(0,0,0,.16)}.desktop-install-heading{display:flex;align-items:start;justify-content:space-between;gap:16px}.desktop-install-heading h2{margin-top:4px;font-size:22px;letter-spacing:-.05em}.desktop-install-heading p{max-width:720px;margin-top:6px;color:var(--muted);font-size:11px}.desktop-install-status{display:inline-flex;align-items:center;white-space:nowrap;padding:7px 10px;border:1px solid rgba(185,240,109,.45);color:var(--jade);background:rgba(185,240,109,.08);font-weight:900}.desktop-install-status.active{color:var(--aqua);border-color:rgba(119,228,227,.55);background:rgba(119,228,227,.08)}.desktop-install-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:14px}.desktop-install-meta span{padding:9px;border:1px solid var(--line-soft);background:rgba(4,10,18,.3)}.desktop-install-meta strong,.desktop-install-meta small{display:block}.desktop-install-meta small{margin-top:3px;color:var(--muted);font-size:9px}.desktop-install-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}.desktop-install-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:15px 0 0;padding:0;list-style:none}.desktop-install-steps li{display:grid;gap:4px;padding:9px;border-left:2px solid var(--aqua);background:rgba(4,10,18,.24)}.desktop-install-steps strong{font-size:10px}.desktop-install-steps span{color:var(--muted);font-size:9px;line-height:1.35}.desktop-install-help{margin-top:12px;color:var(--muted);font-size:10px}.desktop-install-help summary{cursor:pointer;color:var(--aqua);font-weight:900}.desktop-install-help p{margin-top:7px;line-height:1.45}@media(max-width:900px){.desktop-install-meta,.desktop-install-steps{grid-template-columns:repeat(2,1fr)}}@media(max-width:700px){.desktop-install-heading{display:grid}.desktop-install-meta,.desktop-install-steps{grid-template-columns:1fr}}
.settings-content-layout .settings-grid{grid-template-columns:minmax(0,1fr)!important;align-items:start}
.settings-content-layout .settings-grid>.stack{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;align-content:start;min-width:0}
.settings-content-layout .settings-grid>.stack>.card{grid-column:auto!important;width:100%;min-width:0;box-sizing:border-box}
#view:has(.war-intel-toolbar) .kpi-grid.compact-kpis{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:12px}
#view:has(.war-intel-toolbar) .kpi-grid.compact-kpis .kpi-card{padding:11px 14px;min-height:0}
#view:has(.war-intel-toolbar) .kpi-grid.compact-kpis .kpi-card>strong{margin:5px 0 1px;font-size:24px}
#nav .nav-item.beta-route{grid-template-columns:22px minmax(0,1fr) auto auto}
.linked-clans-admin{display:grid;gap:8px;margin:4px 0 14px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:rgba(8,17,31,.42)}.linked-clans-admin .eyebrow{font-size:10px;color:var(--cyan);letter-spacing:.12em}.clan-admin-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 0;border-top:1px solid rgba(120,150,190,.16)}.clan-admin-row:first-of-type{border-top:0}.clan-admin-row strong,.clan-admin-row small{display:block}.clan-admin-row small{color:var(--muted);margin-top:2px}
.ashenvale-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:14px 0 16px;padding:12px;border:1px solid rgba(87,180,220,.24);border-radius:11px;background:rgba(5,18,31,.55)}.ashenvale-steps>div{display:flex;align-items:flex-start;gap:9px;min-width:0;padding:8px;border-right:1px solid rgba(120,150,190,.16)}.ashenvale-steps>div:last-child{border-right:0}.ashenvale-steps b{display:grid;place-items:center;width:26px;height:26px;flex:0 0 auto;border-radius:7px;color:#07121f;background:linear-gradient(135deg,#20c9f4,#7850f4);font-size:11px}.ashenvale-steps span{display:grid;gap:3px;min-width:0}.ashenvale-steps strong{color:var(--text);font-size:11px;line-height:1.3}.ashenvale-steps small{color:var(--muted);font-size:10px;line-height:1.35;text-transform:none;letter-spacing:0}.account-ashenvale-manager{margin-top:14px}.account-manager-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.account-manager-grid .modal-field{display:grid;gap:7px}.account-manager-selection{display:grid;gap:4px;margin-top:12px;padding:11px 12px;border:1px solid rgba(87,180,220,.2);border-radius:9px;background:rgba(10,28,44,.58)}.account-manager-selection span{color:var(--muted);font-size:11px}.admin-action-grid{display:flex;flex-wrap:wrap;gap:9px;margin-top:14px}.admin-action-grid .button{flex:1 1 220px}.ashenvale-admin-flow .select{width:100%}
.ashenvale-sync-loader{display:flex;justify-content:center;align-items:center;gap:7px;margin:18px 0 4px}.ashenvale-sync-loader span{width:9px;height:9px;border-radius:50%;background:var(--cyan);box-shadow:0 0 12px rgba(32,201,244,.75);animation:ashenvale-sync-pulse 1.1s ease-in-out infinite}.ashenvale-sync-loader span:nth-child(2){animation-delay:.16s}.ashenvale-sync-loader span:nth-child(3){animation-delay:.32s}@keyframes ashenvale-sync-pulse{0%,100%{opacity:.3;transform:scale(.75)}50%{opacity:1;transform:scale(1.15)}}
.tutorials-layout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr);gap:14px}.tutorial-video-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(245px,1fr));gap:14px}.tutorial-video-card{overflow:hidden;border:1px solid var(--line);border-radius:12px;background:rgba(8,18,31,.82)}.tutorial-video-card>a:first-child{display:block;aspect-ratio:16/9;background:rgba(0,0,0,.25)}.tutorial-video-card img{width:100%;height:100%;object-fit:cover;display:block}.tutorial-video-card>div{padding:13px}.tutorial-video-card h3{margin:6px 0;font-size:14px}.tutorial-video-card p{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media(max-width:900px){.tutorials-layout{grid-template-columns:1fr}}
.tutorial-video-frame{aspect-ratio:16/9;background:#050a12}.tutorial-video-frame iframe{display:block;width:100%;height:100%;border:0}.tutorial-video-frame img{width:100%;height:100%;object-fit:cover;display:block}.incident-page-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr);gap:16px}.incident-page-grid .incident-intro{margin-bottom:12px}.incident-launcher{display:none!important}.toast{left:50%;right:auto;bottom:50%;transform:translate(-50%,50%) scale(.98);max-width:min(520px,calc(100vw - 36px));padding:15px 20px;border-radius:12px;text-align:center;justify-content:center;font-size:13px;box-shadow:0 22px 80px rgba(0,0,0,.58);backdrop-filter:blur(12px)}.toast.show{transform:translate(-50%,50%) scale(1)}.nav-block{padding:8px 6px;border:1px solid rgba(38,59,91,.45);border-radius:12px;background:rgba(7,15,27,.32)}.nav-kicker{padding-left:6px}.product-signature{width:174px;height:52px;right:26px;bottom:22px}.product-signature img{object-fit:contain}.sidebar{width:282px;flex-basis:282px}.nav-item>span:not(.nav-glyph){min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.nav-block+.nav-block{margin-top:-4px}.app-shell{background-image:linear-gradient(90deg,rgba(5,12,22,.86),rgba(5,12,22,.58)),url('/frontend/assets/hiddenkillers-banner-v2.png');background-size:cover;background-position:center top;background-attachment:fixed}.app-shell .main{background:linear-gradient(180deg,rgba(4,10,19,.08),rgba(4,10,19,.22))}
@media(max-width:900px){.incident-page-grid{grid-template-columns:1fr}}@media(max-width:520px){.product-signature{right:10px;bottom:10px;width:142px;height:43px}}

/* Todos los buscadores se repliegan antes de invadir controles vecinos. */
.war-intel-toolbar{display:grid;grid-template-columns:minmax(220px,1.5fr) repeat(3,minmax(140px,1fr)) auto;gap:8px;align-items:stretch}
.war-intel-toolbar .input,.war-intel-toolbar .select{width:100%;min-width:0;box-sizing:border-box}
.accounting-filter{flex:1 1 260px;min-width:220px;max-width:420px}
.accounting-filter input{width:100%;min-width:0;box-sizing:border-box}
@media(max-width:1100px){.war-intel-toolbar{grid-template-columns:repeat(2,minmax(0,1fr))}.war-intel-toolbar .button{width:100%}}
@media(max-width:620px){.war-intel-toolbar{grid-template-columns:1fr}.accounting-filter{max-width:none;min-width:0}}
.leadership-card{margin-top:14px}.leadership-clans{display:grid;gap:10px;margin-top:14px}.leadership-clan-card{display:grid;gap:8px;padding:12px;border:1px solid rgba(38,59,91,.7);border-radius:10px;background:rgba(7,15,27,.38)}.leadership-clan-card>div:first-child{display:flex;justify-content:space-between;gap:12px;align-items:center}.leadership-clan-card small{color:var(--muted)}.leadership-form{display:grid;grid-template-columns:minmax(0,1fr) minmax(150px,.55fr) auto;gap:8px;align-items:center}.alliance-leadership-form{grid-template-columns:minmax(0,1fr) auto;margin-top:12px}@media(max-width:760px){.leadership-form,.alliance-leadership-form{grid-template-columns:1fr}}

/* Persistent product mark: visible on every route without replacing the active realm identity. */
.product-brand-badge{display:inline-flex;align-items:center;gap:8px;min-width:max-content;margin-left:10px;padding:5px 10px;border:1px solid rgba(85,205,255,.28);border-radius:999px;background:rgba(7,18,34,.72);box-shadow:0 8px 24px rgba(0,0,0,.18)}
.product-brand-badge img{display:block;width:25px;height:25px;object-fit:contain;filter:drop-shadow(0 1px 4px rgba(0,0,0,.45))}
.product-brand-badge span{color:#f4f8ff;font-size:11px;font-weight:850;letter-spacing:.03em;white-space:nowrap}
.product-signature{grid-template-columns:34px 1fr;gap:8px;width:190px;height:58px;padding:7px 11px;place-items:center start;border:1px solid rgba(85,205,255,.38);border-radius:13px;background:linear-gradient(135deg,rgba(8,20,37,.94),rgba(36,19,79,.9));box-shadow:0 12px 30px rgba(0,0,0,.42);opacity:1}
.product-signature img{width:34px;height:34px;object-fit:contain;filter:drop-shadow(0 1px 4px rgba(0,0,0,.5))}
.product-signature span{color:#f4f8ff;font-size:11px;font-weight:900;letter-spacing:.035em;white-space:nowrap}
@media(max-width:900px){.product-brand-badge{margin-left:6px;padding:4px 8px}.product-brand-badge img{width:22px;height:22px}.product-brand-badge span{font-size:10px}}
@media(max-width:620px){.product-brand-badge{display:none}.product-signature{right:10px;bottom:10px;width:170px;height:50px}}
@media(max-width:900px){.ashenvale-steps{grid-template-columns:repeat(2,minmax(0,1fr))}.ashenvale-steps>div:nth-child(2){border-right:0}.account-manager-grid{grid-template-columns:1fr}}
@media(max-width:520px){.ashenvale-steps{grid-template-columns:1fr}.ashenvale-steps>div{border-right:0;border-bottom:1px solid rgba(120,150,190,.16)}.ashenvale-steps>div:last-child{border-bottom:0}}
.onboarding-intro{display:grid;gap:7px;margin-bottom:14px;padding:12px 14px;border:1px solid rgba(119,228,227,.26);border-left:3px solid var(--aqua);border-radius:9px;background:rgba(20,54,68,.3)}.onboarding-intro strong{font-size:14px}.onboarding-intro p{margin:0;color:var(--muted);font-size:11px;line-height:1.45}.onboarding-search{display:grid;gap:5px;margin-bottom:10px}.onboarding-search span{color:var(--muted);font-size:10px;font-weight:700}.onboarding-clan-list{display:grid;gap:10px;max-height:min(52vh,430px);overflow-y:auto;overflow-x:hidden;padding:2px 5px 8px 0;scrollbar-width:thin;scrollbar-color:var(--cyan) rgba(8,19,33,.8)}.onboarding-clan-list::-webkit-scrollbar{width:8px}.onboarding-clan-list::-webkit-scrollbar-track{background:rgba(8,19,33,.8);border-radius:8px}.onboarding-clan-list::-webkit-scrollbar-thumb{background:var(--cyan);border-radius:8px}.onboarding-clan{border:1px solid var(--line);border-radius:10px;background:rgba(7,17,30,.72);overflow:hidden}.onboarding-clan>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 13px;cursor:pointer;list-style:none}.onboarding-clan>summary::-webkit-details-marker{display:none}.onboarding-clan>summary strong{font-size:13px}.onboarding-clan>summary small{color:var(--muted);font-size:10px}.onboarding-roster{display:grid;gap:6px;padding:0 10px 10px}.onboarding-character{display:grid;grid-template-columns:18px minmax(0,1fr) minmax(92px,auto);align-items:center;gap:9px;padding:8px 9px;border:1px solid rgba(120,150,190,.16);border-radius:7px;background:rgba(16,31,49,.52);cursor:pointer}.onboarding-character:hover{border-color:rgba(119,228,227,.45)}.onboarding-character input{accent-color:var(--violet)}.onboarding-character strong,.onboarding-character small{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.onboarding-character small{margin-top:2px;color:var(--muted);font-size:10px}.onboarding-kind-select{width:100%;min-width:92px;padding:6px 7px;font-size:10px}.onboarding-kind{padding:4px 6px;border:1px solid rgba(119,228,227,.26);border-radius:5px;color:var(--aqua);font-size:9px;font-weight:900;letter-spacing:.08em}.onboarding-kind.secondary{color:#c7b7ff;border-color:rgba(155,120,255,.35)}.onboarding-empty{padding:18px;border:1px dashed var(--line);border-radius:9px;color:var(--muted);line-height:1.5}.onboarding-linked-list{display:grid;gap:7px;margin:10px 0 14px}.onboarding-linked-item{display:flex;justify-content:space-between;gap:12px;padding:10px;border:1px solid var(--line);border-radius:8px;background:rgba(8,19,33,.68)}.onboarding-linked-item strong,.onboarding-linked-item small{display:block}.onboarding-linked-item small{margin-top:3px;color:var(--muted);font-size:10px}.onboarding-linked-item em{color:var(--aqua);font-style:normal;font-size:10px;font-weight:800;white-space:nowrap}
:root{--ashenvale-progress-a:#20c7ff;--ashenvale-progress-b:#7047ff}
.ashenvale-progress{display:grid;gap:10px;margin:24px 0 8px}.ashenvale-progress-track{height:10px;border:1px solid rgba(32,199,255,.45);border-radius:999px;background:rgba(5,17,31,.8);overflow:hidden;box-shadow:0 0 22px rgba(32,199,255,.12)}.ashenvale-progress-track span{display:block;width:3%;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--ashenvale-progress-a),var(--ashenvale-progress-b));box-shadow:0 0 18px rgba(71,120,255,.75);transition:width .35s ease}.ashenvale-progress strong{color:#f3f7ff;font-size:13px}.ashenvale-progress small{color:#9eb4c9;font-size:12px}
.nav-subitem{margin-left:18px;width:calc(100% - 18px);font-size:11px;opacity:.92;border-left:1px solid rgba(90,210,255,.24)}
.accounting-toolbar,.accounting-history-actions{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:16px}.accounting-actions{display:flex;gap:8px;flex-wrap:wrap}.accounting-target-form{display:flex;align-items:end;gap:10px;flex-wrap:wrap;padding:14px 16px;margin-bottom:14px;border:1px solid rgba(93,214,255,.2);border-radius:12px;background:rgba(7,20,34,.7)}.accounting-target-form strong{margin-right:8px}.accounting-target-form label{display:grid;gap:5px;font-size:11px;color:var(--muted)}.accounting-target-form .input{width:130px}.accounting-table-wrap{max-height:62vh;overflow:auto}.accounting-table{min-width:980px}.accounting-table th:first-child,.accounting-table td:first-child{position:sticky;left:0;background:#081827;z-index:2}.accounting-table th:nth-child(2),.accounting-table td:nth-child(2){position:sticky;left:185px;background:#081827;z-index:2}.accounting-table th small,.accounting-table td small{display:block;color:var(--muted);font-weight:400;font-size:10px;margin-top:4px}.accounting-target{color:var(--aqua)!important;font-weight:500!important}.accounting-check{display:flex;align-items:center;justify-content:center;gap:5px;font-size:10px;white-space:nowrap}.accounting-check input{accent-color:var(--jade);width:15px;height:15px}.accounting-check input:disabled{opacity:.5}.accounting-status{display:inline-block;padding:3px 7px;border-radius:999px;font-size:10px;border:1px solid rgba(255,255,255,.15)}.accounting-status.completo{color:var(--jade);border-color:rgba(104,240,184,.45)}.accounting-status.parcial{color:var(--amber);border-color:rgba(255,191,92,.45)}.accounting-status.pendiente,.accounting-status.sin-historial{color:var(--muted)}.accounting-table-note{margin:6px 0 10px;color:var(--muted);font-size:11px}
 .summary-page{display:grid;gap:16px}.summary-welcome{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;padding:4px 2px 2px}.summary-welcome h1{margin:5px 0 6px;font-size:clamp(23px,3vw,34px);letter-spacing:-.04em}.summary-welcome p{max-width:680px;margin:0;color:var(--muted);font-size:12px;line-height:1.5}.summary-source{display:flex;align-items:center;gap:9px;min-width:190px;padding:10px 12px;border:1px solid rgba(119,228,227,.2);border-radius:10px;background:rgba(13,35,51,.6)}.summary-source strong,.summary-source small{display:block}.summary-source small{margin-top:3px;color:var(--muted);font-size:9px}.summary-kpis{margin:0}.summary-layout{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(250px,.75fr);gap:14px;align-items:start}.summary-main,.summary-side{display:grid;gap:14px;min-width:0}.summary-card{min-width:0}.summary-card .card-heading{align-items:flex-start}.summary-news-list,.summary-notice-list,.summary-quick-list{display:grid;gap:8px}.summary-news-row{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;align-items:center;padding:10px 11px;border:1px solid var(--line);border-radius:8px;background:rgba(12,27,45,.55)}.summary-news-row strong,.summary-news-row small{display:block}.summary-news-row small{margin-top:3px;color:var(--muted);font-size:9px}.summary-notice{display:grid;grid-template-columns:30px minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px 11px;border:1px solid var(--line);border-left:2px solid var(--cyan);border-radius:8px;background:rgba(12,27,45,.55)}.summary-notice.warning{border-left-color:var(--amber)}.summary-notice.neutral{border-left-color:#8997ad}.summary-notice-icon{display:grid;place-items:center;width:28px;height:28px;border:1px solid currentColor;border-radius:8px;color:var(--cyan);font-weight:800}.summary-notice.warning .summary-notice-icon{color:var(--amber)}.summary-notice.neutral .summary-notice-icon{color:#a2afc2}.summary-notice-copy strong,.summary-notice-copy small{display:block}.summary-notice-copy small{margin-top:3px;color:var(--muted);font-size:9px}.summary-notice-copy .button{padding:4px 0;margin-top:3px}.summary-notice-count{font-size:22px;color:var(--text)}.summary-status-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.summary-status-grid div{padding:11px;border:1px solid var(--line);border-radius:8px;background:rgba(12,27,45,.5)}.summary-status-grid b,.summary-status-grid small{display:block}.summary-status-grid b{font-size:19px;color:var(--cyan)}.summary-status-grid small{margin-top:3px;color:var(--muted);font-size:9px}.summary-next-event{display:flex;gap:10px;align-items:center;padding:12px;border:1px solid rgba(155,120,255,.28);border-radius:9px;background:rgba(57,39,88,.18)}.summary-event-icon{display:grid;place-items:center;width:34px;height:34px;border-radius:9px;color:#d5c8ff;background:rgba(115,87,202,.35);font-size:17px}.summary-next-event strong,.summary-next-event small{display:block}.summary-next-event small{margin-top:4px;color:var(--muted);font-size:9px;line-height:1.4}.summary-quick-list>div{display:grid;grid-template-columns:28px 1fr auto;gap:8px;align-items:center;padding:9px 0;border-bottom:1px solid var(--line)}.summary-quick-list>div:last-child{border-bottom:0}.summary-quick-list span{color:var(--aqua)}.summary-quick-list strong{font-size:18px}.summary-quick-list small{color:var(--muted);font-size:9px}.overview-detail-list{display:grid;gap:7px;max-height:52vh;overflow:auto}.detail-row{display:grid;gap:3px;padding:10px 11px;border:1px solid var(--line);border-radius:8px;background:rgba(12,27,45,.6)}.detail-row strong{font-size:12px}.detail-row span{color:var(--muted);font-size:10px;line-height:1.4}.modal-body .state-block{margin:0}.modal-body .overview-detail-list{padding-right:2px}@media(max-width:900px){.summary-layout{grid-template-columns:1fr}.summary-source{min-width:0}.summary-welcome{display:grid}.summary-status-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:560px){.summary-notice{grid-template-columns:28px minmax(0,1fr) auto}.summary-notice-count{font-size:18px}.summary-status-grid{grid-template-columns:repeat(2,1fr)}}
.accounting-recipient-notice{display:flex;align-items:center;gap:10px;padding:10px 14px;margin:-4px 0 14px;border:1px solid rgba(255,191,92,.45);border-radius:10px;background:rgba(92,54,14,.22);color:var(--text)}.accounting-recipient-notice strong{font-size:10px;letter-spacing:.12em;color:var(--amber);white-space:nowrap}.accounting-recipient-notice span{font-size:12px;color:var(--muted)}.accounting-recipient-notice b{color:var(--text)}
.accounting-filter{display:flex;align-items:center;gap:8px;min-width:260px}.accounting-filter label{font-size:11px;color:var(--muted);white-space:nowrap}.accounting-filter input{min-width:190px}

/* Shared search controls: the icon is part of the control, never a second input box. */
.search-field,
.cp-search,
.roster-filter-search {
  box-sizing: border-box;
}
.search-field > span,
.cp-search > span,
.roster-filter-search > span {
  display: inline-flex;
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--muted);
  line-height: 1;
}
.search-field > input,
.cp-search > input,
.roster-filter-search > input {
  flex: 1 1 auto;
  width: auto;
  min-width: 0;
  min-height: 35px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  outline: 0;
  box-shadow: none;
  background: transparent;
}
.search-field:focus-within,
.cp-search:focus-within,
.roster-filter-search:focus-within {
  border-color: var(--cyan);
  box-shadow: 0 0 0 2px rgba(46, 201, 244, .14);
}
.accounting-filter {
  box-sizing: border-box;
  min-width: 0;
  max-width: 420px;
}
.accounting-filter input {
  box-sizing: border-box;
  min-width: 0;
  min-height: 37px;
}
/* Todos los buscadores comparten una sola caja visual. El estilo base de
   .input no debe dibujar una segunda frontera dentro del control. */
input[type="search"],
input[data-filter],
input[data-war-intel-search],
input[data-guest-filter],
input[data-accounting-filter],
input[data-random-invite-search],
input[data-roster-search],
input[data-cp-search] { box-sizing:border-box; min-width:0; }
.search-field input[type="search"],
.cp-search input[type="search"],
.roster-filter-search input[type="search"],
.accounting-filter input[type="search"] { border:0; border-radius:0; outline:0; box-shadow:none; background:transparent; }
.random-invite-search input[type="search"],
.war-intel-toolbar input[type="search"],
label:has(> input[type="search"]) > input[type="search"] { border:0; border-radius:0; outline:0; box-shadow:none; background:transparent; min-width:0; }
label:has(> input[type="search"]) { box-sizing:border-box; min-width:0; }
.cp-create-list { display:grid; gap:.45rem; max-height:22rem; overflow:auto; margin-top:.75rem; padding:.25rem; }
.cp-create-member { display:flex; gap:.65rem; align-items:flex-start; padding:.65rem .75rem; border:1px solid rgba(97,188,255,.18); border-radius:.55rem; background:rgba(5,24,43,.62); cursor:pointer; }
.cp-create-member input { margin-top:.2rem; }
.cp-create-member span { display:grid; gap:.18rem; }
.cp-create-member small { color:var(--muted); }
.war-intel-toolbar > input[type="search"],
.modal-body > input[type="search"],
.modal-body label > input[type="search"] { min-width:0; width:100%; }
/* Guided Ashenvale flow */
.ashenvale-guided-flow{display:grid;gap:16px}
.ashenvale-flow-status,.ashenvale-flow-actions,.ashenvale-flow-section,.ashenvale-clan-space,.leadership-alliance-box{border:1px solid rgba(88,190,239,.24);background:rgba(5,22,38,.68);border-radius:14px;padding:16px}
.ashenvale-flow-status{display:flex;align-items:center;gap:12px}.ashenvale-flow-status>div{flex:1;display:grid;gap:4px}.ashenvale-flow-status small,.ashenvale-flow-actions small{color:var(--muted);display:block}.ashenvale-flow-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.ashenvale-flow-actions small{flex:1;min-width:240px}
.ashenvale-flow-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.ashenvale-flow-steps>div{display:grid;gap:6px;padding:12px;border:1px solid rgba(88,190,239,.16);border-radius:12px}.ashenvale-flow-steps b{width:24px;height:24px;display:grid;place-items:center;border-radius:8px;background:linear-gradient(135deg,#1687ff,#7543ef);color:white}.ashenvale-flow-steps small,.ashenvale-flow-section small{color:var(--muted)}
.ashenvale-flow-section{display:grid;gap:12px}.ashenvale-flow-section>.card-heading{margin:0}.ashenvale-flow-section>[data-action]{justify-self:start}.ashenvale-clan-spaces{display:grid;gap:10px}.ashenvale-clan-space{display:flex;align-items:center;gap:12px}.ashenvale-clan-space>div{flex:1;display:grid;gap:4px}.ashenvale-clan-space h4{margin:0}.ashenvale-clan-space .button{white-space:nowrap}
.leadership-card{display:grid;gap:16px}.leadership-alliance-box{display:grid;grid-template-columns:1fr minmax(240px,1.3fr) auto;align-items:center;gap:14px}.leadership-alliance-box p{margin:4px 0 0}.leadership-clans{display:grid;gap:12px}.leadership-clan-card{display:grid;gap:12px;padding:14px;border:1px solid rgba(88,190,239,.2);border-radius:12px;background:rgba(4,18,31,.54)}.leadership-clan-card .card-heading{margin:0}.leadership-form{display:grid;grid-template-columns:minmax(200px,1.4fr) minmax(160px,1fr) auto;gap:10px;align-items:center}
.ashenvale-links-flow{display:grid;gap:16px}.ashenvale-link-master,.ashenvale-link-results{display:grid;gap:10px;padding:15px;border:1px solid rgba(88,190,239,.24);border-radius:14px;background:rgba(5,22,38,.68)}.ashenvale-link-master label{display:grid;gap:6px}.ashenvale-link-master small,.ashenvale-link-row small,.ashenvale-link-results small{color:var(--muted);font-size:10px}.ashenvale-roster-links{display:grid;gap:10px}.ashenvale-link-row{display:grid;grid-template-columns:minmax(170px,.5fr) minmax(0,1.5fr);align-items:center;gap:12px;padding:12px 14px;border:1px solid rgba(88,190,239,.2);border-radius:11px;background:rgba(4,18,31,.54)}.ashenvale-link-row span{display:grid;gap:4px}.ashenvale-link-row input{min-width:0}.ashenvale-link-results .card-heading{margin:0}.ashenvale-link-result{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-top:1px solid rgba(120,150,190,.16)}.ashenvale-link-result>div{display:grid;gap:4px;min-width:0}.ashenvale-link-result small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media(max-width:700px){.ashenvale-link-row{grid-template-columns:1fr}.ashenvale-link-result{align-items:flex-start;flex-direction:column}}
@media(max-width:900px){.ashenvale-flow-steps{grid-template-columns:repeat(2,1fr)}.leadership-alliance-box,.leadership-form{grid-template-columns:1fr}.ashenvale-clan-space{align-items:flex-start;flex-wrap:wrap}}

/* Search results in the member onboarding modal must actually disappear. */
.onboarding-character[hidden],.onboarding-clan[hidden]{display:none!important}
/* Community/social destinations belong to the official links strip, never the live chat. */
.community-bot-link[href*="whatsapp"],.community-bot-link[href*="discord"],.community-bot-link[href*="teamspeak"],.community-bot-link[href^="ts3server:"]{display:none!important}
.community-rail-card{min-height:360px}.community-message-list{min-height:150px;max-height:42vh}
.nav-camera-icon{display:block;width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
/* Una sola caja por buscador: nunca se superpone el input con la etiqueta contenedora. */
.roster-filter-search,.cp-search,.search-field{box-sizing:border-box;min-height:42px;overflow:hidden}
.roster-filter-search>input,.cp-search>input,.search-field>input,.roster-filter-search input.input,.cp-search input.input{border:0!important;border-radius:0!important;outline:0!important;box-shadow:none!important;background:transparent!important;padding:0 2px!important;min-height:38px!important}
.roster-table-wrap,.roster-table.table-wrap{max-width:100%;overflow-x:auto;overflow-y:visible}
.roster-table{min-width:1120px}
.roster-table th,.roster-table td{white-space:normal;padding:12px 10px;vertical-align:middle}
.roster-table td:first-child{min-width:190px}.roster-table td:nth-child(4){min-width:120px}.roster-table td:nth-child(10){min-width:150px}
.modal-backdrop .modal{width:min(860px,calc(100vw - 32px));max-height:calc(100vh - 32px);overflow:hidden}.modal-backdrop .modal-body{max-height:calc(100vh - 155px);overflow:auto;padding-right:4px}.modal-backdrop .modal-actions{position:sticky;bottom:0;padding-top:12px;background:linear-gradient(180deg,transparent,var(--panel) 35%)}.modal-backdrop .modal-close{z-index:2;cursor:pointer}.modal-backdrop .random-invite-groups{max-height:190px}
.tutorial-preview-link{position:relative;display:block;width:100%;height:100%;overflow:hidden;background:#050a12}.tutorial-preview-link::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(0,0,0,.72));pointer-events:none}.tutorial-preview-link img{transition:transform .2s ease}.tutorial-preview-link:hover img{transform:scale(1.03)}.tutorial-play-badge{position:absolute;z-index:1;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:52px;height:36px;border-radius:10px;color:#fff;background:#f22b3f;font-size:19px;box-shadow:0 8px 25px rgba(0,0,0,.35)}.tutorial-preview-label{position:absolute;z-index:1;left:14px;bottom:10px;color:#fff;font-size:11px;font-weight:800;letter-spacing:.04em}
/* Usuarios y permisos: cada usuario conserva una fila legible y los permisos ocupan todo el ancho disponible. */
.modal:has(.admin-user-role-list){width:min(1040px,calc(100vw - 32px));max-height:calc(100vh - 32px)}
.admin-user-role-list{display:grid;gap:10px;max-height:min(62vh,620px);overflow:auto;padding:2px 6px 4px 0}
.admin-user-role-row{display:grid;grid-template-columns:minmax(0,1fr) 210px;gap:12px 16px;align-items:start;padding:16px;border:1px solid rgba(88,190,239,.2);border-radius:10px;background:rgba(4,18,31,.54)}
.admin-user-role-identity{grid-column:1;min-width:0;display:grid;gap:4px;align-content:start}
.admin-user-role-identity strong{display:block;overflow-wrap:anywhere;font-size:13px;line-height:1.25}
.admin-user-role-identity small{display:block;overflow-wrap:anywhere;white-space:normal;line-height:1.35;color:var(--muted)}
.admin-user-roles{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:10px 18px;min-width:0;margin:0;padding:12px;border:1px solid rgba(184,144,92,.3);border-radius:6px}.admin-user-roles legend,.admin-user-permissions legend{color:var(--muted);font-size:11px;padding:0 5px}.admin-user-roles label{display:inline-flex;align-items:center;gap:7px;font-size:12px}.admin-user-roles input{accent-color:#a43b40;margin:0}
.admin-user-permissions{min-width:0;margin:0;border:0;grid-column:1/-1;display:flex;flex-wrap:wrap;gap:8px 12px;padding-top:4px;border-top:1px solid rgba(38,59,91,.6)}
.admin-user-permissions label{display:inline-flex;align-items:center;gap:6px;min-height:26px;color:var(--muted);font-size:10px;line-height:1.2;white-space:nowrap}
.admin-user-permissions input{margin:0;accent-color:var(--violet)}
.admin-user-role-row>[data-action="save-app-user-role"]{grid-column:2;justify-self:end;min-width:110px}
@media(max-width:700px){.modal:has(.admin-user-role-list){width:calc(100vw - 20px);max-height:calc(100vh - 20px);padding:18px}.admin-user-role-row{grid-template-columns:1fr}.admin-user-role-row>.select,.admin-user-role-row>[data-action="save-app-user-role"]{grid-column:1;justify-self:stretch}.admin-user-permissions{grid-column:1}.admin-user-role-row>[data-action="save-app-user-role"]{width:100%}}
.community-message{position:relative}.community-message-body{min-width:0;flex:1}.community-message-delete{flex:0 0 auto;align-self:flex-start;width:22px;height:22px;padding:0;border:1px solid rgba(255,105,145,.55);border-radius:6px;color:#ff9bb7;background:rgba(105,23,54,.35);font-size:16px;line-height:18px;cursor:pointer}.community-message-delete:hover{color:#fff;background:#bd356b}
.tutorial-player{display:block;width:100%;aspect-ratio:16/9;border:0;background:#050a12}.tutorial-video-frame{overflow:hidden}

.recruitment-form{width:min(620px,calc(100% - 32px));margin:40px auto;padding:28px}.recruitment-form>p{color:var(--muted);line-height:1.6}.recruitment-form form{display:grid;gap:18px}
