/* OPTIC MM: shared foundation (fonts, tokens, controls). A sibling of the pravegcs.com system. */
@font-face{font-family:"Sora";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/sora-400.woff2") format("woff2"),url("../fonts/sora-400.woff") format("woff")}
@font-face{font-family:"Sora";font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/sora-500.woff2") format("woff2"),url("../fonts/sora-500.woff") format("woff")}
@font-face{font-family:"Sora";font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/sora-600.woff2") format("woff2"),url("../fonts/sora-600.woff") format("woff")}
@font-face{font-family:"Sora";font-style:normal;font-weight:700;font-display:swap;src:url("../fonts/sora-700.woff2") format("woff2"),url("../fonts/sora-700.woff") format("woff")}
@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/inter-400.woff2") format("woff2"),url("../fonts/inter-400.woff") format("woff")}
@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/inter-500.woff2") format("woff2"),url("../fonts/inter-500.woff") format("woff")}
@font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/inter-600.woff2") format("woff2"),url("../fonts/inter-600.woff") format("woff")}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/jbmono-400.woff2") format("woff2"),url("../fonts/jbmono-400.woff") format("woff")}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/jbmono-500.woff2") format("woff2"),url("../fonts/jbmono-500.woff") format("woff")}
@font-face{font-family:"Sora Fallback";src:local("Arial"),local("Liberation Sans"),local("Helvetica");size-adjust:116.1%;ascent-override:83.5%;descent-override:25%;line-gap-override:0%}
@font-face{font-family:"Inter Fallback";src:local("Arial"),local("Liberation Sans"),local("Helvetica");size-adjust:107.8%;ascent-override:89.9%;descent-override:22.4%;line-gap-override:0%}
@font-face{font-family:"JetBrains Mono Fallback";src:local("Courier New"),local("DejaVu Sans Mono"),local("Menlo"),local("Consolas");size-adjust:99.7%;ascent-override:102.3%;descent-override:30.1%;line-gap-override:0%}

:root{
  /* Navy system and brand marks, shared with pravegcs.com */
  --ink:#0C1A2E; --ink-2:#112740; --ink-3:#081320; --ink-card:#14304E;
  --swoosh:#00A2DF; --swoosh-d:#0488BB; --stem:#3E454F;
  --royal:#2C72C9; --royal-d:#1E4E8C; --teal:#13A9BC; --teal-d:#0B7E8D;
  --cloud:#EAF1F9; --paper:#F5F8FC; --white:#FFFFFF;
  --mist:#9DB1CC; --mist-2:#C7D5E8; --slate:#51637D; --slate-2:#33445C;
  --line-d:rgba(255,255,255,.12); --line-l:#DBE5F1;

  /* Chart roles (light surface) */
  --viz-level:#2A78D6; --viz-target:#33445C; --viz-next:#7A8BA3;
  --viz-g1:#2A78D6; --viz-g2:#EB6834; --viz-g3:#1BAF7A; --viz-g4:#EDA100;
  --seq-1:#B7D3F6; --seq-2:#86B6EF; --seq-3:#3987E5; --seq-4:#1C5CAB; --seq-5:#0D366B;
  --gap-n3:#B33A1E; --gap-n2:#C4482A; --gap-n1:#F4B39C; --gap-0:#E6EBF1; --gap-p1:#B7D3F6; --gap-p2:#5598E7;
  --ok:#0B7A3B; --ok-bg:#E3F4EA; --warn:#9A6B00; --warn-bg:#FDF1D6; --bad:#A33A2B; --bad-bg:#FADBD8;

  --display:"Sora","Sora Fallback",system-ui,sans-serif;
  --body:"Inter","Inter Fallback",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --mono:"JetBrains Mono","JetBrains Mono Fallback",ui-monospace,Consolas,monospace;

  --maxw:1180px; --pad:clamp(1.15rem,4.5vw,3.5rem);
  --r-s:8px; --r-m:14px; --r-l:22px;
  --ease:cubic-bezier(.22,.61,.36,1);
  --shadow-1:0 1px 2px rgba(8,19,32,.06),0 8px 24px rgba(8,19,32,.06);
  --shadow-2:0 30px 60px -24px rgba(8,19,32,.45);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
body{margin:0;font-family:var(--body);line-height:1.65;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,h2,h3,h4,p,ul,ol,dl,dd,figure,blockquote{margin:0}
ul,ol{padding:0;list-style:none}
img,svg,canvas{max-width:100%;display:block}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3,h4{font-family:var(--display);font-weight:600;line-height:1.1;letter-spacing:-.02em;text-wrap:balance}
p{text-wrap:pretty}
.mono{font-family:var(--mono);font-feature-settings:"zero" 1}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
[hidden]{display:none!important}
:focus-visible{outline:3px solid var(--swoosh);outline-offset:2px;border-radius:4px}
::selection{background:var(--swoosh);color:#03101C}

.skip{position:absolute;left:-999px;top:0;background:#fff;color:var(--ink);padding:.6rem 1rem;border-radius:8px;z-index:300}
.skip:focus{left:1rem;top:1rem}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font-family:var(--display);font-weight:600;font-size:.95rem;line-height:1.2;padding:.78rem 1.35rem;border-radius:999px;border:1px solid transparent;cursor:pointer;text-decoration:none;transition:transform .25s var(--ease),box-shadow .25s,background .2s,color .2s,border-color .2s}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn-primary{background:var(--swoosh);color:#04121F;box-shadow:0 10px 30px -10px rgba(0,162,223,.6)}
.btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 16px 36px -10px rgba(0,162,223,.75)}
.btn-ink{background:var(--ink);color:#fff}
.btn-ink:hover:not(:disabled){background:var(--ink-2);transform:translateY(-2px)}
.btn-ghost{border-color:var(--line-d);color:#fff;background:rgba(255,255,255,.03)}
.btn-ghost:hover:not(:disabled){border-color:var(--swoosh);color:var(--swoosh)}
.btn-line{border-color:#B9C8DB;color:var(--ink);background:#fff}
.btn-line:hover:not(:disabled){border-color:var(--royal-d);color:var(--royal-d)}
.btn-danger{border-color:#E3B4AD;color:var(--bad);background:#fff}
.btn-danger:hover:not(:disabled){background:var(--bad-bg)}
.btn-sm{padding:.45rem .9rem;font-size:.82rem}
.linkbtn{background:none;border:0;padding:0;color:var(--royal-d);text-decoration:underline;text-underline-offset:3px;cursor:pointer;font:inherit}

/* Form controls (light surfaces) */
.field{display:grid;gap:.35rem}
.field>label,.field>.lab{font-weight:600;font-size:.9rem;color:var(--ink)}
.field .hint{font-size:.82rem;color:var(--slate)}
.input,.select,.textarea{width:100%;background:#fff;border:1px solid #B9C8DB;border-radius:var(--r-s);padding:.68rem .8rem;color:var(--ink);font-size:1rem;line-height:1.4;transition:border-color .15s,box-shadow .15s}
.input:hover,.select:hover,.textarea:hover{border-color:#8FA5C0}
.input:focus,.select:focus,.textarea:focus{outline:none;border-color:var(--royal);box-shadow:0 0 0 3px rgba(44,114,201,.22)}
.textarea{min-height:5.2rem;resize:vertical}
.select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%2351637D' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .8rem center;padding-right:2.2rem}
.check{display:flex;gap:.65rem;align-items:flex-start;font-size:.93rem}
.check input{width:1.15rem;height:1.15rem;margin-top:.2rem;accent-color:var(--royal);flex:none}

.note{border-radius:var(--r-s);padding:.8rem 1rem;font-size:.92rem;background:var(--cloud);color:var(--slate-2);border-left:3px solid var(--royal)}
.note.warn{background:var(--warn-bg);color:#5C4000;border-left-color:#C28B00}
.note.bad{background:var(--bad-bg);color:#6E2219;border-left-color:var(--bad)}
.note.ok{background:var(--ok-bg);color:#0A4F28;border-left-color:var(--ok)}

.chip{display:inline-flex;align-items:center;gap:.35rem;font-family:var(--mono);font-size:.74rem;font-weight:500;padding:.2rem .55rem;border-radius:999px;background:var(--cloud);color:var(--slate-2);white-space:nowrap}
.chip.rapid{background:#E0F4FC;color:#075E80}
.chip.deep{background:#0C1A2E;color:#fff}
.chip.ok{background:var(--ok-bg);color:var(--ok)}
.chip.warn{background:var(--warn-bg);color:var(--warn)}
.chip.bad{background:var(--bad-bg);color:var(--bad)}
.chip.mute{background:#EEF2F6;color:var(--slate)}