/* ============================================================================
   EAS UI Framework v1.0.0
   ----------------------------------------------------------------------------
   Single-file CSS framework for the Engineered AI Systems ecosystem.
   Source of truth: private-ai-site v2.1.11.

   Scope
     · Design tokens (colors, typography, spacing, radii, shadows)
     · Marketing patterns:  header, hero, panels, cards, forms, footer, lab
     · Applicative patterns: app-shell, sidebar, topbar, data-table, badges,
                             modals, tabs, alerts, code blocks, page-header,
                             empty state, login screen, definition lists

   Compatibility
     All class names from private-ai-site/css/styles.css are preserved
     verbatim. This file is a strict superset — dropping it in place of the
     site stylesheet keeps the site working unchanged.
   ============================================================================ */

/* ╔══════════════════════════════════════════════════════════════════════════╗
   ║ 1 · DESIGN TOKENS                                                         ║
   ╚══════════════════════════════════════════════════════════════════════════╝ */

:root {
  /* Surfaces */
  --eas-bg:        #071116;
  --eas-bg-2:      #0b171d;
  --eas-bg-3:      #050c10;
  --eas-panel:     #0f232b;
  --eas-panel-2:   #102c35;
  --eas-line:      #21414a;
  --eas-input-bg:  #09171d;

  /* Text */
  --eas-text:      #eef7f5;
  --eas-muted:     #a6bbb8;
  --eas-soft:      #6f8c88;

  /* Accents */
  --eas-accent:    #37d5c2;
  --eas-accent-2:  #78a8ff;

  /* Status */
  --eas-success:   #37d5c2;
  --eas-warning:   #f0c674;
  --eas-danger:    #ff6b8b;
  --eas-info:      #78a8ff;
  --eas-pending:   #a6bbb8;

  /* Radii */
  --eas-radius:    22px;
  --eas-radius-md: 18px;
  --eas-radius-sm: 14px;
  --eas-radius-xs: 10px;

  /* Shadows */
  --eas-shadow:    0 24px 80px rgba(0,0,0,.35);
  --eas-shadow-md: 0 18px 60px rgba(0,0,0,.18);
  --eas-shadow-sm: 0 8px  24px rgba(0,0,0,.22);

  /* Layout */
  --eas-max:       1180px;
  --eas-max-app:   1440px;
  --eas-max-narrow: 760px;
  --eas-sidebar:   268px;
  --eas-sidebar-collapsed: 64px;
  --eas-topbar:    64px;
  --eas-footer:    36px;

  /* Typography */
  --eas-font:      Inter, ui-sans-serif, system-ui, -apple-system,
                   BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  --eas-mono:      "IBM Plex Mono", "JetBrains Mono", ui-monospace,
                   SFMono-Regular, Menlo, Consolas, monospace;

  /* Site-compat aliases */
  --bg:       var(--eas-bg);
  --bg2:      var(--eas-bg-2);
  --panel:    var(--eas-panel);
  --panel2:   var(--eas-panel-2);
  --line:     var(--eas-line);
  --text:     var(--eas-text);
  --muted:    var(--eas-muted);
  --soft:     var(--eas-soft);
  --accent:   var(--eas-accent);
  --accent2:  var(--eas-accent-2);
  --shadow:   var(--eas-shadow);
  --radius:   var(--eas-radius);
  --radius-sm: var(--eas-radius-sm);
  --max:      var(--eas-max);
  --font:     var(--eas-font);
  --mono:     var(--eas-mono);
}

/* ╔══════════════════════════════════════════════════════════════════════════╗
   ║ 2 · BASE / RESET                                                          ║
   ╚══════════════════════════════════════════════════════════════════════════╝ */

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:
    radial-gradient(circle at 10% 0%, rgba(55,213,194,.13), transparent 28%),
    radial-gradient(circle at 90% 4%, rgba(120,168,255,.12), transparent 32%),
    var(--eas-bg);
  color:var(--eas-text);
  font-family:var(--eas-font);
  line-height:1.6;
  text-rendering:optimizeLegibility;
  min-height:100vh;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
p{color:var(--eas-muted);margin:0 0 1rem}

::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:rgba(255,255,255,.08);border-radius:6px}
::-webkit-scrollbar-thumb:hover{background:rgba(55,213,194,.25)}

::selection{background:rgba(55,213,194,.30);color:var(--eas-text)}

/* Accessibility helpers (from site) */
.skip-link{position:absolute;left:-999px;top:0;background:var(--eas-accent);color:#001b1a;padding:.8rem 1rem;z-index:999}
.skip-link:focus{left:12px;top:12px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ╔══════════════════════════════════════════════════════════════════════════╗
   ║ 3 · LAYOUT                                                                ║
   ╚══════════════════════════════════════════════════════════════════════════╝ */

.container{width:min(var(--eas-max),calc(100% - 40px));margin-inline:auto}
.container-app{width:min(var(--eas-max-app),calc(100% - 40px));margin-inline:auto}
.container-narrow{max-width:var(--eas-max-narrow);margin:0 auto;padding:0 1.5rem}

.section-pad{padding:92px 0}
.section-pad-sm{padding:58px 0}

.dark-band{background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.015));border-block:1px solid rgba(255,255,255,.07)}

/* Grids reusable across pages */
.split{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:start}
.card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.method-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.proof-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.feature-list{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.contact-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:30px;align-items:start}

/* ╔══════════════════════════════════════════════════════════════════════════╗
   ║ 4 · TYPOGRAPHY                                                            ║
   ╚══════════════════════════════════════════════════════════════════════════╝ */

.kicker, .section-eyebrow{
  font-family:var(--eas-mono);
  text-transform:uppercase;
  letter-spacing:.16em;
  font-size:.76rem;
  color:var(--eas-accent);
  font-weight:700;
  margin-bottom:1rem;
}

.lead{font-size:clamp(1.05rem,1.6vw,1.28rem);max-width:760px;color:#cbdad7}

.section-head{max-width:820px;margin-bottom:36px}
.section-head h2{font-size:clamp(2rem,4vw,3.4rem);line-height:1.04;letter-spacing:-.055em;margin:0 0 1rem}
.section-intro{font-size:1.08rem;color:#c1d2cf}

.manifesto{display:inline-block;font-family:var(--eas-mono);color:var(--eas-text);border:1px solid rgba(55,213,194,.28);background:rgba(55,213,194,.08);border-radius:999px;padding:.55rem .8rem;margin:0 0 1.35rem}
.manifesto-loop{display:block;border-radius:14px;padding:.9rem 1.15rem;line-height:1.75;font-size:.96rem;max-width:max-content}
.manifesto-loop span{display:block}

.micro{font-size:.84rem;color:var(--eas-soft)}

/* ╔══════════════════════════════════════════════════════════════════════════╗
   ║ 5 · BUTTONS                                                               ║
   ╚══════════════════════════════════════════════════════════════════════════╝ */

.btn{
  display:inline-flex;align-items:center;justify-content:center;
  border-radius:999px;padding:.88rem 1.16rem;font-weight:800;
  border:1px solid transparent;
  transition:transform .2s ease, background .2s ease, border-color .2s ease;
  cursor:pointer;font-family:inherit;font-size:inherit;
  white-space:nowrap;
}
.btn:hover{transform:translateY(-2px)}
.btn:disabled, .btn[aria-disabled="true"]{opacity:.5;cursor:not-allowed;transform:none!important}

.btn-primary{background:var(--eas-accent);color:#001c1a;box-shadow:0 14px 40px rgba(55,213,194,.2)}
.btn-ghost{border-color:rgba(255,255,255,.16);color:var(--eas-text);background:rgba(255,255,255,.04)}
.btn-danger{background:rgba(255,107,139,.14);border-color:rgba(255,107,139,.45);color:#ffc4cf}
.btn-danger:hover{background:rgba(255,107,139,.22)}

.btn-sm{padding:.5rem .8rem;font-size:.84rem;font-weight:700}
.btn-xs{padding:.32rem .58rem;font-size:.76rem;font-weight:700;border-radius:8px}

.btn-icon{
  display:inline-flex;align-items:center;justify-content:center;
  width:36px;height:36px;border-radius:10px;
  border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.04);
  color:var(--eas-muted);cursor:pointer;transition:all .15s ease;
}
.btn-icon:hover{color:var(--eas-text);border-color:rgba(55,213,194,.4);background:rgba(55,213,194,.06)}
.btn-icon svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* ╔══════════════════════════════════════════════════════════════════════════╗
   ║ 6 · SITE HEADER + NAV (marketing-style)                                   ║
   ╚══════════════════════════════════════════════════════════════════════════╝ */

.site-header{position:sticky;top:0;z-index:50;background:rgba(7,17,22,.78);backdrop-filter:blur(18px);border-bottom:1px solid rgba(55,213,194,.12)}
.nav-shell{display:flex;align-items:center;gap:1rem;min-height:78px}
.brand{display:flex;align-items:center;gap:.75rem;min-width:max-content}
.brand-mark{display:block;width:68px;height:40px;object-fit:contain;flex:none}
.brand strong{display:block;font-size:.98rem;line-height:1.1}
.brand small{display:block;font-family:var(--eas-mono);font-size:.68rem;color:var(--eas-muted);line-height:1.2;margin-top:.2rem}

.site-nav{display:flex;align-items:center;justify-content:center;gap:.2rem;margin-left:auto}
.nav-link{font-size:.92rem;color:var(--eas-muted);padding:.65rem .7rem;border-radius:999px}
.nav-link:hover, .nav-link.active{color:var(--eas-text);background:rgba(255,255,255,.06)}

.header-cta{margin-left:.55rem;background:rgba(55,213,194,.13);border:1px solid rgba(55,213,194,.45);color:var(--eas-text);border-radius:999px;padding:.72rem 1rem;font-weight:700;font-size:.9rem}
.header-cta:hover{background:rgba(55,213,194,.22)}

.menu-toggle{display:none;margin-left:auto;background:transparent;border:0;padding:.5rem;cursor:pointer}
.menu-toggle span:not(.sr-only){display:block;width:24px;height:2px;background:var(--eas-text);margin:5px 0;border-radius:99px}

.lang-switch{display:inline-flex;align-items:center;justify-content:center;font-family:var(--eas-mono);font-weight:700;font-size:.78rem;letter-spacing:.08em;color:var(--eas-muted);border:1px solid rgba(255,255,255,.14);border-radius:999px;padding:.5rem .72rem;margin-left:.4rem;text-transform:uppercase;transition:color .2s,border-color .2s,background .2s}
.lang-switch:hover{color:var(--eas-text);border-color:rgba(55,213,194,.4);background:rgba(55,213,194,.06)}

/* ╔══════════════════════════════════════════════════════════════════════════╗
   ║ 7 · HERO                                                                  ║
   ╚══════════════════════════════════════════════════════════════════════════╝ */

.hero{position:relative;overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:56px;align-items:center}
.hero h1{font-size:clamp(2.55rem,6vw,5.5rem);line-height:.98;letter-spacing:-.075em;margin:0 0 1.25rem;max-width:980px}
.hero-actions{display:flex;gap:.8rem;flex-wrap:wrap}
.hero-visual{border:1px solid rgba(55,213,194,.16);border-radius:28px;background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.015));box-shadow:var(--eas-shadow);overflow:hidden}

/* ╔══════════════════════════════════════════════════════════════════════════╗
   ║ 8 · PANELS, CARDS, LISTS                                                  ║
   ╚══════════════════════════════════════════════════════════════════════════╝ */

.panel{border:1px solid rgba(255,255,255,.1);background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.02));border-radius:var(--eas-radius);padding:28px;box-shadow:var(--eas-shadow-md)}
.panel h3{margin:0 0 .7rem;font-size:1.35rem}

