:root{
  color-scheme:light dark;
  --brand-navy:#0B1E43; --brand-orange:#C35629; --brand-orange-adapted:#E06A2A;
  --neutral-off-white:#F5F1E8; --neutral-white:#FFFFFF; --neutral-charcoal:#2D2D2D;
  --neutral-secondary-gray:#6B6B6B; --neutral-near-black:#0F1218; --neutral-dark-panel:#1A2435;
  --neutral-dark-body:#F0EDE6; --neutral-dark-secondary:#9BA3AD; --neutral-light-border:#D8D3C8;
  --neutral-dark-border:#2A3545;
  --font-primary:"IBM Plex Sans",Arial,sans-serif;
  --font-display:"Big Shoulders Display","Arial Narrow",Arial,sans-serif;
  --color-bg:var(--neutral-off-white); --color-surface:var(--neutral-white);
  --color-text-primary:var(--neutral-charcoal); --color-text-secondary:var(--neutral-secondary-gray);
  --color-brand-primary:var(--brand-navy); --color-brand-accent:var(--brand-orange);
  --color-border:var(--neutral-light-border); --color-focus:var(--brand-navy);
  --status-critical:#B42318; --status-success:#027A48;
  --radius:14px; --radius-sm:10px;
}
@media (prefers-color-scheme:dark){
  :root{
    --color-bg:var(--neutral-near-black); --color-surface:var(--neutral-dark-panel);
    --color-text-primary:var(--neutral-dark-body); --color-text-secondary:var(--neutral-dark-secondary);
    --color-brand-primary:var(--neutral-white); --color-brand-accent:var(--brand-orange-adapted);
    --color-border:var(--neutral-dark-border); --color-focus:var(--brand-orange-adapted);
    --status-critical:#F97066; --status-success:#32D583;
  }
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
html{background:var(--color-bg)}
body{
  min-height:100vh;background:var(--color-bg);color:var(--color-text-primary);
  font-family:var(--font-primary);font-size:16px;line-height:1.45;
  -webkit-text-size-adjust:100%;-webkit-font-smoothing:antialiased;
  padding-bottom:calc(72px + env(safe-area-inset-bottom));
}
button,input,textarea{font:inherit}
button{cursor:pointer}
button:disabled{cursor:not-allowed;opacity:.48}
:focus-visible{outline:3px solid var(--color-focus);outline-offset:2px}
.skip-link{position:absolute;left:-9999px}.skip-link:focus{left:12px;top:12px;background:var(--color-surface);color:var(--color-text-primary);padding:10px;z-index:100}

/* Kishron Track-style app bar */
.appbar{
  position:sticky;top:0;z-index:20;background:var(--brand-navy);color:#fff;
  padding:calc(10px + env(safe-area-inset-top)) 14px 10px;display:flex;align-items:center;gap:10px;
}
.appbar .mark{width:28px;height:28px;object-fit:contain;flex:0 0 auto;display:block}
.appbar .name{font-family:var(--font-display);font-weight:800;font-size:19px;letter-spacing:.3px;color:#fff;white-space:nowrap}
.appbar .jobline{margin-left:auto;text-align:right;font-size:11px;color:var(--neutral-dark-secondary);max-width:46%;line-height:1.2}
.appbar .jobline b{color:#fff;font-weight:600;display:block;font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:2px}
.appbar .jobline b[data-status="ready"]{color:#fff}
.appbar .jobline b[data-status="limited"]{color:#FDB022}

main{max-width:760px;margin:0 auto;padding:14px 14px 22px}
.view[hidden]{display:none!important}
h1,h2,h3{font-family:var(--font-primary);margin:0;color:var(--color-brand-primary);line-height:1.2}
p{margin:0 0 10px}
.sec{color:var(--color-text-secondary)}
.page-head{padding:3px 2px 12px}
.page-head h1{font-size:22px;margin-bottom:4px}
.page-head p{font-size:13px;color:var(--color-text-secondary);margin:0}

/* Cards and rows mirror Track scale */
.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);padding:14px;margin-bottom:12px}
.card h2{font-size:15px;text-transform:uppercase;letter-spacing:.6px;margin-bottom:10px;display:flex;align-items:center;gap:7px}
.card h2 .sec{text-transform:none;letter-spacing:0;font-weight:400;font-size:12px}
.card p:last-child{margin-bottom:0}
.home-intro{padding:18px 14px}
.home-intro h1{font-size:23px;margin-bottom:6px}
.home-intro p{font-size:14px;color:var(--color-text-secondary)}
.choice{display:block;width:100%;text-align:left;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);padding:14px;margin-bottom:10px;color:var(--color-text-primary)}
.choice .top{display:flex;align-items:center;gap:10px;margin-bottom:5px}
.choice .glyph{width:34px;height:34px;border-radius:9px;background:var(--brand-navy);color:#fff;display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.choice .glyph svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.choice .title{font-weight:700;font-size:16px;color:var(--color-brand-primary);flex:1}
.choice .meta{font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--color-text-secondary)}
.choice p{font-size:13px;color:var(--color-text-secondary);margin:0 0 11px}

/* Buttons: same dimensions/behavior as Track */
.button{font-family:var(--font-primary);font-size:16px;font-weight:600;cursor:pointer;border:none;border-radius:var(--radius-sm);padding:14px 16px;min-height:52px;width:100%;transition:filter .12s,transform .05s;display:flex;align-items:center;justify-content:center;gap:8px;background:var(--brand-navy);color:#fff}
.button:active{transform:scale(.985)}
.button-secondary{background:transparent;color:var(--color-brand-primary);border:1.5px solid var(--color-border)}
.button-quiet{background:transparent;color:var(--color-text-primary);border:1.5px solid var(--color-border);min-height:44px;padding:10px 12px;font-size:13.5px;width:auto}
.button-row{display:grid;gap:8px;margin-top:12px}
.button-row.two{grid-template-columns:1fr 1fr}

/* Forms */
.form-grid{display:grid;grid-template-columns:1fr;gap:12px}
label{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:600;color:var(--color-text-primary)}
input,textarea{width:100%;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-bg);padding:12px;color:var(--color-text-primary);font-weight:400;font-size:16px;min-height:46px}
textarea{resize:vertical;line-height:1.45}
input[aria-invalid="true"],textarea[aria-invalid="true"]{border-color:var(--status-critical)}
.field-error{min-height:1em;color:var(--status-critical);font-size:11.5px;font-weight:500}
.help{font-size:12px;color:var(--color-text-secondary);font-weight:400}
.items{display:flex;flex-direction:column;gap:10px}
.item-row{display:grid;grid-template-columns:1fr;gap:10px;padding:12px;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-bg)}
.item-row .remove-item{justify-self:start}
.note{border-left:4px solid var(--color-brand-accent);padding:10px 12px;background:var(--color-bg);color:var(--color-text-secondary);font-size:12.5px;border-radius:0 var(--radius-sm) var(--radius-sm) 0}

/* Graphics */
.graphic-layout{display:grid;grid-template-columns:1fr;gap:12px}
.preview-stack{display:grid;gap:12px}
.card-preview-wrap{background:var(--color-surface);border:1px solid var(--color-border);padding:12px;border-radius:var(--radius)}
.card-preview-wrap h3{font-size:11px;letter-spacing:.6px;margin:0 0 8px;color:var(--color-text-secondary)}
.card-preview{display:block;width:100%;height:auto;aspect-ratio:1.75/1;background:white;border-radius:4px;box-shadow:0 5px 18px rgba(0,0,0,.13)}
.export-group{padding-top:12px;border-top:1px solid var(--color-border);margin-top:14px}
.export-group strong{display:block;color:var(--color-brand-primary);font-size:13px;margin-bottom:8px}

/* Track-style fixed tab bar */
.tabbar{position:fixed;left:0;right:0;bottom:0;z-index:30;display:flex;background:var(--color-surface);border-top:1px solid var(--color-border);padding-bottom:env(safe-area-inset-bottom)}
.tabbar button{background:transparent;border:none;border-radius:0;min-height:0;width:33.333%;padding:9px 2px 8px;display:flex;flex-direction:column;align-items:center;gap:3px;color:var(--color-text-secondary);font-size:11px;font-weight:600}
.tabbar button[aria-current="page"]{color:var(--color-brand-primary)}
.tabbar svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.tabbar button[aria-current="page"] svg{color:var(--brand-orange);stroke:var(--brand-orange)}

#toast{position:fixed;right:14px;left:14px;bottom:calc(74px + env(safe-area-inset-bottom));max-width:732px;margin:auto;padding:12px 14px;border-radius:var(--radius-sm);background:var(--brand-navy);color:#fff;z-index:50;font-size:13px;box-shadow:0 10px 30px rgba(0,0,0,.2)}
#toast[data-kind="error"]{background:#B42318}#toast[data-kind="success"]{background:#027A48}

@media(min-width:620px){
  .form-grid.two-col{grid-template-columns:1fr 1fr}.full{grid-column:1/-1}
  .item-row{grid-template-columns:1fr 1.6fr auto;align-items:end}.item-row .remove-item{align-self:end}
}
@media print{.appbar,.tabbar,.form-controls,#toast{display:none!important}body{padding-bottom:0}main{max-width:none;padding:0}.card{border:0}}