:root {
  color-scheme: light;
  --primary: #00412e; --secondary: #96bf8a; --bg: #e8eae5; --surface: #fff;
  --ink: #163b2f; --muted: #52665a; --line: #dbe2da; --soft: #f5f7f3;
  --code-keyword:#8753c6; --code-string:#a34508; --code-comment:#65776c;
  --accent: #00412e; --error-bg: #fff0ed; --error-ink: #a33222; --shadow: 0 18px 60px #173e2510;
  --nav-active: #e5efe6; --nav-active-ink: #00412e; --danger: #b42318; --warn: #8a5100; --menu-shadow: 0 18px 50px #173e2522;
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-synthesis: none; text-rendering: optimizeLegibility;
}
html[data-theme="dark"] {
  color-scheme: dark; --code-keyword:#cba6ff; --code-string:#ffbc7e; --code-comment:#9cb5a5; --bg: #0f1114; --surface: #16191e; --ink: #e8ebef; --muted: #9ba4ae;
  --line: #272c34; --soft: #1e2228; --accent: #3fcf8e; --error-bg: #45231e; --error-ink: #ffbaaa; --shadow: 0 18px 60px #0004;
  --nav-active: #12302a; --nav-active-ink: #4ade9b; --danger: #f87171; --warn: #fbbf24; --menu-shadow: 0 18px 50px #0008;
}
@media (prefers-color-scheme: dark) {
  html[data-theme="system"] { color-scheme: dark; --code-keyword:#cba6ff; --code-string:#ffbc7e; --code-comment:#9cb5a5; --bg: #0f1114; --surface: #16191e; --ink: #e8ebef; --muted: #9ba4ae; --line: #272c34; --soft: #1e2228; --accent: #3fcf8e; --error-bg: #45231e; --error-ink: #ffbaaa; --shadow: 0 18px 60px #0004; --nav-active: #12302a; --nav-active-ink: #4ade9b; --danger: #f87171; --warn: #fbbf24; --menu-shadow: 0 18px 50px #0008; }
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--ink); font-size: 14px; line-height: 1.6; }
button, input, select { font: inherit; }
a { color: var(--accent); }
button, select, input[type="checkbox"], input[type="radio"] { cursor: pointer; }
[hidden] { display: none !important; }
:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }
.sidebar :focus-visible, .site-hero :focus-visible { outline-color: var(--secondary); }
.sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip-path: inset(50%); }
.skip-link { position: fixed; top: -70px; inset-inline-start: 20px; z-index: 20; padding: 14px; background: var(--surface); }
.skip-link:focus { top: 10px; }
.app { min-height: 100vh; }
.with-sidebar { display: grid; grid-template-columns: 304px minmax(0, 1fr); }
.sidebar { position: sticky; top: 0; height: 100vh; padding: 36px 32px 25px; display: flex; flex-direction: column; background: #00412e; color: #fff; overflow: auto; }
.brand { display: inline-flex; gap: 12px; align-items: center; text-decoration: none; color: inherit; font-size: 19px; font-weight: 750; letter-spacing: .09em; white-space: nowrap; }
.brand-mark { display: grid; place-items: center; width: 38px; height: 42px; color: #00412e; background: #96bf8a; border-radius: 9px 9px 18px 9px; font-weight: 900; font-size: 24px; letter-spacing: -.08em; }
.brand small { font-size: 10px; font-weight: 500; letter-spacing: .1em; display: block; margin-top: -5px; }
.sidebar-heading { margin: 62px 0 35px; }
.eyebrow { display: block; color: var(--accent); font-size: 10px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; margin-bottom: 10px; }
.sidebar .eyebrow { color: #a6c99b; font-size: 8px; letter-spacing: .15em; }
.sidebar h1 { font-weight: 550; font-size: 30px; line-height: 1.17; letter-spacing: -.04em; margin: 18px 0; }
.sidebar p { color: #bdcfc4; font-size: 12px; max-width: 215px; line-height: 1.7; }
.steps { list-style: none; padding: 0; margin: 0; display: grid; gap: 5px; }
.steps li { position: relative; display: flex; gap: 13px; align-items: center; min-height: 41px; color: #a6bdb0; font-size: 12px; }
.steps li:not(:last-child)::after { content: ''; position: absolute; width: 1px; height: 15px; background: #ffffff21; inset-inline-start: 13px; top: 34px; }
.step-number { display: grid; place-items: center; width: 27px; height: 27px; border-radius: 50%; border: 1px solid #ffffff30; font-size: 10px; }
.steps .current { color: white; font-weight: 700; }
.steps .current .step-number { background: #96bf8a; color: #00412e; border-color: #96bf8a; box-shadow: 0 0 0 4px #96bf8a16; }
.steps .done .step-number { color: #b3d6a8; border-color: #96bf8a66; }
.sidebar-bottom { margin-top: auto; padding-top: 35px; display: flex; align-items: center; gap: 9px; color: #a6bdb0; font-size: 11px; }
.version { margin-inline-start: auto; opacity: .65; }
.status-dot { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: #96bf8a; }
.workspace { min-width: 0; display: flex; flex-direction: column; min-height: 100vh; }
.topbar { min-height: 84px; display: flex; justify-content: space-between; gap: 20px; align-items: center; padding: 20px 42px; border-bottom: 1px solid var(--line); }
.topbar-note { color: var(--muted); font-size: 11px; }
.separator { padding: 0 12px; opacity: .45; }
.preferences { display: flex; gap: 7px; align-items: center; margin-inline-start: auto; }
.preferences select, .preference-save { max-width: 145px; border: 1px solid var(--line); color: var(--ink); background: var(--surface); font-size: 11px; border-radius: 8px; height: 34px; padding: 0 9px; }
.preference-save { color: var(--accent); }
.main { display: flex; flex-direction: column; justify-content: center; align-items: center; flex: 1; padding: 36px 38px; }
.panel { width: 100%; max-width: 735px; padding: 38px 43px; border: 1px solid var(--line); background: var(--surface); border-radius: 19px; box-shadow: var(--shadow); }
.panel-header { margin-bottom: 28px; }
h2, .login h1 { margin: 0 0 12px; color: var(--ink); font-size: 33px; line-height: 1.17; font-weight: 590; letter-spacing: -.045em; }
.lead { margin: 0 0 24px; color: var(--muted); font-size: 13px; line-height: 1.75; }
.startup-checks { padding-inline-start: 22px; margin: 0 0 24px; }
.startup-checks li { margin-bottom: 18px; overflow-wrap: anywhere; }
.startup-checks p { margin: 4px 0 0; color: var(--muted); }
.diagnostics-results { list-style: none; padding: 0; }
.diagnostics-results li { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 8px 0; border-bottom: 1px solid var(--line); }
.diagnostics-results li span { min-width: 0; overflow-wrap: anywhere; }
.diagnostics-results li strong { flex-shrink: 0; }
.diagnostics-results li[data-passed="false"] strong { color: var(--error-ink); }
.panel-header .lead { margin: 0; }
.form-stack { display: grid; gap: 18px; }
.grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 16px; }
.host-grid { grid-template-columns: minmax(0,3fr) minmax(70px,1fr); }
.field { min-width: 0; display: grid; gap: 7px; font-size: 11px; font-weight: 650; }
.field input, .field select { width: 100%; min-width: 0; height: 44px; padding: 0 12px; color: var(--ink); background: var(--soft); border: 1px solid var(--line); border-radius: 9px; font-size: 13px; font-weight: 400; }
.field input { cursor: text; }
.field input:focus, .field select:focus { border-color: var(--secondary); }
.checkbox { display: flex; align-items: flex-start; gap: 10px; font-size: 12px; color: var(--muted); }
.checkbox input { flex-shrink: 0; width: 24px; height: 24px; margin: 0; accent-color: #00412e; }
.form-actions { margin-top: 13px; display: flex; justify-content: space-between; align-items: center; gap: 12px; border-top: 1px solid var(--line); padding-top: 23px; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 43px; padding: 0 18px; border: 1px solid transparent; border-radius: 9px; font-size: 12px; font-weight: 700; text-decoration: none; transition: transform 150ms ease, filter 150ms ease; }
.button:hover { filter: brightness(1.08); transform: translateY(-1px); }
.button.primary { background: #00412e; color: #fff; border-color: #44816a; }
.button.secondary { background: var(--surface); color: var(--ink); border-color: var(--line); }
.button.pale { background: #dcebcf; color: #00412e; }
.button:disabled { opacity: .48; cursor: wait; transform: none; }
.button[aria-busy="true"]::before { content: ''; width: 12px; height: 12px; border: 2px solid #ffffff55; border-top-color: #fff; border-radius: 50%; animation: spin 1s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.note { color: var(--muted); border-inline-start: 2px solid var(--secondary); padding: 10px 14px; background: var(--soft); font-size: 11px; line-height: 1.7; margin: 0; border-radius: 0 8px 8px 0; }
.subtle { color: var(--muted); font-size: 10px; }
.footer { padding: 16px 42px 23px; display: flex; justify-content: space-between; color: var(--muted); font-size: 9px; letter-spacing: .02em; }
.footer span:first-child { font-weight: 700; }
.restart { margin-top: 18px; }
.restart button { padding: 6px; background: none; border: 0; color: var(--muted); font-size: 10px; text-decoration: underline; }
.welcome-visual { position: relative; padding: 22px 32px 25px; margin-bottom: 7px; background: var(--soft); border: 1px solid var(--line); border-radius: 12px; }
.visual-browser { border: 1px solid var(--line); background: var(--surface); border-radius: 9px; overflow: hidden; box-shadow: 0 7px 24px #12332212; transform: rotate(-1.5deg); }
.browser-bar { height: 24px; display: flex; gap: 4px; align-items: center; padding: 0 10px; border-bottom: 1px solid var(--line); font-size: 5px; color: var(--muted); }
.browser-bar i { width: 4px; height: 4px; border-radius: 50%; background: var(--line); }
.browser-bar span { margin: 0 auto; letter-spacing: .16em; }
.visual-body { display: flex; height: 120px; }
.mini-nav { background: #00412e; width: 19%; }
.mini-content { width: 81%; padding: 20px 20px 14px; }
.mini-tag { display: block; width: 30%; height: 5px; background: #96bf8a; border-radius: 2px; }
.mini-title { display: block; width: 63%; height: 9px; background: var(--ink); opacity: .9; margin-top: 9px; border-radius: 3px; }
.mini-line { display: block; width: 88%; height: 3px; background: var(--line); margin-top: 7px; }
.mini-cards { display: flex; gap: 8px; margin-top: 16px; }
.mini-cards i { display: block; width: 33%; height: 30px; border-radius: 4px; background: var(--soft); border: 1px solid var(--line); }
.visual-badge { position: absolute; bottom: 12px; inset-inline-end: 17px; background: #96bf8a; color: #00412e; border-radius: 6px; font-size: 8px; font-weight: 650; padding: 6px 10px; box-shadow: 0 4px 12px #0033221f; }
.intro-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 25px; margin: 1px 0 10px; }
.intro-grid div { display: grid; grid-template-columns: 25px 1fr; gap: 2px 8px; }
.feature-dot { font-size: 9px; font-weight: 750; color: var(--accent); margin-top: 3px; grid-row: span 2; }
.intro-grid strong { font-size: 11px; }.intro-grid small { font-size: 9px; color: var(--muted); }
.checks { border: 1px solid var(--line); border-radius: 11px; overflow: hidden; }
.check { padding: 9px 13px; display: flex; align-items: center; gap: 12px; border-bottom: 1px solid var(--line); }
.check:last-child { border-bottom: 0; }.check strong { display: block; font-size: 11px; }.check small { display: block; color: var(--muted); font-size: 9px; }
.check-icon { width: 24px; height: 24px; display: grid; place-items: center; border-radius: 7px; font-size: 11px; background: var(--soft); }.check-icon.ok { color: var(--accent); background: #96bf8a30; }.check-icon.bad { color: var(--error-ink); background: var(--error-bg); }.check-icon.warn { color: #ac8c23; }
.badge { font-size: 9px; border-radius: 30px; padding: 4px 9px; background: var(--soft); color: var(--muted); border: 1px solid var(--line); }
.check .badge { margin-inline-start: auto; }.badge.ok { color: var(--accent); }
.alert { padding: 13px 16px; margin: 0 0 18px; font-size: 12px; border-radius: 9px; }.alert.error { background: var(--error-bg); color: var(--error-ink); border: 1px solid currentColor; }
.language-details { border: 1px solid var(--line); border-radius: 9px; padding: 12px; font-size: 12px; }
.language-details summary { cursor: pointer; font-weight: 650; }.language-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; margin-top: 15px; }
.choices { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }.choice { position: relative; cursor: pointer; }
.choice > input { position: absolute; opacity: 0; }.choice-content { display: flex; flex-direction: column; min-height: 168px; border: 1px solid var(--line); border-radius: 11px; padding: 17px; }
.choice input:checked + .choice-content { border-color: var(--accent); background: var(--soft); box-shadow: inset 0 0 0 1px var(--accent); }.choice input:focus-visible + .choice-content { outline: 3px solid var(--secondary); outline-offset: 3px; }
.choice-icon { color: var(--accent); font-size: 23px; margin-bottom: 22px; }.choice strong { font-size: 11px; }.choice small { font-size: 10px; color: var(--muted); line-height: 1.6; margin-top: 6px; }
fieldset { border: 1px solid var(--line); border-radius: 9px; padding: 17px; }legend { font-size: 11px; font-weight: 650; padding: 0 7px; }.module-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 11px; }
.summary-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }.summary-grid article { padding: 16px; border-radius: 10px; border: 1px solid var(--line); background: var(--soft); overflow-wrap: anywhere; }
.summary-grid span { display: block; font-size: 9px; color: var(--muted); margin-bottom: 12px; }.summary-grid strong { display: block; font-size: 13px; }.summary-grid small { display: block; font-size: 10px; color: var(--muted); }
.recovery-box { padding: 17px; border: 1px solid var(--secondary); border-radius: 10px; background: var(--soft); }.recovery-box strong { font-size: 12px; }.recovery-box p { font-size: 11px; color: var(--muted); margin: 6px 0 10px; }.recovery-box code { font-size: 12px; overflow-wrap: anywhere; user-select: all; }
.completion { text-align: center; padding: 58px 44px; }.completion .form-actions { justify-content: center; }.completion .button { margin-top: 5px; }.large-check { display: grid; place-items: center; width: 65px; height: 65px; margin: 0 auto 24px; color: var(--accent); background: #96bf8a35; border-radius: 20px; font-size: 27px; }
.login { max-width: 435px; padding: 36px; }.login-symbol { display: grid; place-items: center; width: 43px; height: 47px; border-radius: 9px 9px 18px 9px; background: #96bf8a; color: #00412e; font-size: 26px; font-weight: 800; margin-bottom: 25px; }.login .subtle { text-align: center; margin: 20px 0 0; }
.dashboard-main { max-width: 1150px; margin: 0 auto; width: 100%; justify-content: flex-start; align-items: stretch; }.dashboard-intro { display: flex; justify-content: space-between; align-items: center; gap: 25px; margin: 3px 0 28px; }.dashboard-intro h1 { font-size: 29px; font-weight: 550; margin: 0; letter-spacing: -.03em; }.dashboard-intro .eyebrow { margin-bottom: 4px; }
.site-hero { position: relative; overflow: hidden; display: flex; align-items: center; justify-content: space-between; gap: 25px; padding: 34px; border-radius: 16px; background: #00412e; color: white; }.site-hero h2 { color: white; margin: 18px 0 8px; font-size: 34px; }.site-hero p { color: #c0d3c2; margin: 0; font-size: 11px; }.site-hero .badge { background: #96bf8a26; color: #c0e3b3; border-color: #96bf8a40; }.site-hero > div:first-child, .site-hero a { position: relative; z-index: 1; }.hero-pattern { position: absolute; inset-inline-end: 80px; top: -110px; font-size: 380px; opacity: .04; line-height: 1; font-weight: 900; transform: rotate(-10deg); }
.stats { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; margin: 20px 0; }.stats article { padding: 22px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface); }.stats span { display: block; font-size: 10px; color: var(--muted); }.stats strong { display: block; font-size: 20px; font-weight: 600; margin-top: 15px; overflow-wrap: anywhere; }.stats small { font-size: 10px; color: var(--muted); overflow-wrap: anywhere; }.stats .status-dot { margin-inline-end: 7px; width: 8px; height: 8px; }
.next-panel { max-width: none; box-shadow: none; padding: 27px; }.next-panel h2 { font-size: 25px; }.milestones { display: flex; flex-wrap: wrap; gap: 18px; font-size: 10px; color: var(--accent); }.next-step { display: flex; align-items: center; gap: 17px; border-top: 1px solid var(--line); margin-top: 24px; padding-top: 22px; }.next-number { display: grid; place-items: center; width: 37px; height: 40px; border-radius: 9px; background: var(--soft); color: var(--accent); font-weight: 750; font-size: 12px; }.next-step strong { font-size: 12px; }.next-step p { font-size: 11px; color: var(--muted); margin: 2px 0 0; }.next-step .badge { margin-inline-start: auto; }
@media (min-width: 1450px) { .with-sidebar { grid-template-columns: 340px minmax(0,1fr); }.sidebar { padding: 44px; }.main { padding: 45px; } }
@media (max-width: 1050px) { .with-sidebar { grid-template-columns: 240px minmax(0,1fr); }.sidebar { padding: 28px 24px; }.sidebar h1 { font-size: 27px; }.topbar { padding: 18px 24px; }.topbar-note { display: none; }.panel { padding: 30px; }.main { padding: 28px 24px; }.language-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 760px) { .with-sidebar { display: block; }.sidebar { position: relative; height: auto; padding: 20px 24px; }.sidebar-heading, .steps, .sidebar-bottom { display: none; }.topbar { min-height: 65px; padding: 14px 20px; }.topbar > .brand { font-size: 16px; }.topbar > .brand .brand-mark { width: 29px; height: 32px; font-size: 19px; }.preferences { gap: 5px; }.preferences select { font-size: 10px; max-width: 105px; }.main { padding: 25px 16px; }.panel { padding: 27px 24px; }.footer { padding: 18px 22px; }h2 { font-size: 29px; }.stats { grid-template-columns: 1fr; }.site-hero { flex-direction: column; align-items: flex-start; padding: 25px; }.site-hero h2 { font-size: 28px; }.dashboard-intro { align-items: flex-start; }.dashboard-intro h1 { font-size: 23px; } }
@media (max-width: 480px) { .grid:not(.host-grid), .intro-grid, .choices { grid-template-columns: 1fr; }.welcome-visual { padding: 18px; }.visual-badge { font-size: 7px; inset-inline-end: 10px; }.intro-grid { gap: 14px; }.form-actions { align-items: stretch; flex-direction: column-reverse; }.form-actions .subtle { text-align: center; }.module-grid { grid-template-columns: 1fr 1fr; }.choice-content { min-height: 115px; }.choice-icon { margin-bottom: 6px; }.summary-grid { grid-template-columns: 1fr; }.next-step { align-items: flex-start; flex-wrap: wrap; }.language-grid { grid-template-columns: 1fr 1fr; }.language-grid .checkbox { font-size: 10px; }.topbar { gap: 8px; }.completion { padding: 40px 25px; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }
/* Phase 2: account workspace */
.account-nav { display:flex; flex-wrap:wrap; gap:6px; padding:14px 42px; border-bottom:1px solid var(--line); background:var(--surface); align-items:center; }
.account-nav a,.account-nav button { color:var(--muted); text-decoration:none; padding:9px 12px; border-radius:8px; font-size:12px; border:0; background:transparent; font-weight:650; }
.account-nav a[aria-current] { color:var(--accent); background:var(--soft); box-shadow:inset 0 0 0 1px var(--line); }
.account-nav form { margin-inline-start:auto; }.account-nav button { cursor:pointer; }
.identity-content { width:100%; max-width:1160px; margin:0 auto; }.identity-public { max-width:650px; }
.identity-content h1 { margin:0 0 9px; font-size:34px; line-height:1.25; letter-spacing:-.035em; }.identity-content .dashboard-intro { margin:0 0 20px; }
.account-panel { max-width:none; margin-bottom:22px; padding:30px; box-shadow:none; }.account-panel h2 { font-size:23px; }
.account-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; align-items:start; }.account-grid .account-panel { margin-bottom:0; }.account-grid+.account-panel { margin-top:22px; }
.reauth { background:var(--soft); display:grid; gap:12px; }.reauth legend { color:var(--muted); font-size:10px; }
.field textarea { font:inherit; width:100%; resize:vertical; padding:12px; color:var(--ink); background:var(--soft); border:1px solid var(--line); border-radius:9px; font-weight:400; }.field small { color:var(--muted); font-weight:400; }
.field input[readonly] { opacity:.75; }.alert.success { color:var(--accent); background:var(--soft); border:1px solid var(--secondary); }
.section-heading { display:flex; align-items:center; justify-content:space-between; gap:15px; margin-bottom:25px; }.section-heading h2 { margin:0; }
.search-form { display:flex; gap:10px; margin-bottom:22px; }.search-form .field { flex:1; }.member-list { display:grid; }
.member { display:flex; align-items:flex-start; gap:14px; padding:22px 0; border-bottom:1px solid var(--line); flex-wrap:wrap; }.member:last-child { border-bottom:0; }
.member-avatar { width:40px; height:40px; border-radius:12px; display:grid; place-items:center; background:#96bf8a35; color:var(--accent); font-weight:750; }
.member-identity { flex:1; min-width:180px; overflow-wrap:anywhere; }.member-identity>span { display:block; color:var(--muted); font-size:12px; }.member-badges { display:flex; flex-wrap:wrap; gap:6px; margin-top:9px; }
.member-actions { margin-inline-start:auto; max-width:100%; }.member-actions>summary,.danger-zone>summary { cursor:pointer; font-size:12px; color:var(--accent); padding:8px 0; }
.member-editor { width:300px; max-width:100%; padding:18px; border:1px solid var(--line); border-radius:12px; margin-top:10px; }.member-editor form+form { border-top:1px solid var(--line); margin-top:20px; padding-top:20px; }
.permission-list { display:grid; gap:12px; font-size:12px; }.audit-list article { display:flex; gap:14px; align-items:center; padding:15px 0; border-bottom:1px solid var(--line); }.audit-list small { display:block; color:var(--muted); }.audit-list time { margin-inline-start:auto; font-size:11px; color:var(--muted); }.audit-list strong { font-size:12px; }
.recovery-codes { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; padding:20px; background:var(--soft); border-radius:10px; }.recovery-codes code { overflow-wrap:anywhere; font-size:13px; }
.setup-list { padding-inline-start:18px; color:var(--muted); font-size:12px; }.setup-list li { margin:12px 0; }.setup-secret { display:block; background:var(--soft); border:1px solid var(--line); padding:12px; margin-top:12px; border-radius:8px; color:var(--ink); overflow-wrap:anywhere; user-select:all; }
.danger-zone { margin-top:25px; }.danger-zone summary { color:var(--error-ink); }.login-links,.dashboard-links,.pagination { display:flex; flex-wrap:wrap; gap:16px; margin-top:22px; }.login-links { font-size:12px; justify-content:space-between; }.dashboard-links { width:100%; margin:0 0 24px; }
@media(max-width:900px) { .account-nav { padding:12px 22px; }.account-grid { grid-template-columns:1fr; }.account-panel { padding:24px; } }
@media(max-width:550px) { .account-nav { padding:10px 12px; gap:3px; }.account-nav a,.account-nav button { font-size:10px; padding:8px; }.account-nav form { margin-inline-start:0; }.identity-content h1 { font-size:28px; }.account-panel { padding:20px; }.section-heading { align-items:flex-start; flex-direction:column; }.member-actions { width:100%; }.member-editor { width:100%; }.member-identity { min-width:0; }.recovery-codes { grid-template-columns:1fr; }.audit-list article { flex-wrap:wrap; }.audit-list time { margin-inline-start:20px; width:100%; }.search-form { flex-wrap:wrap; } }
/* Phase 3: content workspace. Uses the same light/dark/system tokens. */
.content-workspace { width:100%; max-width:1160px; margin:auto; }
.content-workspace h1 { font-size:34px; line-height:1.15; letter-spacing:-.035em; margin:8px 0 12px; overflow-wrap:anywhere; }
.content-workspace .dashboard-intro .lead { margin-bottom:0; max-width:660px; }
.content-tabs { display:flex; flex-wrap:wrap; gap:5px; margin-bottom:20px; }
.content-tabs a { text-decoration:none; padding:9px 15px; font-size:12px; color:var(--muted); border-radius:8px; }
.content-tabs a[aria-current] { background:var(--primary); color:white; }
.content-empty { text-align:center; padding:40px 10px 50px; }.content-empty h2 { margin-top:22px; }
.empty-symbol { display:grid; place-items:center; width:64px; height:64px; margin:auto; background:var(--soft); color:var(--accent); border:1px solid var(--line); border-radius:16px; font-size:26px; }
.page-row { display:flex; align-items:flex-start; gap:17px; padding:25px 0; border-top:1px solid var(--line); }
.page-icon { display:grid; place-items:center; flex-shrink:0; width:44px; height:49px; background:var(--soft); border:1px solid var(--line); border-radius:9px; font-size:20px; color:var(--accent); }
.page-info { flex:1; min-width:0; overflow-wrap:anywhere; }.page-info strong { font-size:16px; }.page-info strong a { text-decoration:none; }.page-info>span { display:block; color:var(--muted); font-size:12px; }.page-info small { color:var(--muted); font-size:10px; align-self:center; }
.page-row-actions { display:grid; gap:8px; justify-items:end; }.page-row-actions details { max-width:230px; font-size:11px; }.page-row-actions summary { cursor:pointer; text-align:end; color:var(--muted); padding:8px; }.page-row-actions details[open] { padding:12px; background:var(--soft); border-radius:8px; }
.editor-heading { display:flex; gap:20px; align-items:center; justify-content:space-between; margin-bottom:28px; }.editor-heading .member-badges { align-items:center; }.back-link { font-size:11px; text-decoration:none; color:var(--muted); }.editor-heading h1 { max-width:760px; }
.editor-grid { display:grid; grid-template-columns:minmax(0,1fr) 290px; gap:24px; align-items:start; }.editor-document { min-width:0; }.editor-inspector { min-width:0; }.editor-inspector .account-panel { padding:23px; }.editor-inspector .button { width:100%; }.editor-inspector form+form { margin-top:10px; }.editor-inspector h2 { font-size:20px; }.editor-inspector .lead { font-size:12px; margin-bottom:18px; }
.content-block { padding:18px; background:var(--soft); border:1px solid var(--line); border-radius:10px; margin:0 0 14px; display:grid; gap:13px; }.content-block input,.content-block textarea,.content-block select { background:var(--surface); }.block-heading { display:flex; justify-content:space-between; align-items:center; gap:12px; }.block-heading strong { font-size:11px; color:var(--muted); font-weight:600; }
.block-actions { display:flex; gap:5px; flex-shrink:0; }.block-actions button { width:30px; height:30px; border:1px solid var(--line); border-radius:7px; background:var(--surface); color:var(--ink); cursor:pointer; font-size:15px; }.block-actions button:disabled { opacity:.35; cursor:default; }.block-toolbar { display:flex; flex-wrap:wrap; gap:8px; padding-top:12px; }.block-toolbar .button { font-size:11px; min-height:36px; padding:0 10px; }
.editor-save { position:sticky; bottom:12px; display:flex; align-items:center; justify-content:space-between; gap:15px; background:var(--surface); border:1px solid var(--line); border-radius:11px; box-shadow:var(--shadow); padding:14px 18px; z-index:2; }.editor-save span { color:var(--muted); font-size:11px; }.editor-save .button { flex-shrink:0; }.content-workspace .button:disabled { cursor:not-allowed; }
.seo-panel>summary { cursor:pointer; font-size:16px; font-weight:650; }.seo-panel[open] .form-stack { margin-top:24px; }.revision-list { max-height:310px; overflow:auto; }.revision-list details { border-top:1px solid var(--line); padding:12px 0; }.revision-list summary { font-size:12px; cursor:pointer; }.revision-list summary small { display:block; color:var(--muted); font-size:10px; }.translation-links { display:flex; flex-wrap:wrap; gap:7px; margin-bottom:18px; }.translation-links a { padding:5px 9px; font-size:11px; text-decoration:none; background:var(--soft); border:1px solid var(--line); border-radius:6px; }.translation-links a[aria-current] { border-color:var(--accent); }
.menu-row { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:13px 0; border-bottom:1px solid var(--line); }.menu-row .checkbox { color:var(--ink); overflow-wrap:anywhere; }.menu-list { max-height:520px; overflow:auto; }
@media(min-width:1400px) { .dashboard-main { max-width:1300px; }.content-workspace { max-width:1220px; }.editor-grid { grid-template-columns:minmax(0,1fr) 310px; } }
@media(max-width:950px) { .editor-grid { grid-template-columns:minmax(0,1fr) 255px; gap:18px; }.editor-inspector .account-panel { padding:20px; } }
@media(max-width:760px) { .editor-grid { grid-template-columns:1fr; }.editor-inspector { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }.editor-inspector .account-panel { margin:0; }.editor-save { bottom:5px; margin-bottom:8px; }.content-workspace h1 { font-size:29px; }.editor-heading { align-items:flex-start; }.editor-heading>.button { min-width:110px; }.page-row-actions { max-width:120px; } }
@media(max-width:480px) { .content-workspace .dashboard-intro,.editor-heading { flex-direction:column; gap:12px; }.editor-inspector { grid-template-columns:1fr; }.content-tabs a { padding:8px 9px; font-size:11px; }.page-row { flex-wrap:wrap; gap:12px; }.page-row-actions { width:100%; max-width:none; display:flex; align-items:center; justify-content:space-between; }.page-row-actions details { max-width:180px; }.page-info small { display:block; width:100%; }.content-block { padding:13px; }.editor-save { padding:12px; gap:10px; }.editor-save span { max-width:125px; font-size:10px; }.editor-save .button { font-size:11px; padding:0 12px; } }
/* Phase 4: media, design and visual editing */
.editor-heading-actions,.builder-header-actions { display:flex; flex-wrap:wrap; gap:9px; }.editor-heading-actions { justify-content:flex-end; }
.media-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }.media-card { min-width:0; border:1px solid var(--line); border-radius:12px; overflow:hidden; background:var(--surface); }.media-cover { display:block; height:180px; padding:10px; background:var(--soft); }.media-cover img { width:100%; height:100%; object-fit:contain; }.media-meta { padding:18px; }.media-meta>strong,.media-meta>small { display:block; overflow-wrap:anywhere; }.media-meta>small { color:var(--muted); font-size:10px; margin:6px 0 10px; }.media-meta details { margin-top:15px; }.media-meta summary { cursor:pointer; font-size:12px; }.media-meta details .form-stack { margin-top:16px; }.media-delete { padding-top:16px; border-top:1px solid var(--line); }.media-card .badge { display:inline-flex; }.field input[type=file] { padding:10px; height:auto; font-size:12px; }
.media-picker { width:min(940px,94vw); max-height:90vh; overflow:auto; padding:28px; background:var(--surface); color:var(--ink); border:1px solid var(--line); border-radius:18px; box-shadow:0 30px 130px #0005; }.media-picker::backdrop { background:#071b13a6; backdrop-filter:blur(3px); }.media-picker header { display:flex; align-items:center; justify-content:space-between; gap:15px; margin-bottom:18px; }.media-picker h2 { font-size:25px; }.media-picker [role=status] { color:var(--muted); font-size:12px; min-height:18px; }.media-picker footer,.media-picker footer>div { display:flex; gap:10px; flex-wrap:wrap; }.media-picker footer { margin-top:22px; justify-content:space-between; }.picker-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }.picker-item { min-width:0; text-align:start; padding:10px; border:1px solid var(--line); border-radius:10px; color:var(--ink); background:var(--soft); cursor:pointer; }.picker-item:hover { border-color:var(--accent); }.picker-item img { width:100%; height:110px; object-fit:contain; background:var(--surface); border-radius:6px; }.picker-item strong,.picker-item small { display:block; font-size:11px; overflow-wrap:anywhere; margin-top:5px; }.picker-item small { color:var(--muted); font-size:10px; }
.color-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-top:23px; }.color-field { display:flex; align-items:center; gap:11px; font-size:12px; }.color-field input { width:44px; height:44px; padding:3px; background:var(--surface); border:1px solid var(--line); border-radius:9px; cursor:pointer; }.color-field small { display:block; color:var(--muted); font-size:10px; }.design-grid { align-items:start; gap:35px; }.design-grid .account-panel { margin:0; }.design-preview { position:sticky; top:22px; }.design-sample { border:1px solid var(--line); padding:35px; border-radius:14px; background:var(--sample-background); color:var(--sample-text); min-height:490px; }.sample-top { display:flex; justify-content:space-between; padding-bottom:25px; border-bottom:1px solid currentColor; font-size:12px; font-weight:700; }.sample-kicker { display:block; font-size:9px; margin:42px 0 18px; letter-spacing:.12em; }.design-sample h2 { font-family:inherit; color:inherit; font-size:38px; line-height:1.1; letter-spacing:-.04em; }.design-sample p { font-size:12px; opacity:.8; margin:25px 0; }.sample-card { display:flex; gap:14px; align-items:center; padding:20px; background:var(--sample-surface); border-radius:var(--sample-radius); font-size:12px; }.sample-card>span { color:var(--sample-primary); background:var(--sample-secondary); padding:5px 10px; border-radius:var(--sample-radius); font-size:22px; }.sample-button { display:inline-flex; background:var(--sample-primary); color:var(--sample-on-primary); border-radius:var(--sample-radius); padding:13px 20px; margin-top:28px; font-size:11px; font-weight:650; }.design-logo img { max-width:180px; max-height:90px; object-fit:contain; padding:10px; background:var(--soft); border:1px solid var(--line); border-radius:10px; }.classic-image { width:100%; max-height:220px; object-fit:contain; }
.main.builder-main { max-width:1860px; padding:28px; }.builder-main .content-workspace { max-width:none; }.builder-title-row { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:24px; }.builder-title-row h1 { font-size:28px; margin:8px 0; }.builder-header-actions { justify-content:flex-end; }.builder-toolbar { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; padding:12px 17px; background:var(--surface); border:1px solid var(--line); border-radius:12px 12px 0 0; }.builder-toolbar>div { display:flex; gap:6px; }.builder-toolbar .button { padding:0 10px; min-height:34px; font-size:11px; }.builder-toolbar>[role=status] { font-size:10px; color:var(--muted); }.viewport-options { background:var(--soft); padding:4px; border-radius:8px; }.viewport-options button { background:transparent; color:var(--muted); border:0; border-radius:6px; font-size:11px; padding:6px 11px; cursor:pointer; }.viewport-options button[aria-pressed=true] { background:var(--primary); color:white; }
.visual-builder { display:grid; grid-template-columns:210px minmax(0,1fr) 275px; align-items:start; border:1px solid var(--line); border-top:0; background:var(--surface); border-radius:0 0 12px 12px; overflow:hidden; }.builder-library { padding:22px 16px; min-width:0; }.component-library { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; }.component-library button { display:flex; align-items:flex-start; justify-content:center; flex-direction:column; gap:8px; min-height:72px; padding:10px; color:var(--ink); background:var(--soft); border:1px solid var(--line); border-radius:8px; font-size:10px; font-weight:550; cursor:pointer; text-align:start; overflow-wrap:anywhere; }.component-library button>span { font-size:20px; color:var(--accent); line-height:1; }.component-library button:hover { border-color:var(--accent); }.component-library button:disabled { opacity:.4; cursor:default; }
.builder-layers-panel { margin-top:30px; }.builder-layers-panel .section-heading { margin:0; flex-direction:row; align-items:center; gap:5px; }.builder-layers-panel h2 { font-size:17px; }.builder-layers { display:grid; gap:5px; max-height:460px; overflow:auto; }.layer-row { display:flex; align-items:center; gap:7px; text-align:start; min-width:0; padding:10px 6px; color:var(--muted); background:transparent; border:1px solid transparent; border-radius:6px; font-size:10px; cursor:grab; }.layer-row[aria-pressed=true] { background:var(--soft); border-color:var(--secondary); color:var(--accent); }.layer-number { font-size:9px; }.layer-label { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; flex:1; }.layer-grip { opacity:.7; font-size:16px; }.drop-target { outline:2px solid var(--secondary); }.is-dragging { opacity:.45; }
.builder-stage { direction:ltr; height:846px; background:var(--soft); border-inline:1px solid var(--line); padding:12px; overflow:hidden; min-width:0; }.builder-stage iframe { display:block; border:0; background:white; transform-origin:top left; box-shadow:0 2px 10px #0001; }.builder-properties { height:846px; overflow:auto; padding:18px 15px; min-width:0; }.builder-properties .account-panel { border:0; border-radius:0; padding:0 0 22px; margin:0 0 20px; border-bottom:1px solid var(--line); box-shadow:none; background:transparent; }.builder-properties .account-panel h2 { font-size:20px; }.builder-properties .field { font-size:10px; }.builder-properties .field input,.builder-properties .field select { height:37px; font-size:12px; }.builder-properties .field textarea { font-size:12px; }.builder-properties .editor-inspector { display:block; }.builder-properties .editor-inspector .account-panel { padding:0 0 22px; margin:0 0 20px; }.builder-properties .editor-inspector .button { font-size:11px; min-height:37px; }.builder-properties .revision-list { max-height:210px; }.builder-properties .lead { font-size:11px; }.builder-block-actions { display:flex; gap:7px; margin:16px 0; }.builder-block-actions .button { min-height:31px; width:36px; padding:0; font-size:15px; }.property-heading { font-size:12px; margin:4px 0 0; border-top:1px solid var(--line); padding-top:20px; }.property-image { width:100%; height:140px; object-fit:contain; background:var(--soft); border-radius:8px; }.builder-page-fields summary { cursor:pointer; font-weight:650; font-size:13px; }.builder-page-fields[open] summary { margin-bottom:20px; }
@media(max-width:1150px) { .main.builder-main { padding:22px 16px; }.visual-builder { grid-template-columns:155px minmax(0,1fr) 245px; }.builder-library { padding:18px 10px; }.component-library { gap:5px; }.component-library button { font-size:9px; padding:8px; }.builder-toolbar { gap:10px; }.builder-toolbar>[role=status] { width:100%; } }
@media(max-width:850px) { .media-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.picker-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }.visual-builder { grid-template-columns:minmax(0,1fr) 240px; }.builder-library { grid-column:1/-1; display:grid; grid-template-columns:1fr 1fr; gap:20px; border-bottom:1px solid var(--line); padding:18px; }.component-library { grid-template-columns:repeat(4,minmax(0,1fr)); }.component-library button { min-height:62px; }.builder-layers-panel { margin:0; }.builder-layers { max-height:155px; }.builder-stage { border-inline-start:0; }.builder-title-row { flex-direction:column; align-items:flex-start; }.design-preview { position:static; } }
@media(max-width:600px) { .media-grid { grid-template-columns:1fr; }.picker-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.media-picker { padding:20px; }.media-picker footer .button { font-size:10px; padding:0 10px; }.color-grid { grid-template-columns:1fr; }.design-sample { padding:25px; }.visual-builder { display:flex; flex-direction:column; }.builder-library { width:100%; grid-template-columns:1fr; gap:18px; }.component-library { grid-template-columns:repeat(4,minmax(0,1fr)); }.builder-layers { max-height:160px; }.builder-stage { width:100%; height:620px; border:0; border-block:1px solid var(--line); }.builder-properties { width:100%; height:auto; overflow:visible; padding:22px; }.builder-toolbar { padding:12px; gap:12px; }.builder-toolbar .viewport-options { width:100%; justify-content:space-between; }.builder-toolbar>[role=status] { font-size:10px; }.builder-header-actions { justify-content:flex-start; }.builder-header-actions .button { font-size:10px; padding:0 12px; }.main.builder-main { padding:22px 12px; }.builder-title-row h1 { font-size:26px; }.editor-heading-actions { justify-content:flex-start; } }
.component-library button { padding-inline:6px; }
@media(min-width:851px) and (max-width:1150px) { .component-library { grid-template-columns:1fr; }.component-library button { flex-direction:row; justify-content:flex-start; align-items:center; min-height:40px; padding:8px; font-size:10px; }.component-library button>span { width:22px; flex:none; } }
/* AVION AI and inquiry workspace. Reuse theme tokens for light, dark and system. */
.ai-create-grid{grid-template-columns:minmax(0,1.4fr) minmax(260px,.8fr);align-items:start}.ai-provider-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.ai-provider-grid .panel{min-width:0}.ai-provider-grid .section-heading{flex-wrap:wrap;gap:10px}.ai-limits{margin-top:24px}.ai-history{display:grid;gap:0}.ai-history>a{display:flex;gap:15px;align-items:center;justify-content:space-between;padding:14px 0;border-bottom:1px solid var(--line);text-decoration:none}.ai-history small{display:block;color:var(--muted);font-size:10px;margin-top:4px}.ai-steps li,.workflow-list li{margin-block:16px;padding-inline-start:8px}.ai-review-actions{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:26px}.ai-review-actions .lead{margin-bottom:0;max-width:700px}.ai-created-links{display:flex;flex-wrap:wrap;gap:12px;margin:25px 0}.ai-preview-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.ai-page-preview{min-width:0;overflow-wrap:anywhere}.ai-page-preview h2{font-size:27px;letter-spacing:-.03em}.ai-block-preview{border-block:1px solid var(--line);margin-block:20px;padding-block:12px}.ai-block-preview p{white-space:pre-line}.ai-block-preview h2,.ai-block-preview h3{font-size:19px}.ai-block-preview blockquote{margin-inline:0;border-inline-start:3px solid var(--secondary);padding-inline-start:20px}.ai-discard{margin-top:24px}.forms-editor-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(260px,.8fr);align-items:start;gap:24px}.forms-editor-grid aside>.panel{margin-bottom:24px}.inquiry-data{margin-block:20px}.inquiry-data>div{display:grid;grid-template-columns:minmax(130px,.5fr) minmax(0,1fr);gap:20px;padding-block:16px;border-bottom:1px solid var(--line)}.inquiry-data dt{color:var(--muted);font-size:12px}.inquiry-data dd{margin:0;overflow-wrap:anywhere}.form-picker{width:min(520px,92vw);max-height:85vh;overflow:auto;color:var(--ink);background:var(--surface);margin:auto}.form-picker::backdrop{background:#061c16aa}
@media(max-width:1000px){.ai-provider-grid{grid-template-columns:1fr}.ai-create-grid,.forms-editor-grid{grid-template-columns:1fr}.ai-preview-list{grid-template-columns:1fr}.ai-review-actions{align-items:start;flex-direction:column}}@media(max-width:520px){.inquiry-data>div{grid-template-columns:1fr;gap:6px}.ai-history>a{align-items:start;flex-direction:column}.form-picker .section-heading h2{font-size:21px}}
.privacy-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:1.25rem;margin-bottom:1.25rem}.captcha-provider-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.25rem;margin:1.25rem 0}.privacy-translations{border:1px solid var(--border);border-radius:12px;padding:1.25rem}.privacy-translations summary{cursor:pointer;font-weight:600}.privacy-translations fieldset{border:1px solid var(--border);border-radius:8px;padding:1rem;margin:1rem 0}.privacy-provider{display:block;margin-top:.25rem}.captcha-provider-grid input{min-width:0}
@media(max-width:1050px){.captcha-provider-grid{grid-template-columns:1fr}.privacy-grid{grid-template-columns:1fr}}
@media(min-width:851px){.component-library{max-height:310px;overflow-y:auto;padding:1px}.builder-layers{scrollbar-gutter:stable}}
.table-scroll{width:100%;overflow-x:auto}.table-scroll table{width:100%;border-collapse:collapse;font-size:12px;text-align:start}.table-scroll th{font-size:10px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);padding:14px 12px;border-bottom:1px solid var(--line);text-align:start;white-space:nowrap}.table-scroll td{padding:16px 12px;border-bottom:1px solid var(--line);vertical-align:top}.table-scroll tr:last-child td{border-bottom:0}.privacy-translations,.privacy-translations fieldset{border-color:var(--line)}

/* R1: module and integration management uses the existing theme tokens. */
.r1-header{margin-bottom:24px}.r1-header h1{margin:8px 0 12px}.r1-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,310px),1fr));gap:20px;align-items:start}.r1-card{height:auto}.r1-card-title{display:flex;align-items:start;justify-content:space-between;gap:12px}.r1-card-title h2{margin-top:0}.r1-facts{display:grid;grid-template-columns:1fr 1fr;gap:8px;font-size:.9rem}.r1-facts dd{margin:0;text-align:end;overflow-wrap:anywhere}.r1-facts dt{opacity:.75}.r1-actions{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}.r1-table-wrap{max-width:100%;overflow-x:auto;border-radius:16px}.r1-table{width:100%;border-collapse:collapse;text-align:start}.r1-table th,.r1-table td{padding:16px;border-bottom:1px solid var(--border,#d7ddd6);vertical-align:top}.r1-table th{font-size:.82rem}.r1-table small{display:block;overflow-wrap:anywhere;max-width:240px;opacity:.7;margin-top:5px}.r1-table .field{min-width:150px}.r1-entry{padding:14px 0;border-bottom:1px solid var(--border,#d7ddd6)}.r1-entry p{overflow-wrap:anywhere}.r1-entry small{display:block;margin-top:8px;opacity:.7}.r1-counts{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0}.r1-code{display:block;padding:14px;border-radius:10px;overflow-wrap:anywhere;background:var(--bg,#e8eae5)}.r1-grid code{overflow-wrap:anywhere}.r1-grid form{margin-top:12px}.r1-grid h2{overflow-wrap:anywhere}[data-one-time-secret]{min-height:100px;font-family:monospace;word-break:break-all}.r1-grid .button{white-space:normal}

/* R2: personal administration */
.r2-tools{max-width:1160px;margin:auto}.r2-tools header{margin-bottom:28px}.r2-columns{display:grid;grid-template-columns:2fr 1fr;gap:24px;align-items:start}.r2-results{list-style:none;padding:0;display:grid;gap:14px}.r2-results h2{font-size:1.1rem}.r2-results li{overflow-wrap:anywhere}.r2-results small{display:block;opacity:.7;margin-top:8px}.r2-notification{padding:24px;margin:16px 0}.r2-search{display:flex;gap:16px;align-items:end;padding:24px}.r2-search .field{flex:1}.r2-stats{grid-template-columns:repeat(auto-fit,minmax(130px,1fr))}.r2-login-logo{max-width:180px;max-height:90px;object-fit:contain;margin:16px auto;display:block}.r2-organization{font-weight:700}.r2-login-split{max-width:820px;border-inline-start:10px solid var(--primary,#00412e)}.r2-tools :focus-visible{outline:3px solid var(--secondary,#96bf8a);outline-offset:3px}.r2-tools .field textarea{width:100%}.pub-captcha{padding:16px;border:1px solid var(--border);border-radius:12px}.pub-captcha [data-captcha-mount]{max-width:100%;overflow:auto}
@media(max-width:740px){.r2-columns{grid-template-columns:1fr}.r2-search{flex-direction:column;align-items:stretch}.r2-login-split{border-inline-start-width:5px}.r2-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* Logical layout keeps controls usable in RTL and narrow viewports. */
.code-scroll{max-height:20rem;max-width:100%;overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere;text-align:start}.table-scroll{max-width:100%;overflow:auto}.table-scroll table{width:100%;border-collapse:collapse}.table-scroll th,.table-scroll td{padding:.8rem;text-align:start;vertical-align:top;border-bottom:1px solid var(--line)}input[type=email],input[type=url],input[type=tel],input[name=factor],code{direction:ltr;unicode-bidi:isolate;text-align:start}input[dir],textarea[dir]{text-align:start}.directional-icon{display:inline-block}html[dir=rtl] .directional-icon{transform:scaleX(-1)}[dir=rtl] .builder-properties,[dir=rtl] .builder-layers{text-align:start}.panel pre,.panel textarea{max-width:100%}
.nested-layer{padding-inline-start:1.8rem!important;border-inline-start:2px solid var(--primary)}.diff-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.diff-grid pre{white-space:pre-wrap;overflow-wrap:anywhere;max-height:24rem;overflow:auto}.diff-changed{border-inline-start:3px solid var(--primary);padding-inline-start:.75rem}@media(max-width:760px){.diff-grid{grid-template-columns:1fr}}
.code-workspace{display:grid;grid-template-columns:minmax(180px,1fr) minmax(0,4fr);gap:1.5rem;align-items:start}.code-tree{padding:0;list-style:none;overflow-wrap:anywhere}.code-tree li{margin-block:.8rem}.code-tree small{display:block}.code-workspace textarea,.code-highlight{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:14px;line-height:1.6;tab-size:2}.code-keyword{color:var(--code-keyword);font-weight:bold}.code-string{color:var(--code-string)}.code-comment{color:var(--code-comment)}@media(max-width:760px){.code-workspace{grid-template-columns:1fr}}
.account-nav{flex-wrap:nowrap;overflow-x:auto;max-width:100%;scrollbar-width:thin}.account-nav>a,.account-nav>form{flex:none;white-space:nowrap}.account-nav form{margin-inline-start:0}.actions{display:flex;flex-wrap:wrap;gap:.65rem;align-items:center;margin-block:.75rem}.code-workspace>*,.r2-grid>*{min-width:0}
.code-tree .code-tree{padding-inline-start:.75rem;border-inline-start:1px solid var(--line);margin-inline-start:.35rem}.code-tree summary{cursor:pointer;font-size:.85rem;font-weight:650}
.code-workspace{grid-template-columns:minmax(230px,1fr) minmax(0,3fr);margin-block-end:1.5rem}.code-workspace>aside{padding:24px}.code-workspace>aside h2{font-size:21px;overflow-wrap:anywhere}.code-workspace>aside form{display:grid;gap:.75rem;margin-block-end:.75rem}.code-workspace>div{display:grid;gap:1.5rem}.code-workspace>div>.panel{max-width:none}.code-workspace h2{overflow-wrap:anywhere}@media(max-width:760px){.code-workspace{grid-template-columns:1fr}}

.r2-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:20px;margin-block-end:24px}.r2-grid>.panel{max-width:none;padding:24px;overflow-wrap:anywhere}.r2-grid h2{font-size:24px}.r3-format-status{font-size:.85rem;color:var(--muted)}

.ai-change-form{margin-block-start:28px}.ai-field-change{padding-block:20px;border-block-end:1px solid var(--line);min-inline-size:0}.ai-field-change .checkbox{overflow-wrap:anywhere}.ai-field-comparison{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin-block-start:16px}.ai-field-comparison p{white-space:pre-wrap;overflow-wrap:anywhere;max-block-size:340px;overflow:auto}.ai-field-comparison>div{min-inline-size:0} @media(max-width:640px){.ai-field-comparison{grid-template-columns:1fr}}
.ai-profile>summary{cursor:pointer;font-weight:600;padding-block:10px}.ai-profile>.form-stack{padding-block:14px;border-block:1px solid var(--line)}.ai-provider-grid .summary-list{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;font-size:13px}.ai-provider-grid .summary-list dt{color:var(--muted)}.ai-provider-grid .summary-list dd{margin:0;text-align:end;overflow-wrap:anywhere}.ai-usage-history{margin-top:24px;min-width:0}.ai-usage-history small{display:block;margin-top:5px;color:var(--muted);overflow-wrap:anywhere}

/* Arabic joins must retain their natural spacing; branding keeps its own metrics. */
:lang(ar) :is(h1,h2,h3,.eyebrow,.table-scroll th){letter-spacing:normal}

/* Shop catalogue uses the shared light/dark/system variables. */
.shop-admin-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:20px}
.shop-filter{display:flex;flex-wrap:wrap;align-items:end;gap:16px}.shop-filter .field{flex:1;min-width:min(220px,100%)}
.shop-language,.shop-variant{border:1px solid var(--line);border-radius:12px;margin-block:20px;padding:20px;min-width:0}
.shop-language legend,.shop-variant legend{font-weight:700;padding-inline:8px}.shop-variant{background:var(--soft)}
.shop-save{display:flex;gap:20px;align-items:center;justify-content:space-between;flex-wrap:wrap}.shop-archive{margin-top:24px}
@media(max-width:600px){.shop-language,.shop-variant{padding:12px}.shop-save .button{width:100%}}

.commerce-public{max-width:70rem;margin:2rem auto;padding:1.5rem}.commerce-public nav{display:flex;gap:1rem;flex-wrap:wrap;margin-bottom:2rem}.commerce-public .stack,.commerce-public form{display:grid;gap:1rem}.commerce-public label{display:grid;gap:.4rem}.commerce-public input,.commerce-public textarea{max-width:100%}.commerce-public table{width:100%}@media print{.commerce-public nav,.commerce-public button{display:none}.commerce-public{margin:0}}

.phase-area{width:100%;max-width:1100px;margin-inline:auto;min-width:0}.phase-area .card{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:24px;margin-block:20px;overflow-wrap:anywhere;min-width:0}.phase-area .stack{display:grid;gap:16px}.phase-area label{display:grid;gap:6px;font-size:13px;font-weight:600}.phase-area label:has(input[type=checkbox]){display:flex;align-items:start;gap:10px}.phase-area input:not([type=checkbox]),.phase-area select,.phase-area textarea{width:100%;min-width:0;max-width:100%;padding:11px 12px;background:var(--soft);color:var(--ink);border:1px solid var(--line);border-radius:8px;font:inherit}.phase-area textarea{resize:vertical;min-height:90px}.phase-area .actions{display:flex;gap:12px;flex-wrap:wrap}.phase-area fieldset{border:1px solid var(--line);border-radius:9px;padding:15px;display:grid;gap:12px;min-width:0}.phase-area h2{font-size:23px;letter-spacing:-.02em}.phase-area table{border-collapse:collapse;display:block;overflow-x:auto;width:100%}.phase-area td,.phase-area th{padding:10px;text-align:start;border-bottom:1px solid var(--line)}.phase-area .alert{padding:15px;border-radius:10px;background:var(--soft)}.phase-area .alert.error{background:var(--error-bg);color:var(--error-ink)}@media(max-width:600px){.phase-area .card{padding:16px}.commerce-public{padding:16px;margin-block:16px}}

/* R3: bidi-safe technical values, focus visibility and narrow-screen reflow. */
bdi{unicode-bidi:isolate}input[type=number],input[type=date],input[type=datetime-local],input[type=password],input[inputmode=decimal],input[inputmode=numeric]{direction:ltr;unicode-bidi:isolate;text-align:start}
:focus-visible,.r2-tools :focus-visible{outline-color:var(--accent)}.button.primary:focus-visible{outline:3px solid var(--accent);outline-offset:4px}
.account-nav{scroll-padding-inline:16px}.account-nav a:focus-visible,.account-nav button:focus-visible{outline-offset:-3px}
.regional-preview{border:1px solid var(--line);border-radius:10px;padding:16px;overflow-wrap:anywhere}.regional-preview dl{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:8px}.regional-preview dd{margin:0}.phase-area select,.phase-area button{overflow-wrap:anywhere}.phase-area option{unicode-bidi:plaintext}
.commerce-public .skip-link{inset-block-start:-80px}.commerce-public .skip-link:focus{inset-block-start:10px}
@media(max-width:400px){.topbar{flex-wrap:wrap}.preferences{margin-inline-start:auto;max-width:100%;flex-wrap:wrap}.regional-preview dl{grid-template-columns:1fr}.phase-area .actions>*{max-width:100%}.phase-area h1{font-size:28px;overflow-wrap:anywhere}}
html[dir=rtl] :is(.phase-area h1,.phase-area h2,.phase-area h3){letter-spacing:normal}
/* Long SKU values and translated stock actions must fit a narrow card. */
.dashboard-main>*{min-inline-size:0}.panel,.page-heading{overflow-wrap:anywhere;min-inline-size:0}.shop-admin-grid .button{white-space:normal;max-inline-size:100%}

.operations-tools{overflow-wrap:anywhere}.operations-tools .r2-columns{grid-template-columns:minmax(0,2fr) minmax(0,1fr)}.operations-tools .r2-columns>section{min-inline-size:0}.operations-tools .button{white-space:normal;max-inline-size:100%;padding-block:10px}.operations-tools fieldset{min-inline-size:0}@media(max-width:740px){.operations-tools .r2-columns{grid-template-columns:minmax(0,1fr)}}

/* Grouped CMS navigation. Installer navigation keeps its independent layout. */
.admin-shell { display:grid; grid-template-columns:252px minmax(0,1fr); }
.admin-shell.nav-collapsed { grid-template-columns:minmax(0,1fr); }
.admin-shell>.workspace { container:admin-workspace / inline-size; }
.admin-sidebar { position:sticky; top:0; height:100vh; height:100dvh; min-width:0; display:flex; flex-direction:column; background:var(--surface); border-inline-end:1px solid var(--line); z-index:30; }
.admin-sidebar-header { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:84px; padding:18px 22px; border-block-end:1px solid var(--line); flex-shrink:0; }
.admin-sidebar .brand { font-size:17px; gap:11px; }
.admin-sidebar .brand-mark { width:33px; height:37px; font-size:22px; }
.admin-sidebar .brand small { color:var(--muted); margin-top:-3px; }
.admin-sidebar .account-nav { display:block; flex:1; min-height:0; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:var(--line) transparent; padding:16px 12px; border:0; }
.nav-group { padding-block:4px; }
.nav-group>summary { display:flex; align-items:center; justify-content:space-between; gap:8px; min-height:36px; padding:7px 10px; color:var(--muted); font-size:10px; font-weight:750; letter-spacing:.09em; line-height:1.5; text-transform:uppercase; list-style:none; cursor:pointer; border-radius:6px; }
.nav-group>summary::-webkit-details-marker { display:none; }
.nav-group>summary>.nav-icon { width:13px; height:13px; transform:rotate(-90deg); transition:transform .15s; }
[dir=rtl] .nav-group>summary>.nav-icon { transform:rotate(90deg); }
.nav-group[open]>summary>.nav-icon { transform:rotate(0); }
.nav-group>summary:hover { background:var(--soft); color:var(--ink); }
.nav-group ul { list-style:none; margin:0; padding:2px 0 6px; }
.nav-group li { margin:2px 0; }
.admin-sidebar .account-nav a { position:relative; display:flex; align-items:center; gap:11px; min-height:40px; padding:9px 11px; border-radius:7px; font-size:12px; line-height:1.5; font-weight:500; color:var(--muted); text-decoration:none; }
.admin-sidebar .account-nav a:hover { color:var(--ink); background:var(--soft); }
.admin-sidebar .account-nav a[aria-current=page] { background:var(--soft); color:var(--accent); font-weight:700; box-shadow:none; }
.admin-sidebar .account-nav a[aria-current=page]::before { content:''; position:absolute; inset-inline-start:0; inset-block:9px; width:3px; border-radius:3px; background:var(--accent); }
.nav-link-label { min-width:0; overflow-wrap:anywhere; }
.nav-icon { width:18px; height:18px; flex-shrink:0; vertical-align:middle; }
.admin-sidebar .badge { margin-inline-start:auto; flex-shrink:0; font-size:10px; padding:1px 6px; }
.admin-sidebar :focus-visible { outline:2px solid var(--accent); outline-offset:-2px; }
.admin-sidebar-footer { border-block-start:1px solid var(--line); padding:12px; flex-shrink:0; }
.nav-avatar { display:grid; place-items:center; width:32px; height:32px; border-radius:10px; flex-shrink:0; color:var(--primary); background:var(--secondary); font-weight:750; text-transform:uppercase; }
.nav-footer-button { display:flex; align-items:center; gap:11px; width:100%; min-height:36px; padding:8px 10px; border:0; border-radius:7px; background:transparent; color:var(--muted); font-size:12px; text-align:start; }
.nav-footer-button:hover { background:var(--soft); color:var(--ink); }
.nav-collapse .nav-icon { width:16px; height:16px; }
[dir=rtl] .nav-collapse .nav-icon { transform:scaleX(-1); }
.nav-icon-button { display:inline-flex; justify-content:center; align-items:center; width:38px; height:38px; padding:8px; flex-shrink:0; background:var(--surface); color:var(--ink); border:1px solid var(--line); border-radius:8px; }
.nav-icon-button:hover { background:var(--soft); }
.admin-shell .topbar { position:sticky; top:0; z-index:20; background:var(--surface); border-block-end:1px solid var(--line); padding:18px 28px; }
.admin-shell .preferences { flex-wrap:wrap; justify-content:flex-end; }
.nav-backdrop { position:fixed; inset:0; z-index:35; background:#0007; border:0; width:100%; height:100%; cursor:default; }
body.has-navigation-dialog { overflow:hidden; }
@media (min-width:1200px) { .nav-mobile-close { display:none; } }
@media (max-width:1199px) {
  .admin-shell { display:block; }
  .admin-sidebar { position:relative; height:auto; }
  .admin-shell.nav-ready .admin-sidebar { position:fixed; inset-block:0; inset-inline-start:0; height:100vh; height:100dvh; width:min(290px,calc(100vw - 36px)); z-index:40; box-shadow:var(--shadow); }
  .admin-sidebar-header { min-height:76px; padding:17px 20px; }
}
@media (max-width:600px) {
  .admin-shell .topbar { padding:12px; min-height:68px; gap:10px; }
  .admin-shell .preferences { gap:5px; min-width:0; }
  .admin-shell .preferences select { max-width:104px; }
  .admin-sidebar .account-nav a { min-height:44px; font-size:13px; }
  .nav-group>summary { min-height:40px; }
}
/* The desktop sidebar reduces the editor's available space independently of the viewport. */
@container admin-workspace (max-width:1050px) {
  .visual-builder { grid-template-columns:150px minmax(0,1fr) 235px; }
  .builder-library { padding:18px 10px; }
  .component-library { grid-template-columns:1fr; }
  .builder-title-row { flex-wrap:wrap; }
}
@container admin-workspace (max-width:850px) {
  .visual-builder { grid-template-columns:minmax(0,1fr) 240px; }
  .builder-library { grid-column:1/-1; display:grid; grid-template-columns:1fr 1fr; gap:20px; border-bottom:1px solid var(--line); padding:18px; }
  .component-library { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .builder-layers-panel { margin:0; }
  .builder-title-row { flex-direction:column; align-items:flex-start; }
}
@container admin-workspace (max-width:600px) {
  .visual-builder { display:flex; flex-direction:column; }
  .builder-library { grid-template-columns:1fr; }
}
.form-field-list { list-style:none; margin:0; padding:0; display:grid; gap:10px; }
.form-field-item { border:1px solid var(--line); border-radius:8px; padding:10px 12px; background:var(--surface); }
.form-field-item > details { margin-top:8px; }
.form-field-bar { display:flex; align-items:center; gap:8px; min-width:0; flex-wrap:wrap; }
.form-field-bar [data-field-grip] { cursor:grab; }
.form-field-title { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:600; }
.form-field-tools { display:inline-flex; gap:4px; }
.form-field-tools .button { min-width:36px; padding-inline:8px; }
.form-sender { border:1px solid var(--line); border-radius:8px; padding:12px; }
.form-sender[hidden], .form-field-item [hidden] { display:none; }
[data-field-js][hidden], [data-field-hint][hidden] { display:none; }
.phase-area label:has(input[type=radio]){display:flex;align-items:start;gap:10px}.phase-area input[type=radio]{width:auto;padding:0;margin-top:3px}.phase-area caption{text-align:start;font-weight:600;padding-block:8px}
.brand-logo{display:block;width:auto;max-width:132px;height:38px;object-fit:contain}.brand-name{letter-spacing:.02em;white-space:normal;overflow-wrap:anywhere}.inquiry-notes p{white-space:normal;overflow-wrap:anywhere;margin:6px 0}.inquiry-notes form{margin-top:6px}
/* Admin shell 0.27: header bar with search, status, language, notifications and user menu (AVION Control Panel look). */
.admin-shell { grid-template-columns:244px minmax(0,1fr); }
.admin-sidebar-header { min-height:62px; padding:10px 16px; }
.admin-sidebar .brand { font-size:15px; gap:11px; letter-spacing:.06em; }
.admin-sidebar .brand-mark { width:34px; height:34px; border-radius:9px; font-size:19px; }
.admin-sidebar .brand small { color:var(--accent); font-size:11px; font-weight:600; letter-spacing:.03em; margin-top:-1px; }
.admin-sidebar .account-nav { padding:10px; }
.nav-group { padding-block:2px; }
.nav-group>summary { min-height:32px; padding:6px 8px; font-size:11px; letter-spacing:.1em; }
.admin-sidebar .account-nav a { min-height:38px; padding:8px 10px; gap:12px; font-size:13.5px; border-radius:8px; }
.admin-sidebar .account-nav a[aria-current=page] { background:var(--nav-active); color:var(--nav-active-ink); font-weight:600; }
.admin-sidebar .account-nav a[aria-current=page]::before { inset-block:7px; background:var(--nav-active-ink); }
.admin-sidebar-footer { padding:10px; }
.nav-version { margin:4px 10px 2px; color:var(--muted); font-size:10px; overflow-wrap:anywhere; }
.admin-shell .topbar.admin-topbar { position:sticky; top:0; z-index:25; height:62px; min-height:62px; padding:0 24px; gap:16px; flex-wrap:nowrap; background:var(--surface); border-block-end:1px solid var(--line); }
.topbar-start { display:flex; align-items:center; gap:12px; flex:1; min-width:0; }
.topbar-end { display:flex; align-items:center; gap:8px; flex-shrink:0; }
.topbar-search { position:relative; flex:1; min-width:0; max-width:340px; }
.topbar-search>.nav-icon { position:absolute; inset-inline-start:12px; top:50%; width:16px; height:16px; transform:translateY(-50%); color:var(--muted); pointer-events:none; }
.topbar-search input, .language-search input { width:100%; height:38px; padding-inline:38px 12px; border:1px solid var(--line); border-radius:9px; background:var(--bg); color:var(--ink); font-size:13px; }
.topbar-search input::placeholder, .language-search input::placeholder { color:var(--muted); opacity:1; }
.topbar-search input:focus-visible, .language-search input:focus-visible { outline:2px solid var(--accent); outline-offset:0; border-color:var(--accent); }
.topbar-icon { position:relative; display:inline-grid; place-items:center; width:38px; height:38px; padding:0; border:1px solid transparent; border-radius:9px; background:transparent; color:var(--muted); cursor:pointer; list-style:none; text-decoration:none; }
.topbar-icon:hover, .language-trigger:hover, .user-trigger:hover { background:var(--soft); color:var(--ink); }
.topbar-icon>.nav-icon { width:19px; height:19px; }
.topbar-menu>summary { list-style:none; }
.topbar-menu>summary::-webkit-details-marker { display:none; }
.topbar-search-link { display:none; }
.topbar-badge { position:absolute; top:-2px; inset-inline-end:-4px; direction:ltr; unicode-bidi:isolate; min-width:17px; height:17px; padding:0 4px; border-radius:9px; background:#d93036; color:#fff; font-size:10px; font-weight:750; line-height:17px; text-align:center; }
.status-pill { position:relative; display:inline-flex; align-items:center; gap:8px; height:32px; padding:0 12px; border:1px solid color-mix(in srgb, var(--accent) 45%, transparent); border-radius:8px; background:color-mix(in srgb, var(--accent) 10%, transparent); color:var(--accent); font-size:12px; font-weight:650; text-decoration:none; white-space:nowrap; }
.status-pill .status-dot { background:currentColor; }
.status-pill.warning { color:var(--warn); border-color:color-mix(in srgb, var(--warn) 50%, transparent); background:color-mix(in srgb, var(--warn) 10%, transparent); }
.topbar-language { display:flex; align-items:center; }
.language-trigger { display:inline-flex; align-items:center; gap:7px; height:38px; padding:0 9px; border:1px solid transparent; border-radius:9px; background:transparent; color:var(--ink); font-size:14px; font-weight:650; cursor:pointer; }
.language-trigger>.nav-icon { width:14px; height:14px; color:var(--muted); }
.flag { display:block; width:20px; height:14px; border-radius:2px; flex-shrink:0; }
.admin-topbar .language-fallback select { max-width:130px; }
.topbar-menu { position:relative; }
.user-trigger { display:flex; align-items:center; gap:10px; min-height:44px; padding:4px 8px 4px 4px; border:1px solid transparent; border-radius:10px; background:transparent; color:var(--ink); cursor:pointer; text-align:start; font:inherit; }
.user-trigger .nav-avatar { width:32px; height:32px; border-radius:9px; color:#fff; background:linear-gradient(135deg, #1f9d6b, #00412e); }
.user-trigger-text { display:grid; min-width:0; line-height:1.25; }
.user-trigger-text strong { max-width:170px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:13px; font-weight:650; }
.user-trigger-text small { color:var(--muted); font-size:11px; }
.user-trigger>.nav-icon { width:14px; height:14px; color:var(--muted); transition:transform .15s; }
.user-trigger[aria-expanded=true]>.nav-icon, .topbar-menu[open]>.user-trigger>.nav-icon { transform:rotate(180deg); }
.menu-panel { position:absolute; top:calc(100% + 9px); inset-inline-end:0; z-index:50; width:290px; max-width:calc(100vw - 20px); overflow:hidden; background:var(--surface); border:1px solid var(--line); border-radius:12px; box-shadow:var(--menu-shadow); }
.notification-panel { width:360px; }
.menu-panel :focus-visible { outline:2px solid var(--accent); outline-offset:-2px; }
.menu-panel-head { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:13px 16px; border-block-end:1px solid var(--line); font-size:13px; }
.menu-mark-all button { padding:4px 6px; border:0; border-radius:6px; background:none; color:var(--accent); font-size:12px; font-weight:650; cursor:pointer; }
.menu-empty { margin:0; padding:22px 16px; color:var(--muted); font-size:12px; }
.notification-list { list-style:none; margin:0; padding:6px; max-height:min(360px, 60vh); overflow-y:auto; }
.notification-list li { display:flex; align-items:flex-start; gap:2px; border-radius:8px; }
.notification-list li:hover { background:var(--soft); }
.notification-list a { display:flex; flex:1; gap:10px; min-width:0; padding:9px 10px; color:var(--ink); font-size:12px; text-decoration:none; }
.notification-dot { width:7px; height:7px; margin-top:6px; border-radius:50%; flex-shrink:0; }
.notification-list .unread .notification-dot { background:var(--accent); }
.notification-text { display:grid; min-width:0; }
.notification-text strong { font-weight:500; overflow-wrap:anywhere; }
.notification-list .unread .notification-text strong { font-weight:700; }
.notification-text small { color:var(--muted); font-size:11px; }
.menu-mark button { display:grid; place-items:center; width:32px; height:32px; margin:4px; border:0; border-radius:7px; background:transparent; color:var(--muted); cursor:pointer; }
.menu-mark button:hover { background:var(--surface); color:var(--accent); }
.menu-mark .nav-icon { width:16px; height:16px; }
.menu-footer-link { display:block; padding:12px 16px; border-block-start:1px solid var(--line); color:var(--accent); font-size:12px; font-weight:650; text-align:center; text-decoration:none; }
.menu-footer-link:hover { background:var(--soft); }
.user-panel-head { display:grid; gap:2px; padding:14px 16px; border-block-end:1px solid var(--line); }
.user-panel-head small, .user-email { color:var(--muted); font-size:11px; overflow-wrap:anywhere; }
.user-email { font-size:12px; }
.user-panel-head strong { font-size:14px; overflow-wrap:anywhere; }
.user-panel-head .badge { justify-self:start; margin-top:7px; padding:2px 8px; border-radius:6px; font-size:10px; font-weight:650; color:var(--accent); background:color-mix(in srgb, var(--accent) 12%, transparent); border-color:color-mix(in srgb, var(--accent) 35%, transparent); }
.menu-links { list-style:none; margin:0; padding:6px; }
.menu-links a, .menu-logout button { display:flex; align-items:center; gap:12px; width:100%; min-height:40px; padding:8px 10px; border:0; border-radius:8px; background:transparent; color:var(--ink); font-size:13px; text-align:start; text-decoration:none; cursor:pointer; }
.menu-links a:hover, .menu-logout button:hover { background:var(--soft); }
.menu-links a[aria-current=page] { color:var(--accent); font-weight:650; }
.menu-links .nav-icon, .menu-logout .nav-icon { width:17px; height:17px; color:var(--muted); }
.menu-meta { margin:0; padding:8px 16px; border-block-start:1px solid var(--line); color:var(--muted); font-size:10px; }
.menu-logout { padding:6px; border-block-start:1px solid var(--line); }
.menu-logout button, .menu-logout button .nav-icon { color:var(--danger); font-weight:600; }
.language-dialog { width:min(660px, calc(100vw - 24px)); max-height:calc(100dvh - 32px); padding:0; overflow:auto; border:1px solid var(--line); border-radius:16px; background:var(--surface); color:var(--ink); box-shadow:0 30px 90px #0007; }
.language-dialog::backdrop { background:#05070acc; }
.language-dialog-body { display:grid; gap:16px; padding-bottom:20px; }
.language-dialog-head { display:flex; align-items:center; justify-content:space-between; gap:12px; padding-block:12px; padding-inline:24px 14px; border-block-end:1px solid var(--line); }
.language-dialog-head h2 { margin:0; font-size:16px; font-weight:700; letter-spacing:0; line-height:1.4; }
.language-search { position:relative; margin:4px 24px 0; }
.language-search>.nav-icon { position:absolute; inset-inline-start:13px; top:50%; width:16px; height:16px; transform:translateY(-50%); color:var(--muted); pointer-events:none; }
.language-search input { height:44px; padding-inline:40px 12px; }
.language-options { list-style:none; display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:4px 8px; margin:0; padding:2px 24px; max-height:min(420px, calc(100dvh - 270px)); overflow-y:auto; }
.language-option { display:flex; align-items:center; gap:10px; width:100%; min-height:42px; padding:8px 12px; border:0; border-radius:8px; background:transparent; color:var(--ink); font-size:13px; text-align:start; cursor:pointer; }
.language-option:hover { background:var(--soft); }
.language-option:focus-visible { outline:2px solid var(--accent); outline-offset:-2px; }
.language-option[aria-current=true] { background:var(--nav-active); color:var(--nav-active-ink); font-weight:650; }
.language-option>span { flex:1; min-width:0; overflow-wrap:anywhere; }
.language-option>.nav-icon { width:16px; height:16px; }
.language-empty { margin:0 24px; color:var(--muted); font-size:12px; }
.language-more { display:flex; align-items:center; justify-content:center; gap:8px; min-height:42px; margin:0 24px; border:1px solid var(--line); border-radius:10px; background:var(--bg); color:var(--ink); font-size:13px; font-weight:600; cursor:pointer; }
.language-more:hover { background:var(--soft); }
.language-more>.nav-icon { width:15px; height:15px; }
.theme-cards { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:12px; margin:0; padding:0; border:0; }
.theme-card { position:relative; cursor:pointer; }
.theme-card>input { position:absolute; inset:0; width:100%; height:100%; margin:0; opacity:0; cursor:pointer; }
.theme-card-body { display:grid; gap:9px; height:100%; padding:12px; border:1px solid var(--line); border-radius:12px; background:var(--surface); }
.theme-card>input:checked+.theme-card-body { border-color:var(--accent); background:var(--soft); box-shadow:inset 0 0 0 1px var(--accent); }
.theme-card>input:focus-visible+.theme-card-body { outline:3px solid var(--accent); outline-offset:3px; }
.theme-sample { display:grid; grid-template-columns:30% 1fr; grid-template-rows:12px 1fr; gap:4px; height:72px; padding:6px; border:1px solid var(--line); border-radius:8px; }
.theme-sample i { border-radius:3px; }
.theme-sample i:first-child { grid-row:1 / 3; }
.theme-sample-light { background:#eef1ed; }.theme-sample-light i { background:#fff; border:1px solid #d5ddd4; }
.theme-sample-dark { background:#0f1114; }.theme-sample-dark i { background:#1e2228; border:1px solid #2d333b; }
.theme-sample-system { background:linear-gradient(135deg, #eef1ed 50%, #0f1114 50%); }.theme-sample-system i { background:#8a949e66; }
.theme-card-title { display:flex; align-items:center; gap:8px; font-size:13px; }
.theme-card-title .nav-icon { width:17px; height:17px; color:var(--muted); }
.theme-card-title .nav-icon:last-child { margin-inline-start:auto; color:var(--accent); opacity:0; }
.theme-card>input:checked+.theme-card-body .theme-card-title .nav-icon:last-child { opacity:1; }
.theme-card small { color:var(--muted); font-size:11px; line-height:1.5; }
@media (max-width:1199px) { .admin-shell .topbar.admin-topbar { padding:0 16px; } }
@media (max-width:900px) {
  .status-pill { width:32px; padding:0; justify-content:center; }
  .status-pill>span:not(.status-dot) { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
  .user-trigger-text { display:none; }
  .theme-cards { grid-template-columns:1fr; }
}
@media (max-width:600px) {
  .admin-shell .topbar.admin-topbar { height:56px; min-height:56px; padding:0 8px; gap:4px; }
  .topbar-search { display:none; }
  .topbar-search-link { display:inline-grid; }
  .topbar-end { gap:2px; }
  .language-trigger { padding:0 6px; gap:5px; }
  .language-trigger>.nav-icon, .user-trigger>.nav-icon { display:none; }
  .user-trigger { padding:4px; gap:4px; }
  .menu-panel, .notification-panel { position:fixed; top:60px; inset-inline:8px; width:auto; max-width:none; }
  .language-options { grid-template-columns:repeat(2, minmax(0, 1fr)); padding-inline:16px; }
  .language-search, .language-more, .language-empty { margin-inline:16px; }
  .language-dialog-head { padding-inline-start:16px; }
}
@media (max-width:380px) { .language-options { grid-template-columns:1fr; } .status-pill { display:none; } }