.check-list, .plain-list{list-style:none;margin:1rem 0 0;padding:0}
.check-list li, .plain-list li{position:relative;color:#cadbd8;margin:.66rem 0;padding-left:1.85rem}
.check-list li::before{content:"";position:absolute;left:0;top:.48rem;width:.78rem;height:.78rem;border-radius:50%;background:var(--eas-accent);box-shadow:0 0 0 5px rgba(55,213,194,.1)}
.plain-list li::before{content:"—";position:absolute;left:0;color:var(--eas-accent)}

.service-card{border:1px solid rgba(255,255,255,.1);background:linear-gradient(180deg,rgba(16,44,53,.86),rgba(12,30,37,.72));border-radius:var(--eas-radius);padding:24px;min-height:248px;display:flex;flex-direction:column;position:relative;overflow:hidden}
.service-card::after{content:"";position:absolute;right:-30px;top:-30px;width:110px;height:110px;border-radius:50%;background:rgba(55,213,194,.08)}
.service-card h3{font-size:1.22rem;line-height:1.2;margin:.2rem 0 .7rem}
.service-card p{font-size:.98rem}

.icon{width:46px;height:46px;border:1px solid rgba(55,213,194,.28);border-radius:14px;display:grid;place-items:center;background:rgba(55,213,194,.08);margin-bottom:1rem}
.icon svg{width:25px;height:25px;fill:none;stroke:var(--eas-accent);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

.card-link{margin-top:auto;color:var(--eas-accent);font-weight:800}

.method-step{padding:24px;border:1px solid rgba(255,255,255,.1);border-radius:var(--eas-radius);background:rgba(255,255,255,.035)}
.method-step span{font-family:var(--eas-mono);color:var(--eas-accent);font-weight:800}
.method-step h3{margin:.45rem 0 .55rem}

.proof-item{padding:24px;border:1px solid rgba(55,213,194,.18);border-radius:var(--eas-radius);background:rgba(55,213,194,.06)}
.proof-item strong{display:block;font-size:2.35rem;letter-spacing:-.06em;color:var(--eas-text)}
.proof-item span{display:block;color:var(--eas-accent);font-family:var(--eas-mono);font-weight:700;font-size:.83rem;text-transform:uppercase;letter-spacing:.08em}
.proof-item p{font-size:.94rem;margin-top:.8rem}

.feature-list article{border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.035);border-radius:18px;padding:18px}
.feature-list h3{margin:0 0 .35rem;font-size:1.05rem}

.quote-panel{padding:34px;border-radius:var(--eas-radius);background:linear-gradient(135deg,rgba(55,213,194,.13),rgba(120,168,255,.08));border:1px solid rgba(55,213,194,.22)}
.quote-panel blockquote{margin:0;font-size:clamp(1.45rem,2.5vw,2.25rem);line-height:1.16;letter-spacing:-.04em}

.diagram-wrap{border:1px solid rgba(255,255,255,.1);border-radius:var(--eas-radius);overflow:hidden;background:#071116;box-shadow:var(--eas-shadow)}

.cta-band{border-block:1px solid rgba(55,213,194,.18);background:radial-gradient(circle at 15% 50%,rgba(55,213,194,.12),transparent 34%),rgba(9,24,30,.88)}
.cta-grid{display:grid;grid-template-columns:1fr auto;gap:28px;align-items:center}
.cta-grid h2{font-size:clamp(1.8rem,3.6vw,3.1rem);line-height:1.04;margin:0 0 .7rem;letter-spacing:-.055em}
.cta-grid p{max-width:760px}

/* ╔══════════════════════════════════════════════════════════════════════════╗
   ║ 9 · FORMS                                                                 ║
   ╚══════════════════════════════════════════════════════════════════════════╝ */

.contact-form{display:grid;gap:16px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}

.field label{display:block;font-weight:750;margin-bottom:.4rem;color:#dfeae8}
.field input, .field select, .field textarea{
  width:100%;border:1px solid rgba(255,255,255,.15);background:var(--eas-input-bg);
  color:var(--eas-text);border-radius:13px;padding:.9rem 1rem;font:inherit;outline:0;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.field textarea{min-height:140px;resize:vertical}
.field input:focus, .field select:focus, .field textarea:focus{
  border-color:var(--eas-accent);box-shadow:0 0 0 4px rgba(55,213,194,.1);
}
.field input[aria-invalid="true"], .field select[aria-invalid="true"], .field textarea[aria-invalid="true"]{
  border-color:var(--eas-danger);box-shadow:0 0 0 4px rgba(255,107,139,.1);
}
.field-hint{margin:.4rem 0 0;font-size:.84rem;color:var(--eas-soft)}
.field-error{margin:.4rem 0 0;font-size:.84rem;color:var(--eas-danger);font-family:var(--eas-mono)}

.checkbox{display:flex;gap:.7rem;align-items:flex-start;color:var(--eas-muted);font-size:.95rem}
.checkbox input{margin-top:.3rem}

/* Fieldset grouping (for app forms) */
.fieldset{border:1px solid rgba(255,255,255,.08);border-radius:var(--eas-radius-sm);padding:20px;margin:0}
.fieldset legend{padding:0 .6rem;font-family:var(--eas-mono);font-size:.78rem;text-transform:uppercase;letter-spacing:.12em;color:var(--eas-accent)}

/* ╔══════════════════════════════════════════════════════════════════════════╗
   ║ 10 · TABLES (marketing + applicative data tables)                         ║
   ╚══════════════════════════════════════════════════════════════════════════╝ */

.table-wrap{overflow:auto;border:1px solid rgba(255,255,255,.1);border-radius:18px}
.table{width:100%;border-collapse:collapse;min-width:760px}
.table th, .table td{border-bottom:1px solid rgba(255,255,255,.08);padding:14px;text-align:left;vertical-align:top}
.table th{color:var(--eas-accent);font-family:var(--eas-mono);font-size:.82rem;text-transform:uppercase}
.table td{color:#c9dbd8}

/* Applicative data table — dense rows, hover, sortable headers */
.data-table{width:100%;border-collapse:collapse;font-size:.92rem}
.data-table th{
  position:sticky;top:0;z-index:1;
  background:var(--eas-bg-2);
  color:var(--eas-muted);font-family:var(--eas-mono);font-size:.74rem;
  text-transform:uppercase;letter-spacing:.1em;font-weight:700;
  padding:14px 16px;text-align:left;
  border-bottom:1px solid rgba(255,255,255,.1);
}
.data-table th.sortable{cursor:pointer;user-select:none}
.data-table th.sortable::after{content:" ↕";opacity:.4}
.data-table th.sort-asc::after{content:" ↑";opacity:1;color:var(--eas-accent)}
.data-table th.sort-desc::after{content:" ↓";opacity:1;color:var(--eas-accent)}
.data-table td{padding:14px 16px;color:var(--eas-text);border-bottom:1px solid rgba(255,255,255,.04)}
.data-table tbody tr{transition:background .12s ease}
.data-table tbody tr:hover{background:rgba(55,213,194,.04)}
.data-table tbody tr.is-selected{background:rgba(55,213,194,.08)}
.data-table .cell-mono{font-family:var(--eas-mono);font-size:.84rem;color:var(--eas-muted)}
.data-table .cell-actions{text-align:right;white-space:nowrap}

/* Definition list (key/value detail views) */
.dl-grid{display:grid;grid-template-columns:200px 1fr;gap:10px 20px;margin:0}
.dl-grid dt{font-family:var(--eas-mono);font-size:.78rem;text-transform:uppercase;letter-spacing:.1em;color:var(--eas-muted);padding-top:.2rem}
.dl-grid dd{margin:0;color:var(--eas-text)}

/* ╔══════════════════════════════════════════════════════════════════════════╗
   ║ 11 · BADGES / STATUS PILLS                                                ║
   ╚══════════════════════════════════════════════════════════════════════════╝ */

.badge{
  display:inline-flex;align-items:center;gap:.4rem;
  font-family:var(--eas-mono);font-size:.72rem;font-weight:700;
  text-transform:uppercase;letter-spacing:.08em;
  padding:.32rem .65rem;border-radius:999px;
  border:1px solid transparent;white-space:nowrap;
}
.badge::before{content:"";width:.45rem;height:.45rem;border-radius:50%;background:currentColor}
.badge.no-dot::before{display:none}

.badge-success{color:var(--eas-success);background:rgba(55,213,194,.10);border-color:rgba(55,213,194,.35)}
.badge-warning{color:var(--eas-warning);background:rgba(240,198,116,.10);border-color:rgba(240,198,116,.35)}
.badge-danger {color:var(--eas-danger); background:rgba(255,107,139,.10);border-color:rgba(255,107,139,.35)}
.badge-info   {color:var(--eas-info);   background:rgba(120,168,255,.10);border-color:rgba(120,168,255,.35)}
.badge-pending{color:var(--eas-pending);background:rgba(166,187,184,.10);border-color:rgba(166,187,184,.30)}
.badge-neutral{color:var(--eas-muted);  background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.10)}

/* Tag (low-emphasis, no dot) — used in lab articles */
.tag{font-family:var(--eas-mono);font-size:.7rem;padding:.3rem .65rem;border:1px solid rgba(255,255,255,.12);border-radius:999px;color:var(--eas-muted);text-transform:lowercase;letter-spacing:.02em}

/* ╔══════════════════════════════════════════════════════════════════════════╗
   ║ 12 · ALERTS (banners, inline messages)                                    ║
   ╚══════════════════════════════════════════════════════════════════════════╝ */

.alert{
  display:flex;gap:14px;align-items:flex-start;
  padding:16px 20px;border-radius:var(--eas-radius-sm);
  border:1px solid;background:rgba(255,255,255,.02);
  margin:0 0 1rem;
}
.alert h4{margin:0 0 .3rem;font-size:1rem;font-weight:700;color:var(--eas-text)}
.alert p{margin:0;color:var(--eas-muted);font-size:.92rem}
.alert .alert-icon{flex:none;width:24px;height:24px;display:grid;place-items:center;border-radius:50%;font-family:var(--eas-mono);font-weight:700;font-size:.82rem}
.alert-success{border-color:rgba(55,213,194,.35);background:rgba(55,213,194,.06)}
.alert-success .alert-icon{background:rgba(55,213,194,.18);color:var(--eas-success)}
.alert-warning{border-color:rgba(240,198,116,.35);background:rgba(240,198,116,.05)}
.alert-warning .alert-icon{background:rgba(240,198,116,.18);color:var(--eas-warning)}
.alert-danger {border-color:rgba(255,107,139,.35);background:rgba(255,107,139,.05)}
.alert-danger  .alert-icon{background:rgba(255,107,139,.18);color:var(--eas-danger)}
.alert-info   {border-color:rgba(120,168,255,.35);background:rgba(120,168,255,.05)}
.alert-info    .alert-icon{background:rgba(120,168,255,.18);color:var(--eas-info)}

/* ╔══════════════════════════════════════════════════════════════════════════╗
   ║ 13 · CODE BLOCKS / INLINE CODE                                            ║
   ╚══════════════════════════════════════════════════════════════════════════╝ */

code, kbd, samp{font-family:var(--eas-mono);font-size:.92em}
:not(pre) > code{
  background:rgba(55,213,194,.08);color:var(--eas-text);
  padding:.12rem .42rem;border-radius:6px;
  border:1px solid rgba(55,213,194,.15);
}
pre{
  background:var(--eas-input-bg);
  border:1px solid rgba(255,255,255,.08);
  border-radius:var(--eas-radius-sm);
  padding:18px 20px;overflow-x:auto;
  font-family:var(--eas-mono);font-size:.88rem;line-height:1.55;color:#d8e6e3;
  margin:0 0 1rem;
}
pre code{background:none;border:0;padding:0;color:inherit;font-size:inherit}

kbd{
  display:inline-block;padding:.12rem .5rem;font-size:.78rem;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);
  border-bottom-width:2px;border-radius:6px;color:var(--eas-text);
}

/* ╔══════════════════════════════════════════════════════════════════════════╗
   ║ 14 · TABS                                                                 ║
   ╚══════════════════════════════════════════════════════════════════════════╝ */

.tabs{display:flex;gap:.15rem;border-bottom:1px solid rgba(255,255,255,.08);margin:0 0 1.5rem;overflow-x:auto}
.tabs button, .tabs a{
  background:transparent;border:0;
  padding:.85rem 1.1rem;font-family:inherit;font-size:.92rem;color:var(--eas-muted);
  cursor:pointer;border-bottom:2px solid transparent;
  transition:color .15s ease, border-color .15s ease;
  white-space:nowrap;
}
.tabs button:hover, .tabs a:hover{color:var(--eas-text)}
.tabs button.is-active, .tabs a.is-active, .tabs button[aria-selected="true"]{
  color:var(--eas-accent);border-bottom-color:var(--eas-accent);
}

/* ╔══════════════════════════════════════════════════════════════════════════╗
   ║ 15 · MODAL / DIALOG                                                       ║
   ╚══════════════════════════════════════════════════════════════════════════╝ */

.modal-backdrop{
  position:fixed;inset:0;z-index:200;
  background:rgba(5,12,16,.72);backdrop-filter:blur(6px);
  display:grid;place-items:center;padding:24px;
}
.modal{
  width:min(560px,100%);max-height:calc(100vh - 48px);overflow:auto;
  background:linear-gradient(180deg,#0f232b,#0a1a20);
  border:1px solid rgba(255,255,255,.1);border-radius:var(--eas-radius);
  box-shadow:var(--eas-shadow);padding:28px;
}
.modal-header{display:flex;align-items:flex-start;gap:1rem;margin-bottom:1rem}
.modal-header h3{margin:0;font-size:1.35rem;line-height:1.2}
.modal-close{margin-left:auto;background:transparent;border:0;color:var(--eas-muted);font-size:1.4rem;cursor:pointer;line-height:1;padding:.2rem .4rem;border-radius:8px}
.modal-close:hover{color:var(--eas-text);background:rgba(255,255,255,.06)}
.modal-actions{display:flex;gap:.6rem;justify-content:flex-end;margin-top:1.5rem;flex-wrap:wrap}

/* ╔══════════════════════════════════════════════════════════════════════════╗
   ║ 16 · APP SHELL (sidebar + topbar + content)                               ║
   ╚══════════════════════════════════════════════════════════════════════════╝ */

.app-shell{
  display:grid;
  grid-template-columns:var(--eas-sidebar) 1fr;
  grid-template-rows:var(--eas-topbar) 1fr auto;
  grid-template-areas:
    "sidebar topbar"
    "sidebar main"
    "footer  footer";
  min-height:100vh;min-height:100dvh;
}

/* Variant: shell that hosts a swappable iframe in .app-main.
   The shell occupies exactly the viewport (no body scroll); the iframe
   inside .app-main scrolls its own content. Added in v1.3.0 for
   eas-platform-shell. */
.app-shell.app-shell-frame{
  height:100vh;height:100dvh;
  min-height:0;
  overflow:hidden;
}
.app-shell.app-shell-frame > .app-main{
  padding:0;
  overflow:hidden;
}
.app-shell.app-shell-frame > .app-main > iframe{
  width:100%;height:100%;border:0;display:block;background:var(--eas-bg);
}

.app-sidebar{
  grid-area:sidebar;
  background:var(--eas-bg-3);
  border-right:1px solid rgba(255,255,255,.06);
  display:flex;flex-direction:column;
  position:sticky;top:0;height:100vh;height:100dvh;
  overflow-y:auto;
}
.app-sidebar-brand{
  display:flex;align-items:center;gap:.65rem;
  padding:18px 20px;
  border-bottom:1px solid rgba(255,255,255,.05);
}
.app-sidebar-brand img{width:42px;height:24px;object-fit:contain}
.app-sidebar-brand strong{font-size:.92rem;line-height:1.1}
.app-sidebar-brand small{display:block;font-family:var(--eas-mono);font-size:.62rem;color:var(--eas-muted);text-transform:uppercase;letter-spacing:.1em;margin-top:.15rem}

.app-sidebar-nav{flex:1;padding:14px 12px;display:flex;flex-direction:column;gap:.15rem}
.app-sidebar-section{
  font-family:var(--eas-mono);font-size:.66rem;
  text-transform:uppercase;letter-spacing:.18em;
  color:var(--eas-soft);
  padding:1.2rem .6rem .4rem;
}
.app-sidebar-link{
  display:flex;align-items:center;gap:.7rem;
  padding:.7rem .85rem;border-radius:var(--eas-radius-xs);
  color:var(--eas-muted);font-size:.92rem;
  transition:color .15s ease, background .15s ease;
}
.app-sidebar-link:hover{color:var(--eas-text);background:rgba(255,255,255,.04)}
.app-sidebar-link.is-active{color:var(--eas-text);background:rgba(55,213,194,.10);box-shadow:inset 2px 0 0 var(--eas-accent)}
.app-sidebar-link svg{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.app-sidebar-link .count{margin-left:auto;font-family:var(--eas-mono);font-size:.72rem;color:var(--eas-soft)}

/* Two-level sidebar (v1.2.0). Used by platform-shell to render module
   sub-sections under the active module. The container is rendered ONLY
   under the currently-active .app-sidebar-link; the framework provides
   only the visual treatment — JS toggling lives in platform-sidebar.js. */
.app-sidebar-subnav{
  display:flex;flex-direction:column;
  margin:.15rem 0 .45rem 1.55rem;
  border-left:1px solid var(--eas-line);
  padding-left:.55rem;
  gap:1px;
}
.app-sidebar-subnav .app-sidebar-link{
  font-size:.82rem;padding:.38rem .55rem;color:var(--eas-muted);
}
.app-sidebar-subnav .app-sidebar-link:hover{
  color:var(--eas-text);background:rgba(255,255,255,.03);
}
.app-sidebar-subnav .app-sidebar-link.is-active{
  color:var(--eas-accent);background:rgba(55,213,194,.10);box-shadow:none;
}

.app-sidebar-footer{
  padding:14px 16px;border-top:1px solid rgba(255,255,255,.05);
  font-family:var(--eas-mono);font-size:.7rem;color:var(--eas-soft);
}

.app-topbar{
  grid-area:topbar;
  display:flex;align-items:center;gap:16px;
  padding:0 24px;
  background:rgba(7,17,22,.78);backdrop-filter:blur(18px);
  border-bottom:1px solid rgba(255,255,255,.06);
  position:sticky;top:0;z-index:40;
}
.app-topbar-toggle{display:none;background:transparent;border:0;color:var(--eas-text);padding:.5rem;cursor:pointer}
.app-topbar-title{font-size:1.05rem;font-weight:700;margin:0}
.app-topbar-spacer{flex:1}
.app-topbar-search{
  flex:0 1 320px;display:flex;align-items:center;gap:.5rem;
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);
  border-radius:999px;padding:.5rem .9rem;
}
.app-topbar-search input{flex:1;background:none;border:0;color:var(--eas-text);font:inherit;outline:0;min-width:0}
.app-topbar-search input::placeholder{color:var(--eas-soft)}
.app-topbar-actions{display:flex;align-items:center;gap:.4rem}
.app-user{
  display:inline-flex;align-items:center;gap:.6rem;padding:.35rem .8rem .35rem .35rem;
  border:1px solid rgba(255,255,255,.08);border-radius:999px;
  background:rgba(255,255,255,.03);
}
.app-user-avatar{
  width:30px;height:30px;border-radius:50%;
  background:linear-gradient(135deg,var(--eas-accent),var(--eas-accent-2));
  display:grid;place-items:center;color:#001c1a;font-weight:800;font-size:.78rem;
}
.app-user-name{font-size:.88rem;color:var(--eas-text)}

.app-main{
  grid-area:main;
  padding:28px 32px 48px;
  overflow-x:auto;
}

/* ── App footer (v1.3.0) ────────────────────────────────────────────────
   Full-width strip across the bottom of .app-shell. Optional: if .app-shell
   has no element in the "footer" grid area, the row collapses to zero
   height (grid-template-rows uses `auto` for it). Designed to hold version,
   build/commit, and a small set of administrative links. Keep it dense —
   not a marketing footer. */
.app-footer{
  grid-area:footer;
  display:flex;align-items:center;gap:1rem;
  padding:0 24px;
  min-height:var(--eas-footer);
  background:rgba(7,17,22,.92);
  border-top:1px solid rgba(255,255,255,.06);
  font-family:var(--eas-mono);
  font-size:.7rem;
  color:var(--eas-soft);
  letter-spacing:.02em;
}
.app-footer-left,
.app-footer-right{
  display:flex;align-items:center;gap:.9rem;
  flex-wrap:nowrap;overflow:hidden;
}
.app-footer-left{flex:1;min-width:0}
.app-footer-right{flex:0 0 auto;justify-content:flex-end}
.app-footer-sep{
  display:inline-block;width:1px;height:.85em;
  background:rgba(255,255,255,.12);
  margin:0 .15rem;
}
.app-footer a{
  color:var(--eas-muted);
  text-decoration:none;
  border-bottom:1px dotted transparent;
  transition:color .15s ease, border-color .15s ease;
}
.app-footer a:hover{
  color:var(--eas-accent);
  border-bottom-color:var(--eas-accent);
}
.app-footer code,
.app-footer .mono{
  font-family:var(--eas-mono);
  color:var(--eas-muted);
}
.app-footer .dot-ok{color:var(--eas-success)}
.app-footer .dot-warn{color:var(--eas-warning)}
.app-footer .dot-err{color:var(--eas-danger)}

/* Page header inside app */
.page-header{display:flex;align-items:flex-end;gap:1.5rem;flex-wrap:wrap;margin:0 0 28px;padding-bottom:18px;border-bottom:1px solid rgba(255,255,255,.06)}
.page-header-text{flex:1;min-width:240px}
.page-header h1{font-size:clamp(1.6rem,2.4vw,2.2rem);line-height:1.1;letter-spacing:-.03em;margin:.2rem 0 .4rem}
.page-header .breadcrumb,
.page-header .kicker{margin-bottom:.2rem}
.page-header-actions{display:flex;gap:.6rem;flex-wrap:wrap}

/* Toolbar above tables */
.toolbar{
  display:flex;gap:.6rem;align-items:center;flex-wrap:wrap;
  padding:14px 16px;background:rgba(255,255,255,.025);
  border:1px solid rgba(255,255,255,.06);border-radius:var(--eas-radius-sm);
  margin-bottom:18px;
}
.toolbar-spacer{flex:1}
.toolbar input[type="search"], .toolbar select{
  background:var(--eas-input-bg);border:1px solid rgba(255,255,255,.12);
  border-radius:10px;padding:.55rem .8rem;color:var(--eas-text);font:inherit;outline:0;font-size:.9rem;
}

/* Empty state */
.empty-state{
  text-align:center;padding:64px 24px;
  border:1px dashed rgba(255,255,255,.1);border-radius:var(--eas-radius);
  color:var(--eas-muted);
}
.empty-state .icon{margin:0 auto 1.2rem}
.empty-state h3{margin:0 0 .5rem;color:var(--eas-text)}
.empty-state p{max-width:420px;margin:0 auto 1rem}

/* ╔══════════════════════════════════════════════════════════════════════════╗
   ║ 17 · LOGIN / AUTH SCREENS                                                 ║
   ╚══════════════════════════════════════════════════════════════════════════╝ */

.auth-shell{
  min-height:100vh;min-height:100dvh;
  display:grid;place-items:center;padding:32px 20px;
}
.auth-card{
  width:min(440px,100%);
  border:1px solid rgba(255,255,255,.1);
  background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.02));
  border-radius:var(--eas-radius);box-shadow:var(--eas-shadow);
  padding:36px 32px;
}
.auth-card .brand{justify-content:center;margin-bottom:1.5rem}
.auth-card h1{font-size:1.6rem;line-height:1.15;letter-spacing:-.02em;margin:0 0 .4rem;text-align:center}
.auth-card .lead{text-align:center;font-size:.96rem;margin:0 auto 1.6rem}
.auth-card form{display:grid;gap:14px}
.auth-card .btn-primary{width:100%}
.auth-meta{margin-top:1.4rem;text-align:center;font-size:.85rem;color:var(--eas-soft)}
.auth-meta a{color:var(--eas-accent)}

/* ╔══════════════════════════════════════════════════════════════════════════╗
   ║ 18 · BREADCRUMBS, FOOTER                                                  ║
   ╚══════════════════════════════════════════════════════════════════════════╝ */

.breadcrumbs{padding:24px 0 0}
.breadcrumbs a, .breadcrumbs span{font-size:.85rem;color:var(--eas-soft)}
.breadcrumbs a:hover{color:var(--eas-accent)}

.breadcrumb{font-family:var(--eas-mono);font-size:.78rem;color:var(--eas-muted);margin:2.5rem 0 2rem;letter-spacing:.04em}
.breadcrumb a{color:var(--eas-muted);text-decoration:none;border-bottom:1px solid transparent;transition:color .2s,border-color .2s}
.breadcrumb a:hover{color:var(--eas-accent);border-color:var(--eas-accent)}
.breadcrumb span{color:var(--eas-text);opacity:.7}

.site-footer{border-top:1px solid rgba(255,255,255,.08);background:var(--eas-bg-3);padding:54px 0 42px}
.footer-grid{display:grid;grid-template-columns:1.4fr .75fr .75fr 1fr;gap:28px}
.footer-grid h2{font-size:.9rem;text-transform:uppercase;letter-spacing:.12em;color:var(--eas-accent);font-family:var(--eas-mono);margin:0 0 .8rem}
.footer-grid p{margin:.35rem 0}
.footer-note{max-width:380px;margin-top:1rem!important}

.legal h2{font-size:1.6rem;margin-top:2.3rem}
.legal h3{font-size:1.2rem;margin-top:1.4rem}
.legal p, .legal li{color:#bfd2cf}
.legal ul{padding-left:1.1rem}

/* ╔══════════════════════════════════════════════════════════════════════════╗
   ║ 19 · LAB / ARTICLES                                                       ║
   ╚══════════════════════════════════════════════════════════════════════════╝ */

.lab-body{background:var(--eas-bg)}
.lab-header .brand small{color:var(--eas-accent);opacity:.85}

.lab-hub-hero{text-align:center;padding:5rem 0 3rem}
.lab-hub-hero h1{font-size:clamp(2.4rem,5vw,3.6rem);line-height:1.1;margin:.4rem 0 1.2rem}
.lab-hub-hero .lead{max-width:600px;margin:0 auto;color:var(--eas-muted);font-size:1.1rem;line-height:1.55}
.lab-section-title{font-family:var(--eas-mono);font-size:.78rem;text-transform:uppercase;letter-spacing:.16em;color:var(--eas-accent);margin:0 0 .4rem}
.lab-section-heading{text-align:center;margin:4rem 0 2rem;font-size:1.4rem;color:var(--eas-muted);font-weight:400}

.lab-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin:3rem 0}
.lab-tile{display:block;padding:2rem 1.5rem;border:1px solid rgba(255,255,255,.08);border-radius:14px;text-decoration:none;color:var(--eas-text);transition:border-color .2s,background .2s,transform .2s;text-align:center}
.lab-tile:hover{border-color:rgba(55,213,194,.4);background:rgba(55,213,194,.04);transform:translateY(-2px)}
.lab-tile h2{font-size:3rem;line-height:1;margin:.4rem 0;color:var(--eas-accent);font-weight:700}
.lab-tile .card-meta{font-family:var(--eas-mono);font-size:.72rem;text-transform:uppercase;letter-spacing:.12em;color:var(--eas-muted)}
.lab-tile .card-excerpt{color:var(--eas-muted);font-size:.92rem;margin-top:.6rem;line-height:1.5}

.lab-latest{padding-bottom:6rem}
.lab-index{padding-bottom:6rem}

.articles-grid{display:grid;grid-template-columns:1fr;gap:1.2rem;max-width:900px;margin:0 auto}
.article-card{display:block;padding:1.8rem;border:1px solid rgba(255,255,255,.08);border-radius:14px;text-decoration:none;color:var(--eas-text);transition:border-color .2s,background .2s,transform .2s}
.article-card:hover{border-color:rgba(55,213,194,.4);background:rgba(55,213,194,.03);transform:translateY(-2px)}
.article-card h3{font-size:1.25rem;line-height:1.3;margin:.3rem 0 .6rem}
.article-card .card-meta{font-family:var(--eas-mono);font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;color:var(--eas-muted);margin:0}
.article-card .card-excerpt{color:var(--eas-muted);font-size:.95rem;line-height:1.55;margin:0}

.lab-article{padding-bottom:6rem}
.lab-article .article-header{margin:1rem 0 2.5rem}
.lab-article .article-meta{font-family:var(--eas-mono);font-size:.78rem;text-transform:uppercase;letter-spacing:.12em;color:var(--eas-accent);margin:0 0 .8rem}
.lab-article .article-header h1{font-size:clamp(2rem,4.5vw,3rem);line-height:1.15;margin:0 0 1.2rem}
.lab-article .article-lead{font-size:1.25rem;line-height:1.55;color:var(--eas-text);opacity:.88;margin:0 0 1.5rem}
.lab-article .article-tags{display:flex;flex-wrap:wrap;gap:.4rem}
.lab-article .article-body{font-size:1.05rem;line-height:1.75;color:var(--eas-text);opacity:.95}
.lab-article .article-body p{margin:0 0 1.4rem}
.lab-article .article-body strong{color:var(--eas-text);opacity:1}
.lab-article .article-body em{color:var(--eas-accent);font-style:italic}
.lab-article .article-body h3{font-size:1.2rem;margin:2.5rem 0 1rem;color:var(--eas-text)}
.lab-article .article-body ul.check-list{margin:1rem 0 1.5rem}
.lab-article .article-ref{margin-top:2.5rem;padding:1rem 1.2rem;border-left:3px solid var(--eas-accent);background:rgba(55,213,194,.04);font-family:var(--eas-mono);font-size:.85rem;color:var(--eas-muted);border-radius:0 8px 8px 0}
.lab-article .article-source{margin-top:1rem;font-family:var(--eas-mono);font-size:.85rem}
.lab-article .article-source a{color:var(--eas-accent)}
.lab-article .article-status{margin-top:2rem;font-family:var(--eas-mono);font-size:.9rem;padding:.8rem 1.2rem;background:rgba(255,255,255,.04);border-radius:8px}
.lab-article .project-links{margin-top:2.5rem;padding-top:1.5rem;border-top:1px solid rgba(255,255,255,.08)}
.lab-article .project-links h3{font-family:var(--eas-mono);font-size:.85rem;text-transform:uppercase;letter-spacing:.1em;color:var(--eas-muted);margin:0 0 .8rem}
.lab-article .project-links ul{list-style:none;padding:0;margin:0}
.lab-article .project-links li{margin:.4rem 0}
.lab-article .article-footer{margin-top:4rem;padding-top:2rem;border-top:1px solid rgba(255,255,255,.08)}

.news-list{display:flex;flex-direction:column;gap:1rem;max-width:760px;margin:0 auto}
.news-item{padding:1.8rem;border:1px solid rgba(255,255,255,.08);border-radius:14px}
.news-item h3{margin:.3rem 0 .8rem;font-size:1.2rem}
.news-item p{color:var(--eas-muted);line-height:1.6;margin:0}
.news-item .card-meta{font-family:var(--eas-mono);font-size:.72rem;text-transform:uppercase;letter-spacing:.12em;color:var(--eas-accent);margin:0}

.article-figure{margin:2.4rem 0;border:1px solid #1d3a44;border-radius:14px;overflow:hidden;background:#071116}
.article-figure img{display:block;width:100%;height:auto}

/* ╔══════════════════════════════════════════════════════════════════════════╗
   ║ 20 · ANIMATIONS                                                           ║
   ╚══════════════════════════════════════════════════════════════════════════╝ */

.reveal{opacity:0;transform:translateY(14px);transition:opacity .55s ease, transform .55s ease}
.reveal.visible{opacity:1;transform:none}
.delay-1{transition-delay:.12s}
.delay-2{transition-delay:.24s}

@keyframes eas-spin{to{transform:rotate(360deg)}}
.spinner{display:inline-block;width:18px;height:18px;border-radius:50%;border:2px solid rgba(255,255,255,.15);border-top-color:var(--eas-accent);animation:eas-spin .8s linear infinite}

@media (prefers-reduced-motion:reduce){
  *{scroll-behavior:auto!important}
  .reveal{opacity:1;transform:none;transition:none}
  .btn:hover{transform:none}
  .spinner{animation:none}
}

/* ╔══════════════════════════════════════════════════════════════════════════╗
   ║ 21 · UTILITIES                                                            ║
   ╚══════════════════════════════════════════════════════════════════════════╝ */

.text-mono     {font-family:var(--eas-mono)}
.text-accent   {color:var(--eas-accent)}
.text-muted    {color:var(--eas-muted)}
.text-soft     {color:var(--eas-soft)}
.text-center   {text-align:center}
.text-right    {text-align:right}
.text-nowrap   {white-space:nowrap}
.hidden        {display:none!important}
.flex          {display:flex}
.flex-col      {flex-direction:column}
.items-center  {align-items:center}
.justify-between{justify-content:space-between}
.gap-1         {gap:.5rem}
.gap-2         {gap:1rem}
.mt-1          {margin-top:.5rem}
.mt-2          {margin-top:1rem}
.mt-3          {margin-top:1.5rem}
.mb-1          {margin-bottom:.5rem}
.mb-2          {margin-bottom:1rem}
.mb-3          {margin-bottom:1.5rem}
.w-full        {width:100%}

/* ╔══════════════════════════════════════════════════════════════════════════╗
   ║ 22 · NAV DROPDOWNS (desktop ≥1021px)                                      ║
   ╚══════════════════════════════════════════════════════════════════════════╝ */

@media (min-width: 1021px) {
  .site-nav { gap: .35rem; }
  .nav-group-flat { display: inline-flex; align-items: center; }
  .nav-group-flat > .nav-group-title { display: none; }
  .nav-group:not(.nav-group-flat) {
    position: relative; display: inline-flex; align-items: center;
  }
  .nav-group:not(.nav-group-flat) > .nav-group-title {
    display: inline-flex; align-items: center; cursor: default;
    margin: 0; padding: .65rem .7rem; border-radius: 999px;
    font-family: var(--eas-font); font-size: .92rem;
    color: var(--eas-muted); font-weight: normal;
    letter-spacing: normal; text-transform: none;
  }
  .nav-group:not(.nav-group-flat) > .nav-group-title::after {
    content: "▾"; margin-left: .35rem; font-size: .68em; opacity: .6;
  }
  .nav-group:not(.nav-group-flat):hover > .nav-group-title,
  .nav-group:not(.nav-group-flat):focus-within > .nav-group-title,
  .nav-group:not(.nav-group-flat).nav-group-title-active > .nav-group-title,
  .nav-group:not(.nav-group-flat) > .nav-group-title-active {
    color: var(--eas-text); background: rgba(255,255,255,.06);
  }
  .nav-group:not(.nav-group-flat) .nav-dropdown {
    position: absolute; top: 100%; left: 0;
    min-width: 240px; background: #08161b;
    border: 1px solid rgba(255,255,255,.1); border-radius: 14px;
    padding: .4rem; box-shadow: var(--eas-shadow);
    display: flex; flex-direction: column; gap: .1rem;
    opacity: 0; pointer-events: none; transform: translateY(-4px);
    transition: opacity .14s ease, transform .14s ease; z-index: 60;
  }
  .nav-group:not(.nav-group-flat):hover .nav-dropdown,
  .nav-group:not(.nav-group-flat):focus-within .nav-dropdown {
    opacity: 1; pointer-events: auto; transform: translateY(0);
  }
  .nav-group:not(.nav-group-flat) .nav-dropdown .nav-link {
    display: block; width: 100%; padding: .65rem .8rem;
    border-radius: 10px; font-size: .9rem; white-space: nowrap;
  }
  .nav-group:nth-last-of-type(2):not(.nav-group-flat) .nav-dropdown { left: auto; right: 0; }
}

/* ╔══════════════════════════════════════════════════════════════════════════╗
   ║ 23 · RESPONSIVE BREAKPOINTS                                               ║
   ╚══════════════════════════════════════════════════════════════════════════╝ */

/* Tablet & mobile (≤1020px) */
@media (max-width: 1020px) {
  /* Marketing nav collapses to drawer */
  .site-header{backdrop-filter:none;background:var(--eas-bg)}
  .header-cta{display:none}
  .site-nav{
    position:fixed;top:78px;left:16px;right:16px;height:auto;
    max-height:calc(100vh - 94px);max-height:calc(100dvh - 94px);
    display:none;flex-direction:column;align-items:stretch;
    justify-content:flex-start;
    background:#08161b;border:1px solid rgba(255,255,255,.1);
    border-radius:20px;padding:14px;box-shadow:var(--eas-shadow);
    overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;
    gap:0;
  }
  .site-nav.open{display:flex}
  .menu-toggle{display:block}
  .nav-link{padding:.9rem;display:block;width:100%;text-align:left;border-radius:12px}

  .nav-group{display:flex;flex-direction:column;width:100%;gap:.15rem}
  .nav-group:not(.nav-group-flat) > .nav-dropdown{
    display:flex;flex-direction:column;width:100%;gap:.15rem;
  }
  .nav-group-title{
    display:block;font-family:var(--eas-mono);font-size:.68rem;
    text-transform:uppercase;letter-spacing:.2em;color:var(--eas-accent);
    margin:1.2rem 0 .5rem .35rem;opacity:.7;
    padding-left:.55rem;border-left:2px solid var(--eas-accent);
  }
  .nav-group:first-child .nav-group-title{margin-top:.2rem}
  .nav-group + .nav-group{margin-top:.85rem;padding-top:.85rem;border-top:1px solid rgba(255,255,255,.07)}

  .lang-switch{margin-left:auto;margin-right:.4rem}

  /* Diagram contain on tablet */
  .diagram-wrap img{max-width:320px;max-height:42vh;width:100%;height:auto;object-fit:contain;margin-inline:auto}
  .diagram-wrap{display:flex;justify-content:center;align-items:center;padding:1rem}

  /* Marketing grids collapse */
  .hero-grid, .split, .contact-grid{grid-template-columns:1fr}
  .card-grid, .method-grid{grid-template-columns:repeat(2,1fr)}
  .proof-grid, .footer-grid{grid-template-columns:repeat(2,1fr)}
  .hero-visual{max-width:720px}
  .cta-grid{grid-template-columns:1fr}
  .form-row{grid-template-columns:1fr}

  /* App shell collapses to single column + drawer.
     v1.3.0: footer row preserved on mobile. */
  .app-shell{
    grid-template-columns:1fr;
    grid-template-rows:var(--eas-topbar) 1fr auto;
    grid-template-areas:
      "topbar"
      "main"
      "footer";
  }
  .app-sidebar{
    position:fixed;top:0;left:0;bottom:0;width:var(--eas-sidebar);
    z-index:60;transform:translateX(-100%);transition:transform .25s ease;
    box-shadow:var(--eas-shadow);
  }
  .app-shell.sidebar-open .app-sidebar{transform:translateX(0)}
  .app-shell.sidebar-open::before{
    content:"";position:fixed;inset:0;z-index:55;
    background:rgba(5,12,16,.6);
  }
  .app-topbar-toggle{display:block}
  .app-topbar-search{display:none}
  .app-main{padding:20px 18px 40px}
  .app-footer{padding:0 16px;font-size:.66rem;gap:.6rem}
  .app-footer-right .app-footer-text-collapse{display:none}

  /* Data table dl shrinks */
  .dl-grid{grid-template-columns:1fr}
  .dl-grid dt{padding-top:0;margin-bottom:.2rem}
}

/* Mobile (≤780px) */
@media (max-width: 780px) {
  .lab-tiles{grid-template-columns:1fr}
}

/* Small mobile (≤680px) */
@media (max-width: 680px) {
  .container{width:min(100% - 28px,var(--eas-max))}
  .section-pad{padding:66px 0}
  .section-pad-sm{padding:44px 0}
  .brand small{display:none}
  .brand-mark{width:51px;height:30px}
  .hero h1{letter-spacing:-.06em}
  .card-grid, .method-grid, .proof-grid, .feature-list, .footer-grid{grid-template-columns:1fr}
  .service-card{min-height:auto}
  .hero-actions .btn{width:100%}
  .manifesto{border-radius:16px}
  .panel{padding:22px}
  .contact-form .btn{width:100%}
  .lang-switch{padding:.42rem .58rem;font-size:.72rem}
  .auth-card{padding:28px 22px}
  .page-header{flex-direction:column;align-items:flex-start}
  .toolbar{flex-direction:column;align-items:stretch}
  .toolbar input[type="search"], .toolbar select{width:100%}
  .modal{padding:22px}
}

/* ╔══════════════════════════════════════════════════════════════════════════╗
   ║ 24 · APPLICATIVE EXTENSIONS (v1.1.0)                                      ║
   ║                                                                           ║
   ║ Patterns extracted from the existing EAS applicatives during the v1.1.0   ║
   ║ migration sprint:                                                         ║
   ║   - release-runner v2.27.0                                                ║
   ║   - release-importer v1.13.8                                              ║
   ║   - api-console v2.1.6                                                    ║
   ║   - eas-registry-platform v1.5.1                                          ║
   ║                                                                           ║
   ║ All additions are strictly additive: no existing v1.0.0 selector is       ║
   ║ modified or shadowed.                                                     ║
   ╚══════════════════════════════════════════════════════════════════════════╝ */

/* ── 24.1 Toast notifications ─────────────────────────────────────────────── */
.toast-container{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);display:flex;flex-direction:column;gap:8px;z-index:1000;pointer-events:none;max-width:calc(100% - 32px);}
.toast{pointer-events:auto;padding:.8rem 1.2rem;border-radius:10px;border:1px solid var(--eas-line);background:var(--eas-panel-2);color:var(--eas-text);font-size:.92rem;font-weight:500;box-shadow:0 8px 24px rgba(0,0,0,.45);opacity:0;transform:translateY(8px);transition:opacity .2s ease, transform .2s ease;text-align:center;max-width:480px;}
.toast.is-visible{opacity:1;transform:translateY(0);}
.toast-success{background:rgba(78,197,134,.14);color:var(--eas-success);border-color:rgba(78,197,134,.40);}
.toast-danger{background:rgba(244,102,102,.14);color:var(--eas-danger);border-color:rgba(244,102,102,.40);}
.toast-warning{background:rgba(244,191,68,.14);color:var(--eas-warning);border-color:rgba(244,191,68,.40);}
.toast-info{background:rgba(120,168,255,.14);color:var(--eas-info);border-color:rgba(120,168,255,.40);}

/* ── 24.2 Drawer (mobile slide-in) ────────────────────────────────────────── */
.drawer{position:fixed;top:0;left:0;width:85%;max-width:360px;height:100vh;height:100dvh;background:var(--eas-bg-2);border-right:1px solid var(--eas-line);z-index:200;overflow-y:auto;-webkit-overflow-scrolling:touch;transform:translateX(-100%);transition:transform .25s ease;padding:1rem;padding-bottom:calc(2rem + env(safe-area-inset-bottom,0px));}
.drawer.is-open{transform:translateX(0);}
.drawer.is-right{left:auto;right:0;border-right:0;border-left:1px solid var(--eas-line);transform:translateX(100%);}
.drawer.is-right.is-open{transform:translateX(0);}
.drawer-overlay{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:150;opacity:0;pointer-events:none;transition:opacity .22s ease;}
.drawer-overlay.is-open{opacity:1;pointer-events:auto;}
.drawer-header{display:flex;align-items:center;justify-content:space-between;padding-bottom:1rem;border-bottom:1px solid var(--eas-line);margin-bottom:1rem;}
.drawer-header h2,.drawer-header h3{margin:0;color:var(--eas-text);}
.drawer-section{margin:1rem 0;}
.drawer-section h3,.drawer-section h4{font-size:11px;font-weight:700;color:var(--eas-soft);text-transform:uppercase;letter-spacing:1px;margin-bottom:.5rem;}
.drawer-actions{display:flex;gap:.3rem;flex-wrap:wrap;margin:.4rem 0;}

/* ── 24.3 Progress bar ────────────────────────────────────────────────────── */
.progress-bar{background:var(--eas-bg-2);border-radius:999px;height:6px;overflow:hidden;margin:8px 0;}
.progress-bar-fill{background:var(--eas-accent);height:100%;width:0;transition:width .3s ease;border-radius:999px;}
.progress-bar-fill.is-success{background:var(--eas-success);}
.progress-bar-fill.is-warning{background:var(--eas-warning);}
.progress-bar-fill.is-danger{background:var(--eas-danger);}
.progress-bar.is-indeterminate .progress-bar-fill{width:30%!important;animation:eas-progress-indet 1.4s infinite ease-in-out;}
@keyframes eas-progress-indet{0%{margin-left:-30%}50%{margin-left:50%}100%{margin-left:100%}}

/* ── 24.4 Stage pills (pipeline visualisation) ────────────────────────────── */
.stages{display:flex;gap:2px;margin:10px 0;overflow-x:auto;-webkit-overflow-scrolling:touch;}
.stages::-webkit-scrollbar{display:none;}
.stage-pill{flex:1;min-width:0;padding:6px 8px;background:var(--eas-bg-2);border:1px solid var(--eas-line);border-radius:6px;text-align:center;font-family:var(--eas-mono);font-size:10px;font-weight:600;color:var(--eas-soft);text-transform:uppercase;letter-spacing:.3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.stage-pill.is-done{border-color:rgba(78,197,134,.30);color:var(--eas-success);background:rgba(78,197,134,.10);}
.stage-pill.is-active{border-color:var(--eas-accent);color:var(--eas-accent);background:rgba(55,213,194,.12);animation:eas-pulse 1.6s infinite;}
.stage-pill.is-fail{border-color:rgba(244,102,102,.30);color:var(--eas-danger);background:rgba(244,102,102,.10);}
.stage-pill.is-pending{color:var(--eas-soft);}
@keyframes eas-pulse{0%,100%{opacity:1}50%{opacity:.55}}

/* ── 24.5 Status dot (small inline indicator) ─────────────────────────────── */
.status-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--eas-soft);flex-shrink:0;vertical-align:middle;}
.status-dot.is-running{background:var(--eas-success);box-shadow:0 0 6px var(--eas-success);}
.status-dot.is-stopped{background:var(--eas-danger);}
.status-dot.is-pending{background:var(--eas-warning);}
.status-dot.is-error{background:var(--eas-danger);}
.status-dot.is-pulsing{animation:eas-pulse 1.6s infinite;}

/* ── 24.6 Inline pills (method/env/user/tag-pill) ─────────────────────────── */
.pill{display:inline-flex;align-items:center;gap:.3rem;padding:.18rem .55rem;font-family:var(--eas-mono);font-size:11px;font-weight:600;border-radius:999px;background:var(--eas-bg-2);color:var(--eas-muted);border:1px solid var(--eas-line);line-height:1.35;}
.pill-accent{color:var(--eas-accent);border-color:rgba(55,213,194,.30);background:rgba(55,213,194,.10);}
.pill-info{color:var(--eas-info);border-color:rgba(120,168,255,.30);background:rgba(120,168,255,.10);}
.pill-success{color:var(--eas-success);border-color:rgba(78,197,134,.30);background:rgba(78,197,134,.10);}
.pill-warning{color:var(--eas-warning);border-color:rgba(244,191,68,.30);background:rgba(244,191,68,.10);}
.pill-danger{color:var(--eas-danger);border-color:rgba(244,102,102,.30);background:rgba(244,102,102,.10);}
.pill-empty:empty{display:none;}

/* ── 24.7 Segmented control (pill radio group) ────────────────────────────── */
.segmented{display:flex;flex-wrap:wrap;gap:2px;padding:3px;background:var(--eas-bg-2);border:1px solid var(--eas-line);border-radius:10px;}
.segmented-option{flex:1 1 auto;text-align:center;cursor:pointer;padding:.45rem .8rem;font-size:.86rem;color:var(--eas-muted);border-radius:7px;transition:background .15s, color .15s;min-width:80px;font-weight:500;}
.segmented-option input{display:none;}
.segmented-option:has(input:checked){background:var(--eas-accent);color:var(--eas-bg);font-weight:600;}
.segmented-option:hover:not(:has(input:checked)){color:var(--eas-text);background:var(--eas-panel);}

/* ── 24.8 KV editor row (key/value/delete) ────────────────────────────────── */
.kv-row{display:flex;gap:.35rem;margin:.35rem 0;align-items:center;}
.kv-row input{flex:1;min-width:0;padding:.55rem .65rem;background:var(--eas-input-bg);border:1px solid var(--eas-line);border-radius:8px;color:var(--eas-text);font:inherit;}
.kv-row input:focus{outline:none;border-color:var(--eas-accent);}
.kv-row .kv-delete{width:40px;flex-shrink:0;background:transparent;color:var(--eas-danger);border:1px solid rgba(244,102,102,.35);border-radius:8px;padding:0;font-size:1.05rem;line-height:1;cursor:pointer;height:36px;}
.kv-row .kv-delete:hover{background:rgba(244,102,102,.10);}

/* ── 24.9 File card (per-file status item) ────────────────────────────────── */
.file-card{background:var(--eas-bg-2);border:1px solid var(--eas-line);border-radius:8px;padding:10px 12px;margin-bottom:8px;transition:border-color .15s;}
.file-card.is-done{border-color:rgba(78,197,134,.40);}
.file-card.is-error{border-color:rgba(244,102,102,.40);}
.file-card.is-processing{border-color:rgba(244,191,68,.40);}
.file-card-name{font-family:var(--eas-mono);font-size:13px;color:var(--eas-text);word-break:break-all;margin-bottom:6px;}
.file-card-meta{font-size:12px;color:var(--eas-muted);margin-top:4px;}
.file-card-row{display:flex;gap:6px;align-items:center;flex-wrap:wrap;}

/* ── 24.10 Drop zone (large drag-and-drop target) ─────────────────────────── */
.drop-zone{border:2px dashed var(--eas-line);border-radius:14px;padding:32px 16px;text-align:center;color:var(--eas-muted);cursor:pointer;transition:border-color .18s, background .18s;position:relative;}
.drop-zone:hover,.drop-zone.is-hover{border-color:var(--eas-accent);background:rgba(55,213,194,.06);}
.drop-zone input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer;}
.drop-zone-icon{font-size:28px;margin-bottom:6px;color:var(--eas-accent);}
.drop-zone-label{font-size:14px;font-weight:600;color:var(--eas-text);}
.drop-zone-hint{font-size:12px;color:var(--eas-soft);margin-top:4px;}

