/* ship.octis.one, design A "Control room". Every colour is a token; dark is the default, light follows the system
   until the person picks one (data-theme on <html>, kept in the ship_theme cookie). */
:root{--bg:#0B1026;--pn:#121A38;--pn2:#18224A;--ln:#243058;--ln2:#33416F;--tx:#F3F6FC;--tx2:#AEBAD2;--tx3:#8E9CBA;--ac:#00D4FF;--ac-ink:#03141F;--ac-tx:#00D4FF;--ac-soft:rgba(0,212,255,.12);--wa:#F97316;--wa-tx:#FB8A3C;--wa-soft:rgba(249,115,22,.13);--er:#FF5A5A;--er-tx:#FF7A7A;--er-soft:rgba(255,90,90,.12);--grid:rgba(124,141,181,.075);--bar:#26315C;
--pt:#18214A;--pl:#121A3B;--pr:#0D1431;--pe:#4A5B8E;--bt:#34416C;--bl:#2A3556;--br:#1F2946;--be:#7C8DB5;--at:#0B5A75;--al:#08455B;--ar:#063445;--wt:#45291A;--wl:#371F12;--wr:#2B180D;--et:#4A1C26;--el:#3A151D;--er2:#2C1016;--dt:#1C2547;--dl:#161E3C;--dr:#111833;--de:#56669A;--rail:#1A2450;--sd:inline-flex;--sl:none;color-scheme:dark}
@media (prefers-color-scheme: light){:root:not([data-theme=dark]){--bg:#EDF1F7;--pn:#FFFFFF;--pn2:#F5F7FB;--ln:#D6DEEA;--ln2:#C3CEDD;--tx:#0E1628;--tx2:#44516A;--tx3:#56637A;--ac:#0E7490;--ac-ink:#FFFFFF;--ac-tx:#0B6680;--ac-soft:rgba(14,116,144,.09);--wa:#C2410C;--wa-tx:#A9380A;--wa-soft:#FFF1E6;--er:#B91C1C;--er-tx:#B91C1C;--er-soft:#FDECEC;--grid:rgba(30,50,90,.055);--bar:#E1E7F0;
--pt:#F9FBFE;--pl:#E3E9F1;--pr:#D2DAE6;--pe:#94A3BC;--bt:#FFFFFF;--bl:#E7ECF3;--br:#D3DBE6;--be:#6F7F9C;--at:#D0F0F7;--al:#A7DEEA;--ar:#84CDDD;--wt:#FDE8D4;--wl:#F8D0AA;--wr:#F0B886;--et:#FCE3E3;--el:#F6C7C7;--er2:#EFAAAA;--dt:#F3F6FA;--dl:#E9EEF4;--dr:#DEE5EE;--de:#B3BFD1;--rail:#DDE4EE;--sd:none;--sl:inline-flex;color-scheme:light}}
:root[data-theme=light]{--bg:#EDF1F7;--pn:#FFFFFF;--pn2:#F5F7FB;--ln:#D6DEEA;--ln2:#C3CEDD;--tx:#0E1628;--tx2:#44516A;--tx3:#56637A;--ac:#0E7490;--ac-ink:#FFFFFF;--ac-tx:#0B6680;--ac-soft:rgba(14,116,144,.09);--wa:#C2410C;--wa-tx:#A9380A;--wa-soft:#FFF1E6;--er:#B91C1C;--er-tx:#B91C1C;--er-soft:#FDECEC;--grid:rgba(30,50,90,.055);--bar:#E1E7F0;
--pt:#F9FBFE;--pl:#E3E9F1;--pr:#D2DAE6;--pe:#94A3BC;--bt:#FFFFFF;--bl:#E7ECF3;--br:#D3DBE6;--be:#6F7F9C;--at:#D0F0F7;--al:#A7DEEA;--ar:#84CDDD;--wt:#FDE8D4;--wl:#F8D0AA;--wr:#F0B886;--et:#FCE3E3;--el:#F6C7C7;--er2:#EFAAAA;--dt:#F3F6FA;--dl:#E9EEF4;--dr:#DEE5EE;--de:#B3BFD1;--rail:#DDE4EE;--sd:none;--sl:inline-flex;color-scheme:light}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;background:var(--bg)}
body{margin:0;min-height:100vh;background:var(--bg);color:var(--tx);font:14px/1.5 Inter,"Noto Sans SC","Noto Sans CJK SC","PingFang SC","Microsoft YaHei",system-ui,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
button{font:inherit;color:inherit;margin:0}
::selection{background:var(--ac);color:var(--ac-ink)}
a{color:var(--ac-tx);text-underline-offset:3px}
:focus-visible{outline:2px solid var(--ac);outline-offset:2px;border-radius:8px}
h1,h2,h3,p{margin:0}
pre{margin:0;padding:12px 14px;background:var(--bg);border:1px solid var(--ln);border-radius:10px;overflow:auto;font:12.5px/1.5 "JetBrains Mono",ui-monospace,Menlo,monospace;color:var(--tx2);white-space:pre-wrap;word-break:break-word;max-height:420px}
.mono{font-family:"JetBrains Mono",ui-monospace,Menlo,monospace;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.t2{color:var(--tx2)}.t3{color:var(--tx3)}.act{color:var(--ac-tx)}.wat{color:var(--wa-tx)}.ert{color:var(--er-tx)}
.h1{font-size:28px;line-height:1.25;font-weight:700;letter-spacing:-.02em}
.h2{font-size:18px;line-height:1.35;font-weight:650;letter-spacing:-.01em}
.h3{font-size:15px;font-weight:650}
.lbl{font-size:13px;color:var(--tx2)}
.big{font-size:20px;font-weight:650;line-height:1.35}
.clamp1{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.clamp2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pn{background:var(--pn);border:1px solid var(--ln);border-radius:14px}
.pad{padding:22px 24px}
.stack{display:flex;flex-direction:column;gap:14px}
.empty{color:var(--tx2)}

/* header */
.hd{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:64px;padding:0 24px;border-bottom:1px solid var(--ln);background:var(--pn)}
.hl{display:flex;align-items:center;min-width:0}
.brand{display:flex;align-items:baseline;gap:10px;color:var(--tx);text-decoration:none;white-space:nowrap}
.brand b{font-size:18px;font-weight:700;letter-spacing:-.02em}
.brand span{font-size:13px;color:var(--tx2)}
.nav{display:flex;gap:4px;margin-left:28px}
.nav a,.menu a{display:flex;align-items:center;height:44px;padding:0 14px;border-radius:10px;color:var(--tx2);text-decoration:none;font-weight:500;white-space:nowrap}
.nav a.on{color:var(--tx);background:var(--pn2);box-shadow:inset 0 0 0 1px var(--ln)}
.nav a:hover,.menu a:hover{color:var(--tx)}
.tools{display:flex;align-items:center;gap:10px}
.conn{display:flex;align-items:center;gap:8px;height:44px;padding:0 12px;color:var(--tx2);font-size:13px;white-space:nowrap}
.conn.off{color:var(--wa-tx)}
.dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--tx3);box-shadow:0 0 0 3px var(--ln);flex:none}
.conn .dot{background:var(--tx2)}
.conn.off .dot,.dot.wa{background:var(--wa);box-shadow:0 0 0 3px var(--wa-soft)}
.dot.ok{background:var(--tx2)}.dot.run{background:var(--ac);box-shadow:0 0 0 3px var(--ac-soft)}.dot.bad{background:var(--er);box-shadow:0 0 0 3px var(--er-soft)}
.refresh{display:none!important}
.conn.off+.refresh{display:inline-flex!important}
.refresh.busy svg{animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.segs{display:flex;padding:3px;border-radius:12px;background:var(--bg);border:1px solid var(--ln)}
.seg{display:flex;align-items:center;justify-content:center;height:38px;min-width:52px;padding:0 12px;border-radius:9px;color:var(--tx2);font-weight:500;text-decoration:none}
.seg.on{background:var(--pn2);color:var(--tx);box-shadow:inset 0 0 0 1px var(--ln2)}
.ls{display:none}
.th-d{display:var(--sd);align-items:center;gap:8px}.th-l{display:var(--sl);align-items:center;gap:8px}
.more{position:relative}
.more summary{list-style:none}
.more summary::-webkit-details-marker{display:none}
.more .dots{font-weight:700;letter-spacing:1px}
.more .menu{position:absolute;right:0;top:52px;z-index:30;min-width:200px;padding:6px;background:var(--pn);border:1px solid var(--ln2);border-radius:12px;box-shadow:0 18px 40px -18px rgba(0,0,0,.5);display:flex;flex-direction:column}
.menu-nav{display:none;flex-direction:column;border-bottom:1px solid var(--ln);margin-bottom:6px;padding-bottom:6px}
.menu a.on{color:var(--tx);background:var(--pn2)}
.menu form{margin:0}
.menu button{width:100%;height:44px;padding:0 14px;border:0;border-radius:10px;background:none;text-align:left;color:var(--tx2);font-weight:500;cursor:pointer}
.menu button:hover{color:var(--tx);background:var(--pn2)}

/* buttons: one primary per screen, the rest quiet */
.ibtn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;min-width:44px;padding:0 14px;border-radius:12px;border:1px solid var(--ln);background:var(--pn);color:var(--tx);cursor:pointer;font-weight:500;text-decoration:none;white-space:nowrap}
.ibtn:hover{border-color:var(--ln2);background:var(--pn2)}
.ibtn.danger{color:var(--er-tx);border-color:var(--er-soft)}
.ibtn svg{flex:none}
.pbtn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:52px;padding:0 26px;border-radius:12px;border:0;background:var(--ac);color:var(--ac-ink);font-weight:700;font-size:16px;cursor:pointer;text-decoration:none;box-shadow:0 6px 20px -8px var(--ac);white-space:nowrap}
.pbtn:hover{filter:brightness(1.08)}
.pbtn.danger{background:var(--er);color:#fff;box-shadow:0 6px 20px -8px var(--er)}
.pbtn[disabled],.pbtn[aria-disabled=true]{background:var(--bar);color:var(--tx3);box-shadow:none;cursor:not-allowed;filter:none}
.qbtn{display:inline-flex;align-items:center;height:44px;padding:0 6px;border:0;background:none;color:var(--tx2);font-weight:500;cursor:pointer;text-decoration:underline;text-decoration-color:var(--ln2);text-underline-offset:4px;white-space:nowrap}
.qbtn:hover{color:var(--tx)}
.acts{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.acts.end{justify-content:flex-end}

/* small parts */
.chip{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 9px;border-radius:7px;background:var(--pn2);border:1px solid var(--ln);font-size:12.5px;color:var(--tx2);white-space:nowrap}
.chip.wa{background:var(--wa-soft);border-color:transparent;color:var(--wa-tx)}
.chip.ac{background:var(--ac-soft);border-color:transparent;color:var(--ac-tx)}
.chip.er{background:var(--er-soft);border-color:transparent;color:var(--er-tx)}
.chip.id{color:var(--tx)}
.sq{display:inline-block;width:8px;height:8px;border-radius:2px;background:var(--tx3);flex:none}
.sq.ac{background:var(--ac)}.sq.wa{background:var(--wa)}.sq.er{background:var(--er);border-radius:50%}
.tri{fill:var(--wa)}
.bar{height:4px;border-radius:2px;background:var(--bar);overflow:hidden}
.bar i{display:block;height:100%;background:var(--tx3);border-radius:2px}
.bar.ac i{background:var(--ac)}.bar.wa i{background:var(--wa)}.bar.er i{background:var(--er)}
details.ids>summary,details.danger>summary{cursor:pointer;color:var(--tx2);min-height:44px;display:flex;align-items:center;gap:8px}
details.ids[open]>summary{margin-bottom:8px}
details.danger{border-top:1px solid var(--ln);padding-top:6px}
details.danger[open]{display:flex;flex-direction:column;gap:12px;align-items:flex-start}
ul.plain{margin:0;padding-left:18px;color:var(--tx2);display:flex;flex-direction:column;gap:4px}
ol.steps{margin:0;padding-left:0;list-style:none;display:flex;flex-direction:column;gap:6px}
ol.steps li{display:flex;gap:10px;align-items:baseline}
ol.steps li::before{content:"";width:8px;height:8px;border-radius:2px;background:var(--tx3);flex:none;transform:translateY(-1px)}
ol.steps li.bad::before{background:var(--er);border-radius:50%}
.kv{display:grid;grid-template-columns:140px minmax(0,1fr);gap:14px;align-items:baseline}
.blocked{padding:12px 14px;border-radius:10px;background:var(--er-soft);color:var(--er-tx)}
.blocked ul{margin:6px 0 0;padding-left:18px}
.errcard pre{color:var(--er-tx)}
.lead{display:flex;flex-direction:column;gap:18px;align-items:flex-start;max-width:640px}

/* lists of rows */
.list{overflow:hidden}
.list .ph{padding:16px 22px;border-bottom:1px solid var(--ln)}
.crow{display:flex;align-items:center;gap:14px;min-height:60px;padding:10px 22px;border-top:1px solid var(--ln);color:var(--tx);text-decoration:none}
.ph+.crow,.crow:first-child{border-top:0}
a.crow:hover{background:var(--pn2)}
.crow.static{padding:10px 0}
.cmain{display:flex;flex-direction:column;min-width:0;flex:1}
.cmain b{font-weight:550}
.cmeta{display:flex;align-items:center;gap:10px;flex:none;font-size:13px}

/* the one action row: sticks to the bottom of the screen */
.actbar{position:sticky;bottom:0;z-index:20;padding:0 24px 20px;pointer-events:none}
.actin{pointer-events:auto;max-width:1392px;margin:0 auto;display:flex;align-items:center;justify-content:flex-end;gap:16px;flex-wrap:wrap;padding:14px 16px 14px 24px;background:var(--pn);border:1px solid var(--ln2);border-radius:14px;box-shadow:0 -10px 30px -18px rgba(0,0,0,.45)}
.actin .note{margin-right:auto;color:var(--tx2)}
form.confirm{display:flex;flex-direction:column;gap:12px;width:100%}
.reason{display:flex;flex-direction:column;gap:6px;color:var(--tx2);font-size:13px}
textarea{font:inherit;color:var(--tx);background:var(--bg);border:1px solid var(--ln2);border-radius:10px;padding:10px 12px;resize:vertical}

main{max-width:1440px;margin:0 auto;padding:20px 24px 24px;display:flex;flex-direction:column;gap:16px}

/* the isometric scene: shared by home, drill, change and job pages */
.scene{position:relative;background-color:var(--bg);background-image:repeating-linear-gradient(30deg,var(--grid) 0 1px,transparent 1px 28px),repeating-linear-gradient(150deg,var(--grid) 0 1px,transparent 1px 28px)}
.iso{display:block}
.iso polygon,.iso path,.iso ellipse{stroke-linejoin:round}
.kp .t{fill:var(--pt)}.kp .l{fill:var(--pl)}.kp .r{fill:var(--pr)}.kp polygon{stroke:var(--pe);stroke-width:1}
.kb .t{fill:var(--bt)}.kb .l{fill:var(--bl)}.kb .r{fill:var(--br)}.kb polygon,.kb path,.kb ellipse{stroke:var(--be);stroke-width:1.1}
.ka .t{fill:var(--at)}.ka .l{fill:var(--al)}.ka .r{fill:var(--ar)}.ka polygon,.ka path,.ka ellipse{stroke:var(--ac);stroke-width:1.5}
.kw .t{fill:var(--wt)}.kw .l{fill:var(--wl)}.kw .r{fill:var(--wr)}.kw polygon,.kw path,.kw ellipse{stroke:var(--wa);stroke-width:1.5}
.ke .t{fill:var(--et)}.ke .l{fill:var(--el)}.ke .r{fill:var(--er2)}.ke polygon,.ke path,.ke ellipse{stroke:var(--er);stroke-width:1.5}
.kd .t{fill:var(--dt)}.kd .l{fill:var(--dl)}.kd .r{fill:var(--dr)}.kd polygon,.kd path,.kd ellipse{stroke:var(--de);stroke-width:1;stroke-dasharray:3 3}
.kg polygon{fill:none;stroke:var(--pe);stroke-width:1.2;stroke-dasharray:5 5}
.iso .st{stroke:var(--be);stroke-width:1;opacity:.75;fill:none}
.iso .rail{fill:var(--rail);stroke:var(--pe);stroke-width:1}
.iso .rail.ac{fill:var(--ac-soft);stroke:var(--ac)}
.iso .chev{fill:none;stroke:var(--tx3);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.iso .chev.ac{stroke:var(--ac)}
.iso .flow{stroke:var(--ac);stroke-width:2;fill:none;stroke-linecap:round}
.iso .wire{stroke:var(--pe);stroke-width:1.2;fill:none;stroke-dasharray:4 4}
.iso .ret{stroke:var(--tx3);stroke-width:1.3;fill:none;stroke-dasharray:5 5}

@media (max-width:760px){
  .hd{flex-wrap:wrap;min-height:60px;padding:8px 16px;gap:8px}
  .hl{flex:1}
  .nav{display:none}
  .menu-nav{display:flex}
  .tools{display:contents}
  .tools .conn{order:9;flex-basis:auto;height:32px;padding:0}
  .tools .refresh{order:10;height:36px}
  .seg{min-width:44px;padding:0 8px}
  .lf{display:none}.ls{display:inline}
  .theme .tl,.more .tl{display:none}
  .theme,.more summary{padding:0;width:44px}
  .brand span{display:none}
  main{padding:16px 16px 20px}
  .pad{padding:18px 16px}
  .h1{font-size:22px}
  .kv{grid-template-columns:1fr;gap:2px}
  .crow{padding:10px 16px;flex-wrap:wrap;gap:8px 12px}
  .cmeta{width:100%;padding-left:0}
  .actbar{padding:0;bottom:0}
  .actin{border-radius:0;border-width:1px 0 0;padding:14px 16px calc(14px + env(safe-area-inset-bottom))}
  .actin .pbtn{flex:1}
  .actin .note{width:100%}
}
