/* EAL MERLIN - brand system (EAL_MERLIN_Brand_Pack, supplied by Stods 15/10/2026).
   Loaded last from index.html, after /static/brand/theme.css and typography.css (the pack's own token files).
   Remove the three <link> tags to revert to the original dark theme.

   Source of every value:
   - Tokens (navy, midnight, red, blue, silver, cloud, text, muted, success, warning, danger, radii): pack 06_brand_tokens/theme.css. ADOPTED.
   - Layout rule: dark midnight sidebar, light Cloud White workspace, navy headings, blue functional actions,
     red heritage accents: pack 08_implementation/AI_BUILD_INSTRUCTIONS.md step 4. ADOPTED.
   - Fonts Barlow Condensed / Inter / IBM Plex Mono: named in the pack; self-hosted latin subsets from Google Fonts (OFL). ADOPTED.
   - AA-safe derived tones (NOT in the pack, computed on 15/10/2026 for WCAG AA 4.5:1 on white/cloud):
       --eal-blue-aa #0F76AB (pack blue #168BC5 is only 3.8:1 with white text)
       --eal-muted-aa #556A80 (pack muted #61758A is 4.4:1 on cloud)
       warning text #9A6200 (pack #D99332 is 2.6:1), danger text #B3261E (pack #D84B4B is 4.2:1), success text #12775F.
     The pack colours are still used for fills, borders, icons and focus rings. PROPOSED. */