/* ── 24.11 Log viewer (monospace output with line coloring) ───────────────── */
.log-viewer{background:var(--eas-bg);border:1px solid var(--eas-line);border-radius:10px;padding:10px 12px;font-family:var(--eas-mono);font-size:11.5px;line-height:1.55;color:var(--eas-muted);max-height:420px;overflow-y:auto;overflow-x:hidden;white-space:pre-wrap;word-break:break-all;-webkit-overflow-scrolling:touch;}
.log-line{display:block;color:var(--eas-muted);}
.log-line.is-error{color:var(--eas-danger);}
.log-line.is-warn{color:var(--eas-warning);}
.log-line.is-info{color:var(--eas-info);}
.log-line.is-success{color:var(--eas-success);}
.log-line.is-stage,.log-line.is-header{color:var(--eas-accent);font-weight:600;}

/* ── 24.12 List item / saved item (drawer entries, history rows) ──────────── */
.list-item{display:flex;align-items:center;gap:.6rem;padding:.55rem .65rem;margin:.2rem 0;background:var(--eas-bg-2);border:1px solid var(--eas-line);border-radius:8px;cursor:pointer;font-size:.85rem;transition:border-color .12s;}
.list-item:hover{border-color:var(--eas-line-soft);}
.list-item.is-active,.list-item:active{border-color:var(--eas-accent);background:rgba(55,213,194,.08);}
.list-item-label{flex:1;min-width:0;color:var(--eas-text);overflow:hidden;text-overflow:ellipsis;}
.list-item-meta{font-size:.72rem;color:var(--eas-soft);font-family:var(--eas-mono);white-space:nowrap;}
.list-item-actions{display:flex;gap:4px;flex-shrink:0;}

