.audio-diff-page{--ad-panel:var(--panel);--ad-soft:var(--panel-soft);--ad-border:var(--header-border);--ad-text:var(--text-strong);--ad-muted:var(--text-soft);--ad-accent:var(--accent);--ad-good:#0f9f6e;--ad-warn:#c58a00;--ad-bad:#d94a5a;background:var(--page-bg);color:var(--ad-text)}
.audio-diff-page *{box-sizing:border-box}.ad-wrap{max-width:1180px;margin:auto;padding:42px 20px 64px}.ad-hero{text-align:center;max-width:820px;margin:0 auto 28px}.ad-kicker{display:inline-block;font-size:.75rem;font-weight:800;letter-spacing:.11em;text-transform:uppercase;color:var(--ad-accent);margin-bottom:8px}.ad-hero h1{font-size:clamp(2rem,5vw,3.4rem);line-height:1.03;margin:0 0 12px}.ad-hero p{font-size:1.06rem;color:var(--ad-muted);margin:0}.ad-meta{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:16px}.ad-meta span{border:1px solid var(--ad-border);background:var(--ad-panel);border-radius:999px;padding:6px 10px;font-size:.78rem;color:var(--ad-muted)}
.ad-upload-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.ad-drop{min-height:185px;border:1px dashed color-mix(in srgb,var(--ad-accent) 50%,var(--ad-border));background:var(--ad-panel);border-radius:18px;padding:28px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;cursor:pointer;transition:.2s}.ad-drop:hover,.ad-drop.is-drag{border-color:var(--ad-accent);background:color-mix(in srgb,var(--ad-accent) 5%,var(--ad-panel))}.ad-drop input{display:none}.ad-file-tag{font-size:.72rem;font-weight:800;color:var(--ad-accent);text-transform:uppercase;letter-spacing:.09em;margin-bottom:10px}.ad-drop strong{font-size:1.08rem;word-break:break-word}.ad-drop>span:last-child{color:var(--ad-muted);font-size:.88rem;margin-top:6px}.ad-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:16px 0 24px}.ad-btn{border:1px solid var(--ad-border);background:var(--ad-panel);color:var(--ad-text);padding:11px 16px;border-radius:10px;font-weight:750;cursor:pointer}.ad-btn-primary{background:var(--ad-accent);border-color:var(--ad-accent);color:#fff}.ad-btn:disabled{opacity:.45;cursor:not-allowed}.ad-status{font-size:.88rem;color:var(--ad-muted)}
.ad-hidden{display:none}.ad-verdict{display:grid;grid-template-columns:1fr auto;gap:20px;align-items:center;border:1px solid var(--ad-border);background:var(--ad-panel);border-radius:18px;padding:24px;margin-bottom:16px}.ad-verdict h2{margin:0 0 6px;font-size:1.5rem}.ad-verdict p{margin:0;color:var(--ad-muted)}.ad-score{text-align:right;min-width:150px}.ad-score strong{font-size:2.15rem;display:block}.ad-score span{font-size:.77rem;color:var(--ad-muted)}.ad-verdict.good{border-color:color-mix(in srgb,var(--ad-good) 45%,var(--ad-border))}.ad-verdict.warn{border-color:color-mix(in srgb,var(--ad-warn) 50%,var(--ad-border))}.ad-verdict.bad{border-color:color-mix(in srgb,var(--ad-bad) 50%,var(--ad-border))}
.ad-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:16px}.ad-metric{background:var(--ad-panel);border:1px solid var(--ad-border);border-radius:14px;padding:16px}.ad-metric span{display:block;font-size:.75rem;color:var(--ad-muted);margin-bottom:6px}.ad-metric strong{font-size:1.05rem}.ad-metric small{display:block;margin-top:5px;color:var(--ad-muted)}.ad-two-col{display:grid;grid-template-columns:1fr 1fr;gap:16px}.ad-card{background:var(--ad-panel);border:1px solid var(--ad-border);border-radius:16px;padding:20px;margin-bottom:16px}.ad-card h2{font-size:1.06rem;margin:0 0 14px}.ad-card-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.ad-text-btn{border:0;background:none;color:var(--ad-accent);font-weight:750;cursor:pointer}.ad-findings{display:grid;gap:9px}.ad-finding{display:flex;gap:9px;align-items:flex-start;border-radius:10px;background:var(--ad-soft);padding:10px 12px;font-size:.9rem}.ad-finding.good b{color:var(--ad-good)}.ad-finding.warn b{color:var(--ad-warn)}.ad-finding.bad b{color:var(--ad-bad)}.ad-table-wrap{overflow:auto}.ad-table{width:100%;border-collapse:collapse;font-size:.86rem}.ad-table th,.ad-table td{text-align:left;padding:9px 8px;border-bottom:1px solid var(--ad-border);white-space:nowrap}.ad-table th{font-size:.72rem;color:var(--ad-muted);text-transform:uppercase}.ad-muted{color:var(--ad-muted);font-size:.86rem;margin-top:-7px}.ad-card canvas{width:100%;display:block;background:var(--ad-soft);border-radius:10px}
.ad-related{display:flex;align-items:center;justify-content:space-between;gap:18px;border:1px solid var(--ad-border);background:var(--ad-panel);border-radius:16px;padding:18px 20px;margin:8px 0 26px}.ad-related>div:first-child{display:flex;flex-direction:column}.ad-related span{color:var(--ad-muted);font-size:.84rem}.ad-related-links{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.ad-related a{border:1px solid var(--ad-border);border-radius:999px;padding:8px 11px;text-decoration:none;color:var(--ad-text);font-size:.82rem}.ad-related a:hover{border-color:var(--ad-accent);color:var(--ad-accent)}
.ad-content{max-width:950px;margin:28px auto 0}.ad-content h2{font-size:1.45rem;margin-bottom:10px}.ad-content p{color:var(--ad-muted);line-height:1.7}.ad-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:18px 0}.ad-steps div{background:var(--ad-panel);border:1px solid var(--ad-border);border-radius:12px;padding:14px}.ad-steps strong{display:block;color:var(--ad-accent);font-size:1.15rem}.ad-steps span{font-size:.86rem}.ad-note{background:var(--ad-soft);border:1px solid var(--ad-border);border-radius:12px;padding:14px;font-size:.88rem}.ad-faq details{border-bottom:1px solid var(--ad-border);padding:13px 0}.ad-faq summary{font-weight:750;cursor:pointer}.ad-faq details p{margin:8px 0 0}
@media(max-width:820px){.ad-upload-grid,.ad-two-col{grid-template-columns:1fr}.ad-metrics{grid-template-columns:repeat(2,1fr)}.ad-steps{grid-template-columns:1fr 1fr}.ad-related{align-items:flex-start;flex-direction:column}.ad-related-links{justify-content:flex-start}.ad-verdict{grid-template-columns:1fr}.ad-score{text-align:left}.ad-wrap{padding:30px 14px 50px}}@media(max-width:480px){.ad-metrics,.ad-steps{grid-template-columns:1fr}.ad-actions .ad-btn{flex:1}.ad-drop{min-height:150px;padding:20px}}
