#officeContent .os-showcase{padding:80px 4.7% 0;max-width:1500px;margin:auto;scroll-margin-top:110px}
#officeContent .os-intro{display:flex;justify-content:space-between;gap:45px;align-items:end;margin-bottom:48px}
#officeContent .os-intro h2{font-size:clamp(48px,4.8vw,72px);letter-spacing:-1.5px;line-height:1.03}
#officeContent .os-intro h2 em,#officeContent .os-bible h2 em{font-weight:400;color:#a57b37}
#officeContent .os-intro>p{font-size:14px;line-height:1.8;color:#7a7469;max-width:365px;padding-bottom:4px}
#officeContent .os-controls{display:flex;justify-content:center;align-items:center;border-top:1px solid #dad5cd;border-bottom:1px solid #dad5cd;gap:24px}
#officeContent .os-controls nav{display:flex;justify-content:center;gap:38px}
#officeContent .os-controls button{border:0;background:none;font-size:13px;color:#6f6658;padding:21px 0;position:relative}
#officeContent .os-controls button[aria-pressed=true]{color:#30271c}
#officeContent .os-controls nav button[aria-pressed=true]:after{content:'';position:absolute;bottom:-1px;left:0;right:0;height:2px;background:#a57b37}
#officeContent .os-theatre{height:570px;position:relative;overflow:hidden}
#officeContent .os-act{height:100%;display:grid;grid-template-columns:31% 69%;align-items:center;gap:0}
#officeContent .os-act[hidden]{display:none}
#officeContent .os-story{padding-right:28px;z-index:2}
#officeContent .os-number{font:10px 'IBM Plex Mono',monospace;letter-spacing:1.3px;color:#85683a;display:block;margin-bottom:23px}
#officeContent .os-story h3{font:400 clamp(34px,3.2vw,48px)/1.04 'Instrument Serif',serif;letter-spacing:-.6px;margin:0}
#officeContent .os-story h3 em{font-weight:400;color:#9a773b}
#officeContent .os-story>p{font-size:13px;line-height:1.85;max-width:280px;color:#756b5c;margin-top:25px}
#officeContent .os-visual{height:490px;position:relative;isolation:isolate;margin-left:32px;overflow:hidden}
#officeContent .os-quote{margin:24px 0 22px;display:flex;gap:16px;align-items:center;min-height:32px}
#officeContent .os-quote>span{font:9px 'IBM Plex Mono',monospace;color:#85683a;letter-spacing:.5px;max-width:90px;line-height:1.6}
#officeContent .os-quote>p{font:400 24px 'Instrument Serif',serif;color:#3c352b}
#officeContent .os-native-motion{display:block;width:100%;height:364px;border:0;background:transparent;pointer-events:none}
#officeContent .os-context{display:flex;gap:18px;justify-content:space-between;margin-top:18px;font:9px 'IBM Plex Mono',monospace;letter-spacing:.2px;color:#6f6658}
#officeContent .os-call-glimpse{position:absolute;top:37px;left:35px;width:72%;height:440px;transform:rotate(-5deg);border:1px solid #d8cfbf;box-shadow:0 10px 35px #78684f1c;overflow:hidden;background:white}
#officeContent .os-call-glimpse img{display:block;width:100%;max-width:none}
#officeContent .os-question{position:absolute;right:0;top:190px;width:51%;background:#f5f1e8;border-top:2px solid #ad8745;padding:25px 24px 28px;box-shadow:0 15px 38px #6c583526;animation:os-result-in .8s both}
#officeContent .os-question>span{font:9px 'IBM Plex Mono',monospace;letter-spacing:.4px;color:#7a5f33}
#officeContent .os-question>p{font:400 33px/1.08 'Instrument Serif',serif;color:#4c3c25;margin-top:16px}
#officeContent .os-question>small{display:block;font-size:11px;line-height:1.6;color:#79694f;margin-top:21px}
#officeContent .os-question i{display:block;height:1px;background:#d5c5aa;margin-top:21px;width:80%}
@keyframes os-result-in{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
#officeContent .os-stage-caption{display:flex;justify-content:space-between;gap:24px;padding:17px 0;border-top:1px solid #e5ded3;font:9px 'IBM Plex Mono',monospace;letter-spacing:.5px;color:#6f6658}
#officeContent .os-bible{padding:100px 4.7% 65px;text-align:center}
#officeContent .os-bible h2{font:400 clamp(50px,5.4vw,79px)/1.02 'Instrument Serif',serif;letter-spacing:-1.4px}
#officeContent .os-bible-copy>p{font-size:14px;line-height:1.9;color:#8a7d6c;margin-top:25px}
#officeContent .os-paper-fan{height:460px;max-width:1100px;margin:48px auto 0;position:relative;perspective:1500px;isolation:isolate;mask-image:linear-gradient(#000 0%,#000 82%,transparent 100%)}
#officeContent .os-leaf{display:block;position:absolute;border:1px solid #ddd4c4;box-shadow:0 5px 30px #68522e22;background:#faf8f2;max-width:none;transition:transform 1.6s cubic-bezier(.2,.7,.2,1);transform-origin:50% 50%;pointer-events:none}
#officeContent .os-leaf-1{width:44%;left:7%;top:72px;transform:translateX(25%) rotate(-2deg);z-index:1}
#officeContent .os-leaf-2{width:41%;left:15%;top:161px;transform:translateX(15%) rotate(0);z-index:2}
#officeContent .os-leaf-3{width:31%;left:60%;top:49px;transform:translateX(-43%) rotate(1deg);z-index:3}
#officeContent .os-leaf-4{width:50%;left:26%;top:225px;z-index:4;transform:rotate(0)}
#officeContent .os-paper-fan.is-in-view .os-leaf-1{transform:rotate(-13deg)}
#officeContent .os-paper-fan.is-in-view .os-leaf-2{transform:rotate(-6deg)}
#officeContent .os-paper-fan.is-in-view .os-leaf-3{transform:rotate(12deg)}
#officeContent .os-paper-fan.is-in-view .os-leaf-4{transform:rotate(2deg)}
#officeContent .os-book-spine{position:absolute;bottom:0;left:0;right:0;height:65px;background:linear-gradient(transparent,white);z-index:5}
#officeContent .os-bible-scope{display:flex;gap:35px;justify-content:center;font:9px 'IBM Plex Mono',monospace;letter-spacing:1px;color:#85683a;margin-top:7px;flex-wrap:wrap}
#officeContent .os-bible-close{font:400 28px 'Instrument Serif',serif;margin:38px auto 0;color:#5e4e38}
#officeContent .os-bible-close em{font-weight:400;color:#a28a60}
.slate-native-book{display:block;text-decoration:none;min-height:260px;background:#faf8f2;overflow:hidden;border:1px solid #75634a;box-shadow:0 18px 50px #0006;transform:perspective(900px) rotateY(-5deg) rotate(2deg)}
.slate-native-book img{display:block;width:100%;height:280px;object-fit:cover;object-position:top}
.slate-native-book>span{display:block;padding:13px 18px;font:11px 'IBM Plex Mono',monospace;letter-spacing:.5px;color:#84704c;border-top:1px solid #cfc3ad}
@media(max-width:800px){
 #officeContent .os-showcase{padding:55px 6% 0}
 #officeContent .os-intro{display:block;margin-bottom:30px}
 #officeContent .os-intro h2{font-size:46px;letter-spacing:-1px}
 #officeContent .os-intro>p{margin-top:23px;font-size:13px;line-height:1.75}
 #officeContent .os-controls{gap:12px;flex-wrap:wrap;position:relative}
 #officeContent .os-controls nav{gap:18px;width:100%;justify-content:center}
 #officeContent .os-controls button{font-size:11px;padding:18px 0}
 #officeContent .os-theatre{height:auto;min-height:615px}
 #officeContent .os-act{height:auto;grid-template-columns:1fr;grid-template-rows:auto 370px;gap:24px}
 #officeContent .os-story{padding-right:0;align-self:start;padding-top:32px}
 #officeContent .os-number{font-size:9px;margin-bottom:17px}
 #officeContent .os-story h3{font-size:36px;line-height:1.04;letter-spacing:-.4px}
 #officeContent .os-story h3 br{display:none}
 #officeContent .os-story h3 em{display:block}
 #officeContent .os-story>p{max-width:100%;font-size:12px;line-height:1.8;margin-top:18px}
 #officeContent .os-visual{height:370px;margin-left:0;align-self:end}
 #officeContent .os-quote{margin:10px 0 20px;gap:12px}
 #officeContent .os-quote>p{font-size:21px}
 #officeContent .os-quote>span{font-size:9px;letter-spacing:0;max-width:68px}
 #officeContent .os-native-motion{height:273px}
 #officeContent .os-context{font-size:9px;letter-spacing:0;margin-top:15px;line-height:1.6}
 #officeContent .os-call-glimpse{left:13px;top:17px;width:78%;height:310px}
 #officeContent .os-act[data-os-act="2"]{grid-template-rows:auto 430px}
 #officeContent .os-day{height:430px}
 #officeContent .os-question{width:68%;top:118px;padding:17px 17px 22px}
 #officeContent .os-question>span{font-size:9px;letter-spacing:0}
 #officeContent .os-question>p{font-size:26px;margin-top:12px}
 #officeContent .os-question>small{font-size:11px;margin-top:14px}
 #officeContent .os-stage-caption{font-size:9px;gap:15px;line-height:1.6;letter-spacing:0}
 #officeContent .os-bible{padding:66px 6% 48px}
 #officeContent .os-bible h2{font-size:44px;letter-spacing:-1px}
 #officeContent .os-bible-copy>p{font-size:12px;line-height:1.8;margin-top:23px}
 #officeContent .os-bible-copy>p br{display:none}
 #officeContent .os-paper-fan{width:100%;margin:25px auto 0;height:255px}
 #officeContent .os-leaf-1{width:51%;left:5%;top:40px}
 #officeContent .os-leaf-2{width:52%;left:10%;top:104px}
 #officeContent .os-leaf-3{width:36%;left:59%;top:38px}
 #officeContent .os-leaf-4{width:59%;left:23%;top:148px}
 #officeContent .os-bible-scope{font-size:9px;gap:14px 22px;letter-spacing:.1px}
 #officeContent .os-bible-close{font-size:23px;line-height:1.2;max-width:300px;margin-top:29px}
 #officeContent .os-bible-close em{display:block;margin-top:8px}
}
/* The board is a deliberate close view, not a full-length report squeezed into a thumbnail. */
#officeContent .os-leaf-1{height:365px;object-fit:cover;object-position:top}
@media(max-width:800px){#officeContent .os-leaf-1{height:185px}}
/* Keep the DOOD title and cast columns complete in the Creative-to-Office bridge. */
.slate-native-book img{height:auto;object-fit:contain;object-position:top}

/* The layout stays fixed; each paper lifts into place as its native rows change. */
#officeContent[data-sequence-mode="scroll"] .os-scroll-track{height:calc(var(--os-stage-height) + var(--os-scroll-travel));position:relative}
#officeContent[data-sequence-mode="scroll"] .os-sticky{position:sticky;top:var(--os-sticky-top);height:var(--os-stage-height);display:flex;flex-direction:column;background:#fff}
#officeContent[data-sequence-mode="scroll"] .os-controls,#officeContent[data-sequence-mode="scroll"] .os-stage-caption{flex-shrink:0}
#officeContent[data-sequence-mode="scroll"] .os-theatre{flex:1;height:auto;min-height:0}
#officeContent[data-sequence-mode="scroll"] .os-act{position:absolute;inset:0;height:100%;min-height:0;pointer-events:none}
#officeContent[data-sequence-mode="scroll"] .os-act.is-current{pointer-events:auto}
#officeContent[data-sequence-mode="scroll"] .os-story,
#officeContent[data-sequence-mode="scroll"] .os-quote,
#officeContent[data-sequence-mode="scroll"] .os-context{opacity:0;transition:opacity 150ms ease}
#officeContent[data-sequence-mode="scroll"] .is-current .os-story,
#officeContent[data-sequence-mode="scroll"] .is-current .os-quote,
#officeContent[data-sequence-mode="scroll"] .is-current .os-context{opacity:1;transition:opacity 220ms ease}
#officeContent[data-sequence-mode="scroll"] .os-native-motion,
#officeContent[data-sequence-mode="scroll"] .os-call-glimpse{opacity:0;translate:42px 22px;rotate:3deg;scale:.975;transition:opacity 260ms ease,translate 500ms cubic-bezier(.22,1,.36,1),rotate 500ms cubic-bezier(.22,1,.36,1),scale 500ms cubic-bezier(.22,1,.36,1);will-change:opacity,translate,rotate,scale}
#officeContent[data-sequence-mode="scroll"] .is-leaving .os-native-motion,
#officeContent[data-sequence-mode="scroll"] .is-leaving .os-call-glimpse{translate:-32px -14px;rotate:-2deg}
#officeContent[data-sequence-mode="scroll"] .is-current .os-native-motion,
#officeContent[data-sequence-mode="scroll"] .is-current .os-call-glimpse{opacity:1;translate:0 0;rotate:0deg;scale:1;transition:opacity 220ms ease,translate 350ms cubic-bezier(.22,1,.36,1),rotate 350ms cubic-bezier(.22,1,.36,1),scale 350ms cubic-bezier(.22,1,.36,1)}
#officeContent[data-sequence-mode="scroll"] .os-question{animation:none;opacity:0;translate:0 18px;transition:opacity 180ms ease,translate 350ms ease}
#officeContent[data-sequence-mode="scroll"] .is-current .os-question{opacity:1;translate:0 0;transition:opacity 280ms ease 100ms,translate 400ms cubic-bezier(.22,1,.36,1) 100ms}
#officeContent[data-sequence-mode="scroll"] .os-visual{height:100%;max-height:490px;min-height:0}
#officeContent[data-sequence-mode="scroll"] .os-plan,#officeContent[data-sequence-mode="scroll"] .os-rewrite{display:flex;flex-direction:column;padding:12px 0}
#officeContent[data-sequence-mode="scroll"] .os-native-motion{flex:1;min-height:0;height:100%}
#officeContent[data-sequence-mode="scroll"] .os-quote,#officeContent[data-sequence-mode="scroll"] .os-context{flex-shrink:0}
#officeContent[data-sequence-mode="scroll"] .os-call-glimpse{height:90%;top:5%}
#officeContent[data-sequence-mode="scroll"] .os-question{top:36%}
#officeContent[data-sequence-mode="stacked"] .os-theatre{height:auto;overflow:visible}
#officeContent[data-sequence-mode="stacked"] .os-act{height:auto;min-height:570px;padding:25px 0;border-bottom:1px solid #dad5cd;scroll-margin-top:var(--os-sticky-top)}
#officeContent[data-sequence-mode="stacked"] .os-question{animation:none}
@media(max-width:800px){
 #officeContent .os-controls nav{gap:clamp(14px,5vw,30px)}
 #officeContent[data-sequence-mode="scroll"] .os-act,#officeContent[data-sequence-mode="scroll"] .os-act[data-os-act="2"]{grid-template-rows:auto minmax(0,1fr);gap:10px}
 #officeContent[data-sequence-mode="scroll"] .os-story{padding-top:22px}
 #officeContent[data-sequence-mode="scroll"] .os-story>p{margin-top:14px;line-height:1.65}
 #officeContent[data-sequence-mode="scroll"] .os-number{margin-bottom:12px}
 #officeContent[data-sequence-mode="scroll"] .os-visual{width:100%;max-height:none}
 #officeContent[data-sequence-mode="scroll"] .os-question{top:29%;padding:16px}
 #officeContent[data-sequence-mode="scroll"] .os-question>p{font-size:24px}
 #officeContent[data-sequence-mode="scroll"] .os-question>small{font-size:10px;margin-top:12px}
 #officeContent[data-sequence-mode="scroll"] .os-stage-caption{font-size:9px;padding:12px 0}
}
@media(prefers-reduced-motion:reduce){#officeContent .os-showcase *,#officeContent .os-paper-fan *{animation:none!important;transition:none!important}}
@media print{
#officeContent[data-sequence-mode="scroll"] .os-scroll-track{height:auto}
#officeContent[data-sequence-mode="scroll"] .os-sticky{position:static;height:auto;display:block}
#officeContent[data-sequence-mode="scroll"] .os-theatre{height:auto;overflow:visible}
#officeContent[data-sequence-mode="scroll"] .os-act{position:relative;inset:auto;height:auto;min-height:0;break-inside:avoid;padding:25px 0}
#officeContent[data-sequence-mode="scroll"] .os-act :is(.os-story,.os-quote,.os-context,.os-native-motion,.os-call-glimpse,.os-question){opacity:1;translate:none;rotate:none;scale:none;transition:none}
#officeContent[data-sequence-mode="scroll"] .os-visual{height:430px}
}
@media(min-width:2200px) and (min-height:1000px){#officeContent .os-showcase{max-width:min(2000px,80vw)}}
