:root{--ink:#14213d;--bg:#eef2f6;--cab:#e8871e;--per:#2a9d8f;--bad:#c0392b}*{box-sizing:border-box}
body{margin:0;font:16px/1.4 ui-rounded,"SF Pro Rounded",system-ui,sans-serif;background:var(--bg);color:var(--ink);padding:env(safe-area-inset-top) 0 calc(76px + env(safe-area-inset-bottom))}
main{max-width:640px;margin:auto;padding:16px}h1{font-size:2rem;margin:.2em 0}h2{margin:.2em 0 .6em}
.card{background:#fff;border-radius:20px;padding:16px;margin:12px 0;box-shadow:0 1px 0 #cfd8e3}.big{font-size:2.2rem;font-weight:700}
.bar{height:10px;border-radius:9px;background:#e3e9f0;overflow:hidden}.bar i{display:block;height:100%;background:var(--ink)}
.Cab .bar i{background:var(--cab)}.Personal .bar i{background:var(--per)}.warn{color:var(--bad);font-weight:600}.muted{opacity:.65}
nav{position:fixed;bottom:0;left:0;right:0;display:flex;gap:8px;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:#fff;border-top:1px solid #d5dde6}
button,.btn{font:inherit;border:0;border-radius:14px;padding:12px 14px;background:#e3e9f0;color:var(--ink);cursor:pointer;text-decoration:none;display:inline-block;margin:4px 4px 4px 0}
nav button{flex:1;margin:0}.go,.primary{background:var(--ink);color:#fff}button:focus-visible,input:focus-visible{outline:3px solid var(--cab)}
input,select{font:inherit;width:100%;padding:12px;border:1px solid #b9c5d3;border-radius:12px;margin:4px 0}
#modal{position:fixed;inset:0;background:rgba(20,33,61,.6);overflow:auto;padding:env(safe-area-inset-top) 12px 12px;z-index:9}#modal>div{background:#fff;border-radius:22px;padding:18px;max-width:520px;margin:16px auto}
video{width:100%;border-radius:16px;background:#000;max-height:50vh}.row{display:flex;justify-content:space-between;gap:8px;align-items:center}