:root{--ink:#1b2a41;--paper:#eef1f4;--card:#fff;--line:#d3dae2;--muted:#5d6b7c;--signal:#e8a33d;--signal-bg:#fdf1dc;--ok:#2f7d5b;--bad:#b8483f}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.55 system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',sans-serif}
main{max-width:860px;margin:0 auto;padding:24px 16px 64px}
h1{font-size:1.7rem;line-height:1.2;margin:.2em 0 .4em}
h2{font-size:1.15rem;margin-top:2em}
a{color:var(--ink)}
.bar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;background:var(--ink);padding:12px 16px}
.bar a,.bar .link{color:#fff;text-decoration:none}
.bar nav{display:flex;gap:18px;align-items:center}
.bar form{margin:0}
.link{background:none;border:0;font:inherit;cursor:pointer;padding:0}
.card{background:var(--card);border:1px solid var(--line);border-radius:6px;padding:20px}
.narrow{max-width:420px;margin:40px auto}
label{display:block;margin:0 0 14px;font-weight:600;font-size:.92rem}
input,select{display:block;width:100%;margin-top:4px;padding:9px 10px;border:1px solid var(--line);border-radius:4px;font:inherit;background:#fff}
:focus-visible{outline:3px solid var(--signal);outline-offset:2px}
.btn{display:inline-block;background:var(--ink);color:#fff;border:0;border-radius:4px;padding:10px 16px;font:inherit;font-weight:600;cursor:pointer;text-decoration:none}
.err{color:var(--bad);font-weight:600}
.muted{color:var(--muted)}.small{font-size:.88rem}
.empty{padding:28px;background:var(--card);border:1px dashed var(--line);border-radius:6px}
.list .row{display:grid;grid-template-columns:70px 2fr 2fr 1fr 110px;gap:12px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:6px;padding:14px 16px;margin-bottom:8px;text-decoration:none}
.list .row:hover{border-color:var(--ink)}
.ball{display:inline-block;background:var(--signal-bg);color:#6b4608;border:1px solid var(--signal);border-radius:99px;padding:1px 10px;font-size:.85rem;font-weight:600}
.ball.big{font-size:1.1rem;padding:2px 14px}
.late{display:inline-block;margin-left:8px;color:var(--bad);font-size:.85rem;font-weight:600}
.meter{height:8px;background:var(--line);border-radius:99px;overflow:hidden}
.meter i{display:block;height:100%;background:var(--ok)}
.meter.big{height:12px;margin:18px 0 6px}
.share{display:flex;gap:16px;justify-content:space-between;align-items:end;flex-wrap:wrap;margin:16px 0 28px}
.share>div{flex:1;min-width:240px}
.rail{list-style:none;margin:0;padding:0 0 0 26px;border-left:3px solid var(--line)}
.rail li{position:relative;padding:0 0 22px 14px}
.rail li::before{content:"";position:absolute;left:-36px;top:4px;width:15px;height:15px;border-radius:50%;background:var(--paper);border:3px solid var(--line)}
.rail li.st-completed::before{background:var(--ok);border-color:var(--ok)}
.rail li.st-in_progress::before{border-color:var(--signal);background:var(--signal-bg)}
.rail li.st-blocked::before{border-color:var(--bad);background:#f6dcd9}
.rail .head{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.pill{font-size:.8rem;color:var(--muted);border:1px solid var(--line);border-radius:4px;padding:0 7px;background:#fff}
details{margin-top:6px}summary{cursor:pointer;color:var(--muted);font-size:.9rem}
.grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px 14px;margin-top:10px;background:var(--card);border:1px solid var(--line);border-radius:6px;padding:14px}
.grid .wide{grid-column:1/-1}.grid .btn{grid-column:1/-1;justify-self:start}
.hero{background:var(--card);border:1px solid var(--line);border-left:6px solid var(--signal);border-radius:6px;padding:22px;margin-bottom:32px}
.holding{font-size:1.25rem;margin:.6em 0 .2em}
.note{background:var(--paper);padding:8px 12px;border-radius:4px}
.log{padding-left:18px;color:var(--muted);font-size:.9rem}
@media(max-width:640px){.list .row{grid-template-columns:1fr}.grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:no-preference){.meter i{transition:width .4s}}
.mv{margin-left:auto;display:flex;gap:4px}.mv form,.inline-del{margin:0}
.mini{font:inherit;font-size:.8rem;padding:1px 9px;border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:4px;cursor:pointer}
.mini:hover:not(:disabled){border-color:var(--ink)}.mini:disabled{opacity:.35;cursor:default}
.danger{color:var(--bad);border-color:var(--bad)}.inline-del{margin-top:8px}
.addbox{background:var(--card);border:1px solid var(--line);border-radius:6px;padding:12px 16px;margin-top:8px}
.addbox summary{color:var(--ink);font-weight:600}

.caseno,.caseref{font-weight:600;color:var(--muted);font-variant-numeric:tabular-nums}.caseref{margin:0}
.search{display:flex;gap:8px;margin:0 0 16px}.search input{margin:0}
.grid .span2{grid-column:span 2}
.grip{margin-left:auto;background:none;border:1px solid transparent;color:var(--muted);padding:3px 6px;border-radius:4px;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;line-height:0}
.grip:hover,.grip:focus-visible{color:var(--ink);border-color:var(--line);background:#fff}
.rail li.dragging{background:var(--signal-bg);box-shadow:0 0 0 2px var(--signal);border-radius:6px}
body.sorting{user-select:none;-webkit-user-select:none;cursor:grabbing}
@media(max-width:640px){.grid .span2{grid-column:1}}

.rail li.st-pending::before{border-color:var(--signal);border-style:dashed;background:#fff}
.btn.ghost{background:#fff;color:var(--ink);border:1px solid var(--ink)}
.banner{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin:0 0 24px}.banner form{margin:0}
.banner.ready{border-left:6px solid var(--ok)}.banner.closed{border-left:6px solid var(--muted);background:#f6f7f9}
.grid .hint{grid-column:1/-1;margin:0}
.tabs{display:flex;gap:6px;margin:0 0 16px}.tabs a{padding:4px 14px;border:1px solid var(--line);border-radius:99px;text-decoration:none;background:#fff}
.tabs a.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.list .row.is-closed{background:#f6f7f9;color:var(--muted)}

.org{color:#9fb0c4;font-size:.9rem;margin-right:auto;margin-left:14px}
.titlebar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.tablewrap{overflow-x:auto;margin:12px 0}
.tbl{width:100%;border-collapse:collapse;background:var(--card);border:1px solid var(--line);border-radius:6px}
.tbl th,.tbl td{padding:10px 12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.tbl th{font-size:.8rem;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.tbl tr.inactive{opacity:.55}
.acts{display:flex;gap:6px;flex-wrap:wrap}.acts form{margin:0}
.pwbox{background:var(--signal-bg);border:1px solid var(--signal);border-radius:6px;padding:10px 16px;margin:12px 0}.pwbox p{margin:.3em 0}
code.pw{font-size:1.3rem;letter-spacing:.06em;user-select:all}
.okmsg{color:var(--ok);font-weight:600}
hr{border:0;border-top:1px solid var(--line);margin:18px 0}

.check{display:flex;gap:10px;align-items:flex-start;font-weight:400}.check input{width:auto;margin-top:5px}
.prose{max-width:680px}.prose h2{margin-top:1.6em}

.internal{color:#6b4608;background:var(--signal-bg);border-radius:4px;padding:2px 8px;display:inline-block;margin-top:4px}
.toprow{display:flex;justify-content:space-between;gap:12px;align-items:baseline;flex-wrap:wrap}
.toprow p{margin:0}.langlink{font-weight:600;font-size:.9rem}
.todo{background:var(--signal-bg);border:1px solid var(--signal);border-left-width:6px;border-radius:6px;padding:12px 16px;margin:14px 0}
.todo h2{margin:0 0 4px;font-size:1.05rem}.todo p{margin:.25em 0}
.what{color:var(--muted);font-size:.92rem;margin:.2em 0 0}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:14px 0 8px}
.stat{background:var(--card);border:1px solid var(--line);border-radius:6px;padding:12px 16px}.stat b{display:block;font-size:1.8rem;line-height:1.1}.stat span{color:var(--muted);font-size:.9rem}
.stat.warn b{color:var(--bad)}
.codes{columns:2;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:1.05rem;letter-spacing:.04em;padding-left:1.2em}
.secret{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:1.15rem;letter-spacing:.08em;word-break:break-all;user-select:all}
.card + .card{margin-top:16px}.wide-card{max-width:560px;margin:24px auto}

.check.switch input{appearance:none;-webkit-appearance:none;width:42px;height:24px;margin:0;border-radius:99px;background:var(--line);position:relative;cursor:pointer;flex:none}
.check.switch input::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff}
.check.switch input:checked{background:var(--ok)}
.check.switch input:checked::after{left:21px}
.check.switch input:focus-visible{outline:3px solid var(--signal);outline-offset:2px}
@media(prefers-reduced-motion:no-preference){.check.switch input,.check.switch input::after{transition:all .15s}}
.tips{padding-left:20px;margin:8px 0}.tips li{margin:6px 0}


/* ==========================================================
   MILESTONES BRAND LAYER
   Visual overrides for the login experience and shared UI.
   ========================================================== */
:root{--ink:#172b4d;--paper:#f4f7fb;--card:#fff;--line:#e1e8f0;--muted:#64748b;--signal:#e8a23a;--signal-bg:#fff5e5;--ok:#168568;--bad:#b54745;--brand:#1769aa;--brand-dark:#12558b;--brand-soft:#eaf3fb}
body{background:var(--paper);color:var(--ink)}
a{color:var(--brand)}
:focus-visible{outline:3px solid #f2b84b;outline-offset:3px}
.btn{background:var(--brand);border-radius:9px;padding:11px 16px;transition:background .15s ease,transform .15s ease}
.btn:hover{background:var(--brand-dark)}.btn:active{transform:translateY(1px)}
.btn.ghost{background:#fff;color:var(--ink);border:1px solid var(--line)}
.card{border-radius:14px;border-color:var(--line);box-shadow:0 4px 18px rgba(23,43,77,.035)}
input,select{border-radius:8px;border-color:#d7e0eb;padding:11px 12px}
input:focus,select:focus{border-color:var(--brand);outline:3px solid rgba(23,105,170,.12)}
.bar{background:#142844}
.list .row{border-radius:10px;transition:border-color .15s ease,box-shadow .15s ease}
.list .row:hover{border-color:#8ab9df;box-shadow:0 4px 16px rgba(23,43,77,.05)}
.stat{border-radius:12px}.tabs a{border-radius:8px}.tabs a.on{background:var(--brand);border-color:var(--brand)}
.hero{border-radius:12px;border-left-color:var(--brand)}.addbox{border-radius:10px}
.tbl{border-radius:10px;overflow:hidden}.tbl th{background:#f8fafc}.empty{border-radius:12px}

/* Branded responsive sign-in */
main:has(.login-layout){max-width:none;width:100%;min-height:100vh;margin:0;padding:0;display:flex;align-items:stretch}
.login-layout{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(400px,.92fr);width:100%;min-height:100vh;background:#fff}
.login-intro{position:relative;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;padding:clamp(28px,5vw,68px);color:#fff;background:radial-gradient(ellipse at 8% 12%,rgba(62,146,210,.28),transparent 36%),linear-gradient(145deg,#122b4c 0%,#173e69 54%,#1769aa 100%)}
.login-intro:before,.login-intro:after{content:"";position:absolute;pointer-events:none;border:1px solid rgba(255,255,255,.1);border-radius:50%}
.login-intro:before{width:520px;height:520px;right:-240px;top:-190px}.login-intro:after{width:390px;height:390px;right:-170px;top:-120px}
.brand-lockup,.mobile-brand{display:inline-flex;align-items:center;gap:12px;text-decoration:none;color:inherit;position:relative;z-index:1}
.brand-mark{display:grid;place-items:center;width:46px;height:46px;flex:none;border-radius:13px;background:rgba(255,255,255,.13);color:#fff;border:1px solid rgba(255,255,255,.17)}
.brand-mark svg{width:34px;height:34px}.brand-wordmark{display:flex;flex-direction:column;line-height:1.2}
.brand-wordmark strong{font-size:1.25rem;letter-spacing:-.035em;font-weight:750}.brand-wordmark small{margin-top:5px;font-size:.75rem;letter-spacing:.025em;opacity:.72}
.intro-copy{position:relative;z-index:1;max-width:590px;margin:70px 0 48px}
.eyebrow,.welcome-kicker{display:inline-flex;align-items:center;gap:9px;font-size:.72rem;font-weight:750;letter-spacing:.13em}
.eyebrow{color:#b9d9f4}.eyebrow-dot{width:7px;height:7px;background:#f2b84b;border-radius:50%;box-shadow:0 0 0 4px rgba(242,184,75,.14)}
.intro-copy h1{font-size:clamp(2.4rem,4.2vw,4.1rem);line-height:1.08;letter-spacing:-.055em;margin:24px 0 20px;font-weight:750}
.intro-copy h1 span{color:#9ed2ff}.intro-copy>p{max-width:480px;color:#d4e2f1;font-size:1.04rem;line-height:1.8;margin:0}
.journey-preview{max-width:470px;margin-top:42px;padding:22px 24px 18px;border:1px solid rgba(255,255,255,.18);border-radius:16px;background:rgba(255,255,255,.085);backdrop-filter:blur(10px);box-shadow:0 16px 40px rgba(4,20,40,.12)}
.journey-top{display:flex;justify-content:space-between;gap:14px;align-items:center}.journey-top>div{display:flex;flex-direction:column;gap:6px}
.preview-label{font-size:.65rem;font-weight:750;letter-spacing:.12em;color:#b8d7f0}.journey-top strong{font-size:.98rem;font-weight:650}
.preview-progress{font-size:1.15rem;font-weight:750;color:#b5e3d5}.preview-track{height:6px;margin:18px 0 20px;border-radius:99px;background:rgba(255,255,255,.17);overflow:hidden}
.preview-track span{display:block;width:65%;height:100%;border-radius:inherit;background:#69c7a6}
.preview-steps{display:grid;grid-template-columns:1fr 1fr;gap:13px 16px;font-size:.78rem;color:#c9d9e8}.preview-steps span{display:flex;align-items:center;gap:8px}
.preview-steps i{display:grid;place-items:center;width:20px;height:20px;border-radius:50%;font-size:.7rem;font-style:normal;border:1px solid rgba(255,255,255,.28);color:#d8e6f4}
.preview-steps .step-done i{background:#168568;border-color:#168568;color:#fff}.preview-steps .step-active{color:#fff}
.preview-steps .step-active i{background:#f2b84b;border-color:#f2b84b;color:#172b4d}
.intro-footer{position:relative;z-index:1;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;color:#b9cde0;font-size:.78rem}.intro-footer span:last-child{color:#cce9dd}
.login-main{display:flex;flex-direction:column;justify-content:center;align-items:center;padding:48px clamp(24px,5vw,76px) 24px;background:#fff}
.login-card{width:100%;max-width:420px}.mobile-brand{display:none;color:var(--ink);margin-bottom:42px}
.login-heading{margin-bottom:30px}.welcome-kicker{color:var(--brand);margin-bottom:12px}
.login-heading h2{font-size:clamp(1.75rem,2.4vw,2.15rem);letter-spacing:-.045em;line-height:1.2;margin:0 0 11px}
.login-heading p{margin:0;color:var(--muted);font-size:.96rem}
.login-form{display:flex;flex-direction:column;gap:19px}.login-form label{margin:0;color:#273b55;font-size:.88rem;font-weight:650}
.login-form input{margin-top:8px;min-height:48px;background:#fff;font-size:.95rem}.login-form input::placeholder{color:#9aa8b8}
.form-options{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:-7px;font-size:.8rem}
.form-options a,.login-help a{font-weight:650;text-decoration:none}.form-options a:hover,.login-help a:hover,.privacy-foot a:hover{text-decoration:underline}
.form-hint{color:var(--muted)}
.login-submit{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;min-height:50px;margin-top:2px;font-size:.94rem;box-shadow:0 6px 14px rgba(23,105,170,.17)}
.login-submit span{font-size:1.15rem;transition:transform .15s ease}.login-submit:hover span{transform:translateX(3px)}
.privacy-foot{margin:24px 0 0;color:#8491a2;font-size:.76rem;line-height:1.7}.privacy-foot a{white-space:nowrap}
.login-copyright{width:100%;max-width:420px;margin-top:42px;color:#98a4b4;font-size:.75rem}.login-copyright span{padding:0 5px}
.form-message{padding:11px 13px;border-radius:8px;margin:0 0 18px;font-size:.86rem;line-height:1.5}
.err.form-message{background:#fff0ef;border:1px solid #f3d0cd}.okmsg.form-message{background:#eaf7f1;border:1px solid #c6e9d9;padding:11px 13px}
.security-note{display:flex;gap:12px;align-items:flex-start;padding:13px 14px;margin-bottom:20px;border:1px solid #d9e9f7;border-radius:9px;background:#f3f8fd}
.security-note p{margin:0;color:#4b6078;font-size:.83rem;line-height:1.6}.security-icon{display:grid;place-items:center;width:25px;height:25px;flex:none;border-radius:7px;background:#dcecf9;color:var(--brand);font-weight:800}
.login-help{margin:22px 0 0;font-size:.85rem}
@media(max-width:900px){.login-layout{grid-template-columns:minmax(0,.9fr) minmax(360px,1.1fr)}.login-intro{padding:32px}.intro-copy h1{font-size:clamp(2.3rem,4.5vw,3.2rem)}.journey-preview{padding:18px}.login-main{padding:36px 28px 24px}}
@media(max-width:680px){main:has(.login-layout){display:block;min-height:100vh}.login-layout{display:flex;flex-direction:column;min-height:100vh}.login-intro{display:none}.login-main{flex:1;justify-content:flex-start;padding:30px 22px 22px}.mobile-brand{display:inline-flex;margin-bottom:54px}.login-card{max-width:460px;margin:auto 0}.login-copyright{max-width:460px;margin-top:46px}.login-heading{margin-bottom:26px}.login-heading h2{font-size:1.8rem}}
@media(max-width:380px){.login-main{padding-left:17px;padding-right:17px}.mobile-brand{margin-bottom:42px}.form-options{align-items:flex-start;flex-direction:column;gap:7px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}}

