/* Sens Sheet (esportohio.com) v1.0 - "Calibration Bench" design system (SPEC 9). Written fresh for this site. */
@font-face{font-family:"Michroma";src:url("fonts/michroma-latin-400-normal.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Public Sans";src:url("fonts/public-sans-latin-wght-normal.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"Public Sans";src:url("fonts/public-sans-latin-wght-italic.woff2") format("woff2");font-weight:100 900;font-style:italic;font-display:swap}

:root{
  --paper:#f2f3ef; --white:#ffffff; --ink:#0b1220; --ink2:#2b3445; --mute:#5b6576; --rule:#d3d7dd; --rule2:#e4e7ea;
  --cobalt:#2347e8; --cobalt-d:#1a35b3; --amber:#f2a900; --amber-l:#fff3d1; --ok:#0f7a55; --bad:#b4232a;
  --display:"Michroma","Eurostile","Arial Black",sans-serif; --body:"Public Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --w:1180px; --r:2px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:400 1.0625rem/1.6 var(--body);overflow-x:hidden}
img,svg{max-width:100%}
a{color:var(--cobalt)} a:hover{color:var(--cobalt-d)}
:focus-visible{outline:3px solid var(--amber);outline-offset:2px}
.skip{position:absolute;left:-999px;top:0;background:var(--ink);color:#fff;padding:.5rem 1rem;z-index:10}
.skip:focus{left:1rem}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.wrap{max-width:var(--w);margin:0 auto;padding:0 clamp(16px,4vw,40px)}
.num{font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1}
code{font:500 .92em/1.4 ui-monospace,"SFMono-Regular",Consolas,monospace;background:var(--rule2);padding:.1em .35em;border-radius:var(--r)}

/* type */
.display{font:400 clamp(2.1rem,5.2vw,4.1rem)/1.08 var(--display);letter-spacing:-.01em;margin:.4rem 0 1.2rem;text-transform:uppercase}
.h1{font:400 clamp(1.7rem,3.6vw,2.6rem)/1.15 var(--display);text-transform:uppercase;margin:.3rem 0 .8rem}
.h2{font:400 clamp(1.35rem,2.6vw,1.95rem)/1.2 var(--display);text-transform:uppercase;margin:.3rem 0 .9rem}
.h3{font:700 1.35rem/1.3 var(--body);margin:2rem 0 .6rem}
.h4{font:700 1.08rem/1.35 var(--body);margin:1.6rem 0 .5rem}
.eyebrow{font:600 .78rem/1.2 var(--body);letter-spacing:.16em;text-transform:uppercase;color:var(--cobalt);margin:0;display:flex;align-items:center;gap:.6rem}
.eyebrow::before{content:"";width:28px;height:9px;background:repeating-linear-gradient(90deg,currentColor 0 1px,transparent 1px 7px);flex:none}
.eyebrow--light{color:var(--amber)}
.lede{font-size:1.18rem;color:var(--ink2);max-width:60ch;margin:0 0 1.5rem}
.fine{font-size:.88rem;color:var(--mute)}
.meta{color:var(--mute);margin:0}

/* buttons: squared, flat, engineered */
.btn{display:inline-flex;align-items:center;gap:.5rem;font:700 .95rem/1 var(--body);letter-spacing:.02em;padding:.95rem 1.4rem;border:2px solid var(--cobalt);background:var(--cobalt);color:#fff;border-radius:var(--r);text-decoration:none;cursor:pointer}
.btn:hover{background:var(--cobalt-d);border-color:var(--cobalt-d);color:#fff}
.btn--line{background:transparent;color:var(--cobalt)} .btn--line:hover{background:var(--cobalt);color:#fff}
.btn--amber{background:var(--amber);border-color:var(--amber);color:var(--ink)} .btn--amber:hover{background:#ffbf1f;border-color:#ffbf1f;color:var(--ink)}
.btn--danger{background:transparent;color:var(--bad);border-color:var(--bad)} .btn--danger:hover{background:var(--bad);color:#fff}

/* top bar */
.bar{background:var(--white);border-bottom:1px solid var(--rule);position:relative}
.bar::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:6px;background:repeating-linear-gradient(90deg,var(--rule) 0 1px,transparent 1px 10px);pointer-events:none;opacity:.9}
.bar__in{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:72px;flex-wrap:wrap}
.wm{display:flex;align-items:center;gap:.7rem;color:var(--ink);text-decoration:none}
.wm__icon{width:34px;height:34px;color:var(--ink)}
.wm__t{font:400 1.05rem/1 var(--display);text-transform:uppercase;letter-spacing:.04em}
.nav{display:flex;align-items:center;gap:.2rem;flex-wrap:wrap}
.nav a{font:600 .92rem/1 var(--body);color:var(--ink2);text-decoration:none;padding:.7rem .75rem;border-bottom:3px solid transparent}
.nav a:hover{color:var(--cobalt)}
.nav a[aria-current="page"]{color:var(--ink);border-bottom-color:var(--amber)}
.nav .nav__price{margin-left:.6rem;border:1px solid var(--ink);padding:.55rem .8rem;border-radius:var(--r)}
.nav .nav__price span{font-weight:500;color:var(--mute);margin-left:.3rem}

/* hero */
.hero{background:var(--white);border-bottom:1px solid var(--rule)}
.hero__grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(24px,5vw,72px);align-items:center;padding-top:clamp(36px,6vw,80px);padding-bottom:clamp(36px,6vw,80px)}
.quick{border-top:2px solid var(--ink);padding-top:1.1rem;max-width:560px}
.quick__row{display:flex;gap:.75rem;align-items:flex-end;flex-wrap:wrap;margin-bottom:.75rem}
.quick__row label{flex:1 1 180px}
.quick__row .quick__n{flex:0 1 120px}
.quick__out{margin:.6rem 0 0;font-size:1.05rem}
.quick__out strong.num{font:400 1.25rem/1 var(--display);color:var(--cobalt)}
.dial{margin:0;max-width:460px;justify-self:center;width:100%}
.dial svg{display:block;width:100%;height:auto}
.dial__face{fill:var(--paper);stroke:var(--ink);stroke-width:2}
.dial__track{fill:none;stroke:var(--rule);stroke-width:14}
.dial__major{stroke:var(--ink);stroke-width:2.5}
.dial__minor{stroke:var(--mute);stroke-width:1}
.dial__lbl{font:600 13px var(--body);fill:var(--mute)}
.dial__arc{fill:none;stroke:var(--amber);stroke-width:14;stroke-linecap:butt}
.dial__needle{stroke:var(--ink);stroke-width:3}
.dial__hub{fill:var(--ink)}
.dial__big{font:400 50px var(--display);fill:var(--ink)}
.dial__unit{font:600 14px var(--body);fill:var(--mute);letter-spacing:.12em;text-transform:uppercase}
.dial figcaption{text-align:center;color:var(--ink2);font-size:.98rem;margin-top:.6rem;display:flex;gap:.5rem;justify-content:center;align-items:center;flex-wrap:wrap}
.dial__swatch{width:22px;height:8px;background:var(--amber);display:inline-block}

/* form controls */
label{display:block}
label>span{display:block;font:600 .78rem/1.3 var(--body);letter-spacing:.06em;text-transform:uppercase;color:var(--ink2);margin-bottom:.35rem}
input,select,textarea{width:100%;font:500 1rem/1.3 var(--body);color:var(--ink);background:var(--white);border:1px solid #9aa3b0;border-bottom:2px solid var(--ink);border-radius:var(--r);padding:.7rem .75rem;min-height:46px}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--cobalt);box-shadow:0 0 0 3px rgba(35,71,232,.18)}
input[type=radio]{width:auto;min-height:0}
textarea{resize:vertical}
fieldset{border:0;padding:0;margin:0 0 1.4rem}
legend{font:400 .92rem/1.2 var(--display);text-transform:uppercase;letter-spacing:.04em;padding:0;margin-bottom:.9rem}
legend small{font:500 .8rem var(--body);color:var(--mute);text-transform:none;letter-spacing:0}
.two{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}
.panel label{margin-bottom:.85rem}
.custom{display:block}
.js .custom.is-off{display:none}

/* spec strip (Apple-compare style numbers) */
.specs{background:var(--paper)}
.specs__row{display:grid;grid-template-columns:repeat(4,1fr);border-left:1px solid var(--rule)}
.spec{padding:2.2rem 1.4rem;border-right:1px solid var(--rule)}
.spec__v{margin:0;font:400 clamp(1.8rem,3.2vw,2.6rem)/1 var(--display)}
.spec__v small{font:600 .9rem var(--body);color:var(--mute);margin-left:.35rem;text-transform:uppercase;letter-spacing:.08em}
.spec__k{margin:.7rem 0 .4rem;font-weight:700}
.spec__d{margin:0;color:var(--mute);font-size:.95rem}

/* sections */
.tools,.plans,.limits{padding:clamp(48px,7vw,96px) 0}
.tools{background:var(--white);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.sect__head{margin-bottom:2rem}
.ledger{list-style:none;margin:0;padding:0;border-top:2px solid var(--ink)}
.ledger li{display:grid;grid-template-columns:90px 1fr auto;gap:1.5rem;align-items:center;padding:1.6rem 0;border-bottom:1px solid var(--rule)}
.ledger__n{font:400 2rem/1 var(--display);color:var(--cobalt)}
.ledger h3{margin:0 0 .3rem;font:700 1.2rem/1.3 var(--body)}
.ledger p{margin:0;color:var(--ink2);max-width:70ch}
.ledger__go{font-weight:700;text-decoration:none;white-space:nowrap;border-bottom:2px solid var(--amber);padding-bottom:2px;color:var(--ink)}
.ledger__go::after{content:" \2192"}
.pill-free{font:700 .72rem/1 var(--body);letter-spacing:.08em;text-transform:uppercase;border:1px solid var(--ink);padding:.2rem .4rem;margin-left:.3rem;white-space:nowrap}

.showcase{background:var(--ink);color:#e9ecf2;padding:clamp(48px,7vw,96px) 0}
.showcase .h2{color:#fff}
.showcase__grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(24px,5vw,64px);align-items:center}
.paper{background:var(--paper);color:var(--ink);padding:1.4rem;border-top:6px solid var(--amber);box-shadow:0 30px 60px rgba(0,0,0,.35)}
.paper__head{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;font-weight:700;border-bottom:2px solid var(--ink);padding-bottom:.6rem;margin-bottom:.4rem}
.paper__head span:last-child{font-weight:500;color:var(--mute);font-size:.9rem}
.paper__foot{font-size:.82rem;color:var(--mute);margin:.8rem 0 0}
.sheet-t{width:100%;border-collapse:collapse}
.sheet-t th{font:600 .72rem/1.2 var(--body);text-transform:uppercase;letter-spacing:.08em;color:var(--mute);text-align:left;padding:.6rem .4rem;border-bottom:1px solid var(--rule)}
.sheet-t td{padding:.7rem .4rem;border-bottom:1px solid var(--rule)}
.sheet-t td.num,.sheet-t th:not(:first-child){text-align:right}
.sheet-t em{font-style:normal;font:700 .65rem/1 var(--body);text-transform:uppercase;background:var(--amber);padding:.15rem .3rem;margin-left:.3rem;vertical-align:middle}

/* compare table */
.stamp{display:inline-block;background:var(--amber-l);border-left:4px solid var(--amber);padding:.6rem .9rem;margin:0;font-weight:600}
.cmp{border-top:2px solid var(--ink);background:var(--white)}
.cmp__row{display:grid;grid-template-columns:1.4fr 1fr 1fr;border-bottom:1px solid var(--rule)}
.cmp__row>div{padding:1rem 1.1rem}
.cmp__row>div.is-pass{background:#f6f8ff;border-left:1px solid var(--rule)}
.cmp__row--head>div{padding-top:1.4rem;padding-bottom:1.4rem}
.cmp__plan{font:400 .95rem/1 var(--display);text-transform:uppercase;margin:0 0 .6rem}
.cmp__price{font:400 2.4rem/1 var(--display);margin:0}
.cmp__price small{font:600 .9rem var(--body);color:var(--mute)}
.cmp__per{margin:.5rem 0 0;color:var(--mute);font-size:.92rem}
.cmp__free{display:inline-block;margin:.7rem 0 0;font:700 .78rem/1 var(--body);text-transform:uppercase;letter-spacing:.08em;background:var(--amber);padding:.35rem .5rem}
.cmp__note{color:var(--mute);font-size:.92rem;max-width:80ch}
.limits{background:var(--paper)}
.limits__grid{display:grid;grid-template-columns:1fr 2fr;gap:2rem}
.limits ul{margin:0;padding-left:1.1rem}
.limits li{margin-bottom:.6rem}
.limits .h3{margin-top:0}

/* inner pages */
.page-head{background:var(--white);border-bottom:1px solid var(--rule);padding:clamp(32px,5vw,64px) 0 clamp(20px,3vw,36px)}
.tool{padding:clamp(28px,4vw,56px) 0 clamp(48px,6vw,80px)}
.tool__grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(24px,4vw,56px);align-items:start}
.panel{background:var(--white);border:1px solid var(--rule);border-top:4px solid var(--ink);padding:1.4rem}
.result{min-width:0}
.result__k{margin:0;font-size:1.1rem}
.result__v{font:400 clamp(3rem,8vw,5.5rem)/1 var(--display);color:var(--cobalt);margin:.4rem 0 .6rem}
.readout{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:0;border-top:2px solid var(--ink);margin:1.4rem 0}
.readout div{padding:.9rem .9rem .9rem 0;border-bottom:1px solid var(--rule)}
.readout dt{font:600 .74rem/1.3 var(--body);text-transform:uppercase;letter-spacing:.08em;color:var(--mute)}
.readout dd{margin:.3rem 0 0;font:400 1.35rem/1.2 var(--display)}
.tbl{width:100%;border-collapse:collapse;background:var(--white);margin:.6rem 0 1.4rem}
.tbl th{font:600 .74rem/1.2 var(--body);text-transform:uppercase;letter-spacing:.08em;color:var(--mute);text-align:left;padding:.7rem .7rem;border-bottom:2px solid var(--ink)}
.tbl td{padding:.7rem;border-bottom:1px solid var(--rule)}
.tbl td.num{text-align:right}
.tbl tr.is-anchor td{background:var(--amber-l)}
.errs{border-left:4px solid var(--bad);background:#fff1f1;padding:.8rem 1rem;margin-bottom:1rem}
.errs p{margin:0 0 .3rem;font-weight:700}
.errs ul{margin:0;padding-left:1.1rem}
.note{border-left:4px solid var(--ok);background:#eefaf4;padding:.9rem 1.1rem;margin-bottom:1.2rem}
.note--key{border-left-color:var(--amber);background:var(--amber-l)}
.note--key .h4{margin-top:0}
.key{margin:.4rem 0}
.key code{font-size:1rem;word-break:break-all;background:var(--white);display:inline-block;padding:.5rem .6rem;border:1px dashed var(--ink)}
.tag{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem 1rem;border:1px solid var(--ink);background:var(--white);padding:.8rem 1rem;margin:1.4rem 0;font-size:.95rem}
.tag__k{font:400 .8rem/1 var(--display);text-transform:uppercase}
.tag__v{font-weight:700}
.tag__w{color:var(--ink2);flex:1 1 260px}
.tag__p{font:700 .74rem/1 var(--body);text-transform:uppercase;letter-spacing:.08em;background:var(--amber);padding:.35rem .5rem}
.tag__a{font-weight:700}
.locked{border:1px dashed var(--ink);padding:1.2rem;background:var(--white)}
.locked .h3{margin-top:0}

/* sheet editor */
.subnav{display:flex;gap:1.2rem;flex-wrap:wrap;margin-bottom:1rem;border-bottom:1px solid var(--rule)}
.subnav a{font-weight:700;text-decoration:none;padding:.6rem 0;border-bottom:3px solid transparent}
.subnav a:hover{border-bottom-color:var(--amber)}
.sheetf{background:var(--white);border:1px solid var(--rule);border-top:4px solid var(--ink);padding:1.4rem}
.grid4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.85rem}
.grid4 .span2{grid-column:span 2}
.games{display:grid;gap:.8rem}
.game{border:1px solid var(--rule);border-left:4px solid var(--rule);padding:.9rem;background:var(--paper)}
.game:has(input[type=radio]:checked){border-left-color:var(--amber)}
.game__top{display:flex;flex-wrap:wrap;gap:.6rem;align-items:flex-end}
.game__top>label{flex:1 1 100px;min-width:0}
.game__top>.game__anchor{flex:0 0 auto}
.game__top>.game__label{flex:2 1 170px}
.game__top>.game__scale{flex:2 1 200px}
.game__top>.custom{flex:1 1 120px}
.game__anchor{display:flex;flex-direction:column;align-items:center;gap:.3rem;padding-bottom:.6rem}
.game__anchor span{margin:0}
.game__anchor input{width:20px;height:20px;accent-color:var(--amber)}
.game__notes{margin-top:.6rem}
.game__calc{display:flex;flex-wrap:wrap;gap:.4rem 1.4rem;margin:.6rem 0 0;font-size:.92rem;color:var(--ink2)}
.game__calc b{font-weight:700;color:var(--ink)}
.sheetf__notes{margin:0 0 1rem}
.sheetf__go{display:flex;justify-content:flex-end}
.del{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;margin-top:2rem;padding-top:1.4rem;border-top:1px solid var(--rule)}
.hist{list-style:none;padding:0;margin:0;border-top:2px solid var(--ink)}
.hist>li{padding:1rem 0;border-bottom:1px solid var(--rule);display:grid;grid-template-columns:220px 1fr;gap:1rem}
.hist__when{margin:0;font-weight:700}
.hist__when span{color:var(--mute);font-weight:500;font-size:.85rem}
.hist ul{margin:0;padding-left:1.1rem}

/* prose */
.prose{padding-top:2rem;padding-bottom:4rem;max-width:860px}
.prose li{margin-bottom:.6rem}
.formula{list-style:none;padding:1rem 1.2rem;background:var(--white);border-left:4px solid var(--cobalt);font-variant-numeric:tabular-nums}
.faq{display:grid;grid-template-columns:1fr 1fr;gap:0 2.5rem;margin-top:2.5rem}
.faq p{color:var(--ink2);margin-top:0}
.msg{padding:clamp(48px,8vw,110px) clamp(16px,4vw,40px)}
.msg__links{display:flex;gap:.8rem;flex-wrap:wrap}

/* footer */
.foot{background:var(--ink);color:#c5ccd8;padding:3.2rem 0 1.6rem;position:relative}
.foot::before{content:"";position:absolute;left:0;right:0;top:0;height:10px;background:repeating-linear-gradient(90deg,#46516a 0 1px,transparent 1px 10px)}
.foot a{color:#fff}
.foot__grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:2rem}
.foot__wm{font:400 1rem var(--display);text-transform:uppercase;color:#fff;margin:0 0 .6rem}
.foot h2{font:600 .78rem/1 var(--body);text-transform:uppercase;letter-spacing:.14em;color:var(--amber);margin:.2rem 0 .9rem}
.foot ul{list-style:none;padding:0;margin:0}
.foot li{margin-bottom:.45rem}
.indep{font-size:.86rem;line-height:1.55;border-top:1px solid #2a3447;margin:2rem 0 0;padding-top:1.2rem;color:#aeb7c6}
.foot__base{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;font-size:.86rem;margin-top:1.2rem}

/* print page */
.printsheet{padding:2rem 0 3rem}
.printsheet__head{border-bottom:2px solid var(--ink);margin-bottom:1rem}
.tbl--print td,.tbl--print th{font-size:.92rem}
@media print{
  .bar .nav,.noprint,.skip{display:none!important}
  body{background:#fff}
  .foot{background:#fff;color:#000;padding:1rem 0}
  .foot::before,.foot__grid{display:none}
  .foot a{color:#000}
  .indep{color:#333;border-color:#ccc}
}

/* responsive */
@media (max-width:980px){
  .hero__grid,.showcase__grid,.tool__grid{grid-template-columns:1fr}
  .dial{max-width:380px}
  .specs__row{grid-template-columns:1fr 1fr}
  .spec{border-bottom:1px solid var(--rule)}
  .limits__grid,.faq{grid-template-columns:1fr}
}
@media (max-width:640px){
  body{font-size:1rem}
  .bar__in{padding-top:.6rem;padding-bottom:.2rem;min-height:0}
  .nav{width:100%;display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--rule2)}
  .nav a{text-align:center;padding:.75rem .2rem;font-size:.86rem}
  .nav .nav__price{grid-column:span 3;margin:.4rem 0 .4rem;text-align:center}
  .ledger li{grid-template-columns:1fr;gap:.5rem}
  .ledger__n{font-size:1.4rem}
  .specs__row{grid-template-columns:1fr}
  .spec{padding:1.4rem 1rem}
  .cmp__row{grid-template-columns:1.2fr 1fr 1fr}
  .cmp__row>div{padding:.75rem .55rem;font-size:.9rem}
  .cmp__price{font-size:1.5rem}
  .cmp__plan{font-size:.75rem}
  .grid4{grid-template-columns:1fr 1fr}
  .game__top{display:grid;grid-template-columns:1fr 1fr}
  .game__top .game__scale{grid-column:span 2}
  .game__anchor{flex-direction:row;grid-column:span 2;justify-content:flex-start;padding:0}
  .game__top .game__label{grid-column:span 2}
  .two{grid-template-columns:1fr}
  .hist>li{grid-template-columns:1fr;gap:.3rem}
  .foot__grid{grid-template-columns:1fr 1fr}
  .foot__lead{grid-column:span 2}
  .quick__row .quick__n{flex:1 1 40%}
  .tbl th,.tbl td{padding:.55rem .4rem}
  .tbl--print{display:block;overflow-x:auto}
}
/* ---------- v1.1.0: AdEngine banner (adengine.us) ----------
   One labelled slot between the main content and the footer, on the public pages only (the controllers opt in). The label
   and the reserved height are on the <ins>, so when tag.js (or ae-size.js) hides a slot it cannot fill, the label, the
   reserved space and the space below go with it. 110px = 16px label + 4px gap + 90px banner; 270px on phones (300x250).
   Every ad page ends with its own bottom padding on the paper background, so the slot needs space only below it, before
   the dark footer, kept on the <ins>. display stays in this file and is never !important: tag.js hides a slot with
   style.display='none'. */
.ae-slot{padding:0 clamp(16px,4vw,40px)}
.ae-slot ins.adengine{display:block;max-width:728px;min-height:110px;margin:0 auto clamp(40px,6vw,64px);text-align:center;text-decoration:none}
.ae-slot ins.adengine::before{content:"Advertisement";display:block;margin-bottom:4px;font:600 11px/16px var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
.ae-slot ins.adengine a{display:inline-block;vertical-align:top}
.ae-slot:has(> ins.adengine[style*="none"]){display:none}
@media (max-width:767px){.ae-slot ins.adengine{max-width:300px;min-height:270px}}
@media print{.ae-slot{display:none}}
