@charset "UTF-8";

@font-face {
  font-family: Geist;
  src: url('/static/fonts/Geist-Variable.woff2') format('woff2');
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

:root {
  --ink: #232b30;
  --muted: #626a6e;
  --subtle: #929597;
  --line: #e1e5e6;
  --paper: #f3f5f6;
  --surface: #ffffff;
  --forest: #1a2024;
  --accent: #bbd4e2;
  --accent-hover: #a5c3d4;
  --accent-dark: #3f5663;
  --green: #4b616e;
  --radius: 18px;
  --sidebar: 238px;
  font-family: Geist, 'Segoe UI', Arial, sans-serif;
  color: var(--ink);
  background: var(--paper);
  font-synthesis: none;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 94px; overflow-x: clip; }
body { margin: 0; font-size: 14px; line-height: 1.6; overflow-x: clip; }
button, input, select { font: inherit; }
button, a, input, select { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; opacity: .5; }
[hidden] { display: none !important; }
:focus-visible { outline: 3px solid #567181; outline-offset: 4px; }
button, a { touch-action: manipulation; }
p { margin: 0; }
h1, h2, h3 { margin: 0; }
.icon { width: 21px; height: 21px; flex-shrink: 0; vertical-align: middle; }
.nexus-mark { width: 40px; height: 40px; flex-shrink: 0; }
.skip-link { position: fixed; top: -100px; left: 18px; padding: 12px 20px; background: var(--accent); color: var(--forest); z-index: 100; border-radius: 8px; }
.skip-link:focus { top: 16px; }

/* The navigation rail keeps operations one click away. */
.sidebar { width: var(--sidebar); position: fixed; inset: 0 auto 0 0; z-index: 20; display: flex; flex-direction: column; background: var(--forest); padding: 29px 18px 20px; color: #e5e9ea; }
.brand { display: flex; align-items: center; gap: 12px; padding: 0 11px 30px; font-size: 29px; font-weight: 600; letter-spacing: -1.2px; line-height: 1.1; }
.brand-symbol { width: 40px; height: 43px; display: grid; place-items: center; color: var(--accent); }
.brand-caption { display: block; color: #a4aaae; font-size: 9px; font-weight: 400; letter-spacing: .25px; margin-top: 7px; }
.workspace-summary { display: flex; align-items: center; gap: 10px; padding: 13px 10px; border-top: 1px solid #363c3f; border-bottom: 1px solid #363c3f; margin-bottom: 29px; font-size: 11px; line-height: 1.5; }
.workspace-summary small { display: block; font-size: 10px; color: #9ba1a5; margin-top: 2px; }
.workspace-summary > .icon { margin-left: auto; width: 13px; height: 13px; color: #929a9e; }
.workspace-avatar { display: grid; place-items: center; width: 29px; height: 29px; border: 1px solid #505a5f; border-radius: 8px; font-size: 12px; color: #c3cdd3; background: #33393d; }
nav { display: grid; gap: 8px; }
.nav-link { display: flex; align-items: center; gap: 11px; padding: 13px 13px; min-height: 47px; border-radius: 9px; color: #b4babe; font-size: 13px; transition: color .18s, background .18s; }
.nav-link > .icon { width: 18px; height: 18px; }
.nav-link:hover { background: #2a3034; color: #ecf1f3; }
.nav-link.active { background: var(--accent); color: #242e34; font-weight: 600; }
.nav-active-dot { margin-left: auto; width: 5px; height: 5px; border-radius: 50%; background: #42535d; }
.sidebar-bottom { margin-top: auto; padding-top: 35px; }
.provider-card { border: 1px solid #3e4448; border-radius: 12px; padding: 17px 15px 16px; background: linear-gradient(135deg, #2e3438, #23292c); }
.provider-card-top { display: flex; align-items: center; gap: 9px; margin-bottom: 21px; }
.mtn-logo { border: 1.2px solid #bacbd5; border-radius: 50%; font-size: 12px; font-weight: 650; letter-spacing: -.7px; color: #cfdfe6; width: 40px; height: 25px; display: grid; place-items: center; }
.provider-label { font-size: 9px; color: #a3a9ad; }
.provider-state { font-size: 11px; display: flex; align-items: center; gap: 7px; }
.provider-card p { font-size: 10px; line-height: 1.8; color: #a8aeb1; margin: 9px 0 15px; }
.provider-card a { display: flex; justify-content: space-between; align-items: center; font-size: 10px; color: #d2dce1; padding-top: 12px; border-top: 1px solid #424a4e; }
.provider-card a .icon { width: 13px; height: 13px; }
.sidebar-signature { display: flex; align-items: center; gap: 5px; color: #868f94; font-size: 9px; padding: 21px 6px 0; }
.sidebar-signature .nexus-mark { width: 20px; height: 20px; }
.dot { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: #8096a3; flex-shrink: 0; }
.dot.green { background: #8bacbe; box-shadow: 0 0 0 3px #91bd6d13; }
.dot.amber { background: #e0ba6a; }

/* The canvas stays intentionally light, quiet and compact. */
.app-frame { margin-left: var(--sidebar); min-height: 100vh; }
.topbar { height: 76px; padding: 0 38px; display: flex; align-items: center; justify-content: space-between; gap: 15px; border-bottom: 1px solid var(--line); background: #fbfcfc; }
.breadcrumb { display: flex; gap: 14px; align-items: center; font-size: 13px; color: #666a6c; }
.breadcrumb .icon { width: 11px; height: 11px; }
.breadcrumb strong { color: #4e5559; font-weight: 500; }
.topbar-right { display: flex; gap: 22px; align-items: center; }
.local-indicator { display: flex; gap: 7px; align-items: center; font-size: 12px; color: #63696d; }
.user-avatar { display: grid; place-items: center; width: 29px; height: 29px; background: #e1e8eb; border: 1px solid #d7dee1; border-radius: 50%; font-size: 13px; font-weight: 600; color: #546168; }
main { width: 100%; max-width: 1450px; padding: 0 40px; margin: 0 auto; overflow-x: clip; }
.page-hero { text-align: center; padding: 46px 0 34px; position: relative; }
.page-hero::before { content: ''; position: absolute; inset: 3px 10% -10px; background: radial-gradient(ellipse at 50% 40%, #e4edd860 0%, transparent 65%); z-index: -1; pointer-events: none; }
h1 { font-size: clamp(31px, 3.25vw, 50px); line-height: 1.15; font-weight: 500; letter-spacing: -2px; max-width: 1120px; }
h1 span { color: #5a666c; }
.page-hero h1 { margin: 0 auto; }
.hero-description { font-size: 12px; color: #62686c; line-height: 1.8; margin-top: 14px; }
.mobile-break { display: none; }
.hero-actions { display: flex; gap: 10px; justify-content: center; margin-top: 23px; }
.page-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 43px 0 34px; }
.page-heading h1 { font-size: clamp(30px, 3vw, 42px); letter-spacing: -1.6px; }
.page-heading p { margin-top: 12px; color: var(--muted); font-size: 12px; line-height: 1.8; }
.button { border: 1px solid transparent; border-radius: 8px; padding: 11px 16px; min-height: 43px; font-weight: 550; font-size: 13px; display: inline-flex; align-items: center; justify-content: center; gap: 16px; white-space: nowrap; transition: background .2s, box-shadow .2s, transform .2s; }
.button .icon { width: 16px; height: 16px; }
.button.primary { background: var(--accent); color: #263137; border-color: #aec7d5; box-shadow: 0 1px 2px #33422508; }
.button.primary:hover:not(:disabled) { background: var(--accent-hover); box-shadow: 0 3px 9px #567e2920; }
.button.secondary { background: #fff; color: #475156; border-color: #d9dfe2; }
.button.secondary:hover { background: #ebf1f3; }
.button.small { min-height: 33px; padding: 6px 11px; font-size: 12px; }
.button:active:not(:disabled) { transform: translateY(1px); }
.badge, .format-chip, .provider-chip, .configuration-pill { display: inline-flex; gap: 7px; align-items: center; font-size: 11px; font-weight: 500; padding: 5px 9px; border: 1px solid #dee4e6; border-radius: 6px; background: #f1f5f7; color: #5b666c; overflow-wrap: anywhere; }
.format-chip { font-size: 13px; gap: 8px; padding: 8px 12px; background: #fff; }
.format-chip .icon { width: 16px; height: 16px; }
.configuration-pill { font-size: 12px; border-radius: 25px; padding: 8px 13px; }
.configuration-pill .green { background: #4f6d7e; }
.configuration-pill.is-ready { background: #e8f0f3; color: #455c69; }
.heading-icon { display: grid; place-items: center; width: 36px; height: 36px; background: #e8eff2; border: 1px solid #dde5e9; border-radius: 10px; color: #55636a; }
.heading-icon .icon { width: 18px; height: 18px; }

/* Four operations share one cohesive workspace, rather than separate pages. */
.lookup-shell { border: 1px solid #d9e0e3; border-radius: var(--radius); background: #fff; box-shadow: 0 5px 20px #2c492807; padding: 23px; scroll-margin-top: 24px; }
.workspace-heading { display: flex; justify-content: space-between; gap: 16px; align-items: center; margin-bottom: 21px; }
.workspace-heading > div { display: flex; gap: 11px; align-items: center; }
h2 { font-size: 16px; font-weight: 550; letter-spacing: -.35px; line-height: 1.4; }
.workspace-heading p, .panel-top p { color: #63686b; font-size: 12px; margin-top: 3px; }
.operation-tabs { display: flex; gap: 8px; margin-bottom: 24px; }
.operation-tabs button { display: flex; flex: 1; align-items: center; gap: 10px; padding: 14px 12px; background: #f9fafa; border: 1px solid #e5e9ea; color: #5c6469; border-radius: 9px; text-align: left; min-width: 0; transition: border-color .25s, background .25s, flex .35s; }
.operation-tabs button:hover { border-color: #a6b6bf; flex: 1.08; background: #f0f5f7; }
.operation-tabs button[aria-selected=true] { color: #475a65; background: #ecf2f5; border-color: #a1b8c5; }
.operation-tabs button > .icon { width: 21px; height: 21px; }
.operation-tabs button strong { color: #3f4a50; display: block; font-size: 12px; font-weight: 550; white-space: nowrap; }
.operation-tabs button small { display: block; color: #61686c; font-size: 10px; margin-top: 2px; white-space: nowrap; }
.operation-check { width: 13px; height: 13px; margin-left: auto; opacity: 0; }
.operation-check .icon { width: 12px; height: 12px; }
.operation-tabs button[aria-selected=true] .operation-check { opacity: 1; }
.lookup-layout { display: grid; grid-template-columns: 7fr 5fr; grid-auto-flow: dense; gap: 28px; align-items: stretch; }
.lookup-panel { padding: 14px 3px 4px; min-width: 0; }
.field-heading { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
label { display: block; font-size: 13px; font-weight: 550; color: #404c52; margin-bottom: 9px; }
.field-heading label { margin: 0; }
.field-heading > span { font-size: 11px; color: #64696c; }
.identifier-input { position: relative; }
.identifier-input > .icon { position: absolute; left: 14px; top: 16px; width: 18px; height: 18px; color: #5c6469; }
.identifier-input kbd { position: absolute; right: 13px; top: 14px; padding: 2px 6px; border: 1px solid #dee4e7; border-radius: 4px; font-family: inherit; font-size: 11px; color: #63696c; background: #f9fafa; }
input:not([type=file]), select { width: 100%; border: 1px solid #d7dee1; border-radius: 8px; min-height: 47px; background: #fff; color: var(--ink); padding: 11px 13px; outline: none; transition: border-color .2s, box-shadow .2s; font-size: 12px; }
input:not([type=file]):focus, select:focus { border-color: #889fac; box-shadow: 0 0 0 3px #b4d29429; }
.identifier-input input { padding: 14px 51px 14px 42px; font-size: 13px; letter-spacing: .2px; min-height: 51px; }
input::placeholder { color: #63686a; }
.hint { color: #62686b; font-size: 11px; margin: 10px 0 0; line-height: 1.8; }
.lookup-action { width: 100%; margin-top: 20px; justify-content: space-between; min-height: 45px; }
.lookup-action .icon { width: 16px; height: 16px; }
.lookup-assurance { display: flex; gap: 7px; align-items: center; justify-content: center; color: #60666a; font-size: 11px; margin-top: 12px; }
.lookup-assurance .icon { width: 12px; height: 12px; }
.lookup-tip { display: flex; gap: 12px; margin-top: 26px; padding-top: 21px; border-top: 1px solid #e9edef; }
.tip-symbol { color: #5b656b; padding-top: 1px; }
.tip-symbol .icon { width: 17px; height: 17px; }
.lookup-tip strong { font-size: 12px; font-weight: 550; color: #57646b; }
.lookup-tip p { font-size: 11px; line-height: 1.8; color: #5e6569; margin-top: 5px; max-width: 340px; }
.lookup-tip b { font-weight: 500; color: #5a6469; }
.result-panel { padding: 16px 18px 20px; border: 1px solid #dee5e8; border-radius: 11px; background: radial-gradient(ellipse at 50% 60%, #eaf0f3 0%, #f5f8f9 70%); min-width: 0; }
.result-panel-label { display: flex; justify-content: space-between; align-items: center; gap: 10px; font-size: 11px; color: #5e666a; }
.waiting-indicator { display: inline-flex; align-items: center; gap: 5px; font-size: 10px; }
.waiting-indicator .dot { width: 4px; height: 4px; background: #aab8bf; }
.empty-result { text-align: center; padding: 9px 0 1px; }
.sim-artwork { width: 158px; height: 129px; margin: 5px auto 5px; display: block; transition: transform .7s; }
.result-panel:hover .sim-artwork { transform: translateY(-3px) rotate(3deg); }
.empty-result h2 { font-size: 17px; font-weight: 500; letter-spacing: -.5px; color: #505f68; }
.empty-result p { color: #5f676c; font-size: 12px; line-height: 1.8; margin-top: 9px; }
.empty-result-note { display: inline-flex; gap: 5px; align-items: center; font-size: 10px; color: #5e6468; margin-top: 23px; }
.empty-result-note .icon { width: 11px; height: 11px; }
#result-content { margin-top: 20px; }
.result-header { display: flex; gap: 8px; align-items: center; justify-content: space-between; margin-bottom: 15px; }
.result-header h2 { font-size: 14px; }
.result-header .badge { font-size: 10px; }
.result-summary { display: flex; justify-content: space-between; align-items: center; gap: 10px; border-bottom: 1px solid #d2dce1; padding: 2px 0 17px; margin-bottom: 18px; }
.result-summary p { color: #5b6368; font-size: 12px; margin-bottom: 5px; }
.result-summary strong { font-size: 33px; font-weight: 500; letter-spacing: -1.3px; line-height: 1.2; color: #3e4f59; overflow-wrap: anywhere; }
.result-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; margin-bottom: 20px; }
.result-field small { display: block; font-size: 10px; color: #61676b; margin-bottom: 4px; }
.result-field > div { display: flex; flex-wrap: wrap; gap: 5px; align-items: center; font-size: 12px; color: #4e5e67; overflow-wrap: anywhere; }
.mono { font-family: Consolas, monospace; font-variant-numeric: tabular-nums; letter-spacing: .1px; }
.copy-button { font-family: inherit; border: 1px solid #d3dde1; background: #f9fcfd; color: #57646c; border-radius: 4px; padding: 2px 5px; font-size: 10px; }
.copy-button:hover { color: #354a55; background: #e6eef2; }
#result-content h3 { font-size: 11px; font-weight: 550; color: #5a656b; margin-bottom: 6px; }
.balance-list { display: grid; gap: 4px; font-size: 11px; color: #59646a; padding: 0; margin: 0 0 16px; list-style: none; }
.balance-list li { display: flex; justify-content: space-between; gap: 12px; }
.result-footer { border-top: 1px solid #d8e0e4; padding-top: 13px; font-size: 10px; color: #5e6468; overflow-wrap: anywhere; line-height: 1.9; }
.result-error { color: #a24a3e; }
.status-badge[data-status='SUCCESS'], .status-badge[data-status='Completed'] { background: #e9eff2; border-color: #d1dee4; color: #495d68; }
.status-badge[data-status='ERROR'], .status-badge[data-status='Failed'] { background: #fff0e9; border-color: #f2d9cb; color: #9d5540; }

/* Secondary actions are readable, complete rows without dashboard metrics. */
.quick-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-flow: dense; gap: 16px; margin-top: 22px; }
.quick-link { display: flex; gap: 13px; align-items: center; border: 1px solid #dae1e4; border-radius: 11px; padding: 19px 17px; background: #fafcfc; overflow: hidden; transition: background .25s, border-color .25s; }
.quick-link:hover { border-color: #b6c4cb; background: #eaf0f3; }
.quick-link-symbol { display: grid; place-items: center; width: 34px; height: 38px; border-radius: 8px; background: #e7eef1; color: #546169; flex-shrink: 0; transition: transform .5s; }
.quick-link-symbol .icon { width: 18px; height: 18px; }
.quick-link:hover .quick-link-symbol { transform: scale(1.08) rotate(-4deg); }
.quick-link h3 { font-size: 13px; font-weight: 500; letter-spacing: -.15px; color: #53626a; }
.quick-link p { font-size: 11px; color: #60666a; margin-top: 4px; }
.quick-link-arrow { margin-left: auto; color: #5e6569; width: 14px; height: 14px; }
.guidance-carousel { display: flex; justify-content: space-between; gap: 15px; align-items: center; padding: 24px 3px 5px; color: #5e6569; }
.guidance-copy { display: flex; align-items: center; gap: 7px; }
.guidance-copy > .dot { width: 4px; height: 4px; background: #95a7b1; }
.guidance-copy p { font-size: 11px; }
.guidance-controls { display: flex; gap: 9px; align-items: center; white-space: nowrap; font-size: 10px; color: #5f6568; }
.guidance-controls button { border: 0; background: none; padding: 3px; color: #59646a; width: 23px; height: 25px; }
.guidance-controls .icon { width: 12px; height: 12px; }
#guidance-prev .icon { transform: rotate(180deg); }

/* Bulk processing follows the same visual language at every stage. */
.bulk-layout { display: grid; grid-template-columns: minmax(0, 1fr) 263px; gap: 25px; grid-auto-flow: dense; align-items: start; }
.bulk-main { min-width: 0; }
.steps { display: flex; gap: 10px; align-items: center; margin: 0 0 21px; padding: 2px 2px 0; }
.step { color: #61676b; display: flex; align-items: center; gap: 8px; font-size: 11px; white-space: nowrap; }
.step b { font-weight: 450; }
.step-number { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; border: 1px solid #d6dee1; background: #fafbfb; font-size: 10px; }
.step.active { color: #455d6b; }
.step.active .step-number { background: #c3d9e3; border-color: #a4bbc8; color: #384f5b; }
.steps i { height: 1px; flex: 1; background: #dbe2e5; }
.panel { background: #fff; border: 1px solid #dae0e3; border-radius: var(--radius); padding: 25px; margin-bottom: 23px; box-shadow: 0 4px 16px #354c2404; min-width: 0; }
.panel-top { display: flex; gap: 15px; align-items: center; justify-content: space-between; margin-bottom: 25px; }
.upload-zone { display: flex; flex-direction: column; align-items: center; gap: 13px; text-align: center; padding: 35px 16px 29px; border: 1px dashed #b6c5ce; background: radial-gradient(ellipse at center, #e5eef2, #f7fafb 75%); border-radius: 12px; margin-bottom: 20px; font-weight: 400; color: #59646a; transition: border-color .2s, background .2s; }
.upload-zone:hover, .upload-zone.is-dragging { border-color: #6a8797; background: #e8f0f3; }
.upload-zone strong { font-size: 17px; letter-spacing: -.45px; font-weight: 500; color: #4c5f6a; }
.upload-zone > span:not(.upload-icon) { font-size: 12px; max-width: 300px; }
.upload-zone small { font-size: 10px; color: #5d656a; }
.upload-zone input { max-width: 100%; width: 250px; font-size: 12px; color: #5b666c; padding: 7px; }
.upload-zone input::file-selector-button { border: 1px solid #cbd8de; border-radius: 6px; padding: 8px 11px; background: #fff; color: #4f606a; font-family: inherit; margin-right: 9px; cursor: pointer; font-size: 12px; }
.upload-icon { display: grid; place-items: center; width: 58px; height: 58px; border: 1px solid #cedde3; border-radius: 17px; background: #fff; color: #505f68; margin-bottom: 1px; box-shadow: 0 4px 0 #dae6cc60; }
.upload-icon .icon { width: 25px; height: 25px; }
.upload-footer { display: flex; gap: 14px; align-items: center; justify-content: space-between; }
.upload-footer > span { font-size: 11px; color: #61676b; display: flex; gap: 6px; align-items: center; }
.upload-footer > span .icon { width: 13px; height: 13px; }
.workflow-guide { margin-top: 45px; border: 1px solid #dae1e4; border-radius: 14px; padding: 23px 20px 18px; background: #e8eef0; }
.guide-heading > .icon { color: #58656c; width: 24px; height: 24px; margin-bottom: 13px; }
.guide-heading h2 { font-size: 21px; font-weight: 450; line-height: 1.25; letter-spacing: -.7px; color: #4a5d68; }
.guide-intro { font-size: 11px; color: #5a6469; line-height: 1.8; margin-top: 12px; }
.guide-stack { display: grid; gap: 9px; margin: 22px 0 17px; }
.guide-card { background: #f4f8fa; border: 1px solid #d7e0e4; border-radius: 9px; padding: 15px; position: relative; }
.guide-card-icon .icon { color: #566268; width: 17px; height: 17px; }
.guide-card h3 { margin-top: 9px; font-size: 12px; font-weight: 500; color: #52616a; }
.guide-card p { font-size: 11px; line-height: 1.8; color: #5b6469; margin-top: 5px; }
.guide-link { display: flex; justify-content: space-between; align-items: center; font-size: 11px; color: #55636b; }
.guide-link .icon { width: 13px; height: 13px; }
.form-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-flow: dense; gap: 14px; }
select { font-size: 12px; padding: 10px; }
.form-grid label { font-size: 12px; }
.table-scroll { max-width: 100%; overflow: auto; margin: 20px 0; scrollbar-width: thin; scrollbar-color: #c2cdd3 transparent; }
table { width: 100%; border-collapse: collapse; text-align: left; font-size: 12px; white-space: nowrap; }
td, th { border-bottom: 1px solid #e5eaec; padding: 14px 13px; max-width: 320px; overflow: hidden; text-overflow: ellipsis; }
th { background: #f1f5f7; color: #5a646a; font-weight: 450; font-size: 11px; }
td { color: #5a646a; }
td small { display: block; font-size: 10px; color: #5e6569; margin-top: 5px; }
td a:hover { color: #3b525f; }
.table-action { display: inline-flex; align-items: center; gap: 7px; font-size: 11px; color: #475c68; }
.table-action .icon { width: 12px; height: 12px; }
.progress-heading { display: flex; justify-content: space-between; gap: 10px; margin: 26px 0 12px; font-size: 12px; color: #52616a; }
.progress-heading strong { font-weight: 500; }
.progress-heading > span { font-variant-numeric: tabular-nums; }
progress { width: 100%; height: 9px; border: 0; border-radius: 20px; background: #e4eaed; display: block; overflow: hidden; accent-color: #7796a8; }
progress::-webkit-progress-bar { background: #e4eaed; border-radius: 20px; }
progress::-webkit-progress-value { background: #88a5b5; border-radius: 20px; transition: width .3s; }
progress::-moz-progress-bar { background: #88a5b5; border-radius: 20px; }
.counters { display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-flow: dense; gap: 16px; margin: 28px 0 18px; padding-bottom: 23px; border-bottom: 1px solid #e2e8eb; }
.counters strong { font-size: 29px; font-weight: 450; display: block; color: #5a666c; font-variant-numeric: tabular-nums; letter-spacing: -1px; }
.counters div:first-child strong { color: #445c6a; }
.counters span { font-size: 11px; color: #5f676c; }
.progress-meta { display: flex; justify-content: space-between; gap: 10px; font-size: 11px; color: #5b6368; }
.actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 23px; }
#job-error { margin-top: 20px; }

/* Useful states stay explicit and never depend on color alone. */
.notice { padding: 13px 15px; background: #eff3f5; border: 1px solid #dbe4e8; border-radius: 8px; font-size: 12px; color: #57646c; margin: 0 0 20px; overflow-wrap: anywhere; }
main > .notice:first-child { margin-top: 25px; }
.notice.warning { background: #fcf6e6; border-color: #eadcba; color: #7a6636; }
main > .notice.warning { display: flex; gap: 10px; align-items: center; font-size: 12px; }
.notice.warning > .icon { width: 17px; height: 17px; }
.notice.warning > a { margin-left: auto; white-space: nowrap; font-size: 11px; display: inline-flex; align-items: center; gap: 8px; text-decoration: underline; }
.notice.warning > a .icon { width: 13px; height: 13px; }
.notice.error { color: #945a47; background: #fff3ed; border-color: #efd8cc; }
.notice.info { margin-top: 20px; }
.notice.success { background: #e9f0f3; border-color: #c5d7de; color: #455d6b; }
#lookup-error { margin-top: 17px; margin-bottom: 0; }
.lookup-action.is-loading { background: #d4e2e8; }
.lookup-action.is-loading .icon { animation: nexus-breathe 1s ease-in-out infinite; }
@keyframes nexus-breathe { 50% { opacity: .35; transform: translateX(3px); } }

/* History and configuration share typography, spacing and state treatment. */
.history-panel { margin-bottom: 25px; }
.history-empty { text-align: center; padding: 20px 16px 29px; }
.empty-state-symbol { display: grid; place-items: center; width: 45px; height: 45px; border-radius: 12px; border: 1px solid #e0e6e9; background: #f1f5f7; color: #586369; margin: 0 auto 15px; }
.empty-state-symbol .icon { width: 22px; height: 22px; }
.history-empty h3 { font-size: 13px; color: #52616a; font-weight: 450; }
.history-empty p { margin-top: 6px; color: #5d6569; font-size: 12px; }
.text-link { display: inline-flex; align-items: center; gap: 9px; color: #4a5e6a; font-size: 12px; margin-top: 15px; }
.text-link .icon { width: 14px; height: 14px; }
.history-empty.compact { display: flex; align-items: center; gap: 17px; text-align: left; padding: 15px 0 10px; }
.history-empty.compact .empty-state-symbol { margin: 0; flex-shrink: 0; }
.history-empty.compact .text-link { margin: 0 0 0 auto; white-space: nowrap; }
.settings-layout { display: grid; grid-template-columns: minmax(0, 1fr) 262px; grid-auto-flow: dense; gap: 25px; align-items: start; }
.settings-list { margin: 0 0 25px; }
.settings-list > div { display: grid; grid-template-columns: 160px minmax(0, 1fr); gap: 15px; align-items: center; padding: 14px 0; border-bottom: 1px solid #e8ecee; }
.settings-list dt { color: #5d676c; font-size: 12px; }
.settings-list dd { color: #506069; margin: 0; font-size: 12px; overflow-wrap: anywhere; }
.credential-state { display: inline-flex; gap: 5px; align-items: center; color: #7f6844; }
.credential-state.configured { color: #455b68; }
.credential-state .icon { width: 12px; height: 12px; }
.settings-action { display: flex; align-items: center; justify-content: space-between; gap: 20px; border-top: 1px solid #e8ecee; padding-top: 22px; }
.settings-action strong { font-size: 13px; font-weight: 500; color: #55646c; }
.settings-action p { font-size: 11px; color: #5d6569; margin-top: 4px; max-width: 240px; }
#config-result { margin-top: 20px; margin-bottom: 0; }
.settings-guide { padding: 26px 23px; border: 1px solid #d6dfe3; border-radius: 14px; background: linear-gradient(140deg, #e2ebee, #eaf0f3); }
.settings-guide-art { display: grid; place-items: center; width: 53px; height: 53px; background: #f2f7f9; border: 1px solid #d0dde3; border-radius: 15px; color: #52616a; margin-bottom: 21px; }
.settings-guide-art .icon { width: 28px; height: 28px; }
.settings-guide h2 { font-size: 22px; line-height: 1.25; color: #4e606a; font-weight: 450; letter-spacing: -.7px; margin-bottom: 14px; }
.settings-guide p { font-size: 12px; line-height: 1.9; color: #5a646a; }
.settings-guide h3 { font-size: 13px; font-weight: 500; color: #516069; margin-bottom: 8px; }
.settings-guide-rule { height: 1px; background: #d2dee3; margin: 24px 0; }
.settings-guide code { font-size: 12px; color: #4c5f6a; background: #eff5f7; padding: 1px 4px; border-radius: 3px; }

footer { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 22px 0; margin-top: 28px; border-top: 1px solid #dbe2e5; color: #5e6468; font-size: 10px; }
footer > span, .footer-brand { display: inline-flex; align-items: center; gap: 7px; }
.footer-brand { color: #5a666c; }
.footer-brand .nexus-mark { width: 18px; height: 18px; }
.footer-brand > span:last-child { color: #5e666a; }
footer .icon { width: 11px; height: 11px; }
.footer-separator { color: #606669; margin: 0 3px; }
#toast { position: fixed; left: 50%; bottom: 25px; transform: translateX(-50%); z-index: 60; max-width: calc(100% - 40px); padding: 11px 20px; border: 1px solid #4f5c64; border-radius: 9px; font-size: 13px; color: #dbe4e8; background: #272f34; box-shadow: 0 5px 18px #12251120; }

@media (min-width: 1650px) {
  :root { --sidebar: 255px; }
  main { padding: 0 55px; }
  .page-hero { padding: 57px 0 45px; }
  .lookup-shell { padding: 29px; }
  .lookup-layout { gap: 38px; }
  .lookup-panel { padding-top: 23px; }
  .result-panel { padding: 22px; }
  .empty-result { padding: 17px 0; }
  .sim-artwork { width: 184px; height: 150px; }
  .operation-tabs button { padding: 18px; }
  .operation-tabs button strong { font-size: 12px; }
  .operation-tabs button small { font-size: 11px; }
}

@media (max-width: 1190px) {
  :root { --sidebar: 210px; }
  .sidebar { padding: 25px 13px 18px; }
  .brand { font-size: 27px; padding-left: 9px; }
  .brand-caption { font-size: 10px; }
  .workspace-summary { padding-left: 7px; padding-right: 7px; font-size: 12px; }
  .nav-link { padding: 12px 11px; font-size: 13px; gap: 9px; }
  main { padding: 0 28px; }
  .topbar { padding: 0 27px; }
  .operation-tabs { gap: 6px; }
  .operation-tabs button { padding: 12px 9px; gap: 7px; }
  .operation-tabs button > .icon { width: 17px; height: 17px; }
  .operation-tabs button strong { font-size: 11px; }
  .operation-tabs button small { font-size: 10px; }
  .operation-check { display: none; }
  .lookup-layout { gap: 20px; grid-template-columns: 6fr 5fr; }
  .lookup-shell { padding: 21px; }
  .quick-link { padding: 16px 13px; gap: 10px; }
  .quick-link h3 { font-size: 12px; }
  .quick-link p { font-size: 10px; }
  .bulk-layout, .settings-layout { grid-template-columns: minmax(0, 1fr) 220px; gap: 20px; }
  .panel { padding: 22px; }
  .workflow-guide { padding: 21px 16px; }
  .settings-list > div { grid-template-columns: 125px minmax(0, 1fr); }
  .settings-action { align-items: flex-start; flex-direction: column; gap: 14px; }
}

@media (max-width: 980px) {
  :root { --sidebar: 190px; }
  .sidebar { padding: 24px 12px 18px; }
  .brand { gap: 7px; padding-left: 5px; font-size: 25px; }
  .brand-symbol { width: 34px; }
  .brand-symbol .nexus-mark { width: 34px; height: 34px; }
  .brand-caption { font-size: 10px; }
  .nav-link { font-size: 12px; gap: 8px; padding-left: 10px; }
  .nav-link > .icon { width: 16px; height: 16px; }
  .workspace-summary { gap: 7px; font-size: 11px; }
  .workspace-summary small { font-size: 10px; }
  .workspace-summary > .icon { display: none; }
  .provider-card { padding: 16px 13px; }
  .provider-label { font-size: 10px; }
  main { padding: 0 24px; }
  .page-hero { padding: 38px 0 30px; }
  .page-hero h1 { font-size: 36px; letter-spacing: -1.5px; }
  .operation-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .operation-tabs button { padding: 12px; }
  .operation-tabs button strong { font-size: 12px; }
  .operation-tabs button small { font-size: 10px; }
  .operation-check { display: block; }
  .lookup-layout { grid-template-columns: minmax(0, 1fr); gap: 23px; }
  .lookup-tip { margin-top: 20px; padding-top: 16px; }
  .result-panel { padding: 18px 20px; }
  .empty-result { padding: 4px 0 7px; }
  .empty-result-note { margin-top: 17px; }
  .empty-result p br { display: none; }
  .sim-artwork { width: 130px; height: 106px; }
  .quick-links { gap: 12px; }
  .quick-link { align-items: flex-start; flex-wrap: wrap; position: relative; padding: 18px 15px; }
  .quick-link-symbol { width: 30px; height: 30px; }
  .quick-link > div { width: 100%; }
  .quick-link-arrow { position: absolute; right: 14px; top: 23px; }
  .bulk-layout, .settings-layout { grid-template-columns: minmax(0, 1fr); }
  .workflow-guide { margin-top: 0; }
  .guide-heading br, .settings-guide h2 br { display: none; }
  .guide-heading { display: flex; align-items: center; gap: 12px; }
  .guide-heading > .icon { margin-bottom: 0; }
  .guide-heading h2 { font-size: 19px; }
  .guide-stack { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-flow: dense; gap: 10px; margin-top: 17px; }
  .guide-card { padding: 13px; }
  .guide-link { justify-content: flex-start; gap: 10px; }
  .settings-guide { padding: 23px; }
  .settings-guide-art { width: 42px; height: 42px; margin-bottom: 17px; }
  .settings-guide h2 { font-size: 21px; }
  .settings-list > div { grid-template-columns: 170px minmax(0, 1fr); }
  .settings-action { flex-direction: row; align-items: center; }
  .guidance-carousel { align-items: flex-start; }
  footer { flex-wrap: wrap; }
}

@media (max-width: 760px) {
  .sidebar { position: relative; width: 100%; padding: 18px 20px 12px; }
  .brand { padding: 0; font-size: 26px; gap: 8px; }
  .brand-caption { font-size: 10px; }
  .workspace-summary, .sidebar-bottom { display: none; }
  .sidebar nav { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; margin-top: 18px; }
  .nav-link { padding: 10px; gap: 8px; min-height: 41px; font-size: 12px; justify-content: center; text-align: center; border-radius: 7px; }
  .nav-active-dot { display: none; }
  .app-frame { margin-left: 0; }
  .topbar { height: 53px; padding: 0 25px; }
  .topbar-right { gap: 10px; }
  .user-avatar { width: 25px; height: 25px; font-size: 11px; }
  .breadcrumb { gap: 8px; font-size: 11px; }
  .breadcrumb .icon { width: 9px; height: 9px; }
  .local-indicator { font-size: 10px; }
  main { padding: 0 25px; }
  .page-hero { padding: 35px 0 29px; }
  .page-hero h1 { font-size: 39px; }
  .hero-description { font-size: 13px; margin-top: 12px; }
  .hero-actions { margin-top: 19px; }
  .lookup-layout { grid-template-columns: 7fr 5fr; gap: 20px; }
  .lookup-panel { padding-top: 13px; }
  .result-panel { padding: 15px; }
  .result-panel-label { gap: 5px; font-size: 10px; }
  .waiting-indicator { font-size: 10px; }
  .empty-result { padding-top: 14px; }
  .empty-result h2 { font-size: 15px; }
  .empty-result p { font-size: 11px; }
  .empty-result-note { font-size: 10px; }
  .empty-result-note .icon { display: none; }
  .result-fields { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .result-summary strong { font-size: 26px; }
  .lookup-tip p { font-size: 10px; }
  .lookup-tip strong { font-size: 11px; }
  .lookup-assurance { font-size: 10px; }
  .field-heading > span { font-size: 10px; }
  .hint { font-size: 10px; }
  .lookup-action { font-size: 12px; }
  .quick-links { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .quick-link { flex-wrap: nowrap; align-items: center; padding: 17px; }
  .quick-link > div { width: auto; }
  .quick-link-arrow { display: none; }
  .page-heading { padding-top: 31px; gap: 14px; }
  .page-heading h1 { font-size: 32px; }
  .page-heading p { font-size: 13px; }
  .guide-stack { gap: 12px; }
  .history-empty.compact { flex-wrap: wrap; }
  .history-empty.compact .text-link { margin-left: 62px; }
}

@media (max-width: 540px) {
  html { scroll-padding-top: 20px; }
  .sidebar { padding: 16px 13px 11px; }
  .brand { margin-left: 4px; font-size: 25px; }
  .sidebar nav { gap: 4px; margin-top: 16px; }
  .nav-link { padding: 9px 5px; font-size: 10px; gap: 5px; min-height: 42px; }
  .nav-link > .icon { width: 14px; height: 14px; }
  .nav-link > span { line-height: 1.4; }
  .nav-link:last-child > span { max-width: 65px; }
  .topbar { padding: 0 19px; height: 48px; }
  .local-indicator { font-size: 10px; }
  .local-indicator .dot { width: 4px; height: 4px; }
  .user-avatar { display: none; }
  .breadcrumb { font-size: 10px; gap: 6px; }
  main { padding: 0 17px; }
  .page-hero { padding: 31px 0 26px; }
  .page-hero h1 { font-size: clamp(27px, 8vw, 38px); letter-spacing: -1.3px; white-space: nowrap; }
  .hero-description { font-size: 12px; max-width: 300px; margin: 12px auto 0; }
  .mobile-break { display: block; }
  .hero-actions { gap: 8px; margin-top: 18px; }
  .button { font-size: 12px; padding: 10px 13px; min-height: 41px; gap: 14px; }
  .button .icon { width: 14px; height: 14px; }
  .lookup-shell { padding: 18px 14px 14px; border-radius: 14px; }
  .workspace-heading { margin-bottom: 18px; }
  .workspace-heading > div { gap: 8px; }
  .heading-icon { width: 30px; height: 32px; border-radius: 8px; }
  .heading-icon .icon { width: 15px; height: 15px; }
  h2 { font-size: 14px; }
  .workspace-heading p { font-size: 10px; }
  .provider-chip { font-size: 10px; padding: 4px 6px; gap: 4px; }
  .provider-chip .dot { width: 4px; height: 4px; }
  .operation-tabs { gap: 7px; margin-bottom: 18px; }
  .operation-tabs button { padding: 11px 9px; gap: 8px; min-height: 58px; }
  .operation-tabs button > .icon { width: 17px; height: 17px; }
  .operation-tabs button strong { font-size: 11px; }
  .operation-tabs button small { font-size: 10px; }
  .operation-check { display: none; }
  .lookup-layout { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .lookup-panel { padding: 8px 2px 0; }
  .field-heading label { font-size: 12px; }
  .identifier-input input { font-size: 13px; }
  .hint { font-size: 10px; }
  .lookup-action { margin-top: 16px; font-size: 13px; }
  .lookup-assurance { font-size: 10px; }
  .lookup-tip { margin-top: 20px; padding-top: 15px; }
  .lookup-tip strong { font-size: 12px; }
  .lookup-tip p { font-size: 11px; }
  .result-panel { padding: 15px 16px 19px; }
  .result-panel-label { font-size: 10px; }
  .waiting-indicator { font-size: 10px; }
  .empty-result { padding: 8px 0 0; }
  .sim-artwork { width: 142px; height: 116px; }
  .empty-result h2 { font-size: 17px; }
  .empty-result p { font-size: 12px; max-width: 200px; margin-left: auto; margin-right: auto; }
  .empty-result-note { margin-top: 18px; font-size: 10px; }
  .result-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .result-summary strong { font-size: 31px; }
  .quick-links { grid-template-columns: minmax(0, 1fr); gap: 10px; margin-top: 16px; }
  .quick-link { padding: 16px; gap: 12px; }
  .quick-link h3 { font-size: 13px; }
  .quick-link p { font-size: 10px; }
  .quick-link-symbol { width: 32px; height: 35px; }
  .quick-link-arrow { display: block; position: static; width: 12px; height: 12px; }
  .guidance-carousel { padding-top: 20px; gap: 10px; }
  .guidance-copy { align-items: flex-start; gap: 6px; }
  .guidance-copy .dot { margin-top: 5px; }
  .guidance-copy p { font-size: 10px; }
  .guidance-controls { gap: 3px; font-size: 10px; }
  .guidance-controls button { width: 19px; padding: 0; }
  .page-heading { display: block; padding: 30px 0 23px; }
  .page-heading h1 { font-size: 31px; line-height: 1.2; letter-spacing: -1.25px; }
  .page-heading p { font-size: 12px; max-width: 300px; margin-top: 10px; }
  .page-heading > .button, .page-heading > .format-chip, .page-heading > .configuration-pill { margin-top: 17px; }
  .format-chip { font-size: 11px; padding: 6px 9px; }
  .panel { padding: 20px 16px; border-radius: 14px; margin-bottom: 18px; }
  .panel-top { gap: 10px; margin-bottom: 21px; }
  .panel-top p { font-size: 11px; }
  .panel-top h2 { font-size: 14px; }
  .panel-top .badge { font-size: 10px; }
  .steps { gap: 8px; margin-bottom: 18px; }
  .step { font-size: 10px; gap: 5px; }
  .step-number { width: 20px; height: 20px; font-size: 10px; }
  .upload-zone { gap: 12px; padding: 28px 12px 21px; }
  .upload-zone strong { font-size: 17px; }
  .upload-zone > span:not(.upload-icon) { font-size: 11px; max-width: 240px; }
  .upload-zone input { max-width: 100%; font-size: 11px; }
  .upload-footer { flex-direction: column-reverse; align-items: stretch; gap: 14px; }
  .upload-footer > span { justify-content: center; font-size: 10px; }
  .form-grid { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  select { font-size: 13px; }
  .workflow-guide { padding: 22px 17px 19px; }
  .guide-heading { align-items: flex-start; gap: 10px; }
  .guide-heading h2 { font-size: 20px; }
  .guide-heading > .icon { width: 21px; height: 21px; }
  .guide-intro { font-size: 11px; }
  .guide-stack { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .guide-card { padding: 16px; }
  .guide-card h3 { font-size: 13px; margin-top: 7px; }
  .guide-card p { font-size: 12px; }
  .guide-link { font-size: 12px; }
  .counters { gap: 10px; padding-bottom: 20px; }
  .counters strong { font-size: 26px; }
  .counters span { font-size: 10px; }
  .progress-meta { font-size: 10px; }
  .actions .button { width: 100%; }
  .notice { font-size: 11px; padding: 12px; }
  main > .notice.warning { flex-wrap: wrap; align-items: flex-start; font-size: 11px; gap: 8px; }
  main > .notice.warning > div { flex: 1; }
  .notice.warning > a { width: 100%; margin-left: 25px; font-size: 10px; }
  .history-empty { padding: 15px 5px 22px; }
  .history-empty h3 { font-size: 12px; }
  .history-empty p { font-size: 11px; }
  .history-empty.compact { gap: 12px; align-items: flex-start; }
  .history-empty.compact > div { flex: 1; }
  .history-empty.compact .text-link { margin-left: 57px; }
  .history-empty.compact h3 { font-size: 13px; }
  .settings-list > div { grid-template-columns: 115px minmax(0, 1fr); gap: 10px; }
  .settings-list dt { font-size: 11px; }
  .settings-list dd { font-size: 11px; }
  .settings-action { flex-direction: column; gap: 16px; align-items: stretch; }
  .settings-action p { max-width: none; }
  .settings-guide { padding: 23px 20px; }
  .settings-guide h2 { font-size: 22px; }
  .settings-guide p { font-size: 13px; }
  .settings-guide h3 { font-size: 12px; }
  footer { display: grid; gap: 9px; margin-top: 23px; padding: 19px 0 23px; font-size: 10px; }
  footer > span { gap: 5px; }
  .footer-brand .nexus-mark { width: 16px; height: 16px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .reveal-section, .guide-card, .hero-description, .sim-artwork { transform: none !important; opacity: 1 !important; }
}

/* Bulk source selection and readable exports. */
.source-type-picker { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-bottom:25px; }
.source-type-picker button { display:flex; align-items:center; gap:11px; padding:16px 13px; text-align:left; border:1px solid #dbe1e4; border-radius:10px; background:#f8fafb; color:#5b6a73; }
.source-type-picker button[aria-pressed=true] { border-color:#96afbd; background:#e9f1f4; }
.source-type-picker button strong { display:block; font-size:12px; font-weight:550; }
.source-type-picker button small { display:block; margin-top:4px; font-size:10px; line-height:1.6; }
.source-type-picker button > .icon:last-child { margin-left:auto; width:14px; height:14px; opacity:0; }
.source-type-picker button[aria-pressed=true] > .icon:last-child { opacity:1; }
.export-summary { border-top:1px solid #dfe5e8; padding-top:20px; margin-top:20px; }
.export-summary > strong { font-size:12px; font-weight:550; color:#4a5b64; }
.export-summary p { font-size:11px; color:#616e75; margin-top:12px; line-height:1.8; }
.output-fields { display:flex; flex-wrap:wrap; gap:6px; margin-top:12px; }
.output-fields span { font-size:10px; padding:5px 8px; border:1px solid #d4dee3; border-radius:5px; background:#f2f6f7; color:#596b75; }
.bulk-results-preview { border-top:1px solid #dfe5e8; margin-top:25px; padding-top:23px; }
.bulk-results-preview h3 { font-size:14px; font-weight:550; color:#43545e; }
.bulk-results-preview td { font-size:11px; }
.bulk-results-preview th { font-size:10px; }
.job-operation { font-size:11px !important; color:#4a5f6b !important; margin-top:10px !important; }
@media(max-width:540px) { .source-type-picker { grid-template-columns:minmax(0,1fr); gap:8px; } .source-type-picker button { padding:13px; } .source-type-picker button small { font-size:11px; } }

/* Nexus company palette */
:root { --ink:#111820; --muted:#53626b; --paper:#f2f4f5; --forest:#101c2c; --accent:#007f94; --accent-hover:#006a7d; --accent-dark:#006577; }
.nav-link.active, .button.primary { color:#fff; border-color:#007f94; }
.skip-link { color:#fff; }

.login-panel { max-width:460px; margin:10vh auto; }
.user-edit { border-top:1px solid #d7e0e4; padding:20px 0; }
fieldset { border:1px solid #d7e0e4; border-radius:8px; margin:15px 0; padding:12px; }
fieldset label { display:inline-flex; gap:7px; align-items:center; margin:8px; }
fieldset input[type=checkbox] { width:auto; }

/* Subscriber service catalog and SIM swap review. */
.eyebrow { display:block; color:#536c7b; font-size:10px; font-weight:650; letter-spacing:.09em; line-height:1.4; text-transform:uppercase; }
.bundle-workspace { padding:clamp(20px,3vw,34px); }
.bundle-workspace-heading, .bundle-result-heading { display:flex; align-items:center; justify-content:space-between; gap:28px; }
.bundle-workspace-heading h2, .bundle-result-heading h2 { margin-top:6px; font-size:clamp(20px,2vw,26px); letter-spacing:-.65px; }
.bundle-workspace-heading p { max-width:620px; margin-top:6px; color:var(--muted); font-size:12px; }
.bundle-flow { display:flex; align-items:center; flex:0 0 auto; gap:9px; color:#72808a; }
.flow-step { padding:7px 10px; border:1px solid #dbe2e6; border-radius:7px; background:#f8fafb; font-size:10px; font-weight:550; }
.flow-step.active { color:#fff; border-color:var(--forest); background:var(--forest); }
.flow-step.done { color:#225d70; border-color:#bdd5dd; background:#eaf3f5; }
.flow-connector { width:20px; height:1px; background:#cbd4d9; }
.bundle-search-form { display:grid; grid-template-columns:minmax(220px,1.4fr) minmax(160px,.7fr) auto; align-items:end; gap:14px; margin-top:25px; padding:18px; border:1px solid #dbe3e7; border-radius:12px; background:linear-gradient(110deg,#f7fafb,#fff 62%); }
.bundle-search-form label, .bundle-search label { display:block; margin-bottom:7px; color:#3b4d58; font-size:11px; font-weight:600; }
.bundle-search-form .button { min-height:47px; }
.bundle-progress { margin-top:15px; padding:10px 13px; color:#3f5d6b; border-left:3px solid var(--accent); background:#f3f7f8; font-size:11px; }
.bundle-results { margin-top:27px; }
.bundle-result-heading { align-items:end; margin-bottom:19px; }
.bundle-result-heading .hint { margin-top:5px; }
.bundle-search { width:min(280px,100%); flex:0 0 auto; }
.bundle-search input { min-height:40px; }
.bundle-status-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin:15px 0 22px; }
.bundle-status-card { display:grid; grid-template-columns:1fr auto; gap:4px 10px; padding:13px 14px; border:1px solid #dfe5e8; border-radius:9px; background:#fbfcfc; }
.bundle-status-label { color:#52636e; font-size:11px; font-weight:600; }
.bundle-status-count { grid-row:span 2; align-self:center; color:#16334a; font-size:22px; font-weight:600; }
.bundle-status-card small { color:#73808a; font-size:10px; line-height:1.45; }
.bundle-filter-bar { display:flex; flex-wrap:wrap; gap:7px; padding:0 0 16px; border-bottom:1px solid #e2e7e9; }
.bundle-filter { min-height:34px; padding:6px 11px; color:#596a75; border:1px solid #dbe2e6; border-radius:7px; background:#fff; font-size:10px; font-weight:550; }
.bundle-filter[aria-pressed=true] { color:#fff; border-color:var(--forest); background:var(--forest); }
.bundle-offer-groups { display:grid; gap:22px; padding-top:18px; }
.bundle-offer-group[hidden], .bundle-card[hidden] { display:none; }
.bundle-group-heading { display:flex; align-items:center; gap:10px; margin-bottom:11px; }
.bundle-group-title { color:#203746; font-size:14px; font-weight:650; }
.bundle-group-count { padding:3px 8px; color:#61727c; border:1px solid #dee5e8; border-radius:20px; background:#f4f7f8; font-size:10px; }
.bundle-group-empty { margin:0; padding:15px 17px; color:#697983; border:1px dashed #cbd6dc; border-radius:9px; background:#fafcfc; font-size:11px; }
.bundle-card-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr)); gap:12px; }
.bundle-card { display:flex; min-width:0; flex-direction:column; gap:12px; padding:17px; border:1px solid #dbe3e7; border-radius:11px; background:#fff; box-shadow:0 3px 12px #10263a08; transition:border-color .18s,box-shadow .18s,transform .18s; }
.bundle-card:hover { transform:translateY(-2px); border-color:#aabdc7; box-shadow:0 7px 18px #10263a12; }
.bundle-card-top { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
.bundle-card-top h3 { color:#172d3d; font-size:14px; font-weight:630; line-height:1.45; }
.bundle-charge-badge { flex:0 0 auto; padding:4px 7px; color:#31566b; border:1px solid #cddde4; border-radius:5px; background:#eef5f7; font-size:9px; font-weight:600; }
.bundle-allowance { color:#007f94; font-size:20px; font-weight:650; letter-spacing:-.4px; }
.bundle-facts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin:0; padding-top:11px; border-top:1px solid #edf0f1; }
.bundle-facts div { min-width:0; }
.bundle-facts dt { color:#71808a; font-size:9px; }
.bundle-facts dd { margin:3px 0 0; color:#263944; font-size:10px; font-weight:570; overflow-wrap:anywhere; }
.bundle-card-actions { display:flex; flex-wrap:wrap; align-items:center; gap:7px; margin-top:auto; padding-top:3px; }
.bundle-no-code, .bundle-permission-note { color:#7a6c50; font-size:10px; }
.bundle-review { position:sticky; bottom:12px; z-index:5; margin-top:22px; padding:19px; border:1px solid #9eafb8; border-radius:12px; background:#f5f8f9; box-shadow:0 10px 34px #10263a1c; }
.bundle-review[hidden] { display:none; }
.bundle-review-header { display:flex; align-items:center; justify-content:space-between; gap:14px; }
.bundle-review-header h3 { margin-top:4px; color:#183447; font-size:17px; }
.bundle-review-details { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin:15px 0; }
.bundle-review-item { display:grid; gap:3px; min-width:0; padding:10px; border:1px solid #dce4e7; border-radius:7px; background:#fff; }
.bundle-review-item span { color:#6a7880; font-size:9px; }
.bundle-review-item strong { color:#203744; font-size:11px; font-weight:580; overflow-wrap:anywhere; }
.bundle-review-note { margin:4px 0 12px; color:#5d6a71; font-size:11px; }
.service-secondary-panel .panel-top { align-items:flex-start; }
.service-secondary-panel .panel-top h2 { margin-top:5px; }
.service-inline-form { display:grid; grid-template-columns:minmax(220px,1fr) auto; align-items:end; gap:13px; }
.service-inline-form label { display:block; margin-bottom:7px; font-size:11px; font-weight:600; }
.service-heading { align-items:center; }
.sim-change-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; align-items:end; }
.sim-change-grid > div > label, .sim-swap-field-label label { display:block; margin-bottom:7px; font-size:11px; font-weight:600; }
.sim-change-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; grid-column:1/-1; }
.sim-change-fields > div { min-width:0; }
.sim-swap-field-label { display:flex; justify-content:space-between; align-items:center; gap:8px; }
.sim-swap-field-label .button { min-height:30px; padding:4px 8px; font-size:10px; }
.sim-lookup-status { margin:12px 0 0; padding:10px 12px; color:#3c6676; border-radius:7px; background:#eef5f7; font-size:11px; }
.sim-lookup-status.error { color:#945a47; background:#fff3ed; }
@media(max-width:900px) {
  .bundle-workspace-heading { align-items:flex-start; flex-direction:column; gap:16px; }
  .bundle-status-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:640px) {
  .bundle-search-form { grid-template-columns:minmax(0,1fr); padding:14px; }
  .bundle-search-form .button { width:100%; }
  .bundle-result-heading { align-items:stretch; flex-direction:column; }
  .bundle-search { width:100%; }
  .bundle-status-grid { gap:7px; }
  .bundle-status-card { padding:10px; }
  .bundle-review-details { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .service-inline-form { grid-template-columns:minmax(0,1fr); }
  .service-inline-form .button { width:100%; }
  .sim-change-grid, .sim-change-fields { grid-template-columns:minmax(0,1fr); }
  .sim-change-fields { grid-column:auto; }
  .bundle-flow { width:100%; gap:6px; }
  .flow-connector { flex:1; }
  .flow-step { padding:6px 8px; }
}
@media(prefers-reduced-motion:reduce) {
  .bundle-card { transition:none; }
  .bundle-card:hover { transform:none; }
}

.sim-management-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; align-items:start; }
.sim-action-panel { min-width:0; padding:clamp(18px,2.5vw,28px); }
.sim-action-panel .panel-top { align-items:flex-start; margin-bottom:20px; }
.sim-action-panel .panel-top h2 { margin-top:5px; color:#172d3d; font-size:18px; }
.sim-action-panel .panel-top p { max-width:440px; margin-top:6px; line-height:1.7; }
.sim-action-fields, .sim-swap-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:13px; }
.sim-swap-fields > div:first-child { grid-column:1/-1; }
.sim-action-fields label, .sim-swap-fields label { display:block; margin-bottom:7px; color:#3b4d58; font-size:11px; font-weight:600; }
.sim-swap-fields input[readonly] { color:#53626b; background:#f1f4f5; cursor:default; }
.sim-action-form > .actions { margin-top:16px; }
.sim-change-review { margin-top:18px; }
.sim-change-review > div[id$="-details"] { display:grid; gap:7px; margin:12px 0; }
.sim-change-review > div[id$="-details"] p { display:grid; grid-template-columns:minmax(100px,.7fr) minmax(0,1.3fr); gap:12px; margin:0; padding:8px 10px; border:1px solid #dce4e7; border-radius:6px; background:#fff; font-size:11px; }
.sim-change-review > div[id$="-details"] span { color:#64737c; }
.sim-change-review > div[id$="-details"] strong { color:#233b4a; font-weight:600; overflow-wrap:anywhere; }
@media(max-width:900px) { .sim-management-grid { grid-template-columns:minmax(0,1fr); } }
@media(max-width:540px) { .sim-action-panel { padding:17px 14px; } .sim-action-fields,.sim-swap-fields { grid-template-columns:minmax(0,1fr); } .sim-swap-fields > div:first-child { grid-column:auto; } .sim-change-review > div[id$="-details"] p { grid-template-columns:minmax(0,1fr); gap:3px; } }
