/* Compact editorial splits, alternating the media side within the approved palette. */
.reading-brief{width:min(940px,calc(100vw - 64px));margin:70px 0 70px 50%;transform:translateX(-50%);display:grid;grid-template-columns:1.08fr 1fr;overflow:hidden;isolation:isolate;border:1px solid var(--glass-rim);border-radius:22px;background:var(--cabin);box-shadow:0 16px 50px #0003;scroll-margin-top:105px}
.brief-art{position:relative;align-self:stretch;min-height:365px;overflow:hidden;background:#0b0c0e;isolation:isolate}
.brief-art>img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;object-position:center;max-width:none;margin:0;opacity:.95}
.brief-caption{padding:30px 30px 24px;align-self:center;min-width:0}
.brief-flip .brief-art{grid-column:2;grid-row:1}.brief-flip .brief-caption{grid-column:1;grid-row:1}
.brief-caption .brief-kicker{display:block;font:10px/1.6 var(--mono);letter-spacing:.08em;color:var(--ember-2);margin:0 0 15px}
.brief-caption .brief-title{font:39px/1.08 var(--display);color:var(--bone);margin:0 0 16px;text-wrap:balance}
.brief-caption .brief-instruction{font:14px/1.65 var(--body);color:var(--bone);margin:0 0 18px}
.brief-controls{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.brief-controls[hidden],.brief-pause[hidden]{display:none}
.brief-controls button,.brief-pause{min-height:44px;padding:10px 13px;border:1px solid var(--steel);border-radius:12px;background:var(--void);color:var(--bone);font:11px/1.4 var(--mono);touch-action:manipulation}
.brief-controls button:hover:not(:disabled),.brief-controls button[aria-pressed='true']{border-color:var(--ember-2);box-shadow:inset 0 0 0 1px var(--ember-2)}
.brief-controls button:disabled{color:var(--steel);border-style:dashed}
.reading-brief :is(button,input):focus-visible{outline:3px solid var(--ember-2);outline-offset:4px}
.brief-caption .brief-status{font:12px/1.7 var(--body);color:var(--bone);min-height:62px;margin:18px 0 0}
.brief-pause{font-size:9px;color:var(--steel);border:0;padding:8px 0;background:transparent;text-decoration:underline;text-underline-offset:4px}
.brief-range{display:flex;flex-direction:column;gap:5px;width:100%;font:11px/1.5 var(--mono);color:var(--bone)}
.brief-range input{width:100%;min-height:44px;margin:0;accent-color:var(--ember-2);touch-action:pan-y}
.brief-atmosphere{position:absolute;inset:-30%;z-index:4;pointer-events:none;background:linear-gradient(110deg,transparent 40%,#ffbc7d19 50%,transparent 60%);transform:translateX(-20%);animation:brief-light 9s ease-in-out infinite alternate;animation-play-state:paused}
.reading-brief.is-moving .brief-atmosphere{animation-play-state:running}
@keyframes brief-light{to{transform:translateX(20%);opacity:.4}}
.feeling-glow{position:absolute;top:20%;width:33%;height:45%;border-radius:50%;background:#080a0de0;box-shadow:0 0 20px 6px #080a0da0;transition:background .6s,box-shadow .6s}
.glow-warm{left:14%}.glow-cool{left:53%}
#two-feelings[data-moved='true'] .glow-warm{background:#fda05612;box-shadow:0 0 24px #ffb77450}
#two-feelings[data-troubled='true'] .glow-cool{background:#7bb1dd12;box-shadow:0 0 24px #9bcbe450}
.name-plate,.name-reveal,.collector-label,.burn-word,.fable-cover,.fable-letter,.cost-labels span{position:absolute;z-index:3;padding:12px 16px;background:#211a17;color:#ece7e0;border:1px solid #af9380;box-shadow:0 8px 22px #0007;font:13px/1.3 var(--mono)}
.name-plate{top:42%;left:20%;width:60%;text-align:center;transform:rotate(-9deg);transform-origin:5% 30%;transition:transform .7s ease,opacity .7s;border-radius:4px;background:linear-gradient(115deg,#453025,#211a17 70%);letter-spacing:.1em}
.name-reveal{top:49%;left:20%;width:60%;text-align:center;background:#e0bd80;color:#38271a;transform:rotate(-9deg);font-family:var(--display);font-size:24px;padding:8px;opacity:0;transition:opacity .4s}
#stolen-name[data-revealed='true'] .name-plate{transform:translateY(-100px) rotate(-17deg)}
#stolen-name[data-revealed='true'] .name-reveal{opacity:1}
.collector-label{left:50%;top:17%;transform:translateX(-50%);font:26px var(--display);min-width:100px;text-align:center;border-radius:8px}
.collector-pieces{position:absolute;inset:0;z-index:2}
.collector-pieces i{position:absolute;top:64%;left:10%;width:26%;height:66px;padding:10px 3px;display:flex;align-items:center;justify-content:center;font:10px var(--mono);font-style:normal;background:#e0bd80;color:#38271a;box-shadow:0 5px 14px #0009;transform:rotate(-8deg);transition:left .65s,top .65s,transform .65s,opacity .65s}
.collector-pieces i:nth-child(2){left:37%;transform:rotate(5deg)}.collector-pieces i:nth-child(3){left:64%;transform:rotate(-4deg)}
.collector-pieces i.is-collected{top:26%;left:37%;transform:scale(.45) rotate(0);opacity:.3}
#the-collector[data-collected='3'] .collector-label{box-shadow:0 0 0 4px #ff8a5060,0 12px 30px #000}
.burn-horizon{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#ff73114a,transparent 45%);transition:transform .8s}
#two-burns[data-burn='last'] .burn-horizon{transform:rotate(180deg)}
#two-burns .brief-art img{transition:filter .8s}
#two-burns[data-burn='last'] .brief-art img{filter:saturate(.35) brightness(.7)}
.burn-word{left:20px;bottom:22px;border-radius:10px;font:31px var(--display)}
.fable-cover{left:17%;top:22%;width:66%;height:49%;display:flex;align-items:center;justify-content:center;text-align:center;transform:rotate(-7deg);font:26px var(--display);background:linear-gradient(115deg,#453025,#211a17 70%);border-radius:5px;transition:transform .8s,opacity .7s;transform-origin:center bottom}
.fable-letter{left:32%;top:48%;width:40%;text-align:center;font:30px var(--display);background:#e0bd80;color:#38271a;transform:translateY(40px) rotate(8deg) scale(.6);opacity:0;transition:transform .8s,opacity .8s;z-index:2;border-color:#6e422c;border-bottom:3px solid #9e432b}
#red-fable[data-folded='true'] .fable-cover{transform:translateY(-70px) rotate(-12deg) scale(.35);opacity:0}
#red-fable[data-folded='true'] .fable-letter{transform:translateY(-15px) rotate(-8deg) scale(1);opacity:1}
.cost-labels{position:absolute;inset:0;z-index:3;pointer-events:none}
.cost-labels span{top:73%;left:13%;border-radius:8px;padding:7px 12px;font-size:11px}.cost-labels span+span{left:auto;right:13%}
.cost-pieces{position:absolute;inset:0;z-index:2;pointer-events:none}
.cost-pieces i{position:absolute;width:25px;height:17px;background:#e0bd80;border:1px solid #38271a;box-shadow:0 2px 5px #0008;left:20%;top:54%;transition:left .18s linear,top .18s linear,transform .18s linear}
@media(max-width:1000px){.reading-brief{width:min(880px,calc(100vw - 48px));grid-template-columns:1fr 1fr}.brief-caption{padding:26px}.brief-caption .brief-title{font-size:35px}}
@media(max-width:700px){.reading-brief{width:100%;margin:48px 0;transform:none;display:flex;flex-direction:column}.brief-art{min-height:0;aspect-ratio:3/2;width:100%}.brief-caption{padding:25px 22px 16px}.brief-caption .brief-title{font-size:34px}.brief-caption .brief-status{min-height:42px}.brief-controls{gap:12px}.brief-controls button{flex:1}.name-plate{font-size:11px}.collector-pieces i{height:50px;font-size:9px}.cost-pieces i{width:20px;height:14px}}
@media(prefers-reduced-motion:reduce){.reading-brief *{animation:none!important;transition:none!important}.brief-atmosphere,.brief-pause{display:none!important}}
@media print{.reading-brief{display:block;width:100%;transform:none;margin:20px 0;border:1px solid #777;background:#fff;box-shadow:none;break-inside:avoid}.brief-art,.brief-controls,.brief-pause,.brief-status{display:none!important}.brief-caption{padding:16px}.brief-caption :is(.brief-title,.brief-instruction,.brief-kicker){color:#111}}
