@charset "UTF-8";

@font-face { font-family: "DOMA Cairo"; src: url("/assets/fonts/Cairo-Regular.ttf") format("truetype"); font-style: normal; font-weight: 400; font-display: swap; }
@font-face { font-family: "DOMA Cairo"; src: url("/assets/fonts/Cairo-SemiBold.ttf") format("truetype"); font-style: normal; font-weight: 600; font-display: swap; }
@font-face { font-family: "DOMA Cairo"; src: url("/assets/fonts/Cairo-Bold.ttf") format("truetype"); font-style: normal; font-weight: 700; font-display: swap; }

:root {
    color-scheme: dark;
    --bg: #0d1829;
    --bg-soft: #0d1829;
    --sidebar: #0d1829;
    --panel: #0d1829;
    --panel-2: #172336;
    --panel-3: #172336;
    --line: #1e2b3d;
    --line-bright: #9b752b;
    --text: #f4f7fb;
    --muted: #a7b5c8;
    --muted-2: #8e9cae;
    --accent: #c4a052;
    --accent-2: #8f7131;
    --purple-soft: #1e2b3d;
    --blue: #6695ff;
    --green: #39d89a;
    --amber: #ef9d43;
    --red: #ff5f76;
    --shadow: 0 22px 65px rgba(0, 0, 0, .25);
}

