*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg-1:#e2e8f0;--bg-2:#f1f5f9;--surface:#fff;--panel:#1e293b;--panel-2:#334155;--panel-line:#ffffff24;--text:#0f172a;--text-muted:#64748b;--panel-text:#e2e8f0;--panel-text-muted:#94a3b8;--accent:#0d9488;--accent-hover:#0f766e;--accent-strong:#115e59;--accent-soft:#ccfbf1;--accent-ring:#0d948859;--border:#cbd5e1;--error:#b91c1c;--error-bg:#fef2f2;--warn:#b45309;--warn-bg:#fffbeb;--ok:#15803d;--ok-bg:#f0fdf4;--radius:10px;--radius-sm:7px;--xs:4px;--sm:8px;--md:16px;--lg:24px;--xl:32px;--font:"Segoe UI", system-ui, -apple-system, Arial, sans-serif;--fs-sm:14px;--fs-base:16px}html{font-size:var(--fs-base);color:var(--text);-webkit-font-smoothing:antialiased;line-height:1.5}body{font-family:var(--font);background-color:#c6d8d6;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200' viewBox='0 0 200 200'%3E%3Cg fill='%23ffffff' fill-opacity='0.22'%3E%3Cellipse cx='100' cy='114' rx='25' ry='20'/%3E%3Cellipse cx='72' cy='84' rx='9' ry='13'/%3E%3Cellipse cx='90' cy='74' rx='9' ry='14'/%3E%3Cellipse cx='110' cy='74' rx='9' ry='14'/%3E%3Cellipse cx='128' cy='84' rx='9' ry='13'/%3E%3C/g%3E%3C/svg%3E");background-size:200px 200px;background-attachment:fixed;min-height:100vh}#app{max-width:1080px;padding:var(--lg) var(--md);gap:var(--md);flex-direction:column;min-height:100vh;margin:0 auto;display:flex}.layout{gap:var(--lg);flex:1;grid-template-columns:minmax(300px,360px) 1fr;align-items:stretch;display:grid}.panel{border-radius:var(--radius);box-shadow:0 10px 30px -12px #0f172a59}.panel-left{color:var(--panel-text);padding:var(--lg);gap:var(--lg);background:linear-gradient(#263448 0%,#1f2b3d 100%);flex-direction:column;display:flex}.panel-right{background:var(--surface);border:1px solid var(--border);padding:var(--lg);gap:var(--md);flex-direction:column;min-height:420px;display:flex;box-shadow:0 12px 34px -18px #0f172a6b}.brand{align-items:center;gap:var(--sm);padding-bottom:var(--md);border-bottom:1px solid var(--panel-line);display:flex}.brand-logo{border-radius:9px;flex-shrink:0;width:40px;height:40px}.brand h1{letter-spacing:-.01em;font-size:1.3rem;font-weight:700}.brand .tagline{font-size:var(--fs-sm);color:var(--panel-text-muted);margin-top:2px}.bili-form{gap:var(--lg);flex-direction:column;display:flex}.form-group{gap:var(--sm);flex-direction:column;display:flex}.form-group--hidden{display:none!important}.panel-left .form-group label:not(.radio-label):not(.checkbox-label),.panel-left .form-fieldset legend{font-size:var(--fs-sm);color:var(--panel-text);font-weight:600}input[type=number],input[type=datetime-local],select{width:100%;padding:var(--sm) var(--md);border-radius:var(--radius-sm);font-family:inherit;font-size:var(--fs-base);color:var(--text);appearance:none;background:#fff;border:1px solid #0000;transition:border-color .15s,box-shadow .15s}input[type=number]:focus,input[type=datetime-local]:focus,select:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-ring);outline:none}.form-fieldset{border:1px solid var(--panel-line);border-radius:var(--radius-sm);padding:var(--md);gap:var(--sm);flex-direction:column;display:flex}.form-fieldset legend{padding:0 var(--xs)}.radio-label,.checkbox-label{align-items:flex-start;gap:var(--sm);font-size:var(--fs-sm);color:var(--panel-text);cursor:pointer;-webkit-user-select:none;user-select:none;overflow-wrap:anywhere;display:flex}.radio-label input,.checkbox-label input{cursor:pointer;width:16px;height:16px;accent-color:var(--accent);flex-shrink:0;margin-top:2px}.radio-label:hover,.checkbox-label:hover{color:#fff}.measure-row{gap:var(--lg);flex-wrap:wrap;display:flex}.error-summary{background:var(--error-bg);border:1px solid var(--error);border-radius:var(--radius-sm);padding:var(--md);color:var(--error);font-size:var(--fs-sm)}.error-summary p{margin-bottom:var(--xs);font-weight:600}.error-summary ul{padding-left:var(--lg);list-style:outside}.error-summary li{margin-top:var(--xs)}.bili-form .field-invalid{border-color:var(--error);box-shadow:0 0 0 3px #b91c1c4d}.field-error{color:#fca5a5;margin-top:4px;font-size:12.5px}.btn-calculate{padding:var(--sm) var(--xl);background:var(--accent);color:#fff;border-radius:var(--radius-sm);font-family:inherit;font-size:var(--fs-base);cursor:pointer;border:none;align-self:stretch;font-weight:600;transition:background-color .15s,box-shadow .15s,transform 50ms}.btn-calculate:hover{background:var(--accent-hover)}.btn-calculate:focus-visible{box-shadow:0 0 0 3px var(--accent-ring);outline:none}.btn-calculate:active{transform:translateY(1px)}#results{gap:var(--xs);flex-direction:column;display:flex}.empty-state{justify-content:center;align-items:center;gap:var(--sm);padding:var(--xl) var(--md);color:var(--text-muted);font-size:var(--fs-sm);text-align:center;flex-direction:column;flex:1;display:flex}.empty-state[hidden]{display:none}.empty-mark{filter:grayscale(.6);opacity:.45;border-radius:14px}#results h2{margin-bottom:var(--xs);font-size:1.2rem}#results>p{line-height:1.5}#results strong{color:var(--text)}.stats{gap:var(--sm);margin:var(--sm) 0 var(--md);flex-wrap:wrap;display:flex}.stat{padding:var(--sm) var(--md);background:var(--bg-2);border:1px solid var(--bg-1);border-radius:var(--radius-sm);text-align:center;flex-direction:column;flex:120px;gap:2px;display:flex}.stat-label{color:var(--text-muted);font-size:12px}.stat-value{font-variant-numeric:tabular-nums;font-size:24px;font-weight:700;line-height:1.2}.stat-unit{color:var(--text-muted);font-size:12px}.stat-delta{border-radius:999px;align-self:center;margin-top:auto;padding:1px 8px;font-size:12px;font-weight:600}.delta-below{background:var(--ok-bg);color:var(--ok)}.delta-above{background:var(--error-bg);color:var(--error)}.delta-at{background:var(--warn-bg);color:var(--warn)}.action{margin-top:var(--sm);padding:var(--sm) var(--md);border-radius:var(--radius-sm);font-weight:600}.action.treat{background:var(--warn-bg);border:1px solid var(--warn);color:#7c3a06}.action.followup{background:var(--ok-bg);border:1px solid var(--ok);color:#0a3d1e;font-weight:400}.fu-action{color:#06301a;font-weight:700}.followup-options{margin:var(--xs) 0 0;color:inherit;padding-left:1.25rem;list-style:outside}.followup-options li{margin-top:3px;line-height:1.45}.escalate,.exchange-now{margin-top:var(--sm);padding:var(--sm) var(--md);border-radius:var(--radius-sm);background:var(--error-bg);border:1px solid var(--error);color:var(--error);font-weight:700}.exchange-now{background:#fee2e2}.confirm{margin-top:var(--sm);padding:var(--sm) var(--md);border-radius:var(--radius-sm);background:var(--accent-soft);border:1px solid var(--accent);color:#115e56}.graph-wrap{margin-top:var(--xs);padding-top:var(--md);border-top:1px solid var(--bg-1)}.graph-wrap canvas{max-width:100%;height:auto;display:block}.graph-wrap:has(#inspect-toggle:checked) canvas{cursor:crosshair}.inspect-toggle{align-items:center;gap:var(--sm);margin-bottom:var(--sm);color:var(--text-muted);cursor:pointer;-webkit-user-select:none;user-select:none;font-size:13px;display:inline-flex}.inspect-toggle input{appearance:none;background:var(--border);cursor:pointer;border-radius:999px;flex-shrink:0;width:34px;height:18px;transition:background .15s;position:relative}.inspect-toggle input:before{content:"";background:#fff;border-radius:50%;width:14px;height:14px;transition:left .15s;position:absolute;top:2px;left:2px}.inspect-toggle input:checked{background:var(--accent)}.inspect-toggle input:checked:before{left:18px}.inspect-toggle input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}@media (forced-colors:active){.inspect-toggle input{appearance:auto;width:auto;height:auto}.inspect-toggle input:before{content:none}}.disclaimer{padding-top:var(--md);border-top:1px solid var(--bg-1);color:var(--text-muted);margin-top:auto;font-size:12.5px;line-height:1.55}.disclaimer strong{color:var(--text)}.build-meta{margin:var(--xs) 0 0;color:var(--text-muted);text-align:right;letter-spacing:.02em;font-size:11px}@media (width<=860px){.layout{grid-template-columns:1fr}.panel-right{min-height:0}}@media (width<=480px){#app{padding:var(--md) var(--sm)}.panel-left,.panel-right{padding:var(--md)}.btn-calculate{width:100%}}@media (width<=430px){.stat{flex-basis:100%}}
