*{box-sizing:border-box}
html,body{margin:0;height:100%}
/* Type scale: every size in this sheet is a rem, so the root carries the
   scale. 19.2px is the 16px default plus 20%; change it here and the whole
   interface follows, rather than 200 declarations. */
html{font-size:19.2px}
body{font-family:var(--font-sans);font-size:1.125rem;line-height:1.6;color:var(--brand-ink);
  background:var(--canvas);-webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;text-rendering:optimizelegibility}
h1,h2,h3{line-height:1.4;margin:0;font-weight:600}
/* Underlined, not just coloured. On a neutral palette the accent grey is
   dimmer than body text, so colour alone would make a link read as less
   important than the prose around it — and it fails entirely for anyone who
   cannot separate two greys. The underline is the affordance; the colour is
   decoration. */
a{color:var(--brand-ink);text-decoration:underline;text-underline-offset:2px;
  text-decoration-color:var(--text-muted);text-decoration-thickness:1px}
a:hover{text-decoration-color:var(--brand-ink)}

.app{display:grid;grid-template-columns:220px 1fr;min-height:100%}

/* ---------- sidebar ---------- */
.side{background:var(--side-canvas);display:flex;flex-direction:column;
  border-right:1px solid var(--border)}
.brand{display:flex;align-items:center;box-sizing:border-box;
  min-height:var(--chrome-h);padding:0 18px;
  border-bottom:1px solid rgb(255 255 255/.08)}
/* The logo file is the full lockup, so the product name is not repeated as
   text beneath it.

   Artwork sits at x=54.15 y=30.59 (585.68x237.62) inside a 698.7x300.79
   viewBox, so the negative margins cancel the file's own padding. Note the top
   and bottom padding are NOT equal in this file - 30.59 above, 32.58 below.

   Height is set so the "earth2" line renders at the same size as the previous
   lockup did: that line is ~171 viewBox units tall in both files, so the scale
   is unchanged at 39.42/328.52 and only the box around it differs.

   RE-MEASURE WITH getBBox() WHENEVER THE LOGO IS RE-EXPORTED — the viewBox has
   already changed twice (387.96 -> 328.52 -> 300.79) and these numbers derive
   from it. */
.brand .m{display:block;width:auto;height:53.96px;
  margin:-4.77px 0 -5.08px -8.45px}
.nav{padding:10px 8px;flex:1;overflow-y:auto}
.nav .grp{font-family:var(--font-sans);font-size:.75rem;font-weight:700;letter-spacing:.05em;
  color:var(--side-muted);padding:18px 10px 7px;text-transform:uppercase}
.nav .grp:first-child{padding-top:8px}
.nav a{display:block;padding:7px 10px;border-radius:var(--r-sm);color:var(--side-text);
  text-decoration:none;font-size:.8125rem}
.nav a:hover{background:rgb(255 255 255/.06);color:var(--side-ink)}
.nav a[aria-current]{background:var(--brand-primary);color:var(--on-primary);font-weight:600}
.who{padding:12px 18px;border-top:1px solid rgb(255 255 255/.08);font-size:.75rem;color:var(--side-text)}
.who b{display:block;color:var(--side-ink);font-weight:600}
.who span{font-family:var(--font-mono);font-size:.6875rem;color:var(--side-muted)}
.who .sign-out{display:block;margin-top:6px;color:var(--side-muted);text-decoration:underline}
.who .sign-out:hover{color:var(--side-ink)}

/* ---------- chrome ---------- */
.main{min-width:0;display:flex;flex-direction:column}
.top{background:var(--paper);border-bottom:1px solid var(--border);
  box-sizing:border-box;min-height:var(--chrome-h);padding:9px 28px;
  display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap}
.crumb{font-size:.75rem;color:var(--text-muted)}
.crumb b{color:var(--brand-ink);font-weight:600}
.crumb a{color:var(--text-muted);text-decoration:none}
.crumb a:hover{color:var(--brand-primary)}
.rt{display:flex;gap:16px;align-items:center}
.clocks{display:flex;gap:16px;font-family:var(--font-mono);font-size:.75rem}
.clocks span{color:var(--text-muted);font-size:.625rem;letter-spacing:.1em;
  display:block;text-transform:uppercase}
.tog{background:transparent;border:1px solid var(--border-strong);color:var(--brand-text);
  border-radius:var(--r-md);padding:5px 11px;font-family:var(--font-mono);font-size:.6875rem;
  letter-spacing:.06em;cursor:pointer;text-transform:uppercase}
.tog:hover{border-color:var(--brand-primary);color:var(--brand-primary)}
.tog:focus-visible,.mk:focus-visible,.btn:focus-visible{outline:none;
  box-shadow:0 0 0 3px var(--focus-ring)}
.content{padding:24px 28px 60px;max-width:1280px;width:100%}
/* The operation editor is a working surface: 30% wider than the reading column */
body.editor .content{max-width:1664px}

.phead{margin-bottom:18px;display:flex;justify-content:space-between;
  align-items:flex-start;gap:18px;flex-wrap:wrap}
.phead h1{font-size:1.375rem}
.phead .meta{font-family:var(--font-mono);font-size:.75rem;color:var(--text-muted);
  margin-top:4px;display:flex;gap:14px;flex-wrap:wrap}
.lede{color:var(--brand-text);font-size:.875rem;margin:0 0 18px;max-width:62ch}

/* ---------- pills ---------- */
.pill{display:inline-flex;align-items:center;gap:6px;padding:4px 11px;border-radius:999px;
  font-size:.75rem;font-weight:600;border:1px solid}
.pill::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.pill.wait{background:var(--status-caution-bg);color:var(--status-caution);
  border-color:color-mix(in srgb,var(--status-caution) 30%,transparent)}
.pill.ok{background:var(--status-clear-bg);color:var(--status-clear);
  border-color:color-mix(in srgb,var(--status-clear) 30%,transparent)}
.pill.bad{background:var(--status-blocked-bg);color:var(--status-blocked);
  border-color:color-mix(in srgb,var(--status-blocked) 30%,transparent)}
.pill.flat{background:transparent;color:var(--text-muted);border-color:var(--border-strong)}

/* ---------- strip ---------- */
.strip{display:flex;background:var(--paper);border:1px solid var(--border);
  border-radius:var(--r-lg);overflow:hidden;margin-bottom:20px;flex-wrap:wrap}
.strip div{flex:1;min-width:120px;padding:12px 16px;border-right:1px solid var(--border)}
.strip div:last-child{border-right:0}
.strip .n{font-family:var(--font-mono);font-size:1.125rem;font-weight:500}
.strip .l{font-size:.6875rem;color:var(--text-muted);letter-spacing:.06em;text-transform:uppercase}
.strip .pass .n{color:var(--status-clear)}
.strip .fail .n{color:var(--status-blocked)}
.strip .pend .n{color:var(--text-muted)}

/* ---------- card ---------- */
.card{background:var(--paper);border:1px solid var(--border);border-radius:var(--r-lg);
  margin-bottom:16px;overflow:hidden}
.chead{padding:12px 20px;border-bottom:1px solid var(--border);display:flex;
  align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.chead h2{font-size:.6875rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--text-muted);font-weight:600}
.cbody{padding:18px 20px}
.cbody.flush{padding:0}

/* ---------- table ---------- */
table.t{width:100%;border-collapse:collapse;font-size:.8125rem}
table.t th{text-align:left;font-size:.625rem;letter-spacing:.08em;text-transform:uppercase;
  color:var(--text-muted);font-weight:600;padding:10px 20px;border-bottom:1px solid var(--border)}
table.t td{padding:11px 20px;border-bottom:1px solid var(--border);vertical-align:middle}
table.t tr:last-child td{border-bottom:0}
table.t tbody tr:hover{background:var(--canvas)}
table.t .mono{font-family:var(--font-mono);font-size:.75rem}
table.t a{text-decoration:none;font-weight:600}
table.t a:hover{text-decoration:underline}

/* ---------- rows + markers ---------- */
.row{display:flex;align-items:flex-start;gap:12px;padding:13px 0;
  border-bottom:1px dashed var(--border)}
.row:first-child{padding-top:0}
.row:last-child{padding-bottom:0;border-bottom:0}
.row .body{flex:1;min-width:0}
.row .k{font-size:.8125rem;color:var(--text-muted);margin-bottom:1px}
.row .v{font-family:var(--font-mono);font-size:.875rem;word-break:break-word}
.row .v.sub{font-size:.75rem;color:var(--text-muted)}

.mk{flex:0 0 auto;width:24px;height:24px;border-radius:50%;border:1.5px solid;
  background:var(--paper);cursor:pointer;display:grid;place-items:center;
  font-family:var(--font-mono);font-size:.75rem;font-weight:500;line-height:1;padding:0;
  margin-top:2px;transition:transform .12s ease}
