:root{font-family:Arial,Helvetica,sans-serif;color:#172334;background:#f2f4f6;color-scheme:light;--accent:#b51d25;--line:#b8c5cf;--muted:#516477}*{box-sizing:border-box}body{margin:0}header,main,footer,.app-navigation{max-width:1400px;margin:auto}header{display:flex;align-items:center;background:#fff;border-bottom:3px solid var(--accent);padding:12px 22px;position:sticky;top:0;z-index:100;box-shadow:0 2px 5px #17233420}.brand{display:flex;align-items:center;gap:12px;color:var(--accent);font-size:25px;font-weight:bold;text-decoration:none}.brand img{width:58px;height:58px;object-fit:contain}.brand h1{font-size:12px;font-weight:normal;color:#31465a;margin:5px 0 0}.app-navigation{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:20px;background:#fff;padding:12px 22px;font-size:14px}a{color:#245b85}main{padding:16px 22px}.calculator-picker{max-width:360px;margin-bottom:16px;font-weight:bold}.workspace{display:block}.card{background:#fff;border:1px solid #9aabb9;border-radius:4px;padding:16px;scroll-margin-top:105px}.card-title{display:flex;align-items:center;gap:12px}h2{font-size:20px;margin:0}.hint{font-size:13px;line-height:1.5;color:#485568;margin:8px 0 16px}.fields{display:grid;grid-template-columns:1fr 1fr;gap:12px 16px;max-width:700px}label{display:block;font-size:13px;color:#263e55}label span{float:right;font-size:12px;color:var(--muted)}input,select{display:block;font:inherit;font-size:14px;min-height:40px;background:#fffbd3;color:#16283a;border:1px solid #9aa8b5;border-radius:3px;padding:7px;width:100%;margin-top:5px;min-width:0}input:focus,select:focus,button:focus-visible{outline:2px solid #1768ac;outline-offset:2px}input:invalid{border-color:var(--accent)}button{font:inherit;font-size:13px;min-height:40px;background:var(--accent);border:1px solid var(--accent);border-radius:4px;color:#fff;padding:8px 12px;cursor:pointer}.results{margin-top:16px;border-top:1px solid var(--line);padding-top:14px;display:grid;grid-template-columns:1fr 1fr;gap:14px;font-size:13px;max-width:700px}.metric>span{display:block;color:var(--muted);font-size:12px;margin-bottom:5px}.metric strong{font-size:22px;color:#203c54}.metric small{font-size:12px;font-weight:normal}.detail{grid-column:1/-1;font-size:12px;color:var(--muted);line-height:1.5;margin-bottom:12px}.note{font-size:12px;color:#667586;line-height:1.5;margin:14px 0 0;max-width:850px}.speed-fields{grid-template-columns:repeat(4,minmax(0,1fr));max-width:none}.gear-fields{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;margin:18px 0}.units{margin-left:auto;display:flex;gap:3px}.units button{color:#263e55;background:#edf3f7;border-color:#9aabb9}.units .active{background:var(--accent);border-color:var(--accent);color:white}.table-wrap{overflow-x:auto;border:1px solid #9aabb9;border-radius:4px}table{width:100%;border-collapse:collapse;font-size:14px;white-space:nowrap}th,td{text-align:center;padding:9px 7px;border:1px solid var(--line)}th{font-size:12px;background:#d9e5ee;color:#203c54}tr:nth-child(even){background:#f1f6f9}.speed{font-weight:bold;background:#e6eef5;color:#203c54}td small{font-size:11px;color:var(--muted)}.gear-tag{font-weight:bold}footer{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;padding:18px 22px;border-top:1px solid var(--line);margin-top:16px;color:#6b7986;font-size:12px;line-height:1.5}[hidden]{display:none!important}@media(max-width:760px){header{padding:5px 8px}.brand{font-size:17px;gap:7px}.brand img{width:34px;height:34px}.brand h1{font-size:11px;line-height:1.2;margin:2px 0 0}.app-navigation{padding:10px 8px;gap:12px;font-size:12px;justify-content:flex-start}main{padding:8px 4px}.card{padding:12px;scroll-margin-top:65px}h2{font-size:18px}.speed-fields{grid-template-columns:1fr 1fr}.gear-fields{grid-template-columns:repeat(3,minmax(0,1fr))}.fields{gap:12px}.metric strong{font-size:20px}th,td{font-size:12px;padding:6px 5px}th{font-size:10px}th:first-child,td:first-child{position:sticky;left:0;background:#edf3f7}.units button{font-size:11px;padding:6px 8px}footer{padding:12px 8px}}@media print{header{position:static}.app-navigation,footer button{display:none}.card{break-inside:avoid}body{background:#fff}}
.option-section{margin:16px 0;padding:12px;border:1px solid #b8c5cf;border-radius:4px}.option-section summary,.option-section legend{font-size:14px;font-weight:bold;color:#263e55}.option-section summary{cursor:pointer}.option-section .fields{margin-top:12px}.gear-fields{grid-template-columns:repeat(auto-fit,minmax(110px,1fr))}@media(max-width:760px){.gear-fields{grid-template-columns:repeat(3,minmax(0,1fr))}}
.bike-reference h3{font-size:16px;margin:0 0 12px}.bike-reference>label{max-width:360px}.bike-reference .fields{margin:14px 0}.bike-reference button{margin-top:10px}#vin-fields,#garage-fields{margin:14px 0}#garage-login{max-width:450px}#garage-login label{margin:10px 0}
header{padding:5px 12px}.brand{font-size:19px;gap:8px}.brand img{width:40px;height:40px}.brand h1{margin:2px 0 0}.app-navigation{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;white-space:nowrap;align-items:center}.app-navigation>*{flex-shrink:0}.app-navigation form{margin:0}.app-navigation button{min-height:32px}dialog{max-width:460px;width:calc(100% - 32px)}
@media(prefers-color-scheme:dark){:root{color-scheme:dark;color:#e8edf3;background:#151a20;--line:#536170;--muted:#bbc6d1}header,.app-navigation,.card{background:#202832}.brand h1,label,.option-section summary,.option-section legend{color:#e8edf3}a{color:#8cc9ff}.hint,.note,footer{color:#c1ccd7}input,select{background:#383520;color:#fff5bd;border-color:#82909c}.metric strong{color:#e8edf3}th,.speed{background:#344455;color:#edf4fc}tr:nth-child(even){background:#27323e}.units button{background:#344455;color:#edf4fc}.units .active{background:var(--accent);color:white}th:first-child,td:first-child{background:#344455}}
/* Shared HDCTC branding: logo left, Ramsey Tuning and app title to its right. */
header{padding:18px 22px;justify-content:flex-start}.brand{font-size:25px;gap:12px;letter-spacing:0}.brand img{width:58px;height:58px}.brand h1{font-size:12px;font-weight:normal;margin:5px 0 0;letter-spacing:0}
@media(max-width:760px){header{padding:5px 8px;gap:0}.brand{font-size:17px;gap:7px}.brand img{width:34px;height:34px}.brand h1{font-size:11px;line-height:1.2;margin:2px 0 0}}
