:root{color-scheme:light}body{margin:0;background:#f0f2ef;font-family:Arial,sans-serif}#diffuser-prototype{max-width:1180px;margin:24px auto}button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid #285c49;outline-offset:3px}input[aria-invalid="true"]{outline:2px solid #a23228}#diffuser-prototype button,#diffuser-prototype summary{min-height:44px}#diffuser-prototype .estimate-table input{font-size:16px}@media(max-width:640px){#diffuser-prototype{margin:0;border-radius:0}}

#diffuser-prototype { --dp-bg:light-dark(#fafaf8,#191b1b);--dp-panel:light-dark(#ffffff,#222525);--dp-ink:light-dark(#242b29,#edf1ef);--dp-muted:light-dark(#626d68,#afb9b4);--dp-line:light-dark(#dde2de,#3b4440);--dp-accent:light-dark(#285c49,#a5cfbb);--dp-soft:light-dark(#edf3ef,#293c32);color:var(--dp-ink);background:var(--dp-bg);font-family:Arial,sans-serif;border-radius:8px;overflow:hidden;font-size:14px;line-height:1.5; }
#diffuser-prototype * {box-sizing:border-box} #diffuser-prototype header {display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 28px;border-bottom:1px solid var(--dp-line)}
#diffuser-prototype .brand {font-size:21px;letter-spacing:-1px} #diffuser-prototype .muted {color:var(--dp-muted)}
#diffuser-prototype main {padding:28px} #diffuser-prototype h1 {font-size:28px;font-weight:500;letter-spacing:-.7px;margin:0 0 6px} #diffuser-prototype h2 {font-size:16px;font-weight:500;margin:0 0 20px}
#diffuser-prototype p {margin:0} #diffuser-prototype .layout {display:grid;grid-template-columns:1fr 1.1fr;gap:28px;margin:28px 0}
#diffuser-prototype .inputs {display:grid;gap:18px;align-content:start} #diffuser-prototype label {display:block} #diffuser-prototype .field {display:flex;align-items:center;background:var(--dp-panel);border:1px solid var(--dp-line);border-radius:4px;margin-top:7px;padding-right:14px}
#diffuser-prototype input,#diffuser-prototype select {font:inherit;color:var(--dp-ink);background:var(--dp-panel);min-width:0;font-size:16px} #diffuser-prototype input {width:100%;border:0;padding:12px;border-radius:4px} #diffuser-prototype select {padding:12px;border:1px solid var(--dp-line);border-radius:4px;width:100%;margin-top:7px} #diffuser-prototype .unit {white-space:nowrap;color:var(--dp-muted)}
#diffuser-prototype .hint {font-size:12px;color:var(--dp-muted);margin-top:5px} #diffuser-prototype .result {background:var(--dp-panel);border:1px solid var(--dp-line);border-radius:4px;padding:24px;min-width:0} #diffuser-prototype .value {font-size:48px;letter-spacing:-2px;font-weight:400;line-height:1.2;margin:10px 0} #diffuser-prototype .value small {font-size:18px;letter-spacing:0;color:var(--dp-muted)}
#diffuser-prototype .sketch {margin:28px 0 12px;padding:22px 0;color:var(--dp-muted)} #diffuser-prototype .slot {height:22px;border:1px solid var(--dp-ink);background:var(--dp-soft);position:relative;margin:0 20px 12px} #diffuser-prototype .slot:after {content:'';position:absolute;left:8px;right:8px;top:8px;border-top:4px solid var(--dp-ink)} #diffuser-prototype .dimension {text-align:center;font-size:12px} #diffuser-prototype .pair {display:flex;justify-content:space-between;gap:16px;border-top:1px solid var(--dp-line);padding-top:14px;margin-top:14px} #diffuser-prototype .note {color:var(--dp-accent);background:var(--dp-soft);padding:12px;margin-top:18px;border-radius:4px}
#diffuser-prototype .table-head {display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:12px} #diffuser-prototype .table-head h2 {margin:0} #diffuser-prototype table {width:100%;border-collapse:collapse;font-size:13px;font-variant-numeric:tabular-nums} #diffuser-prototype th {color:var(--dp-muted);font-weight:400} #diffuser-prototype td,#diffuser-prototype th {padding:13px 8px;border-bottom:1px solid var(--dp-line);text-align:right} #diffuser-prototype td:first-child,#diffuser-prototype th:first-child {text-align:left} #diffuser-prototype button {font:inherit;color:var(--dp-accent);background:transparent;border:1px solid var(--dp-line);padding:7px 12px;border-radius:4px;cursor:pointer} #diffuser-prototype button:disabled {opacity:.5;cursor:not-allowed} #diffuser-prototype button:hover {background:var(--dp-soft)} #diffuser-prototype .table-wrap {overflow-x:auto} #diffuser-prototype .reference {margin-top:26px;border-top:1px solid var(--dp-line);padding-top:18px} #diffuser-prototype summary {cursor:pointer} #diffuser-prototype .reference select {width:auto;margin:12px 0} #diffuser-prototype footer {font-size:12px;color:var(--dp-muted);border-top:1px solid var(--dp-line);padding:16px 28px} #diffuser-prototype [hidden] {display:none!important} #diffuser-prototype .error {color:light-dark(#9b332c,#ffaaa3)}
@media(max-width:640px) {#diffuser-prototype main {padding:20px 16px} #diffuser-prototype header {padding:16px} #diffuser-prototype .layout {grid-template-columns:1fr;gap:20px} #diffuser-prototype .table-head {align-items:start;flex-direction:column;gap:4px} #diffuser-prototype h1 {font-size:24px} #diffuser-prototype td,#diffuser-prototype th {padding:12px 5px} #diffuser-prototype footer {padding:16px} }
#diffuser-prototype .model-status {display:block;font-size:12px;color:var(--dp-muted);margin-top:4px} #diffuser-prototype tr.recommended {background:var(--dp-soft)} #diffuser-prototype .noise-value {color:var(--dp-accent);font-weight:500} #diffuser-prototype .noise-help {margin-top:8px} #diffuser-prototype .option-help {margin:8px 0 14px} #diffuser-prototype .pair span:last-child {text-align:right}
@media(max-width:640px) {#diffuser-prototype .options thead {display:none} #diffuser-prototype .options tr {display:grid;grid-template-columns:1fr 1fr;padding:12px 8px;border-bottom:1px solid var(--dp-line);gap:8px} #diffuser-prototype .options td {display:block;border:0;padding:0;text-align:left} #diffuser-prototype .options td:first-child {grid-column:1/-1} #diffuser-prototype .options td[data-label]:before {content:attr(data-label);display:block;color:var(--dp-muted);font-size:12px} #diffuser-prototype .options td:last-child {align-self:end;text-align:right} #diffuser-prototype .pair {flex-wrap:wrap} }
#diffuser-prototype .page-nav {display:flex;gap:8px;flex-wrap:wrap;padding:16px 28px;border-bottom:1px solid var(--dp-line)} #diffuser-prototype .page-nav button[aria-current="page"],#diffuser-prototype .primary-action {background:var(--dp-soft)} #diffuser-prototype .estimate-actions {margin-top:18px;display:flex;gap:12px;align-items:center;flex-wrap:wrap} #diffuser-prototype .estimate-totals {display:flex;gap:32px;flex-wrap:wrap;margin:28px 0} #diffuser-prototype .estimate-totals strong {display:block;font-size:28px;font-weight:500} #diffuser-prototype .estimate-table input {width:80px;border:1px solid var(--dp-line);padding:8px} #diffuser-prototype .cut {margin-top:16px;border-top:1px solid var(--dp-line);padding-top:14px} #diffuser-prototype .cut p {margin-top:6px} #diffuser-prototype #dp-estimate-empty {padding:28px 0} #diffuser-prototype .estimate-actions button {min-height:44px}
