/* Scoped to the written attention-designs lesson. */
.attention-designs .design-compare-head{flex-wrap:wrap;gap:8px}
.attention-designs{--ad-panel:#111b2a;--ad-soft:#1b2b42;--ad-ink:#eaf1fc;--ad-muted:#aab9cc;--ad-line:#39506c;--ad-accent:#95b8ff;--ad-mint:#85dfc0}.attention-designs .design-lede{font-size:20px;line-height:1.65;color:#c4d0df;max-width:850px}.attention-designs .design-map{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:32px 0}.attention-designs .design-map a{border:1px solid var(--ad-line);padding:17px;color:var(--ad-ink);display:flex;gap:12px;border-radius:10px;background:rgba(21,31,47,.7)}.attention-designs .design-map a:hover{background:var(--ad-soft);text-decoration:none}.attention-designs .design-map b{color:var(--ad-accent);font-size:21px}.attention-designs .design-map strong,.attention-designs .design-map small{display:block;line-height:1.4}.attention-designs .design-map small{color:var(--ad-muted);font-size:11px;margin-top:6px}.attention-designs .design-warning{border-left:3px solid var(--ad-mint);background:#142337;padding:18px 22px;margin:25px 0 38px}.attention-designs .design-warning p{margin:5px 0 0;color:#c2cede}.attention-designs .design-warning em{color:var(--ad-mint);font-style:normal;font-weight:700}.attention-designs .design-compare{border:1px solid var(--ad-line);background:var(--ad-panel);border-radius:14px;padding:28px;margin:38px 0 56px}.attention-designs .design-compare-head{display:flex;justify-content:space-between;font-size:10px;letter-spacing:1.2px;color:#a8c0e9}.attention-designs .design-compare .live{color:var(--ad-mint)}.attention-designs .design-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:22px 0}.attention-designs .design-tabs button{flex:1;min-width:110px;border-color:var(--ad-line);background:#152033}.attention-designs .design-tabs button[aria-selected="true"]{background:#304b72;border-color:var(--ad-accent);color:#fff}.attention-designs .design-stage{border-top:1px solid var(--ad-line);padding-top:21px}.attention-designs .design-stage-label{font-size:10px;letter-spacing:1.3px;color:var(--ad-mint);margin:0}.attention-designs .design-stage h4{font-size:23px;line-height:1.25;margin:6px 0}.attention-designs .design-stage-copy>p:not(.design-stage-label){color:#bdcbe0;margin:0;max-width:780px}.attention-designs .design-meters{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:22px 0}.attention-designs .design-meters>div{display:grid;grid-template-columns:120px 1fr auto;gap:10px;align-items:center;font-size:12px;color:var(--ad-muted)}.attention-designs .design-meters output{font-weight:700;color:var(--ad-ink);min-width:62px;text-align:right}.attention-designs .design-meter{height:9px;background:#29384e;border-radius:20px;overflow:hidden}.attention-designs .design-meter i{display:block;height:100%;background:var(--ad-accent);border-radius:inherit;transition:width .22s ease}.attention-designs .design-read-meter i{background:var(--ad-mint)}.attention-designs .design-layer-row{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:20px 0}.attention-designs .design-layer{min-height:92px;border:1px solid var(--ad-line);padding:10px;border-radius:8px;font-size:11px;color:var(--ad-muted);background:#17243a}.attention-designs .design-layer strong,.attention-designs .design-layer span{display:block}.attention-designs .design-layer strong{font-size:13px;color:var(--ad-ink);margin-bottom:7px}.attention-designs .design-layer .design-owner{color:var(--ad-mint);font-weight:700}.attention-designs .design-layer .design-read-mark{color:#d6c486}.attention-designs .design-result{padding:17px 20px;background:#17243a;border-left:2px solid var(--ad-accent)}.attention-designs .design-result p{margin:4px 0 0;color:#bdcbe0}.attention-designs .design-card{display:grid;grid-template-columns:72px 1fr;gap:22px;padding:35px 0;border-top:1px solid var(--ad-line)}.attention-designs .design-card-number{font-size:31px;line-height:1;color:var(--ad-accent);font-weight:750}.attention-designs .design-card .eyebrow{margin-bottom:9px}.attention-designs .design-card h3{font-size:30px;line-height:1.22;margin:0 0 13px}.attention-designs .design-card p{max-width:825px;color:#bac7d8}.attention-designs .design-flow,.attention-designs .design-selection-strip{display:flex;align-items:center;gap:12px;flex-wrap:wrap;background:#16243a;border:1px solid var(--ad-line);padding:16px 18px;margin:20px 0;color:#d8e4f5;font-size:13px}.attention-designs .design-flow span,.attention-designs .design-selection-strip span{border:1px solid #526b8c;padding:8px 10px;border-radius:6px;text-align:center;line-height:1.45}.attention-designs .design-flow b,.attention-designs .design-selection-strip>b{font-size:20px;color:var(--ad-accent)}.attention-designs .design-highlight,.attention-designs .design-picked{border-color:var(--ad-mint)!important;color:var(--ad-mint)}.attention-designs .design-selection-strip i{color:#b8c7dc;font-style:normal;line-height:1.35;text-align:center}.attention-designs .design-math{max-width:720px;margin:18px 0;padding:14px 17px;border-left:2px solid var(--ad-mint);background:#122032;overflow:auto}.attention-designs .design-math code{color:#d6e5fb;font-size:12px;line-height:1.75;white-space:pre}.attention-designs .design-owners{display:flex;align-items:stretch;gap:9px;margin:21px 0}.attention-designs .design-owners div{flex:1;border:1px solid var(--ad-line);padding:12px;border-radius:7px;background:#16243a}.attention-designs .design-owners span,.attention-designs .design-owners strong{display:block}.attention-designs .design-owners span{color:var(--ad-mint);font-size:11px;letter-spacing:1px}.attention-designs .design-owners strong{font-size:13px;line-height:1.4;margin-top:4px}.attention-designs .design-owners i{align-self:center;font-style:normal;color:var(--ad-accent)}.attention-designs .design-recap{margin:20px 0;padding:28px;border:1px solid var(--ad-line);background:var(--ad-panel);border-radius:12px}.attention-designs .design-recap dl{margin:20px 0}.attention-designs .design-recap dl>div{display:grid;grid-template-columns:115px 1fr;border-top:1px solid var(--ad-line);padding:13px 0}.attention-designs .design-recap dt{color:var(--ad-mint);font-weight:750}.attention-designs .design-recap dd{margin:0;color:#bdcbe0}.attention-designs details{max-width:825px}.attention-designs details p{color:var(--ad-muted)}
@media (max-width:720px){.attention-designs .design-map{grid-template-columns:1fr}.attention-designs .design-compare{padding:19px}.attention-designs .design-meters{grid-template-columns:1fr}.attention-designs .design-meters>div{grid-template-columns:105px 1fr auto}.attention-designs .design-layer-row{grid-template-columns:repeat(2,1fr)}.attention-designs .design-card{grid-template-columns:1fr;gap:10px}.attention-designs .design-card-number{font-size:22px}.attention-designs .design-card h3{font-size:25px}.attention-designs .design-owners{flex-direction:column}.attention-designs .design-owners i{text-align:center;transform:rotate(90deg)}.attention-designs .design-recap dl>div{grid-template-columns:1fr;gap:4px}.attention-designs .design-selection-strip{align-items:flex-start;flex-direction:column}.attention-designs .design-selection-strip>b{align-self:center;transform:rotate(90deg)}}

/* Let long worked equations wrap within narrow lesson columns. */
.attention-designs .design-card{min-width:0}.attention-designs .design-card>*{min-width:0}.attention-designs .design-math{min-width:0;max-width:100%;overflow-x:auto}.attention-designs .design-math code{white-space:normal;overflow-wrap:anywhere}.attention-designs .design-flow{flex-wrap:wrap}