/* Chapter 03 only. Shared rules live in deck.css. */
.scene[aria-label^="ch03-"] .c3-lanes u { position: absolute; left: 0; right: 0; height: 1px; background: var(--panel-rule); text-decoration: none; }
.scene[aria-label^="ch03-"] .c3-lanes b { position: absolute; left: 0; width: 250px; font: 700 32px/1.15 var(--display); }

.scene[aria-label^="ch03-"] .c3-off { color: #a9a9ad; }
.scene[aria-label^="ch03-"] .c3-off .b-detail { color: #a9a9ad; }
.scene[aria-label^="ch03-"] .c3-fill { background: #0c0c0d; }
.scene[aria-label^="ch03-"] .c3-found { color: var(--tai-void); font-weight: 600; }
.scene[aria-label^="ch03-"] .c3-center { text-align: center; }
.scene[aria-label^="ch03-"] .c3-dim { background: rgba(0, 0, 0, 0.62); }
.scene[aria-label^="ch03-"] .c3-tight-detail .b-title { font-size: 28px; }
.scene[aria-label^="ch03-"] .c3-center-box { display: flex; align-items: center; justify-content: center; padding: 0; }
.scene[aria-label^="ch03-"] .c3-pass .b-title { font-size: 28px; }

.scene[aria-label^="ch03-"] .c3-tag { padding: 6px 12px; border: 2px solid var(--tai-amber); color: var(--tai-amber); font: 600 26px/1.2 var(--body); text-align: center; }
.scene[aria-label^="ch03-"] .c3-tag-wide { padding: 12px 14px; text-align: left; }

.scene[aria-label^="ch03-"] .c3-col i { display: block; background: #7c7c80; }

.scene[aria-label^="ch03-"] .c3-heading code { font-family: var(--mono); font-size: 44px; font-weight: 700; letter-spacing: -0.02em; }
.scene[aria-label^="ch03-"] .c3-ns { box-sizing: border-box; padding: 18px 22px; border: 2px dashed #6d6d70; font: 500 28px/1.2 var(--display); color: var(--text-soft); }
.scene[aria-label^="ch03-"] .c3-db { border-style: solid; border-color: var(--panel-rule); }
.scene[aria-label^="ch03-"] .c3-branch code { font: 700 32px/1.2 var(--mono); }
.scene[aria-label^="ch03-"] .c3-row { display: flex; align-items: center; background: #1a1a1c; }
.scene[aria-label^="ch03-"] .c3-row .b-title { font: 400 28px/1.2 var(--body); color: var(--text-soft); }
.scene[aria-label^="ch03-"] .c3-row-real { background: #2a2a2d; border-color: #7c7c80; }
.scene[aria-label^="ch03-"] .c3-row-real .b-title { color: var(--tai-void); font-weight: 600; }

/* The spec under review: Slinger's real text on a panel, with the commented sentences highlighted. */
.scene[aria-label^="ch03-"] .c3-spec { background: var(--panel); border: 2px solid var(--panel-rule); }
.scene[aria-label^="ch03-"] .c3-spec > div { position: absolute; left: 28px; right: 28px; white-space: nowrap; }
.scene[aria-label^="ch03-"] .c3-spec-title { font: 700 28px/29px var(--display); color: var(--tai-void); }
.scene[aria-label^="ch03-"] .c3-spec-h { font: 700 25px/29px var(--display); color: var(--text-soft); }
.scene[aria-label^="ch03-"] .c3-spec-line { font: 400 24px/29px var(--body); color: #e7e7e8; }
.scene[aria-label^="ch03-"] .c3-hl { --hl: 0; background: rgba(201, 201, 203, calc(var(--hl) * 0.26)); box-shadow: inset 0 -3px 0 rgba(255, 255, 255, var(--hl)); color: color-mix(in srgb, #e7e7e8, #ffffff calc(var(--hl) * 100%)); }
.scene[aria-label^="ch03-"] .c3-card { background: #fff; }
.scene[aria-label^="ch03-"] .c3-take-head { display: flex; justify-content: space-between; align-items: baseline; font: 600 26px/1.2 var(--body); color: #57585b; }
.scene[aria-label^="ch03-"] .c3-meta { font-weight: 400; }
.scene[aria-label^="ch03-"] .c3-take-text { font: 500 26px/1.3 var(--body); color: #000; }
.scene[aria-label^="ch03-"] .c3-opt { display: flex; gap: 22px; align-items: flex-start; padding-top: 14px; border-top: 1px solid #d4d4d8; }
.scene[aria-label^="ch03-"] .c3-opt em, .scene[aria-label^="ch03-"] .c3-chosen em { flex: none; display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; box-sizing: border-box; border: 2px solid #8a8a90; color: #000; font: 700 28px/1 var(--display); font-style: normal; }
.scene[aria-label^="ch03-"] .c3-opt p { margin: 0; font: 400 26px/1.3 var(--body); color: #000; }
.scene[aria-label^="ch03-"] .c3-opt mark { padding: 2px 12px; background: #000; color: #fff; font: 600 24px/1.3 var(--body); white-space: nowrap; }
.scene[aria-label^="ch03-"] .c3-take-or { font: 400 26px/1.3 var(--body); color: #3f3f43; padding-top: 14px; border-top: 1px solid #d4d4d8; }
.scene[aria-label^="ch03-"] .c3-chosen { display: flex; gap: 14px; align-items: center; padding-top: 14px; pointer-events: none; }
.scene[aria-label^="ch03-"] .c3-chosen em { background: #000; border-color: #000; color: #fff; }
.scene[aria-label^="ch03-"] .c3-chosen span { position: absolute; right: 0; top: 84px; display: flex; gap: 8px; align-items: center; padding: 2px 12px; background: #000; color: #fff; font: 600 24px/1.3 var(--body); }

.scene[aria-label^="ch03-"] .c3-screen { overflow: hidden; border: 2px solid var(--panel-rule); }
.scene[aria-label^="ch03-"] .c3-screen img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: top left; }
.scene[aria-label^="ch03-"] .c3-next { border-top: 2px solid var(--tai-amber); padding-top: 12px; font: 500 28px/1.2 var(--display); color: var(--tai-amber); }
.scene[aria-label="ch03-loop"] .c3-why { font: 500 32px/1.25 var(--display); color: var(--tai-void); }
.scene[aria-label="ch03-loop"] .c3-again { white-space: nowrap; }

/* The app contract's two sides, and the panel behind them. */
.scene[aria-label^="ch03-"] .body.line.c3-colhead { font: 700 40px/1.2 var(--display); color: var(--tai-void); }
.scene[aria-label^="ch03-"] .dbox.c3-contract .b-detail code, .scene[aria-label^="ch03-"] .dbox.c3-contract .b-title code { font-family: var(--mono); font-size: 0.95em; }
.scene[aria-label^="ch03-"] .dbox.c3-contract .b-detail { font-size: 28px; line-height: 1.3; }
.scene[aria-label^="ch03-"] .dbox.c3-center-row { display: flex; align-items: center; }
.scene[aria-label^="ch03-"] .c3-url code { font: 600 28px/1.2 var(--mono); color: var(--tai-void); }
.panel-content[aria-label="panel-ch03-app-contract"] .c3p-head { font: 700 32px/1.2 var(--display); color: var(--tai-void); }
.panel-content[aria-label="panel-ch03-app-contract"] .c3p-list code { font-family: var(--mono); font-size: 1em; }
.panel-content[aria-label="panel-ch03-app-contract"] .c3p-note { font-size: 26px; color: var(--text-soft); }
.scene[aria-label^="ch03-"] .dbox.c3-contract code { white-space: nowrap; }
.panel-content[aria-label="panel-ch03-app-contract"] .c3p-list { margin: 0; padding: 0 0 0 26px; list-style: "- "; font: 400 25px/1.3 var(--body); color: #e7e7e8; }
.panel-content[aria-label="panel-ch03-app-contract"] .c3p-list li { margin-bottom: 14px; }