@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:500;font-display:swap;src:url(/static/fonts/barlow-condensed-500.woff2) format("woff2")}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:600;font-display:swap;src:url(/static/fonts/barlow-condensed-600.woff2) format("woff2")}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:700;font-display:swap;src:url(/static/fonts/barlow-condensed-700.woff2) format("woff2")}
@font-face{font-family:"Inter";font-style:normal;font-weight:400 700;font-display:swap;src:url(/static/fonts/inter-400-700.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url(/static/fonts/ibm-plex-mono-400.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:500;font-display:swap;src:url(/static/fonts/ibm-plex-mono-500.woff2) format("woff2")}

:root{
  --eal-blue-aa:#0F76AB; --eal-blue-aa-dark:#0B5F8D;
  --eal-muted-aa:#556A80;
  --eal-blue-tint:rgba(22,139,197,.08);
  --eal-red-tint:rgba(198,61,50,.08);
  --eal-line:#D5DEE6;
  --eal-field:#C3CFDA;

  /* Remap the app's existing variables onto the brand tokens */
  --navy:var(--eal-cloud);       /* page background */
  --navy2:#FFFFFF;
  --card:#FFFFFF;
  --border:var(--eal-line);
  --input-bg:#F8FAFC;
  --bg2:#F8FAFC;
  --bd:var(--eal-line);
  --muted:var(--eal-muted-aa);
  --blue:var(--eal-blue-aa);     /* primary action */
  --bl:var(--eal-blue-aa);       /* links / small accent text */
  --accent:var(--eal-blue);
  --gold:var(--eal-red);         /* heritage accent: emphasis figures, part numbers */
  --text:var(--eal-text);
  --dim:var(--eal-muted-aa);
  --bright:var(--eal-navy);
  --ok:#12775F; --green:#12775F;
  --warn:#9A6200; --amber:#9A6200;
  --err:#B3261E; --red:#B3261E;
  --info:var(--eal-blue-aa);
  --font-head:"Barlow Condensed","Arial Narrow",Arial,sans-serif;
}

body{font-family:Inter,"Segoe UI","Helvetica Neue",Arial,sans-serif;background:var(--eal-cloud);color:var(--text)}
h1,h2,h3,.sh h2,.topbar-title,.sv,.rr-stat-val{font-family:var(--font-head)}
h1,h2,h3,.sh h2{color:var(--eal-navy)}
.sh h2,.topbar-title{letter-spacing:.04em;text-transform:uppercase;font-weight:600}
.sv,.rr-stat-val{font-weight:700;letter-spacing:.01em}
code,kbd,samp,.mono,.part-card-pn,.rr-pn,.sp-ref,#q-pn,#p-tbody td:first-child:not(.empty){font-family:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace}

/* ---------- Login ---------- */
#login-screen{background:#071422 url(/static/brand/bg/blueprint_grid.svg) center/cover no-repeat}
.lbox{background:#fff;border:1px solid rgba(184,198,209,.4);border-radius:var(--eal-card-radius);box-shadow:0 24px 70px rgba(0,0,0,.45);overflow:hidden}
.llogo{background:#071422 url(/static/brand/bg/navy_gradient.svg) center/cover;margin:-2.5rem -2.5rem 1.8rem;padding:1.4rem 1rem 1.1rem;border-bottom:4px solid var(--eal-red)}
.llogo .login-logo-img{margin-bottom:0}
.llogo h1{margin-top:-1.6rem}
.llogo h1{color:#fff;font-family:var(--font-head);font-weight:700;letter-spacing:.08em}
.llogo h1 span{color:#fff}
.llogo p{color:var(--eal-silver)}
.fg label{color:var(--dim)}
.fg input{background:#fff;border:1px solid var(--eal-field);color:var(--eal-navy);border-radius:var(--eal-button-radius)}
.fg input:focus{border-color:var(--eal-blue);box-shadow:0 0 0 3px rgba(22,139,197,.22);outline:none}
.btn-p{background:var(--eal-blue-aa);color:#fff;border-radius:var(--eal-button-radius);font-family:var(--font-head);font-weight:600;letter-spacing:.12em;font-size:1rem}
.btn-p:hover{background:var(--eal-blue-aa-dark);opacity:1}
.lerr{background:rgba(179,38,30,.07);border-color:rgba(179,38,30,.3);border-radius:var(--eal-button-radius)}
.totp-hint{background:var(--eal-blue-tint);border-color:rgba(22,139,197,.25)}
@media(max-width:768px){.llogo{margin:-1.8rem -1.4rem 1.5rem}}

/* ---------- Shell: sidebar (midnight) ---------- */
.sidebar{background:linear-gradient(180deg,var(--eal-midnight) 0%,var(--eal-navy) 100%);border-right:none}
.sidebar-logo-wrap{background:rgba(0,0,0,.25)!important;border-bottom:3px solid var(--eal-red)!important}
.nl{color:var(--eal-silver);border-left:3px solid transparent}
.nl:hover{color:#fff;background:rgba(255,255,255,.07)}
.nl.active{color:#fff;background:rgba(22,139,197,.24);border-left-color:var(--eal-blue)}
.ng{color:#fff;font-family:var(--font-head);font-weight:600;letter-spacing:.1em;font-size:.95rem}
.ng:hover{color:#fff;background:rgba(255,255,255,.05)}
.ng-arrow{color:var(--eal-silver)}
.ng-ico{width:18px;height:18px;vertical-align:-4px;margin-right:.5rem}
.ng-ico-blank{display:inline-block;width:18px;margin-right:.5rem}
.sb-foot{border-top:1px solid rgba(184,198,209,.18);color:var(--eal-silver)}
.sb-foot strong{color:#fff}
.sidebar [style*="color:var(--bl)"],.sidebar [style*="color:var(--dim)"]{color:var(--eal-silver)!important}
.sidebar [style*="color:var(--gold)"]{color:#fff!important}
.sidebar-admin-label{color:#9FB1C1!important}
.sidebar [style*="border"]{border-color:rgba(184,198,209,.18)!important}
body.sb-collapsed .sidebar{display:none}
.ng-items.closed{visibility:hidden}  /* keep closed groups out of the keyboard tab order */

/* ---------- Shell: top bar ---------- */
.topbar{background:#fff;border-bottom:1px solid var(--eal-line);box-shadow:0 1px 3px rgba(11,31,53,.06)}
.topbar-title{color:var(--eal-navy)}
.topbar-right{color:var(--dim)}
.btn-out{border-color:rgba(179,38,30,.35);color:var(--err);border-radius:var(--eal-button-radius)}
.btn-out:hover{background:rgba(179,38,30,.07)}
.hamburger{display:block;color:var(--eal-navy)}
.topbar-right button:not(.btn-out){background:#fff!important;border:1px solid var(--eal-field)!important;color:var(--eal-navy)!important;border-radius:var(--eal-button-radius)}
.topbar-right button:not(.btn-out):hover{border-color:var(--eal-blue)!important;color:var(--eal-blue-aa)!important}
.top-search{flex:1;max-width:340px;margin:0 1rem;position:relative}
.top-search input{width:100%;padding:.42rem .8rem .42rem 2rem;border:1px solid var(--eal-field);border-radius:var(--eal-button-radius);background:#F8FAFC url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23556A80' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E") .6rem center/15px no-repeat;color:var(--eal-navy);font:inherit;font-size:.82rem}
.top-search input:focus{border-color:var(--eal-blue);box-shadow:0 0 0 3px rgba(22,139,197,.2);outline:none;background-color:#fff}
@media(max-width:768px){.top-search{display:none}}

/* ---------- Cards, stats, panels ---------- */
.sc,.ec,.ea-input-card,.ea-extracted-card,.ea-reply-section,.ea-stock-section,.rr-stat,.rr-card,.part-card{
  background:#fff;border:1px solid var(--eal-line);box-shadow:0 1px 3px rgba(11,31,53,.06)}
.sc{border-top:3px solid var(--eal-blue);border-radius:var(--eal-card-radius)}
.ec,.ea-input-card,.ea-extracted-card,.ea-reply-section,.ea-stock-section,.rr-stat,.rr-card,.part-card{border-radius:var(--eal-card-radius)}
.ec:hover{border-color:var(--eal-blue)}
.sv{color:var(--eal-navy)}
.sl{color:var(--dim)}
.em,.ev span,.sh h2{color:var(--eal-navy)}
.ai-res,.merlin-info-panel{background:#F8FAFC;border:1px solid var(--eal-line);color:var(--text);border-radius:var(--eal-button-radius)}
.merlin-info-panel h4{color:var(--eal-blue-aa)}
.part-card.rr-card{background:#FFFBF2;border-left:3px solid #D99332}

/* ---------- Tables ---------- */
.dt th,.rr-tbl th,.ea-stock-table th{background:#E9EFF5;color:var(--eal-navy);border-bottom:2px solid var(--eal-navy)}
.dt td,.rr-tbl td,.rr-htbl td,.ea-stock-table td{border-bottom:1px solid #E3EAF0;color:var(--text)}
.dt tr:hover td,.rr-tbl tr:hover td,.ea-stock-table tr:hover td{background:#F0F7FB}
.rr-htbl th{color:var(--eal-navy)}

/* ---------- Inputs / selects / buttons ---------- */
.si,.ai-ta,.ea-textarea,.ea-reply-ta,.rr-sinput,.rr-fsel,.fsel{background:#fff;border:1px solid var(--eal-field);color:var(--eal-navy);border-radius:var(--eal-button-radius)}
.si:focus,.ai-ta:focus,.ea-textarea:focus,.ea-reply-ta:focus{border-color:var(--eal-blue);box-shadow:0 0 0 3px rgba(22,139,197,.2);outline:none}
select{background:#fff!important;color:var(--text)!important;border:1px solid var(--eal-field)!important}
select option,.fsel option,.si option{background:#fff!important;color:var(--text)!important}
select option:hover,select option:focus,select option:checked{background:var(--eal-blue-aa)!important;color:#fff!important}
input,textarea{color-scheme:light}
.btn-s,.btn-primary-sm,.ea-tab.active,.rr-tab.active,.rr-pgbtn.cur,.ea-count{background:var(--eal-blue-aa);border-color:var(--eal-blue-aa);color:#fff;border-radius:var(--eal-button-radius)}
.btn-s:hover,.btn-primary-sm:hover{background:var(--eal-blue-aa-dark);filter:none}
.btn-secondary-sm,.bp,.rr-pgbtn,.ea-tab,.rr-tab,.preset-btn{background:#fff;border:1px solid var(--eal-field);color:var(--text);border-radius:var(--eal-button-radius)}
.rr-tab{border-color:transparent}
.btn-secondary-sm:hover,.bp:hover,.preset-btn:hover{border-color:var(--eal-blue);color:var(--eal-blue-aa);background:#fff}
.preset-btn{color:var(--eal-blue-aa)}
.btn-exp{background:rgba(18,119,95,.08);border-color:rgba(18,119,95,.35);color:var(--ok);border-radius:var(--eal-button-radius)}
.ea-drop-zone,.rr-drop{background:#fff;border-radius:var(--eal-card-radius)}
.ea-drop-zone:hover,.rr-drop:hover{background:var(--eal-blue-tint);border-color:var(--eal-blue)}
.sp-btn{background:var(--eal-blue-tint);border-color:rgba(22,139,197,.3);color:var(--eal-blue-aa)}
.sp-btn:hover{background:rgba(22,139,197,.16)}
.merlin-help-btn{background:#E9EFF5;border-color:var(--eal-field);color:var(--eal-navy)}
.merlin-help-btn:hover{background:var(--eal-blue-aa);color:#fff;border-color:var(--eal-blue-aa)}
.mfv-dismiss{background:var(--eal-blue-tint);border-color:rgba(22,139,197,.3);color:var(--eal-blue-aa)}

/* ---------- Status badges (readable on white) ---------- */
.bc-n,.bs-a{background:rgba(18,119,95,.1);color:var(--ok);border-color:rgba(18,119,95,.35)}
.bc-o,.bs-p{background:rgba(15,118,171,.09);color:var(--info);border-color:rgba(15,118,171,.3)}
.bc-a,.bs-l{background:rgba(154,98,0,.1);color:var(--warn);border-color:rgba(154,98,0,.35)}
.bc-u,.bnfs{background:rgba(179,38,30,.08);color:var(--err);border-color:rgba(179,38,30,.3)}
.ea-urg-low,.rr-cond{background:rgba(18,119,95,.1)}
.ea-urg-med,.rr-rot{background:rgba(154,98,0,.1)}
.ea-urg-high{background:rgba(179,38,30,.1)}
.rr-con{background:rgba(70,72,160,.1);color:#4A4DB0}
.rr-ok{background:rgba(18,119,95,.08);border-color:rgba(18,119,95,.3)}
.rr-err{background:rgba(179,38,30,.08);border-color:rgba(179,38,30,.3)}
.fmv-high{color:var(--ok)!important;background:rgba(18,119,95,.1)!important}
.fmv-medium{color:var(--warn)!important;background:rgba(154,98,0,.1)!important}
.fmv-low{color:#B45309!important;background:rgba(180,83,9,.1)!important}
.fmv-very-low{color:var(--err)!important;background:rgba(179,38,30,.1)!important}

/* ---------- Modals, overlays, tooltips ---------- */
.sp-box,.mfv-card{background:#fff;border:1px solid var(--eal-line);border-top:4px solid var(--eal-red);box-shadow:0 20px 60px rgba(7,20,34,.35);color:var(--text)}
.sp-box{border-radius:var(--eal-card-radius)}
.merlin-tip .merlin-tip-text{background:var(--eal-navy);border-color:var(--eal-navy);color:#fff}
.sp-modal,.mfv-overlay,.sb-overlay{background:rgba(7,20,34,.62)}
.sp-actions{border-top-color:var(--eal-line)}
.sp-ref,.part-card-pn,.rr-pn{color:var(--eal-red)}

/* ---------- Hard-coded colours inside inline styles (set from JS-built markup) ---------- */
[style*="background:#0d1828" i],[style*="background:#0D1F35" i],[style*="background:#152840" i],[style*="background:#0a1628" i],
[style*="background:#060f1c" i],[style*="background:#080e1a" i],[style*="background:#1a2540" i],[style*="background:rgba(13,31,53" i],
[style*="background:rgba(20,45,75" i],[style*="background:rgba(8,14,26" i],[style*="background:rgba(6,15,28" i]{
  background:#fff!important;color:var(--text)!important;border-color:var(--eal-line)!important}
[style*="background:rgba(255,255,255,.0" i],[style*="background:rgba(255,255,255,0.0" i]{background:rgba(11,31,53,.04)!important}
[style*="background:rgba(255,255,255,.1" i]{background:rgba(11,31,53,.07)!important}
[style*="border:1px solid rgba(255,255,255" i],[style*="border-bottom:1px solid rgba(255,255,255" i],[style*="border-top:1px solid rgba(255,255,255" i]{border-color:var(--eal-line)!important}
[style*="background:rgba(0,112,200" i],[style*="background:rgba(59,143,224" i],[style*="background:rgba(60,120,200" i],[style*="background:rgba(31,111,191" i]{background:var(--eal-blue-tint)!important}
[style*="border:1px solid rgba(0,112,200" i],[style*="border:1px solid rgba(59,143,224" i],[style*="border:1px solid rgba(60,120,200" i],[style*="border:1px solid rgba(31,111,191" i]{border-color:rgba(22,139,197,.3)!important}
[style*="background:rgba(240,160,48" i],[style*="background:rgba(196,149,42" i],[style*="background:rgba(243,156,18" i]{background:rgba(217,147,50,.1)!important;border-color:rgba(217,147,50,.4)!important}
.dt th *,.rr-tbl th *{color:inherit!important}
[style*="background:#111" i]{background:#fff!important;color:var(--text)!important;border-color:var(--eal-field)!important}
[style*="background:#0070C8" i],[style*="background:#1F6FBF" i],[style*="background:#0088f0" i]{background:var(--eal-blue-aa)!important;color:#fff!important}
[style*="background:var(--blue)" i],[style*="background:var(--accent)" i],[style*="background:var(--gold)" i]{color:#fff!important}
.dt th[style*="59,143,224" i]{color:var(--eal-blue-aa)!important}

/* ---------- Accessibility ---------- */
:focus-visible{outline:3px solid var(--eal-blue);outline-offset:2px}
.sidebar :focus-visible{outline-color:#fff;outline-offset:-3px}
.nl,.ng,.hamburger{cursor:pointer}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
}

/* ---------- Scrollbars ---------- */
*{scrollbar-color:#B8C6D1 transparent}

/* ---------- Heritage & brand imagery (approved 15/10/2026) ---------- */
/* Crops are low-res: never upscale. Photos are clipped (object-fit:cover), not stretched. */
.lheritage{margin:-1.8rem -2.5rem 1.4rem;position:relative;height:150px;overflow:hidden;border-bottom:1px solid var(--eal-line)}
.lheritage img{width:100%;height:100%;object-fit:cover;object-position:60% 45%;display:block}
.lheritage figcaption{position:absolute;left:0;right:0;bottom:0;padding:.25rem .7rem;font-size:.66rem;letter-spacing:.04em;color:#fff;background:linear-gradient(transparent,rgba(7,20,34,.82))}
@media(max-width:768px){.lheritage{margin:-1.5rem -1.4rem 1.2rem;height:120px}}

.dash-hero{margin:0 0 1.1rem;border:1px solid var(--eal-line);border-radius:var(--eal-card-radius);overflow:hidden;background:#071422}
.dash-hero-strip{display:flex;justify-content:center;height:120px;overflow:hidden}
.dash-hero-strip img{height:120px;width:auto;max-width:none;flex:0 1 auto;min-width:0;object-fit:cover;object-position:left center;display:block}
.dash-hero-cap{display:flex;justify-content:space-between;align-items:center;gap:.8rem;padding:.3rem .8rem;font-size:.68rem;color:var(--eal-silver);background:#0B1F35}
.dash-hero-cap button{background:none;border:0;color:#fff;font:inherit;cursor:pointer;padding:.15rem .3rem;text-decoration:underline}
@media(max-width:700px){.dash-hero-strip img:nth-child(n+3){display:none}.dash-hero-strip{height:96px}.dash-hero-strip img{height:96px}}

.about-nl{margin-top:.6rem;border-top:1px solid rgba(255,255,255,.12)}
.about-wrap{max-width:1100px}
.about-h{font-family:var(--font-head);font-weight:700;letter-spacing:.04em;margin:0 0 .4rem;color:var(--bright)}
.about-h3{font-family:var(--font-head);font-weight:600;letter-spacing:.05em;font-size:1.05rem;margin:1.6rem 0 .6rem;color:var(--bright);display:flex;align-items:center;gap:.6rem}
.about-p,.about-note{font-size:.85rem;line-height:1.55;color:var(--dim);max-width:70ch}
.about-note{margin-top:1.6rem;padding:.7rem .9rem;border-left:4px solid var(--eal-red);background:rgba(11,31,53,.04)}
.about-tag{font-family:var(--font-body);font-size:.62rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;padding:.12rem .45rem;border-radius:999px;border:1px solid var(--eal-line)}
.about-tag.arch{color:#7a4a00;background:#FDF3E3;border-color:#E8CFA4}
.about-tag.ai{color:#0F5E86;background:#E8F3FA;border-color:#B9D6E8}
.about-grid{display:grid;gap:.9rem;align-items:end}
.about-grid.g2{grid-template-columns:repeat(2,minmax(0,max-content))}
.about-grid.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.about-grid.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.about-grid figure{margin:0;background:var(--card);border:1px solid var(--eal-line);border-radius:var(--eal-card-radius);overflow:hidden}
.about-grid img{display:block;max-width:100%;height:auto;margin:0 auto}
.about-grid.g3:not(.refs) img{width:100%;max-width:682px;height:200px;object-fit:cover}
.about-grid.marks img{background:#fff;max-width:480px}
.about-grid figcaption{font-size:.7rem;color:var(--dim);padding:.4rem .6rem;border-top:1px solid var(--eal-line)}
.about-grid.logos figure.on-light img{background:#fff;width:auto}
.about-grid.logos figure.on-dark img{background:#071422;width:auto}
@media(max-width:900px){.about-grid.g4{grid-template-columns:repeat(2,minmax(0,1fr))}.about-grid.g3{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.about-grid.g3,.about-grid.g4,.about-grid.g2{grid-template-columns:1fr}.about-grid.g3:not(.refs) img{height:auto}}

/* ======================================================================
   Brand everywhere (15/10/2026): page bands, textured surfaces, accents
   Low-res art is shown at/below native size; large surfaces use SVG/CSS only.
   ====================================================================== */

/* Page band: shown on every view except Dashboard (own hero) and About */
.page-band{display:none;position:relative;overflow:hidden;min-height:132px;margin:-1.5rem -1.5rem 1.4rem;padding:1.1rem 1.6rem;
  background:#071422 url(/static/brand/bg/navy_gradient.svg) center/cover no-repeat;border-bottom:4px solid var(--eal-red);align-items:center}
.ca[data-view]:not([data-view="dashboard"]):not([data-view="about"]) .page-band{display:flex}
.pb-text{position:relative;z-index:2;max-width:60%}
.pb-eyebrow{display:inline-block;font-family:var(--font-head);font-weight:600;font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:#fff;background:var(--eal-red);padding:.12rem .55rem;border-radius:3px}
.page-band h2{margin:.35rem 0 0;font-family:var(--font-head);font-weight:700;font-size:1.9rem;letter-spacing:.05em;text-transform:uppercase;color:#fff;line-height:1.1}
.page-band p{margin:.25rem 0 0;font-size:.82rem;color:var(--eal-silver);max-width:52ch}
.page-band p:empty{display:none}
.pb-art{position:absolute;top:0;right:0;bottom:0;display:flex;justify-content:flex-end;z-index:1;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 40%);mask-image:linear-gradient(90deg,transparent 0,#000 40%)}
.pb-art img{height:100%;width:auto;max-width:none;display:block}
.page-band::before{content:"";position:absolute;inset:0;z-index:0;background:url(/static/brand/bg/blueprint_grid.svg) center/cover;opacity:.35;mix-blend-mode:screen}
@media(max-width:768px){
  .page-band{margin-bottom:1rem;padding:.8rem 1rem;min-height:84px}
  .page-band h2{font-size:1.35rem}.page-band p{display:none}
  .pb-text{max-width:70%}.pb-art img{opacity:.55}
}

/* Content surface: faint technical grid + red heritage sweep in the corner */
.ca{background-color:var(--bg,#F4F7FA);
  background-image:
    linear-gradient(115deg,transparent 78%,rgba(198,61,50,.06) 78.2%,rgba(198,61,50,.06) 86%,rgba(11,31,53,.04) 86.2%),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='60' height='60'><path d='M60 0H0V60' fill='none' stroke='%23168BC5' stroke-opacity='.07'/></svg>");
  background-attachment:local}
/* Footer ribbon pinned to the end of every page */
.ca{display:flex;flex-direction:column}
.ca>.page-band{flex-shrink:0}
.ca>.view.active{flex:1 0 auto;padding-bottom:2rem}
.ca::after{content:"EAL MERLIN  \00b7  Inventory Intelligence System  \00b7  European Aviation Group";display:block;margin:auto -1.5rem -1.5rem;padding:1.3rem 1.5rem;text-align:center;flex-shrink:0;
  font-family:var(--font-head);font-weight:600;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--eal-silver);
  background:#071422 url(/static/brand/bg/runway_lines.svg) center 70%/cover no-repeat;border-top:4px solid var(--eal-red)}
@media(max-width:768px){.ca::after{font-size:.66rem;letter-spacing:.1em}}

/* Sidebar: radar art under a navy veil, red nav accent */
.sidebar{background:linear-gradient(180deg,rgba(7,20,34,.93) 0%,rgba(11,31,53,.9) 100%),url(/static/brand/bg/engine_radar.svg) 70% 85%/auto 120% no-repeat,#071422}
.nl.active{background:linear-gradient(90deg,rgba(198,61,50,.3),rgba(22,139,197,.18));border-left-color:var(--eal-red)}
.ng-items:not(.closed){border-left:1px solid rgba(198,61,50,.45);margin-left:1.1rem}

/* Topbar: brand line */
.topbar{border-bottom:0;box-shadow:0 3px 0 var(--eal-red),0 4px 10px rgba(11,31,53,.12)}

/* Cards: vibrancy */
.sc,.rr-stat{background:linear-gradient(145deg,#fff 55%,#E8F1F8);position:relative;overflow:hidden;transition:transform .15s,box-shadow .15s}
.sc::after,.rr-stat::after{content:"";position:absolute;right:-18px;top:-18px;width:56px;height:56px;background:var(--eal-red);opacity:.9;transform:rotate(45deg)}
.sc:hover,.rr-stat:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(11,31,53,.14)}
.rr-card,.part-card,.ec{border-left:4px solid var(--eal-red);border-radius:var(--eal-card-radius)}
.sh{padding-bottom:.5rem;border-bottom:2px solid var(--eal-line);position:relative}
.sh::after{content:"";position:absolute;left:0;bottom:-2px;width:64px;height:2px;background:var(--eal-red)}

/* Tables: navy header, red rule */
.dt th,.rr-tbl th,.ea-stock-table th{background:var(--eal-navy);color:#fff;border-bottom:3px solid var(--eal-red);font-family:var(--font-head);letter-spacing:.07em;text-transform:uppercase;font-weight:600}
.dt th[style*="59,143,224" i]{color:#fff!important}
.dt tbody tr:hover td,.rr-tbl tbody tr:hover td{background:rgba(22,139,197,.07)}

/* Primary buttons: red heritage option for key actions already handled by theme; add focus lift */
button.btn:hover,.btn:hover{transform:translateY(-1px)}

/* Login: add the runway art behind the page */
#login-screen{background:#071422 url(/static/brand/bg/runway_lines.svg) center/cover no-repeat}