/* Midnight blue: the data block is one continuous surface. */
.performance-overview{border:1px solid #284565;border-radius:12px;padding:18px 20px 20px;margin-top:23px;background:radial-gradient(ellipse at 93% 0%,#365f8538 0%,transparent 56%),radial-gradient(ellipse at 38% 110%,#3e61983d 0%,transparent 59%),linear-gradient(118deg,#101c30 0%,#1c304d 55%,#172b43 100%);box-shadow:0 11px 24px #14294216,inset 0 1px 0 #d5e7ff12;color:#e7effa}
.performance-topline{color:#c3d2e6;font-size:12px;margin-bottom:13px;letter-spacing:.2px}
.comparison-period{color:#a7bbd4;font-size:11px}
.primary-metrics{background:#ffffff03;border-color:#b5c9e527;border-radius:8px}
.ability{border-color:#b5c9e522}
.ability h2{color:#f0f5ff;font-size:20px;letter-spacing:.4px}
.main-metric>span{color:#b1c4de}
.main-metric>strong{color:#f4f8ff;text-shadow:0 2px 12px #6f9dcc12}
.main-metric>strong small{color:#becfe5}
.sample-tag{background:#dae6fa15;color:#b6c7de}
.performance-overview .metric-change.better{color:#7cdbb6}
.performance-overview .metric-change.worse{color:#f0c28a}
.performance-overview .metric-change.neutral{color:#aebfd5}
.ability-secondary{border-color:#b5c9e522}
.ability-secondary>span{color:#afc1d9}
.ability-secondary b{color:#dae7f7}
.ability-secondary .unavailable{color:#aebed2}
.conversion-ability{background:linear-gradient(155deg,#668dcc30,#4874b012);box-shadow:inset 0 2px 0 #90b6fb65}
.conversion-ability h2{color:#aecbff}
.conversion-ability .main-metric strong{color:#d8e8ff}
.conversion-children{border-color:#b5c9e527;background:linear-gradient(145deg,#ffffff07,#ffffff02)}
.conversion-children:before{border-color:#90afd754}
.children-heading{border-color:#b5c9e522}
.children-heading h3{color:#bacde6}
.children-heading .text-button{color:#9dbff1}
.branch-mark{color:#96b8e9}
.child-metric>span{color:#a9bed8}
.child-metric strong{color:#e0ecfb}
.child-metric strong.unavailable{color:#a5b6cd}
.child-metric p{color:#a8bad3}
.child-metric p b{color:#d4e2f5}
.conversion-cost{border-color:#b5c9e522}

/* One compact doorway instead of four open text cards. */
.qa-entry{display:flex;align-items:center;gap:15px;margin:0 32px 25px;border:1px solid #dfe8f5;border-radius:8px;background:linear-gradient(105deg,#f4f8ff,#fafcff);padding:15px 18px}
.qa-entry-icon{width:45px;height:43px;display:grid;place-items:center;border-radius:9px;background:#e5eefe;color:#507dbb;flex-shrink:0;font-size:13px;font-weight:600;letter-spacing:-.3px}
.qa-entry-copy{flex:1;min-width:0}
.qa-entry-copy h2{font-size:15px;font-weight:600;color:#3b5e8c;line-height:1.6}
.qa-entry-copy p{font-size:11px;line-height:1.8;color:#8094af;margin-top:1px}
.qa-entry-button{flex-shrink:0;border:1px solid #d7e3f4;border-radius:6px;background:white;color:#5c81b4;padding:7px 12px;font-size:11px;white-space:nowrap}
.qa-entry-button span{margin-left:7px}
.qa-entry-button:hover{background:#edf4ff;border-color:#bdd3f2}

/* Native dialog, laid out as an independent right-side drawer. */
body:has(dialog[open]){overflow:hidden}
#qa-drawer{position:fixed;inset:0 0 0 auto;margin:0;border:0;border-left:1px solid #dbe5f0;border-radius:14px 0 0 14px;width:min(860px,100vw);height:100dvh;max-height:100dvh;max-width:100vw;padding:0;background:#fff;overflow:hidden;box-shadow:-15px 0 65px #132a4430}
#qa-drawer[open]{display:flex;flex-direction:column;animation:qa-arrive .18s ease-out}
#qa-drawer::backdrop{background:#172b4445;backdrop-filter:blur(2px)}
.qa-drawer-head{flex-shrink:0;padding:21px 25px 18px;background:linear-gradient(110deg,#f8fbff,#fff);align-items:center}
.qa-drawer-head>div>span{font-size:11px;color:#8c9db2}
.qa-drawer-head h2{font-size:20px;color:#345579;margin-top:3px}
.qa-drawer-content{flex:1;min-height:0;overflow:auto;padding:18px 24px 25px;overscroll-behavior:contain}
#qa-drawer .qa-intro{gap:15px;margin-bottom:15px}
#qa-drawer .qa-intro p{font-size:12px;line-height:1.9;color:#7589a2}
#qa-drawer .qa-intro>span{font-size:9px;white-space:nowrap}
#qa-drawer .qa-cards{gap:13px;align-items:start}
#qa-drawer .practice-card{padding:14px}
#qa-drawer .practice-heading{display:block;margin-bottom:9px}
#qa-drawer .practice-category{font-size:11px;display:block}
#qa-drawer .practice-source{font-size:10px;display:block;margin-top:2px;color:#8d9db1}
#qa-drawer .question-bubble{padding:8px 40px 10px 10px}
#qa-drawer .question-bubble h3{font-size:14px;line-height:1.8}
#qa-drawer .answer-draft p{font-size:12px;line-height:1.85}
#qa-drawer .shot-step,#qa-drawer .qa-when{font-size:11px;line-height:1.85}
#qa-drawer .qa-follow{font-size:11px;line-height:1.8}
#qa-drawer .qa-rhythm{font-size:11px;line-height:1.8}
#qa-feedback{flex-shrink:0;min-height:0;font-size:12px;line-height:1.8;color:#417a67;background:#eff8f4;text-align:center}
#qa-feedback:not(:empty){padding:10px 20px;border-top:1px solid #d8eae2}
.qa-outline{border:1px solid #e0e9f5;border-radius:7px;margin-top:19px;background:#fbfcfe}
.qa-outline summary{padding:11px 13px;color:#617fa6;font-size:12px;cursor:pointer;font-weight:600}
.qa-outline summary span{font-size:10px;color:#92a3ba;margin-left:8px;font-weight:400}
.qa-outline .outline-groups{padding:0 14px 5px;border-top:1px solid #e5ecf5}
.qa-outline .outline-group:last-child{border-bottom:0}
.qa-outline .outline-group h3{font-size:13px}
.qa-outline .outline-group span{font-size:11px}
@keyframes qa-arrive{from{transform:translateX(30px);opacity:.65}to{transform:translateX(0);opacity:1}}
@media(prefers-reduced-motion:reduce){#qa-drawer[open]{animation:none}}
@media(min-width:1500px){.qa-entry{margin-left:38px;margin-right:38px}.performance-overview{padding:21px 24px}.ability h2{font-size:22px}}
@media(max-width:1150px){.performance-overview{padding:17px 18px 18px}.qa-entry{margin-left:22px;margin-right:22px}}
@media(max-width:760px){.performance-overview{padding:15px 11px;border-radius:9px;margin-left:-5px;margin-right:-5px}.performance-topline{font-size:11px}.comparison-period{font-size:10px}.ability h2{font-size:18px}.qa-entry{margin:0 18px 20px;padding:12px;gap:10px}.qa-entry-icon{width:37px;height:38px;font-size:11px}.qa-entry-copy h2{font-size:14px}.qa-entry-copy p{font-size:10px}.qa-entry-button{padding:6px 9px;font-size:10px}.qa-entry-button span{margin-left:3px}#qa-drawer{border-radius:10px 0 0 10px}#qa-drawer .qa-cards{grid-template-columns:1fr}.qa-drawer-head{padding:18px}.qa-drawer-head h2{font-size:19px}.qa-drawer-content{padding:15px 17px 22px}#qa-drawer .practice-heading{display:flex;flex-wrap:wrap;gap:2px 9px}#qa-drawer .practice-source{margin:0}#qa-drawer .question-bubble h3{font-size:15px}#qa-drawer .answer-draft p{font-size:13px}#qa-drawer .qa-intro{display:block}.qa-drawer-head .close{width:32px;height:32px}}
@media(max-width:430px){.performance-overview{padding-left:9px;padding-right:9px}.ability{padding-left:6px;padding-right:6px}.main-metric>strong{font-size:25px}.ability h2{font-size:17px}.main-metric>span{font-size:9px}.ability-secondary>span{font-size:9px}.qa-entry-copy p{max-width:165px}.qa-entry-button{font-size:10px}}
@media print{.performance-overview{box-shadow:none;-webkit-print-color-adjust:exact;print-color-adjust:exact}.qa-entry-button,#qa-drawer{display:none!important}}