.mk:hover,.mk[aria-expanded=true]{transform:scale(1.1)}
.mk[data-s=pass]{border-color:var(--status-clear);color:var(--status-clear);
  background:var(--status-clear-bg)}
.mk[data-s=fail]{border-color:var(--status-blocked);color:var(--status-blocked);
  background:var(--status-blocked-bg)}
.mk[data-s=pend]{border-color:var(--border-strong);color:var(--text-muted)}
.mk.static{cursor:default}
.mk.static:hover{transform:none}

.panel{display:none;margin-top:11px;border:1px solid var(--border);
  border-radius:var(--r-md);overflow:hidden}
.panel[data-open]{display:block;animation:rv .16s ease-out}
@keyframes rv{from{opacity:0;transform:translateY(-3px)}to{opacity:1;transform:none}}
.vd{padding:13px 15px}
.vd.pass{background:var(--status-clear-bg)}
.vd.fail{background:var(--status-blocked-bg)}
.vd.pend{background:var(--canvas)}
.vd h3{font-size:.8125rem;margin-bottom:8px}
.vd.pass h3{color:var(--status-clear)}
.vd.fail h3{color:var(--status-blocked)}
table.ev{width:100%;border-collapse:collapse;font-family:var(--font-mono);font-size:.75rem}
table.ev th{text-align:left;font-weight:400;color:var(--text-muted);padding:2px 0;
  width:40%;vertical-align:top}
table.ev td{padding:2px 0;vertical-align:top}
.fix{margin-top:9px;padding-top:9px;font-size:.8125rem;
  border-top:1px solid color-mix(in srgb,currentColor 20%,transparent)}
.ext{padding:13px 15px;background:var(--paper);border-top:1px solid var(--border)}
.ext blockquote{margin:0;font-family:var(--font-serif);font-style:italic;
  font-size:.8125rem;line-height:1.75}
.ext .src{margin-top:8px;font-family:var(--font-mono);font-size:.625rem;
  color:var(--text-muted);display:flex;gap:9px;flex-wrap:wrap}

/* ---------- phases ---------- */
.phase{margin-bottom:16px}
.phase:last-child{margin-bottom:0}
.phase-h{display:flex;justify-content:space-between;align-items:baseline;
  font-size:.8125rem;font-weight:600;margin-bottom:7px}
.phase-h span{font-family:var(--font-mono);font-size:.6875rem;color:var(--text-muted);
  font-weight:400}
.steps{list-style:none;margin:0;padding:0;font-size:.8125rem}
.steps li{display:flex;align-items:center;gap:9px;padding:5px 0}
.dot{width:14px;height:14px;border-radius:50%;border:1.5px solid var(--border-strong);
  flex:0 0 auto}
.dot.done{background:var(--status-clear);border-color:var(--status-clear)}
.dot.bad{background:var(--status-blocked);border-color:var(--status-blocked)}
.steps li.muted{color:var(--text-muted)}

/* ---------- signatures ---------- */
.sigs{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.sig{border:1px solid var(--border);border-radius:var(--r-md);padding:14px}
.sig.done{border-color:color-mix(in srgb,var(--status-clear) 40%,transparent);
  background:var(--status-clear-bg)}
.sig .role{font-family:var(--font-mono);font-size:.625rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--text-muted);margin-bottom:8px}
.sig .n2{font-weight:600;font-size:.875rem}
.sig .arn{font-family:var(--font-mono);font-size:.75rem;color:var(--side-text)}
.sig .when{font-family:var(--font-mono);font-size:.6875rem;color:var(--text-muted);margin-top:8px}
.sig .waiting{color:var(--text-muted);font-size:.8125rem;font-style:italic}

.btn{display:inline-block;margin-top:10px;padding:8px 16px;border-radius:var(--r-md);
  background:var(--brand-primary-hover);color:var(--on-primary);border:0;font-family:inherit;
  font-size:.8125rem;font-weight:600;cursor:pointer;text-decoration:none}
.btn:disabled{background:var(--border-strong);cursor:not-allowed}
.btn.ghost{background:transparent;border:1px solid var(--border-strong);color:var(--brand-text)}

/* ---------- misc ---------- */
.field{margin-bottom:16px}
.field label{display:block;font-size:.8125rem;color:var(--text-muted);margin-bottom:5px}
.field input{width:100%;padding:10px 12px;border:1px solid var(--border-strong);
  border-radius:var(--r-md);font-family:var(--font-mono);font-size:.875rem;
  color:var(--brand-ink);background:var(--paper)}
.field input:focus-visible{outline:none;border-color:var(--brand-primary);
  box-shadow:0 0 0 3px var(--focus-ring)}
.note{font-size:.75rem;color:var(--text-muted);margin-top:6px}
.foot{font-size:.75rem;color:var(--text-muted);margin-top:20px;
  font-family:var(--font-mono);display:flex;gap:14px;flex-wrap:wrap}
.empty{padding:36px 20px;text-align:center;color:var(--text-muted);font-size:.875rem}


/* ---------- fleet register (rpa.html) ---------- */
.fleet{display:flex;flex-direction:column;gap:10px;padding:14px 20px}
.rpa{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1.1fr) auto;
  grid-template-areas:"id stats acts" "logs logs logs";gap:12px 16px;align-items:center;
  padding:14px 16px;border:1px solid var(--border);border-radius:var(--r-md);background:var(--canvas)}
.rpa .id{grid-area:id;min-width:0;display:flex;gap:12px;align-items:flex-start}
.rpa .fstats{grid-area:stats}
.rpa .acts{grid-area:acts;justify-self:end;display:flex;gap:2px}
.rpa .logs{grid-area:logs;display:flex;gap:8px;flex-wrap:wrap;padding-top:10px;border-top:1px solid var(--border)}
@media (min-width:1240px){
  .content.wide{max-width:1560px}
  .rpa{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) auto auto;grid-template-areas:"id stats logs acts"}
  .rpa .logs{padding-top:0;border-top:0}
}
.rpa.grounded{border-left:3px solid var(--status-blocked)}
.rpa.retired{opacity:.6}
.rpa .id .rpa-glyph{width:22px;height:22px;fill:var(--text-muted);margin-top:3px;flex:0 0 auto}
.rpa .name{font-weight:600;color:var(--brand-ink);font-size:.9375rem;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.rpa .meta{font-family:var(--font-mono);font-size:.75rem;line-height:1.5;color:var(--text-muted);margin-top:3px}
.rpa .meta b{font-weight:500;color:var(--brand-text)}
.fstats{display:grid;grid-template-columns:repeat(3,auto);gap:18px;justify-content:start}
.fstat{display:flex;flex-direction:column;gap:2px}
.fstat .k{font-family:var(--font-mono);font-size:.625rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted)}
.fstat .v{font-family:var(--font-mono);font-size:.9375rem;line-height:1.3;color:var(--brand-ink);font-variant-numeric:tabular-nums}
.fstat .v.caution{color:var(--status-caution)}
.fstat .v.blocked{color:var(--status-blocked)}
.btn.sm{padding:6px 10px;font-size:.75rem;margin-top:0;display:inline-flex;align-items:center;gap:7px}
.btn.sm.ghost{color:var(--brand-ink)}
.btn.sm svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.btn.icon{margin-top:0;padding:7px;background:transparent;border:1px solid transparent;color:var(--text-muted);line-height:0;border-radius:var(--r-md)}
.btn.icon svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.btn.icon:hover{color:var(--brand-ink);background:var(--brand-primary-subtle)}
.btn.icon.danger:hover{color:var(--status-blocked);background:var(--status-blocked-bg)}
.btn.icon:disabled{color:var(--border-strong);background:transparent;cursor:not-allowed}
.cfoot{padding:12px 20px;border-top:1px solid var(--border);color:var(--text-muted);font-size:.75rem}
.why{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:var(--r-md);
  background:var(--brand-primary-subtle);font-size:.8125rem;color:var(--brand-text);margin-bottom:18px}
.why b{color:var(--brand-ink)}
.why svg{width:16px;height:16px;flex:0 0 auto;stroke:currentColor;fill:none;stroke-width:1.8;margin-top:2px}
.field textarea.reason{border-color:var(--border-strong);background:var(--canvas)}
.chead .sub{color:var(--text-muted);font-size:.75rem;font-family:var(--font-mono)}
.chead .sp{flex:1}

/* ---------- logs page (rpa-logs.html) ---------- */
.rpahead{display:flex;gap:20px;align-items:center;flex-wrap:wrap;margin-bottom:18px}
.rpahead .kv{display:flex;gap:18px;flex-wrap:wrap;color:var(--text-muted);font-family:var(--font-mono);font-size:.8125rem;margin-top:4px}
.rpahead .sp{flex:1}
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--border);margin-bottom:16px;overflow-x:auto}
.tab{padding:10px 14px;border:0;background:transparent;color:var(--text-muted);font:inherit;font-weight:500;
  border-bottom:2px solid transparent;margin-bottom:-1px;display:flex;gap:8px;align-items:center;cursor:pointer;white-space:nowrap}