/* ── 24.13 Sticky top-bar (compact, for apps without sidebar) ─────────────── */
.app-topbar-compact{position:sticky;top:0;background:rgba(7,17,22,.94);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);z-index:50;display:flex;align-items:center;gap:.5rem;padding:.6rem .8rem;border-bottom:1px solid var(--eas-line);}
.app-topbar-compact .spacer{flex:1;}

/* ── 24.14 Section divider (subtle separation inside panels) ──────────────── */
.section-divider{height:1px;background:var(--eas-line);margin:1rem 0;border:0;}
.section-divider-dashed{border:0;border-top:1px dashed var(--eas-line);margin:1rem 0;}

/* ── 24.15 Hint / help inline ─────────────────────────────────────────────── */
.hint,.help-text{color:var(--eas-soft);font-size:.82rem;margin:.3rem 0;}

/* ── 24.16 Spinner inline variants ────────────────────────────────────────── */
.spinner-sm{width:12px;height:12px;border-width:2px;}
.spinner-lg{width:24px;height:24px;border-width:3px;}

/* ── 24.17 Card list with header (collapsible/expandable rows) ────────────── */
.row-card{background:var(--eas-bg-2);border:1px solid var(--eas-line);border-radius:10px;margin-bottom:.4rem;overflow:hidden;}
.row-card-header{display:flex;align-items:center;gap:.5rem;padding:.6rem .8rem;cursor:pointer;}
.row-card-header:hover{background:var(--eas-panel);}
.row-card-arrow{transition:transform .18s;color:var(--eas-soft);font-size:.85rem;}
.row-card.is-expanded .row-card-arrow{transform:rotate(90deg);}
.row-card-body{display:none;padding:0 .8rem .8rem;border-top:1px solid var(--eas-line);}
.row-card.is-expanded .row-card-body{display:block;}

