:root{--ink: #112e2e;--ink-2: #2c4a48;--ink-3: #5d7572;--bg: #e7eeeb;--surface: #ffffff;--surface-2: #f3f7f5;--line: #d4dfdb;--on-ink: #f4faf8;--on-ink-soft: rgba(244, 250, 248, .62);--accent: #f2542d;--accent-strong: #d33d1c;--accent-soft: #fde7df;--cadence: #0e9c8a;--cadence-bright: #2bd4be;--cadence-soft: #d8f1ec;--warning: #c97a00;--warning-soft: #fbf0d7;--danger: #c2401f;--danger-soft: #fae2db;--axis-x: #f2542d;--axis-y: #0e9c8a;--axis-z: #2c6bd4;--radius-sm: 8px;--radius-md: 14px;--radius-lg: 24px;--radius-pill: 999px;--shadow-sm: 0 1px 2px rgba(17, 46, 46, .06), 0 1px 1px rgba(17, 46, 46, .04);--shadow-md: 0 8px 24px rgba(17, 46, 46, .08), 0 2px 6px rgba(17, 46, 46, .05);--shadow-hero: 0 24px 48px rgba(12, 36, 34, .28), 0 4px 12px rgba(12, 36, 34, .18);--font-display: "Space Grotesk", "Zen Kaku Gothic New", sans-serif;--font-jp: "Zen Kaku Gothic New", -apple-system, BlinkMacSystemFont, "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic UI", "Meiryo", sans-serif;--font-mono: "Space Grotesk", ui-monospace, SFMono-Regular, Menlo, monospace}*{box-sizing:border-box}html,body{margin:0;padding:0;min-height:100%}body{background-color:var(--bg);background-image:radial-gradient(120% 80% at 50% -10%,rgba(14,156,138,.12),transparent 60%),radial-gradient(90% 60% at 100% 0%,rgba(242,84,45,.06),transparent 55%);background-attachment:fixed;color:var(--ink);font-family:var(--font-jp);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-webkit-tap-highlight-color:transparent}#root{min-height:100%;display:flex;flex-direction:column}:focus-visible{outline:2.5px solid var(--cadence);outline-offset:2px;border-radius:4px}.app{width:100%;max-width:460px;margin:0 auto;padding:14px 18px calc(28px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:18px}.topbar{display:flex;align-items:center;justify-content:space-between;padding:8px 2px 2px}.brand{display:flex;align-items:center;gap:11px}.brand__mark{width:38px;height:38px;border-radius:11px;background:linear-gradient(155deg,var(--cadence) 0%,var(--ink) 95%);display:grid;place-items:center;box-shadow:var(--shadow-sm)}.brand__mark svg{width:21px;height:21px;display:block}.brand__text{display:flex;flex-direction:column;line-height:1.1}.brand__eyebrow{font-family:var(--font-display);font-size:11px;font-weight:700;letter-spacing:.34em;text-transform:uppercase;color:var(--cadence)}.brand__name{font-family:var(--font-jp);font-size:17px;font-weight:700;letter-spacing:.06em;color:var(--ink)}.status-pill{display:inline-flex;align-items:center;gap:7px;padding:6px 12px 6px 10px;border-radius:var(--radius-pill);font-size:12px;font-weight:700;letter-spacing:.04em;border:1px solid var(--line);background-color:var(--surface);color:var(--ink-3);box-shadow:var(--shadow-sm)}.status-pill__dot{width:8px;height:8px;border-radius:50%;background-color:var(--ink-3);flex:none}.status-pill--running{color:var(--cadence);border-color:var(--cadence-soft);background-color:var(--cadence-soft)}.status-pill--running .status-pill__dot{background-color:var(--cadence);box-shadow:0 0 #0e9c8a80;animation:pulse-dot 1.6s ease-out infinite}@keyframes pulse-dot{0%{box-shadow:0 0 #0e9c8a80}70%{box-shadow:0 0 0 7px #0e9c8a00}to{box-shadow:0 0 #0e9c8a00}}.app__main{display:flex;flex-direction:column;gap:16px}.footnotes{margin-top:4px;font-size:11px;line-height:1.6;color:var(--ink-3);text-align:center}.footnotes p{margin:2px 0}.hero{position:relative;border-radius:var(--radius-lg);padding:26px 22px 22px;background:radial-gradient(130% 90% at 50% 0%,#1a4441 0%,transparent 60%),linear-gradient(165deg,#143a37,#0c2422);color:var(--on-ink);box-shadow:var(--shadow-hero);overflow:hidden}.hero:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:28px 28px;-webkit-mask-image:radial-gradient(80% 70% at 50% 30%,#000 0%,transparent 80%);mask-image:radial-gradient(80% 70% at 50% 30%,#000 0%,transparent 80%);pointer-events:none}.hero__dial{position:relative;width:248px;max-width:78%;aspect-ratio:1 / 1;margin:4px auto 18px;display:grid;place-items:center}.hero--running .hero__dial{animation:cadence-breathe 1.7s ease-in-out infinite}@keyframes cadence-breathe{0%,to{transform:scale(1)}50%{transform:scale(1.018)}}.cadence-ring{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;transform:rotate(-90deg)}.cadence-ring__track{fill:none;stroke:#ffffff1a;stroke-width:9}.cadence-ring__progress{fill:none;stroke:var(--cadence-bright);stroke-width:9;stroke-linecap:round;filter:drop-shadow(0 0 6px rgba(43,212,190,.55));transition:stroke-dashoffset 90ms linear,stroke .24s ease}.cadence-ring__progress--idle{stroke:#ffffff38;filter:none}.hero__readout{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center}.hero__label{font-size:11px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--on-ink-soft)}.hero__value{font-family:var(--font-display);font-size:68px;font-weight:600;line-height:.96;letter-spacing:-.02em;font-variant-numeric:tabular-nums;margin-top:6px}.hero__unit{font-family:var(--font-jp);font-size:20px;font-weight:500;margin-left:4px;color:var(--on-ink-soft);letter-spacing:0}.hero__cadence{margin-top:8px;font-family:var(--font-display);font-size:12px;font-weight:500;letter-spacing:.08em;color:var(--cadence-bright);min-height:1em}.hero__cadence--idle{color:var(--on-ink-soft)}.hero__metrics{position:relative;display:grid;grid-template-columns:repeat(3,1fr);margin:0;padding-top:18px;border-top:1px solid rgba(255,255,255,.14)}.hero__metric{margin:0;min-width:0;text-align:center;padding:0 6px}.hero__metric+.hero__metric{border-left:1px solid rgba(255,255,255,.12)}.hero__metric dt{font-size:10.5px;font-weight:700;letter-spacing:.12em;color:var(--on-ink-soft);white-space:nowrap;word-break:keep-all}.hero__metric dd{margin:5px 0 0;font-family:var(--font-display);font-size:19px;font-weight:600;font-variant-numeric:tabular-nums;color:var(--on-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hero__metric-unit{font-family:var(--font-jp);font-size:11px;font-weight:500;margin-left:2px;color:var(--on-ink-soft)}.actions{display:grid;grid-template-columns:1fr auto;gap:10px}.button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1.5px solid transparent;border-radius:var(--radius-pill);padding:14px 22px;font-family:var(--font-jp);font-size:15px;font-weight:700;letter-spacing:.04em;cursor:pointer;min-height:52px;white-space:nowrap;transition:background-color .14s ease,border-color .14s ease,color .14s ease,box-shadow .14s ease,transform 90ms ease}.button:active{transform:translateY(1px) scale(.99)}.button:disabled{cursor:not-allowed;opacity:.45}.button--primary{background-color:var(--accent);color:#fff;box-shadow:0 8px 18px #f2542d47}.button--primary:hover:not(:disabled){background-color:var(--accent-strong)}.button--danger{background-color:var(--ink);color:var(--on-ink);box-shadow:0 8px 18px #112e2e3d}.button--danger:hover:not(:disabled){background-color:#0a1f1e}.button--secondary{background-color:var(--surface);color:var(--ink-2);border-color:var(--line)}.button--secondary:hover:not(:disabled){background-color:var(--surface-2);border-color:var(--ink-3)}.sensor-readout{background-color:var(--surface);border-radius:var(--radius-md);padding:18px;box-shadow:var(--shadow-md);border:1px solid var(--line)}.sensor-readout__header{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 10px;margin-bottom:4px}.sensor-readout__header h2{margin:0;font-family:var(--font-jp);font-size:15px;font-weight:700;letter-spacing:.04em}.sensor-readout__header h2:before{content:"";display:inline-block;width:7px;height:7px;margin-right:8px;border-radius:50%;background-color:var(--cadence);vertical-align:middle}.sensor-readout__meta{margin:0;font-family:var(--font-mono);font-size:11px;letter-spacing:.01em;color:var(--ink-3)}.sensor-readout__meta:first-of-type{margin-left:auto}.sensor-readout__vertical,.sensor-readout__magnitude{background-color:var(--surface-2);border:1px solid var(--line);border-radius:var(--radius-sm);padding:13px 14px;display:grid;grid-template-columns:auto 1fr;align-items:center;column-gap:12px;row-gap:9px;margin-top:12px}.sensor-readout__vertical{border-color:var(--cadence-soft)}.sensor-readout__vertical-label,.sensor-readout__magnitude-label{grid-column:1;font-size:12px;font-weight:500;color:var(--ink-3)}.sensor-readout__vertical-value,.sensor-readout__magnitude-value{grid-column:2;text-align:right;font-family:var(--font-display);font-size:23px;font-weight:600;font-variant-numeric:tabular-nums;color:var(--ink)}.sensor-readout__unit{font-family:var(--font-jp);font-size:12px;font-weight:500;margin-left:4px;color:var(--ink-3)}.vertical-bar{grid-column:1 / -1;position:relative;height:16px;background-color:#e3ebe8;border-radius:var(--radius-pill);overflow:hidden}.vertical-bar__zero{position:absolute;top:0;bottom:0;left:50%;width:1px;background-color:#112e2e40;z-index:2}.vertical-bar__threshold{position:absolute;top:0;bottom:0;width:2px;z-index:1}.vertical-bar__threshold--peak{background-color:#0e9c8ab3}.vertical-bar__threshold--trough{background-color:#c97a00bf}.vertical-bar__fill{position:absolute;top:0;bottom:0;border-radius:var(--radius-pill);transition:left 80ms linear,width 80ms linear;z-index:0}.vertical-bar__fill--pos{background:linear-gradient(90deg,var(--cadence),var(--cadence-bright))}.vertical-bar__fill--neg{background:linear-gradient(90deg,var(--warning),#e6a93a)}.sensor-readout__bar{grid-column:1 / -1;height:8px;background-color:#e3ebe8;border-radius:var(--radius-pill);overflow:hidden}.sensor-readout__bar-fill{height:100%;background:linear-gradient(90deg,var(--ink-2),var(--cadence));border-radius:var(--radius-pill);transition:width 80ms linear}.sensor-readout__grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}@media (max-width: 360px){.sensor-readout__grid{grid-template-columns:1fr}}.axis-group{background-color:var(--surface-2);border:1px solid var(--line);border-radius:var(--radius-sm);padding:12px 13px}.axis-group__title{margin:0 0 9px;font-size:11px;font-weight:700;color:var(--ink-3);letter-spacing:.05em}.axis-group__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}.axis-group__list li{display:flex;align-items:center;justify-content:space-between;font-size:13px}.axis-group__axis{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:6px;font-family:var(--font-display);font-weight:700;font-size:12px;color:#fff}.axis-group__axis--x{background-color:var(--axis-x)}.axis-group__axis--y{background-color:var(--axis-y)}.axis-group__axis--z{background-color:var(--axis-z)}.axis-group__value{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-weight:600;color:var(--ink)}.axis-group__empty{margin:0;font-size:12px;color:var(--ink-3)}.notice{border-radius:var(--radius-md);padding:14px 16px;border:1px solid var(--line);border-left-width:4px;background-color:var(--surface);box-shadow:var(--shadow-sm);display:flex;flex-direction:column;gap:4px}.notice--info{background-color:var(--cadence-soft);border-color:var(--cadence)}.notice--warning{background-color:var(--warning-soft);border-color:var(--warning)}.notice--error{background-color:var(--danger-soft);border-color:var(--danger)}.notice__title{font-size:14px;font-weight:700;color:var(--ink)}.notice__body{margin:0;font-size:13px;color:var(--ink-2)}@media (prefers-reduced-motion: reduce){.hero--running .hero__dial,.status-pill--running .status-pill__dot{animation:none}.cadence-ring__progress,.vertical-bar__fill,.sensor-readout__bar-fill{transition:none}}