.tab[aria-selected="true"]{color:var(--brand-ink);border-bottom-color:var(--brand-ink)}
.tab:focus-visible{outline:none;box-shadow:0 0 0 3px var(--focus-ring)}
.tab .req{font-family:var(--font-mono);font-size:.5625rem;letter-spacing:.1em;padding:3px 6px;border-radius:3px;border:1px solid var(--border);color:var(--text-muted)}
.tabwrap{display:inline-flex;align-items:center;gap:2px}
.tabwrap .help{margin-right:10px}
.pane{display:none}.pane[data-active]{display:block}
.logbar{display:flex;gap:12px;align-items:center;flex-wrap:wrap;padding:12px 20px;border-bottom:1px solid var(--border)}
.logbar .src{color:var(--text-muted);font-size:.75rem;max-width:62ch}
.logbar .src b{color:var(--brand-text);font-weight:500}
.logbar .sp{flex:1}
.tw{overflow-x:auto}
table.log{border-collapse:collapse;width:100%;min-width:900px;font-size:.8125rem}
table.log th{font-family:var(--font-mono);font-size:.625rem;line-height:1.3;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);
  text-align:left;padding:10px 12px;border-bottom:1px solid var(--border);white-space:nowrap;vertical-align:bottom}
table.log td{padding:10px 12px;border-bottom:1px solid var(--border);vertical-align:top;color:var(--brand-text)}
table.log .m{font-family:var(--font-mono);font-variant-numeric:tabular-nums;white-space:nowrap}
table.log .ink{color:var(--brand-ink)}
table.log tr.total td{background:var(--canvas);font-weight:500;color:var(--brand-ink)}
table.log .lsub,.hdr .lsub{display:block;font-family:var(--font-mono);font-size:.6875rem;line-height:1.4;color:var(--text-muted);white-space:normal}
.hdr{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid var(--border)}
.hdr .c{padding:12px 20px;border-right:1px solid var(--border)}
.hdr .c:last-child{border-right:0}
.hdr .k{font-family:var(--font-mono);font-size:.625rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted);margin-bottom:4px}
.hdr .v{color:var(--brand-ink);font-family:var(--font-mono);font-size:.8125rem}
.logfoot{padding:12px 20px;font-family:var(--font-mono);font-size:.75rem;line-height:1.6;color:var(--text-muted);border-top:1px solid var(--border)}
.logfoot b{color:var(--brand-text);font-weight:500}
@media (max-width:880px){
  .rpa{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"id acts" "stats stats" "logs logs"}
  .hdr{grid-template-columns:1fr}
}

@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
@media (max-width:880px){
  .app{grid-template-columns:1fr}
  .side{flex-direction:row;align-items:center;justify-content:space-between}
  .nav,.who{display:none}
  .content,.top{padding-left:16px;padding-right:16px}
  .sigs{grid-template-columns:1fr}
  table.t th,table.t td{padding-left:14px;padding-right:14px}
}

/* ---------- section rail (capture forms) ---------- */
.split{display:grid;grid-template-columns:236px 1fr;gap:20px;align-items:start}
.rail{position:sticky;top:20px;background:var(--paper);border:1px solid var(--border);
  border-radius:var(--r-lg);overflow:hidden}
.rail-h{padding:12px 16px;border-bottom:1px solid var(--border)}
.rail-h .t{font-size:.6875rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--text-muted);font-weight:600}
.rail-h .c{font-family:var(--font-mono);font-size:.75rem;margin-top:3px}
.rail ol{list-style:none;margin:0;padding:6px}
.rail button{width:100%;display:flex;align-items:center;gap:9px;padding:8px 10px;
  border:0;background:transparent;border-radius:var(--r-sm);cursor:pointer;
  font-family:inherit;font-size:.8125rem;color:var(--brand-text);text-align:left}
.rail button:hover{background:var(--canvas);color:var(--brand-ink)}
.rail button[aria-current]{background:var(--brand-primary-subtle);color:var(--brand-primary);
  font-weight:600}
.rail button:focus-visible{outline:none;box-shadow:0 0 0 3px var(--focus-ring)}
.rail .n{font-family:var(--font-mono);font-size:.625rem;color:var(--text-muted);
  flex:0 0 auto;width:14px}
.rail .st{flex:0 0 auto;width:16px;height:16px;border-radius:50%;border:1.5px solid;
  display:grid;place-items:center;font-family:var(--font-mono);font-size:.5625rem;
  font-weight:500;line-height:1}
.rail .st[data-s=pass]{border-color:var(--status-clear);color:var(--status-clear);
  background:var(--status-clear-bg)}
.rail .st[data-s=fail]{border-color:var(--status-blocked);color:var(--status-blocked);
  background:var(--status-blocked-bg)}
.rail .st[data-s=pend]{border-color:var(--border-strong);color:var(--text-muted)}
.rail .lbl{flex:1;min-width:0}
.rail .opt{font-size:.625rem;color:var(--text-muted);font-weight:400}

.sec{display:none}
.sec[data-active]{display:block}
.sec-h{margin-bottom:4px;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.sec-h h2{font-size:1rem;font-weight:600;color:var(--brand-ink);
  letter-spacing:0;text-transform:none}
.sec-h .num{font-family:var(--font-mono);font-size:.6875rem;color:var(--text-muted)}
/* The operation name, live in the corner of every section header. Empty until
   step 01 has set one, so it takes no room before then. */
.sec-h .op-name{margin-left:auto;font-family:var(--font-mono);font-size:.6875rem;
  color:var(--text-muted);max-width:42%;white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis;text-align:right}
.sec-h .op-name:empty{display:none}
@media (max-width:720px){.sec-h .op-name{max-width:100%;margin-left:0;text-align:left}}
.sec-sub{font-size:.8125rem;color:var(--text-muted);margin:0 0 18px}

.grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
/* a labelled rule between the parts of a section (Aircraft | Pilot) */
.subsep{display:flex;align-items:center;gap:12px;margin:22px 0 12px;font-family:var(--font-mono);font-size:.625rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted)}
.subsep::after{content:"";flex:1;border-top:1px solid var(--border)}
.subsep:first-of-type{margin-top:6px}
.field textarea{width:100%;padding:10px 12px;border:1px solid var(--border-strong);
  border-radius:var(--r-md);font-family:var(--font-mono);font-size:.8125rem;
  color:var(--brand-ink);background:var(--paper);min-height:78px;resize:vertical}
.field select{width:100%;appearance:none;-webkit-appearance:none;
  padding:10px 34px 10px 12px;border:1px solid var(--border-strong);
  border-radius:var(--r-md);font-family:inherit;font-size:.875rem;line-height:1.4;
  color:var(--brand-ink);background:var(--paper)
  url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23888' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E")
  no-repeat right 12px center}
/* A native date or time field carries a platform-drawn indicator inside the
   box. Without a matching height it renders shorter than a text field beside
   it. The date fields on the new-operation screen are text inputs by the time
   this could apply to them (see styles/pickers.js); the time fields, which
   are still the browser's own control, are what this is for. */
.field input[type=date],.field input[type=time],.field input.hhmm{min-height:42px}
.field input.hhmm.bad{border-color:var(--status-blocked)}
.field textarea:focus-visible,.field select:focus-visible{outline:none;
  border-color:var(--brand-primary);box-shadow:0 0 0 3px var(--focus-ring)}
/* The .field select, sized for living inside a table row. The closed control
   takes the app's skin; the open menu is the browser's own and always will be. */
.select-inline{appearance:none;-webkit-appearance:none;margin-right:10px;
  padding:7px 30px 7px 12px;
  border:1px solid var(--border-strong);border-radius:var(--r-md);font-family:inherit;
  font-size:.8125rem;color:var(--brand-ink);background:var(--paper)
  url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23888' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E")
  no-repeat right 11px center}
.select-inline:focus-visible{outline:none;border-color:var(--brand-primary);
  box-shadow:0 0 0 3px var(--focus-ring)}
.field .req{color:var(--status-blocked)}
.derived{background:var(--canvas);color:var(--text-muted)}
.tagrow{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:8px}
.repeat{border:1px solid var(--border);border-radius:var(--r-md);padding:12px;
  margin-bottom:8px}
.repeat .grid3{display:grid;grid-template-columns:minmax(140px,1fr) minmax(120px,1fr) 2fr;gap:10px}  /* name, role/number, then the long cell */
.toggle{display:flex;justify-content:space-between;align-items:center;gap:14px;
  border:1px solid var(--border);border-radius:var(--r-md);padding:12px 14px;margin-bottom:16px}
