:root {
  --ink: #15211f;
  --ink-soft: #344a46;
  --deep: #12201d;
  --deep-alt: #18342f;
  --paper: #e9e8df;
  --paper-bright: #f6f5ee;
  --line: #c7cbc2;
  --moss: #2e8b75;
  --moss-dark: #176554;
  --orange: #df6849;
  --sun: #e8bd58;
  --blue: #4a8491;
  --mono: "DM Mono", ui-monospace, monospace;
  --display: "Fraunces", Georgia, serif;
  --body: "Manrope", "PingFang SC", sans-serif;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { min-width: 320px; background: var(--paper); }

/* Server access gate: private, editorial, and deliberately separate from the local test canvas. */
.login-gate { position: fixed; z-index: 50; inset: 0; display: grid; place-items: center; padding: 26px; overflow: auto; background: linear-gradient(135deg, rgba(11,30,25,.97), rgba(19,53,45,.95)); }
.login-gate::before, .login-gate::after { content: ""; position: fixed; pointer-events: none; border-radius: 50%; filter: blur(1px); }
.login-gate::before { width: 48vw; height: 48vw; top: -22vw; right: -10vw; background: radial-gradient(circle, rgba(83,170,139,.22), transparent 69%); }
.login-gate::after { width: 38vw; height: 38vw; left: -16vw; bottom: -19vw; background: radial-gradient(circle, rgba(223,104,73,.16), transparent 72%); }
.login-sheet { position: relative; z-index: 1; width: min(500px, 100%); padding: clamp(29px, 5vw, 52px); border: 1px solid rgba(217,237,224,.18); background: rgba(246,245,238,.97); box-shadow: 16px 18px 0 rgba(232,189,88,.88); }
.login-mark { display: flex; align-items: flex-start; gap: 11px; color: var(--deep); font-family: var(--display); font-size: 22px; font-weight: 650; line-height: .82; }.login-mark .brand-mark { padding-top: 3px; }
.login-sheet > .eyebrow { margin-top: 38px; }.login-sheet h1 { margin: 12px 0 13px; color: var(--deep); font-family: var(--display); font-size: clamp(37px, 6vw, 57px); font-weight: 500; line-height: .92; letter-spacing: -2px; }.login-sheet h1 em { color: var(--moss-dark); font-weight: inherit; }.login-sheet > p { margin: 0; max-width: 375px; color: #596b62; font-size: 12px; line-height: 1.75; }
.login-form { display: grid; gap: 13px; margin-top: 25px; }.login-form label { display: grid; gap: 6px; color: #52645b; font-family: var(--mono); font-size: 9px; }.login-form input { width: 100%; padding: 12px 13px; color: var(--ink); border: 1px solid #bfc8be; border-radius: 0; background: #fffefa; font: 500 13px var(--body); outline: none; }.login-form input:focus { border-color: var(--moss-dark); box-shadow: 3px 3px 0 rgba(23,101,84,.13); }.login-form button { margin-top: 5px; padding: 13px 15px; color: var(--paper-bright); border: 0; background: var(--deep); font-family: var(--mono); font-size: 10px; text-align: left; }.login-form button b { float: right; color: var(--sun); font-size: 14px; }.login-form button:hover:not(:disabled) { background: var(--moss-dark); }.login-form button:disabled { cursor: wait; opacity: .65; }.login-error { margin: 0; padding: 9px 10px; color: #8b4031; border-left: 3px solid var(--orange); background: #fae9e2; font-size: 10px; line-height: 1.5; }.login-footnote { display: block; margin-top: 19px; color: #728078; font-size: 9px; line-height: 1.55; }

/* Product classification workbench: an editorial contact sheet plus a precise taxonomy form. */
.product-heading { padding-bottom: 23px; }.product-counter { align-self: flex-end; min-width: 180px; padding: 15px; border-left: 4px solid var(--orange); background: rgba(246,245,238,.82); }.product-counter span, .product-counter small { display: block; color: #68766f; font-family: var(--mono); font-size: 8px; }.product-counter strong { display: block; margin: 3px 0; font-family: var(--display); font-size: 43px; line-height: 1; font-weight: 500; }.product-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 15px 18px; }.product-toolbar .eyebrow { margin-bottom: 4px; }.product-toolbar strong { display: inline-block; margin-right: 9px; font-size: 12px; }.product-toolbar small { color: #6d7973; font-family: var(--mono); font-size: 8px; }.scan-button { padding: 10px 12px; color: var(--paper-bright); border: 0; background: var(--deep); font-family: var(--mono); font-size: 9px; }.scan-button:hover:not(:disabled) { background: var(--moss-dark); }.scan-button:disabled { cursor: wait; opacity: .65; }.scan-button b { margin-left: 5px; color: var(--sun); }
.product-workbench { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(320px, .75fr); gap: 17px; margin-top: 17px; align-items: start; }.product-queue, .product-inspector { padding: 20px; }.queue-count { color: #65736c; font-family: var(--mono); font-size: 9px; }.product-filter-row { display: flex; justify-content: space-between; gap: 10px; margin: 17px 0 13px; }.product-filter, .scene-filter { min-height: 29px; padding: 6px 8px; color: #5d6e66; border: 1px solid var(--line); background: var(--paper-bright); font-family: var(--mono); font-size: 8px; }.product-filter.active, .product-filter:hover { color: var(--paper-bright); border-color: var(--deep); background: var(--deep); }.scene-filter { max-width: 145px; }.product-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; min-height: 340px; }.image-tile { position: relative; min-height: 123px; overflow: hidden; border: 1px solid var(--line); background: #f4f4ee; text-align: left; }.image-tile:hover, .image-tile.selected { border-color: var(--moss-dark); box-shadow: 0 0 0 2px rgba(23,101,84,.16); }.image-select { display: block; width: 100%; padding: 0; border: 0; background: transparent; cursor: pointer; }.image-tile img { width: 100%; height: 123px; display: block; object-fit: contain; background: #f4f4ee; filter: saturate(.86); transition: opacity .2s ease; }.image-tile:hover img { opacity: .92; }.tile-footer { position: absolute; z-index: 2; inset: auto 0 0; padding: 6px 7px; color: #edf3ed; background: linear-gradient(transparent, rgba(9,22,18,.85) 45%); font-family: var(--mono); font-size: 7px; pointer-events: none; }.tile-footer span { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }.tile-status { position: absolute; z-index: 3; top: 6px; right: 6px; padding: 4px 5px; color: #496054; background: #d8eadc; font-family: var(--mono); font-size: 7px; pointer-events: none; }.tile-status.draft { color: #825d2c; background: #f4e0b5; }.tile-status.verified { color: var(--deep); background: var(--sun); }.tile-zoom { position: absolute; z-index: 4; top: 6px; left: 6px; padding: 5px 6px; color: var(--paper-bright); border: 0; background: rgba(18,32,29,.88); font-family: var(--mono); font-size: 7px; opacity: 0; transform: translateY(-3px); transition: opacity .18s ease, transform .18s ease; }.image-tile:hover .tile-zoom, .image-tile:focus-within .tile-zoom { opacity: 1; transform: none; }.tile-zoom:hover { color: var(--deep); background: var(--sun); }.product-empty { display: grid; place-items: center; min-height: 180px; padding: 22px; color: #68776f; border: 1px dashed var(--line); background: rgba(255,255,255,.24); font-family: var(--mono); font-size: 10px; text-align: center; }.product-grid .product-empty { grid-column: 1 / -1; }.product-pagination { display: flex; align-items: center; justify-content: space-between; margin-top: 13px; color: #67756d; font-family: var(--mono); font-size: 9px; }.page-button { padding: 7px 0; color: var(--moss-dark); border: 0; background: transparent; font-family: var(--mono); font-size: 9px; }.page-button:disabled { color: #a2aaa4; cursor: not-allowed; }
.inspector-empty { min-height: 520px; place-content: center; text-align: left; }.inspector-empty h2 { margin: 8px 0 11px; color: var(--deep); font-family: var(--display); font-size: 29px; font-weight: 500; line-height: 1; }.inspector-empty p { margin: 0; max-width: 255px; font-family: var(--body); font-size: 11px; line-height: 1.6; }.product-preview { position: relative; height: 240px; overflow: hidden; background: #f4f4ee; }.product-preview img { width: 100%; height: 100%; object-fit: contain; background: #f4f4ee; }.product-preview span { position: absolute; top: 9px; left: 9px; padding: 5px 6px; color: #384f45; background: #e8bd58; font-family: var(--mono); font-size: 8px; }.selected-product-meta { padding: 12px 0; border-bottom: 1px solid var(--line); }.selected-product-meta span { display: block; color: #718078; font-family: var(--mono); font-size: 8px; }.selected-product-meta strong { display: block; margin-top: 4px; overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }.suggestion-box { margin: 14px 0; padding: 10px; border-left: 3px solid var(--sun); background: #f4ecd7; }.suggestion-box span, .suggestion-box small { display: block; font-family: var(--mono); font-size: 8px; }.suggestion-box span { color: #896632; }.suggestion-box strong { display: block; margin: 4px 0; color: #513b20; font-size: 11px; }.suggestion-box small { color: #785f3a; }.classification-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }.classification-fields label { color: #596a62; font-family: var(--mono); font-size: 8px; }.classification-fields select, .classification-fields textarea { width: 100%; margin-top: 5px; padding: 8px; color: var(--ink); border: 1px solid var(--line); background: var(--paper-bright); font-family: var(--body); font-size: 10px; }.classification-fields textarea { resize: vertical; line-height: 1.45; }.notes-field { grid-column: 1 / -1; }.classification-actions { display: grid; grid-template-columns: 1fr 1.15fr; gap: 8px; margin-top: 14px; }.draft-classification, .verify-classification { padding: 10px; border: 1px solid var(--moss-dark); font-family: var(--mono); font-size: 8px; }.draft-classification { color: var(--moss-dark); background: transparent; }.draft-classification:hover { background: #deece4; }.verify-classification { color: var(--paper-bright); background: var(--deep); border-color: var(--deep); }.verify-classification:hover:not(:disabled) { background: var(--moss-dark); }.verify-classification:disabled { cursor: not-allowed; opacity: .45; }.classification-note { display: block; margin-top: 8px; color: #748078; font-size: 9px; line-height: 1.5; }
.product-filter.discarded-filter { color: #8b4a3c; border-color: #e8c4b7; background: #fbede7; }
.product-filter.discarded-filter.active, .product-filter.discarded-filter:hover { color: #fff8f3; border-color: #9b4b39; background: #9b4b39; }
.tile-status.discarded { color: #804334; background: #f1d0c4; }
.classification-actions { grid-template-columns: 1fr 1fr 1.15fr; }
.classification-actions.discarded-state { grid-template-columns: 1fr; }
.discard-classification { padding: 10px; color: #8b4a3c; border: 1px solid #c98270; background: #fff9f5; font-family: var(--mono); font-size: 8px; }
.discard-classification:hover { color: #fff8f3; background: #9b4b39; }
.discard-classification.restore { color: var(--moss-dark); border-color: var(--moss-dark); background: #edf4ef; }
.discard-classification.restore:hover { color: var(--paper-bright); background: var(--moss-dark); }
@media (max-width: 1050px) { .product-workbench { grid-template-columns: 1fr; }.product-inspector { max-width: none; }.inspector-empty { min-height: 250px; }.product-preview { height: 330px; } }
@media (max-width: 760px) { .nav-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }.product-toolbar, .product-filter-row { align-items: stretch; flex-direction: column; }.product-toolbar .scan-button { width: 100%; }.scene-filter { max-width: none; }.product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.image-tile, .image-tile img { min-height: 150px; height: 150px; }.classification-fields, .classification-actions { grid-template-columns: 1fr; }.product-counter { min-width: 0; }.product-preview { height: 255px; } }

/* Local V1 controls: persistent state is visibly distinct from the real mail channel. */
.local-badge { padding: 5px 7px; color: #855131; border: 1px solid #e5cbbd; background: #f8e8dd; font-family: var(--mono); font-size: 8px; letter-spacing: .3px; }
.reset-button { width: 100%; margin-top: 14px; padding: 9px 10px; color: #d7e7dc; border: 1px solid #49675c; background: transparent; font-family: var(--mono); font-size: 9px; }.reset-button:hover:not(:disabled) { color: #1e332c; border-color: var(--sun); background: var(--sun); }.reset-button:disabled { cursor: not-allowed; opacity: .38; }
.logout-button { width: 100%; margin-top: 9px; padding: 9px 10px; color: #f4d5ca; border: 1px solid rgba(223,104,73,.65); background: transparent; font-family: var(--mono); font-size: 9px; }.logout-button:hover { color: #fff7f3; background: #9b4b39; }
.approve-button:hover:not(:disabled) { transform: translateY(-2px); background: var(--moss-dark); }
.approve-button:disabled { cursor: not-allowed; opacity: .53; }
.approve-button.approved { opacity: 1; }
.sequence-step.stopped { color: #ffd0c3; border-color: var(--orange); background: rgba(223,104,73,.12); }
.access-card { width: min(600px, 100%); }
.access-card > p { margin-top: -10px; }
.role-options { display: grid; gap: 7px; margin-top: 18px; }
.role-option { width: 100%; display: grid; grid-template-columns: 30px 1fr auto; gap: 9px; align-items: center; padding: 10px; color: #dce9df; border: 1px solid #39584d; background: #173029; text-align: left; }
.role-option:hover, .role-option.selected { border-color: var(--sun); background: #224238; }
.role-option .avatar { width: 27px; height: 27px; }
.role-option strong, .role-option small { display: block; }.role-option strong { font-size: 11px; }.role-option small { margin-top: 2px; color: #9bb8aa; font-family: var(--mono); font-size: 8px; }.role-option em { color: var(--sun); font-family: var(--mono); font-size: 7px; font-style: normal; text-align: right; }
.audit-heading { display: flex; justify-content: space-between; align-items: baseline; margin-top: 22px; padding-top: 16px; border-top: 1px solid #39584d; }.audit-heading strong { color: #e9f2e9; font-size: 11px; }.audit-trail { display: grid; max-height: 180px; margin-top: 8px; overflow: auto; }.audit-row { display: grid; grid-template-columns: 45px 1fr; gap: 3px 8px; padding: 9px 0; border-bottom: 1px solid rgba(140,178,162,.2); }.audit-row span { color: var(--sun); font-family: var(--mono); font-size: 8px; }.audit-row strong { color: #e3eee5; font-size: 10px; }.audit-row small { grid-column: 1 / -1; color: #a9c1b4; font-size: 9px; line-height: 1.4; }.empty-audit { color: #a9c1b4; }
@media (max-width: 760px) { .local-badge { display: none; }.role-option { grid-template-columns: 30px 1fr; }.role-option em { display: none; } }
body { margin: 0; min-height: 100vh; color: var(--ink); background: var(--paper); font-family: var(--body); font-size: 15px; }
button { font: inherit; cursor: pointer; }
button:focus-visible, a:focus-visible { outline: 3px solid var(--sun); outline-offset: 3px; }

.ambient { position: fixed; pointer-events: none; border-radius: 999px; filter: blur(0); opacity: .5; z-index: -1; }
.ambient-one { width: 55vw; height: 55vw; background: radial-gradient(circle, rgba(70, 140, 126, .13), transparent 67%); top: -25vw; right: -12vw; }
.ambient-two { width: 42vw; height: 42vw; background: radial-gradient(circle, rgba(224, 104, 73, .08), transparent 70%); bottom: -20vw; left: 8vw; }

.app-shell { display: grid; grid-template-columns: 272px minmax(0, 1fr); min-height: 100vh; }
.sidebar { position: sticky; top: 0; height: 100vh; padding: 27px 17px 16px; display: flex; flex-direction: column; color: #e4ede6; background: var(--deep); overflow: hidden; }
.sidebar::before { content: ""; position: absolute; inset: 0; opacity: .12; background-image: linear-gradient(rgba(233, 232, 223, .18) 1px, transparent 1px), linear-gradient(90deg, rgba(233, 232, 223, .18) 1px, transparent 1px); background-size: 24px 24px; mask-image: linear-gradient(to bottom, black, transparent 58%); }
.brand, .nav-list, .sidebar-note, .operator { position: relative; z-index: 1; }
.brand { display: flex; gap: 12px; align-items: flex-start; color: #f0f5ef; text-decoration: none; padding: 0 10px 30px; }
.brand strong { display: block; margin-top: -2px; font-family: var(--display); font-size: 22px; line-height: .88; font-weight: 500; letter-spacing: -.7px; }
.brand small { display: block; margin-top: 8px; font-family: var(--mono); color: #93afa1; font-size: 8px; letter-spacing: .8px; }
.brand-mark { width: 27px; display: flex; flex-direction: column; gap: 4px; padding-top: 2px; }
.brand-mark i { display: block; height: 5px; background: var(--moss); transform: skewX(-28deg); }
.brand-mark i:nth-child(2) { width: 74%; background: var(--sun); }.brand-mark i:nth-child(3) { width: 45%; background: var(--orange); }

.nav-list { display: grid; gap: 4px; }
.nav-item { min-height: 45px; padding: 0 11px; border: 0; color: #b6c8bf; background: transparent; display: grid; grid-template-columns: 30px 1fr auto; text-align: left; align-items: center; transition: .2s ease; border-left: 2px solid transparent; }
.nav-item:hover { color: white; background: rgba(255,255,255,.055); }
.nav-item.active { color: var(--paper-bright); background: rgba(89, 173, 145, .13); border-left-color: var(--sun); }
.nav-index, .nav-item b { font-family: var(--mono); font-size: 9px; font-weight: 400; color: #739686; }.nav-item b { color: #a6b8ae; }
.sidebar-rail { position: relative; z-index: 1; width: 1px; margin: 26px 0 0 25px; flex: 1; min-height: 70px; background: linear-gradient(to bottom, var(--moss), transparent 85%); }
.sidebar-note { margin: 16px 8px 18px; padding: 13px; border: 1px solid rgba(182, 213, 197, .18); background: rgba(255,255,255,.045); }
.eyebrow { display: block; font-family: var(--mono); font-size: 9px; font-weight: 500; letter-spacing: 1px; color: var(--moss-dark); }.sidebar .eyebrow { color: #7fb09c; }
.sidebar-note strong { display: block; margin-top: 6px; font-size: 12px; font-weight: 600; color: #f4f6ef; }.sidebar-note p { margin: 7px 0 10px; font-size: 10px; line-height: 1.5; color: #abc0b5; }.mode-line { color: #92c7a8; font-family: var(--mono); font-size: 8px; }.mode-line span { display: inline-block; width: 6px; height: 6px; margin-right: 5px; border-radius: 50%; background: var(--sun); box-shadow: 0 0 0 4px rgba(232,189,88,.1); }
.operator { border: 0; padding: 10px; display: grid; grid-template-columns: 29px 1fr 10px; gap: 8px; align-items: center; color: #dce8de; background: rgba(0,0,0,.17); text-align: left; }.operator small { display: block; color: #7d9b8c; font-size: 8px; font-family: var(--mono); }.operator strong { font-size: 11px; }.operator b { color: #99b5a5; font-weight: 400; }.avatar { width: 29px; height: 29px; display: grid; place-items: center; color: var(--deep); background: var(--sun); font-family: var(--mono); font-size: 9px; font-weight: 700; border-radius: 50%; }

.main-stage { padding: 0 34px 56px; overflow: hidden; background-image: linear-gradient(rgba(21,33,31,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(21,33,31,.035) 1px, transparent 1px); background-size: 38px 38px; }
.topbar { height: 75px; max-width: 1320px; margin: auto; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(21,33,31,.16); }.crumb { display: flex; align-items: center; gap: 8px; color: #63736e; font-family: var(--mono); font-size: 10px; }.crumb em { color: #a0aaa2; font-style: normal; }.signal-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--moss); box-shadow: 0 0 0 5px rgba(46,139,117,.12); }.topbar-actions { display: flex; align-items: center; gap: 9px; }.quiet-button, .command-button { border: 1px solid var(--line); padding: 9px 12px; color: var(--ink-soft); background: rgba(246,245,238,.65); font-family: var(--mono); font-size: 10px; transition: .18s ease; }.quiet-button:hover { border-color: var(--moss); color: var(--moss-dark); }.command-button { color: var(--paper-bright); background: var(--deep); border-color: var(--deep); }.command-button:hover { transform: translateY(-1px); background: var(--deep-alt); }

.view { display: none; max-width: 1320px; margin: 0 auto; animation: reveal .4s ease both; }.view.active { display: block; }@keyframes reveal { from { opacity: 0; transform: translateY(7px); } to { opacity: 1; transform: none; } }
.hero-line { display: flex; justify-content: space-between; gap: 25px; padding: 51px 0 31px; }.hero-line h1, .view-heading h1 { max-width: 720px; margin: 8px 0 0; color: var(--deep); font-family: var(--display); font-size: clamp(36px, 4.6vw, 63px); font-weight: 500; line-height: .96; letter-spacing: -2.6px; }.hero-line h1 em, .view-heading h1 span { color: var(--moss-dark); font-style: italic; }.run-card { position: relative; width: 254px; align-self: flex-end; padding: 15px 16px; color: #dbe9df; background: var(--deep); overflow: hidden; }.run-card span { display: block; color: #89a998; font-family: var(--mono); font-size: 8px; letter-spacing: .8px; }.run-card strong { display: block; margin: 8px 0 5px; color: #f4f3eb; font-family: var(--mono); font-size: 13px; font-weight: 500; }.run-card small { color: #a5bcaf; font-size: 10px; }.scan-line { position: absolute; height: 2px; width: 45%; right: -10%; bottom: 0; background: var(--sun); animation: scan 3.5s infinite ease-in-out; }@keyframes scan { 50% { right: 65%; } }
.metric-ribbon { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 2px solid var(--deep); border-bottom: 1px solid var(--line); background: rgba(246,245,238,.63); }.metric-ribbon article { position: relative; padding: 18px 17px 17px; min-height: 108px; border-right: 1px solid var(--line); }.metric-ribbon article:last-child { border-right: 0; }.metric-ribbon span { display: block; color: #5a6d66; font-family: var(--mono); font-size: 9px; }.metric-ribbon strong { display: inline-block; margin: 5px 6px 0 0; color: var(--deep); font-family: var(--display); font-size: 37px; line-height: 1; font-weight: 500; }.metric-ribbon small { color: #77837d; font-size: 10px; }.metric-ribbon .accent-metric { background: #e7b955; }.metric-ribbon .accent-metric::after { content: "REVIEW"; position: absolute; right: 12px; top: 10px; font-family: var(--mono); font-size: 8px; letter-spacing: 1px; color: rgba(21,33,31,.55); }

.panel { border: 1px solid var(--line); background: rgba(246,245,238,.82); box-shadow: 0 12px 25px rgba(22,31,28,.025); }.pipeline-panel { margin-top: 25px; padding: 23px 24px 26px; }.section-heading { display: flex; justify-content: space-between; gap: 18px; align-items: flex-start; }.section-heading h2, .evidence-toolbar h2, .contact-side h2, .qa-panel h2, .stop-board h2 { margin: 5px 0 0; font-family: var(--display); font-size: 25px; line-height: 1; font-weight: 500; letter-spacing: -.8px; }.section-heading.compact h2 { font-size: 22px; }.legend { display: flex; gap: 11px; color: #64716b; font-size: 9px; font-family: var(--mono); }.legend span { white-space: nowrap; }.legend-dot { display: inline-block; width: 7px; height: 7px; margin-right: 3px; border-radius: 50%; }.legend-dot.safe { background: var(--moss); }.legend-dot.live { background: var(--sun); }.legend-dot.hold { background: var(--orange); }
.flow-track { display: grid; grid-template-columns: 1fr 30px 1fr 30px 1fr 30px 1fr 30px 1fr; align-items: center; margin-top: 32px; }.flow-node { position: relative; min-height: 115px; padding: 14px 11px; border: 1px solid var(--line); color: var(--ink); background: var(--paper-bright); text-align: left; transition: .2s ease; }.flow-node:hover { transform: translateY(-3px); border-color: var(--moss); box-shadow: 0 9px 20px rgba(23,101,84,.09); }.flow-node b { display: block; font-family: var(--display); font-size: 32px; line-height: .9; font-weight: 500; }.flow-node span { display: block; margin-top: 10px; font-size: 12px; font-weight: 700; }.flow-node small { display: block; margin-top: 3px; color: #65726c; font-family: var(--mono); font-size: 8px; }.flow-node.done::after, .flow-node.live::after, .flow-node.review::after { content: ""; position: absolute; top: 11px; right: 10px; width: 7px; height: 7px; border-radius: 50%; background: var(--moss); }.flow-node.live::after { background: var(--sun); box-shadow: 0 0 0 4px rgba(232,189,88,.14); }.flow-node.review::after { background: var(--orange); }.flow-node.locked { color: #78827c; border-style: dashed; background: rgba(255,255,255,.3); }.flow-link { position: relative; height: 1px; background: var(--line); }.active-link { background: var(--moss); }.warm-link { background: var(--sun); }.dashed-link { background: repeating-linear-gradient(to right, #aab2ab 0 4px, transparent 4px 8px); }
.control-grid { display: grid; grid-template-columns: 1.25fr .85fr; gap: 17px; margin-top: 17px; }.lead-stack, .decision-panel { padding: 21px; }.text-button { border: 0; color: var(--moss-dark); background: transparent; font-family: var(--mono); font-size: 9px; }.text-button:hover { color: var(--orange); }.lead-list { display: grid; margin-top: 15px; border-top: 1px solid var(--line); }.lead-row { width: 100%; padding: 13px 0; display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; gap: 12px; align-items: center; border: 0; border-bottom: 1px solid var(--line); text-align: left; color: var(--ink); background: transparent; transition: .18s ease; }.lead-row:hover, .lead-row.selected { padding-left: 7px; color: var(--moss-dark); background: linear-gradient(90deg, rgba(46,139,117,.1), transparent 70%); }.lead-score { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 50%; color: var(--paper-bright); background: var(--deep); font-family: var(--mono); font-size: 10px; }.lead-row h3 { margin: 0 0 3px; font-size: 13px; }.lead-row p { margin: 0; color: #697871; font-size: 10px; }.lead-tag { padding: 5px 7px; color: var(--moss-dark); background: #d6e8db; font-family: var(--mono); font-size: 8px; }.lead-tag.risk { color: #8a432c; background: #f3d0c4; }.trace-id { padding: 5px 7px; border: 1px solid var(--line); color: #6c7770; font-family: var(--mono); font-size: 8px; }.trace-route { position: relative; margin-top: 20px; padding-left: 23px; }.trace-route::before { content: ""; position: absolute; top: 8px; bottom: 15px; left: 6px; width: 1px; background: var(--line); }.trace-step { position: relative; padding: 0 0 16px; }.trace-step::before { content: ""; position: absolute; left: -21px; top: 4px; width: 10px; height: 10px; border: 2px solid var(--moss); border-radius: 50%; background: var(--paper-bright); }.trace-step:last-child { padding-bottom: 0; }.trace-step.warn::before { border-color: var(--sun); }.trace-step strong { display: block; font-size: 11px; }.trace-step p { margin: 3px 0 0; color: #6b7871; font-size: 10px; line-height: 1.45; }.trace-step code { font-family: var(--mono); font-size: 8px; color: var(--moss-dark); background: #e0ece3; }
.operations-panel { margin-top: 17px; padding: 21px; }.rule-count { color: #6a7771; font-family: var(--mono); font-size: 9px; }.rule-grid { display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 15px; border-top: 1px solid var(--line); }.rule-grid article { min-height: 115px; padding: 15px 13px 9px; border-right: 1px solid var(--line); }.rule-grid article:last-child { border-right: 0; }.rule-number { color: var(--orange); font-family: var(--mono); font-size: 9px; }.rule-grid p { margin: 13px 0 0; font-size: 11px; line-height: 1.45; }.rule-grid code { color: var(--moss-dark); font-family: var(--mono); font-size: 9px; }

.view-heading { padding: 49px 0 28px; }.view-heading p { max-width: 590px; margin: 18px 0 0; color: #65746d; font-size: 13px; line-height: 1.75; }.split-heading { display: flex; justify-content: space-between; gap: 25px; }.selection-box, .approval-counter { align-self: flex-end; min-width: 234px; padding: 15px; border-left: 4px solid var(--moss); background: rgba(246,245,238,.8); }.selection-box span, .approval-counter span { display: block; font-family: var(--mono); font-size: 8px; color: #687972; }.selection-box strong { display: block; margin: 6px 0 9px; font-family: var(--display); font-size: 18px; font-weight: 500; }.selection-box button { padding: 0; color: var(--moss-dark); border: 0; background: none; font-family: var(--mono); font-size: 9px; }.approval-counter { border-color: var(--sun); }.approval-counter strong { display: inline-block; margin-top: 2px; font-family: var(--display); font-size: 45px; line-height: 1; font-weight: 500; }.approval-counter small { display: block; color: #6c7772; font-size: 10px; }
.evidence-layout { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(270px, .55fr); gap: 17px; }.evidence-main { padding: 22px; }.detail-topline { display: flex; align-items: center; gap: 8px; color: #718079; font-family: var(--mono); font-size: 9px; }.country-pin { width: 26px; height: 26px; display: grid; place-items: center; color: var(--paper-bright); background: var(--deep); font-size: 9px; }.company-status { margin-left: auto; padding: 5px 7px; color: var(--moss-dark); background: #d5e7dc; }.score-slab { display: grid; grid-template-columns: repeat(3, 1fr) 1.3fr; gap: 1px; margin: 19px 0 25px; background: var(--line); border: 1px solid var(--line); }.score-slab > div { padding: 14px 14px 12px; background: var(--paper-bright); }.score-slab span { display: block; color: #718078; font-family: var(--mono); font-size: 8px; }.score-slab strong { display: inline-block; margin-top: 3px; color: var(--deep); font-family: var(--display); font-size: 35px; line-height: 1; font-weight: 500; }.score-slab small { color: #68766f; font-family: var(--mono); font-size: 8px; }.score-slab .score-note { display: flex; gap: 9px; align-items: center; background: var(--deep); }.score-note i { width: 8px; height: 8px; border-radius: 50%; background: var(--sun); }.score-note p { margin: 0; color: #c4d3c9; font-size: 10px; line-height: 1.45; }.evidence-toolbar { display: flex; justify-content: space-between; gap: 14px; align-items: end; }.filter-set { display: flex; gap: 5px; }.filter { padding: 6px 8px; color: #65736c; border: 1px solid var(--line); background: transparent; font-family: var(--mono); font-size: 8px; }.filter.active, .filter:hover { color: var(--paper-bright); border-color: var(--deep); background: var(--deep); }.evidence-cards { display: grid; gap: 9px; margin-top: 15px; }.evidence-card { position: relative; padding: 13px 15px 13px 18px; border: 1px solid var(--line); background: rgba(255,255,255,.35); overflow: hidden; }.evidence-card::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 3px; background: var(--moss); }.evidence-card.trade::before { background: var(--sun); }.evidence-card-top { display: flex; justify-content: space-between; gap: 10px; color: #6c7973; font-family: var(--mono); font-size: 8px; }.evidence-card h3 { margin: 8px 0 5px; font-size: 12px; }.evidence-card p { margin: 0; color: #55645d; font-size: 11px; line-height: 1.55; }.evidence-card footer { display: flex; justify-content: space-between; gap: 10px; margin-top: 8px; color: var(--moss-dark); font-family: var(--mono); font-size: 8px; }.contact-side { padding: 21px; }.contact-side h2 { font-size: 26px; }.contact-card { margin-top: 16px; padding: 14px; border: 1px solid var(--line); background: var(--paper-bright); }.contact-card.secondary { opacity: .76; }.contact-card header { display: flex; justify-content: space-between; gap: 7px; }.contact-card h3 { margin: 10px 0 3px; font-size: 14px; }.contact-card p { margin: 0; color: #6a7770; font-size: 10px; }.contact-card .email-state { padding: 4px 6px; font-family: var(--mono); font-size: 8px; color: var(--moss-dark); background: #d6eadc; }.contact-card .email-state.risk { color: #87503a; background: #f3dbc9; }.contact-card footer { margin-top: 13px; padding-top: 9px; border-top: 1px solid var(--line); color: #53615a; font-family: var(--mono); font-size: 8px; }.waterfall-note { margin-top: 18px; padding: 12px; color: #cde1d5; background: var(--deep); }.waterfall-note span { color: var(--sun); font-family: var(--mono); font-size: 8px; }.waterfall-note p { margin: 6px 0 0; font-size: 10px; line-height: 1.5; }.wide-ghost { width: 100%; margin-top: 16px; padding: 10px 12px; border: 1px solid var(--line); color: var(--moss-dark); background: transparent; text-align: left; font-family: var(--mono); font-size: 9px; }.wide-ghost:hover { border-color: var(--moss); background: #e1eee5; }

.trade-guard { display: grid; grid-template-columns: 1fr 38px 1fr 38px 1fr; align-items: stretch; padding: 0; overflow: hidden; }.guard-rule { display: grid; grid-template-columns: 35px 1fr auto; gap: 10px; padding: 20px 17px; background: rgba(246,245,238,.7); }.guard-rule.signal-output { background: var(--deep); color: var(--paper-bright); }.guard-step { color: var(--orange); font-family: var(--mono); font-size: 10px; }.guard-rule small { display: block; color: #74827b; font-family: var(--mono); font-size: 8px; }.signal-output small { color: #94b6a4; }.guard-rule strong { display: block; margin: 6px 0 3px; font-size: 13px; }.guard-rule p { margin: 0; color: #68766f; font-size: 10px; line-height: 1.45; }.signal-output p { color: #bbd0c2; }.confidence { align-self: start; min-width: 42px; padding: 6px 4px; color: var(--moss-dark); background: #d8e9dc; text-align: center; font-family: var(--mono); font-size: 11px; font-style: normal; }.confidence small { color: inherit; font-size: 6px; }.confidence.medium { color: #8a6230; background: #f3e2bd; }.confidence.signal { color: var(--deep); background: var(--sun); }.guard-arrow { display: grid; place-items: center; color: var(--moss); background: rgba(246,245,238,.7); font-family: var(--display); font-size: 26px; }.trade-grid { display: grid; grid-template-columns: 1.25fr .75fr; gap: 17px; margin-top: 17px; }.radar-panel, .trade-table-panel { padding: 21px; }.key-line { color: #718078; font-family: var(--mono); font-size: 8px; }.time-axis { display: grid; grid-template-columns: repeat(6, 1fr); margin: 30px 0 7px 100px; color: #78857e; font-family: var(--mono); font-size: 8px; }.shipment-lanes { display: grid; gap: 11px; }.shipment { position: relative; display: grid; grid-template-columns: 94px 1fr 1fr 72px; align-items: center; min-height: 38px; }.shipment::after { content: ""; position: absolute; left: 100px; right: 76px; top: 19px; height: 1px; background: var(--line); }.shipment-tag, .shipment b, .shipment small { position: relative; z-index: 1; }.shipment-tag { color: #69776f; font-family: var(--mono); font-size: 8px; }.shipment i { position: absolute; z-index: 2; left: calc(100px + var(--start)); top: 14px; width: var(--width); min-width: 18px; height: 10px; background: var(--moss); box-shadow: 0 0 0 4px rgba(46,139,117,.09); }.shipment:nth-child(2) i { background: var(--sun); }.shipment:nth-child(3) i { background: var(--orange); }.shipment b { grid-column: 3; font-size: 10px; }.shipment small { grid-column: 4; color: var(--moss-dark); font-family: var(--mono); font-size: 8px; text-align: right; }.signal-summary { margin-top: 27px; padding: 12px; border-left: 3px solid var(--sun); background: #f3eddb; }.signal-summary span { color: #8b6737; font-family: var(--mono); font-size: 8px; }.signal-summary p { margin: 5px 0 0; font-size: 10px; line-height: 1.55; }.source-compare { display: grid; gap: 1px; margin-top: 20px; background: var(--line); }.source-compare article { padding: 14px; background: var(--paper-bright); }.source-label { color: var(--moss-dark); font-family: var(--mono); font-size: 8px; }.source-label.commercial { color: var(--orange); }.source-compare h3 { margin: 6px 0; font-family: var(--display); font-size: 18px; font-weight: 500; }.source-compare p { margin: 0 0 9px; color: #67746d; font-size: 10px; }.source-compare strong { font-family: var(--mono); font-size: 8px; color: #2d4a42; }

.approval-layout { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(290px, .75fr); gap: 17px; }.mail-card { padding: 22px; }.mail-meta { display: flex; justify-content: space-between; color: #6a7770; font-family: var(--mono); font-size: 9px; }.draft-state { padding: 4px 6px; color: var(--moss-dark); background: #d9eadc; }.draft-state.approved { color: #4f3c1e; background: var(--sun); }.mail-recipient, .mail-subject { margin-top: 22px; padding-bottom: 13px; border-bottom: 1px solid var(--line); }.mail-recipient span, .mail-subject span { display: inline-block; width: 65px; color: #79847d; font-family: var(--mono); font-size: 8px; vertical-align: top; }.mail-recipient strong, .mail-subject strong { font-size: 13px; }.mail-recipient small { display: block; margin: 5px 0 0 68px; color: #68756e; font-family: var(--mono); font-size: 8px; }.mail-body { max-width: 560px; padding: 23px 8px 18px 68px; font-family: var(--display); font-size: 17px; line-height: 1.45; }.mail-body p { margin: 0 0 15px; }.mail-footer { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-top: 13px; border-top: 1px solid var(--line); color: #6b7972; font-family: var(--mono); font-size: 8px; }.approve-button { padding: 11px 13px; color: var(--paper-bright); border: 0; background: var(--deep); font-family: var(--mono); font-size: 9px; transition: .2s; }.approve-button b { margin-left: 7px; color: var(--sun); }.approve-button:hover { transform: translateY(-2px); background: var(--moss-dark); }.approve-button.approved { color: var(--deep); background: var(--sun); }.approval-side { display: grid; gap: 17px; }.qa-panel, .state-panel { padding: 20px; }.qa-item { display: grid; grid-template-columns: 19px 1fr; gap: 7px; padding: 12px 0; border-bottom: 1px solid var(--line); }.qa-item:last-child { border-bottom: 0; }.qa-item > span { color: #89948d; font-family: var(--mono); }.qa-item.pass > span { color: var(--moss); }.qa-item strong { font-size: 11px; }.qa-item p { margin: 3px 0 0; color: #68766f; font-size: 10px; line-height: 1.4; }.state-machine { display: flex; gap: 0; margin: 17px 0 12px; }.state-machine span { position: relative; flex: 1; min-height: 44px; padding: 4px 2px; color: #6a756f; border-bottom: 2px solid var(--line); font-family: var(--mono); font-size: 7px; text-align: center; }.state-machine span::before { content: ""; position: absolute; left: calc(50% - 4px); bottom: -5px; width: 7px; height: 7px; border: 2px solid var(--paper-bright); border-radius: 50%; background: var(--line); }.state-machine span.done { color: var(--moss-dark); border-color: var(--moss); }.state-machine span.done::before { background: var(--moss); }.state-machine span.live { color: #6e531f; border-color: var(--sun); }.state-machine span.live::before { background: var(--sun); }.state-panel small { color: #6b786f; font-size: 10px; line-height: 1.5; }

.simulate-button { align-self: flex-end; padding: 13px 15px; color: var(--paper-bright); border: 0; background: var(--orange); font-family: var(--mono); font-size: 9px; }.simulate-button b { color: #fce6da; }.inbox-layout { display: grid; grid-template-columns: 1.1fr .9fr; gap: 17px; }.inbox-feed, .stop-board { padding: 21px; }.watch-pill { padding: 5px 7px; color: var(--moss-dark); border: 1px solid #cbe2d4; background: #e1efe6; font-family: var(--mono); font-size: 8px; }.watch-pill i { display: inline-block; width: 6px; height: 6px; margin-right: 4px; border-radius: 50%; background: var(--moss); }.event-row { display: grid; grid-template-columns: 43px 1fr auto; gap: 11px; align-items: center; padding: 13px 0; border-bottom: 1px solid var(--line); }.event-time { color: #69766f; font-family: var(--mono); font-size: 9px; }.event-row h3 { margin: 0 0 3px; font-size: 11px; }.event-row p { margin: 0; color: #6c7972; font-size: 10px; }.event-label { padding: 4px 6px; color: #6c551f; background: #f1e0b8; font-family: var(--mono); font-size: 8px; }.event-label.green { color: var(--moss-dark); background: #d8eadc; }.event-label.orange { color: #8f402d; background: #f1d1c6; }.stop-board { position: relative; overflow: hidden; background: var(--deep); color: var(--paper-bright); }.stop-board::after { content: ""; position: absolute; width: 310px; height: 310px; right: -160px; top: -180px; border: 1px solid rgba(235,244,235,.13); border-radius: 50%; box-shadow: 0 0 0 50px rgba(235,244,235,.03), 0 0 0 100px rgba(235,244,235,.03); }.stop-board > * { position: relative; z-index: 1; }.stop-board .eyebrow { color: #95baaa; }.stop-board h2 { color: var(--paper-bright); font-size: 32px; line-height: 1.05; }.sequence-line { display: grid; grid-template-columns: 1fr 20px 1fr 20px 1fr; align-items: center; margin-top: 40px; }.sequence-step { display: grid; place-items: center; height: 62px; color: #899e93; border: 1px solid #49675c; font-family: var(--mono); font-size: 12px; text-align: center; }.sequence-step small { margin-top: 3px; font-size: 7px; }.sequence-step.sent { color: var(--deep); border-color: var(--sun); background: var(--sun); }.sequence-line i { height: 1px; background: #49675c; }.stop-action { margin-top: 31px; padding: 14px; border-left: 3px solid var(--sun); background: rgba(255,255,255,.07); }.stop-action span { color: #94b7a7; font-family: var(--mono); font-size: 8px; }.stop-action strong { display: block; margin-top: 5px; font-size: 14px; }.stop-action p { margin: 6px 0 0; color: #b3c9bc; font-size: 10px; line-height: 1.5; }.stop-action.triggered { border-color: var(--orange); background: rgba(223,104,73,.13); }.stop-action.triggered strong { color: #ffd5c8; }

.account-heading { padding-bottom: 23px; }.account-counter { align-self: flex-end; min-width: 190px; padding: 15px; border-left: 4px solid var(--moss); background: rgba(246,245,238,.82); }.account-counter span, .account-counter small { display: block; color: #68766f; font-family: var(--mono); font-size: 8px; }.account-counter strong { display: block; margin: 3px 0; color: var(--deep); font-family: var(--display); font-size: 43px; line-height: 1; font-weight: 500; }
.account-workbench { display: grid; grid-template-columns: minmax(275px, .7fr) minmax(0, 1.3fr); gap: 17px; align-items: start; }.account-create-card, .account-registry { padding: 21px; }.account-create-card { position: sticky; top: 22px; background: var(--deep); color: var(--paper-bright); overflow: hidden; }.account-create-card::after { content: ""; position: absolute; width: 250px; height: 250px; right: -130px; bottom: -150px; border: 1px solid rgba(230,245,237,.16); border-radius: 50%; box-shadow: 0 0 0 34px rgba(230,245,237,.035), 0 0 0 68px rgba(230,245,237,.03); }.account-create-card > * { position: relative; z-index: 1; }.account-create-card .eyebrow { color: #8eb7a7; }.account-create-card h2 { margin: 8px 0 8px; color: var(--paper-bright); font-size: 29px; line-height: 1; }.account-create-card > p { margin: 0; color: #b9cdc1; font-size: 10px; line-height: 1.6; }.account-form { display: grid; gap: 11px; margin-top: 19px; }.account-form label { display: grid; gap: 6px; color: #9db8aa; font-family: var(--mono); font-size: 8px; }.account-form input, .account-form select { width: 100%; min-height: 38px; padding: 9px 10px; color: var(--ink); border: 1px solid #bfc8be; border-radius: 0; background: #fffefa; font: 500 12px var(--body); outline: none; }.account-form input:focus, .account-form select:focus { border-color: var(--moss-dark); box-shadow: 3px 3px 0 rgba(23,101,84,.13); }.account-primary, .account-secondary, .account-status-button { padding: 11px 12px; border: 0; font-family: var(--mono); font-size: 9px; text-align: left; }.account-primary { margin-top: 4px; color: var(--deep); background: var(--sun); }.account-primary b { float: right; color: var(--moss-dark); font-size: 13px; }.account-primary:hover:not(:disabled) { background: #f2ce78; }.account-primary:disabled, .account-secondary:disabled, .account-status-button:disabled { cursor: wait; opacity: .58; }.account-ledger { color: #698078; font-family: var(--mono); font-size: 8px; }.account-list { display: grid; gap: 1px; margin-top: 17px; border: 1px solid var(--line); background: var(--line); }.account-row { display: grid; grid-template-columns: 36px minmax(0, 1fr) 112px 66px; gap: 12px; align-items: center; min-height: 75px; padding: 12px 14px; background: rgba(255,255,255,.48); }.account-row:hover { background: var(--paper-bright); }.account-row.inactive { opacity: .62; background: #e6e5dd; }.account-avatar { display: grid; width: 32px; height: 32px; place-items: center; color: var(--paper-bright); background: var(--moss-dark); font-family: var(--mono); font-size: 9px; }.account-row.inactive .account-avatar { background: #84918a; }.account-person { min-width: 0; }.account-person strong { display: block; overflow: hidden; color: var(--deep); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }.account-person strong small { margin-left: 5px; color: var(--moss-dark); font-family: var(--mono); font-size: 7px; font-weight: 500; }.account-person span { display: block; overflow: hidden; margin-top: 4px; color: #6b7871; font-family: var(--mono); font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }.account-role { display: grid; gap: 4px; }.account-role span { color: var(--moss-dark); font-family: var(--mono); font-size: 8px; }.account-role small { width: fit-content; padding: 3px 4px; color: #3e6252; background: #d9eadc; font-family: var(--mono); font-size: 7px; }.account-row.inactive .account-role small { color: #6b706b; background: #d4d5cf; }.account-edit-button { padding: 7px 0; color: var(--moss-dark); border: 0; background: transparent; font-family: var(--mono); font-size: 8px; text-align: right; }.account-edit-button b { color: var(--orange); }.account-empty { display: grid; min-height: 180px; place-items: center; padding: 24px; color: #69776f; background: rgba(255,255,255,.35); font-family: var(--mono); font-size: 10px; text-align: center; }
.account-editor-card { width: min(550px, 100%); max-height: calc(100vh - 36px); overflow: auto; }.account-editor-target { margin: -13px 0 3px !important; color: #9dbbad !important; font-family: var(--mono); font-size: 8px !important; }.editor-form { margin-top: 15px; }.editor-form label { color: #9eb9ab; }.account-editor-divider { display: grid; grid-template-columns: 1fr auto 1fr; gap: 10px; align-items: center; margin: 23px 0 -2px; color: #8eb3a3; font-family: var(--mono); font-size: 8px; }.account-editor-divider::before, .account-editor-divider::after { content: ""; height: 1px; background: #365247; }.account-secondary { margin-top: 2px; color: var(--paper-bright); border: 1px solid #527062; background: transparent; }.account-secondary:hover:not(:disabled) { border-color: var(--sun); color: var(--sun); }.account-status-button { width: 100%; margin-top: 18px; color: #ffd9ce; border: 1px solid rgba(223,104,73,.65); background: rgba(223,104,73,.13); }.account-status-button:hover:not(:disabled) { background: rgba(223,104,73,.25); }.account-status-button.is-inactive { color: #cde9da; border-color: rgba(46,139,117,.75); background: rgba(46,139,117,.17); }.account-editor-note { display: block; margin-top: 10px; color: #91aa9e; font-size: 8px; line-height: 1.5; }

.image-lightbox { z-index: 60; background: rgba(6,14,12,.9); }.image-lightbox-card { position: relative; width: min(1120px, 100%); max-height: calc(100vh - 34px); padding: 22px; color: var(--paper-bright); border: 1px solid rgba(224,241,229,.18); background: var(--deep); box-shadow: 14px 16px 0 rgba(232,189,88,.72); transform: translateY(9px) scale(.985); transition: .23s ease; }.image-lightbox.open .image-lightbox-card { transform: none; }.image-lightbox-card header { display: grid; gap: 5px; padding-right: 38px; }.image-lightbox-card header strong { overflow: hidden; color: var(--paper-bright); font-family: var(--display); font-size: 20px; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }.image-lightbox-stage { display: grid; height: min(72vh, 760px); place-items: center; margin-top: 15px; background: #f4f4ee; }.image-lightbox-stage img { display: block; width: 100%; height: 100%; object-fit: contain; }.image-lightbox-card > p { margin: 11px 0 0; color: #a9c0b4; font-family: var(--mono); font-size: 8px; }.toast { position: fixed; z-index: 30; right: 24px; bottom: 24px; max-width: 330px; padding: 13px 16px; color: var(--paper-bright); background: var(--deep); box-shadow: 0 15px 40px rgba(20,34,30,.25); font-size: 12px; transform: translateY(20px); opacity: 0; pointer-events: none; transition: .26s ease; }.toast.show { transform: none; opacity: 1; }.toast::before { content: ""; display: inline-block; width: 7px; height: 7px; margin-right: 8px; border-radius: 50%; background: var(--sun); }.record-modal { position: fixed; z-index: 20; inset: 0; display: grid; place-items: center; padding: 20px; background: rgba(18,32,29,.68); backdrop-filter: blur(5px); opacity: 0; visibility: hidden; transition: .2s ease; }.record-modal.open { opacity: 1; visibility: visible; }.modal-card { position: relative; width: min(510px, 100%); padding: 28px; color: var(--paper-bright); background: var(--deep); transform: translateY(9px); transition: .25s ease; }.record-modal.open .modal-card { transform: none; }.modal-card h2 { margin: 8px 0 22px; color: var(--paper-bright); font-family: var(--display); font-size: 34px; line-height: 1; font-weight: 500; }.modal-close { position: absolute; top: 12px; right: 15px; color: #b5c9bc; border: 0; background: none; font-size: 26px; }.modal-card dl { margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: #365247; }.modal-card dl div { padding: 12px; background: #1c332c; }.modal-card dt { color: #8eaa9b; font-family: var(--mono); font-size: 8px; }.modal-card dd { margin: 6px 0 0; font-size: 11px; }.modal-card dd strong { color: var(--sun); }.modal-card p { margin: 17px 0 0; color: #b8cbc0; font-size: 11px; line-height: 1.6; }.modal-card code { color: var(--sun); font-family: var(--mono); font-size: 9px; }

@media (max-width: 1050px) { .app-shell { grid-template-columns: 218px minmax(0, 1fr); }.sidebar { padding-left: 10px; padding-right: 10px; }.flow-track { grid-template-columns: 1fr 20px 1fr 20px 1fr 20px 1fr 20px 1fr; }.control-grid, .trade-grid, .approval-layout, .inbox-layout, .account-workbench { grid-template-columns: 1fr; }.account-create-card { position: static; }.approval-side { grid-template-columns: 1fr 1fr; }.trade-guard { grid-template-columns: 1fr; }.guard-arrow { min-height: 28px; transform: rotate(90deg); }.rule-grid { grid-template-columns: repeat(2, 1fr); }.rule-grid article:nth-child(2) { border-right: 0; }.rule-grid article:nth-child(-n+2) { border-bottom: 1px solid var(--line); }.evidence-layout { grid-template-columns: 1fr; }.contact-side { display: grid; grid-template-columns: 1fr 1fr; gap: 11px; align-items: start; }.contact-side > .eyebrow, .contact-side > h2 { grid-column: 1 / -1; }.contact-card { margin-top: 0; }.waterfall-note { margin: 0; }.wide-ghost { margin-top: 0; } }
@media (max-width: 760px) { .app-shell { display: block; }.sidebar { position: static; height: auto; padding: 16px; }.brand { padding: 0 0 15px; }.brand strong { font-size: 18px; }.nav-list { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2px; }.nav-item { min-height: 52px; padding: 6px 4px; display: block; border-left: 0; border-bottom: 2px solid transparent; font-size: 9px; text-align: center; }.nav-item.active { border-left: 0; border-bottom-color: var(--sun); }.nav-index, .nav-item b { display: none; }.sidebar-rail, .sidebar-note, .operator { display: none; }.main-stage { padding: 0 16px 35px; }.topbar { height: 60px; }.crumb span:last-child, .quiet-button { display: none; }.hero-line, .split-heading { display: block; padding-top: 32px; }.hero-line h1, .view-heading h1 { font-size: 39px; letter-spacing: -1.6px; }.run-card { width: 100%; margin-top: 22px; }.metric-ribbon { grid-template-columns: repeat(2, 1fr); }.metric-ribbon article:nth-child(2) { border-right: 0; }.metric-ribbon article:nth-child(-n+2) { border-bottom: 1px solid var(--line); }.pipeline-panel, .lead-stack, .decision-panel, .operations-panel, .evidence-main, .contact-side, .radar-panel, .trade-table-panel, .mail-card, .qa-panel, .state-panel, .inbox-feed, .stop-board, .account-create-card, .account-registry { padding: 16px; }.legend { display: none; }.flow-track { grid-template-columns: 1fr; gap: 0; margin-top: 20px; }.flow-link { width: 1px; height: 17px; margin-left: 20px; }.flow-node { min-height: 75px; display: grid; grid-template-columns: 52px 1fr; column-gap: 5px; }.flow-node b { grid-row: 1 / 3; align-self: center; }.flow-node span { margin: 0; align-self: end; }.flow-node small { align-self: start; }.control-grid { margin-top: 12px; }.rule-grid { grid-template-columns: 1fr; }.rule-grid article, .rule-grid article:nth-child(2) { border-right: 0; border-bottom: 1px solid var(--line); }.rule-grid article:last-child { border-bottom: 0; }.score-slab { grid-template-columns: repeat(3, 1fr); }.score-slab .score-note { grid-column: 1 / -1; }.evidence-toolbar { display: block; }.filter-set { margin-top: 12px; }.contact-side { display: block; }.contact-card, .waterfall-note, .contact-side .wide-ghost { margin-top: 12px; }.shipment { grid-template-columns: 73px 1fr 69px; }.shipment::after { left: 75px; right: 72px; }.shipment i { left: calc(75px + var(--start)); }.shipment b { display: none; }.shipment small { grid-column: 3; }.time-axis { margin-left: 75px; }.approval-side { grid-template-columns: 1fr; }.mail-body { padding-left: 0; font-size: 16px; }.mail-footer { align-items: flex-start; flex-direction: column; }.approval-counter, .selection-box, .account-counter { margin-top: 20px; }.account-row { grid-template-columns: 32px minmax(0, 1fr) auto; gap: 8px; padding: 11px; }.account-role { grid-column: 2; grid-row: 2; display: flex; align-items: center; gap: 7px; }.account-edit-button { grid-column: 3; grid-row: 1 / span 2; }.account-editor-card { padding: 22px; }.modal-card dl { grid-template-columns: 1fr; } }

@media (hover: none) { .tile-zoom { opacity: 1; transform: none; } }