/* ── 24.18 Mobile responsive for new patterns ─────────────────────────────── */
@media (max-width: 680px){
  .drawer{width:92%;max-width:none;}
  .toast-container{bottom:16px;}
  .drop-zone{padding:22px 12px;}
  .segmented{flex-direction:row;}
}

/* ╔══════════════════════════════════════════════════════════════════════════╗
   ║ 25 · GENERIC PRIMITIVES (v1.1.0)                                          ║
   ║                                                                           ║
   ║ Components every applicative might need that aren't tied to a specific    ║
   ║ EAS app pattern.                                                          ║
   ╚══════════════════════════════════════════════════════════════════════════╝ */

/* ── 25.1 Switch (toggle for booleans) ────────────────────────────────────── */
.switch{position:relative;display:inline-flex;align-items:center;gap:.55rem;cursor:pointer;user-select:none;-webkit-tap-highlight-color:transparent;}
.switch input[type=checkbox]{position:absolute;opacity:0;width:0;height:0;}
.switch-track{position:relative;width:38px;height:22px;background:var(--eas-bg-2);border:1px solid var(--eas-line);border-radius:999px;transition:background .15s, border-color .15s;flex-shrink:0;}
.switch-track::after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;background:var(--eas-muted);border-radius:50%;transition:transform .18s ease, background .15s;}
.switch input:checked + .switch-track{background:rgba(55,213,194,.18);border-color:var(--eas-accent);}
.switch input:checked + .switch-track::after{transform:translateX(16px);background:var(--eas-accent);}
.switch input:focus-visible + .switch-track{box-shadow:0 0 0 2px rgba(55,213,194,.30);}
.switch input:disabled + .switch-track{opacity:.45;cursor:not-allowed;}
.switch-label{font-size:.9rem;color:var(--eas-text);}