.toggle .lbl2{font-size:.875rem;font-weight:600}
.toggle .d{font-size:.75rem;color:var(--text-muted)}
.sw{width:40px;height:22px;border-radius:999px;background:var(--border-strong);
  border:0;cursor:pointer;position:relative;flex:0 0 auto}
.sw::after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;
  border-radius:50%;background:var(--paper);transition:left .14s ease}
.sw[aria-pressed=true]{background:var(--brand-primary)}
.sw[aria-pressed=true]::after{left:21px}
.navbtns{display:flex;justify-content:space-between;gap:12px;margin-top:20px}
.upload{border:1px dashed var(--border-strong);border-radius:var(--r-md);
  padding:20px;text-align:center;color:var(--text-muted);font-size:.8125rem}

@media (max-width:880px){
  .split{grid-template-columns:1fr}
  .rail{position:static}
  .rail ol{display:flex;overflow-x:auto;padding:6px 6px 8px}
  .rail button{width:auto;white-space:nowrap}
  .grid2,.repeat .grid3{grid-template-columns:1fr}
  .repeat-head{display:none}
}

/* tabular figures — Inter aligns digits when asked */
.mono,.v,table.ev,table.t .mono,.clocks,.rail .c,.strip .n{font-variant-numeric:tabular-nums}

/* ---------- grouped rail ---------- */
.rail .phase-lbl{font-family:var(--font-sans);font-size:.875rem;font-weight:600;
  letter-spacing:0;text-transform:none;color:var(--brand-ink);padding:16px 12px 8px;
  display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.rail .phase-lbl b{font-family:var(--font-mono);font-weight:400;font-size:.6875rem;
  color:var(--text-muted);font-variant-numeric:tabular-nums}
.rail li+.phase-lbl{border-top:1px solid var(--border);margin-top:8px}
.rail ol > li:first-child.phase-lbl{padding-top:10px}

/* ---------- places autocomplete ---------- */
.ac{position:relative}
.ac-list{position:absolute;top:calc(100% + 4px);left:0;right:0;z-index:20;
  background:var(--paper);border:1px solid var(--border-strong);border-radius:var(--r-md);
  box-shadow:0 8px 24px rgb(0 0 0/.28);overflow:hidden;display:none}
.ac-list[data-open]{display:block}
.ac-list button{display:block;width:100%;text-align:left;border:0;background:transparent;
  padding:9px 12px;cursor:pointer;font-family:inherit;font-size:.8125rem;color:var(--brand-ink)}
.ac-list button:hover,.ac-list button:focus-visible{background:var(--canvas);outline:none}
.ac-list .m2{font-weight:600}
.ac-list .s2{font-size:.75rem;color:var(--text-muted)}
.ac-attr{padding:7px 12px;border-top:1px solid var(--border);font-size:.625rem;
  color:var(--text-muted);font-family:var(--font-mono)}

/* ---------- checklist with per-item note ---------- */
.chk{border:1px solid var(--border);border-radius:var(--r-md);overflow:hidden}
.chk-item{padding:10px 12px;border-bottom:1px solid var(--border)}
.chk-item:last-child{border-bottom:0}
.chk-top{display:flex;align-items:flex-start;gap:10px}
.chk-top input[type=checkbox]{width:16px;height:16px;margin:3px 0 0;accent-color:var(--brand-primary);
  flex:0 0 auto;cursor:pointer}
.chk-top label{flex:1;font-size:.8125rem;cursor:pointer;color:var(--brand-ink)}
.chk-pre{font-family:var(--font-mono);font-size:.5625rem;letter-spacing:.08em;text-transform:uppercase;
  color:var(--brand-primary);border:1px solid currentColor;border-radius:var(--r-sm);
  padding:1px 5px;flex:0 0 auto;margin-top:2px}
.chk-note{margin:7px 0 0 26px}
.chk-note input{width:100%;padding:6px 9px;border:1px solid var(--border);border-radius:var(--r-sm);
  font-family:inherit;font-size:.75rem;color:var(--brand-ink);background:var(--canvas)}
.chk-note input:focus-visible{outline:none;border-color:var(--brand-primary)}
.chk-item input[type=checkbox]:checked ~ label{color:var(--text-muted)}
.chk-stamp{font-family:var(--font-mono);font-size:.625rem;color:var(--status-clear);
  margin:5px 0 0 26px;display:none}
.chk-item.ticked .chk-stamp{display:block}

/* ---------- signature pad ---------- */
.sigpad{border:1px solid var(--border);border-radius:var(--r-md);padding:13px}
.sigpad .role{font-family:var(--font-mono);font-size:.625rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--text-muted);margin-bottom:8px}
.pad{border:1px dashed var(--border-strong);border-radius:var(--r-sm);background:var(--canvas);
  height:96px;position:relative;cursor:crosshair;touch-action:none;overflow:hidden}
.pad svg{position:absolute;inset:0;width:100%;height:100%}
.pad .ph{position:absolute;inset:0;display:grid;place-items:center;font-size:.75rem;
  color:var(--text-muted);font-style:italic;pointer-events:none}
.pad.signed .ph{display:none}
.sig-meta{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:8px;
  font-family:var(--font-mono);font-size:.625rem;color:var(--text-muted);flex-wrap:wrap}
.sig-meta button{background:transparent;border:0;color:var(--brand-primary);cursor:pointer;
  font-family:inherit;font-size:.625rem}
.sig-meta .sig-actions{display:inline-flex;gap:8px;align-items:center}
.sig-meta .sig-actions .btn.sm{font-family:var(--font-sans);font-size:.75rem;color:var(--brand-ink);margin:0}
.sig-meta .sig-actions .btn.sm:hover{border-color:var(--brand-primary);color:var(--brand-primary)}
.sig-bytes{color:var(--status-clear)}

/* ---------- review banner ---------- */
.banner{border:1px solid color-mix(in srgb,var(--status-caution) 35%,transparent);
  background:var(--status-caution-bg);border-radius:var(--r-md);padding:14px 16px;margin-bottom:18px}
.banner h3{font-size:.875rem;color:var(--status-caution);margin-bottom:8px}
.banner .jump{display:flex;flex-wrap:wrap;gap:6px 14px}
.banner .jump button{background:transparent;border:0;padding:0;cursor:pointer;font-family:inherit;
  font-size:.8125rem;color:var(--status-caution);text-decoration:underline}
.rev-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.rev{border:1px solid var(--border);border-radius:var(--r-md);padding:14px}
.rev .rh{display:flex;justify-content:space-between;align-items:center;margin-bottom:11px}
.rev .rh h4{font-size:.6875rem;letter-spacing:.09em;text-transform:uppercase;color:var(--text-muted);
  font-weight:600;margin:0}
.rev .rh button{background:transparent;border:0;color:var(--brand-primary);cursor:pointer;
  font-size:.75rem;font-family:inherit}
.rev dl{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0}
.rev dt{font-size:.625rem;letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted)}
.rev dd{margin:2px 0 0;font-family:var(--font-mono);font-size:.8125rem}
.rev dd.missing{color:var(--status-caution);font-family:var(--font-sans);font-style:italic}
@media (max-width:880px){.rev-grid{grid-template-columns:1fr}}

/* ---------- modal ---------- */
.modal{position:fixed;inset:0;z-index:100;background:rgb(6 14 19/.72);
  display:none;padding:24px;overflow-y:auto}
.modal[data-open]{display:grid;place-items:start center;animation:fade .14s ease-out}
@keyframes fade{from{opacity:0}to{opacity:1}}
.modal-box{background:var(--paper);border:1px solid var(--border);border-radius:var(--r-lg);
  width:100%;max-width:660px;margin:auto;box-shadow:0 24px 64px rgb(0 0 0/.45)}
.modal-box.wide{max-width:860px}
.modal-h{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;
  padding:18px 22px;border-bottom:1px solid var(--border)}
.modal-h h2{font-size:1rem;font-weight:600;color:var(--brand-ink);text-transform:none;letter-spacing:0}
.modal-h p{margin:3px 0 0;font-size:.8125rem;color:var(--text-muted)}
.modal-h button{background:transparent;border:0;color:var(--text-muted);cursor:pointer;
  font-size:1.125rem;line-height:1;padding:2px 4px}
.modal-h button:hover{color:var(--brand-ink)}
.modal-b{padding:20px 22px}
.modal-f{padding:16px 22px;border-top:1px solid var(--border);display:flex;
  justify-content:flex-end;gap:10px}
.fieldset{margin-bottom:20px}
.fieldset > legend, .fs-h{font-family:var(--font-mono);font-size:.5625rem;letter-spacing:.13em;
  text-transform:uppercase;color:var(--text-muted);padding:0 0 9px;display:block;width:100%;
  border-bottom:1px solid var(--border);margin-bottom:14px}
