:root{--color-ink:#2a2a2a;--color-primary:#ff7997;--color-primary-dark:#e8567a;--color-active:#6fbf8b;--color-active-deep:#337148;--color-accent:#f70;--color-sub:#938c79;--color-sub-2:#ab9b73;--bg-base:#f3e8ce;--bg-surface:#f4eee1;--bg-surface-alt:#ede4d0;color:var(--color-ink);background:var(--bg-base);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,monospace}*{box-sizing:border-box}body{min-width:320px;min-height:100svh;margin:0}button,input,textarea,select{font:inherit}.app-shell{background:var(--bg-base);min-height:100svh;padding:28px 20px}.monitor-layout{width:min(100%,560px);margin:0 auto}.datasheet-line,.telemetry-line{color:var(--color-sub-2);letter-spacing:.16em;text-transform:uppercase;white-space:nowrap;align-items:center;gap:12px;font-size:.625rem;font-weight:700;display:flex}.datasheet-line:after,.telemetry-line:after{content:"";border-top:1px dashed color-mix(in srgb, var(--color-ink) 45%, transparent);flex:1;order:1}.datasheet-line span:last-child,.telemetry-line span:last-child{order:2}.monitor-header h1{color:var(--color-primary);letter-spacing:-.05em;text-transform:uppercase;white-space:nowrap;margin:22px 0 6px;font-size:clamp(1.6rem,8vw,2.75rem);line-height:.95}.plant-name{color:var(--color-sub);letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;margin:0;font-size:.7rem;font-weight:700}.request-status{color:var(--color-sub);margin:40px 0 0;font-size:.75rem;font-weight:700}.request-error,.refresh-warning{color:var(--color-primary-dark)}.refresh-warning{border-block:1px dashed color-mix(in srgb, var(--color-ink) 35%, transparent);margin:24px 0 0;padding-block:8px;font-size:.65rem;font-weight:700}.reading-overview{justify-content:space-between;align-items:end;gap:20px;margin-top:48px;display:flex}.reading-overview>div{flex-direction:column;gap:10px;display:flex}.data-label{color:var(--color-sub-2);letter-spacing:.14em;text-transform:uppercase;white-space:nowrap;font-size:.625rem;font-weight:700}.reading-overview strong{color:var(--color-ink);letter-spacing:-.1em;font-size:clamp(2.5rem,13vw,4rem);line-height:.78}.status-indicator{white-space:nowrap;align-items:center;gap:7px;margin-bottom:3px;font-size:.7rem;font-weight:700;display:inline-flex}.status-indicator:before{content:"";background:currentColor;border-radius:50%;width:8px;height:8px}.status-moist{color:var(--color-active-deep)}.status-getting-dry{color:var(--color-accent)}.status-dry{color:var(--color-primary-dark)}.status-offline{color:var(--color-sub)}.character-stage{background:radial-gradient(circle, color-mix(in srgb, var(--color-primary) 12%, transparent), transparent 62%);flex-direction:column;justify-content:center;align-items:end;gap:18px;min-height:clamp(250px,42svh,380px);padding-bottom:20px;display:flex}.character-stage img{width:clamp(192px,64vw,288px);height:auto;image-rendering:pixelated;image-rendering:crisp-edges;align-self:center}.character-offline img{filter:saturate(.45);opacity:.78}.character-stage span{color:var(--color-sub-2);letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;align-self:center;font-size:.55rem;font-weight:700}.reading-details{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 18px;margin:16px 0 0;display:grid}.reading-details div{white-space:nowrap;align-items:baseline;gap:5px;min-width:0;display:flex}.reading-details dt,.reading-details dd{white-space:nowrap;font-size:clamp(.5rem,2.4vw,.68rem);line-height:1.2}.reading-details dt{color:var(--color-sub-2);letter-spacing:.08em;text-transform:uppercase;font-weight:700}.reading-details dd{min-width:0;color:var(--color-sub);margin:0;font-weight:700}.site-footer{border-top:1px dashed color-mix(in srgb, var(--color-ink) 35%, transparent);text-align:center;margin-top:48px;padding-top:18px}.site-footer a{color:var(--color-sub);letter-spacing:.08em;text-underline-offset:4px;text-transform:uppercase;font-size:.65rem;font-weight:700;text-decoration-thickness:1px}.site-footer a:hover,.site-footer a:focus-visible{color:var(--color-primary-dark)}@media (width<=360px){.app-shell{padding-inline:14px}.datasheet-line,.telemetry-line{gap:8px;font-size:.55rem}.reading-details{gap:10px 12px}}