.ads-opt-detail { width:min(1120px,calc(100vw - 40px)); max-width:none; max-height:calc(100dvh - 40px); margin:auto; padding:0; overflow:hidden; border:1px solid #475569; border-radius:18px; background:#0e1422; color:#e2e8f0; }
.ads-opt-detail[open] { display:flex; flex-direction:column; }
.ads-opt-detail::backdrop { background:rgba(2,6,23,.82); }
.ads-opt-detail__header { display:flex; flex:none; justify-content:space-between; align-items:flex-start; gap:18px; padding:22px 26px 18px; border-bottom:1px solid rgba(148,163,184,.18); }
.ads-opt-detail__header>div { min-width:0; }
.ads-opt-detail__header h2 { overflow-wrap:anywhere; font-size:1.25rem; margin:4px 0 6px; }
.ads-opt-detail__header p { margin:0; }
.ads-opt-detail__header>button { flex:none; }
.ads-opt-detail__body { min-height:0; overflow:auto; overscroll-behavior:contain; padding:18px 26px 26px; }
.ads-opt-detail__metrics { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin:4px 0 20px; }
.ads-opt-detail__metrics article { border:1px solid rgba(148,163,184,.2); border-radius:12px; padding:16px; background:#131c2c; }
.ads-opt-detail__metrics article:first-child { border-color:#f59e0b; background:rgba(245,158,11,.1); }
.ads-opt-detail__metrics span { display:block; color:#a8b5c8; font-size:.8rem; }
.ads-opt-detail__metrics strong { display:block; margin-top:8px; font-size:1.35rem; font-variant-numeric:tabular-nums; }
.ads-opt-detail__metrics article:first-child strong { color:#fbbf24; }
.ads-opt-detail__metrics .ads-opt-detail__profit-card { grid-column:1/-1; min-height:112px; }
.ads-opt-detail__profit-card strong { color:inherit; }
.ads-opt-detail__profitability { border:1px solid rgba(148,163,184,.2); border-radius:12px; padding:18px; margin:0 0 20px; background:#101a2a; }
.ads-opt-detail__profitability:focus-visible { outline:2px solid #818cf8; outline-offset:3px; }
.ads-opt-detail__profit-rows { margin:16px 0; }
.ads-opt-detail__profit-rows>div { display:flex; justify-content:space-between; gap:16px; border-bottom:1px solid rgba(148,163,184,.12); padding:10px 0; font-size:.85rem; }
.ads-opt-detail__profit-rows dd { margin:0; font-weight:650; white-space:nowrap; font-variant-numeric:tabular-nums; }
.ads-opt-detail__profit-rows .ads-opt-detail__profit-result { border-top:1px solid rgba(148,163,184,.4); border-bottom:0; margin-top:6px; font-weight:700; }
.ads-opt-detail__profit-note { border-left:3px solid #818cf8; padding-left:12px; }
.ads-opt-detail__warnings p { padding:10px 14px; border-left:3px solid #f59e0b; background:rgba(245,158,11,.06); color:#cbd5e1; }
.ads-opt-detail__chart { position:relative; height:330px; margin:14px 0 24px; }
.ads-opt-detail__events { border-top:1px solid rgba(148,163,184,.18); padding-top:20px; }
.ads-opt-detail__events ol { list-style:none; padding:0; margin:12px 0; display:grid; gap:9px; }
.ads-opt-detail__events li { border:1px solid rgba(251,191,36,.25); padding:12px 14px; border-radius:9px; }
.ads-opt-detail__events li strong { font-size:.83rem; color:#fbbf24; }
.ads-opt-detail__events li p { margin:5px 0 0; }
#ads-opt-detail-status.is-error { color:#fca5a5; }
@media(max-width:640px) { .ads-opt-detail { width:calc(100vw - 20px); max-height:calc(100dvh - 20px); border-radius:12px; } .ads-opt-detail__header { padding:16px; gap:10px; } .ads-opt-detail__header h2 { font-size:1.05rem; } .ads-opt-detail__body { padding:14px 16px 20px; } .ads-opt-detail__metrics { grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; } .ads-opt-detail__metrics article { padding:12px; } .ads-opt-detail__metrics article:first-child { grid-column:1/-1; } .ads-opt-detail__metrics strong { font-size:1.13rem; } .ads-opt-detail__chart { height:290px; } }