.grid3c{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}
.advanced{display:none}
.advanced[data-open]{display:block}
.optgrid{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.optgrid label{display:flex;align-items:center;gap:9px;border:1px solid var(--border);
  border-radius:var(--r-md);padding:9px 12px;font-size:.8125rem;cursor:pointer}
.optgrid label:hover{border-color:var(--border-strong)}
/* The help pip sits at the end of the row, and its popup must escape the
   label's own box rather than stretching it. */
.optgrid label{position:relative}
.optgrid label .help{margin-left:auto}
.optgrid label .hp{left:auto;right:-8px}
/* The declaration block stacks label over description, so its help pip sits
   beside the label rather than at the end of a flex row. */
.declare{position:relative}
.declare .help{position:absolute;top:14px;right:14px}
.declare .help .hp{left:auto;right:-8px}
/* A wide popup for content that is a list rather than a sentence: two
   columns turn six lines into three and halve the height. */
.help .hp.wide{width:min(620px, 78vw)}
/* a term that opens its explanation: the help mechanism on a word instead of a ring */
.help.term{width:auto;height:auto;border:0;border-radius:0;font:inherit;color:inherit;
  text-decoration:underline dotted;text-underline-offset:3px;display:inline;padding:0}
.help.term:hover,.help.term[aria-expanded=true]{color:var(--brand-primary)}
.help.term .hp{top:1.6em;text-transform:none;letter-spacing:0;font-family:var(--font-sans)}
.help .hp .imsafe{display:grid;grid-template-columns:1fr 1fr;gap:6px 18px;margin:9px 0 2px}
.help .hp .imsafe i{font-style:normal;font-weight:700;color:var(--brand-ink)}
@media (max-width:700px){
  .help .hp.wide{width:min(340px, 86vw)}
  .help .hp .imsafe{grid-template-columns:1fr}
}
.optgrid input{accent-color:var(--brand-primary);width:15px;height:15px}
.declare{display:flex;gap:11px;align-items:flex-start;border:1px solid var(--border);
  border-radius:var(--r-md);padding:13px}
.declare input{accent-color:var(--brand-primary);width:16px;height:16px;margin-top:2px;flex:0 0 auto}
.declare .dt{font-size:.8125rem;color:var(--brand-ink)}
.declare .dd{font-size:.75rem;color:var(--text-muted);margin-top:3px}

/* ---------- help ? ---------- */
.help{position:relative;width:16px;height:16px;border-radius:50%;flex:0 0 auto;
  border:1px solid var(--border-strong);background:transparent;color:var(--text-muted);
  font-family:var(--font-mono);font-size:.625rem;line-height:1;cursor:pointer;padding:0;
  display:inline-grid;place-items:center;vertical-align:middle}
.help:hover,.help[aria-expanded=true]{border-color:var(--brand-primary);color:var(--brand-primary)}
.help .hp{display:none;position:absolute;top:22px;left:-8px;z-index:40;width:350px;max-width:min(350px,calc(100vw - 32px));
  background:var(--paper);border:1px solid var(--border-strong);border-radius:var(--r-md);
  box-shadow:0 10px 28px rgb(0 0 0/.32);padding:11px 13px;text-align:left;
  font-family:var(--font-sans);font-size:.75rem;color:var(--brand-text);line-height:1.55;
  cursor:default;white-space:normal}
.help[aria-expanded=true] .hp{display:block}
.help .hp b{color:var(--brand-ink);display:block;margin-bottom:3px;font-size:.75rem}
.help .hp .cite2{margin-top:7px;font-family:var(--font-mono);font-size:.625rem;
  color:var(--text-muted)}
.field label{display:flex;align-items:center;gap:7px}

/* ---------- misc ---------- */
.linkbtn{background:transparent;border:0;color:var(--brand-ink);cursor:pointer;
  text-decoration:underline;text-underline-offset:2px;text-decoration-color:var(--text-muted);
  font-family:inherit;font-size:.75rem;padding:0}
.linkbtn:hover{text-decoration:underline}
.rm{background:transparent;border:0;color:var(--status-blocked);cursor:pointer;
  font-family:inherit;font-size:.6875rem;margin-top:8px;padding:0}
.toast{position:fixed;left:50%;bottom:26px;transform:translate(-50%,14px);z-index:200;
  background:var(--brand-ink);color:var(--paper);padding:10px 18px;border-radius:999px;
  font-size:.8125rem;opacity:0;transition:opacity .18s,transform .18s;pointer-events:none}
.toast[data-in]{opacity:1;transform:translate(-50%,0)}
[data-theme=dark] .toast{background:var(--brand-ink);color:var(--canvas)}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin-bottom:18px}
.stat{background:var(--paper);border:1px solid var(--border);border-radius:var(--r-lg);padding:14px 16px}
.stat .l{font-family:var(--font-mono);font-size:.5625rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--text-muted)}
.stat .n{font-size:1.5rem;font-weight:600;margin-top:4px;font-variant-numeric:tabular-nums}
@media (max-width:880px){.grid3c,.optgrid{grid-template-columns:1fr}.modal{padding:12px}}

/* ---------- template editor ---------- */
.tpl{border:1px solid var(--border);border-radius:var(--r-lg);padding:14px 16px;margin-bottom:12px;
  display:flex;justify-content:space-between;align-items:flex-start;gap:16px;background:var(--paper)}
.tpl h3{font-size:.9375rem;font-weight:600;margin:0 0 4px;display:flex;align-items:center;
  gap:9px;flex-wrap:wrap}
.tpl .meta2{font-family:var(--font-mono);font-size:.6875rem;color:var(--text-muted);
  display:flex;gap:12px;flex-wrap:wrap;margin-bottom:5px}
.tpl p{margin:0;font-size:.8125rem;color:var(--brand-text);max-width:70ch}
.tpl .acts{display:flex;gap:4px;flex:0 0 auto}
.tpl .acts button{background:transparent;border:1px solid var(--border);border-radius:var(--r-sm);
  color:var(--text-muted);cursor:pointer;font-family:var(--font-mono);font-size:.625rem;padding:5px 9px}
.tpl .acts button:hover{border-color:var(--brand-primary);color:var(--brand-primary)}
.item{border:1px solid var(--border);border-radius:var(--r-md);padding:11px;margin-bottom:9px;
  background:var(--canvas)}
.item-top{display:flex;gap:9px;align-items:center}
.grip{color:var(--text-muted);cursor:grab;font-size:.875rem;flex:0 0 auto;user-select:none}
.item-top input{flex:1;min-width:0}
.item-top select{width:140px;flex:0 0 auto}
.item-top .del{background:transparent;border:0;color:var(--status-blocked);cursor:pointer;
  font-size:.875rem;flex:0 0 auto;padding:0 4px}
.item textarea{width:100%;margin-top:8px;min-height:46px;font-family:var(--font-sans);
  font-size:.75rem;padding:8px 10px;border:1px solid var(--border);border-radius:var(--r-sm);
  color:var(--brand-text);background:var(--paper);resize:vertical}
.item[data-crit=critical]{border-left:3px solid var(--status-blocked)}
.item[data-crit=non-critical]{border-left:3px solid var(--status-caution)}
.item[data-crit=optional]{border-left:3px solid var(--border-strong)}

/* ---------- drop zone ---------- */
.drop{border:1px dashed var(--border-strong);border-radius:var(--r-md);padding:22px;
  text-align:center;color:var(--text-muted);font-size:.8125rem;transition:border-color .14s,background .14s}
.drop.over{border-color:var(--brand-primary);background:var(--brand-primary-subtle);
  color:var(--brand-primary)}
.drop .browse{color:var(--brand-primary);text-decoration:underline;cursor:pointer}
.drop input[type=file]{display:none}
.filelist{margin-top:12px}
.fileitem{display:flex;align-items:center;gap:11px;border:1px solid var(--border);
  border-radius:var(--r-md);padding:10px 12px;margin-bottom:8px;background:var(--canvas)}
.fileitem .fn{flex:1;min-width:0;font-size:.8125rem;overflow:hidden;text-overflow:ellipsis;
  white-space:nowrap}
.fileitem .fs{font-family:var(--font-mono);font-size:.6875rem;color:var(--text-muted);flex:0 0 auto}
.bar{height:3px;background:var(--border);border-radius:2px;overflow:hidden;margin-top:6px}
.bar i{display:block;height:100%;width:0;background:var(--brand-primary);transition:width .25s}
.fileitem[data-done] .bar i{background:var(--status-clear);width:100%}
.fkey{font-family:var(--font-mono);font-size:.625rem;color:var(--text-muted);margin-top:5px;
  word-break:break-all}

/* ==========================================================================
   Menu icons — Font Awesome 4.7, from the Unify vendor tree.

   Fixed-width so the labels align down the column regardless of glyph shape,
   and dimmed slightly so the icon supports the word rather than competing with
   it. The active item lifts to full opacity along with its label.
   ========================================================================== */