/* ── 25.2 Chip (removable tag) ────────────────────────────────────────────── */
.chip{display:inline-flex;align-items:center;gap:.4rem;padding:.28rem .65rem;background:var(--eas-bg-2);border:1px solid var(--eas-line);border-radius:999px;font-size:.82rem;color:var(--eas-text);line-height:1.35;}
.chip-accent{background:rgba(55,213,194,.10);border-color:rgba(55,213,194,.30);color:var(--eas-accent);}
.chip-info  {background:rgba(120,168,255,.10);border-color:rgba(120,168,255,.30);color:var(--eas-info);}
.chip-success{background:rgba(78,197,134,.10);border-color:rgba(78,197,134,.30);color:var(--eas-success);}
.chip-warning{background:rgba(244,191,68,.10);border-color:rgba(244,191,68,.30);color:var(--eas-warning);}
.chip-danger {background:rgba(244,102,102,.10);border-color:rgba(244,102,102,.30);color:var(--eas-danger);}
.chip-remove{background:transparent;border:0;color:inherit;cursor:pointer;font-size:1rem;line-height:1;padding:0;opacity:.6;}
.chip-remove:hover{opacity:1;}
.chip-set{display:flex;flex-wrap:wrap;gap:.35rem;}

/* ── 25.3 Search input (with embedded leading icon) ───────────────────────── */
.search-input{position:relative;display:flex;align-items:center;}
.search-input input{width:100%;padding:.55rem .85rem .55rem 2.1rem;background:var(--eas-input-bg);border:1px solid var(--eas-line);border-radius:8px;color:var(--eas-text);font:inherit;}
.search-input input:focus{outline:none;border-color:var(--eas-accent);box-shadow:0 0 0 2px rgba(55,213,194,.20);}
.search-input::before{content:"⌕";position:absolute;left:.7rem;top:50%;transform:translateY(-50%);color:var(--eas-soft);font-size:1rem;pointer-events:none;}
.search-input.search-input-sm input{padding:.4rem .7rem .4rem 1.85rem;font-size:.85rem;}

