/* Poetry side story shares the Demo's stage, reading, cast and outcome components. */
.cl-page { isolation:isolate; font-family:'Songti SC','Noto Serif SC',serif; }
.cl-stage { height:100dvh; min-height:100dvh; max-height:100dvh; }
.cl-scene-shade { position:absolute; inset:0; background:linear-gradient(180deg,#060b09b3,transparent 27%,#070b0840 60%,#040705cc); pointer-events:none; }
.cl-stage .backdrop { width:100%; height:100%; object-fit:cover; }
.cl-stage .story-topbar { z-index:3; }
.cl-stage .chapter-copy small { font-size:10px; }
.cl-stage .chapter-copy strong { font-size:16px; }
.cl-rail { right:12px; z-index:5; top:35%; bottom:auto; }
.cl-rail button { cursor:pointer; }
.cl-portrait { position:absolute; left:50%; top:10%; width:max(108%,72dvh); height:auto; max-width:none; transform:translateX(-50%); pointer-events:none; filter:drop-shadow(0 12px 18px #0006); }
.cl-dialogue { position:absolute; z-index:4; left:18px; right:55px; bottom:max(32px,env(safe-area-inset-bottom)); width:auto; min-height:140px; max-height:47dvh; overflow-y:auto; padding:18px 22px 14px; background:linear-gradient(130deg,#252016f0,#090b09ed); border:1px solid #a98b48; border-radius:20px 3px 20px 3px; }
.cl-dialogue .text { font:19px/1.85 'STKaiti','Kaiti SC',serif; }
.cl-dialogue .speaker { border:0; cursor:pointer; font-size:12px; }
.cl-dialogue div.speaker { cursor:default; }
.cl-dialogue .continue-control { margin-left:auto; display:block; min-height:42px; }
.cl-workbench { position:absolute; z-index:4; inset:108px 58px 28px 18px; overflow:auto; overscroll-behavior:contain; scrollbar-width:thin; padding:25px 22px; background:linear-gradient(145deg,#151912f5,#0d110fed); border:1px solid #aa8d555c; box-shadow:0 10px 40px #0005; border-radius:2px; }
.cl-workbench h1 { color:#ebd3a5; font:30px/1.4 'STKaiti','Kaiti SC',serif; font-weight:500; letter-spacing:.08em; margin:12px 0 20px; }
.cl-eyebrow { color:#c7ac76; font-size:11px; letter-spacing:.16em; }
.cl-body { font:17px/1.9 'STKaiti','Kaiti SC',serif; color:#f1e9d7; margin:0 0 22px; }
.cl-muted { font:12px/1.9 'Songti SC',serif; color:#c8bda7; }
.cl-choices { display:grid; gap:12px; margin:18px 0 0; }
.cl-choices .choice { width:100%; margin:0; text-align:left; white-space:normal; font:16px/1.8 'STKaiti','Kaiti SC',serif; min-height:52px; padding:12px 16px; background:#0b100dd1; border:1px solid #bfa57077; color:#f0dbaa; }
.cl-gold-button,.cl-outline-button,.cl-small-button { display:block; min-height:44px; cursor:pointer; border:1px solid #b69a61; color:#efd7a2; background:#0b100da8; font:16px/1.6 'STKaiti','Kaiti SC',serif; padding:10px 15px; border-radius:2px; }
.cl-gold-button { background:linear-gradient(120deg,#c5a66b,#ebd4a5 55%,#bd9e62); border:1px solid #f4e1b8; box-shadow:inset 0 0 0 3px #a4895144,0 3px 16px #0004; color:#302613; width:100%; text-align:center; }
.cl-outline-button { width:100%; text-align:center; margin-top:12px; }
.cl-small-button { display:inline-block; font-size:12px; min-height:36px; padding:7px 11px; width:auto; }
.cl-page button:disabled { opacity:.5; cursor:wait; }
.cl-page :focus-visible { outline:2px solid #ffe1a2; outline-offset:3px; }
.cl-workbench-heading { display:flex; gap:10px; justify-content:space-between; align-items:center; color:#c8af7b; padding-bottom:16px; border-bottom:1px solid #bb9c6044; font-size:11px; line-height:1.6; }
.cl-workbench-heading span { font-size:10px; }
.cl-paper-workbench { padding:22px 15px; }
.cl-poem { margin:18px 0; }
.cl-poem header { text-align:center; padding:12px 0 18px; }
.cl-poem header small { color:#b9a376; font-size:11px; letter-spacing:.16em; }
.cl-poem h2 { font:23px/1.55 'STKaiti','Kaiti SC',serif; color:#eed7a8; font-weight:500; margin:12px 0 0; }
.cl-poem-lines { display:grid; grid-template-columns:1fr 1fr; gap:2px 0; padding:22px 5px; border-block:1px solid #b28d493d; background:radial-gradient(ellipse at center,#c4aa6524,transparent); }
.cl-poem-line { display:block; width:100%; font:17px/1.8 'STKaiti','Kaiti SC',serif; letter-spacing:.03em; white-space:nowrap; border:0; border-bottom:1px solid transparent; color:#f3e7cc; background:transparent; padding:6px 0; cursor:pointer; }
.cl-poem-line.is-marked { text-decoration:underline; text-decoration-color:#ce7663; text-decoration-thickness:2px; text-underline-offset:8px; background:#963b2920; }
.cl-page .cl-poem-line:disabled { opacity:1; cursor:default; }
.cl-poem-hint { font-size:11px; color:#b9ac94; text-align:center; margin:12px 0 20px; }
.cl-gloss { border-bottom:1px solid #c1a36644; padding:14px 0; margin:12px 0 18px; font:15px/1.9 'STKaiti','Kaiti SC',serif; }
.cl-gloss summary { color:#e4c995; cursor:pointer; min-height:36px; }
.cl-gloss p { margin:6px 0 0; color:#d5cbb7; }
.cl-note label,.cl-field-label { font:15px/1.7 'STKaiti','Kaiti SC',serif; color:#dac18c; display:block; margin-bottom:9px; }
.cl-note label small { font:10px/1.5 'Songti SC',serif; color:#ada187; margin-left:5px; }
.cl-note textarea,.cl-speech-input { width:100%; min-height:105px; resize:vertical; padding:14px; border:1px solid #b89c6555; border-radius:2px; background:#040a0799; color:#f0e3cb; font:15px/1.8 'STKaiti','Kaiti SC',serif; }
.cl-note textarea::placeholder { color:#928974; }
.cl-note-footer { display:flex; align-items:center; justify-content:space-between; gap:10px; margin:7px 0 20px; color:#ad9b78; font:10px/1.5 system-ui,sans-serif; }
.cl-paper-actions { display:grid; grid-template-columns:1fr 1fr; gap:9px; margin-top:24px; }
.cl-paper-actions .cl-outline-button { margin:0; }
.cl-paper-actions button { font-size:15px; padding-inline:8px; }
.cl-review-row { border-top:1px solid #aa915844; padding:18px 0; display:flex; flex-wrap:wrap; align-items:center; gap:10px; }
.cl-review-row h3 { font-size:17px; margin:0 0 8px; color:#e9d2a2; }
.cl-review-row > div { width:100%; }
.cl-review-row small { color:#bbac8e; font-size:12px; }
.cl-dispatch { top:auto; min-height:240px; max-height:70dvh; bottom:36px; }
.cl-poem-tabs { display:grid; grid-template-columns:1fr 1fr; gap:0; margin:16px 0 0; }
.cl-poem-tabs button { padding:11px; min-height:44px; border:1px solid #a78c5055; color:#c6b68e; background:#070e0a; cursor:pointer; font:16px 'STKaiti','Kaiti SC',serif; }
.cl-poem-tabs [aria-pressed=true] { color:#f0d699; background:#9a7d3a33; border-color:#ceb272; }
.cl-verdict-poem { border-top:1px solid #bd9b5055; padding:22px 0; }
.cl-verdict-poem small { color:#cfb782; letter-spacing:.2em; }
.cl-verdict-poem p { color:#eee0c7; font:18px/1.7 'STKaiti','Kaiti SC',serif; }
.cl-preview { border-top:1px solid #c5a46a66; margin-top:25px; padding-top:12px; }
.cl-preview h2 { font-size:20px; color:#e9cf9b; }
.cl-preview blockquote,.cl-saved-note { margin:14px 0 24px; white-space:pre-wrap; overflow-wrap:anywhere; font:17px/1.9 'STKaiti','Kaiti SC',serif; color:#eee1c7; }
.cl-preview .cl-small-button { margin-top:12px; }
.cl-seal { display:grid; place-items:center; width:105px; height:105px; margin:20px auto 28px; color:#d5b77b; border:1px solid #b59a62; border-radius:50%; font:54px 'STKaiti','Kaiti SC',serif; box-shadow:0 0 0 9px #b59a6209,0 0 0 10px #b59a6222; }
.cl-collection { text-align:center; top:24%; bottom:auto; max-height:68%; }
.cl-title-return { position:absolute; top:24px; left:24px; background:none; border:0; color:#ad9666; min-height:44px; cursor:pointer; font-size:12px; }
.cl-overlay { position:absolute; inset:0; z-index:20; display:flex; align-items:center; padding:24px 13px; background:#020604d9; backdrop-filter:blur(6px); }
.cl-sheet,.cl-sheet.chapter-cast-sheet { position:relative; inset:auto; width:100%; max-height:calc(100dvh - 48px); overflow:auto; overscroll-behavior:contain; padding:30px 21px; background:#111610fa; border:1px solid #af945a8c; box-shadow:0 10px 60px #0009; border-radius:3px; }
.cl-sheet h2 { font:28px 'STKaiti','Kaiti SC',serif; color:#ead0a1; padding-right:22px; }
.cl-sheet h3 { color:#d7bd83; font-size:17px; }
.cl-sheet > p { font:16px/1.9 'STKaiti','Kaiti SC',serif; color:#d9ceba; }
.cl-sheet > small { color:#c0aa7c; }
.cl-close { position:sticky; float:right; right:0; top:0; z-index:3; border:1px solid #a78e5466; background:#10150fed; color:#e4cf9d; width:38px; height:38px; cursor:pointer; font-size:25px; }
.cl-sheet .faction-versus { display:grid; grid-template-columns:1fr 20px 1fr; }
.cl-sheet .cast-portrait-image { top:46%; transform:translate(-50%,-23%); }
.cl-history-list details,.cl-scroll-poem { margin:15px 0; padding:12px 0; border-bottom:1px solid #b89d5744; }
.cl-history-list summary,.cl-scroll-poem summary { color:#dbc294; cursor:pointer; line-height:1.8; }
.cl-history-list p { font:16px/1.9 'STKaiti','Kaiti SC',serif; }
.cl-toast { position:absolute; z-index:30; top:75px; left:20px; right:20px; text-align:center; padding:12px; color:#eed7a3; background:#10160ff5; border:1px solid #bea061; font:13px/1.6 'Songti SC',serif; box-shadow:0 2px 10px #0006; }
.cl-toast-error { color:#ffd0b9; border-color:#d8926f; }
.cl-toast button { display:block; margin:8px auto 0; cursor:pointer; border:1px solid #c5aa6e; color:#e9d1a2; background:transparent; min-height:36px; }
.cl-settlement .outcome-content { padding-inline:30px; }
.cl-settlement .cl-seal { flex-shrink:0; margin-top:30px; }
.cl-final-speech { color:#f1e8d7; font:17px/1.9 'STKaiti','Kaiti SC',serif; margin:20px 0 12px; white-space:pre-wrap; overflow-wrap:anywhere; }
.cl-history-label,.cl-receipt { color:#c8af7b; font-size:11px; line-height:1.8; }
.cl-historical-note { text-align:left; width:100%; margin-top:22px; color:#ccc0a7; font:13px/1.8 'Songti SC',serif; }
.cl-historical-note summary { color:#d8bd87; cursor:pointer; }
.cl-historical-note a { color:#e4c98e; }
.cl-flying-papers { position:absolute; inset:0; overflow:hidden; pointer-events:none; z-index:12; }
.cl-flying-papers span { position:absolute; top:35%; left:calc(20% + var(--paper-index)*17%); display:grid; place-items:center; width:64px; height:96px; color:#5d4225; background:linear-gradient(125deg,#e1d2ac,#f7ebcd); box-shadow:3px 3px 8px #0005; font:14px 'STKaiti','Kaiti SC',serif; writing-mode:vertical-rl; animation:cl-paper-fall 2.2s cubic-bezier(.2,.2,.5,1) both; animation-delay:calc(var(--paper-index)*.12s); }
@keyframes cl-paper-fall { 0% { opacity:0; transform:translate(0,-60px) rotate(-15deg) scale(.6); } 15% {opacity:1;} 55% {transform:translate(30px,110px) rotate(40deg) rotateY(90deg);} 100% {opacity:0;transform:translate(-30px,65dvh) rotate(135deg) scale(.6);} }
.cl-live-offer { margin-top:14px; border-top:1px solid #b29a6555; padding-top:12px; }
.cl-live-offer p { font:13px/1.8 'STKaiti','Kaiti SC',serif; margin:0 0 8px; color:#dcc797; }
.cl-live-offer button { cursor:pointer; border:1px solid #b39a61; background:#8e753536; color:#ecd49e; min-height:44px; padding:9px 16px; font:15px 'STKaiti','Kaiti SC',serif; width:100%; }
.cl-story-entry { background:#1a211844; border:1px solid #ac925257; padding:20px; margin:20px 0; }
.cl-story-entry small { color:#bda673; font-size:11px; }
.cl-story-entry h3 { color:#e6cca0; font:23px 'STKaiti','Kaiti SC',serif; margin:12px 0; }
.cl-story-entry p { font:14px/1.8 'STKaiti','Kaiti SC',serif; color:#d1c4a8; }
@media(max-width:360px) {
 .cl-workbench { left:12px; right:48px; padding-inline:15px; }
 .cl-paper-workbench { padding-inline:10px; }
 .cl-rail { right:7px; }
 .cl-rail button { width:32px; }
 .cl-poem-line { font-size:14px; }
 .cl-note label small { display:block; margin:0; }
 .cl-dialogue { left:12px; right:45px; padding-inline:16px; }
 .cl-dialogue .text { font-size:17px; }
 .cl-poem h2 { font-size:20px; }
}
@media(max-height:620px) {
 .cl-workbench { top:82px; bottom:18px; }
 .cl-dialogue { max-height:56dvh; bottom:15px; }
 .cl-portrait { top:7%; width:95%; }
 .cl-rail { top:26%; }
 .cl-collection { top:16%; max-height:78%; }
}
@media(prefers-reduced-motion:reduce) { .cl-flying-papers {display:none} }

.cl-dialogue .text { display:block; -webkit-line-clamp:unset; -webkit-box-orient:initial; overflow:visible; max-height:none; white-space:pre-wrap; }
.cl-dialogue .continue-control { position:static; margin:12px 0 0 auto; display:block; padding:8px 10px; }
.cl-dialogue .speaker { background:transparent; padding-left:0; color:#dec18b; }
.cl-dialogue { margin:0; }