.nav a { display: flex; align-items: center; gap: 10px; }
.nav a .fa { width: 16px; flex: 0 0 auto; font-size: .875rem; opacity: .75;
  text-align: center; }
.nav a:hover .fa, .nav a[aria-current] .fa { opacity: 1; }

/* The RPA register uses a drawn quadcopter rather than Font Awesome's
   fixed-wing `plane`. FA 4.7 has no drone glyph — `fa-drone` is Pro only — and
   a fixed-wing icon on a multirotor register reads wrong to a pilot. */
.nav a .rpa-glyph { width: 16px; height: 16px; flex: 0 0 auto; opacity: .75;
  fill: currentColor; }
.nav a:hover .rpa-glyph, .nav a[aria-current] .rpa-glyph { opacity: 1; }

/* ---------- fields the sample did not need ---------- */

/* Read-only fields carry a derived value — a coordinate from a Places lookup,
   an ARN from the licence register. They are dimmed rather than disabled: the
   value still has to be legible in a screenshot of a completed form. */
input[readonly], textarea[readonly], .derived {
  background: var(--canvas);
  color: var(--text-muted);
  cursor: default;
}

/* Chrome paints autofilled fields with an internal !important rule that an
   ordinary background declaration cannot override. An inset shadow can. */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus {
  -webkit-text-fill-color: var(--text-primary);
  -webkit-box-shadow: 0 0 0 1000px var(--paper) inset;
  box-shadow: 0 0 0 1000px var(--paper) inset;
  caret-color: var(--text-primary);
  transition: background-color 9999s ease-in-out 0s;
}
input[readonly]:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 1000px var(--canvas) inset;
  box-shadow: 0 0 0 1000px var(--canvas) inset;
}

/* ---------- states the sample had no data for ---------- */

.loading { color: var(--text-muted); font-size: .8125rem; padding: 4px 0; }
.t td.empty, .empty { padding: 30px 20px; text-align: center;
  color: var(--text-muted); font-size: .875rem; }
.err { color: var(--status-blocked); font-size: .8125rem; }

/* ---------- date and time pickers (styles/pickers.js) ----------
   The native input stays; what is replaced is the popup the browser would
   have drawn. The layout follows the Unify datepicker the marketing site
   uses — month title between two arrows, seven columns, today marked — and
   the popup itself borrows .ac-list's skin so every overlay in the app reads
   as the same object. */
.pk-wrap{position:relative;display:block}
.pk-wrap input{padding-right:36px}

.pk-btn{position:absolute;top:1px;right:1px;bottom:1px;width:34px;display:flex;
  align-items:center;justify-content:center;border:0;background:transparent;
  color:var(--text-muted);cursor:pointer;border-radius:0 var(--r-md) var(--r-md) 0}
.pk-btn:hover{color:var(--brand-ink)}

.pk{position:absolute;top:calc(100% + 4px);left:0;z-index:30;
  background:var(--paper);border:1px solid var(--border-strong);
  border-radius:var(--r-md);box-shadow:0 8px 24px rgb(0 0 0/.28)}
.pk-date{width:252px;padding:10px}
.pk-head{display:flex;align-items:center;justify-content:space-between;
  padding-bottom:8px;margin-bottom:6px;border-bottom:1px solid var(--border)}
.pk-title{font-size:.8125rem;font-weight:600;color:var(--brand-ink)}
.pk-nav{width:26px;height:26px;border:0;background:transparent;cursor:pointer;
  color:var(--text-muted);font-size:1rem;line-height:1;border-radius:var(--r-md)}
.pk-nav:hover{background:var(--canvas);color:var(--brand-ink)}
.pk-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.pk-dow span{text-align:center;font-size:.625rem;letter-spacing:.04em;
  color:var(--text-muted);font-family:var(--font-mono);padding:4px 0}
.pk-day{height:28px;border:0;border-radius:var(--r-md);background:transparent;
  cursor:pointer;font-family:var(--font-mono);font-size:.75rem;color:var(--brand-ink)}
.pk-day:hover:not(:disabled){background:var(--canvas)}
.pk-day.is-out{color:var(--text-muted);opacity:.55}
.pk-day:disabled{opacity:.25;cursor:not-allowed}
/* Today is a ring, the chosen day is filled: the two can coincide without
   either becoming invisible. */
.pk-day.is-today{box-shadow:inset 0 0 0 1px var(--border-strong)}
.pk-day.is-cursor{box-shadow:inset 0 0 0 1px var(--brand-primary)}
.pk-day.is-sel{background:var(--brand-primary);color:var(--on-primary);font-weight:600}
.pk-foot{display:flex;justify-content:space-between;margin-top:8px;
  padding-top:8px;border-top:1px solid var(--border)}
.pk-link{border:0;background:transparent;cursor:pointer;padding:2px 4px;
  font-family:inherit;font-size:.75rem;color:var(--brand-primary)}
.pk-link:hover{text-decoration:underline}

/* read-only here means "the browser's own picker is off", not "derived": these
   fields are still the operator's to set, so they keep a live field's skin
   rather than the dimmed one the read-only rule above gives a derived value. */
.pk-wrap input[readonly]{background:var(--paper);color:var(--brand-ink);cursor:pointer}

/* chart links (e2r-airspace): sheets that cover the site, opened on Airservices' site */
.chart-links{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.chart-links a{font-size:.75rem;padding:4px 10px;border:1px solid var(--border-strong);border-radius:999px;
  color:var(--brand-primary);text-decoration:none;background:var(--surface)}
.chart-links a:hover{background:var(--brand-primary-subtle)}
.chart-links a.edge{border-style:dashed}
.chart-links a.index{color:var(--text-muted)}
.chart-warn{flex-basis:100%;font-size:.72rem;color:var(--text-muted)}
.chart-attest{display:flex;gap:8px;align-items:flex-start;font-size:.8125rem;margin-top:10px;cursor:pointer}
.chart-attest input{margin-top:2px}

/* site check (screen 06) */
.grid3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px}
@media (max-width:720px){.grid3{grid-template-columns:1fr}}
.sc-rows{margin-top:6px}
.sc-row{border:1px solid var(--border);border-radius:var(--r-md);margin-bottom:12px;overflow:hidden}
.sc-head{display:flex;align-items:center;gap:12px;padding:12px 14px;background:var(--canvas)}
.sc-head .k{flex:1;font-weight:600;font-size:.9375rem}
.sc-head .sc-verdict{width:auto;min-width:130px;padding:6px 30px 6px 10px;font-size:.8125rem}
.sc-body{padding:12px 14px 4px}
.sc-body .note{margin:0 0 10px}
.sc-table{width:100%;border-collapse:collapse;margin:6px 0 8px;font-size:.8125rem}
.sc-table th{text-align:left;font-weight:500;color:var(--text-muted);padding:4px 6px;border-bottom:1px solid var(--border)}
.sc-table td{padding:4px 6px}
.sc-table input,.sc-table select{width:100%;padding:7px 8px;border:1px solid var(--border-strong);border-radius:6px;background:var(--surface);color:inherit;font-size:.8125rem}
.sc-table td:last-child{width:34px}
.sc-table th:nth-child(3),.sc-table td:nth-child(3){min-width:150px}
.sc-table th:nth-child(4),.sc-table td:nth-child(4){width:90px}
.sc-del{border:0;background:transparent;color:var(--text-muted);font-size:1.1rem;cursor:pointer}
.sc-add{margin:0 0 8px;padding:6px 12px;font-size:.8125rem}
.sc-none{display:flex;gap:8px;align-items:flex-start;font-size:.8125rem;margin:6px 0 10px;cursor:pointer}
.sc-none input{margin-top:2px}
.sc-suggest{font-size:.75rem;color:var(--brand-primary);margin:0 0 10px}
.mk[data-s=warn]{border-color:var(--status-caution);color:var(--status-caution)}

/* nearby landing sites (OpenStreetMap candidates) */
.site-list{margin-top:6px}
.site-item{font-size:.8125rem;padding:4px 0;border-bottom:1px dashed var(--border)}
.site-item:last-child{border-bottom:0}
.site-name{font-weight:600}
.site-meta{color:var(--text-muted);margin:0 6px}
.site-item a{font-size:.75rem;color:var(--brand-primary)}
.sc-osm{border:1px dashed var(--border-strong);border-radius:var(--r-md);padding:8px 12px;margin:0 0 10px}
.sc-osm .note{margin:0 0 4px}
.sc-osm .sc-add{margin:8px 0 2px}
.notam-fetch{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 6px}
.notam-fetch .sc-add{margin:0}
.notam-fetch .note{margin:0}
/* ---------- in progress: the ring spins, no glyph; the text alongside gets a small ring ---------- */
@keyframes e2r-spin{to{transform:rotate(360deg)}}
.mk[data-s=busy]{border-color:var(--border-strong);border-top-color:var(--brand-primary);color:transparent;animation:e2r-spin .9s linear infinite}
.mk[data-s=busy]:hover{transform:none}
.busy::before,.mk[data-s=busy]+.body .sub:first-of-type::before{content:"";display:inline-block;width:.75em;height:.75em;margin:0 .45em -.05em 0;border-radius:50%;border:1.5px solid var(--border-strong);border-top-color:var(--brand-primary);animation:e2r-spin .9s linear infinite;vertical-align:baseline}
@media (prefers-reduced-motion:reduce){.mk[data-s=busy],.busy::before,.mk[data-s=busy]+.body .sub:first-of-type::before{animation-duration:2.4s}}

