.loudness-demo-section{background:linear-gradient(180deg,#f5f8ff,#fff)}.loudness-demo{display:grid;grid-template-columns:minmax(250px,320px) minmax(0,1fr);border:1px solid #d7e0ef;border-radius:24px;overflow:hidden;background:#fff;box-shadow:0 24px 60px rgba(8,31,73,.1)}.loudness-controls{padding:24px;background:#f8faff;border-right:1px solid #d7e0ef}.loudness-source{display:flex;gap:12px;align-items:center;padding:12px;border-radius:14px;background:#071b42;color:#fff;margin-bottom:20px}.loudness-source>span{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:#1463ff}.loudness-source div{display:grid;min-width:0}.loudness-source strong,.loudness-source small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.loudness-source small{color:#b8c9e8}.loudness-controls fieldset{border:0;padding:0;margin:0 0 18px}.loudness-controls legend{font-weight:800;margin-bottom:10px}.loudness-controls fieldset label{display:flex;align-items:center;gap:9px;margin:8px 0;padding:9px;border:1px solid #dce4f0;border-radius:10px;background:#fff}.loudness-controls input[type=radio]{width:20px;height:20px}.loudness-targets{display:grid;gap:10px;margin-bottom:12px}.loudness-targets label{display:grid;grid-template-columns:1fr 78px auto;gap:7px;align-items:center;font-size:.86rem}.loudness-targets input{min-width:0;padding:8px;border:1px solid #b9c7da;border-radius:8px}.loudness-preset-note{font-size:.78rem;color:#5e6b80}.loudness-controls .button{width:100%;margin-top:8px}.loudness-result{padding:24px;min-width:0}.loudness-scorecards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.loudness-scorecards article{display:grid;gap:5px;padding:15px;border:1px solid #d7e0ef;border-radius:14px}.loudness-scorecards small,.loudness-scorecards span{color:#68758a}.loudness-scorecards strong{font-size:1.45rem;color:#0b2a61}.loudness-scorecards em{font-size:.72rem;font-style:normal;color:#52627b}.loudness-chart{position:relative;display:flex;align-items:flex-end;gap:4px;height:174px;padding:32px 12px 26px;margin:20px 0;border-radius:14px;background:linear-gradient(#f5f8fd 1px,transparent 1px),linear-gradient(90deg,#f5f8fd 1px,transparent 1px);background-size:100% 34px,42px 100%;border:1px solid #d7e0ef;overflow:hidden}.loudness-chart>i{flex:1;height:var(--level);min-width:3px;background:#3e7ef5;border-radius:4px 4px 0 0}.loudness-chart>i.risk{background:#e55151}.target-line{position:absolute;top:33%;left:8px;right:8px;border-top:2px dashed #8f63e8;color:#6d46bc;font-size:.7rem;padding-top:3px}.loudness-chart .silence{position:absolute;bottom:4px;left:62%;padding:2px 6px;background:#fff2ce;color:#735100;font-size:.7rem;font-style:normal;border-radius:5px}.loudness-findings{display:grid;gap:8px}.loudness-findings article{display:flex;gap:10px;align-items:center;padding:11px;border:1px solid #d7e0ef;border-radius:12px}.loudness-findings article>b{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#e8efff;color:#1459db}.loudness-findings article.urgent>b{background:#ffe6e6;color:#bd2929}.loudness-findings article div{display:grid}.loudness-findings article span{font-size:.82rem;color:#657287}.loudness-listen{display:grid;grid-template-columns:auto auto 1fr;gap:8px;align-items:center;margin-top:18px;padding:12px;border-radius:12px;background:#071b42;color:#fff}.loudness-listen button{border:1px solid #496289;border-radius:8px;background:#102b59;color:#fff;padding:9px;cursor:pointer}.loudness-listen button[aria-pressed=true]{background:#1463ff;border-color:#4e8eff}.loudness-listen>div{height:5px;background:#476080;border-radius:10px;overflow:hidden}.loudness-listen>div i{display:block;width:0;height:100%;background:#47d5c6}.loudness-listen>span{grid-column:1/-1;color:#c5d2e8;font-size:.75rem}.loudness-package{display:flex;flex-wrap:wrap;gap:7px;margin-top:14px}.loudness-package>*{padding:7px 9px;border-radius:8px;background:#eef3fb;font-size:.78rem}.loudness-package strong{background:#dff8ee;color:#126246}.loudness-status{font-size:.82rem;color:#536177}.mkloudness{display:grid;grid-template-columns:1fr 1fr;gap:7px}.mkloudness>div{display:grid;padding:7px;border:1px solid #d6e0ef;border-radius:8px}.mkloudness small{font-size:.55rem;color:#60708a}.mkloudness strong{font-size:.9rem}.mkloudness em{font-size:.48rem;font-style:normal}.mkloudness>span{grid-column:1/-1;display:flex;align-items:flex-end;gap:3px;height:40px}.mkloudness>span i{flex:1;background:#2871ed;border-radius:2px 2px 0 0}@media(max-width:760px){.loudness-demo{grid-template-columns:1fr}.loudness-controls{border-right:0;border-bottom:1px solid #d7e0ef}.loudness-scorecards{grid-template-columns:1fr}.loudness-listen{grid-template-columns:1fr 1fr}.loudness-listen>div{grid-column:1/-1}.loudness-result{padding:18px}}@media(max-width:380px){.loudness-controls,.loudness-result{padding:14px}.loudness-targets label{grid-template-columns:1fr}.loudness-chart{gap:2px}.loudness-listen{grid-template-columns:1fr}.loudness-listen>span{grid-column:auto}}