/* ── 25.4 Avatar (generic circular) ───────────────────────────────────────── */
.avatar{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:var(--eas-bg-2);color:var(--eas-text);font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;flex-shrink:0;overflow:hidden;border:1px solid var(--eas-line);}
.avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%;}
.avatar-sm{width:24px;height:24px;font-size:.65rem;}
.avatar-lg{width:48px;height:48px;font-size:1rem;}
.avatar-xl{width:72px;height:72px;font-size:1.4rem;}

/* ── 25.5 Count badge (number bubble next to tabs / nav items) ────────────── */
.count-badge{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 6px;background:var(--eas-accent);color:var(--eas-bg);font-family:var(--eas-mono);font-size:11px;font-weight:700;border-radius:999px;line-height:1;}
.count-badge:empty{display:none;}
.count-badge-muted{background:var(--eas-bg-2);color:var(--eas-muted);border:1px solid var(--eas-line);}
.count-badge-danger{background:var(--eas-danger);color:var(--eas-bg);}
.count-badge-warning{background:var(--eas-warning);color:var(--eas-bg);}

/* ── 25.6 Dropdown menu (context / overflow actions) ──────────────────────── */
.dropdown{position:relative;display:inline-block;}
.dropdown-menu{position:absolute;top:calc(100% + 6px);right:0;min-width:180px;padding:.35rem;background:var(--eas-panel);border:1px solid var(--eas-line);border-radius:12px;box-shadow:var(--eas-shadow-md);z-index:90;display:none;}
.dropdown.is-open .dropdown-menu{display:block;}
.dropdown-item{display:flex;align-items:center;gap:.5rem;padding:.5rem .65rem;border-radius:8px;color:var(--eas-text);cursor:pointer;font-size:.88rem;text-decoration:none;background:transparent;border:0;width:100%;text-align:left;font-family:inherit;}
.dropdown-item:hover{background:var(--eas-panel-2);color:var(--eas-accent);}
.dropdown-item.is-danger{color:var(--eas-danger);}
.dropdown-item.is-danger:hover{background:rgba(244,102,102,.10);color:var(--eas-danger);}
.dropdown-separator{height:1px;background:var(--eas-line);margin:.3rem .1rem;}
.dropdown-menu-left{right:auto;left:0;}

/* ── 25.7 Tooltip (CSS-only, hover + focus + touch via [data-tooltip-open]) ─ */
[data-tooltip]{position:relative;}
[data-tooltip]::after{content:attr(data-tooltip);position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%) translateY(4px);background:var(--eas-panel-2);color:var(--eas-text);border:1px solid var(--eas-line);border-radius:8px;padding:.35rem .6rem;font-size:.78rem;white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .14s, transform .14s;z-index:80;box-shadow:var(--eas-shadow-sm);max-width:240px;}
[data-tooltip]:hover::after,
[data-tooltip]:focus-visible::after,
[data-tooltip][data-tooltip-open]::after{opacity:1;transform:translateX(-50%) translateY(0);}

/* ── 25.8 Skeleton loader ─────────────────────────────────────────────────── */
.skeleton{display:block;background:linear-gradient(90deg, var(--eas-bg-2) 0%, var(--eas-panel) 50%, var(--eas-bg-2) 100%);background-size:200% 100%;animation:eas-skeleton 1.4s linear infinite;border-radius:6px;height:1em;}
.skeleton-text{height:.82em;margin:.35em 0;}
.skeleton-line{height:14px;margin:8px 0;}
.skeleton-block{height:80px;border-radius:10px;}
.skeleton-circle{border-radius:50%;width:32px;height:32px;}
@keyframes eas-skeleton{0%{background-position:200% 0}100%{background-position:-200% 0}}

/* ── 25.9 Pagination ──────────────────────────────────────────────────────── */
.pagination{display:flex;align-items:center;justify-content:space-between;gap:.5rem;flex-wrap:wrap;padding:.6rem 0;}
.pagination-info{font-size:.82rem;color:var(--eas-muted);font-family:var(--eas-mono);}
.pagination-controls{display:inline-flex;gap:.3rem;}
.pagination-controls .btn{min-width:36px;}
.pagination-controls .is-current{background:var(--eas-accent);color:var(--eas-bg);border-color:var(--eas-accent);}
.pagination-controls .is-current:hover{background:var(--eas-accent);color:var(--eas-bg);}

/* ── 25.10 Spacing & layout utilities ─────────────────────────────────────── */
.flex          {display:flex;}
.flex-col      {display:flex;flex-direction:column;}
.items-center  {align-items:center;}
.items-start   {align-items:flex-start;}
.items-end     {align-items:flex-end;}
.justify-between{justify-content:space-between;}
.justify-end   {justify-content:flex-end;}
.justify-center{justify-content:center;}
.gap-1{gap:.25rem;}.gap-2{gap:.5rem;}.gap-3{gap:.75rem;}.gap-4{gap:1rem;}.gap-6{gap:1.5rem;}
.p-0{padding:0;}.p-2{padding:.5rem;}.p-3{padding:.75rem;}.p-4{padding:1rem;}.p-6{padding:1.5rem;}
.mt-4{margin-top:1rem;}.mt-6{margin-top:1.5rem;}
.mb-4{margin-bottom:1rem;}.mb-6{margin-bottom:1.5rem;}
.grow{flex:1 1 auto;min-width:0;}
.shrink-0{flex-shrink:0;}
.hidden-mobile{}
.hidden-desktop{display:none;}
@media (max-width:780px){
  .hidden-mobile{display:none!important;}
  .hidden-desktop{display:initial;}
}

/* ╔══════════════════════════════════════════════════════════════════════════╗
   ║ 26 · ACCESSIBILITY & PRINT (v1.1.0)                                       ║
   ╚══════════════════════════════════════════════════════════════════════════╝ */

/* ── 26.1 Reduced motion — respect user preference ────────────────────────── */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
    transition-duration:.001ms!important;
    scroll-behavior:auto!important;
  }
  .reveal{opacity:1!important;transform:none!important;}
  .stage-pill.is-active,
  .status-dot.is-pulsing,
  .progress-bar.is-indeterminate .progress-bar-fill,
  .skeleton{animation:none!important;}
}

/* ── 26.2 Focus-visible: consistent focus ring across all interactives ────── */
.btn:focus-visible,
.app-sidebar-link:focus-visible,
.nav-link:focus-visible,
.dropdown-item:focus-visible,
.list-item:focus-visible,
[data-tab]:focus-visible,
.segmented-option:focus-within{outline:2px solid var(--eas-accent);outline-offset:2px;border-radius:8px;}