/* site conditions (screen 07) */
.cond-facts{margin-top:8px;display:grid;gap:4px}
.cond-facts .cf{font-size:.875rem;color:var(--text)}
.cond-facts .cf.sub{color:var(--text-muted);font-size:.8125rem}

/* what3words under the coordinates */
.w3w{display:inline-block;font-family:var(--mono,ui-monospace,monospace);font-size:.8125rem}
.field input#launch-w3w.bad{border-color:var(--status-blocked)}
.w3w a{color:var(--brand-text);text-decoration:none;border-bottom:1px dotted currentColor}
.w3w.muted{color:var(--text-muted);font-family:inherit}
.w3w[hidden]{display:none}
.sc-head .sc-vhelp .hp{left:auto;right:-8px}
.sc-head .sc-vhelp .hp b{margin-top:6px}
.sc-head .sc-vhelp .hp b:first-child{margin-top:0}
#m-bands .modal-box.wide{max-width:min(1100px,96vw)}
#m-bands .zoombar{display:flex;align-items:center;gap:8px;margin:0 0 10px}
#m-bands .zoombar .s{font-size:.75rem;color:var(--text-muted);margin-right:4px}
#m-bands .zoombar .btn{padding:4px 10px;min-width:34px}
#m-bands .zoomwrap{overflow:auto;max-height:min(70vh,760px);border-radius:8px;background:#15181e}
#m-bands .zoomwrap img{display:block;width:100%;height:auto}
/* A bubble that would run past the bottom of the viewport opens upwards instead;
   one that would run off the right edge aligns to the button's right. (app.js sets the classes) */
.help .hp.up{top:auto;bottom:22px}
.help .hp.left{left:auto;right:-8px}
.card.help-open{overflow:visible}
/* evidence attached to a site-check row */
.sc-evidence{margin:8px 0 4px}
.sc-evidence .ev-list{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 8px}
.sc-evidence .ev-item{width:132px;font-size:.6875rem;color:var(--text-muted);position:relative}
.sc-evidence .ev-item .thumb{display:block;width:132px;height:92px;object-fit:cover;border:1px solid var(--border);border-radius:var(--r-md);background:var(--canvas);cursor:zoom-in}
.sc-evidence .ev-item .doc{display:grid;place-items:center;width:132px;height:92px;border:1px solid var(--border);border-radius:var(--r-md);background:var(--canvas);font-family:var(--font-mono);font-size:.75rem;color:var(--brand-ink);cursor:pointer}
.sc-evidence .ev-item .cap{display:block;margin-top:4px;line-height:1.3;word-break:break-word}
.sc-evidence .ev-item.superseded .thumb,.sc-evidence .ev-item.superseded .doc{opacity:.4}
.sc-evidence .ev-item .sup{position:absolute;top:4px;left:4px;background:var(--paper);border:1px solid var(--border);border-radius:4px;padding:1px 5px;font-size:.625rem}
.sc-evidence .ev-item .rep{display:block;margin-top:2px}
.sc-evidence .ev-btn{display:inline-block}
.sc-evidence .ev-btn input{display:none}
.sc-evidence .ev-status{font-size:.75rem;color:var(--text-muted);margin:4px 0 0}
#m-evidence .modal-box.wide{max-width:min(1200px,96vw)}
#m-evidence img{display:block;max-width:100%;max-height:78vh;margin:0 auto;border-radius:8px}

/* Operation pack panel (screen 12): the three PDF buttons and the packs exported so far */
.packs{margin-top:20px;border-top:1px solid var(--border);padding-top:16px}
.packs h4{font-size:.875rem;margin-bottom:4px}
.packs .pk-btns{display:flex;flex-wrap:wrap;gap:10px;margin:6px 0 4px}
.packs .pk-btns .btn{margin-top:0;display:inline-flex;align-items:center;gap:8px;position:relative}
.packs .pk-btns .btn svg{width:16px;height:16px;flex:none}
.packs .pk-btns .btn .help{margin-left:2px}
.packs table.t{margin-top:10px}
.packs .pk-status,#documents .pk-status{font-size:.75rem;color:var(--text-muted);margin-top:6px;min-height:1em}
.packs .pk-status.bad,#documents .pk-status.bad{color:var(--status-blocked)}
.packs .pk-status.wait::before,#documents .pk-status.wait::before{content:"";display:inline-block;width:10px;height:10px;border:2px solid var(--border-strong);border-top-color:var(--brand-text);border-radius:50%;margin-right:6px;vertical-align:-1px;animation:pkspin .8s linear infinite}
@keyframes pkspin{to{transform:rotate(360deg)}}
.packs .pk-empty{font-size:.8125rem;color:var(--text-muted);padding:10px 0}
.packs .pk-fail{color:var(--status-blocked)}

.opt-lbl{font-size:.625rem;color:var(--text-muted);font-weight:400;text-transform:uppercase;letter-spacing:.06em;margin-left:4px}
#site-photos .sc-evidence{margin-top:6px}
.chead .pk-status{margin-top:0;margin-left:auto;text-align:right}
.pk-status .pk-prog{height:6px;border-radius:3px;background:var(--border);overflow:hidden;margin:4px 0 6px;max-width:420px}
.pk-status .pk-prog .bar{height:100%;background:var(--brand-primary);border-radius:3px;transition:width .9s linear}
.pk-status.wait::before{display:none}
.pk-status.ok,#documents .pk-status.ok{color:var(--status-clear)}
.chead .pk-status{max-width:50%}
.chead .pk-status .pk-prog{margin-left:auto}
table.t tr.pk-new td{background:var(--status-clear-bg)}

.mk[data-s=waived]{border-color:var(--brand-primary);color:var(--brand-primary);font-weight:700}

/* JSA items: note textarea, on-site validation row, missing-evidence flag */
.chk-item .chk-note textarea{width:100%;min-height:52px;font-size:.8125rem}
.chk-item .chk-need{font-size:.6875rem;color:var(--status-blocked);margin-top:3px}
.chk-item.needs-note .chk-top label{color:var(--status-blocked)}
.chk-item .chk-onsite{display:flex;align-items:center;gap:8px;margin-top:6px;font-size:.8125rem;color:var(--text-muted)}
.chk-item .chk-onsite label{margin:0;font-size:.8125rem}
.chk-item .chk-stamp.onsite{font-family:var(--font-mono);font-size:.6875rem;color:var(--status-clear)}
.chk-item .sc-evidence{margin:6px 0 2px}
.chk-item .sc-evidence .ev-btn{padding:4px 10px;font-size:.75rem}

/* Risk assessment worksheet (OM Appendix 3 Table 4) */
.risk-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:var(--r-md)}
table.risk{width:100%;min-width:1180px;border-collapse:collapse;font-size:.75rem}
table.risk th{font-size:.625rem;letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted);text-align:left;padding:8px 6px;border-bottom:1px solid var(--border-strong);background:var(--canvas);white-space:nowrap}
table.risk td{padding:6px;border-bottom:1px solid var(--border);vertical-align:top}
table.risk textarea{width:100%;min-width:150px;min-height:44px;font-size:.75rem;padding:4px 6px;resize:vertical}
table.risk td:nth-child(3) textarea,table.risk td:nth-child(5) textarea,table.risk td:nth-child(9) textarea{min-width:190px}
table.risk select{font-size:.75rem;padding:3px 4px;min-width:46px}
table.risk tr.unconfirmed td{background:color-mix(in srgb,var(--status-caution) 7%,transparent)}
table.risk tr.not-permitted td{background:color-mix(in srgb,var(--status-blocked) 8%,transparent)}
table.risk .seed{font-size:.625rem;color:var(--text-muted);margin-top:3px;line-height:1.3}
table.risk .seed.bad{color:var(--status-blocked);font-weight:600}
table.risk .confirm{display:flex;align-items:center;gap:5px;font-size:.6875rem;white-space:nowrap}
table.risk .risk-act{min-width:110px}
.band{display:inline-block;min-width:26px;text-align:center;padding:2px 7px;border-radius:999px;font-family:var(--font-mono);font-weight:700;font-size:.75rem;border:1px solid var(--border-strong)}
.band.low{background:var(--status-clear-bg);color:var(--status-clear);border-color:transparent}
.band.medium{background:var(--status-caution-bg);color:var(--status-caution);border-color:transparent}
.band.high,.band.extreme{background:var(--status-blocked-bg);color:var(--status-blocked);border-color:transparent}
.band.extreme{outline:2px solid var(--status-blocked)}
.risk-foot{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-top:8px}
.risk-foot .btn{margin-top:0}
.risk-foot .note.bad{color:var(--status-blocked)} .risk-foot .note.warn{color:var(--status-caution)}
details.risk-tables{border:1px solid var(--border);border-radius:var(--r-md);padding:8px 14px;margin:0 0 16px}
details.risk-tables summary{cursor:pointer;font-size:.8125rem;font-weight:600}
details.risk-tables h4{font-size:.75rem;margin:10px 0 4px;text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted)}
details.risk-tables table.ev th{width:28px;font-family:var(--font-mono);font-weight:700;color:var(--brand-ink)}

