:root {
  color-scheme: dark;
  --ink: #f5f7fb;
  --muted: #98a2b3;
  --muted-2: #667085;
  --line: rgba(255, 255, 255, 0.09);
  --panel: #11151c;
  --panel-2: #171c25;
  --surface: #0b0e13;
  --lime: #bcf45f;
  --cyan: #74e5ff;
  --orange: #ffb868;
  --violet: #b5a0ff;
  --red: #ff7c83;
  --shadow: 0 24px 80px rgba(0, 0, 0, 0.28);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html { min-width: 320px; background: var(--surface); }
body { margin: 0; min-height: 100vh; color: var(--ink); background: var(--surface); }
button, input { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
button:focus-visible, a:focus-visible, input:focus-visible { outline: 2px solid var(--lime); outline-offset: 3px; }
[hidden] { display: none !important; }

.brand { display: flex; align-items: center; gap: 12px; font-size: 15px; letter-spacing: -0.02em; }
.brand b { color: var(--lime); font-weight: 650; }
.brand--large { font-size: 17px; }
.brand-mark { position: relative; display: inline-flex; align-items: end; gap: 2px; width: 29px; height: 29px; padding: 6px; border-radius: 9px; color: #0a0d11; background: var(--lime); box-shadow: 0 0 28px rgba(188, 244, 95, 0.18); }
.brand-mark i { display: block; width: 4px; border-radius: 4px; background: currentColor; }
.brand-mark i:nth-child(1) { height: 7px; }
.brand-mark i:nth-child(2) { height: 16px; }
.brand-mark i:nth-child(3) { height: 11px; }

.login-page { overflow-x: hidden; background: #090c10; }
.login-shell { min-height: 100vh; display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(390px, .65fr); }
.login-story { position: relative; display: flex; flex-direction: column; justify-content: space-between; min-height: 100vh; padding: 54px clamp(40px, 7vw, 110px); overflow: hidden; background: radial-gradient(circle at 18% 84%, rgba(188, 244, 95, .15), transparent 29%), radial-gradient(circle at 82% 22%, rgba(116, 229, 255, .1), transparent 25%), linear-gradient(145deg, #121821, #090c10 68%); }
.login-story::before, .login-story::after { content: ""; position: absolute; pointer-events: none; }
.login-story::before { inset: 0; opacity: .32; background-image: linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px); background-size: 56px 56px; mask-image: linear-gradient(to right, #000, transparent 88%); }
.login-story::after { width: 460px; height: 460px; right: -220px; top: calc(50% - 230px); border: 1px solid rgba(188, 244, 95, .16); border-radius: 50%; box-shadow: 0 0 0 70px rgba(188, 244, 95, .025), 0 0 0 140px rgba(188, 244, 95, .018); }
.login-story > * { position: relative; z-index: 1; }
.story-copy { max-width: 820px; margin: auto 0; padding: 80px 0; }
.eyebrow { display: block; margin-bottom: 13px; color: var(--lime); font-size: 11px; font-weight: 750; text-transform: uppercase; letter-spacing: .15em; }
.story-copy h1 { max-width: 800px; margin: 0; font-size: clamp(42px, 5.5vw, 78px); line-height: .98; letter-spacing: -.065em; font-weight: 620; }
.story-copy p { max-width: 650px; margin: 30px 0 0; color: #aeb7c5; font-size: 18px; line-height: 1.65; }
.resilience-strip { display: flex; gap: 34px; color: #cad1da; font-size: 12px; text-transform: uppercase; letter-spacing: .08em; }
.resilience-strip span { display: flex; gap: 9px; align-items: center; }
.resilience-strip b { color: var(--lime); font-size: 10px; }
.login-card { align-self: center; margin: 48px clamp(30px, 4vw, 72px); padding: 38px; border: 1px solid var(--line); border-radius: 24px; background: rgba(18, 23, 31, .96); box-shadow: var(--shadow); }
.login-card__head { display: flex; align-items: center; gap: 9px; margin-bottom: 48px; color: #aeb7c5; font-size: 12px; }
.login-card h2 { margin: 0 0 10px; font-size: 30px; letter-spacing: -.035em; }
.login-card > p { margin: 0 0 28px; color: var(--muted); line-height: 1.55; }
.login-card > small { display: block; margin-top: 20px; color: var(--muted-2); font-size: 11px; line-height: 1.5; }
.auth-form, .password-form { display: grid; gap: 18px; }
.auth-form label, .password-form label { display: grid; gap: 8px; color: #c5cbd4; font-size: 12px; font-weight: 650; }
.auth-form input, .password-form input { width: 100%; padding: 14px 15px; border: 1px solid #2a313d; border-radius: 10px; color: var(--ink); background: #0c1016; transition: border-color .2s, box-shadow .2s; }
.auth-form input:hover, .password-form input:hover { border-color: #3b4554; }
.auth-form input:focus, .password-form input:focus { outline: none; border-color: rgba(188,244,95,.7); box-shadow: 0 0 0 3px rgba(188,244,95,.08); }

.button { display: inline-flex; justify-content: center; align-items: center; gap: 12px; min-height: 40px; padding: 10px 16px; border: 1px solid transparent; border-radius: 9px; font-size: 12px; font-weight: 750; cursor: pointer; transition: transform .18s, border-color .18s, background .18s; }
.button:not(:disabled):hover { transform: translateY(-1px); }
.button:disabled { cursor: not-allowed; opacity: .48; }
.button--wide { width: 100%; min-height: 48px; margin-top: 4px; }
.button--primary { color: #0a0d11; background: var(--lime); }
.button--ghost { color: #dfe3ea; border-color: var(--line); background: rgba(255,255,255,.03); }
.button--light { color: #12161b; background: #fff; }
.button--danger { color: #ffacb0; border-color: rgba(255,124,131,.2); background: rgba(255,124,131,.08); }
.notice { margin: 18px 0; padding: 12px 14px; border: 1px solid; border-radius: 9px; font-size: 12px; line-height: 1.45; }
.notice--error { color: #ffc5c8; border-color: rgba(255,124,131,.25); background: rgba(255,124,131,.09); }
.notice--success { color: #d9ff9b; border-color: rgba(188,244,95,.25); background: rgba(188,244,95,.08); }
.workspace-notice { margin: 22px 32px 0; }
.status-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; }
.status-dot--good { background: var(--lime); box-shadow: 0 0 0 5px rgba(188,244,95,.08), 0 0 12px rgba(188,244,95,.4); }

.console-shell { display: grid; grid-template-columns: 244px minmax(0, 1fr); min-height: 100vh; }
.sidebar { position: sticky; top: 0; z-index: 20; display: flex; flex-direction: column; height: 100vh; padding: 25px 18px 18px; border-right: 1px solid var(--line); background: #0b0f14; }
.sidebar > .brand { padding: 0 10px 27px; }
.main-nav { display: grid; gap: 3px; }
.main-nav p { margin: 25px 12px 7px; color: #566070; font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .16em; }
.main-nav a { display: flex; align-items: center; gap: 11px; min-height: 41px; padding: 0 12px; border-radius: 8px; color: #98a2b3; font-size: 12px; font-weight: 600; }
.main-nav a:hover { color: #eef1f5; background: rgba(255,255,255,.035); }
.main-nav a.is-active { color: #f6f8fb; background: #181e27; box-shadow: inset 2px 0 var(--lime); }
.nav-icon { display: grid; place-items: center; width: 18px; color: #778293; font-size: 16px; }
.main-nav a.is-active .nav-icon { color: var(--lime); }
.main-nav em { margin-left: auto; color: #677282; font-size: 10px; font-style: normal; }
.sidebar-foot { display: grid; gap: 14px; margin-top: auto; }
.contract-chip { display: flex; align-items: center; gap: 10px; padding: 11px; border: 1px solid var(--line); border-radius: 10px; background: rgba(255,255,255,.02); }
.contract-chip > span { width: 8px; height: 8px; border-radius: 2px; background: var(--orange); }
.contract-chip div, .user-link > span:nth-child(2) { display: grid; gap: 3px; }
.contract-chip b, .user-link b { font-size: 10px; }
.contract-chip small, .user-link small { color: var(--muted-2); font-size: 9px; }
.user-link { display: flex; align-items: center; gap: 10px; padding: 8px; border-radius: 9px; }
.user-link:hover, .user-link.is-active { background: #151a22; }
.user-link > i { margin-left: auto; color: #616b79; font-style: normal; }
.avatar { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 8px; color: #11161b; background: var(--lime); font-size: 11px; font-weight: 850; }

.workspace { min-width: 0; background: radial-gradient(circle at 85% 4%, rgba(116,229,255,.045), transparent 20%), #0e1218; }
.topbar { position: sticky; top: 0; z-index: 10; display: flex; align-items: center; min-height: 82px; padding: 15px 32px; border-bottom: 1px solid var(--line); background: rgba(14,18,24,.9); backdrop-filter: blur(18px); }
.topbar h1 { margin: 6px 0 0; font-size: 20px; letter-spacing: -.025em; }
.breadcrumb { color: #626d7c; font-size: 9px; text-transform: uppercase; letter-spacing: .12em; }
.breadcrumb b { color: #9ba5b4; }
.topbar-actions { display: flex; gap: 12px; align-items: center; margin-left: auto; }
.preview-badge { padding: 7px 9px; border: 1px solid rgba(255,184,104,.2); border-radius: 7px; color: var(--orange); background: rgba(255,184,104,.07); font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.mobile-menu { display: none; margin-right: 13px; border: 0; color: var(--ink); background: none; font-size: 20px; }
.panel { padding: 30px 32px 50px; }
.security-banner { display: flex; justify-content: space-between; align-items: center; gap: 25px; margin: 22px 32px 0; padding: 14px 16px; border: 1px solid rgba(255,184,104,.24); border-radius: 12px; background: linear-gradient(90deg, rgba(255,184,104,.12), rgba(255,184,104,.035)); }
.security-banner > div { display: flex; align-items: center; gap: 13px; }
.security-banner > div > span { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 8px; color: #1b140b; background: var(--orange); font-weight: 900; }
.security-banner p { display: grid; gap: 3px; margin: 0; color: #a9b1bd; font-size: 11px; }
.security-banner p b { color: #f3f5f8; font-size: 12px; }

.hero-grid { display: grid; grid-template-columns: minmax(380px, .85fr) minmax(420px, 1.15fr); gap: 16px; }
.health-card, .principle-card, .data-card, .node-card, .empty-card, .line-card, .manifest-card, .empty-state { border: 1px solid var(--line); border-radius: 14px; background: var(--panel); box-shadow: 0 12px 40px rgba(0,0,0,.08); }
.health-card { padding: 22px; }
.health-card__top { display: flex; justify-content: space-between; align-items: center; color: #b7bec9; font-size: 11px; }
.health-score { display: flex; align-items: baseline; margin: 18px 0 12px; }
.health-score strong { font-size: 53px; line-height: 1; letter-spacing: -.06em; }
.health-score span { color: #606b79; font-size: 15px; }
.progress { height: 5px; overflow: hidden; border-radius: 4px; background: #282f39; }
.progress i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--orange), var(--lime)); }
.progress .progress--74 { width: 74%; }
.health-card > p { margin: 17px 0 0; color: var(--muted); font-size: 11px; line-height: 1.55; }
.principle-card { position: relative; min-height: 245px; padding: 29px; overflow: hidden; background: radial-gradient(circle at 89% 30%, rgba(188,244,95,.11), transparent 30%), linear-gradient(135deg, #171d25, #11151c); }
.principle-card::after { content: ""; position: absolute; right: -95px; bottom: -150px; width: 320px; height: 320px; border: 1px solid rgba(188,244,95,.12); border-radius: 50%; box-shadow: 0 0 0 45px rgba(188,244,95,.018), 0 0 0 90px rgba(188,244,95,.012); }
.principle-card h2 { position: relative; z-index: 1; max-width: 600px; margin: 0; font-size: clamp(24px, 3vw, 38px); line-height: 1.08; letter-spacing: -.045em; font-weight: 580; }
.principle-flow { position: relative; z-index: 1; display: flex; gap: 8px; align-items: center; margin-top: 33px; }
.principle-flow span { padding: 8px 10px; border: 1px solid rgba(255,255,255,.1); border-radius: 7px; color: #bec5cf; background: rgba(0,0,0,.15); font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; }
.principle-flow i { color: var(--lime); font-style: normal; }

.metrics-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-top: 16px; }
.metrics-grid article { display: flex; align-items: center; gap: 13px; min-height: 94px; padding: 16px; border: 1px solid var(--line); border-radius: 12px; background: rgba(17,21,28,.88); }
.metrics-grid article > div { display: grid; gap: 4px; }
.metrics-grid small, .line-card small { color: var(--muted-2); font-size: 9px; text-transform: uppercase; letter-spacing: .06em; }
.metrics-grid strong { font-size: 23px; letter-spacing: -.035em; }
.metrics-grid strong i { color: #5f6977; font-size: 11px; font-style: normal; }
.metrics-grid article > em { margin-left: auto; color: var(--lime); font-size: 10px; font-style: normal; }
.metric-icon { display: grid; place-items: center; width: 37px; height: 37px; border-radius: 9px; font-size: 17px; }
.metric-icon--green { color: var(--lime); background: rgba(188,244,95,.08); }
.metric-icon--blue { color: var(--cyan); background: rgba(116,229,255,.08); }
.metric-icon--orange { color: var(--orange); background: rgba(255,184,104,.08); }
.metric-icon--violet { color: var(--violet); background: rgba(181,160,255,.08); }
.warn-text { color: var(--orange) !important; }
.muted-text { color: var(--muted-2) !important; }

.content-grid { display: grid; grid-template-columns: minmax(520px, 1.45fr) minmax(290px, .55fr); gap: 16px; margin-top: 16px; }
.data-card { overflow: hidden; }
.data-card > header { display: flex; justify-content: space-between; gap: 20px; align-items: start; padding: 20px 21px; border-bottom: 1px solid var(--line); }
.data-card > header h2, .architecture-card h2 { margin: 0; font-size: 15px; letter-spacing: -.02em; }
.data-card > header p { margin: 7px 0 0; color: var(--muted); font-size: 11px; }
.data-card > header .eyebrow { margin-bottom: 7px; font-size: 8px; }
.data-card > header a { color: var(--lime); font-size: 10px; }
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th, td { padding: 14px 20px; text-align: left; border-bottom: 1px solid rgba(255,255,255,.055); white-space: nowrap; }
th { color: #646f7e; font-size: 8px; text-transform: uppercase; letter-spacing: .11em; }
td { color: #adb5c1; font-size: 10px; }
td b { color: #e9ecf1; font-size: 11px; }
td small { display: block; margin-top: 5px; color: #65707f; font-size: 9px; }
tr:last-child td { border-bottom: 0; }
.mono { font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace; letter-spacing: -.02em; }
.status-pill { display: inline-flex; align-items: center; gap: 6px; padding: 6px 8px; border: 1px solid; border-radius: 99px; font-size: 8px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.status-pill::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: currentColor; }
.status-pill--good { color: var(--lime); border-color: rgba(188,244,95,.16); background: rgba(188,244,95,.06); }
.status-pill--warn { color: var(--orange); border-color: rgba(255,184,104,.16); background: rgba(255,184,104,.06); }
.architecture-card { padding-bottom: 8px; }
.recovery-list { display: grid; gap: 0; margin: 0; padding: 2px 20px 10px; list-style: none; }
.recovery-list li { position: relative; display: flex; align-items: center; gap: 12px; min-height: 54px; }
.recovery-list li:not(:last-child)::after { content: ""; position: absolute; left: 13px; top: 40px; bottom: -12px; width: 1px; background: #29313b; }
.recovery-list li > span { z-index: 1; display: grid; place-items: center; width: 27px; height: 27px; border: 1px solid #303844; border-radius: 50%; color: #727d8b; background: #12171e; font-size: 9px; }
.recovery-list li.done > span { color: #10150b; border-color: var(--lime); background: var(--lime); }
.recovery-list li div { display: grid; gap: 4px; }
.recovery-list b { font-size: 10px; }
.recovery-list small { color: #66717f; font-size: 9px; }

.section-intro { display: flex; justify-content: space-between; margin: 4px 0 25px; }
.section-intro h2 { margin: 0; font-size: 28px; letter-spacing: -.04em; }
.section-intro p { max-width: 700px; margin: 10px 0 0; color: var(--muted); font-size: 12px; line-height: 1.6; }
.node-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(330px, 1fr)); gap: 15px; }
.node-card { overflow: hidden; }
.node-card header { display: flex; align-items: center; gap: 13px; padding: 19px; border-bottom: 1px solid var(--line); }
.node-card h3, .node-card p { margin: 0; }
.node-card h3 { font-size: 14px; }
.node-card p { margin-top: 3px; color: var(--muted); font-size: 10px; }
.node-card header .status-pill { margin-left: auto; }
.node-glyph { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 10px; color: var(--lime); background: rgba(188,244,95,.08); font-size: 21px; }
.node-card dl, .account-card dl { display: grid; grid-template-columns: 1fr 1fr; margin: 0; padding: 7px 19px; }
.node-card dl div, .account-card dl div { display: grid; gap: 5px; padding: 13px 0; }
.node-card dt, .account-card dt { color: var(--muted-2); font-size: 8px; text-transform: uppercase; letter-spacing: .08em; }
.node-card dd, .account-card dd { margin: 0; color: #d9dee5; font-size: 10px; }
.node-card footer { display: flex; justify-content: space-between; align-items: center; min-height: 48px; padding: 0 19px; border-top: 1px solid var(--line); background: rgba(255,255,255,.018); }
.node-card footer span { display: flex; align-items: center; gap: 9px; color: #7c8795; font-size: 9px; }
.node-card footer button { border: 0; color: #586271; background: none; font-size: 9px; }
.empty-card { display: grid; place-items: center; align-content: center; min-height: 292px; padding: 30px; text-align: center; border-style: dashed; }
.empty-card > span { color: var(--lime); font-size: 32px; font-weight: 200; }
.empty-card h3 { margin: 10px 0 6px; font-size: 14px; }
.empty-card p { max-width: 260px; margin: 0 0 18px; color: var(--muted); font-size: 10px; line-height: 1.55; }
.line-stack { display: grid; gap: 10px; }
.line-card { display: grid; grid-template-columns: 46px minmax(170px, 1.1fr) 1fr 1.2fr auto; align-items: center; gap: 18px; padding: 16px 18px; }
.transport-badge { display: grid; place-items: center; width: 40px; height: 40px; border: 1px solid rgba(116,229,255,.16); border-radius: 10px; color: var(--cyan); background: rgba(116,229,255,.07); font-size: 10px; font-weight: 850; }
.line-card h3, .line-card p { margin: 0; }
.line-card h3 { font-size: 12px; }
.line-card p { margin-top: 5px; color: #778291; font-size: 9px; }
.line-card > div:not(.line-main) { display: grid; gap: 6px; }
.line-card > div > b { font-size: 9px; font-weight: 600; }
.empty-state { display: grid; place-items: center; min-height: 410px; padding: 50px; text-align: center; }
.empty-state .orbit { position: relative; display: grid; place-items: center; width: 75px; height: 75px; margin-bottom: 20px; border: 1px solid rgba(188,244,95,.15); border-radius: 50%; box-shadow: 0 0 0 17px rgba(188,244,95,.025), 0 0 0 34px rgba(188,244,95,.015); }
.empty-state .orbit i { width: 11px; height: 11px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 20px rgba(188,244,95,.65); }
.empty-state h3 { margin: 0; font-size: 18px; }
.empty-state p { max-width: 610px; margin: 12px 0 20px; color: var(--muted); font-size: 11px; line-height: 1.65; }
.empty-state code { padding: 9px 12px; border-radius: 7px; color: var(--cyan); background: #090d12; font-size: 10px; }
.manifest-card { display: grid; grid-template-columns: 1.2fr 1fr auto; align-items: center; gap: 28px; padding: 24px; }
.manifest-card > div { display: flex; align-items: center; gap: 15px; }
.manifest-card h3, .manifest-card p { margin: 0; }
.manifest-card h3 { font-size: 14px; }
.manifest-card p { margin-top: 5px; color: var(--muted); font-size: 10px; }
.manifest-version { display: grid; place-items: center; width: 50px; height: 50px; border-radius: 12px; color: #11150d; background: var(--lime); font-size: 13px; font-weight: 900; }
.manifest-card dl { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 22px; margin: 0; }
.manifest-card dl div { display: grid; gap: 4px; }
.manifest-card dt { color: var(--muted-2); font-size: 8px; text-transform: uppercase; letter-spacing: .07em; }
.manifest-card dd { margin: 0; font-size: 10px; }
.empty-row { padding: 50px; color: var(--muted-2); text-align: center; }
.security-grid { display: grid; grid-template-columns: minmax(400px, 1.25fr) minmax(300px, .75fr); gap: 16px; }
.password-form { padding: 21px; }
.password-form .button { justify-self: start; }
.account-card dl { padding: 8px 21px 20px; }
.account-card form { padding: 0 21px 21px; }

.node-policy-form { display: grid; gap: 14px; margin: 0 19px 18px; padding: 16px; border: 1px solid var(--line); border-radius: 11px; background: rgba(255,255,255,.018); }
.policy-field { display: grid; gap: 7px; }
.policy-field > span, .node-policy-form legend { color: var(--muted-2); font-size: 11px; font-weight: 750; text-transform: uppercase; letter-spacing: .06em; }
.node-policy-form fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.node-policy-form legend { margin-bottom: 9px; }
.node-policy-form select, .user-privilege-form select { min-height: 42px; padding: 9px 11px; border: 1px solid #303844; border-radius: 8px; color: var(--ink); background: #0c1016; font: inherit; }
.transport-checks { display: flex; flex-wrap: wrap; gap: 8px; }
.transport-checks label { display: inline-flex; align-items: center; gap: 7px; min-height: 36px; padding: 7px 10px; border: 1px solid #303844; border-radius: 8px; color: #c8ced7; background: #0c1016; font-size: 12px; cursor: pointer; }
.transport-checks input { width: 16px; height: 16px; accent-color: var(--lime); }
.node-policy-form .button { justify-self: start; }
.policy-note { display: flex; gap: 12px; align-items: start; margin: -8px 0 18px; padding: 14px 16px; border: 1px solid rgba(255,184,104,.2); border-radius: 11px; color: var(--muted); background: rgba(255,184,104,.055); font-size: 13px; line-height: 1.5; }
.policy-note b { flex: 0 0 auto; color: var(--orange); }
.user-privilege-form { display: flex; gap: 8px; align-items: center; }
.user-privilege-form .button { min-height: 42px; }
.device-provisioning-card { margin-bottom: 18px; overflow: hidden; border: 1px solid rgba(116,229,255,.16); border-radius: 14px; background: radial-gradient(circle at 90% 15%, rgba(116,229,255,.07), transparent 28%), var(--panel); }
.device-provisioning-card > header { display: flex; justify-content: space-between; gap: 24px; align-items: start; padding: 20px 22px; border-bottom: 1px solid var(--line); }
.device-provisioning-card h3 { margin: 0; font-size: 20px; }
.device-provisioning-card header p { max-width: 760px; margin: 8px 0 0; color: var(--muted); font-size: 13px; line-height: 1.55; }
.provisioning-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line); }
.provisioning-steps > div { display: flex; gap: 12px; padding: 18px; background: var(--panel); }
.provisioning-steps > div > b { display: grid; flex: 0 0 28px; place-items: center; width: 28px; height: 28px; border-radius: 8px; color: #10150b; background: var(--lime); font-size: 12px; }
.provisioning-steps span { display: grid; gap: 6px; }
.provisioning-steps strong { font-size: 13px; }
.provisioning-steps small { color: var(--muted); font-size: 12px; line-height: 1.5; }
.device-provisioning-card > footer { display: flex; justify-content: space-between; gap: 20px; align-items: center; padding: 16px 22px; }
.device-provisioning-card footer p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.5; }
.device-provisioning-card code { color: var(--cyan); }
@media (max-width: 1050px) { .provisioning-steps { grid-template-columns: 1fr; } .device-provisioning-card > footer { align-items: stretch; flex-direction: column; } }
.provisioning-form { display: grid; grid-template-columns: repeat(4,minmax(140px,1fr)); gap: 14px; padding: 20px 22px; }
.provisioning-form > label, .bootstrap-fields label { display: grid; gap: 7px; color: var(--muted-2); font-size: 12px; font-weight: 750; }
.provisioning-form input, .provisioning-form select, .bootstrap-fields input, .bootstrap-fields select, .activation-once input { min-height: 44px; padding: 10px 12px; border: 1px solid #303844; border-radius: 8px; color: var(--ink); background: #0c1016; font: inherit; }
.provisioning-form fieldset { grid-column: 1/-1; margin: 0; padding: 0; border: 0; }
.provisioning-form legend { margin-bottom: 9px; color: var(--muted-2); font-size: 12px; font-weight: 750; }
.target-checks { display: grid; grid-template-columns: repeat(auto-fit,minmax(250px,1fr)); gap: 8px; }
.target-checks > label { display: flex; gap: 10px; align-items: center; padding: 11px; border: 1px solid #303844; border-radius: 9px; background: #0c1016; }
.target-checks input { min-height: 0; width: 18px; height: 18px; accent-color: var(--lime); }
.target-checks span { display: grid; gap: 4px; }.target-checks b { font-size: 13px; }.target-checks small { color: var(--muted); font-size: 11px; }
.provisioning-form > .button { grid-column: 1/-1; justify-self: start; }
.activation-once { display: grid; grid-template-columns: minmax(200px,.8fr) minmax(280px,1.4fr) auto; gap: 16px; align-items: center; padding: 16px 22px; border-bottom: 1px solid rgba(188,244,95,.2); background: rgba(188,244,95,.055); }
.activation-once div { display: grid; gap: 5px; }.activation-once b { color: var(--lime); font-size: 14px; }.activation-once small,.activation-once > span { color: var(--muted); font-size: 12px; }
.device-actions { display: flex; gap: 8px; }.device-actions form { margin: 0; }.device-actions .button { min-height: 38px; padding: 8px 12px; font-size: 12px; }
.node-bootstrap-card { margin-bottom: 18px; overflow: hidden; border: 1px solid rgba(255,184,104,.2); border-radius: 14px; background: var(--panel); }
.node-bootstrap-card > header { display: flex; justify-content: space-between; gap: 20px; padding: 20px 22px; border-bottom: 1px solid var(--line); }
.node-bootstrap-card h3 { margin: 0; font-size: 20px; }.node-bootstrap-card header p { max-width: 850px; margin: 8px 0 0; color: var(--muted); font-size: 13px; line-height: 1.55; }
.bootstrap-fields { display: grid; grid-template-columns: 1.2fr .6fr 1fr 1.4fr; gap: 12px; padding: 18px 22px; }.bootstrap-fields input:disabled,.bootstrap-fields select:disabled { color: #707987; opacity: .75; }
.bootstrap-status { display: grid; grid-template-columns: repeat(4,1fr); gap: 1px; margin: 0; padding: 1px 0 0; list-style: none; background: var(--line); }.bootstrap-status li { display: grid; gap: 7px; padding: 16px; background: var(--panel); }.bootstrap-status b { font-size: 13px; }.bootstrap-status span { color: var(--muted); font-size: 12px; line-height: 1.5; }
@media (max-width: 1050px) { .provisioning-form,.bootstrap-fields { grid-template-columns: 1fr 1fr; }.bootstrap-status { grid-template-columns: 1fr 1fr; }.activation-once { grid-template-columns: 1fr; } }

/* Readability pass for desktop and wide monitors. Keep operational data legible at 100% zoom. */
.console-shell { grid-template-columns: 278px minmax(0, 1fr); }
.sidebar { padding-left: 22px; padding-right: 22px; }
.brand { font-size: 18px; }
.main-nav p { font-size: 11px; }
.main-nav a { min-height: 46px; font-size: 14px; }
.main-nav em { font-size: 12px; }
.nav-icon { font-size: 18px; }
.contract-chip b, .user-link b { font-size: 13px; }
.contract-chip small, .user-link small { font-size: 11px; }
.breadcrumb { font-size: 11px; }
.topbar h1 { font-size: 25px; }
.preview-badge { font-size: 11px; }
.button { min-height: 44px; padding: 11px 18px; font-size: 14px; }
.security-banner p { font-size: 14px; }
.security-banner p b { font-size: 15px; }
.health-card__top { font-size: 14px; }
.health-card > p { font-size: 14px; }
.principle-flow span { font-size: 12px; }
.metrics-grid small, .line-card small { font-size: 12px; }
.metrics-grid strong { font-size: 28px; }
.metrics-grid strong i { font-size: 14px; }
.metrics-grid article > em { font-size: 13px; }
.data-card > header h2, .architecture-card h2 { font-size: 20px; }
.data-card > header p { font-size: 14px; }
.data-card > header .eyebrow { font-size: 11px; }
.data-card > header a { font-size: 13px; }
.eyebrow { font-size: 13px; }
th { font-size: 11px; }
td { padding-top: 18px; padding-bottom: 18px; font-size: 13px; }
td b { font-size: 14px; }
td small { font-size: 12px; }
.status-pill { padding: 7px 10px; font-size: 11px; }
.recovery-list b { font-size: 13px; }
.recovery-list small { font-size: 12px; }
.section-intro h2 { font-size: 32px; }
.section-intro p { font-size: 15px; }
.node-card h3 { font-size: 18px; }
.node-card p { font-size: 13px; }
.node-card dt, .account-card dt { font-size: 11px; }
.node-card dd, .account-card dd { font-size: 14px; }
.node-card footer span, .node-card footer button { font-size: 12px; }
.empty-card h3 { font-size: 18px; }
.empty-card p { font-size: 13px; }
.line-card h3 { font-size: 16px; }
.line-card p { font-size: 12px; }
.line-card > div > b { font-size: 13px; }
.empty-state h3 { font-size: 22px; }
.empty-state p { font-size: 14px; }
.empty-state code { font-size: 13px; }
.manifest-card h3 { font-size: 18px; }
.manifest-card p { font-size: 13px; }
.manifest-card dt { font-size: 11px; }
.manifest-card dd { font-size: 14px; }
.password-form label, .auth-form label { font-size: 14px; }

@media (max-width: 1100px) {
  .hero-grid, .content-grid { grid-template-columns: 1fr; }
  .metrics-grid { grid-template-columns: 1fr 1fr; }
  .line-card { grid-template-columns: 46px 1fr auto; }
  .line-card > div:not(.line-main) { display: none; }
  .manifest-card { grid-template-columns: 1fr; }
}

@media (max-width: 820px) {
  .login-shell { grid-template-columns: 1fr; }
  .login-story { min-height: auto; padding: 32px 25px 44px; }
  .story-copy { padding: 80px 0 65px; }
  .story-copy h1 { font-size: clamp(39px, 12vw, 62px); }
  .resilience-strip { flex-wrap: wrap; gap: 14px 25px; }
  .login-card { margin: 0; border-width: 1px 0 0; border-radius: 0; padding: 40px 25px 55px; }
  .console-shell { grid-template-columns: 1fr; }
  .sidebar { position: fixed; left: -260px; width: 244px; transition: left .2s; box-shadow: 20px 0 60px rgba(0,0,0,.55); }
  .menu-open .sidebar { left: 0; }
  .mobile-menu { display: block; }
  .topbar { padding: 14px 18px; }
  .panel { padding: 24px 18px 40px; }
  .security-banner, .workspace-notice { margin-left: 18px; margin-right: 18px; }
  .security-banner { align-items: start; flex-direction: column; }
  .security-grid { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
  .topbar-actions .button { display: none; }
  .preview-badge { font-size: 7px; }
  .metrics-grid { grid-template-columns: 1fr; }
  .hero-grid { grid-template-columns: minmax(0, 1fr); }
  .health-card, .principle-card { padding: 20px; }
  .principle-flow { flex-wrap: wrap; }
  .node-grid { grid-template-columns: 1fr; }
  .line-card { gap: 12px; }
  .section-intro h2 { font-size: 24px; }
  .security-grid { grid-template-columns: minmax(0, 1fr); }
}