* { box-sizing: border-box; }
html { min-height: 100%; background: var(--bg); scroll-behavior: smooth; }
body { min-height: 100vh; margin: 0; background: radial-gradient(circle at 45% -20%, rgba(127,93,31,.1), transparent 38%), var(--bg); color: var(--text); font-family: "DOMA Cairo", Tahoma, "Segoe UI", Arial, sans-serif; font-size: 15px; line-height: 1.65; }
a { color: #d8b45e; text-decoration: none; }
a:hover { color: #fff; }
button, input, select, textarea { font: inherit; }
button, summary { cursor: pointer; }
button, a, input, select, textarea, summary { outline-offset: 3px; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible { outline: 2px solid #a4843e; }
h1, h2, h3, p { margin-top: 0; }
h1 { margin-bottom: 0; font-size: 26px; line-height: 1.35; letter-spacing: -.4px; }
h2 { margin-bottom: 8px; font-size: 18px; line-height: 1.45; }
p { line-height: 1.8; }
small { display: block; color: var(--muted); font-size: 12px; line-height: 1.6; }
code { direction: ltr; unicode-bidi: isolate; font-family: Consolas, monospace; }
.mono { direction: ltr; unicode-bidi: isolate; font-family: Consolas, "Courier New", monospace; }
.muted { color: var(--muted); }
.positive { color: var(--green) !important; }
.negative { color: var(--red) !important; }
.span-2 { grid-column: span 2; }
.wrap-cell { min-width: 220px; white-space: normal; overflow-wrap: anywhere; }

/* Sidebar and page shell */
.sidebar { position: fixed; z-index: 50; inset: 0 0 0 auto; width: 226px; padding: 20px 16px 16px; border-left: 1px solid #1e2b3d; background: linear-gradient(180deg, #0d1829, #0d1829 75%); display: flex; flex-direction: column; }
.brand { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 5px 20px; color: var(--text); }
.brand-copy strong { display: block; font-size: 21px; letter-spacing: -.4px; }
.brand-copy strong b { color: #aebbcc; font-weight: 500; }
.brand-copy small { margin-top: 1px; text-align: right; }
.brand-mark { width: 40px; height: 43px; flex: 0 0 40px; display: grid; place-items: center; border: 1px solid #a4843e; border-radius: 11px; background: linear-gradient(145deg, #8f6924, #7f5d1f); box-shadow: 0 8px 25px rgba(184,138,53,.4); color: #fff; font-size: 22px; }
.main-nav { min-height: 0; overflow-y: auto; padding: 4px 0 12px; scrollbar-width: thin; scrollbar-color: #2b384c transparent; }
.nav-item { display: flex; align-items: center; gap: 11px; min-height: 41px; margin: 2px 0; padding: 8px 11px; border: 1px solid transparent; border-radius: 8px; color: #aebbcc; font-size: 14px; transition: .18s ease; }
.nav-item:hover { border-color: #705b33; background: #172336; color: #d5dde9; }
.nav-item.selected { border-color: #705b33; background: linear-gradient(90deg, rgba(127,93,31,.13), rgba(127,93,31,.28)); color: #d5dde9; box-shadow: inset -2px 0 #b88a35; }
.nav-icon { width: 22px; color: #d8b45e; text-align: center; font-size: 20px; line-height: 1; }
.sidebar-foot { margin-top: auto; border-top: 1px solid #172336; padding-top: 13px; }
.sidebar-note { position: relative; padding: 10px 11px; border: 1px solid #29453f; border-radius: 9px; background: rgba(17, 43, 35, .18); color: #d5dde9; font-size: 12px; }
.sidebar-note strong { font-weight: 500; }
.sidebar-note small { margin: 2px 13px 0 0; }
.live-dot { display: inline-block; width: 7px; height: 7px; margin-left: 5px; border-radius: 50%; background: var(--green); box-shadow: 0 0 12px rgba(57, 216, 154, .55); }
.account { display: flex; align-items: center; justify-content: flex-start; gap: 10px; padding: 14px 4px 11px; }
.account-copy { min-width: 0; }
.account-copy strong { display: block; max-width: 135px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
.avatar { width: 34px; height: 34px; flex: 0 0 34px; display: grid; place-items: center; border: 1px solid #a4843e; border-radius: 50%; background: linear-gradient(145deg, #7f5d1f, #1e2b3d); color: #aebbcc; }
.workspace { max-width: 1920px; min-height: 100vh; margin-right: 226px; padding: 20px 28px 12px; }
.topbar { min-height: 50px; margin-bottom: 19px; display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.eyebrow { display: block; margin-bottom: 6px; color: #d8b45e; font-size: 11px; font-weight: 700; letter-spacing: .8px; }
.top-meta { display: flex; align-items: center; justify-content: flex-end; gap: 9px; color: var(--muted); font-size: 12px; direction: ltr; }
.top-meta > * { direction: rtl; }
.top-meta .mono { direction: ltr; }
.mobile-menu { display: none; }
.sidebar-backdrop { display: none; }
footer { margin: 24px 0 4px; color: #d8b45e; text-align: center; font-size: 11px; }
footer span { margin: 0 8px; }

/* Buttons, badges and feedback */
.button { min-height: 38px; padding: 8px 15px; border: 1px solid transparent; border-radius: 7px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; color: #eee6f8; background: transparent; font-size: 13px; font-weight: 600; line-height: 1.4; white-space: nowrap; }
.button.primary { border-color: #a4843e; background: linear-gradient(125deg, #8f6924, #8f6924); box-shadow: 0 6px 19px rgba(184,138,53,.22); color: #fff; }
.button.primary:hover { background: linear-gradient(125deg, #8f6924, #8f6924); }
.button.secondary { border-color: #705b33; background: rgba(127,93,31,.16); color: #aebbcc; }
.button.secondary:hover { border-color: #a4843e; background: rgba(127,93,31,.3); }
.button.danger-button { border-color: #9b3e55; background: rgba(116, 32, 54, .35); color: #ffb2bf; }
.button.danger-button:hover { background: rgba(142, 37, 64, .48); }
.button.compact { min-height: 32px; padding: 6px 12px; font-size: 12px; }
.button.wide, .wide { width: 100%; }
.badge { min-height: 24px; padding: 3px 9px; border: 1px solid #a4843e; border-radius: 6px; display: inline-flex; align-items: center; justify-content: center; gap: 4px; background: rgba(43,56,76,.2); color: #aebbcc; font-size: 11px; font-weight: 500; white-space: nowrap; }
.badge.success { border-color: #246c52; background: rgba(31, 100, 75, .19); color: #69e8b2; }
.badge.warning { border-color: #785426; background: rgba(116, 76, 25, .2); color: #f1b15f; }
.badge.danger { border-color: #843246; background: rgba(121, 38, 57, .23); color: #ff8497; }
.notice { margin-bottom: 18px; padding: 12px 15px; border: 1px solid #a4843e; border-radius: 9px; display: flex; align-items: center; gap: 12px; background: #172336; color: #d5dde9; font-size: 13px; }
.notice ul { margin: 0; padding-right: 18px; }
.notice button { margin-right: auto; border: 0; background: transparent; color: inherit; font-size: 22px; }
.success-notice { border-color: #27684f; background: #112a23; color: #8ee0bd; }
.warning-notice { border-color: #8a5b27; background: #321f12; color: #f4bd76; }
.error-notice { border-color: #7d3447; background: #351721; color: #f3a7b5; }
.key-notice { border-color: #a4843e; background: #1e2b3d; color: #aebbcc; }
.key-notice code { padding: 4px 11px; border: 1px dashed #a4843e; border-radius: 5px; background: #0d1829; color: #fff; font-size: 19px; letter-spacing: 3px; }
.note { margin: 14px 0 0; padding: 12px 14px; border: 1px solid #705b33; border-radius: 8px; background: rgba(30,43,61,.5); color: #aebbcc; font-size: 12px; }
.view-as-banner { margin-bottom: 12px; padding: 10px 13px; border: 1px solid #8a5b27; border-radius: 8px; display: flex; align-items: center; justify-content: space-between; gap: 12px; background: #321f12; color: #f4bd76; font-size: 12px; }
.view-as-banner form { margin: 0; }
.button-row, .compact-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.compact-row { min-height: 35px; padding: 5px 0; border-bottom: 1px solid #1e2b3d; justify-content: space-between; }
.permission-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
.permission-grid .check { min-height: 42px; padding: 7px; border: 1px solid #1e2b3d; border-radius: 7px; flex-direction: row; align-items: flex-start; }
.permission-grid .check input { width: 15px; min-height: 15px; margin-top: 2px; accent-color: var(--accent); }
[data-device-check], [data-check-all] { width: 16px; min-height: 16px; accent-color: var(--accent); }
.bar { height: 5px; overflow: hidden; border-radius: 10px; display: block; background: #1e2b3d; }
.bar i { height: 100%; display: block; border-radius: inherit; background: linear-gradient(90deg, #8f6924, #8f6924); }

/* Panels, headers and hero areas */
.panel { min-width: 0; margin-bottom: 14px; padding: 16px; border: 1px solid var(--line); border-radius: 10px; background: linear-gradient(145deg, rgba(23,35,54,.98), rgba(13,24,41,.98)); box-shadow: 0 12px 35px rgba(0, 0, 0, .08); }
.section-heading { min-height: 31px; margin-bottom: 13px; display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.section-heading h2 { margin: 0 0 3px; }
.section-heading p { margin: 0; color: var(--muted); font-size: 11px; }
.section-heading > a { margin-top: 4px; font-size: 11px; white-space: nowrap; }
.hero, .page-intro { margin-bottom: 14px; border: 1px solid #705b33; border-radius: 10px; background: radial-gradient(circle at 15% 120%, rgba(127,93,31,.24), transparent 42%), linear-gradient(120deg, #172336, #172336); }
.hero { min-height: 90px; padding: 17px 20px; display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.hero-copy { display: flex; align-items: center; gap: 14px; }
.hero-copy h2 { margin-bottom: 3px; font-size: 22px; }
.hero-copy p { margin: 0; color: #aebbcc; font-size: 12px; }
.hero-icon { width: 40px; height: 45px; display: grid; place-items: center; border: 1px solid #a4843e; border-radius: 9px; background: linear-gradient(145deg, #2b384c, #1e2b3d); color: #d8b45e; font-size: 24px; }
.hero-actions { display: flex; gap: 10px; }
.page-intro { min-height: 86px; padding: 16px 20px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.page-intro h2 { margin-bottom: 3px; font-size: 21px; }
.page-intro p { max-width: 720px; margin-bottom: 0; color: var(--muted); font-size: 12px; }
.count-chip { min-width: 90px; padding: 8px 14px; border-right: 1px solid #a4843e; text-align: center; }
.count-chip strong { display: block; font-size: 26px; }
.dashboard-grid { display: grid; gap: 14px; }
.dashboard-grid-main { grid-template-columns: minmax(250px, 1.05fr) minmax(235px, .9fr) minmax(0, 1.55fr); grid-template-areas: "platform health recent"; direction: ltr; }
.dashboard-grid-main > * { direction: rtl; }
.recent-devices-panel { grid-area: recent; }
.platform-panel { grid-area: platform; }
.health-panel { grid-area: health; }
.dashboard-grid-half { grid-template-columns: repeat(2, minmax(0, 1fr)); direction: ltr; }
.dashboard-grid-half > *, .dashboard-grid-bottom > * { direction: rtl; }
.dashboard-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.dashboard-grid-bottom { grid-template-columns: 1.2fr 1fr; direction: ltr; }
.span-2 { grid-column: auto; }

/* Metrics */
.metrics { margin-bottom: 14px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.metrics-six { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.metric { position: relative; min-width: 0; min-height: 101px; padding: 13px 14px; overflow: hidden; border: 1px solid var(--line); border-radius: 9px; background: linear-gradient(135deg, #172336, #0d1829); }
.metric::after { content: ""; position: absolute; width: 60px; height: 60px; left: -28px; bottom: -33px; border-radius: 50%; background: rgba(143,105,36,.08); filter: blur(2px); }
.metric-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; color: #d5dde9; font-size: 12px; }
.metric-symbol { width: 29px; height: 29px; flex: 0 0 29px; display: grid; place-items: center; border: 1px solid #705b33; border-radius: 7px; background: #1e2b3d; color: #d8b45e; font-size: 18px; }
.metric-symbol.blue { border-color: #314989; background: #2b384c; color: #7198ff; }
.metric-symbol.green { border-color: #23664e; background: #123b2d; color: #49dfa5; }
.metric-symbol.amber { border-color: #75491f; background: #382511; color: #ef9d43; }
.metric-symbol.red { border-color: #7e2e40; background: #39151f; color: #ff637a; }
.metric > strong { display: block; margin: 9px 0 1px; font-size: 26px; line-height: 1.2; letter-spacing: -.4px; }
.metric > .metric-date { font-size: 20px; }
.metric-trend { position: absolute; left: 13px; bottom: 11px; font-size: 11px; font-weight: 700; direction: ltr; }
.metric-trend.up { color: var(--green); }
.metric-trend.down { color: var(--red); }
.security-metrics { grid-template-columns: repeat(4, minmax(0, 1fr)); }

/* Tables and pagination */
.table-wrap { width: 100%; overflow: auto; border-radius: 7px; }
table { width: 100%; border-collapse: collapse; color: #d5dde9; text-align: right; white-space: nowrap; font-size: 12px; }
th { padding: 9px 10px; border-block: 1px solid #1e2b3d; background: #172336; color: #aebbcc; font-size: 11px; font-weight: 500; }
td { padding: 10px; border-bottom: 1px solid #1e2b3d; vertical-align: middle; }
tbody tr:hover { background: rgba(43,56,76,.15); }
tbody tr:last-child td { border-bottom: 0; }
td small { margin-top: 2px; }
.strong-link { color: #d5dde9; font-weight: 700; }
.empty { width: 100%; padding: 30px 10px !important; color: var(--muted); text-align: center; white-space: normal; }
.pagination { padding-top: 14px; display: flex; align-items: center; justify-content: space-between; gap: 10px; color: var(--muted); font-size: 11px; }
.pagination > div { display: flex; gap: 7px; }
.presence-dot { width: 6px; height: 6px; margin-left: 5px; display: inline-block; border-radius: 50%; background: #7f5d1f; }
.presence-dot.online { background: var(--green); box-shadow: 0 0 8px rgba(57, 216, 154, .5); }
.platform-icon { margin-left: 4px; color: #d8b45e; }
.progress-label { display: block; margin-bottom: 3px; color: #d5dde9; }

/* Forms */
.filters { margin-bottom: 14px; display: flex; align-items: flex-end; gap: 8px; flex-wrap: wrap; }
.filters .grow { flex: 1; min-width: 190px; }
label, .password-field { min-width: 0; display: flex; flex-direction: column; gap: 5px; color: #d5dde9; font-size: 12px; }
input, select, textarea { width: 100%; min-width: 0; min-height: 38px; padding: 8px 10px; border: 1px solid #705b33; border-radius: 7px; background: #0d1829; color: var(--text); }
textarea { min-height: 90px; resize: vertical; line-height: 1.7; }
input::placeholder, textarea::placeholder { color: #d8b45e; }
input:focus, select:focus, textarea:focus { border-color: #a4843e; background: #0d1829; }
select { color-scheme: dark; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.form-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.stack { display: flex; flex-direction: column; gap: 12px; }
.stack > .button { align-self: flex-start; min-width: 150px; }
.step-up { margin-top: 2px; padding: 11px; border: 1px solid #705b33; border-radius: 8px; background: rgba(30,43,61,.5); }
.step-up p { margin: 0 0 9px; color: var(--muted); font-size: 11px; }
.form-panel > details > summary { padding: 2px; display: flex; align-items: center; justify-content: space-between; gap: 12px; list-style: none; color: #aebbcc; }
.form-panel > details > summary::-webkit-details-marker { display: none; }
.form-panel > details > summary span { font-size: 15px; font-weight: 700; }
.form-panel > details[open] > summary { margin-bottom: 17px; padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.checkbox-line { min-height: 38px; flex-direction: row; align-items: center; gap: 8px; }
.checkbox-line input[type="checkbox"] { width: 16px; min-height: 16px; accent-color: var(--accent); }
.checkbox-line input[type="hidden"] { display: none; }
.checkbox-line span { min-width: 0; }
fieldset { min-width: 0; margin: 0; padding: 11px; border: 1px solid #705b33; border-radius: 8px; }
legend { padding: 0 6px; color: #aebbcc; font-size: 12px; }

/* Dashboard visuals */
.donut-layout { min-height: 175px; display: grid; grid-template-columns: 160px 1fr; align-items: center; gap: 12px; }
.donut-chart { position: relative; width: 150px; height: 150px; }
.donut-chart svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.donut-track { stroke: #1e2b3d; stroke-width: 7; }
.donut-segment { stroke-width: 7; }
.segment-0 { stroke: #d8b45e; }.segment-1 { stroke: #d8b45e; }.segment-2 { stroke: #d8b45e; }.segment-3 { stroke: #d8b45e; }.segment-4 { stroke: #5b82e8; }.segment-5 { stroke: #d8b45e; }
.segment-bg-0 { background: #8f6924; }.segment-bg-1 { background: #8f6924; }.segment-bg-2 { background: #8f6924; }.segment-bg-3 { background: #8f6924; }.segment-bg-4 { background: #5b82e8; }.segment-bg-5 { background: #8f6924; }
.donut-center { position: absolute; inset: 0; display: grid; place-content: center; text-align: center; pointer-events: none; }
.donut-center strong { font-size: 22px; }.donut-center small { font-size: 10px; }
.legend-list { display: flex; flex-direction: column; gap: 7px; }
.legend-list > div { display: grid; grid-template-columns: 8px minmax(62px, 1fr) auto; align-items: center; gap: 6px; font-size: 11px; }
.legend-list small { grid-column: 3; }
.legend-dot { width: 7px; height: 7px; border-radius: 50%; }
.health-list { display: flex; flex-direction: column; }
.health-list > div { min-height: 34px; padding: 6px 3px; border-bottom: 1px solid #1e2b3d; display: flex; align-items: center; gap: 8px; }
.health-list > div:last-child { border-bottom: 0; }
.health-list strong { font-size: 12px; font-weight: 500; }
.service-icon { width: 24px; height: 24px; display: grid; place-items: center; border: 1px solid #705b33; border-radius: 6px; background: #1e2b3d; color: #d8b45e; }
.health-state { margin-right: auto; display: flex; align-items: center; gap: 5px; color: var(--muted); font-size: 11px; }
.health-state i { width: 6px; height: 6px; border-radius: 50%; background: #7f5d1f; }
.health-state.healthy { color: var(--green); }.health-state.healthy i { background: var(--green); box-shadow: 0 0 8px rgba(57,216,154,.5); }
.health-state.degraded { color: var(--amber); }.health-state.degraded i { background: var(--amber); }
.health-state.unavailable { color: var(--red); }.health-state.unavailable i { background: var(--red); }
.pulse { color: #d8b45e; }
.quick-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.quick-action { min-height: 47px; padding: 9px 12px; border: 1px solid #a4843e; border-radius: 7px; display: flex; align-items: center; justify-content: space-between; background: linear-gradient(130deg, rgba(43,56,76,.38), rgba(23,35,54,.65)); color: #aebbcc; font-size: 12px; }
.quick-action span { color: #d8b45e; font-size: 18px; }
.quick-action.danger { border-color: #843246; background: rgba(91, 28, 45, .24); color: #ffc1cb; }
.quick-action.danger span { color: var(--red); }
.quick-action.amber { border-color: #795229; background: rgba(91, 57, 23, .22); color: #f1c58c; }.quick-action.amber span { color: var(--amber); }
.feature-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 18px; }
.feature-item { min-height: 33px; padding: 5px 2px; border-bottom: 1px solid #1e2b3d; display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.feature-name { display: flex; align-items: center; gap: 7px; font-size: 11px; }.feature-name i { color: #d8b45e; font-style: normal; }
.read-toggle { display: inline-flex; align-items: center; gap: 5px; color: #aebbcc; font-size: 10px; direction: ltr; }
.read-toggle i { position: relative; width: 35px; height: 18px; border-radius: 20px; background: #2b384c; }
.read-toggle i::after { content: ""; position: absolute; top: 3px; left: 3px; width: 12px; height: 12px; border-radius: 50%; background: #e7e4eb; transition: .2s; }
.read-toggle.on { color: var(--green); }.read-toggle.on i { background: #26ba82; }.read-toggle.on i::after { left: 20px; background: #fff; }
.compact-table > div { min-height: 35px; padding: 6px 2px; border-bottom: 1px solid #1e2b3d; display: grid; grid-template-columns: 8px minmax(100px, 1fr) minmax(80px, .7fr) auto; align-items: center; gap: 8px; font-size: 11px; }
.compact-table > div:last-child { border-bottom: 0; }.compact-table time { color: var(--muted); }
.activity-dot { width: 6px; height: 6px; border-radius: 50%; background: #8f6924; }.danger-dot { background: var(--red); }
.announcement-list { display: flex; flex-direction: column; gap: 7px; }
.announcement { min-height: 50px; padding: 9px; border: 1px solid #705b33; border-radius: 7px; display: flex; align-items: flex-start; gap: 9px; background: rgba(43,56,76,.25); }
.announcement.warning { border-color: #6e4922; background: rgba(91, 55, 20, .23); }.announcement.critical { border-color: #783044; background: rgba(93, 28, 46, .25); }
.announcement-icon { width: 25px; height: 25px; flex: 0 0 25px; display: grid; place-items: center; border-radius: 6px; background: #7f5d1f; color: #d8b45e; }
.announcement.warning .announcement-icon { background: #573715; color: var(--amber); }.announcement.critical .announcement-icon { background: #5a1929; color: var(--red); }
.announcement strong { font-size: 12px; }.announcement p { margin: 1px 0; color: var(--muted); font-size: 10px; line-height: 1.5; }.announcement time { color: #d8b45e; font-size: 10px; }

/* Detail pages and menus */
.details-grid { margin: 12px 0 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }
.details-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.details-grid dt { margin-bottom: 3px; color: var(--muted); font-size: 11px; }.details-grid dd { margin: 0; overflow-wrap: anywhere; font-size: 12px; }
.value-emphasis { font-size: 16px !important; font-weight: 700; }
.device-state { display: flex; align-items: center; gap: 8px; }
.presence-label { min-height: 25px; padding: 3px 8px; display: flex; align-items: center; gap: 5px; color: #aebbcc; font-size: 11px; }.presence-label i { width: 6px; height: 6px; border-radius: 50%; background: #7f5d1f; }.presence-label.online { color: var(--green); }.presence-label.online i { background: var(--green); box-shadow: 0 0 8px rgba(57,216,154,.5); }
.action-cards { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; align-items: start; }
.action-card { min-width: 0; border: 1px solid #705b33; border-radius: 8px; background: rgba(23,35,54,.5); }
.action-card > summary { min-height: 58px; padding: 10px; display: flex; align-items: center; gap: 8px; list-style: none; }.action-card > summary::-webkit-details-marker { display: none; }
.action-card > summary strong { display: block; font-size: 12px; }.action-card-icon { width: 29px; height: 29px; flex: 0 0 29px; display: grid; place-items: center; border: 1px solid #a4843e; border-radius: 7px; background: #1e2b3d; color: #d8b45e; }
.action-card > form { padding: 12px; border-top: 1px solid #705b33; }.action-card[open] { grid-column: span 2; }.danger-card { border-color: #653044; }
.timeline > div { position: relative; min-height: 42px; padding: 5px 16px 8px 0; border-right: 1px solid #705b33; display: flex; gap: 9px; align-items: flex-start; }.timeline > div > i { position: absolute; right: -4px; top: 10px; width: 7px; height: 7px; border-radius: 50%; background: var(--accent); }.timeline > div > span { min-width: 0; flex: 1; }.timeline > div strong { font-size: 11px; }.timeline > div small { max-width: 420px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.timeline time { color: var(--muted); font-size: 10px; }
.row-menu { position: relative; }.row-menu > summary { min-height: 28px; padding: 4px 9px; border: 1px solid #705b33; border-radius: 6px; list-style: none; color: #aebbcc; text-align: center; font-size: 11px; }.row-menu > summary::-webkit-details-marker { display: none; }
.row-menu-popover { position: absolute; z-index: 30; top: 34px; left: 0; width: 330px; max-height: 70vh; padding: 12px; overflow: auto; border: 1px solid #a4843e; border-radius: 9px; background: #0d1829; box-shadow: var(--shadow); white-space: normal; }.wide-popover { width: min(720px, 76vw); }
.nested-details { border-top: 1px solid #705b33; padding: 9px 0; }.nested-details:first-child { border-top: 0; }.nested-details > summary { list-style: none; color: #aebbcc; font-size: 12px; font-weight: 600; }.nested-details > summary::-webkit-details-marker { display: none; }.nested-details[open] > summary { margin-bottom: 12px; }.danger-zone > summary { color: #ff91a2; }
.inline-actions { display: flex; gap: 5px; }.inline-actions form { margin: 0; }
.json-detail summary { color: #d8b45e; }.json-detail pre, pre { max-width: 480px; max-height: 300px; margin: 7px 0 0; padding: 10px; overflow: auto; border-radius: 6px; background: #0d1829; color: #d5dde9; text-align: left; white-space: pre-wrap; overflow-wrap: anywhere; direction: ltr; font: 9px/1.6 Consolas, monospace; }

/* Roles, permissions, switches */
.role-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }.role-card { margin-bottom: 0; }.owner-role { border-color: #a4843e; background: radial-gradient(circle at 0 0, rgba(143,105,36,.16), transparent 35%), #0d1829; }
.role-stats { margin: 13px 0; padding: 10px 0; border-block: 1px solid #1e2b3d; display: grid; grid-template-columns: repeat(3, 1fr); }.role-stats span { padding: 0 10px; border-left: 1px solid #1e2b3d; }.role-stats span:last-child { border-left: 0; }.role-stats strong { display: block; font-size: 16px; }.role-stats small { margin-top: 2px; }
.permission-groups { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }.permission-groups fieldset { display: flex; flex-direction: column; gap: 6px; }.permission-tags { display: flex; gap: 5px; flex-wrap: wrap; }.permission-tags span, .mini-toggles span { padding: 3px 6px; border: 1px solid #705b33; border-radius: 5px; color: #aebbcc; font: 8px Consolas, monospace; }.mini-toggles { max-width: 280px; display: flex; flex-wrap: wrap; gap: 3px; }.mini-toggles span.on { border-color: #296b52; color: var(--green); }
.toggle-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }.switch-row { min-height: 47px; padding: 8px 10px; border: 1px solid #705b33; border-radius: 7px; flex-direction: row; align-items: center; justify-content: space-between; background: rgba(23,35,54,.4); }.switch-row > input[type="hidden"] { display: none; }.switch-row > input[type="checkbox"] { position: absolute; width: 1px; height: 1px; opacity: 0; }.switch-row > i { position: relative; width: 39px; height: 20px; flex: 0 0 39px; border-radius: 20px; background: #2b384c; }.switch-row > i::after { content: ""; position: absolute; top: 3px; left: 3px; width: 14px; height: 14px; border-radius: 50%; background: #e7e4e9; transition: .2s; }.switch-row > input:checked + i { background: #27bb83; }.switch-row > input:checked + i::after { left: 22px; background: #fff; }.switch-row.readonly { display: flex; }.switch-row.readonly > .read-toggle { margin-right: auto; }

/* Analytics, releases, announcements, health */
progress { width: 100%; height: 5px; overflow: hidden; border: 0; border-radius: 20px; display: block; appearance: none; background: #1e2b3d; }progress::-webkit-progress-bar { background: #1e2b3d; }progress::-webkit-progress-value { border-radius: 20px; background: linear-gradient(90deg, #7f5d1f, #8f6924); }progress::-moz-progress-bar { border-radius: 20px; background: #8f6924; }
.bar-list { display: flex; flex-direction: column; gap: 11px; }.bar-list > div > span { margin-bottom: 4px; display: flex; justify-content: space-between; font-size: 11px; }.bar-list b { color: #aebbcc; }.horizontal-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 20px; }
.rank-list { display: flex; flex-direction: column; }.rank-list > div { min-height: 38px; padding: 7px 2px; border-bottom: 1px solid #1e2b3d; display: flex; align-items: center; justify-content: space-between; gap: 10px; }.rank-list > div:last-child { border-bottom: 0; }.rank-list strong { font-size: 12px; }.rank-list b { color: #d8b45e; font-size: 13px; }
.line-chart { height: 220px; padding: 5px 2px 0; }.line-chart svg { width: 100%; height: 190px; overflow: visible; }.line-chart .chart-grid { fill: none; stroke: #1e2b3d; stroke-width: .35; vector-effect: non-scaling-stroke; }.line-chart polyline { fill: none; stroke: #d8b45e; stroke-width: 1.5; vector-effect: non-scaling-stroke; filter: drop-shadow(0 0 3px rgba(143,105,36,.6)); }.line-chart circle { fill: #d8b45e; stroke: #d8b45e; stroke-width: .5; vector-effect: non-scaling-stroke; }.chart-labels { display: flex; justify-content: space-between; color: #d8b45e; font: 8px Consolas, monospace; direction: ltr; }
.announcement-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }.announcement-card { padding: 13px; border: 1px solid #705b33; border-radius: 8px; background: rgba(30,43,61,.35); }.announcement-card.warning { border-color: #765025; background: rgba(76, 48, 20, .22); }.announcement-card.critical { border-color: #7c3045; background: rgba(81, 25, 41, .23); }.announcement-card-head { display: flex; align-items: center; gap: 9px; }.announcement-card-head > div { flex: 1; }.announcement-card > p { margin: 10px 0; color: #aebbcc; font-size: 12px; }.announcement-meta { display: flex; gap: 12px; flex-wrap: wrap; color: #aebbcc; font-size: 10px; }
.service-cards { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; }.service-cards article { min-width: 0; padding: 11px; border: 1px solid #1e2b3d; border-radius: 8px; background: rgba(23,35,54,.5); }.service-card-head { display: flex; justify-content: space-between; gap: 7px; }.service-cards article > strong { display: block; margin-top: 9px; font-size: 12px; }.service-cards article > p { min-height: 32px; margin: 3px 0 8px; color: var(--muted); font-size: 10px; line-height: 1.5; }.service-cards article > div:last-child { border-top: 1px solid #1e2b3d; padding-top: 6px; display: flex; justify-content: space-between; color: #d8b45e; font-size: 10px; }
.security-checks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }.security-checks > div { padding: 9px; border: 1px solid #2f443b; border-radius: 7px; background: rgba(22,55,43,.13); display: grid; grid-template-columns: 22px 1fr; }.security-checks > div > span { grid-row: span 2; color: var(--green); }.security-checks strong { font-size: 11px; }
.country-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 7px; }.country-grid article { padding: 9px; border: 1px solid #1e2b3d; border-radius: 7px; display: flex; align-items: center; gap: 7px; background: rgba(23,35,54,.45); }.country-grid article > span:first-child { min-width: 0; flex: 1; }.country-grid article strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; }.country-grid .nested-details { width: 100%; flex-basis: 100%; }.country-grid article:has(.nested-details[open]) { grid-column: span 2; flex-wrap: wrap; }

/* Login and errors */
.auth-workspace { min-height: 100vh; padding: 35px 22px; display: flex; flex-direction: column; align-items: center; justify-content: center; background: radial-gradient(circle at 75% 12%, rgba(127,93,31,.28), transparent 42%), #0d1829; }
.auth-workspace > .notice { width: 100%; max-width: 920px; }.login-shell { width: 100%; max-width: 920px; display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 70px; }.login-intro .brand-mark { margin-bottom: 25px; }.brand-mark.large { width: 66px; height: 71px; font-size: 35px; border-radius: 17px; }.login-intro h1 { margin: 14px 0; font-size: 41px; line-height: 1.4; }.login-intro h1 span { color: #d8b45e; }.login-intro p { color: var(--muted); font-size: 13px; }.login-pills { margin-top: 22px; display: flex; gap: 7px; }.login-pills span { padding: 5px 12px; border: 1px solid #705b33; border-radius: 20px; color: #aebbcc; font-size: 11px; }.login-panel { margin: 0; padding: 29px; border-color: #a4843e; background: linear-gradient(145deg,#172336,#0d1829); box-shadow: 0 30px 100px rgba(0,0,0,.4); }.login-panel h2 { margin: 17px 0 3px; font-size: 25px; }.login-panel > .muted { font-size: 12px; }.login-panel form { margin-top: 22px; }.login-panel .small { margin-top: 18px; }.otp { letter-spacing: 7px; }.error-page { width: 100%; max-width: 620px; margin: 8vh auto; padding: 35px; text-align: center; }.error-page .brand-mark { margin: 0 auto 20px; }.error-page p { color: var(--muted); }

/* Password controls */
.password-control { position: relative; min-width: 0; }.password-control-ready input { padding-right: 88px; }.password-toggle { position: absolute; right: 4px; top: 50%; transform: translateY(-50%); min-width: 76px; min-height: 29px; padding: 3px 7px; border: 1px solid #a4843e; border-radius: 5px; display: inline-flex; align-items: center; justify-content: center; gap: 5px; background: #1e2b3d; color: #aebbcc; font-size: 12px; }.password-toggle[hidden] { display: none; }.password-toggle:hover { background: #2b384c; }.password-toggle[aria-pressed="true"] { background: #2b384c; }.password-eye-slash { display: none; }.password-toggle[aria-pressed="true"] .password-eye-slash { display: block; }

@media (min-width: 1700px) {
    .workspace { padding: 24px 38px 14px; }.sidebar { width: 235px; }.workspace { margin-right: 235px; }.metric { min-height: 106px; }.panel { padding: 17px; }
}
@media (max-width: 1280px) {
    .metrics-six { grid-template-columns: repeat(3, minmax(0,1fr)); }.dashboard-grid-main { grid-template-columns: 1fr; grid-template-areas: "recent" "health" "platform"; }.dashboard-grid-bottom { grid-template-columns: 1fr; }.dashboard-grid-3 { grid-template-columns: repeat(2,minmax(0,1fr)); }.service-cards { grid-template-columns: repeat(3,minmax(0,1fr)); }.action-cards { grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@media (max-width: 900px) {
    .sidebar { transform: translateX(105%); transition: transform .22s ease; }.menu-open .sidebar { transform: translateX(0); }.sidebar-backdrop { position: fixed; z-index: 45; inset: 0; background: rgba(0,0,0,.64); }.menu-open .sidebar-backdrop { display: block; }.mobile-menu { position: fixed; z-index: 40; top: 14px; right: 14px; width: 38px; height: 38px; border: 1px solid #a4843e; border-radius: 8px; display: grid; place-items: center; background: #172336; color: #aebbcc; }.workspace { margin-right: 0; padding: 18px 16px 10px; }.topbar { padding-right: 47px; }.dashboard-grid-half, .role-grid { grid-template-columns: 1fr; }.form-grid-3 { grid-template-columns: repeat(2,minmax(0,1fr)); }.action-card[open] { grid-column: auto; }.announcement-cards { grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
    .workspace { padding: 14px 10px 8px; }.topbar { align-items: center; }.top-meta > .mono, .top-meta > .badge { display: none; }.top-meta .button { padding: 5px 8px; }.page-heading h1 { font-size: 21px; }.hero, .page-intro { padding: 14px; flex-direction: column; align-items: stretch; }.hero-copy h2, .page-intro h2 { font-size: 18px; }.hero-actions { flex-wrap: wrap; }.count-chip { border-right: 0; border-top: 1px solid #705b33; }.metrics, .metrics-six, .security-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }.dashboard-grid-3 { grid-template-columns: 1fr; }.panel { padding: 12px; }.form-grid, .form-grid-3, .details-grid, .details-grid-3, .permission-groups, .toggle-grid, .feature-grid, .service-cards, .security-checks { grid-template-columns: 1fr; }.span-2 { grid-column: auto; }.action-cards { grid-template-columns: 1fr; }.quick-actions { grid-template-columns: repeat(2,minmax(0,1fr)); }.donut-layout { grid-template-columns: 1fr; justify-items: center; }.legend-list { width: 100%; }.row-menu-popover, .wide-popover { position: fixed; inset: 8vh 3vw auto; width: 94vw; max-height: 84vh; }.compact-table > div { grid-template-columns: 7px minmax(80px,1fr) auto; }.compact-table > div > span:nth-child(3) { display: none; }.login-shell { max-width: 410px; grid-template-columns: 1fr; gap: 24px; }.login-intro { text-align: center; }.login-intro .brand-mark { margin: 0 auto 15px; }.login-intro h1 { font-size: 27px; margin: 8px 0; }.login-intro > p, .login-pills { display: none; }.login-panel { padding: 22px; }.pagination { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 620px) { .permission-grid { grid-template-columns: 1fr; }.view-as-banner { align-items: stretch; flex-direction: column; } }

@media (max-width: 900px) { .country-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 620px) { .country-grid { grid-template-columns: 1fr; }.country-grid article:has(.nested-details[open]) { grid-column: auto; } }
@media (forced-colors: active) { .password-toggle, .button, .badge { border-color: ButtonText; } }

/* Dedicated service health pages */
.health-service-cards { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.health-service-card { position: relative; display: flex; flex-direction: column; }
.health-service-card.health-status-healthy { border-color: #2b5d4b; }
.health-service-card.health-status-degraded, .health-service-card.health-status-unknown { border-color: #6d4c28; }
.health-service-card.health-status-unavailable { border-color: #713042; }
.health-service-card > p { flex: 1; }
.health-service-card > .health-card-meta { margin-top: auto; padding-top: 7px; border-top: 1px solid #1e2b3d; display: flex; align-items: center; justify-content: space-between; gap: 8px; color: #d8b45e; font-size: 10px; }
.health-service-card > .health-card-actions { margin-top: 9px; padding-top: 9px; border-top: 1px solid #1e2b3d; display: block; color: inherit; font-size: inherit; }
.health-detail-status { border-color: #705b33; }
.health-detail-status-success { border-color: #285c49; background: linear-gradient(145deg, rgba(19, 47, 38, .36), rgba(13,24,41,.98)); }
.health-detail-status-warning { border-color: #6e4d28; background: linear-gradient(145deg, rgba(62, 42, 18, .29), rgba(13,24,41,.98)); }
.health-detail-status-danger { border-color: #773346; background: linear-gradient(145deg, rgba(66, 24, 35, .34), rgba(13,24,41,.98)); }
.health-explain-grid { align-items: stretch; }
.health-explain-grid > .panel { height: 100%; }
.health-explain-block { min-height: 76px; padding: 12px 0; border-bottom: 1px solid #1e2b3d; display: grid; grid-template-columns: 30px 1fr; gap: 10px; align-items: flex-start; }
.health-explain-block:first-child { padding-top: 0; }
.health-explain-block:last-child { border-bottom: 0; }
.health-explain-icon { width: 28px; height: 28px; display: grid; place-items: center; border: 1px solid #a4843e; border-radius: 7px; background: #1e2b3d; color: #d8b45e; font-size: 12px; font-weight: 700; }
.health-explain-block h2 { margin-bottom: 3px; font-size: 14px; }
.health-explain-block p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.8; }
.health-action-block .health-explain-icon { border-color: #2c6c54; background: rgba(29, 91, 68, .25); color: var(--green); }
.health-action-block p { color: #d5dde9; }
.health-technical { margin-top: 12px; }
.health-technical > summary { color: #d8b45e; }
.health-history { margin-top: 10px; }
.health-history .badge { min-height: 20px; padding: 2px 6px; font-size: 10px; }

@media (max-width: 1280px) {
    .health-service-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 800px) {
    .health-service-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 620px) {
    .health-service-cards { grid-template-columns: 1fr; }
}

/* Device action center V2: one orderly expanded action at a time. */
.device-actions-panel .action-cards {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}
.device-actions-panel .action-card[open] {
    grid-column: 1 / -1;
    border-color: #a4843e;
    background: rgba(30,43,61,.72);
}
.device-actions-panel .action-card[open] > summary {
    border-bottom: 1px solid #705b33;
    background: rgba(127,93,31,.16);
}
.device-actions-panel .action-form {
    padding: 14px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    align-items: end;
}
.device-actions-panel .action-form > .button {
    grid-column: 1 / -1;
    justify-self: start;
    min-width: 170px;
}
.device-actions-panel .action-help {
    padding: 10px 12px;
    border: 1px solid #705b33;
    border-radius: 7px;
    background: rgba(13,24,41,.72);
    color: #aebbcc;
    font-size: 12px;
    line-height: 1.8;
}
.device-actions-panel input[readonly] {
    border-color: #1e2b3d;
    background: #0d1829;
    color: #aebbcc;
    cursor: default;
}

@media (max-width: 760px) {
    .device-actions-panel .action-cards,
    .device-actions-panel .action-form { grid-template-columns: 1fr; }
    .device-actions-panel .action-card[open],
    .device-actions-panel .action-form > .button,
    .device-actions-panel .action-form > .span-2 { grid-column: auto; }
}

/* Update 03: slightly larger, easier-to-read typography across the admin system. */
body { font-size: 16px; }
h1 { font-size: 25px; }
h2 { font-size: 19px; }
small { font-size: 13px; }
.nav-item { font-size: 15px; }
.sidebar-note, .top-meta, .hero-copy p, .page-intro p, label, .password-field, .note { font-size: 13px; }
.button { font-size: 14px; }
.button.compact { font-size: 13px; }
.badge { font-size: 12px; }
table { font-size: 13px; }
th { font-size: 12px; }
.metric-top { font-size: 13px; }
.rank-list strong, .health-list strong, .quick-action, .announcement strong { font-size: 13px; }
.bar-list > div > span, .feature-name, .compact-table > div { font-size: 12px; }

/* Reusable platform presentation with recognizable operating-system icons. */
.platform-badge { min-width: 0; display: inline-flex; align-items: center; gap: 7px; color: #d5dde9; font-weight: 600; white-space: nowrap; }
.platform-badge svg { width: 17px; height: 17px; flex: 0 0 17px; fill: currentColor; }
.platform-badge-android { color: #78d8a8; }
.platform-badge-windows { color: #77a8ff; }
.platform-badge-apple { color: #e5dff0; }
.platform-badge-fire { color: #ef9d43; }
.platform-badge-tv { color: #d8b45e; }
.platform-badge-device { color: #aebbcc; }
.legend-list .platform-badge { font-size: 12px; }
.country-inline { display: inline-flex; align-items: center; gap: 6px; }
.country-inline > span:first-child { font-size: 18px; line-height: 1; }
.country-inline strong { font-size: 13px; font-weight: 600; }

/* Analytics: countries are the main card, platform/version details sit beside it. */
.analytics-geo-grid { margin-bottom: 14px; display: grid; grid-template-columns: minmax(0, 2fr) minmax(300px, .85fr); gap: 14px; align-items: start; direction: ltr; }
.analytics-geo-grid > * { direction: rtl; }
.analytics-countries-panel { min-height: 100%; }
.analytics-side-stack { display: grid; gap: 14px; align-content: start; }
.analytics-side-stack > .panel { margin-bottom: 0; }
.country-usage-list { max-height: 560px; padding-left: 4px; overflow-y: auto; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; scrollbar-width: thin; scrollbar-color: #2b384c transparent; }
.country-usage-row { min-width: 0; padding: 12px; border: 1px solid #1e2b3d; border-radius: 9px; background: linear-gradient(140deg, rgba(23,35,54,.82), rgba(13,24,41,.86)); }
.country-usage-head { margin-bottom: 8px; display: grid; grid-template-columns: 32px minmax(0, 1fr) auto; align-items: center; gap: 9px; }
.country-flag { font-size: 26px; line-height: 1; filter: saturate(.95); }
.country-usage-name { min-width: 0; }
.country-usage-name strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 15px; }
.country-usage-name small { margin-top: 1px; }
.country-usage-count { min-width: 58px; text-align: left; }
.country-usage-count strong { display: block; color: #d8b45e; font-size: 17px; line-height: 1.2; }
.country-usage-count small { text-align: left; }
.country-percent { margin-top: 5px; color: #aebbcc; font-size: 11px; }
.analytics-empty-state { min-height: 260px; padding: 28px; display: grid; place-items: center; align-content: center; text-align: center; border: 1px dashed #705b33; border-radius: 10px; background: rgba(23,35,54,.32); }
.analytics-empty-state > span { margin-bottom: 10px; font-size: 40px; }
.analytics-empty-state > strong { margin-bottom: 6px; font-size: 17px; }
.analytics-empty-state > p { max-width: 620px; margin: 0; color: var(--muted); font-size: 13px; }
.platform-usage-list { display: flex; flex-direction: column; gap: 12px; }
.platform-usage-row { padding-bottom: 9px; border-bottom: 1px solid #1e2b3d; }
.platform-usage-row:last-child { padding-bottom: 0; border-bottom: 0; }
.platform-usage-head { margin-bottom: 6px; display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.platform-usage-head b { color: #d8b45e; font-size: 14px; }
.analytics-secondary-grid { grid-template-columns: minmax(0, 2fr) minmax(280px, .9fr); grid-template-areas: none; direction: ltr; }
.analytics-secondary-grid > * { direction: rtl; }
.analytics-secondary-grid > .span-2 { grid-column: auto; }

@media (max-width: 1280px) {
    .analytics-geo-grid { grid-template-columns: minmax(0, 1.5fr) minmax(280px, 1fr); }
    .country-usage-list { grid-template-columns: 1fr; }
    .analytics-secondary-grid { grid-template-columns: minmax(0, 1.5fr) minmax(260px, 1fr); }
}
@media (max-width: 900px) {
    .analytics-geo-grid, .analytics-secondary-grid { grid-template-columns: 1fr; }
    .country-usage-list { max-height: none; grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 620px) {
    body { font-size: 15px; }
    .nav-item { font-size: 14px; }
    .country-usage-list { grid-template-columns: 1fr; }
    .country-usage-head { grid-template-columns: 28px minmax(0, 1fr) auto; }
    .country-flag { font-size: 23px; }
    .platform-badge { white-space: normal; }
}

/* Update 04: action form clarity. */
.required-note { color: #f0a0ad; font-size: .9em; font-weight: 600; }
.device-actions-panel select[name="source_owner"],
.device-actions-panel select[name="target_owner"] { min-height: 42px; }

/* ========================================================================
   Update 05 — Premium admin visual system
   Applies the approved devices/licensing visual language across the admin UI.
   ======================================================================== */
:root {
    --panel: #0d1829;
    --panel-2: #172336;
    --panel-3: #172336;
    --line: #2b384c;
    --line-bright: #9b752b;
}

body {
    font-size: 14.5px;
    background:
        radial-gradient(circle at 20% -10%, rgba(127,93,31,.12), transparent 30%),
        radial-gradient(circle at 85% 0%, rgba(127,93,31,.08), transparent 30%),
        #0d1829;
}
h1 { font-size: 27px; }
h2 { font-size: 20px; }
small { font-size: 13px; }
.workspace { padding: 22px 30px 14px; }
.panel,
.hero,
.page-intro {
    border-color: #705b33;
    border-radius: 12px;
    box-shadow: 0 16px 46px rgba(0,0,0,.12);
}
.panel { padding: 18px; background: linear-gradient(145deg, rgba(13,24,41,.985), rgba(13,24,41,.985)); }
.section-heading { margin-bottom: 15px; }
.section-heading h2 { font-size: 20px; font-weight: 700; }
.section-heading p { font-size: 13px; }
.section-heading > a { font-size: 13px; font-weight: 600; }

/* Clean and aligned form language everywhere. */
label, .password-field { gap: 7px; font-size: 11.5px; font-weight: 600; }
input, select, textarea {
    min-height: 43px;
    padding: 9px 12px;
    border: 1px solid #705b33;
    border-radius: 8px;
    background: #0d1829;
    color: #f4f7fb;
}
textarea { min-height: 90px; }
input::placeholder, textarea::placeholder { color: #d8b45e; }
input:hover, select:hover, textarea:hover { border-color: #a4843e; }
input:focus, select:focus, textarea:focus {
    border-color: #a4843e;
    box-shadow: 0 0 0 3px rgba(184,138,53,.09);
}
.form-grid { gap: 13px; }
.note, .action-help { font-size: 13px !important; }

/* Premium tables like the approved device mockup. */
.table-wrap { border: 1px solid #1e2b3d; border-radius: 10px; background: rgba(13,24,41,.45); }
table { font-size: 11.5px; }
th {
    padding: 11px 12px;
    background: #172336;
    color: #aebbcc;
    font-size: 10.5px;
    font-weight: 600;
}
td { padding: 12px; border-bottom-color: #1e2b3d; }
tbody tr { transition: background .16s ease; }
tbody tr:hover { background: rgba(127,93,31,.08); }
.strong-link, .device-name-link { color: #d5dde9; font-weight: 700; }
.device-name-link { display: flex; flex-direction: column; gap: 2px; }
.device-name-link strong { font-size: 12.5px; }
.device-name-link small { color: #aebbcc; font-size: 12px; }

/* Platform logo: compact icon beside a white label — never oversized. */
.platform-badge {
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    min-width: 0 !important;
    color: #f0eaf8 !important;
    font-size: 11.5px !important;
    font-weight: 600;
    line-height: 1.25;
    white-space: nowrap;
}
.platform-badge svg {
    display: block !important;
    width: 15px !important;
    height: 15px !important;
    max-width: 15px !important;
    max-height: 15px !important;
    flex: 0 0 15px !important;
    fill: currentColor;
}
.platform-badge > span { color: #f0eaf8 !important; }
.platform-badge-android svg { color: #71d59c; fill: #71d59c; }
.platform-badge-windows svg { color: #62a2ff; fill: #62a2ff; }
.platform-badge-apple svg { color: #f2eef8; fill: #f2eef8; }
.platform-badge-fire svg { color: #f3a24d; fill: #f3a24d; }
.platform-badge-tv svg { color: #d8b45e; fill: #d8b45e; }
.platform-badge-device svg { color: #d5dde9; fill: #d5dde9; }

/* Strong device identity block. */
.device-hero { padding: 19px 21px; }
.device-hero .hero-copy h2 { font-size: 23px; }
.device-hero .hero-copy p { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.device-information-panel { position: relative; overflow: hidden; }
.device-primary-name {
    margin-bottom: 15px;
    padding: 14px 15px;
    border: 1px solid #a4843e;
    border-radius: 10px;
    background: linear-gradient(120deg, rgba(127,93,31,.15), rgba(23,35,54,.36));
    display: grid;
    grid-template-columns: auto minmax(0,1fr) auto;
    align-items: center;
    gap: 11px;
}
.device-primary-name > span { color: #aebbcc; font-size: 13px; }
.device-primary-name > strong { color: #fff; font-size: 18px; }
.device-primary-name > small { font-size: 10.5px; }
.aligned-details { gap: 0 !important; border: 1px solid #1e2b3d; border-radius: 9px; overflow: hidden; }
.aligned-details > div {
    min-height: 69px;
    padding: 10px 12px;
    border-left: 1px solid #1e2b3d;
    border-bottom: 1px solid #1e2b3d;
    background: rgba(13,24,41,.42);
}
.aligned-details > div:nth-child(3n) { border-left: 0; }
.aligned-details dt { color: #aebbcc; font-size: 12px; }
.aligned-details dd { margin-top: 4px; color: #f2edf8; font-size: 11.5px; font-weight: 600; }

/* Device status and license are intentionally separate concepts. */
.license-summary-panel { border-color: #705b33; }
.license-text {
    min-height: 27px;
    padding: 4px 9px;
    display: inline-flex;
    align-items: center;
    border: 1px solid #2c7658;
    border-radius: 7px;
    background: rgba(27,100,72,.14);
    color: #48dda3;
    font-size: 10.5px;
    font-weight: 700;
    white-space: nowrap;
}
.license-text.is-expired {
    border-color: #8a344a;
    background: rgba(121,38,57,.19);
    color: #ff8497;
}
.badge { font-size: 10.5px; font-weight: 600; }

/* Action center: clean accordion, one clear task at a time. */
.device-actions-panel .action-cards { gap: 11px; }
.device-actions-panel .action-card {
    border-radius: 10px;
    border-color: #705b33;
    background: rgba(23,35,54,.52);
}
.device-actions-panel .action-card > summary { min-height: 57px; padding: 11px 13px; }
.device-actions-panel .action-card > summary strong { font-size: 14px; }
.device-actions-panel .action-card[open] { border-color: #a4843e; box-shadow: 0 0 0 1px rgba(184,138,53,.08); }
.device-actions-panel .action-form { padding: 16px; gap: 14px; }

/* Dashboard proportions: primary content gets the visual priority. */
.dashboard-grid-main {
    grid-template-columns: minmax(260px,.82fr) minmax(260px,.82fr) minmax(620px,1.9fr);
    grid-template-areas: "platform health recent";
}
.recent-devices-panel { min-height: 100%; }
.platform-panel .donut-layout { align-items: center; }

/* Countries are the primary analytics panel. */
.analytics-geo-grid { grid-template-columns: minmax(580px,2.25fr) minmax(300px,.8fr); }
.country-usage-list { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.country-usage-row { padding: 13px; border-color: #705b33; }
.country-flag { font-size: 24px; }
.country-usage-name strong { font-size: 15px; }
.country-usage-count strong { font-size: 18px; }

/* Sidebar/top shell closer to approved premium composition. */
.sidebar { width: 238px; padding: 20px 17px 16px; border-left-color: #1e2b3d; }
.workspace { margin-right: 238px; }
.nav-item { min-height: 43px; padding: 8px 12px; border-radius: 9px; font-size: 15px; }
.nav-item.selected { background: linear-gradient(90deg, rgba(143,105,36,.1), rgba(127,93,31,.3)); }
.button { min-height: 40px; border-radius: 8px; }
.button.primary { box-shadow: 0 8px 23px rgba(184,138,53,.23); }

@media (max-width: 1280px) {
    .dashboard-grid-main { grid-template-columns: 1fr 1fr; grid-template-areas: "recent recent" "health platform"; }
    .analytics-geo-grid { grid-template-columns: 1.55fr .9fr; }
}
@media (max-width: 900px) {
    .workspace { margin-right: 0; padding: 14px 11px 8px; }
    .dashboard-grid-main, .analytics-geo-grid { grid-template-columns: 1fr; grid-template-areas: none; }
    .device-primary-name { grid-template-columns: 1fr; }
    .aligned-details > div { border-left: 0; }
}

/* ========================================================================
   Update 05 — Premium admin visual system + device/country clarity
   Based on the approved DOMA devices mockup: clean hierarchy, stronger cards,
   compact platform icons, aligned fields and larger readable typography.
   ======================================================================== */
:root {
    --panel: #0d1829;
    --panel-2: #172336;
    --line: #2b384c;
    --line-bright: #9b752b;
    --text: #f7f2ff;
    --muted: #a7b5c8;
}

body { font-size: 14.5px; line-height: 1.7; }
.workspace { padding: 22px 30px 14px; }
.topbar { margin-bottom: 22px; }
h1 { font-size: 27px; font-weight: 700; }
h2 { font-size: 20px; font-weight: 700; }
.page-intro h2, .hero-copy h2 { font-size: 23px; }
.page-intro p, .hero-copy p, .section-heading p { font-size: 11.5px; }

.panel {
    padding: 18px;
    border-color: #705b33;
    border-radius: 12px;
    background:
        linear-gradient(145deg, rgba(23,35,54,.98), rgba(13,24,41,.98));
    box-shadow: 0 16px 44px rgba(0,0,0,.10);
}
.section-heading { min-height: 38px; margin-bottom: 15px; }
.section-heading h2 { margin-bottom: 4px; }
.section-heading > a { font-size: 10.5px; font-weight: 600; }

/* Forms: each label stays visually attached to its own control. */
label { gap: 7px; color: #d5dde9; font-size: 11.5px; font-weight: 600; }
input, select, textarea {
    min-height: 43px;
    border-color: #705b33;
    border-radius: 8px;
    background: #0d1829;
    color: #f4edf9;
}
input:focus, select:focus, textarea:focus {
    border-color: #a4843e;
    box-shadow: 0 0 0 3px rgba(184,138,53,.10);
}
.form-grid, .form-grid-3 { gap: 15px; }
.filters { gap: 10px; align-items: end; }

/* Tables follow the approved device-center look. */
.table-wrap {
    overflow: auto;
    border: 1px solid #705b33;
    border-radius: 11px;
    background: rgba(13,24,41,.50);
}
table { font-size: 14px; }
th {
    padding: 12px 13px;
    border-color: #705b33;
    background: #172336;
    color: #aebbcc;
    font-size: 10.5px;
    font-weight: 600;
}
td { padding: 13px; border-bottom-color: #1e2b3d; }
tbody tr:hover { background: rgba(127,93,31,.08); }

/* OS/platform: icon always small and beside the text; label remains white. */
.platform-badge {
    display: inline-flex !important;
    align-items: center !important;
    flex-direction: row !important;
    gap: 7px !important;
    width: auto !important;
    min-width: 0 !important;
    color: #f4f7fb !important;
    font-size: 11.5px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
}
.platform-badge svg {
    display: inline-block !important;
    width: 16px !important;
    height: 16px !important;
    min-width: 16px !important;
    max-width: 16px !important;
    max-height: 16px !important;
    flex: 0 0 16px !important;
    object-fit: contain !important;
}
.platform-badge > span { color: #f4f7fb !important; }
.platform-badge-android svg { color: #6fdb99 !important; fill: #6fdb99 !important; }
.platform-badge-windows svg { color: #58a5ff !important; fill: #58a5ff !important; }
.platform-badge-apple svg { color: #ffffff !important; fill: #ffffff !important; }
.platform-badge-fire svg { color: #ff9e45 !important; fill: #ff9e45 !important; }
.platform-badge-tv svg { color: #d8b45e !important; fill: #d8b45e !important; }
.platform-badge-device svg { color: #d5dde9 !important; fill: #d5dde9 !important; }
.legend-list .platform-badge svg,
.platform-usage-list .platform-badge svg,
.recent-devices-panel .platform-badge svg { width: 15px !important; height: 15px !important; flex-basis: 15px !important; }

/* Overview priority mirrors the approved composition. */
.dashboard-grid-main {
    grid-template-columns: minmax(250px,.78fr) minmax(260px,.78fr) minmax(650px,1.95fr);
    grid-template-areas: "platform health recent";
    gap: 15px;
}
.recent-devices-panel { min-height: 100%; }
.recent-devices-panel td:first-child strong { font-size: 15px; color: #fff; }
.recent-devices-panel td:first-child small { font-size: 12px; }

/* Device identity: the commercial name is the primary label everywhere. */
.device-hero {
    min-height: 112px;
    padding: 20px 22px;
    border-color: #a4843e;
    background:
        radial-gradient(circle at 12% 120%, rgba(143,105,36,.27), transparent 44%),
        linear-gradient(120deg,#172336,#172336);
}
.device-hero .hero-copy h2 { color: #fff; font-size: 25px; }
.device-hero .hero-copy p { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.device-state { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }

.device-primary-name {
    margin-bottom: 16px;
    padding: 15px 16px;
    border: 1px solid #a4843e;
    border-radius: 11px;
    background: linear-gradient(120deg,rgba(127,93,31,.17),rgba(23,35,54,.48));
    display: grid;
    grid-template-columns: auto minmax(0,1fr) auto;
    align-items: center;
    gap: 12px;
}
.device-primary-name > span { color: #aebbcc; font-size: 13px; }
.device-primary-name > strong { color: #fff; font-size: 19px; }
.device-primary-name > small { color: #aebbcc; font-size: 10.5px; }

.aligned-details {
    gap: 0 !important;
    border: 1px solid #705b33;
    border-radius: 10px;
    overflow: hidden;
}
.aligned-details > div {
    min-height: 76px;
    padding: 12px 13px;
    border-left: 1px solid #705b33;
    border-bottom: 1px solid #705b33;
    background: rgba(13,24,41,.48);
}
.aligned-details > div:nth-child(3n) { border-left: 0; }
.aligned-details dt { color: #aebbcc; font-size: 10.5px; font-weight: 500; }
.aligned-details dd { margin-top: 5px; color: #f5effb; font-size: 14px; font-weight: 700; }

.license-summary-panel { border-color: #705b33; }
.license-text {
    min-height: 30px;
    padding: 5px 10px;
    border: 1px solid #267354;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    background: rgba(26,103,72,.14);
    color: #43e2a2;
    font-size: 13px;
    font-weight: 700;
    white-space: nowrap;
}
.license-text.is-expired {
    border-color: #8a354b;
    background: rgba(121,38,57,.18);
    color: #ff8799;
}

/* Countries: largest analytics surface, clear count and flag per country. */
.analytics-geo-grid {
    grid-template-columns: minmax(650px,2.35fr) minmax(310px,.82fr);
    gap: 15px;
}
.analytics-countries-panel { min-height: 420px; }
.country-usage-list { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 11px; }
.country-usage-row {
    padding: 14px;
    border-color: #705b33;
    border-radius: 11px;
    background: linear-gradient(140deg,rgba(23,35,54,.90),rgba(13,24,41,.92));
}
.country-flag { font-size: 25px; }
.country-usage-name strong { font-size: 13.5px; color: #fff; }
.country-usage-count strong { color: #d8b45e; font-size: 19px; }
.country-usage-count small { font-size: 12px; }
.analytics-empty-state { min-height: 300px; }

/* Action center remains neat when opening an item. */
.device-actions-panel .action-cards { gap: 12px; }
.device-actions-panel .action-card {
    border-color: #705b33;
    border-radius: 11px;
    background: rgba(23,35,54,.55);
}
.device-actions-panel .action-card > summary { min-height: 60px; padding: 12px 14px; }
.device-actions-panel .action-card > summary strong { font-size: 12.5px; }
.device-actions-panel .action-card[open] { border-color: #a4843e; box-shadow: 0 0 0 1px rgba(184,138,53,.08); }
.device-actions-panel .action-form { padding: 17px; gap: 15px; }

@media (max-width: 1280px) {
    .dashboard-grid-main { grid-template-columns: 1fr 1fr; grid-template-areas: "recent recent" "health platform"; }
    .analytics-geo-grid { grid-template-columns: 1.55fr .9fr; }
}
@media (max-width: 900px) {
    .dashboard-grid-main, .analytics-geo-grid { grid-template-columns: 1fr; grid-template-areas: none; }
    .device-primary-name { grid-template-columns: 1fr; }
    .aligned-details > div { border-left: 0; }
}

/* ========================================================================== */
/* UPDATE 07 — premium device license, advanced search and analytics layout    */
/* ========================================================================== */

/* Device details: approved two-column premium composition. */
.device-profile-grid-v4 {
    margin-bottom: 18px;
    display: grid;
    grid-template-columns: minmax(0, 1.18fr) minmax(420px, .92fr);
    gap: 18px;
    align-items: stretch;
}
.device-profile-grid-v4 > .panel { margin-bottom: 0; }
.device-information-panel-v4,
.license-summary-panel-v4 {
    border-color: #705b33;
    border-radius: 16px;
    background:
        radial-gradient(circle at 85% 8%, rgba(143,105,36,.10), transparent 32%),
        linear-gradient(145deg, rgba(23,35,54,.98), rgba(13,24,41,.98));
    box-shadow: 0 14px 42px rgba(0,0,0,.18);
}
.device-panel-symbol {
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    display: grid;
    place-items: center;
    border: 1px solid #a4843e;
    border-radius: 11px;
    background: linear-gradient(145deg, rgba(127,93,31,.46), rgba(43,56,76,.65));
    color: #d8b45e;
    font-size: 19px;
}
.device-identity-strip {
    margin-bottom: 13px;
    padding: 0;
    border: 1px solid #a4843e;
    border-radius: 12px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(230px, .8fr);
    overflow: hidden;
    background: linear-gradient(135deg, rgba(127,93,31,.32), rgba(23,35,54,.86));
}
.device-identity-strip > div {
    min-width: 0;
    min-height: 82px;
    padding: 15px 18px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.device-identity-strip > div + div { border-right: 1px solid #705b33; }
.device-identity-strip small { margin-bottom: 4px; color: #aebbcc; font-size: 13px; }
.device-identity-strip strong { overflow-wrap: anywhere; color: #fff; font-size: 19px; line-height: 1.45; }
.device-identity-strip .mono { font-size: 15px; font-weight: 600; }
.device-facts-grid {
    margin: 0;
    border: 1px solid #705b33;
    border-radius: 12px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    overflow: hidden;
    background: rgba(13,24,41,.58);
}
.device-facts-grid > div {
    min-width: 0;
    min-height: 82px;
    padding: 13px 15px;
    border-left: 1px solid #1e2b3d;
    border-bottom: 1px solid #1e2b3d;
}
.device-facts-grid > div:nth-child(3n) { border-left: 0; }
.device-facts-grid > div:nth-last-child(-n+3) { border-bottom: 0; }
.device-facts-grid dt { margin-bottom: 6px; color: #aebbcc; font-size: 13px; font-weight: 500; }
.device-facts-grid dd { margin: 0; overflow-wrap: anywhere; color: #f4f2f8; font-size: 15px; font-weight: 700; }

.license-summary-panel-v4 { display: flex; flex-direction: column; }
.license-main-badge {
    width: fit-content;
    max-width: 100%;
    min-height: 48px;
    margin-bottom: 14px;
    padding: 10px 16px;
    border: 1px solid #2e9d76;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    background: rgba(24, 93, 69, .16);
    color: #42e5aa;
    box-shadow: inset 0 0 25px rgba(25, 184, 124, .06);
}
.license-main-badge.is-expired { border-color: #8d3b50; background: rgba(120,34,57,.18); color: #ff7d91; }
.license-main-badge span { font-size: 19px; }
.license-main-badge strong { overflow-wrap: anywhere; font-size: 18px; }
.license-overview-grid {
    flex: 1;
    border: 1px solid #705b33;
    border-radius: 13px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    overflow: hidden;
    background: rgba(13,24,41,.62);
}
.license-overview-item {
    min-height: 118px;
    padding: 18px;
    border-left: 1px solid #1e2b3d;
    border-bottom: 1px solid #1e2b3d;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 8px;
}
.license-overview-item:nth-child(2n) { border-left: 0; }
.license-overview-wide { grid-column: 1 / -1; border-left: 0; border-bottom: 0; min-height: 100px; }
.license-overview-item small { color: #aebbcc; font-size: 14px; }
.license-overview-item strong { color: #f3f0f8; font-size: 17px; line-height: 1.5; }
.license-overview-item .positive { color: #43e6aa !important; font-size: 21px; }
.license-overview-item .negative { color: #ff758b !important; font-size: 21px; }
.license-summary-panel-v4 .license-separation-note { margin-top: 12px; }

/* Advanced search mirrors the device/licensing table instead of a generic list. */
.search-intro-v4 { border-color: #a4843e; }
.search-filter-panel-v4 { padding: 18px; }
.search-results-panel-v4 .section-heading { align-items: center; }
.search-device-table-wrap { border-radius: 13px; }
.search-device-table-v4 { min-width: 1420px; }
.search-device-table-v4 td { min-height: 68px; vertical-align: middle; }
.search-device-table-v4 .device-identity-cell { min-width: 280px; }
.search-platform-stack { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }
.search-count-pill {
    min-width: 34px;
    min-height: 30px;
    padding: 4px 9px;
    border: 1px solid #705b33;
    border-radius: 8px;
    display: inline-grid;
    place-items: center;
    background: rgba(43,56,76,.18);
    color: #aebbcc;
    font-weight: 700;
}
.presence-inline { display: inline-flex; align-items: center; gap: 6px; }
.presence-inline i { width: 7px; height: 7px; border-radius: 50%; background: #7f5d1f; }
.presence-inline.online i { background: #36db9e; box-shadow: 0 0 10px rgba(54,219,158,.55); }

/* Analytics — organized like the approved mockup. */
.analytics-hero-v4 {
    min-height: 92px;
    padding: 18px 20px;
    border-color: #a4843e;
    border-radius: 15px;
    display: grid;
    grid-template-columns: 50px minmax(0, 1fr) auto;
    align-items: center;
    gap: 16px;
    background:
        radial-gradient(circle at 80% 0%, rgba(143,105,36,.18), transparent 35%),
        linear-gradient(135deg, #172336, #172336);
}
.analytics-hero-icon {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    border: 1px solid #a4843e;
    border-radius: 12px;
    background: linear-gradient(145deg,#8f6924,#7f5d1f);
    color: #fff;
    font-size: 25px;
    box-shadow: 0 10px 25px rgba(184,138,53,.28);
}
.analytics-hero-copy h2 { margin: 0 0 4px; font-size: 22px; }
.analytics-hero-copy p { margin: 0; color: #aebbcc; font-size: 14px; }
.analytics-hero-action { min-width: 176px; }

.analytics-metric-grid-v4 {
    margin-bottom: 14px;
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
}
.analytics-metric-card,
.analytics-platform-card {
    min-width: 0;
    min-height: 116px;
    padding: 16px;
    border: 1px solid #2b384c;
    border-radius: 13px;
    display: grid;
    grid-template-columns: 42px minmax(0,1fr);
    align-items: start;
    gap: 12px;
    background: linear-gradient(145deg,#172336,#0d1829);
    box-shadow: 0 12px 34px rgba(0,0,0,.14);
}
.analytics-metric-icon,
.analytics-platform-card-icon {
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    border: 1px solid currentColor;
    border-radius: 10px;
    background: color-mix(in srgb, currentColor 12%, transparent);
    font-size: 19px;
}
.analytics-metric-card small,
.analytics-platform-card small { color: #d5dde9; font-size: 13px; }
.analytics-metric-card strong,
.analytics-platform-card strong { display: block; margin: 3px 0; color: #fff; font-size: 26px; line-height: 1.2; }
.analytics-metric-card p,
.analytics-platform-card p { margin: 0; color: #aebbcc; font-size: 12px; }
.analytics-metric-card.tone-purple { color: #d8b45e; }
.analytics-metric-card.tone-red { color: #ff5f76; }
.analytics-metric-card.tone-blue { color: #4e9cff; }
.analytics-metric-card.tone-pink { color: #d8b45e; }
.analytics-metric-card.tone-amber { color: #f0a84e; }
.analytics-metric-card.tone-green { color: #36dba0; }

.analytics-platform-summary-v4 {
    margin-bottom: 14px;
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 12px;
}
.analytics-platform-card { min-height: 94px; padding: 14px 16px; }
.analytics-platform-card strong { font-size: 23px; }
.platform-tone-windows { color: #49a6ff; }
.platform-tone-ios { color: #f1eff7; }
.platform-tone-android { color: #55dc8b; }
.platform-tone-tv { color: #d8b45e; }

.analytics-insights-grid-v4 {
    margin-bottom: 14px;
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(300px, .95fr) minmax(300px, .95fr);
    gap: 14px;
    align-items: stretch;
}
.analytics-insights-grid-v4 > .panel { margin-bottom: 0; }
.analytics-countries-v4 { min-height: 330px; }
.analytics-country-list-v4 { display: grid; gap: 8px; max-height: 430px; overflow-y: auto; padding-left: 3px; }
.analytics-country-row-v4 {
    min-height: 56px;
    padding: 9px 10px;
    border: 1px solid #705b33;
    border-radius: 9px;
    display: grid;
    grid-template-columns: 34px minmax(120px,.72fr) minmax(120px,1fr) 72px;
    align-items: center;
    gap: 10px;
    background: rgba(13,24,41,.62);
}
.analytics-country-flag-v4 { font-size: 25px; text-align: center; }
.analytics-country-name-v4 { min-width: 0; }
.analytics-country-name-v4 strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; }
.analytics-country-name-v4 small { margin-top: 1px; }
.analytics-country-bar-v4,
.analytics-rank-bar-v4 { height: 7px; overflow: hidden; border-radius: 99px; display: block; background: #1e2b3d; }
.analytics-country-bar-v4 i,
.analytics-rank-bar-v4 i { height: 100%; display: block; border-radius: inherit; background: linear-gradient(90deg,#8f6924,#8f6924); }
.analytics-country-count-v4 { color: #d5dde9; text-align: left; font-size: 15px; }
.analytics-country-count-v4 small { display: inline; margin-right: 2px; font-size: 11px; }
.analytics-rank-panel-v4 { min-height: 330px; }
.analytics-rank-list-v4 { display: grid; gap: 9px; }
.analytics-rank-row-v4 {
    min-height: 56px;
    padding: 9px 10px;
    border: 1px solid #705b33;
    border-radius: 9px;
    display: grid;
    grid-template-columns: minmax(110px,1fr) auto;
    gap: 5px 10px;
    align-items: center;
    background: rgba(13,24,41,.54);
}
.analytics-rank-row-v4 b { color: #ece6f5; }
.analytics-rank-row-v4 .analytics-rank-bar-v4 { grid-column: 1 / 2; }
.analytics-rank-row-v4 > small { grid-column: 2; text-align: left; }
.analytics-version-row-v4 > span:first-child strong { font-size: 14px; }

.analytics-lower-grid-v4 {
    margin-bottom: 14px;
    display: grid;
    grid-template-columns: minmax(0, 1.8fr) minmax(330px, .85fr);
    gap: 14px;
    align-items: stretch;
}
.analytics-lower-grid-v4 > .panel { margin-bottom: 0; }
.analytics-chart-panel-v4 { min-height: 310px; }
.analytics-line-chart-v4 { height: 245px; }
.analytics-line-chart-v4 svg { height: 205px; }
.analytics-line-chart-v4 .chart-labels { gap: 5px; font-size: 10px; }
.analytics-license-panel-v4 { min-height: 310px; }
.analytics-license-layout-v4 {
    min-height: 225px;
    display: grid;
    grid-template-columns: 160px minmax(0,1fr);
    align-items: center;
    gap: 18px;
}
.analytics-donut-v4 {
    width: 150px;
    aspect-ratio: 1;
    margin: 0 auto;
    border-radius: 50%;
    display: grid;
    place-items: center;
    position: relative;
    background: conic-gradient(var(--doma-donut));
    box-shadow: 0 0 30px rgba(184,138,53,.12);
}
.analytics-donut-v4::after {
    content: "";
    width: 103px;
    aspect-ratio: 1;
    border: 1px solid #2b384c;
    border-radius: 50%;
    position: absolute;
    background: #0d1829;
}
.analytics-donut-v4 > span { z-index: 1; text-align: center; }
.analytics-donut-v4 strong { display: block; font-size: 26px; }
.analytics-donut-v4 small { font-size: 11px; }
.analytics-license-legend-v4 { display: grid; gap: 7px; }
.analytics-license-legend-v4 > div {
    min-height: 34px;
    padding: 6px 8px;
    border-bottom: 1px solid #1e2b3d;
    display: grid;
    grid-template-columns: 1fr 44px 45px;
    align-items: center;
    gap: 8px;
}
.analytics-license-legend-v4 > div:last-child { border-bottom: 0; }
.analytics-license-legend-v4 > div > span { display: flex; align-items: center; gap: 7px; font-size: 12px; }
.analytics-license-legend-v4 i { width: 9px; height: 9px; border-radius: 3px; display: inline-block; }
.analytics-license-legend-v4 b { text-align: center; }
.analytics-license-legend-v4 small { text-align: left; }

.analytics-recent-panel-v4 { border-radius: 14px; }
.analytics-recent-table-v4 { min-width: 1280px; }
.analytics-recent-table-v4 td { vertical-align: middle; }
.analytics-recent-table-v4 td:nth-child(2) { min-width: 245px; }
.analytics-recent-table-v4 td:nth-child(2) strong { display: block; color: #fff; font-size: 14px; }

@media (max-width: 1550px) {
    .analytics-metric-grid-v4 { grid-template-columns: repeat(3,minmax(0,1fr)); }
    .analytics-insights-grid-v4 { grid-template-columns: minmax(0,1.4fr) minmax(280px,.9fr); }
    .analytics-insights-grid-v4 > :last-child { grid-column: 1 / -1; }
    .device-facts-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .device-facts-grid > div:nth-child(3n) { border-left: 1px solid #1e2b3d; }
    .device-facts-grid > div:nth-child(2n) { border-left: 0; }
    .device-facts-grid > div:nth-last-child(-n+3) { border-bottom: 1px solid #1e2b3d; }
    .device-facts-grid > div:nth-last-child(-n+2) { border-bottom: 0; }
}
@media (max-width: 1180px) {
    .device-profile-grid-v4,
    .analytics-lower-grid-v4 { grid-template-columns: 1fr; }
    .analytics-platform-summary-v4 { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .analytics-insights-grid-v4 { grid-template-columns: 1fr; }
    .analytics-insights-grid-v4 > :last-child { grid-column: auto; }
}
@media (max-width: 760px) {
    .analytics-hero-v4 { grid-template-columns: 42px 1fr; }
    .analytics-hero-action { grid-column: 1 / -1; width: 100%; }
    .analytics-metric-grid-v4,
    .analytics-platform-summary-v4 { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .device-identity-strip,
    .device-facts-grid,
    .license-overview-grid { grid-template-columns: 1fr; }
    .device-identity-strip > div + div { border-right: 0; border-top: 1px solid #705b33; }
    .device-facts-grid > div,
    .device-facts-grid > div:nth-child(2n),
    .device-facts-grid > div:nth-child(3n) { border-left: 0; border-bottom: 1px solid #1e2b3d; }
    .device-facts-grid > div:last-child { border-bottom: 0; }
    .license-overview-item,
    .license-overview-item:nth-child(2n) { border-left: 0; border-bottom: 1px solid #1e2b3d; }
    .license-overview-wide { grid-column: auto; border-bottom: 0; }
    .analytics-license-layout-v4 { grid-template-columns: 1fr; }
    .analytics-country-row-v4 { grid-template-columns: 30px minmax(0,1fr) 58px; }
    .analytics-country-bar-v4 { grid-column: 2 / -1; }
}
@media (max-width: 520px) {
    .analytics-metric-grid-v4,
    .analytics-platform-summary-v4 { grid-template-columns: 1fr; }
}

/* Update 09 — Premium overview matching the approved analytics composition. */
.overview-hero-v5 { margin-bottom: 14px; }
.overview-metric-grid-v5,
.overview-platform-summary-v5 { margin-bottom: 14px; }

/* Force physical placement regardless of RTL auto-placement:
   COUNTRIES (left) | PLATFORMS (center) | VERSIONS (right). */
.overview-insights-grid-v5 {
    margin-bottom: 14px;
    display: grid;
    direction: ltr;
    grid-template-columns: minmax(420px, 1.38fr) minmax(290px, .88fr) minmax(290px, .88fr);
    grid-template-areas: "countries platforms versions";
    gap: 14px;
    align-items: stretch;
}
.overview-insights-grid-v5 > * { direction: rtl; margin-bottom: 0; }
.overview-countries-v5 { grid-area: countries; min-height: 300px; }
.overview-platforms-v5 { grid-area: platforms; min-height: 300px; }
.overview-versions-v5 { grid-area: versions; min-height: 300px; }
.overview-country-list-v5 { max-height: 365px; }
.overview-country-row-v5 { min-height: 52px; }

.overview-lower-grid-v5 {
    margin-bottom: 14px;
    display: grid;
    direction: ltr;
    grid-template-columns: minmax(0, 1.55fr) minmax(390px, .95fr);
    grid-template-areas: "chart licenses";
    gap: 14px;
    align-items: stretch;
}
.overview-lower-grid-v5 > * { direction: rtl; margin-bottom: 0; }
.overview-chart-v5 { grid-area: chart; }
.overview-licenses-v5 { grid-area: licenses; }
.overview-recent-v5 { margin-bottom: 14px; }

.overview-platform-icon-only {
    overflow: hidden;
    display: grid;
    place-items: center;
}
.overview-platform-icon-only .platform-badge {
    width: 24px !important;
    height: 24px !important;
    display: grid !important;
    place-items: center !important;
    padding: 0 !important;
    margin: 0 !important;
}
.overview-platform-icon-only .platform-badge > span { display: none !important; }
.overview-platform-icon-only .platform-badge svg {
    width: 23px !important;
    height: 23px !important;
    min-width: 23px !important;
    max-width: 23px !important;
    max-height: 23px !important;
}
.overview-recent-table-v5 td:nth-child(2) { min-width: 260px; }
.overview-recent-table-v5 td:nth-child(2) small { display: block; margin-top: 5px; color: #aebbcc; }

@media (max-width: 1480px) {
    .overview-insights-grid-v5 {
        grid-template-columns: minmax(0, 1.25fr) minmax(270px, .85fr);
        grid-template-areas:
            "countries platforms"
            "countries versions";
    }
    .overview-countries-v5 { min-height: 610px; }
}
@media (max-width: 1120px) {
    .overview-insights-grid-v5 {
        direction: rtl;
        grid-template-columns: 1fr;
        grid-template-areas: "countries" "platforms" "versions";
    }
    .overview-countries-v5 { min-height: 0; }
    .overview-lower-grid-v5 {
        direction: rtl;
        grid-template-columns: 1fr;
        grid-template-areas: "chart" "licenses";
    }
}

/* ========================================================================
   UPDATE 10 — exact premium shell + approved Overview / Device composition
   ======================================================================== */
:root {
    --doma-v10-bg: #0d1829;
    --doma-v10-panel: #172336;
    --doma-v10-panel-2: #172336;
    --doma-v10-line: rgba(155,117,43,.48);
    --doma-v10-line-soft: rgba(155,117,43,.34);
    --doma-v10-purple: #9b752b;
    --doma-v10-purple-2: #9b752b;
    --doma-v10-text: #f8f6ff;
    --doma-v10-muted: #5e6f86;
    --doma-v10-green: #24e1a0;
}

html { background: var(--doma-v10-bg); }
body {
    background:
        radial-gradient(circle at 74% -14%, rgba(143,105,36,.17), transparent 36%),
        radial-gradient(circle at 10% 72%, rgba(127,93,31,.08), transparent 35%),
        #0d1829 !important;
    color: var(--doma-v10-text);
}

.sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0,0,0,0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

/* The approved mockup is a full-width app shell. Navigation remains available
   as an off-canvas drawer opened from the DOMA brand. */
.sidebar {
    width: 268px !important;
    padding: 20px 16px 16px !important;
    transform: translateX(110%) !important;
    transition: transform .22s ease !important;
    border-left: 1px solid #705b33 !important;
    background: linear-gradient(180deg,#0d1829 0%,#0d1829 100%) !important;
    box-shadow: -28px 0 80px rgba(0,0,0,.46) !important;
}
.menu-open .sidebar { transform: translateX(0) !important; }
.sidebar-backdrop {
    display: block !important;
    position: fixed !important;
    z-index: 45 !important;
    inset: 0 !important;
    opacity: 0 !important;
    pointer-events: none !important;
    background: rgba(13,24,41,.70) !important;
    backdrop-filter: blur(3px);
    transition: opacity .2s ease;
}
.menu-open .sidebar-backdrop { opacity: 1 !important; pointer-events: auto !important; }
.mobile-menu { display: none !important; }

.workspace {
    max-width: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 8px 20px 14px !important;
}

.topbar.premium-shellbar {
    min-height: 60px !important;
    margin: 0 0 12px !important;
    padding: 0 5px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 18px !important;
}
.premium-brand {
    appearance: none;
    border: 0;
    padding: 0;
    display: inline-flex;
    align-items: center;
    gap: 12px;
    background: transparent;
    color: #fff;
    cursor: pointer;
    text-align: right;
}
.premium-brand-copy { display: grid; gap: 0; line-height: 1.15; }
.premium-brand-copy strong { color: #f8f7ff; font-size: 22px; font-weight: 800; letter-spacing: -.2px; }
.premium-brand-copy small { color: #d8b45e; font-size: 16px; font-weight: 700; }
.premium-brand-mark {
    width: 48px;
    height: 52px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(164,132,62,.55);
    border-radius: 12px;
    background:
        radial-gradient(circle at 35% 30%, rgba(255,255,255,.20), transparent 28%),
        linear-gradient(145deg,#8f6924,#8f6924 65%,#7f5d1f);
    box-shadow: 0 0 28px rgba(184,138,53,.30), inset 0 0 18px rgba(255,255,255,.08);
    color: #fff;
    font-size: 25px;
    line-height: 1;
}
.premium-shell-meta {
    display: flex;
    align-items: center;
    gap: 14px;
    direction: ltr;
}
.premium-shell-time {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #aebbcc;
    font-size: 13px;
    direction: ltr;
}
.premium-clock { color: #d8b45e; font-size: 20px; }
.premium-health-pill {
    min-height: 34px;
    padding: 6px 12px;
    border: 1px solid #1c8e68;
    border-radius: 7px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    background: rgba(21,96,72,.16);
    color: #5ee6b3;
    font-size: 13px;
    font-weight: 700;
    direction: rtl;
}
.premium-shell-meta .button { min-height: 34px; }

footer {
    margin-top: 16px !important;
    padding: 10px 0 2px !important;
    border-top: 0 !important;
    color: #aebbcc !important;
    text-align: center !important;
    font-size: 12px !important;
}

/* Global material language from the approved mockups. */
.panel {
    border: 1px solid var(--doma-v10-line) !important;
    border-radius: 14px !important;
    background:
        radial-gradient(circle at 92% 0%, rgba(127,93,31,.07), transparent 35%),
        linear-gradient(145deg,rgba(23,35,54,.985),rgba(13,24,41,.985)) !important;
    box-shadow: 0 14px 42px rgba(0,0,0,.13) !important;
}
.button {
    border-radius: 7px !important;
    font-weight: 700 !important;
}
.button.primary {
    border-color: #a4843e !important;
    background: linear-gradient(135deg,#8f6924,#8f6924) !important;
    box-shadow: 0 0 18px rgba(184,138,53,.16);
}
.table-wrap { border-color: rgba(164,132,62,.44) !important; border-radius: 11px !important; }
th { background: rgba(23,35,54,.84) !important; color: #aebbcc !important; }
td { background: rgba(13,24,41,.30); }

/* Inline SVG primitives used by the new premium surfaces. */
.premium-overview-hero-icon-v10 svg,
.premium-overview-action-v10 svg,
.premium-metric-icon-v10 svg,
.premium-heading-icon-v10 svg,
.device-hero-icon-v10 svg,
.device-section-icon-v10 svg,
.fact-icon-v10 > svg,
.license-main-badge-v10 > span svg,
.license-cell-icon-v10 svg {
    width: 100%;
    height: 100%;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* ------------------------------------------------------------------------
   Overview — matches the approved dashboard composition.
   ------------------------------------------------------------------------ */
.premium-overview-hero-v10 {
    min-height: 88px;
    margin-bottom: 12px !important;
    padding: 18px 20px !important;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    border-color: #a4843e !important;
    background:
        radial-gradient(circle at 86% 20%, rgba(127,93,31,.14), transparent 33%),
        linear-gradient(115deg,rgba(23,35,54,.98),rgba(13,24,41,.98)) !important;
}
.premium-overview-copy-v10 { display: flex; align-items: center; gap: 14px; }
.premium-overview-hero-icon-v10 {
    width: 43px;
    height: 43px;
    flex: 0 0 43px;
    padding: 10px;
    border: 1px solid #a4843e;
    border-radius: 10px;
    background: linear-gradient(145deg,rgba(143,105,36,.40),rgba(43,56,76,.62));
    color: #d8b45e;
}
.premium-overview-copy-v10 h2 { margin: 0 0 3px; color: #fff; font-size: 22px; font-weight: 800; }
.premium-overview-copy-v10 p { margin: 0; color: #aebbcc; font-size: 13px; }
.premium-overview-action-v10 {
    min-width: 180px;
    min-height: 46px;
    padding: 9px 17px;
    border: 1px solid #a4843e;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background: linear-gradient(135deg,rgba(143,105,36,.70),rgba(127,93,31,.72));
    box-shadow: inset 0 0 20px rgba(255,255,255,.035), 0 0 22px rgba(184,138,53,.12);
    color: #d5dde9;
    font-size: 11.5px;
    font-weight: 800;
}
.premium-overview-action-v10 svg { width: 20px; height: 20px; }

.premium-metrics-v10 {
    margin-bottom: 12px;
    display: grid;
    grid-template-columns: repeat(6,minmax(0,1fr));
    gap: 10px;
}
.premium-metric-card-v10 {
    min-height: 100px;
    padding: 13px 14px;
    border: 1px solid rgba(164,132,62,.60);
    border-radius: 11px;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    background: linear-gradient(145deg,rgba(23,35,54,.96),rgba(13,24,41,.98));
}
.premium-metric-icon-v10 {
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    padding: 9px;
    border: 1px solid currentColor;
    border-radius: 9px;
    background: color-mix(in srgb, currentColor 13%, transparent);
}
.premium-metric-copy-v10 { min-width: 0; flex: 1; }
.premium-metric-copy-v10 small { display: block; color: #d5dde9; font-size: 10.5px; font-weight: 700; }
.premium-metric-copy-v10 strong { display: block; margin: 6px 0 2px; color: #fff; font-size: 25px; line-height: 1; }
.premium-metric-copy-v10 p { margin: 0; color: #aebbcc; font-size: 9.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.premium-metric-card-v10.tone-purple { color: #d8b45e; }
.premium-metric-card-v10.tone-red { color: #ff5474; }
.premium-metric-card-v10.tone-blue { color: #1f8fff; }
.premium-metric-card-v10.tone-pink { color: #d8b45e; }
.premium-metric-card-v10.tone-violet { color: #d8b45e; }
.premium-metric-card-v10.tone-cyan { color: #37e1de; }

.premium-platform-summary-v10 {
    margin-bottom: 12px;
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 10px;
}
.premium-platform-card-v10 {
    min-height: 96px;
    padding: 14px 16px;
    border: 1px solid rgba(164,132,62,.60);
    border-radius: 11px;
    display: flex;
    align-items: center;
    gap: 14px;
    background: linear-gradient(145deg,rgba(23,35,54,.96),rgba(13,24,41,.98));
}
.premium-platform-icon-v10 {
    width: 48px;
    height: 48px;
    flex: 0 0 48px;
    border: 1px solid rgba(164,132,62,.56);
    border-radius: 10px;
    display: grid;
    place-items: center;
    background: rgba(127,93,31,.18);
}
.premium-platform-icon-v10 .platform-badge { width: 30px !important; height: 30px !important; display: grid !important; place-items: center !important; }
.premium-platform-icon-v10 .platform-badge > span { display: none !important; }
.premium-platform-icon-v10 .platform-badge svg { width: 26px !important; height: 26px !important; max-width: 26px !important; max-height: 26px !important; flex: 0 0 26px !important; }
.premium-platform-card-v10 small { color: #d5dde9; font-size: 13px; font-weight: 700; }
.premium-platform-card-v10 strong { display: block; margin: 3px 0; color: #fff; font-size: 24px; line-height: 1.1; }
.premium-platform-card-v10 p { margin: 0; color: #aebbcc; font-size: 12px; }
.platform-tone-windows .premium-platform-icon-v10 { color:#3ea7ff; background:rgba(21,102,179,.20); }
.platform-tone-ios .premium-platform-icon-v10 { color:#fff; background:rgba(127,93,31,.26); }
.platform-tone-android .premium-platform-icon-v10 { color:#35df91; background:rgba(25,129,89,.22); }
.platform-tone-tv .premium-platform-icon-v10 { color:#d8b45e; background:rgba(127,93,31,.23); }

.premium-overview-insights-v10 {
    margin-bottom: 12px;
    display: grid;
    direction: ltr;
    grid-template-columns: minmax(480px,1.15fr) minmax(320px,.72fr) minmax(320px,.72fr);
    grid-template-areas: "countries platforms versions";
    gap: 10px;
    align-items: stretch;
}
.premium-overview-insights-v10 > * { direction: rtl; margin: 0 !important; }
.premium-countries-v10 { grid-area: countries; min-height: 220px; }
.premium-platforms-rank-v10 { grid-area: platforms; min-height: 220px; }
.premium-versions-rank-v10 { grid-area: versions; min-height: 220px; }
.premium-panel-heading-v10 {
    min-height: 42px;
    margin-bottom: 12px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}
.premium-heading-title-v10 { display: flex; align-items: flex-start; gap: 10px; }
.premium-heading-title-v10 h2 { margin: 0 0 2px; color: #fff; font-size: 18px; font-weight: 800; }
.premium-heading-title-v10 p { margin: 0; color: #aebbcc; font-size: 9.5px; }
.premium-heading-icon-v10 {
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    padding: 8px;
    border: 1px solid #a4843e;
    border-radius: 8px;
    background: rgba(127,93,31,.22);
    color: #d8b45e;
}
.premium-heading-icon-v10.green { color:#25dc9d; background:rgba(27,116,86,.22); border-color:#25684f; }
.premium-heading-icon-v10.blue { color:#35a5ff; background:rgba(25,86,145,.22); border-color:#2c547b; }
.premium-heading-icon-v10.amber { color:#ffb260; background:rgba(123,69,30,.22); border-color:#704a29; }
.premium-small-action-v10,
.premium-period-v10 {
    min-height: 31px;
    padding: 5px 10px;
    border: 1px solid #a4843e;
    border-radius: 7px;
    display: inline-flex;
    align-items: center;
    color: #d8b45e;
    background: rgba(127,93,31,.18);
    font-size: 9.5px;
    font-weight: 700;
    white-space: nowrap;
}
.premium-small-action-v10.green { color:#44deb0; border-color:#237657; background:rgba(27,110,81,.18); }

.premium-country-list-v10 { display: grid; gap: 7px; }
.premium-country-row-v10 {
    min-height: 44px;
    padding: 6px 8px;
    display: grid;
    grid-template-columns: 34px minmax(100px,.75fr) minmax(120px,1fr) 42px;
    align-items: center;
    gap: 8px;
    border-bottom: 1px solid rgba(112,91,51,.38);
}
.premium-country-row-v10:last-child { border-bottom: 0; }
.premium-country-flag-v10 { font-size: 21px; text-align: center; }
.premium-country-name-v10 strong { display:block; color:#fff; font-size:13px; }
.premium-country-name-v10 small { display:block; margin-top:1px; color:#aebbcc; font-size:10px; }
.premium-country-track-v10,
.premium-rank-track-v10 { height: 8px; display:block; overflow:hidden; border-radius:2px; background:#1e2b3d; }
.premium-country-track-v10 i,
.premium-rank-track-v10 i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#8f6924,#8f6924); }
.premium-country-count-v10 { color:#eee8f7; font-size:15px; text-align:center; }
.premium-empty-v10 { min-height:145px; display:grid; place-items:center; align-content:center; text-align:center; color:#aebbcc; }
.premium-empty-v10 span { font-size:28px; }
.premium-empty-v10 strong { margin-top:5px; color:#d6d0df; }
.premium-empty-v10 p { margin:3px 0 0; font-size:11px; }

.premium-rank-list-v10 { display:grid; gap:8px; }
.premium-rank-row-v10 {
    min-height: 54px;
    padding: 8px 10px;
    border-bottom: 1px solid rgba(112,91,51,.38);
    display:grid;
    grid-template-columns:minmax(100px,1fr) 40px;
    gap:5px 10px;
    align-items:center;
}
.premium-rank-row-v10:last-child { border-bottom:0; }
.premium-rank-label-v10 { min-width:0; }
.premium-rank-label-v10 .platform-badge { font-size:10.5px !important; }
.premium-rank-row-v10 > strong { color:#f3edf9; font-size:13px; text-align:left; }
.premium-rank-row-v10 .premium-rank-track-v10 { grid-column:1; }
.premium-rank-row-v10 > small { grid-column:2; color:#d8b45e; font-size:11px; text-align:left; }
.premium-version-row-v10 .premium-rank-label-v10 strong { color:#fff; font-size:12px; }

.premium-overview-lower-v10 {
    margin-bottom: 12px;
    display:grid;
    direction:ltr;
    grid-template-columns:minmax(0,1.35fr) minmax(450px,1fr);
    grid-template-areas:"chart license";
    gap:10px;
    align-items:stretch;
}
.premium-overview-lower-v10 > * { direction:rtl; margin:0 !important; }
.premium-chart-panel-v10 { grid-area:chart; min-height:280px; }
.premium-license-panel-v10 { grid-area:license; min-height:280px; }
.premium-line-chart-v10 { height:210px !important; }
.premium-line-chart-v10 svg { height:175px !important; }
.premium-line-chart-v10 .chart-labels { font-size:10px; }
.premium-license-layout-v10 {
    min-height:190px;
    display:grid;
    grid-template-columns:150px minmax(0,1fr);
    align-items:center;
    gap:18px;
}
.premium-donut-v10 {
    width:140px;
    aspect-ratio:1;
    margin:0 auto;
    border-radius:50%;
    display:grid;
    place-items:center;
    position:relative;
    background:conic-gradient(var(--doma-donut));
    box-shadow:0 0 30px rgba(184,138,53,.12);
}
.premium-donut-v10::after { content:""; width:96px; aspect-ratio:1; position:absolute; border-radius:50%; background:#0d1829; border:1px solid #705b33; }
.premium-donut-v10 > span { z-index:1; text-align:center; }
.premium-donut-v10 strong { display:block; color:#fff; font-size:24px; }
.premium-donut-v10 small { color:#aebbcc; font-size:10px; }
.premium-license-legend-v10 { display:grid; gap:2px; }
.premium-license-legend-v10 > div { min-height:32px; padding:5px 7px; border-bottom:1px solid rgba(112,91,51,.50); display:grid; grid-template-columns:1fr 38px 42px; align-items:center; gap:7px; }
.premium-license-legend-v10 > div:last-child { border-bottom:0; }
.premium-license-legend-v10 span { display:flex; align-items:center; gap:7px; color:#d5dde9; font-size:9.5px; }
.premium-license-legend-v10 i { width:9px; height:9px; border-radius:3px; }
.premium-license-legend-v10 b { color:#fff; text-align:center; font-size:12px; }
.premium-license-legend-v10 small { color:#aebbcc; text-align:left; font-size:11px; }

.premium-recent-v10 { margin-bottom:10px !important; }
.premium-recent-table-wrap-v10 { overflow:auto; }
.premium-recent-table-v10 { min-width:1200px; }
.premium-recent-table-v10 th { padding:10px 11px; font-size:11px; text-align:center; }
.premium-recent-table-v10 td { padding:11px; text-align:center; vertical-align:middle; }
.premium-recent-table-v10 td:nth-child(2) { min-width:240px; text-align:right; }
.premium-recent-table-v10 td:nth-child(2) strong { display:block; color:#fff; font-size:13px; }
.premium-recent-table-v10 td:nth-child(2) small { display:block; margin-top:3px; color:#aebbcc; font-size:8.5px; }
.premium-table-action-v10 { min-width:56px; min-height:28px; padding:4px 10px; border:1px solid #a4843e; border-radius:6px; display:inline-grid; place-items:center; color:#d8b45e; background:rgba(127,93,31,.18); font-size:11px; font-weight:700; }

/* ------------------------------------------------------------------------
   Device details — exact two-panel composition from the approved mockup.
   ------------------------------------------------------------------------ */
.device-hero-v10 {
    min-height: 138px;
    margin-bottom: 20px;
    padding: 22px 28px;
    border: 1px solid #a4843e;
    border-radius: 20px;
    display: flex;
    direction: rtl;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    background:
        radial-gradient(circle at 8% 110%,rgba(143,105,36,.36),transparent 35%),
        radial-gradient(circle at 76% 0%,rgba(127,93,31,.16),transparent 34%),
        linear-gradient(110deg,#172336 0%,#172336 45%,#172336 100%);
    box-shadow: 0 0 30px rgba(184,138,53,.12), inset 0 1px 0 rgba(255,255,255,.025);
}
.device-hero-identity-v10 { display:flex; align-items:center; gap:18px; min-width:0; }
.device-hero-icon-v10 {
    width: 58px;
    height: 58px;
    flex:0 0 58px;
    padding:15px;
    border:1px solid #a4843e;
    border-radius:13px;
    background:linear-gradient(145deg,rgba(127,93,31,.42),rgba(43,56,76,.67));
    color:#d8b45e;
    box-shadow:0 0 25px rgba(184,138,53,.15);
}
.device-number-v10 { display:block; margin-bottom:2px; color:#d8b45e; font-size:12px; font-weight:800; direction:ltr; text-align:right; }
.device-hero-identity-v10 h2 { margin:0 0 7px; color:#fff; font-size:30px; line-height:1.1; font-weight:800; }
.device-hero-identity-v10 p { margin:0; display:flex; align-items:center; gap:13px; color:#aebbcc; font-size:16px; }
.device-hero-identity-v10 p > i { width:1px; height:18px; background:#7f5d1f; }
.device-hero-identity-v10 .platform-badge { font-size:15px !important; }
.device-hero-identity-v10 .platform-badge svg { width:19px !important; height:19px !important; flex-basis:19px !important; }
.device-hero-status-v10 { display:flex; direction:ltr; align-items:center; gap:22px; }
.device-status-pill-v10,
.device-presence-v10 { direction:rtl; display:inline-flex; align-items:center; gap:9px; white-space:nowrap; }
.device-status-pill-v10 {
    min-height:44px;
    padding:8px 18px;
    border:1px solid #1f9f70;
    border-radius:13px;
    background:rgba(18,119,80,.18);
    color:#4aefb2;
    box-shadow:0 0 22px rgba(38,216,151,.13);
    font-size:16px;
    font-weight:800;
}
.device-status-pill-v10 > i,
.device-presence-v10 > i { width:9px; height:9px; border-radius:50%; display:block; }
.device-status-pill-v10.status-active > i { background:#2fe9aa; box-shadow:0 0 10px rgba(47,233,170,.55); }
.device-status-pill-v10.status-suspended { color:#ffc36f; border-color:#9d6829; background:rgba(128,78,23,.20); }
.device-status-pill-v10.status-suspended > i { background:#ffb650; }
.device-status-pill-v10.status-blocked { color:#ff728a; border-color:#9a3b51; background:rgba(125,35,55,.20); }
.device-status-pill-v10.status-blocked > i { background:#ff5e77; }
.device-presence-v10 { color:#aebbcc; font-size:15px; }
.device-presence-v10 > i { width:8px; height:8px; background:#7f5d1f; }
.device-presence-v10.online { color:#41dca7; }
.device-presence-v10.online > i { background:#36e3aa; box-shadow:0 0 8px rgba(54,227,170,.45); }

.device-profile-grid-v10 {
    margin-bottom:20px;
    display:grid;
    direction:ltr;
    grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);
    grid-template-areas:"info license";
    gap:22px;
    align-items:stretch;
}
.device-profile-grid-v10 > * { direction:rtl; margin:0 !important; }
.device-information-v10 { grid-area:info; padding:30px 30px 26px !important; border-radius:20px !important; }
.license-summary-v10 { grid-area:license; padding:30px 30px 26px !important; border-radius:20px !important; }
.device-section-heading-v10 {
    min-height:64px;
    margin-bottom:18px;
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
}
.device-section-heading-v10 h2 { margin:0 0 4px; color:#fff; font-size:25px; font-weight:800; }
.device-section-heading-v10 p { margin:0; color:#aebbcc; font-size:14px; }
.device-section-icon-v10 {
    width:56px;
    height:56px;
    flex:0 0 56px;
    padding:15px;
    border:1px solid #a4843e;
    border-radius:13px;
    display:grid;
    place-items:center;
    background:linear-gradient(145deg,rgba(127,93,31,.35),rgba(43,56,76,.55));
    color:#d8b45e;
}
.device-identity-strip-v10 {
    min-height:98px;
    margin-bottom:18px;
    border:1px solid #a4843e;
    border-radius:13px;
    overflow:hidden;
    display:grid;
    grid-template-columns:minmax(0,1.35fr) minmax(280px,.82fr);
    background:linear-gradient(120deg,rgba(127,93,31,.24),rgba(13,24,41,.72));
}
.device-identity-strip-v10 > div {
    min-width:0;
    padding:18px 22px;
    position:relative;
    display:grid;
    align-content:center;
}
.device-identity-strip-v10 > div + div { border-right:1px solid #705b33; }
.device-identity-strip-v10 small { margin-bottom:5px; color:#aebbcc; font-size:14px; }
.device-identity-strip-v10 strong { color:#fff; font-size:21px; font-weight:800; overflow-wrap:anywhere; }
.device-identity-strip-v10 .device-identity-mac-v10 strong { font-size:16px; font-weight:600; }
.fact-icon-v10 {
    width:25px;
    height:25px;
    position:absolute;
    top:50%;
    left:18px;
    transform:translateY(-50%);
    color:#d8b45e;
}
.platform-fact-v10 { width:27px; height:27px; display:grid; place-items:center; }
.platform-fact-v10 .platform-badge { width:26px !important; height:26px !important; display:grid !important; place-items:center !important; }
.platform-fact-v10 .platform-badge > span { display:none !important; }
.platform-fact-v10 .platform-badge svg { width:22px !important; height:22px !important; max-width:22px !important; max-height:22px !important; flex-basis:22px !important; }
.device-facts-v10 {
    margin:0;
    border:1px solid #705b33;
    border-radius:13px;
    overflow:hidden;
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
}
.device-facts-v10 > div {
    min-height:82px;
    padding:14px 48px 13px 18px;
    position:relative;
    border-left:1px solid #705b33;
    border-bottom:1px solid #705b33;
    display:grid;
    align-content:center;
    background:rgba(13,24,41,.32);
}
.device-facts-v10 > div:nth-child(3n) { border-left:0; }
.device-facts-v10 > div:nth-last-child(-n+3) { border-bottom:0; }
.device-facts-v10 dt { margin:0 0 5px; color:#aebbcc; font-size:13px; font-weight:500; }
.device-facts-v10 dd { margin:0; color:#f5f2fa; font-size:12.5px; font-weight:800; overflow-wrap:anywhere; }
.device-facts-v10 .country-inline { display:inline-flex; align-items:center; gap:7px; }
.device-facts-v10 .country-inline strong { font-size:12.5px; }
.device-facts-v10 .country-inline small { color:#fff; font-size:14px; font-weight:700; }

.license-heading-v10 { margin-bottom:4px; }
.license-main-badge-v10 {
    width:max-content;
    max-width:100%;
    min-height:55px;
    margin:0 auto 20px 0;
    padding:10px 18px;
    border:1px solid #13ba79;
    border-radius:13px;
    display:inline-flex;
    align-items:center;
    gap:11px;
    background:rgba(17,102,73,.14);
    color:#2ce6a2;
    box-shadow:0 0 24px rgba(37,217,151,.08);
}
.license-main-badge-v10 > span { width:27px; height:27px; }
.license-main-badge-v10 strong { color:inherit; font-size:18px; font-weight:800; white-space:nowrap; }
.license-main-badge-v10.is-expired { color:#ff7188; border-color:#9c3c51; background:rgba(118,34,53,.15); }
.license-grid-v10 {
    min-height:395px;
    border:1px solid #705b33;
    border-radius:15px;
    overflow:hidden;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
}
.license-cell-v10 {
    min-height:130px;
    padding:22px 58px 20px 20px;
    position:relative;
    border-left:1px solid #705b33;
    border-bottom:1px solid #705b33;
    display:grid;
    align-content:center;
    background:rgba(13,24,41,.24);
}
.license-cell-v10:nth-child(2n) { border-left:0; }
.license-cell-v10:nth-last-child(-n+2) { border-bottom:0; }
.license-cell-icon-v10 {
    width:29px;
    height:29px;
    position:absolute;
    right:20px;
    top:25px;
    color:#d8b45e;
}
.license-cell-icon-v10.success {
    width:36px;
    height:36px;
    padding:8px;
    border-radius:50%;
    background:#2de3a4;
    color:#09281e;
}
.license-cell-v10 small { margin-bottom:8px; color:#aebbcc; font-size:14px; }
.license-cell-v10 strong { color:#fff; font-size:16px; font-weight:800; overflow-wrap:anywhere; }
.license-cell-v10 strong.positive { color:#27e39f; font-size:22px; }
.license-cell-v10 strong.negative { color:#ff6c83; font-size:20px; }
.license-separation-note-v10 {
    margin:14px 0 0;
    padding:9px 12px;
    border:1px solid #a4843e;
    border-radius:8px;
    background:rgba(127,93,31,.14);
    color:#aebbcc;
    font-size:10.5px;
}
.license-separation-note-v10 strong { color:#fff; }

/* Other system surfaces inherit the same spacing and type scale. */
.page-intro,
.hero:not(.device-hero) { border-radius:14px !important; }
.section-heading h2 { font-size:18px; }
.section-heading p { font-size:10.5px; }

@media (max-width: 1500px) {
    .premium-metrics-v10 { grid-template-columns:repeat(3,minmax(0,1fr)); }
    .premium-overview-insights-v10 { grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr); grid-template-areas:"countries platforms" "countries versions"; }
    .premium-countries-v10 { min-height:460px; }
    .device-profile-grid-v10 { grid-template-columns:1fr; grid-template-areas:"info" "license"; }
}
@media (max-width: 1120px) {
    .premium-platform-summary-v10 { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .premium-overview-insights-v10 { direction:rtl; grid-template-columns:1fr; grid-template-areas:"countries" "platforms" "versions"; }
    .premium-countries-v10 { min-height:0; }
    .premium-overview-lower-v10 { direction:rtl; grid-template-columns:1fr; grid-template-areas:"chart" "license"; }
    .device-hero-v10 { align-items:flex-start; flex-direction:column; }
    .device-hero-status-v10 { width:100%; justify-content:flex-start; }
}
@media (max-width: 760px) {
    .workspace { padding:8px 10px 12px !important; }
    .premium-brand-copy strong { font-size:18px; }
    .premium-brand-copy small { font-size:13px; }
    .premium-brand-mark { width:40px; height:43px; }
    .premium-shell-time { display:none; }
    .premium-health-pill { font-size:11px; padding:5px 8px; }
    .premium-overview-hero-v10 { align-items:stretch; flex-direction:column; }
    .premium-overview-action-v10 { width:100%; }
    .premium-metrics-v10,
    .premium-platform-summary-v10 { grid-template-columns:1fr 1fr; }
    .premium-license-layout-v10 { grid-template-columns:1fr; }
    .device-hero-v10 { padding:18px; border-radius:14px; }
    .device-hero-identity-v10 h2 { font-size:24px; }
    .device-hero-icon-v10 { width:48px; height:48px; flex-basis:48px; padding:12px; }
    .device-information-v10,
    .license-summary-v10 { padding:18px !important; border-radius:14px !important; }
    .device-section-heading-v10 h2 { font-size:22px; }
    .device-identity-strip-v10 { grid-template-columns:1fr; }
    .device-identity-strip-v10 > div + div { border-right:0; border-top:1px solid #705b33; }
    .device-facts-v10 { grid-template-columns:1fr; }
    .device-facts-v10 > div { border-left:0 !important; border-bottom:1px solid #705b33 !important; }
    .device-facts-v10 > div:last-child { border-bottom:0 !important; }
    .license-grid-v10 { grid-template-columns:1fr; }
    .license-cell-v10 { border-left:0 !important; border-bottom:1px solid #705b33 !important; }
    .license-cell-v10:last-child { border-bottom:0 !important; }
}
@media (max-width: 520px) {
    .premium-metrics-v10,
    .premium-platform-summary-v10 { grid-template-columns:1fr; }
    .premium-health-pill { display:none; }
    .device-hero-status-v10 { flex-wrap:wrap; gap:10px; }
}
.device-hero-icon-v10 {
    appearance: none;
    cursor: pointer;
}


/* ========================================================================== 
   UPDATE 11 — Restore the complete desktop navigation sidebar
   The premium pages remain intact, but the full Admin navigation must always
   be visible on desktop. On tablet/mobile it keeps the drawer behaviour.
   ========================================================================== */
@media (min-width: 901px) {
    .sidebar {
        width: 238px !important;
        padding: 20px 17px 16px !important;
        transform: none !important;
        transition: none !important;
        border-left: 1px solid #1e2b3d !important;
        background: linear-gradient(180deg,#0d1829 0%,#0d1829 100%) !important;
        box-shadow: -12px 0 38px rgba(0,0,0,.20) !important;
    }
    .menu-open .sidebar { transform: none !important; }
    .sidebar-backdrop,
    .menu-open .sidebar-backdrop {
        display: none !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }
    .workspace {
        width: auto !important;
        max-width: none !important;
        margin-right: 238px !important;
        padding: 12px 20px 14px !important;
    }
    .premium-brand[data-menu-toggle] {
        cursor: default !important;
    }
}

@media (min-width: 1700px) {
    .sidebar { width: 248px !important; }
    .workspace { margin-right: 248px !important; }
}

/* Mobile/tablet: navigation remains a real drawer. */
@media (max-width: 900px) {
    .sidebar {
        width: min(286px, 88vw) !important;
        transform: translateX(110%) !important;
        transition: transform .22s ease !important;
    }
    .menu-open .sidebar { transform: translateX(0) !important; }
    .sidebar-backdrop {
        display: block !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }
    .menu-open .sidebar-backdrop {
        opacity: 1 !important;
        pointer-events: auto !important;
    }
    .workspace {
        width: 100% !important;
        margin-right: 0 !important;
    }
    .premium-brand[data-menu-toggle] { cursor: pointer !important; }
}

/* ------------------------------------------------------------------------
   UPDATE 12 — Device information alignment + country flag + MAC badge
   Keeps every value aligned with its own label and removes icon/value clashes.
   ------------------------------------------------------------------------ */
.device-information-v10 .device-identity-strip-v10 > div {
    padding: 18px 62px 18px 22px !important;
    text-align: right;
}
.device-information-v10 .device-identity-strip-v10 .fact-icon-v10 {
    right: 20px !important;
    left: auto !important;
    width: 27px !important;
    height: 27px !important;
    color: #d8b45e;
}
.device-information-v10 .device-identity-strip-v10 small,
.device-information-v10 .device-identity-strip-v10 strong {
    display: block;
    width: 100%;
    text-align: right;
}
.device-information-v10 .device-identity-strip-v10 small {
    line-height: 1.35;
}
.device-information-v10 .device-identity-strip-v10 strong {
    line-height: 1.45;
}

.mac-green-badge-v12 {
    width: max-content !important;
    max-width: 100%;
    margin-top: 4px;
    padding: 7px 12px;
    border: 1px solid #1dbf83;
    border-radius: 9px;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    direction: ltr;
    background: linear-gradient(135deg, rgba(20,132,91,.22), rgba(11,79,58,.12));
    color: #4cf0b4 !important;
    box-shadow: 0 0 16px rgba(39,218,155,.10), inset 0 0 12px rgba(53,232,169,.035);
    font-size: 15px !important;
    font-weight: 800 !important;
    letter-spacing: .2px;
    white-space: nowrap;
}

.device-information-v10 .device-facts-v10 > div {
    min-height: 88px !important;
    padding: 15px 56px 14px 16px !important;
    display: grid !important;
    grid-template-rows: auto auto;
    align-content: center;
    justify-items: stretch;
    text-align: right;
}
.device-information-v10 .device-facts-v10 .fact-icon-v10 {
    right: 18px !important;
    left: auto !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 25px !important;
    height: 25px !important;
}
.device-information-v10 .device-facts-v10 dt,
.device-information-v10 .device-facts-v10 dd {
    width: 100%;
    min-width: 0;
    text-align: right;
}
.device-information-v10 .device-facts-v10 dt {
    margin: 0 0 7px !important;
    color: #aebbcc !important;
    font-size: 11.5px !important;
    line-height: 1.25;
}
.device-information-v10 .device-facts-v10 dd {
    margin: 0 !important;
    color: #f8f5fc !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    line-height: 1.35;
    overflow-wrap: anywhere;
}
.device-information-v10 .device-facts-v10 dd.mono {
    direction: ltr;
    unicode-bidi: isolate;
    text-align: right;
    font-variant-numeric: tabular-nums;
}
.device-information-v10 .device-facts-v10 .platform-fact-v10 {
    right: 17px !important;
    left: auto !important;
}
.device-information-v10 .device-facts-v10 .platform-fact-v10 .platform-badge {
    margin: 0 !important;
}

.country-inline-v12 {
    display: inline-flex !important;
    flex-wrap: wrap;
    align-items: center !important;
    justify-content: flex-start;
    gap: 7px !important;
    direction: rtl;
}
.country-flag-inline-v12 {
    display: inline-grid;
    place-items: center;
    width: 24px;
    height: 20px;
    flex: 0 0 auto;
    font-size: 20px !important;
    line-height: 1;
    filter: saturate(1.05);
}
.device-facts-v10 .country-inline-v12 strong {
    color: #fff;
    font-size: 15px !important;
    line-height: 1.25;
}
.device-facts-v10 .country-inline-v12 small {
    min-width: 26px;
    padding: 2px 5px;
    border: 1px solid rgba(164,132,62,.50);
    border-radius: 5px;
    background: rgba(127,93,31,.12);
    color: #aebbcc !important;
    font-size: 9.5px !important;
    font-weight: 800 !important;
    line-height: 1.35;
    direction: ltr;
}

/* Keep the information card geometry clean on smaller desktop/tablet widths. */
@media (max-width: 1280px) {
    .device-information-v10 .device-facts-v10 {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }
    .device-information-v10 .device-facts-v10 > div:nth-child(3n) {
        border-left: 1px solid #705b33;
    }
    .device-information-v10 .device-facts-v10 > div:nth-child(2n) {
        border-left: 0;
    }
    .device-information-v10 .device-facts-v10 > div:nth-last-child(-n+3) {
        border-bottom: 1px solid #705b33;
    }
    .device-information-v10 .device-facts-v10 > div:nth-last-child(-n+2) {
        border-bottom: 0;
    }
}
@media (max-width: 760px) {
    .device-information-v10 .device-identity-strip-v10 > div {
        padding: 16px 54px 16px 16px !important;
    }
    .device-information-v10 .device-facts-v10 {
        grid-template-columns: 1fr;
    }
    .device-information-v10 .device-facts-v10 > div,
    .device-information-v10 .device-facts-v10 > div:nth-child(2n),
    .device-information-v10 .device-facts-v10 > div:nth-child(3n),
    .device-information-v10 .device-facts-v10 > div:nth-last-child(-n+2),
    .device-information-v10 .device-facts-v10 > div:nth-last-child(-n+3) {
        border-left: 0 !important;
        border-bottom: 1px solid #705b33 !important;
    }
    .device-information-v10 .device-facts-v10 > div:last-child {
        border-bottom: 0 !important;
    }
}


/* ------------------------------------------------------------------------
   UPDATE 13 — Force visible flags and keep country name + flag together.
   ------------------------------------------------------------------------ */
.country-inline,
.country-inline-v12,
.country-inline-v13,
.country-main-inline-v13,
.country-title-with-flag-v13,
.premium-country-name-v10,
.analytics-country-name-v4 { min-width: 0; }

.country-inline-v13,
.country-inline-v12 {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    flex-wrap: nowrap !important;
    direction: rtl;
}
.country-main-inline-v13,
.country-title-with-flag-v13 {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-width: 0;
    white-space: nowrap;
}
.country-flag-inline-v12,
.country-flag-inline-v13,
.premium-country-flag-v10,
.analytics-country-flag-v4,
.country-inline > span:first-child {
    display: inline-grid;
    place-items: center;
    line-height: 1;
    font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", "Twemoji Mozilla", emoji !important;
    text-rendering: optimizeLegibility;
}
.country-flag-inline-v13 { font-size: 20px; width: 22px; height: 20px; }
.country-flag-inline-v12 { font-size: 20px !important; }
.country-inline-v13 strong,
.country-inline-v12 strong {
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.country-inline-v13 small,
.country-inline-v12 small,
.premium-country-name-v10 small,
.analytics-country-name-v4 small {
    direction: ltr;
    unicode-bidi: isolate;
}

.premium-country-row-v10 {
    grid-template-columns: minmax(130px,.85fr) minmax(120px,1fr) 68px !important;
}
.premium-country-name-v10 {
    display: grid;
    justify-items: start;
    gap: 2px;
}
.premium-country-name-v10 strong { display: inline-block; font-size: 14px !important; }
.premium-country-name-v10 small { display: inline-block; font-size: 11px !important; }
.premium-country-count-v10 {
    text-align: left;
    font-size: 14px;
    white-space: nowrap;
}
.premium-country-count-v10 small { font-size: 11px; color: #aebbcc; }

.analytics-country-row-v4 {
    grid-template-columns: minmax(150px,.85fr) minmax(120px,1fr) 76px !important;
}
.analytics-country-name-v4 {
    display: grid;
    justify-items: start;
    gap: 2px;
}
.analytics-country-name-v4 strong { display: inline-block; font-size: 14px !important; }
.analytics-country-name-v4 small { display: inline-block; color: #aebbcc; font-size: 11px; }
.analytics-country-count-v4 { white-space: nowrap; }

/* Better fallback for the generic inline country badge used in tables. */
.country-inline {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    flex-wrap: nowrap;
}
.country-inline > span:first-child { font-size: 19px; }
.country-inline strong { font-size: 11.5px; }
.country-inline small { color:#aebbcc; font-size:11px; font-weight:700; }

/* Support desk layout — approved content arrangement, existing admin palette preserved. */
.support-page-heading{margin:2px 0 16px;display:flex;align-items:flex-end;justify-content:space-between;gap:18px}.support-page-heading h2{margin:0 0 5px;font-size:26px}.support-page-heading p{margin:0;color:var(--muted);font-size:13px}.support-stat-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:16px}.support-stat-card{min-height:92px;padding:15px 18px;border:1px solid var(--line);border-radius:10px;background:linear-gradient(145deg,var(--panel-2),var(--panel));display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center}.support-stat-card span{color:var(--muted);font-size:12px}.support-stat-card strong{margin-top:4px;color:#d8b45e;font-size:27px;line-height:1.2}.support-index-panel{padding:16px!important}.support-filter-bar{display:grid;grid-template-columns:minmax(260px,1.7fr) minmax(160px,.75fr) minmax(150px,.65fr) auto auto;gap:10px;align-items:end;margin-bottom:14px}.support-filter-search{position:relative}.support-filter-search input{padding-inline-start:38px}.support-search-icon{position:absolute;inset-inline-start:12px;bottom:7px;z-index:1;color:#d8b45e;font-size:23px;line-height:1}.support-index-table-wrap{border:1px solid var(--line);border-radius:9px;overflow:auto}.support-index-table{margin:0}.support-index-table th,.support-index-table td{padding:13px 12px!important}.support-index-table tr:last-child td{border-bottom:0}.support-state{display:inline-flex;align-items:center;gap:7px;font-weight:700;white-space:nowrap}.support-state i{width:8px;height:8px;border-radius:50%;background:var(--amber);box-shadow:0 0 10px rgba(239,157,67,.35)}.support-state-answered i{background:var(--green);box-shadow:0 0 10px rgba(57,216,154,.4)}.support-state-open i{background:#8f6924;box-shadow:0 0 10px rgba(184,138,53,.4)}.support-row-menu>summary{list-style:none}.support-row-menu>summary::-webkit-details-marker{display:none}.support-ticket-popover{min-width:min(780px,86vw)!important}.support-ticket-summary{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-bottom:10px;border-bottom:1px solid var(--line)}.support-ticket-summary span{color:var(--muted);font-size:11px}.support-ticket-description{padding:12px;border:1px solid var(--line);border-radius:8px;background:var(--panel-2);white-space:pre-wrap}.support-ticket-timeline strong{color:#aebbcc}.support-inline-reply,.support-inline-state{padding-top:12px;border-top:1px solid var(--line)}.support-create-panel{padding:18px!important}.support-create-head{margin-bottom:14px}.support-create-head h2{margin:0 0 4px}.support-create-head p{margin:0;color:var(--muted);font-size:12px}.support-create-form{display:grid;grid-template-columns:minmax(180px,.7fr) minmax(0,1.3fr);gap:13px 16px;align-items:end}.support-create-message{grid-column:1/-1}.support-create-message textarea{min-height:110px}.support-create-form>.step-up,.support-create-form>[data-step-up]{grid-column:1/-1}.support-create-submit{grid-column:2;justify-self:end;min-width:180px}
@media(max-width:1100px){.support-filter-bar{grid-template-columns:1fr 1fr 1fr auto}.support-filter-bar>.button.secondary{grid-column:1/-1;justify-self:start}.support-stat-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){.support-stat-grid{grid-template-columns:1fr}.support-filter-bar{grid-template-columns:1fr}.support-filter-bar>.button.secondary{grid-column:auto;justify-self:stretch}.support-filter-bar>.button{width:100%}.support-create-form{grid-template-columns:1fr}.support-create-message,.support-create-submit{grid-column:1}.support-create-submit{justify-self:stretch}.support-page-heading h2{font-size:23px}}

/* ========================================================================
   Reseller hub — 2026-09-15
   One admin surface for balance, devices, licenses, messages and promotion.
   Uses the existing DOMA admin palette; no global color variables changed.
   ======================================================================== */
.reseller-index-intro{align-items:center}.reseller-index-summary{display:flex;align-items:stretch;gap:10px;flex-wrap:wrap}.reseller-summary-chip{min-width:138px;padding:10px 15px;border:1px solid var(--line);border-radius:9px;background:var(--panel-2);display:grid;gap:2px}.reseller-summary-chip small{color:var(--muted)}.reseller-summary-chip strong{color:#aebbcc;font-size:23px;line-height:1.2}.reseller-index-panel{padding:15px!important}.reseller-table-wrap{border:1px solid var(--line);border-radius:9px;overflow:auto}.reseller-table{margin:0}.reseller-table th,.reseller-table td{padding:12px 13px!important}.reseller-table tr:last-child td{border-bottom:0}.reseller-name-cell{min-width:190px}.reseller-name-cell>a strong{color:#d5dde9;font-size:14px}.reseller-name-cell>a:hover strong{color:#fff}.reseller-rank-badge,.reseller-state-badge,.reseller-message-state{min-height:26px;padding:4px 10px;border:1px solid #a4843e;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;gap:6px;background:rgba(127,93,31,.15);color:#aebbcc;font-size:11px;font-weight:700;white-space:nowrap}.reseller-rank-badge.is-agent{border-color:#2c6c57;background:rgba(36,112,82,.13);color:#79e2b9}.reseller-state-badge.is-active{border-color:#296b54;background:rgba(36,112,82,.14);color:#75e0b5}.reseller-state-badge.is-paused{border-color:#86602b;background:rgba(126,84,29,.14);color:#f0b563}.reseller-state-badge.is-blocked{border-color:#824052;background:rgba(122,46,64,.16);color:#ff9bad}.reseller-message-state{border-color:#74572d;color:#eebb72}.reseller-message-state.is-answered{border-color:#296b54;color:#72dfb3}.reseller-message-state.is-closed{border-color:#2b384c;color:#aebbcc}.reseller-row-actions{display:flex;gap:7px;flex-wrap:wrap}.reseller-inbox-panel,.reseller-create-panel{padding:16px!important}.reseller-message-table td{vertical-align:middle}
.reseller-profile-hero{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:18px 20px!important}.reseller-profile-title{display:flex;align-items:center;gap:15px;min-width:0}.reseller-profile-avatar{width:58px;height:58px;flex:0 0 58px;display:grid;place-items:center;border:1px solid #a4843e;border-radius:16px;background:linear-gradient(145deg,#2b384c,#172336);color:#aebbcc;font-size:25px;font-weight:700}.reseller-profile-title h2{margin:3px 0 2px;font-size:25px}.reseller-profile-title p{margin:0;color:var(--muted);font-size:12px}.reseller-profile-badges{display:flex;gap:7px;flex-wrap:wrap}.reseller-profile-links{display:flex;gap:7px;flex-wrap:wrap}.reseller-profile-links a{padding:7px 10px;border:1px solid var(--line);border-radius:7px;background:var(--panel-2);color:#d5dde9;font-size:11px}.reseller-profile-links a:hover{border-color:#a4843e;color:#fff}.reseller-profile-metrics{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin-bottom:14px}.reseller-profile-metrics article{min-height:91px;padding:13px 14px;border:1px solid var(--line);border-radius:10px;background:linear-gradient(145deg,var(--panel-2),var(--panel));display:flex;flex-direction:column;justify-content:center}.reseller-profile-metrics span{color:var(--muted);font-size:11px}.reseller-profile-metrics strong{margin:3px 0;color:#aebbcc;font-size:23px;line-height:1.2}.reseller-profile-metrics small{font-size:10px}.reseller-control-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.reseller-control-card{margin-bottom:14px!important}.reseller-action-stack{display:grid;gap:9px}.reseller-action-stack form{margin:0}.reseller-action-note{margin:0!important;color:var(--muted);font-size:11px!important}.reseller-agent-done{padding:11px 12px;border:1px solid #2a6751;border-radius:8px;background:rgba(30,101,75,.13);color:#83dfb9;text-align:center;font-weight:700}.reseller-devices-panel{padding:16px!important}.reseller-device-list{display:grid;gap:10px}.reseller-device-card{padding:13px;border:1px solid var(--line);border-radius:10px;background:var(--panel-2)}.reseller-device-main{display:grid;grid-template-columns:1.15fr 1.1fr .8fr .9fr .75fr .9fr;gap:10px;align-items:center}.reseller-device-main>div{min-width:0}.reseller-device-main small{margin-bottom:2px}.reseller-device-main strong{display:block;overflow-wrap:anywhere;font-size:12px}.reseller-device-toolbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:10px;padding-top:10px;border-top:1px solid var(--line)}.reseller-device-details{flex:1;min-width:min(100%,250px);border:1px solid #705b33;border-radius:8px;background:rgba(0,0,0,.08)}.reseller-device-details>summary{padding:7px 10px;list-style:none;color:#aebbcc;font-size:12px;font-weight:700}.reseller-device-details>summary::-webkit-details-marker{display:none}.reseller-device-details[open]>summary{border-bottom:1px solid var(--line)}.reseller-device-actions-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:12px}.reseller-device-actions-grid>form{padding:11px;border:1px solid var(--line);border-radius:8px;background:var(--panel)}.reseller-device-actions-grid>form>strong{display:block;margin-bottom:7px;color:#d5dde9}.reseller-transactions-panel,.reseller-messages-panel{padding:16px!important}.reseller-settings-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(300px,.7fr);gap:14px}.reseller-login-list{display:grid;gap:8px}.reseller-login-list article{padding:10px 11px;border:1px solid var(--line);border-radius:8px;background:var(--panel-2);display:flex;align-items:center;justify-content:space-between;gap:10px}.reseller-children-block{margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}.reseller-children-block h3{margin:0 0 9px}.reseller-children-block>a{margin-bottom:7px;padding:9px 10px;border:1px solid var(--line);border-radius:8px;background:var(--panel-2);display:block}.reseller-children-block>a strong{display:block}.reseller-children-block>a small{margin-top:1px}
.admin-reseller-chat{padding:18px!important}.admin-reseller-chat-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:13px}.admin-reseller-chat-head h2{margin:0 0 4px}.admin-reseller-chat-head p{margin:0;color:var(--muted);font-size:12px}.admin-reseller-chat-meta{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:17px;border:1px solid var(--line);border-radius:9px;background:var(--panel-2);overflow:hidden}.admin-reseller-chat-meta>div{min-width:0;padding:12px 14px;border-inline-start:1px solid var(--line);text-align:center}.admin-reseller-chat-meta>div:first-child{border-inline-start:0}.admin-reseller-chat-meta span{display:block;color:var(--muted);font-size:10px}.admin-reseller-chat-meta strong{display:block;overflow-wrap:anywhere;font-size:11px}.admin-reseller-thread{display:grid;gap:15px;padding:4px 0 8px}.admin-reseller-message{display:grid;grid-template-columns:55px minmax(0,62%) 1fr;grid-template-areas:'avatar bubble .' 'role bubble .';gap:4px 10px;direction:ltr}.admin-reseller-message.is-reseller{grid-template-columns:1fr minmax(0,62%) 55px;grid-template-areas:'. bubble avatar' '. bubble role'}.admin-reseller-message>*{direction:rtl}.admin-reseller-message-avatar{grid-area:avatar;width:50px;height:50px;display:grid;place-items:center;border:1px solid #a4843e;border-radius:50%;background:var(--panel-3);color:#aebbcc;font-weight:700}.admin-reseller-message-role{grid-area:role;min-width:50px;padding:2px 6px;border:1px solid #a4843e;border-radius:6px;background:#1e2b3d;text-align:center;color:#aebbcc;font-size:9px;font-weight:700}.admin-reseller-message-bubble{grid-area:bubble;padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:var(--panel-2)}.admin-reseller-message.is-reseller .admin-reseller-message-bubble{border-color:#a4843e;background:#1e2b3d}.admin-reseller-message-bubble header{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px}.admin-reseller-message-bubble header strong{color:#aebbcc}.admin-reseller-message-bubble time{color:var(--muted);font-size:10px}.admin-reseller-message-bubble p{margin:0;white-space:pre-wrap;overflow-wrap:anywhere;font-size:12px}.admin-reseller-attachment{display:inline-flex;margin-top:9px;padding:6px 9px;border:1px dashed #a4843e;border-radius:7px;background:rgba(0,0,0,.12);font-size:11px}.admin-reseller-reply{padding:16px!important}.admin-reseller-close-form{margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}.admin-reseller-closed{padding:13px 15px;border:1px solid #2e6d56;border-radius:9px;background:rgba(31,100,75,.13);color:#83dfb9}.admin-reseller-closed p{margin:3px 0 0;color:var(--muted);font-size:11px}
@media(max-width:1350px){.reseller-profile-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}.reseller-control-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.reseller-device-main{grid-template-columns:repeat(3,minmax(0,1fr))}.reseller-device-actions-grid{grid-template-columns:1fr 1fr}.reseller-settings-grid{grid-template-columns:1fr}}
@media(max-width:900px){.reseller-control-grid{grid-template-columns:1fr}.reseller-device-actions-grid{grid-template-columns:1fr}.admin-reseller-chat-meta{grid-template-columns:repeat(2,minmax(0,1fr))}.admin-reseller-chat-meta>div:nth-child(3){border-inline-start:0;border-top:1px solid var(--line)}.admin-reseller-chat-meta>div:nth-child(4){border-top:1px solid var(--line)}.admin-reseller-message,.admin-reseller-message.is-reseller{grid-template-columns:48px minmax(0,1fr);grid-template-areas:'avatar bubble' 'role bubble'}.admin-reseller-message.is-reseller{grid-template-columns:minmax(0,1fr) 48px;grid-template-areas:'bubble avatar' 'bubble role'}}
@media(max-width:640px){.reseller-profile-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.reseller-profile-title{align-items:flex-start}.reseller-profile-links{width:100%}.reseller-profile-links a{flex:1;text-align:center}.reseller-device-main{grid-template-columns:1fr 1fr}.admin-reseller-chat-meta{grid-template-columns:1fr}.admin-reseller-chat-meta>div{border-inline-start:0;border-top:1px solid var(--line)}.admin-reseller-chat-meta>div:first-child{border-top:0}.admin-reseller-chat-head{flex-direction:column}}
.reseller-new-message{margin-top:14px;border:1px solid var(--line);border-radius:9px;background:var(--panel-2)}.reseller-new-message>summary{padding:10px 12px;list-style:none;color:#aebbcc;font-weight:700;font-size:12px}.reseller-new-message>summary::-webkit-details-marker{display:none}.reseller-new-message[open]>summary{border-bottom:1px solid var(--line)}.reseller-new-message>form{padding:13px}

/* DOMA revision 20260917: contained navigation and Safari/RTL form sizing. */
.sidebar{height:100dvh;max-height:100dvh;display:flex;flex-direction:column;box-sizing:border-box;padding-bottom:max(16px,env(safe-area-inset-bottom))}
.sidebar>.brand,.sidebar>.sidebar-foot{flex:0 0 auto}.sidebar>.main-nav{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;scroll-behavior:auto}
.sidebar .brand-copy{min-width:0}.sidebar .brand-copy>strong{white-space:nowrap}.sidebar .sidebar-foot{min-width:0}.sidebar .sidebar-foot .button{white-space:normal}
.form-grid>*,.stack>label,.filters>label{min-width:0}input,select,textarea{box-sizing:border-box;max-width:100%}input[type="datetime-local"],input[type="date"]{min-width:0;width:100%;display:block;direction:ltr;text-align:start}input[type="datetime-local"]::-webkit-date-and-time-value{text-align:start;min-height:1.4em}
.table-wrap{max-width:100%;overflow:auto;overscroll-behavior-x:contain}.platform-targets{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}.platform-targets label{display:flex;gap:9px;align-items:center}.platform-targets input{width:auto}
[aria-current="page"]{scroll-margin-block:24px}.rotation-warning{line-height:1.9}.role-policy-list{padding-inline-start:22px;line-height:2}
@media(max-width:760px){.sidebar{padding-top:max(16px,env(safe-area-inset-top));width:min(88vw,350px)}.sidebar .sidebar-note{display:none}.sidebar .brand{padding-block:12px}.sidebar .brand-copy>strong{font-size:22px}.sidebar .sidebar-foot{padding-top:10px}.sidebar .account{padding-block:8px}.form-grid,.form-grid-2,.form-grid-3{grid-template-columns:minmax(0,1fr)}.panel,.workspace{min-width:0}.premium-shell-meta .premium-shell-time{display:none}.role-grid{grid-template-columns:minmax(0,1fr)}}
@media(max-width:760px){.premium-shellbar{flex-wrap:wrap;gap:12px}.premium-shell-meta{min-width:0;max-width:100%;flex-wrap:wrap;justify-content:flex-start}.premium-shell-meta .button{min-width:0;white-space:normal}}

/* Round 2: this two-cell summary must not inherit compact activity's 8px marker column. */
.overview-countries>div{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:16px;padding:12px 0;border-bottom:1px solid #1e2b3d}
.overview-countries .doma-country{min-width:0;width:auto;max-width:100%}
.overview-countries .doma-country-copy{min-width:0}
.overview-countries .doma-country-name{white-space:normal;overflow-wrap:break-word;word-break:normal}
.overview-countries>div>strong{white-space:nowrap;font-variant-numeric:tabular-nums}
.announcement-body{white-space:pre-wrap;overflow-wrap:anywhere}

/* Scoped Round 2 layouts: no reuse of dashboard named areas for release tables. */
.release-center-grid{display:grid;grid-template-columns:minmax(0,3fr) minmax(220px,1fr);gap:16px;align-items:start}
.release-center-grid>.panel{min-width:0}
.analytics-license-legend-v4{min-width:0}
.analytics-license-legend-v4>div{grid-template-columns:minmax(0,1fr) auto auto}
.analytics-license-legend-v4>div>span{min-width:0;overflow-wrap:break-word}
@media(max-width:1450px){.analytics-license-layout-v4{grid-template-columns:minmax(0,1fr)}.analytics-license-legend-v4{width:100%}}
@media(max-width:1050px){.release-center-grid{grid-template-columns:minmax(0,1fr)}}