table.risk select.theme{min-width:130px}
table.risk th.grp{text-align:center;border-bottom:1px solid var(--border);letter-spacing:.04em;text-transform:none;font-style:italic}
table.risk thead tr:nth-child(2) th{border-bottom:1px solid var(--border-strong)}
table.risk th .help{display:inline-grid;vertical-align:middle;margin-left:2px}

/* site-check notes: a textarea that grows as it is typed into */
.site-check textarea.sc-note,.sc-row textarea.sc-note,textarea.sc-note{width:100%;min-height:58px;resize:vertical;font-family:var(--font-mono);font-size:.8125rem;line-height:1.45}

.ersa-tag{display:inline-block;margin-left:6px;padding:1px 6px;border:1px solid var(--border-strong);border-radius:4px;font-family:var(--font-mono);font-size:.625rem;color:var(--text-muted);vertical-align:middle}
#sc-fields td:nth-child(3){white-space:nowrap}
#sc-fields td:nth-child(3) .type-cell{display:flex;align-items:center;gap:6px}
#sc-fields select[data-f=type]{min-width:210px;width:auto;flex:1}
#sc-fields .ersa-tag{margin-left:0;flex:none}
#sc-fields td:nth-child(1){min-width:200px} #sc-fields td:nth-child(5){min-width:160px}

.sc-table th .help{display:inline-grid;vertical-align:middle;margin-left:3px}
.sc-table th .hp{font-weight:400;color:var(--text);text-transform:none;letter-spacing:0}
.sc-table input,.sc-table select{height:38px;box-sizing:border-box;line-height:1.2}
.sc-table select{padding-top:0;padding-bottom:0}
#sc-fields .ersa-tag{height:38px;box-sizing:border-box;display:inline-flex;align-items:center;padding:0 9px;border-radius:6px;font-size:.6875rem}

.banner ul.save-fail{margin:6px 0 0 18px;font-size:.8125rem;line-height:1.5}

.rail [data-go].unsaved .lbl::after{content:'\25CF';color:var(--status-caution);font-size:.6rem;margin-left:6px;vertical-align:middle}

.ev-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.ev-pick{margin:8px 0 4px;border:1px solid var(--border);border-radius:var(--r-md);padding:8px;display:flex;flex-direction:column;gap:6px;max-height:260px;overflow:auto}
.ev-choice{text-align:left;background:var(--surface-2,transparent);border:1px solid var(--border);border-radius:var(--r-sm,6px);padding:6px 10px;cursor:pointer;color:inherit;font:inherit}
.ev-choice:hover{border-color:var(--border-strong)}
.ev-choice-name{display:block;font-weight:600}
.ev-choice-meta{display:block;font-size:.75rem;color:var(--text-muted)}

.site-map{margin:6px 0 8px}
.site-map.pair{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:10px;max-width:1300px}
.site-map img{display:block;width:100%;aspect-ratio:8/5;object-fit:cover;border:1px solid var(--border);border-radius:var(--r-md);background:var(--canvas);cursor:zoom-in}
#site-map-note{margin:6px 0 12px}
#site-map-field .ev-actions .help{width:18px;height:18px;font-size:.6875rem;margin-left:4px}

.map-key{display:flex;flex-wrap:wrap;gap:6px 18px;align-items:center;margin:8px 0 2px;font-size:.8125rem;color:var(--text-muted)}
.map-key span{display:inline-flex;align-items:center;gap:6px}
.map-key .pin{display:inline-grid;place-items:center;width:18px;height:18px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);color:#fff;font:700 .6875rem/1 var(--font-sans,inherit)}
.map-key .pin>*{transform:rotate(45deg)}
.map-key .pin{text-indent:0}
.map-key .pin.c{background:#e0432f}.map-key .pin.a{background:#3c9d3c}.map-key .pin.o{background:#2f6fe0}
.map-key .ring{display:inline-block;width:16px;height:16px;border-radius:50%;border:2px solid #1e6fff;background:rgba(30,111,255,.2)}
.sc-evidence .ev-sup-toggle{align-self:flex-end;font-size:.6875rem;color:var(--text-muted);margin-bottom:4px}
.pk-status .pk-abort{margin-left:10px;font-size:.75rem}

.pk-share-row td{padding-top:0!important;border-top:0!important}
.pk-share{margin:6px 0 10px;border:1px solid var(--border);border-radius:var(--r-md);padding:12px 14px;background:var(--surface-2,transparent)}
.pk-share-head{margin-bottom:8px;font-size:.875rem}
.pk-share-fields{display:grid;grid-template-columns:minmax(220px,1fr) 2fr;gap:10px;margin-bottom:10px}
.pk-share-fields label{display:flex;flex-direction:column;justify-content:flex-end;font-size:.8125rem;color:var(--text-muted)}
.pk-share-fields input{display:block;width:100%;margin-top:6px;padding:10px 12px;font-size:.9375rem;line-height:1.3}
.pk-share-btns{display:flex;gap:8px;flex-wrap:wrap}
.pk-share-result{margin-top:10px;font-size:.875rem}
.pk-share-result.bad{color:var(--danger,#d44)}
.pk-share-link{display:flex;gap:8px;margin-top:6px;align-items:center}
.pk-share-link input{flex:1;font-family:var(--font-mono);font-size:.75rem}
@media (max-width:720px){.pk-share-fields{grid-template-columns:1fr}}

.pk-shares{font-size:.8125rem;color:var(--text);margin:2px 0 6px}
.pk-share-line{padding:4px 0}
.pk-share-line .mono{font-family:var(--font-mono);font-size:.75rem}
.pk-opens{margin:2px 0 0 14px;font-size:.75rem;color:var(--text-muted)}
.pk-open{display:block}

.sc-figure-wrap{margin:10px 0 4px}
.sc-figure{margin:8px 0 4px;border:1px solid var(--border);border-radius:var(--r-md);background:#fff;padding:6px;max-width:720px}
.sc-figure svg{display:block;width:100%;height:auto}

.repeat-head{display:grid;grid-template-columns:minmax(140px,1fr) minmax(120px,1fr) 2fr;gap:10px;padding:0 12px 4px;font-size:.75rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.04em}

.pk-open-more{margin-left:8px;font-size:.75rem}
#m-share-open .modal-box{max-width:720px}
.so-h{margin:16px 0 6px;font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted)}
.so-h:first-child{margin-top:0}
.so-t{width:100%;border-collapse:collapse;font-size:.875rem}
.so-t th{width:34%;text-align:left;font-weight:500;color:var(--text-muted);padding:6px 10px 6px 0;vertical-align:top;border-bottom:1px solid var(--border)}
.so-t td{padding:6px 0;border-bottom:1px solid var(--border);word-break:break-word}
.so-t td.mono{font-family:var(--font-mono);font-size:.8125rem}
.so-t td.small{font-size:.75rem}
.so-pill{display:inline-block;margin-left:6px;padding:1px 8px;border-radius:10px;font-size:.6875rem;border:1px solid var(--border);color:var(--text-muted)}
.so-pill.ok{border-color:#3c9d3c;color:#3c9d3c}.so-pill.warn{border-color:#d08a1c;color:#d08a1c}

.pk-stop{margin-left:8px;font-size:.75rem;color:#e0432f}
.pk-stopped{display:inline-block;margin-left:6px;padding:1px 8px;border-radius:10px;font-size:.6875rem;border:1px solid #b42318;color:#e0432f}
.so-foot{display:flex;gap:14px;align-items:center;justify-content:space-between;margin-top:18px;padding-top:14px;border-top:1px solid var(--border);font-size:.8125rem}
.so-stop{background:#b42318;border-color:#b42318;color:#fff;white-space:nowrap}
.so-stop:hover{background:#912018}
