@font-face{font-family:'DM Sans';font-style:normal;font-weight:400;font-display:swap;src:url(/static/fonts/dm-sans-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:500;font-display:swap;src:url(/static/fonts/dm-sans-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:700;font-display:swap;src:url(/static/fonts/dm-sans-latin-700-normal.woff2) format('woff2')}
@font-face{font-family:'DM Mono';font-style:normal;font-weight:400;font-display:swap;src:url(/static/fonts/dm-mono-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'DM Mono';font-style:normal;font-weight:500;font-display:swap;src:url(/static/fonts/dm-mono-latin-500-normal.woff2) format('woff2')}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:#F5F7FA;color:#13203A;font:16px/24px 'DM Sans',system-ui,sans-serif;
  display:flex;flex-direction:column;min-height:100vh}
a{color:#C2462A}
a:hover{color:#13203A}
h1,h2{margin:0;font-weight:700;letter-spacing:-0.03em}
p{margin:0}
.mono,code,.chip{font-family:'DM Mono',ui-monospace,monospace}
.chip{font-size:14px;background:#E6EEF9;border-radius:6px;padding:2px 6px;color:#13203A}
.label{font-family:'DM Mono',ui-monospace,monospace;font-size:12px;line-height:16px;font-weight:500;
  letter-spacing:0.14em;color:#4A5568}
.label.coral{color:#C2462A}
.muted{color:#4A5568}
.small{font-size:13px;line-height:20px}
.stack{display:flex;flex-direction:column;gap:12px}
.stack-8{display:flex;flex-direction:column;gap:8px}

/* header */
.hdr{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px;
  padding:16px 32px;background:#FFFFFF;border-bottom:1px solid #E1E7F0}
.hdr-left{display:flex;flex-wrap:wrap;align-items:center;gap:12px 32px}
.brand{display:block;line-height:0}
.brand img{height:28px;width:auto;display:block}
.nav{display:flex;flex-wrap:wrap;gap:4px}
.nav a{padding:10px 14px;border-radius:10px;color:#4A5568;text-decoration:none;font-size:15px;font-weight:500}
.nav a:hover{color:#13203A}
.nav a[aria-current=page]{background:#E6EEF9;color:#13203A}
.nav a.nav-admin[aria-current=page]{background:#13203A;color:#FFFFFF}
.hdr-right{display:flex;align-items:center;gap:16px;font-size:14px;color:#4A5568}
.hdr-right strong{color:#13203A;font-weight:500}
.hdr form{margin:0}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 18px;
  border-radius:10px;font:500 15px/20px 'DM Sans',system-ui,sans-serif;text-decoration:none;cursor:pointer;
  border:1px solid #C9D3E3;background:#FFFFFF;color:#13203A}
.btn-primary{background:#13203A;border-color:#13203A;color:#FFFFFF;font-size:16px;min-height:48px}
.btn-primary:hover{color:#FFFFFF;background:#22335A}
.btn-wide{display:flex;width:100%}
.btn-coral{color:#C2462A}
.btn-coral-line{color:#C2462A;border-color:#C2462A}
.btn-navy-line{color:#13203A;border-color:#13203A}
.btn-small{min-height:40px;padding:0 12px;font-size:14px}
form.inline{margin:0;display:inline}

/* single-card pages */
.center{flex-grow:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;
  padding:48px 20px}
.card{width:min(100%,520px);background:#FFFFFF;border:1px solid #E1E7F0;border-radius:14px;padding:40px;
  display:flex;flex-direction:column;gap:24px}
.card.narrow{width:min(100%,440px)}
.card.lifted{box-shadow:0 10px 30px -18px rgba(19,32,58,0.35)}
.card h1{font-size:32px;line-height:1.15}
.card .lead{color:#4A5568}
.card .foot{display:flex;flex-direction:column;gap:8px;padding-top:20px;border-top:1px solid #E1E7F0}
.facts{margin:0;display:grid;grid-template-columns:140px minmax(0,1fr);row-gap:12px;column-gap:16px;padding:20px;
  background:#F5F7FA;border:1px solid #E1E7F0;border-radius:10px;font-size:15px}
.facts dt{font-family:'DM Mono',ui-monospace,monospace;font-size:12px;font-weight:500;letter-spacing:0.14em;
  color:#4A5568;padding-top:2px}
.facts dd{margin:0}
.list{margin:0;padding:0 0 0 20px;display:flex;flex-direction:column;gap:8px;font-size:15px;line-height:22px}
.actions{display:flex;flex-wrap:wrap;gap:12px}
.actions .btn{flex:1 1 200px;min-height:48px;font-size:16px}
.footer{padding:20px 32px;font-size:13px;color:#4A5568;text-align:center}

/* app pages */
.main{width:min(100%,1120px);margin:0 auto;padding:40px 24px 64px;display:flex;flex-direction:column;gap:32px}
.main.wide{width:min(100%,1180px)}
.intro{display:flex;flex-direction:column;gap:8px}
.intro h1{font-size:40px;line-height:1.15}
.intro p{width:min(100%,680px);color:#4A5568}
.intro-row{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px}
.jump{display:flex;flex-wrap:wrap;gap:16px;font-size:14px;font-weight:500}
.banner{display:flex;align-items:center;gap:12px;padding:14px 18px;background:#FDECE7;border-radius:10px;font-size:15px}
.tiles{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.tile{background:#FFFFFF;border:1px solid #E1E7F0;border-radius:14px;padding:16px;display:flex;flex-direction:column;
  gap:6px;min-width:0}
.tile .label{font-size:11px}
.tile .num{font-size:32px;line-height:1.1;font-weight:700;letter-spacing:-0.03em}
.tile .num.coral{color:#C2462A}
.tile .num.slate{color:#4A5568}
.box{background:#FFFFFF;border:1px solid #E1E7F0;border-radius:14px;overflow:hidden}
.box-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:12px;padding:16px 20px;
  border-bottom:1px solid #E1E7F0}
.box-head h2,.section-title{font-size:18px;letter-spacing:-0.02em}
.box-body{padding:24px;display:flex;flex-direction:column;gap:16px}
.box-note{padding:14px 20px 18px;border-top:1px solid #E1E7F0}
.scroll{overflow-x:auto}
table.t{width:100%;border-collapse:collapse;font-size:15px}
table.t.w760{min-width:760px}
table.t.w860{min-width:860px}
table.t.w980{min-width:980px}
table.t.compact{font-size:14px}
table.t th{text-align:left;padding:12px 20px;font-family:'DM Mono',ui-monospace,monospace;font-size:12px;
  font-weight:500;letter-spacing:0.14em;color:#4A5568;background:#F5F7FA}
table.t.compact th,table.t.compact td{padding-left:16px;padding-right:16px}
table.t td{padding:14px 20px;border-top:1px solid #E1E7F0;vertical-align:top}
table.t td.branch{font-family:'DM Mono',ui-monospace,monospace;font-size:13px;white-space:nowrap}
table.t td.date{color:#4A5568;white-space:nowrap}
table.t td.who{font-weight:500}
table.t th.right,table.t td.right{text-align:right}
.detail{display:block;margin-top:4px;font-size:13px;line-height:20px;color:#4A5568}
.empty{padding:24px 20px;color:#4A5568}
.key{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;font-size:14px;line-height:21px;
  color:#4A5568}
.key strong{color:#13203A}

/* pills */
.pill{display:inline-block;padding:4px 10px;border-radius:999px;font-size:13px;line-height:18px;font-weight:500;
  white-space:nowrap}
.pill-open{background:#FFFFFF;border:1px solid #C9D3E3;color:#13203A}
.pill-merged{background:#E6EEF9;color:#13203A}
.pill-checking{background:#E6EEF9;color:#13203A;border:1px dashed #13203A}
.pill-held{background:#FDECE7;color:#C2462A}
.pill-reworked{background:#F5F7FA;border:1px dashed #4A5568;color:#13203A}
.pill-abandoned{background:#F5F7FA;color:#4A5568;text-decoration:line-through}
.pill-active{background:#E6EEF9;color:#13203A}
.pill-suspended{background:#FDECE7;color:#C2462A}
.pill-out{background:#F5F7FA;border:1px solid #E1E7F0;color:#4A5568;padding:6px 12px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips>span{padding:6px 12px;border-radius:999px;background:#E6EEF9;font-size:14px}

/* devices */
.devices{display:flex;flex-direction:column;gap:12px}
.device{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;padding:20px 24px;
  background:#FFFFFF;border:1px solid #E1E7F0;border-radius:14px}
.device-left{display:flex;align-items:center;gap:16px;min-width:0}
.device-icon{width:44px;height:44px;border-radius:10px;background:#F5F7FA;border:1px solid #E1E7F0;display:flex;
  align-items:center;justify-content:center;flex-shrink:0}
.device-name{font-size:17px;font-weight:700;letter-spacing:-0.01em}
.device-meta{font-size:14px;color:#4A5568}

/* admin */
.form-grid{margin:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:16px;align-items:end}
.form-grid label{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:500;color:#4A5568}
.form-grid input,.form-grid select{min-height:44px;padding:0 12px;border:1px solid #C9D3E3;border-radius:10px;
  font:15px 'DM Sans',system-ui,sans-serif;color:#13203A;background:#FFFFFF}
.form-grid .btn{border:0;background:#13203A;color:#FFFFFF}
.waiting{display:flex;flex-direction:column;gap:8px;padding-top:16px;border-top:1px solid #E1E7F0}
.row-actions{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:8px}
details.edit{text-align:left}
details.edit summary{display:inline-flex;align-items:center;min-height:40px;padding:0 12px;border:1px solid #C9D3E3;
  border-radius:10px;cursor:pointer;font-weight:500;list-style:none;font-size:14px}
details.edit summary::-webkit-details-marker{display:none}
details.edit[open]{flex-basis:100%}
.edit-panel{margin-top:12px;padding:20px;border:1px solid #C9D3E3;border-radius:10px;background:#F5F7FA;
  display:flex;flex-direction:column;gap:14px}
.bar{display:block;margin-top:6px;height:6px;border-radius:999px;background:#E1E7F0;overflow:hidden}
.bar span{display:block;height:6px;border-radius:999px;background:#13203A}
.bar span.hot{background:#C2462A}
.w0{width:0}

/* set up this computer (board 10) */
.platforms{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:20px}
.platform{background:#FFFFFF;border:1px solid #E1E7F0;border-radius:14px;padding:28px;display:flex;
  flex-direction:column;gap:20px;min-width:0}
.platform-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px}
.platform-head h2{font-size:24px;letter-spacing:-0.02em}
.mono-note{font-family:'DM Mono',ui-monospace,monospace;font-size:12px;color:#4A5568}
.platform .btn-primary{gap:10px}
.steps{margin:0;padding-left:22px;display:flex;flex-direction:column;gap:12px;font-size:15px;line-height:22px}
.steps strong{font-weight:500}
.cmd{margin:8px 0 0;padding:12px 14px;background:#13203A;color:#F5F7FA;border-radius:10px;
  font:13px/20px 'DM Mono',ui-monospace,monospace;white-space:pre-wrap;overflow-wrap:anywhere}
.version{display:flex;flex-direction:column;gap:4px;padding-top:16px;border-top:1px solid #E1E7F0}
.version .label{font-size:11px}
.hash{font:12px/18px 'DM Mono',ui-monospace,monospace;color:#4A5568;overflow-wrap:anywhere}
.notice{margin:0;padding:12px 14px;border-radius:10px;background:#F5F7FA;border:1px solid #E1E7F0;color:#4A5568}
.notes{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:16px}
.note{background:#FFFFFF;border:1px solid #E1E7F0;border-radius:14px;padding:20px;display:flex;flex-direction:column;
  gap:6px;font-size:14px;line-height:21px;color:#4A5568}
.note strong{font-size:16px;color:#13203A}

@media not all and (min-width:760px){
  .platform{padding:22px 18px}
  .hdr{padding:14px 16px}
  .main{padding:28px 16px 48px}
  .intro h1{font-size:32px}
  .tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
  .card{padding:28px 20px}
  .facts{grid-template-columns:1fr;row-gap:4px}
  .facts dd{margin-bottom:8px}
}
.w1{width:1%}.w2{width:2%}.w3{width:3%}.w4{width:4%}.w5{width:5%}.w6{width:6%}.w7{width:7%}.w8{width:8%}.w9{width:9%}.w10{width:10%}.w11{width:11%}.w12{width:12%}.w13{width:13%}.w14{width:14%}.w15{width:15%}.w16{width:16%}.w17{width:17%}.w18{width:18%}.w19{width:19%}.w20{width:20%}.w21{width:21%}.w22{width:22%}.w23{width:23%}.w24{width:24%}.w25{width:25%}.w26{width:26%}.w27{width:27%}.w28{width:28%}.w29{width:29%}.w30{width:30%}.w31{width:31%}.w32{width:32%}.w33{width:33%}.w34{width:34%}.w35{width:35%}.w36{width:36%}.w37{width:37%}.w38{width:38%}.w39{width:39%}.w40{width:40%}.w41{width:41%}.w42{width:42%}.w43{width:43%}.w44{width:44%}.w45{width:45%}.w46{width:46%}.w47{width:47%}.w48{width:48%}.w49{width:49%}.w50{width:50%}.w51{width:51%}.w52{width:52%}.w53{width:53%}.w54{width:54%}.w55{width:55%}.w56{width:56%}.w57{width:57%}.w58{width:58%}.w59{width:59%}.w60{width:60%}.w61{width:61%}.w62{width:62%}.w63{width:63%}.w64{width:64%}.w65{width:65%}.w66{width:66%}.w67{width:67%}.w68{width:68%}.w69{width:69%}.w70{width:70%}.w71{width:71%}.w72{width:72%}.w73{width:73%}.w74{width:74%}.w75{width:75%}.w76{width:76%}.w77{width:77%}.w78{width:78%}.w79{width:79%}.w80{width:80%}.w81{width:81%}.w82{width:82%}.w83{width:83%}.w84{width:84%}.w85{width:85%}.w86{width:86%}.w87{width:87%}.w88{width:88%}.w89{width:89%}.w90{width:90%}.w91{width:91%}.w92{width:92%}.w93{width:93%}.w94{width:94%}.w95{width:95%}.w96{width:96%}.w97{width:97%}.w98{width:98%}.w99{width:99%}.w100{width:100%}