/* ── 26.3 Print stylesheet ────────────────────────────────────────────────── */
@media print{
  body{background:#fff!important;color:#000!important;}
  .site-header,.site-footer,.app-sidebar,.app-topbar,.app-topbar-compact,
  .app-footer,
  .drawer,.drawer-overlay,.toast-container,.modal-backdrop,.menu-toggle,
  .skip-link,.app-topbar-toggle{display:none!important;}
  .app-main,.container,.container-app,.container-narrow{max-width:none;padding:0;margin:0;}
  .panel,.card,.service-card,.method-step,.proof-item,.article-card,
  .lab-tile,.quote-panel{background:#fff!important;color:#000!important;border:1px solid #999!important;box-shadow:none!important;page-break-inside:avoid;}
  .btn{border:1px solid #000;background:#fff;color:#000;}
  .badge,.pill,.chip,.tag{border:1px solid #000;background:#fff;color:#000;}
  a{color:#000;text-decoration:underline;}
  pre,code{background:#f4f4f4!important;color:#000!important;border:1px solid #ccc;}
  .log-viewer{max-height:none;overflow:visible;}
}

/* ╔══════════════════════════════════════════════════════════════════════════╗
   ║ 25 · GENERIC PRIMITIVES (v1.1.0)                                          ║
   ╚══════════════════════════════════════════════════════════════════════════╝ */

/* ── 25.1 Switch (boolean toggle, larger than checkbox) ──────────────────── */
.switch{display:inline-flex;align-items:center;gap:.6rem;cursor:pointer;font-size:.9rem;color:var(--eas-text);user-select:none;}
.switch input{position:absolute;opacity:0;pointer-events:none;}
.switch-track{position:relative;width:38px;height:22px;background:var(--eas-line);border-radius:999px;transition:background .18s ease;flex-shrink:0;}
.switch-track::after{content:"";position:absolute;top:2px;left:2px;width:18px;height:18px;background:var(--eas-text);border-radius:50%;transition:left .18s ease, background .18s ease;box-shadow:0 1px 3px rgba(0,0,0,.35);}
.switch input:checked + .switch-track{background:var(--eas-accent);}
.switch input:checked + .switch-track::after{left:18px;background:var(--eas-bg);}
.switch input:focus-visible + .switch-track{outline:2px solid var(--eas-accent);outline-offset:2px;}
.switch-label{color:var(--eas-text);}

/* ── 25.2 Chip (removable tag) ────────────────────────────────────────────── */
.chip-set{display:flex;flex-wrap:wrap;gap:.4rem;}
.chip{display:inline-flex;align-items:center;gap:.35rem;padding:.25rem .55rem .25rem .7rem;background:var(--eas-bg-2);color:var(--eas-text);border:1px solid var(--eas-line);border-radius:999px;font-size:.82rem;font-weight:500;line-height:1.4;}
.chip-accent{color:var(--eas-accent);border-color:rgba(55,213,194,.30);background:rgba(55,213,194,.08);}
.chip-info{color:var(--eas-info);border-color:rgba(120,168,255,.30);background:rgba(120,168,255,.08);}
.chip-success{color:var(--eas-success);border-color:rgba(78,197,134,.30);background:rgba(78,197,134,.08);}
.chip-warning{color:var(--eas-warning);border-color:rgba(244,191,68,.30);background:rgba(244,191,68,.08);}
.chip-danger{color:var(--eas-danger);border-color:rgba(244,102,102,.30);background:rgba(244,102,102,.08);}
.chip-remove{background:transparent;border:0;color:inherit;cursor:pointer;padding:0;font-size:1.05rem;line-height:1;opacity:.65;border-radius:999px;width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center;}
.chip-remove:hover{opacity:1;background:rgba(255,255,255,.08);}

/* ── 25.3 Search input (with embedded icon) ──────────────────────────────── */
.search-input{position:relative;display:inline-block;width:100%;max-width:320px;}
.search-input input{width:100%;padding:.6rem .9rem .6rem 2rem;background:var(--eas-input-bg);border:1px solid var(--eas-line);border-radius:8px;color:var(--eas-text);font:inherit;}
.search-input input:focus{outline:none;border-color:var(--eas-accent);}
.search-input::before{content:"⌕";position:absolute;left:.65rem;top:50%;transform:translateY(-50%);color:var(--eas-soft);font-size:.95rem;pointer-events:none;}
.search-input-sm input{padding:.42rem .8rem .42rem 1.85rem;font-size:.85rem;}
.search-input-sm::before{font-size:.85rem;left:.55rem;}

/* ── 25.4 Avatar ──────────────────────────────────────────────────────────── */
.avatar{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:var(--eas-panel-2);color:var(--eas-text);font-weight:600;font-size:.78rem;text-transform:uppercase;letter-spacing:.04em;flex-shrink:0;border:1px solid var(--eas-line);overflow:hidden;}
.avatar img{width:100%;height:100%;object-fit:cover;}
.avatar-sm{width:24px;height:24px;font-size:.68rem;}
.avatar-lg{width:44px;height:44px;font-size:.95rem;}
.avatar-xl{width:64px;height:64px;font-size:1.2rem;}

/* ── 25.5 Count badge (small numeric counter, e.g. in tabs) ──────────────── */
.count-badge{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 .35rem;background:var(--eas-accent);color:var(--eas-bg);border-radius:999px;font-family:var(--eas-mono);font-size:.65rem;font-weight:700;line-height:1;}
.count-badge:empty{display:none;}
.count-badge-muted{background:var(--eas-line);color:var(--eas-muted);}
.count-badge-danger{background:var(--eas-danger);color:#fff;}
.count-badge-warning{background:var(--eas-warning);color:var(--eas-bg);}

/* ── 25.6 Dropdown menu (click-toggle) ───────────────────────────────────── */
.dropdown{position:relative;display:inline-block;}
.dropdown-menu{display:none;position:absolute;top:calc(100% + 6px);left:0;min-width:180px;background:var(--eas-panel);border:1px solid var(--eas-line);border-radius:10px;padding:.35rem;box-shadow:var(--eas-shadow-sm);z-index:60;}
.dropdown-menu-left{left:auto;right:0;}
.dropdown.is-open .dropdown-menu{display:block;}
.dropdown-item{display:flex;align-items:center;gap:.5rem;width:100%;padding:.5rem .65rem;background:transparent;border:0;border-radius:6px;color:var(--eas-text);font:inherit;text-align:left;cursor:pointer;text-decoration:none;}
.dropdown-item:hover{background:var(--eas-panel-2);color:var(--eas-text);}
.dropdown-item.is-danger{color:var(--eas-danger);}
.dropdown-item.is-danger:hover{background:rgba(244,102,102,.10);}
.dropdown-separator{height:1px;background:var(--eas-line);margin:.3rem 0;}

/* ── 25.7 Tooltip (CSS-only, [data-tooltip] attribute) ───────────────────── */
[data-tooltip]{position:relative;}
[data-tooltip]::after{content:attr(data-tooltip);position:absolute;bottom:calc(100% + 6px);left:50%;transform:translateX(-50%) translateY(4px);background:var(--eas-bg-3);color:var(--eas-text);padding:.3rem .6rem;border-radius:6px;font-size:.78rem;white-space:nowrap;border:1px solid var(--eas-line);opacity:0;pointer-events:none;transition:opacity .15s ease, transform .15s ease;z-index:70;}
[data-tooltip]:hover::after,[data-tooltip]:focus-visible::after{opacity:1;transform:translateX(-50%) translateY(0);}

/* ── 25.8 Skeleton loaders ───────────────────────────────────────────────── */
.skeleton{background:linear-gradient(90deg,var(--eas-bg-2) 0%,var(--eas-panel) 50%,var(--eas-bg-2) 100%);background-size:200% 100%;animation:eas-skeleton 1.4s linear infinite;border-radius:6px;display:block;}
.skeleton-text{height:.9rem;width:60%;margin:.3rem 0;}
.skeleton-line{height:.85rem;width:100%;margin:.3rem 0;}
.skeleton-block{height:80px;width:100%;border-radius:10px;}
.skeleton-circle{width:32px;height:32px;border-radius:50%;}
@keyframes eas-skeleton{0%{background-position:200% 0}100%{background-position:-200% 0}}

/* ── 25.9 Pagination ─────────────────────────────────────────────────────── */
.pagination{display:flex;align-items:center;justify-content:space-between;gap:.8rem;flex-wrap:wrap;margin-top:1rem;}
.pagination-info{color:var(--eas-soft);font-size:.85rem;}
.pagination-controls{display:flex;gap:.3rem;}
.pagination-controls .btn{padding:.4rem .7rem;font-size:.85rem;min-width:34px;}
.pagination-controls .btn.is-current{background:var(--eas-accent);color:var(--eas-bg);border-color:var(--eas-accent);cursor:default;}

/* ── 25.10 Utility classes ───────────────────────────────────────────────── */
.flex{display:flex;}
.flex-col{flex-direction:column;}
.items-center{align-items:center;}
.items-start{align-items:flex-start;}
.items-end{align-items:flex-end;}
.justify-center{justify-content:center;}
.justify-between{justify-content:space-between;}
.justify-end{justify-content:flex-end;}
.gap-1{gap:.25rem;}.gap-2{gap:.5rem;}.gap-3{gap:.75rem;}.gap-4{gap:1rem;}.gap-5{gap:1.25rem;}.gap-6{gap:1.5rem;}
.p-0{padding:0;}.p-1{padding:.25rem;}.p-2{padding:.5rem;}.p-3{padding:.75rem;}.p-4{padding:1rem;}.p-5{padding:1.25rem;}.p-6{padding:1.5rem;}
.mt-4{margin-top:1rem;}.mt-6{margin-top:1.5rem;}
.mb-4{margin-bottom:1rem;}.mb-6{margin-bottom:1.5rem;}
.grow{flex:1 1 auto;min-width:0;}
.shrink-0{flex-shrink:0;}
@media (max-width: 680px){
  .hidden-mobile{display:none!important;}
}
@media (min-width: 681px){
  .hidden-desktop{display:none!important;}
}

/* ╔══════════════════════════════════════════════════════════════════════════╗
   ║ 26 · ACCESSIBILITY & PRINT (v1.1.0)                                       ║
   ╚══════════════════════════════════════════════════════════════════════════╝ */

/* ── 26.1 Reduced motion ──────────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
    scroll-behavior:auto!important;
  }
  .reveal{opacity:1;transform:none;}
}

/* ── 26.2 Focus-visible (consistent 2px accent ring across interactives) ──── */
.btn:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[data-tab]:focus-visible,
.list-item:focus-visible,
.segmented-option:focus-visible,
.dropdown-item:focus-visible,
.app-sidebar-link:focus-visible,
.nav-link:focus-visible{
  outline:2px solid var(--eas-accent);
  outline-offset:2px;
}
/* Don't double-ring elements that already paint a focus ring */
input:focus-visible,
textarea:focus-visible,
select:focus-visible{outline-offset:0;}

/* ── 26.3 Print stylesheet ────────────────────────────────────────────────── */
@media print{
  body,.container-app{background:#fff!important;color:#111!important;}
  .app-sidebar,.app-topbar,.app-topbar-compact,.app-footer,.site-header,.site-footer,.menu-toggle,.drawer,.drawer-overlay,.modal-backdrop,.toast-container,.app-topbar-toggle,.lang-switch{display:none!important;}
  .app-shell{display:block;}
  .app-main{padding:0;max-width:none;}
  .panel,.card,.service-card,.article-card{background:#fff!important;color:#111!important;border:1px solid #ccc!important;box-shadow:none!important;break-inside:avoid;}
  .data-table{font-size:11pt;}
  .data-table th{background:#eee!important;color:#111!important;}
  .data-table td,.data-table th{border-color:#ccc!important;color:#111!important;}
  .log-viewer{background:#fff!important;color:#111!important;border:1px solid #ccc!important;max-height:none!important;overflow:visible!important;white-space:pre-wrap!important;}
  .badge,.pill,.chip{border:1px solid #999!important;color:#111!important;background:#fff!important;}
  a{color:#0a4!important;text-decoration:underline;}
  h1,h2,h3{color:#111!important;}
  @page{margin:18mm;}
}