@font-face{font-family:Inter;src:url(/inter.woff2) format("woff2");font-weight:100 900;font-display:swap}
:root{color-scheme:dark;--bg:#071b23;--panel:#102a34;--border:#2c4d56;--ink:#eaf9f5;--soft:#a8c4c6;--signal:#82e9c8;--warn:#ffd1a5;--mono:ui-monospace,Menlo,Consolas,monospace;--sans:Inter,system-ui,sans-serif}
*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;background:var(--bg);color:var(--ink);font:14px/1.55 var(--sans)}a{color:var(--signal);text-underline-offset:.24em}a:hover{text-decoration-thickness:2px}button,input,select{font:inherit;color:inherit}button{cursor:pointer}button:disabled{cursor:default;opacity:.47}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--signal);outline-offset:3px}.wrap{width:min(1140px,calc(100% - 62px));margin:auto}.top{padding:1.12rem 0;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;gap:1rem;font-size:.81rem}.brand{color:var(--ink);text-decoration:none;font-weight:780;font-size:1.17rem;display:flex;align-items:center;gap:.53rem;letter-spacing:-.04em}.mark{display:flex;align-items:end;justify-content:center;gap:3px;width:30px;height:30px;background:var(--signal);padding:6px 5px;border-radius:7px}.mark i{width:4px;height:42%;background:#11323b;border-radius:2px}.mark i:nth-child(2){height:70%}.mark i:nth-child(3){height:100%}
.intro{display:grid;grid-template-columns:1fr 305px;align-items:end;gap:1.4rem;padding:2.55rem 0 1.75rem}.intro h1,.guide h1{font-size:clamp(4rem,9.3vw,7.1rem);line-height:.86;letter-spacing:-.065em;font-weight:780;margin:0}.intro h1 em{font-style:normal;color:var(--signal)}.intro p{margin:0 0 .45rem;color:var(--soft);max-width:34ch;font-size:1rem}.workbench{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.07fr);gap:.8rem}.panel{background:var(--panel);border:1px solid var(--border);border-radius:10px;padding:1rem 1.12rem;min-width:0}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:.55rem;margin-bottom:.8rem}.panel h2{font-size:1rem;letter-spacing:-.025em;margin:0}.preset{display:flex;align-items:center;font-size:.73rem;color:var(--soft);gap:.4rem;white-space:nowrap}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem}.form-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.form-grid label{color:var(--soft);font-size:.74rem;font-weight:650;display:grid;gap:.3rem}.field{position:relative;display:block}.field input,.preset select,.field select{background:#0b2029;border:1px solid #47626b;border-radius:6px;padding:.36rem .48rem}.field input{width:100%;min-width:0;padding-right:2.85rem;font:650 .87rem/1.7 var(--mono);appearance:textfield}.field input::-webkit-inner-spin-button{appearance:none}.field span{position:absolute;right:.47rem;top:.52rem;font:550 .75rem var(--mono);pointer-events:none}.field.distance{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.35rem}.field.distance input{padding-right:.42rem}.field select{padding:.3rem .37rem;font-size:.76rem}.inputs fieldset{margin:.72rem 0 0;border:1px solid var(--border);border-radius:7px;padding:.5rem .6rem .59rem;min-width:0}.inputs legend{padding:0 .35rem;color:var(--soft);font-size:.79rem;font-weight:700}.bottom{margin-top:.7rem}.hint{color:var(--soft);font-size:.76rem;margin:.57rem 0 0}.actions{display:flex;gap:.4rem;flex-wrap:wrap}.actions button,.distance-results button{border:1px solid #426670;background:#173945;border-radius:6px;padding:.36rem .55rem;font-size:.76rem;font-weight:700;white-space:nowrap}.actions button:hover,.distance-results button:hover{background:#255262}.actions .primary{color:#14303a;background:var(--signal);border-color:var(--signal)}.actions .primary:hover{background:#b9f9e2}.error{border-radius:6px;background:#623b46;color:#fff0e5;margin:.3rem 0;padding:.55rem;font-weight:620}.hero-metric{background:#09212c;border:1px solid #2e5861;border-radius:8px;padding:.76rem .8rem;display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:.5rem}.hero-metric>div{display:grid}.hero-metric span,.metrics dt{color:var(--soft);font-size:.76rem;font-weight:640}.hero-metric strong{font:760 clamp(1.9rem,4.9vw,3.35rem)/1.16 var(--mono);letter-spacing:-.052em;color:var(--signal);overflow-wrap:anywhere}.hero-metric p{color:var(--signal);font-size:.75rem;font-weight:650;margin:0}.hero-metric p.warning{color:var(--warn)}.metrics{display:grid;grid-template-columns:1fr 1fr;margin:.7rem 0;gap:.58rem}.metrics div{border-bottom:1px solid var(--border);padding:.48rem .35rem}.metrics dd{font:720 1.08rem/1.4 var(--mono);margin:.12rem 0 0;overflow-wrap:anywhere}.ideal{display:flex;justify-content:space-between;gap:.6rem;font-size:.79rem;margin:.8rem 0 0;color:var(--soft)}.ideal strong{color:var(--ink);font-family:var(--mono);text-align:right}.result textarea{display:block;width:100%;min-height:7rem;margin-top:.5rem;background:#09212c;color:var(--ink);border:1px solid var(--border);border-radius:6px}.result #notice:empty{display:none}
.compare{grid-column:1/-1}.compare .panel-heading p{margin:0;color:var(--soft);font-size:.74rem}.compare-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(258px,1fr);gap:.8rem}.chart-frame{border:1px solid var(--border);border-radius:7px;background:#0a212b;overflow:hidden}.chart-frame canvas{display:block;width:100%;height:188px}.distance-results table{border-collapse:collapse;width:100%;text-align:right;font:600 .79rem/1.3 var(--mono)}.distance-results th,.distance-results td{padding:.42rem .35rem;border-bottom:1px solid var(--border)}.distance-results th{color:var(--soft);font:.69rem var(--sans)}.distance-results :is(th,td):first-child{text-align:left}.distance-results button[aria-pressed="true"]{border-color:#79a99e;color:var(--signal)}.more{margin:2.1rem 0 2.65rem;max-width:61ch}.more h2{margin:0;font-size:1.5rem;letter-spacing:-.04em}.more p{color:var(--soft);margin:.45rem 0}.footer{border-top:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:1rem 0 1.6rem;gap:.75rem;font-size:.79rem}.skip{position:absolute;top:.5rem;left:.5rem;transform:translateY(-200%);padding:.4rem;background:var(--panel);z-index:5}.skip:focus{transform:none}
.guide{width:min(725px,calc(100% - 62px));padding:3rem 0}.guide h1{font-size:clamp(3.25rem,8vw,5.55rem);line-height:.91}.guide .lead{font-size:1.12rem;color:var(--soft);max-width:53ch}.guide h2{font-size:1.45rem;letter-spacing:-.035em;margin:1.8rem 0 .42rem}.guide-cta{display:inline-block;padding:.5rem .78rem;background:var(--signal);color:#14303a;border-radius:6px;font-weight:720;text-decoration:none}
@media(max-width:760px){.wrap{width:calc(100% - 32px)}.intro{grid-template-columns:1fr 200px;gap:.7rem}.panel{padding:.78rem}.preset{gap:.24rem}.compare-grid{gap:.55rem}}
@media(max-width:590px){.wrap{width:calc(100% - 24px)}.top{padding:.85rem 0}.intro{grid-template-columns:1fr;padding:1.7rem 0 1.15rem}.intro h1{font-size:clamp(3.9rem,14vw,5.7rem)}.intro p{max-width:38ch}.workbench,.compare-grid{grid-template-columns:1fr}.result{grid-row:1}.inputs{scroll-margin-top:.5rem}.panel-heading h2{white-space:nowrap}.panel-heading{flex-wrap:wrap}.chart-frame canvas{height:160px}.guide{padding-top:2rem}}
