.db-gate{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:32px 22px;text-align:center;margin:4px 0 16px}.db-gate-icon{font-size:56px;line-height:1;margin-bottom:14px}.db-gate-title{font-size:18px;font-weight:700;color:var(--text);margin-bottom:10px}.db-gate-desc{font-size:14px;color:var(--sub);line-height:1.7;margin:0 auto 20px;text-align:left;max-width:520px}.db-gate-desc b{color:var(--text)}.db-gate-btn{display:inline-flex;align-items:center;justify-content:center;padding:12px 32px;min-width:180px;height:48px;border:none;border-radius:24px;background:linear-gradient(135deg,var(--primary) 0%,var(--primary-end) 100%);color:#fff;font-size:15px;font-weight:600;cursor:pointer;transition:transform .15s,box-shadow .15s;box-shadow:0 6px 16px #6c63ff59}.db-gate-btn:hover{transform:translateY(-1px);box-shadow:0 8px 22px #6c63ff73}.db-gate-btn:active{transform:translateY(0)}.db-gate-hint{margin-top:14px;font-size:12px;color:var(--sub);opacity:.8}.db-notice{display:flex;gap:12px;align-items:flex-start;background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px 20px;margin:16px 0}.db-notice-icon{font-size:28px;line-height:1;flex-shrink:0}.db-notice-title{font-size:15px;font-weight:700;color:var(--text);margin-bottom:4px}.db-notice-desc{font-size:13px;color:var(--sub);line-height:1.65}.db-notice-retry{display:inline-block;margin-top:10px;padding:6px 14px;border-radius:8px;border:1px solid var(--border);background:var(--card-alt);color:var(--text);font-size:12px;font-weight:600;cursor:pointer;transition:all .15s}.db-notice-retry:hover{border-color:var(--primary);color:var(--primary)}.db-main{display:flex;flex-direction:column;gap:16px;margin-top:4px}.db-card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:20px}@media(max-width:600px){.db-card{padding:16px}}.db-card-head{display:flex;align-items:center;gap:8px;margin-bottom:14px;font-size:14px;font-weight:600;color:var(--text)}.db-card-ic{font-size:16px;line-height:1}.db-card-title{font-weight:700}.db-card-sub{margin-left:auto;font-size:12px;font-weight:400;color:var(--sub)}.db-card-meter{background:linear-gradient(135deg,var(--card) 0%,color-mix(in srgb,var(--primary) 4%,var(--card)) 100%)}.db-meter-wrap{position:relative;width:100%;aspect-ratio:1 / 1;max-width:360px;margin:0 auto}.db-ring{width:100%;height:100%;display:block}.db-meter-center{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none}.db-meter-num{font-family:var(--font-mono);font-size:clamp(48px,14vw,76px);font-weight:700;line-height:1;color:var(--text);letter-spacing:-.04em;font-variant-numeric:tabular-nums;transition:color .25s}.db-meter-unit{font-size:14px;font-weight:600;color:var(--sub);margin-top:2px;letter-spacing:.05em}.db-meter-zone{margin-top:12px;font-size:13px;font-weight:600;color:var(--sub);padding:4px 12px;border-radius:999px;background:var(--card-alt);transition:color .25s,background .25s}.db-num-zone-quiet{color:#22c55e}.db-num-zone-low{color:#65a30d}.db-num-zone-mid{color:#f59e0b}.db-num-zone-high{color:#f97316}.db-num-zone-loud{color:#ef4444}.db-num-zone-danger{color:#dc2626}.db-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:18px}.db-stat{background:var(--card-alt);border-radius:12px;padding:10px 8px;text-align:center}.db-stat-label{font-size:11px;color:var(--sub);margin-bottom:4px;letter-spacing:.05em}.db-stat-val{font-family:var(--font-mono);font-size:16px;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums}@media(max-width:380px){.db-stats{grid-template-columns:repeat(2,1fr)}}.db-actions{display:flex;gap:10px;margin-top:16px;justify-content:center}.db-btn{flex:0 1 auto;padding:10px 22px;border:1px solid var(--border);border-radius:12px;background:var(--card-alt);color:var(--text);font-size:14px;font-weight:600;cursor:pointer;transition:all .15s}.db-btn:hover{border-color:var(--primary);color:var(--primary)}.db-btn-primary{background:linear-gradient(135deg,var(--primary) 0%,var(--primary-end) 100%);color:#fff;border:none;box-shadow:0 4px 12px #6c63ff4d}.db-btn-primary:hover{color:#fff;box-shadow:0 6px 16px #6c63ff66}.db-spectrum,.db-history{width:100%;height:auto;aspect-ratio:800 / 220;border-radius:12px;background:linear-gradient(180deg,color-mix(in srgb,var(--primary) 3%,var(--card-alt)) 0%,var(--card-alt) 100%);display:block}.db-history{aspect-ratio:800 / 200}.db-cal-row{display:flex;align-items:center;gap:14px;margin-bottom:16px}.db-cal-label{font-size:13px;font-weight:600;color:var(--text);width:56px;flex-shrink:0}.db-cal-slider{flex:1;min-width:0;-webkit-appearance:none;appearance:none;height:6px;border-radius:3px;background:linear-gradient(90deg,#ef4444,#f59e0b 30%,#22c55e,#f59e0b 70%,#ef4444);outline:none}.db-cal-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;background:#fff;border:2px solid var(--primary);box-shadow:0 2px 6px #0003;cursor:pointer;transition:transform .15s}.db-cal-slider::-webkit-slider-thumb:hover{transform:scale(1.15)}.db-cal-slider::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:#fff;border:2px solid var(--primary);box-shadow:0 2px 6px #0003;cursor:pointer}.db-cal-value{font-family:var(--font-mono);font-size:13px;font-weight:600;color:var(--text);min-width:64px;text-align:right;font-variant-numeric:tabular-nums}.db-cal-presets-label{display:block;font-size:12px;color:var(--sub);margin-bottom:8px}.db-cal-presets-btns{display:flex;flex-wrap:wrap;gap:8px}.db-preset-btn{padding:6px 12px;border-radius:999px;background:var(--card-alt);border:1px solid var(--border);color:var(--text);font-size:12px;font-weight:500;cursor:pointer;transition:all .15s;white-space:nowrap}.db-preset-btn:hover{border-color:var(--primary);color:var(--primary)}.db-preset-btn-reset{color:var(--sub)}.db-ref-scale{margin-top:18px;padding-top:16px;border-top:1px dashed var(--border)}.db-ref-bar{height:8px;border-radius:4px;background:linear-gradient(90deg,#22c55e,#84cc16,#f59e0b 50%,#f97316 70%,#ef4444 88%,#dc2626)}.db-ref-marks{position:relative;height:22px;margin-top:6px}.db-ref-marks span{position:absolute;top:0;transform:translate(-50%);font-size:11px;color:var(--sub);white-space:nowrap}.db-ref-marks span:first-child{transform:none}.db-ref-marks span:last-child{transform:translate(-100%)}