/* Owner's mobile annotations, 15 October 2026. Ceramic Frost, exact AUXE blue. */
body.pm-premium .measure{width:100%;max-width:440px;margin:8px auto 0;display:flex;flex-direction:column;align-items:center;gap:16px;user-select:none;-webkit-user-select:none}
body.pm-premium .measure-reading{width:100%;text-align:center}
body.pm-premium .measure-value{display:inline-flex;align-items:baseline;justify-content:center;gap:8px;max-width:100%;min-height:72px;padding:0 8px;border:0;background:transparent;color:var(--bp,#A7CFF2);font:inherit;cursor:pointer}
body.pm-premium .measure-value b{font-size:clamp(48px,17vw,68px);font-weight:800;letter-spacing:-.05em;line-height:1.1;font-variant-numeric:tabular-nums;color:var(--bp,#A7CFF2)}
body.pm-premium .measure-value span,body.pm-premium .measure-value small{font-size:18px;font-weight:700;letter-spacing:0;color:var(--bp,#A7CFF2);margin-left:3px}
body.pm-premium .measure-ruler{position:relative;width:100%;height:96px;overflow:hidden;border-radius:18px;background:linear-gradient(180deg,#e9eae8,#fdfdfb 58%,#f2f3f1);box-shadow:inset 0 2px 5px rgba(46,45,42,.09),0 1px 0 #fff;touch-action:pan-y;cursor:ew-resize}
body.pm-premium .measure-ruler:before,body.pm-premium .measure-ruler:after{content:"";position:absolute;top:0;bottom:0;width:24px;z-index:2;pointer-events:none;background:linear-gradient(90deg,#f0f1ee,rgba(240,241,238,0))}
body.pm-premium .measure-ruler:before{left:0}body.pm-premium .measure-ruler:after{right:0;transform:rotate(180deg)}
body.pm-premium .measure-ticks{position:absolute;inset:0}
body.pm-premium .measure-tick{position:absolute;top:20px;width:1px;height:18px;background:#a7a7a2}
body.pm-premium .measure-tick.major{height:30px;width:2px;background:#777a77}
body.pm-premium .measure-tick em{position:absolute;top:38px;left:50%;transform:translateX(-50%);font-size:var(--ui-meta,14px);line-height:1;font-style:normal;font-weight:700;white-space:nowrap;color:var(--ink-2,#346586);font-variant-numeric:tabular-nums}
body.pm-premium .measure-marker{position:absolute;left:calc(50% - 2px);top:10px;width:4px;height:45px;border-radius:2px;background:var(--bp,#A7CFF2);box-shadow:0 0 0 2px #fafbf9}
body.pm-premium .measure-marker:before{content:"";position:absolute;left:-3px;top:-1px;width:10px;height:6px;border-radius:3px;background:var(--bp,#A7CFF2)}
body.pm-premium .measure-adjust{display:flex;align-items:center;justify-content:center;gap:20px}
body.pm-premium .measure-adjust button{display:grid;place-items:center;width:48px;height:48px;border:0;border-radius:14px;background:var(--vr-key,#fff);box-shadow:var(--vr-key-edge,0 2px 4px #d1d1cd);color:var(--bp,#A7CFF2);font:inherit;font-size:26px;line-height:1;cursor:pointer}
body.pm-premium .measure-adjust button:disabled{opacity:.4;cursor:default}
body.pm-premium .measure-adjust span{font-size:var(--ui-meta,14px);font-weight:700;color:var(--ink-2,#346586);min-width:100px;text-align:center}
body.pm-premium .measure-help{margin:0;max-width:100%;font-size:var(--ui-meta,14px);line-height:1.5;text-align:center;color:var(--ink-2,#346586)}
body.pm-premium .measure button:focus-visible,body.pm-premium .measure-ruler:focus-visible{outline:2px solid #31658a;outline-offset:4px}
body.pm-premium #onb .onb-hrow{display:flex;flex-direction:column;align-items:center;gap:4px;max-width:440px;width:100%;margin:4px auto 0}
body.pm-premium #onb .onb-hfig{height:145px!important;width:112px!important;min-height:0;flex:none}
body.pm-premium #onb .onb-hfig .hfig{height:145px!important;width:112px!important;min-height:0}
body.pm-premium #onb #onbH{width:100%;min-width:0;flex:none}
body.pm-premium #onb #onbH .measure{gap:10px;margin-top:0}
body.pm-premium #onb #onbH .measure-value{min-height:54px}
body.pm-premium #onb #onbH .measure-value b{font-size:46px}
body.pm-premium #onb #onbH .measure-ruler{height:84px}
body.pm-premium #onb .onb-num,body.pm-premium #onb .onb-age{width:100%;max-width:440px;margin:18px auto}
body.pm-premium #eat>.kicker.wm,body.pm-premium #eat #fuelCard #calLeft{color:var(--bp,#A7CFF2)!important}
body.pm-premium #eat #aiFoodSec .fh,body.pm-premium #eat #aiFoodSec .fh b,body.pm-premium #eat #aiFoodSec .fh svg,body.pm-premium #eat #aiFoodSec #aiFoodGo{color:var(--bp,#A7CFF2)!important}
body.pm-premium #eat #aiFoodSec .fh svg{stroke:var(--bp,#A7CFF2)!important}
body.pm-premium #waterSec .vessel.wbp{width:150px!important;height:250px!important}
body.pm-premium #waterSec .vessel.wbp .wb{filter:drop-shadow(0 8px 7px rgba(46,45,42,.1))}
@media(max-height:700px){body.pm-premium .measure{gap:10px}body.pm-premium .measure-value{min-height:58px}body.pm-premium .measure-value b{font-size:48px}body.pm-premium .measure-ruler{height:84px}body.pm-premium #onb .onb-num,body.pm-premium #onb .onb-age{margin:10px auto}body.pm-premium #onb .onb-hfig,body.pm-premium #onb .onb-hfig .hfig{height:90px!important}body.pm-premium #onb #onbH .measure{gap:6px}body.pm-premium #onb #onbH .measure-value{min-height:46px}body.pm-premium #onb #onbH .measure-value b{font-size:38px}body.pm-premium #onb #onbH .measure-ruler{height:76px}}
@media(prefers-reduced-motion:reduce){body.pm-premium .measure *{transition:none!important;animation:none!important}}/* Match the neighbouring capture keys; blue text needs a porcelain surface. */

body.pm-premium #eat #aiFoodSec #fhPhoto{background:var(--vr-key,#fff)!important}
@media(max-height:700px){body.pm-premium #onb .onb-hfig{display:none!important}body.pm-premium #onb .measure{gap:8px}body.pm-premium #onb .onb-num,body.pm-premium #onb .onb-age{margin:6px auto}body.pm-premium #onb .measure-ruler{height:76px}}
body.pm-premium .measure button{touch-action:manipulation}
body.pm-premium .measure-adjust button:not(:disabled):active{transform:translateY(1px);box-shadow:inset 0 2px 5px rgba(46,45,42,.16)}
@media(hover:hover){body.pm-premium .measure-adjust button:not(:disabled):hover{background:#edf5fb}}/* the plate and the odometer stand in the ruler's place: no well, no fades, the object is the control */

body.pm-premium .measure-ruler.measure-object{height:auto!important;overflow:visible!important;background:none!important;box-shadow:none!important;border-radius:24px;touch-action:none;cursor:grab}
body.pm-premium .measure-ruler.measure-object:active{cursor:grabbing}
body.pm-premium .measure-ruler.measure-object:before,body.pm-premium .measure-ruler.measure-object:after{display:none!important}
:root[data-theme="dark"] body.pm-premium .measure-ruler.measure-object{background:none!important;box-shadow:none!important}
/* short phones: the tape says how it works by itself, so its help line steps aside to keep Continue on screen */
@media (max-height:700px){ .measure.has-object .measure-tape ~ .measure-help, .measure-ruler.measure-tape ~ .measure-adjust + .measure-help{display:none} }
