/* Generated by scripts/build-maanshan-css.cjs. Edit the source stylesheets. */
/* styles.css */
@font-face{font-family:'School Pinyin';src:url('vendor/fonts/school-pinyin-400.woff2?v=20260929-hk1') format('woff2');font-weight:400;font-style:normal;font-display:swap;unicode-range:U+41-5A,U+61-7A,U+C0-D6,U+D8-F6,U+F8-17F,U+1CD-1DC,U+1F8-1F9,U+251,U+261,U+300-30C,U+1E3E-1E3F}
@font-face{font-family:'School Pinyin';src:url('vendor/fonts/school-pinyin-700.woff2?v=20260929-hk1') format('woff2');font-weight:700;font-style:normal;font-display:swap;unicode-range:U+41-5A,U+61-7A,U+C0-D6,U+D8-F6,U+F8-17F,U+1CD-1DC,U+1F8-1F9,U+251,U+261,U+300-30C,U+1E3E-1E3F}
@font-face{font-family:'Noto Sans HK';src:url('vendor/fonts/noto-sans-hk-variants.woff2?v=20260929-hk1') format('woff2');font-weight:400 700;font-style:normal;font-display:swap;unicode-range:U+4F26,U+4FA7,U+5C06,U+5E26,U+5E90,U+5F52,U+62E8,U+6570,U+65F6,U+6A2A,U+6DA6,U+6EE1,U+72ED,U+79FD,U+7EA2,U+7EDD,U+7EFF,U+7F18,U+8BC6,U+8FD8,U+8FDC,U+8FDD,U+9065,U+9504,U+95FB,U+9879,U+9E45}
@font-face{font-family:'Noto Serif HK';src:url('vendor/fonts/noto-serif-hk-variants.woff2?v=20260929-hk1') format('woff2');font-weight:400 700;font-style:normal;font-display:swap;unicode-range:U+4F26,U+4FA7,U+5C06,U+5E26,U+5E90,U+5F52,U+62E8,U+6570,U+65F6,U+6A2A,U+6DA6,U+6EE1,U+72ED,U+79FD,U+7EA2,U+7EDD,U+7EFF,U+7F18,U+8BC6,U+8FD8,U+8FDC,U+8FDD,U+9065,U+9504,U+95FB,U+9879,U+9E45}
:root{color-scheme:light;--white:#fff;--bg:#fff;--ink:#183f3b;--muted:#5e746b;--line:#dce8df;--green:#147a62;--green-soft:#eaf6ed;--red:#b8493f;--red-soft:#fff0ea;--blue:#24758e;--blue-soft:#ecf6f9;--gold:#8d6514;--gold-soft:#fff6ce;--serif:'School Pinyin','Noto Serif HK','Songti TC','PMingLiU',serif;--sans:'School Pinyin','Noto Sans HK','Microsoft JhengHei',sans-serif}
*{box-sizing:border-box;letter-spacing:0}
html{scroll-padding:20px}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.65 var(--sans);-webkit-font-smoothing:antialiased}
button,input,select,textarea{font:inherit}
button,a{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
button{cursor:pointer;color:inherit}button:disabled{cursor:default;opacity:.45}
a{color:inherit;text-decoration:none}img{display:block;max-width:100%}
svg{width:22px;height:22px;flex-shrink:0;stroke-width:1.8}
h1,h2,h3,p{margin:0}h1,h2,h3{font-family:var(--serif);font-weight:600;line-height:1.5;overflow-wrap:break-word}
:focus-visible{outline:3px solid #4a9cbb;outline-offset:4px}
[hidden]{display:none!important}.screen-reader{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
.skip-link{position:fixed;top:-100px;left:16px;padding:10px;background:#fff;z-index:100}.skip-link:focus{top:8px}
.site-header{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:72px;padding:13px 40px;border-bottom:1px solid #edf2ee}
body:has(.lesson-shell) .site-header{display:none}
.brand{display:flex;align-items:center;gap:11px}.brand-mark{width:42px;height:42px;display:grid;place-items:center;color:#fff;background:var(--green);border-radius:6px}.brand-mark svg{width:25px;height:25px}.brand strong{display:block;font-size:17px;line-height:1.35;font-weight:700}.brand-sub{display:block;font-size:11px;color:var(--muted);margin-top:3px}
.header-right{display:flex;align-items:center;gap:22px}.school-name{font-size:13px;color:var(--muted)}.profile-button{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:8px 10px;border:0;background:transparent;color:var(--green);font-size:13px}
.eyebrow{font-size:12px;color:var(--green);font-weight:500;margin-bottom:6px}.muted,.small-label{color:var(--muted)}.small-label{font-size:13px}
.button{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:48px;padding:11px 19px;border:1px solid #cddfd3;border-radius:6px;background:#fff;color:var(--ink);font-size:15px;font-weight:600;line-height:1.5;transition:background .15s,border-color .15s,box-shadow .15s}
.button:hover:not(:disabled){background:var(--green-soft);border-color:#8fbda5}.button.primary{background:var(--green);border-color:var(--green);color:#fff;box-shadow:0 3px 0 #126851}.button.primary:hover:not(:disabled){background:#15725d}.button.secondary{background:var(--blue-soft);border-color:#c8e0e8;color:var(--blue)}.button.small{min-height:44px;padding:8px 12px;font-size:13px}.button svg{width:20px;height:20px}
.icon-button{display:inline-grid;place-items:center;width:44px;height:44px;border:0;border-radius:6px;background:transparent;color:var(--green);flex-shrink:0}.icon-button:hover,.icon-button[aria-pressed=true]{background:var(--green-soft)}.icon-button svg{width:22px;height:22px}
.text-button{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:44px;padding:7px 0;border:0;background:transparent;color:var(--green);font-size:14px;font-weight:500}
.loading-page{display:flex;align-items:center;justify-content:center;gap:12px;min-height:60svh;padding:25px;color:var(--muted);flex-wrap:wrap}.spinner{display:inline-block;width:20px;height:20px;border:2px solid #d4e7d9;border-top-color:var(--green);border-radius:50%;animation:spin .8s linear infinite;flex-shrink:0}

/* The catalogue is the task entrance; each book opens its recording page. */
.library{width:100%;max-width:1240px;margin:0 auto;padding:30px 36px 22px}
.library-heading{position:relative;display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:99px;margin-bottom:24px}
.library-heading h1{font-size:38px;line-height:1.35}.library-heading .eyebrow{font-size:12px}.library-sub{font-size:14px;color:var(--muted);margin-top:8px}
.library-heading-art{display:flex;align-items:center;justify-content:center;gap:16px;width:240px;height:106px;flex-shrink:0;position:relative}
.library-heading-art img{width:84px;height:84px;object-fit:contain;filter:drop-shadow(0 5px 4px #203e2510)}.library-heading-art img:nth-child(2){width:62px;height:62px;align-self:flex-start}.library-heading-art img:nth-child(3){width:54px;height:54px;align-self:flex-end}
.library-books{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px 24px}
.poem-card{--book-color:var(--green);--book-soft:var(--green-soft);min-width:0;position:relative;border-radius:7px}
.poem-card:nth-child(3n+2){--book-color:var(--blue);--book-soft:var(--blue-soft)}.poem-card:nth-child(3n){--book-color:var(--red);--book-soft:var(--red-soft)}.poem-card:nth-child(4){--book-color:var(--gold);--book-soft:var(--gold-soft)}
.poem-entry{display:flex;flex-direction:column;height:100%;position:relative;border:1px solid #dce6dc;border-left:6px solid var(--book-color);border-radius:7px;background:#fff;overflow:hidden;box-shadow:2px 4px 0 #e8efe8;transition:box-shadow .18s,border-color .18s}
.poem-entry:hover{border-top-color:var(--book-color);border-right-color:var(--book-color);border-bottom-color:var(--book-color);box-shadow:3px 6px 0 var(--book-soft)}
.poem-art{position:relative;width:100%;aspect-ratio:16/9;background:#f7f9f5;overflow:hidden}
.poem-art>img{width:100%;height:100%;object-fit:contain}
.poem-grade{position:absolute;top:13px;left:12px;display:inline-flex;align-items:center;min-height:26px;padding:3px 8px;border-radius:3px;background:#ffffffec;color:var(--book-color);font-size:12px;font-weight:600}
.poem-card-body{padding:16px 18px 0;flex:1;display:flex;flex-direction:column;min-width:0}
.poem-card-title{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:45px}
.poem-card-title h2{font-size:27px;line-height:1.4;flex:1;min-width:0}.poem-poet{width:45px;height:45px;object-fit:cover;object-position:50% 20%;border-radius:50%;border:2px solid var(--book-soft);flex-shrink:0}
.poem-author{font-size:13px;color:var(--muted);margin:5px 0 15px}
.poem-card-title h2 small{display:inline-block;font:400 12px/1.5 var(--sans);color:var(--muted);margin-left:7px;vertical-align:middle}
.poem-open{display:flex;align-items:center;gap:8px;min-height:49px;color:var(--book-color);font-size:14px;font-weight:600;border-top:1px solid var(--line);margin-top:auto}
.poem-open>svg{width:19px;height:19px}.poem-open>svg:last-child{margin-left:auto;width:18px;height:18px}
.library-tail{position:relative;display:flex;align-items:center;justify-content:center;gap:14px;min-height:64px;margin-top:26px}.library-tail img{width:47px;height:47px;object-fit:contain}.library-tail img:nth-child(2){width:35px;height:35px}
.library-footer{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:12px;font-size:11px;color:var(--muted)}.library-footer a{display:flex;align-items:center;gap:6px;min-height:44px}.library-footer svg{width:16px;height:16px}

.workspace{width:100%;max-width:1320px;margin:0 auto;padding:0 38px 36px;min-height:100svh}
.lesson-bar{display:flex;align-items:center;gap:20px;min-height:99px;padding:18px 0 14px;margin-bottom:20px;position:relative;z-index:15}
.back-library{min-height:44px;min-width:70px;display:flex;align-items:center;gap:8px;color:var(--muted);font-size:13px}.back-library svg{width:21px;height:21px}
.lesson-title{flex:1;min-width:0}.lesson-title h1{font-size:29px;line-height:1.35}.lesson-title p{font-size:13px;color:var(--muted);margin-top:5px}
.lesson-menu{position:relative;flex-shrink:0}.lesson-menu>summary{list-style:none;width:48px;height:48px;display:grid;place-items:center;border:1px solid #d9e7dc;border-radius:7px;background:#f5f9f5;color:var(--green);cursor:pointer}.lesson-menu>summary::-webkit-details-marker{display:none}.lesson-menu[open]>summary{background:var(--green-soft);border-color:#9dc2aa}
.menu-panel{position:absolute;top:calc(100% + 9px);right:0;width:218px;padding:7px;background:#fff;border:1px solid var(--line);border-radius:7px;box-shadow:0 10px 35px #173b3120;z-index:40;display:flex;flex-direction:column;gap:3px}
.menu-panel>a,.menu-panel>button{display:flex;align-items:center;gap:10px;min-height:46px;padding:10px 12px;border:0;border-radius:4px;background:transparent;text-align:left;font-size:14px;color:var(--ink)}.menu-panel>a:hover,.menu-panel>button:hover{background:var(--green-soft)}.menu-panel .active{background:var(--green-soft);color:var(--green)}.menu-panel svg{width:20px;height:20px;color:var(--green)}
.lesson-menu>summary{display:flex;flex-direction:column;gap:0;font-size:10px;line-height:1.4;justify-content:center;align-items:center}.lesson-menu>summary svg{width:23px;height:23px}.menu-panel a[aria-current=page]{background:var(--green-soft);color:var(--green)}
.reader-toolbar{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:19px}.reader-toolbar h2{font-family:var(--sans);font-size:20px;font-weight:500}
.study-main,.view-section{width:100%;min-width:0}.study-main{margin:0 auto}.view-heading{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:19px}.view-heading h2{font-family:var(--sans);font-size:20px;font-weight:500}.view-heading p{font-size:13px;color:var(--muted)}
.art-stage,.record-art{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;background:#fafcf9}
.art-stage>img,.record-art>img{width:100%;height:100%;object-fit:contain}.art-stage .scene-stage,.record-art .scene-stage{height:100%;aspect-ratio:auto!important}.art-stage .scene-stage img,.record-art .scene-stage img{object-fit:contain!important}.scene-stage-status button{min-height:44px!important}
.verse{display:flex;align-items:flex-end;justify-content:center;gap:0;min-height:69px;white-space:nowrap}
.verse ruby{display:inline-flex;flex-direction:column-reverse;align-items:center;font-family:var(--serif);font-size:31px;font-weight:600;line-height:1.7;min-width:43px}
.verse rt{font-family:var(--sans);font-size:13px;line-height:1.7;color:var(--muted);font-weight:400}.verse .punct{font-family:var(--serif);font-size:31px;line-height:1.7;width:19px}.hide-pinyin rt{visibility:hidden}.verse.active,.verse.active rt{color:var(--ink)}
.record-layout{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(340px,.85fr);gap:48px;align-items:center;min-height:calc(100svh - 180px);padding:4px 0 25px}
.record-landscape,.record-practice{min-width:0}.record-art{border-radius:3px}
.record-practice{position:relative}.practice-decoration{position:absolute;width:68px;height:68px;object-fit:contain;top:-58px;right:8px;pointer-events:none;transform:rotate(-8deg)}
.verse-list{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(44px,1fr);gap:5px;max-width:100%;overflow-x:auto;scrollbar-width:thin;margin-top:14px;padding:0 2px 5px}
.verse-list-item{position:relative;display:flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;border:0;background:transparent;color:var(--muted);padding:4px;font:500 14px var(--sans);border-radius:5px}
.verse-list-item:after{content:'';position:absolute;bottom:1px;left:25%;right:25%;height:2px;background:#e2ebe4}.verse-list-item.current{background:var(--green-soft);color:var(--green)}.verse-list-item.current:after{background:var(--green)}.verse-list-item.done{color:var(--green)}.verse-list-item svg{width:17px;height:17px}.verse-list-item .line-text,.verse-list-item .line-score{display:none}
.record-tool{text-align:center;padding:8px 0;max-width:450px;margin:0 auto}.record-counter{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;font-size:13px;color:var(--muted)}.record-counter>span{color:var(--green);font-weight:500}
.record-tool>.verse{margin:15px 0 18px}
.record-model{display:flex;align-items:center;justify-content:center;gap:10px;margin:0 0 27px}
.record-model .button,.record-model>button{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:5px;background:#f0f7f1;color:var(--green);min-height:44px;padding:9px 13px;font-size:13px;font-weight:500;line-height:1.5}.record-model>[data-action=video]{background:var(--blue-soft);color:var(--blue)}.record-model svg{width:20px;height:20px}
#record-controls{min-height:137px}.record-actions{display:flex;justify-content:center;align-items:center;gap:10px;min-height:109px;flex-wrap:wrap}
.mic-button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;min-width:142px;min-height:118px;border:0;background:transparent;color:var(--red);padding:6px 14px;font-size:17px;font-weight:600;line-height:1.5}
.mic-button svg{width:78px;height:78px;padding:23px;border-radius:50%;background:#d35c51;color:#fff;box-shadow:0 5px 0 #b84741,0 0 0 7px var(--red-soft)}.mic-button:hover svg{background:#c54f45}.mic-button.recording svg{background:#b94640;box-shadow:0 0 0 8px #fadfd8}
.record-status{min-height:23px;margin-top:12px;font-size:13px;color:var(--muted)}.record-status:empty{display:none}.record-status .spinner{vertical-align:middle;margin-right:8px}
.record-wave{display:flex;justify-content:center;align-items:center;gap:5px;height:22px;margin:5px 0 10px}.record-wave span{width:4px;height:6px;background:#d2e7d7;border-radius:2px}.record-wave.live span{background:var(--red);animation:wave .65s ease-in-out infinite alternate}.record-wave.live span:nth-child(2n){animation-delay:.3s}.record-wave.live span:nth-child(3n){animation-delay:.15s}.record-wave.live span:nth-child(5n){animation-delay:.45s}
.record-result{font-size:38px;line-height:1.2;font-weight:600;color:var(--green)}.record-result small{font-size:14px;font-weight:400;margin-left:4px;color:var(--muted)}
.record-review{display:flex;align-items:center;justify-content:center;gap:7px;flex-wrap:wrap;margin:12px 0 6px;padding-top:10px}.record-review>span{font-size:12px;color:var(--muted)}.record-review button{display:flex;align-items:center;gap:5px;min-width:44px;min-height:49px;padding:5px 8px;background:#f2f8f3;border:0;border-radius:4px}.record-review ruby{font-family:var(--serif);font-size:23px}.record-review rt{font-family:var(--sans);font-size:11px}.record-review svg{width:16px;height:16px;color:var(--green)}
.record-sticker,.lesson-sticker{width:65px;height:65px;object-fit:contain;pointer-events:none}

.reading-experience{min-width:0}.reading-scene{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(325px,.85fr);align-items:center;gap:42px}.poem-landscape,.poem-text{min-width:0}.poem-lines{display:flex;flex-direction:column;gap:17px;padding:4px 0}.verse-line{display:block;width:100%;min-height:69px;padding:0;border:0;border-radius:4px;background:transparent}.verse-line:hover,.verse-line[aria-pressed=true]{background:#f0f7f1}.poem-lines.long{gap:3px}.poem-lines.long .verse,.poem-lines.long .verse-line{min-height:52px}.poem-lines.long .verse ruby,.poem-lines.long .punct{font-size:26px}
.scene-dots{display:flex;align-items:center;justify-content:center;margin-top:3px}.scene-dots button{display:grid;place-items:center;width:44px;height:44px;background:transparent;border:0;padding:0}.scene-dots button:after{content:'';width:7px;height:7px;border-radius:50%;background:#d3e5d7}.scene-dots button[aria-pressed=true]:after{width:9px;height:9px;background:var(--green)}
.reader-controls{display:flex;align-items:center;justify-content:center;gap:15px;margin-top:23px;padding:13px 0}.media-buttons{display:flex;align-items:center;gap:10px}.media-buttons .button{background:#f1f8f3;color:var(--green);border-color:#cfe2d6}.media-buttons>[data-action=video]{background:var(--blue-soft);color:var(--blue);border-color:#cadfe7}
.audio-options{max-width:500px;margin:3px auto 0;font-size:12px;color:var(--muted)}.audio-options summary{cursor:pointer;min-height:44px;line-height:44px;text-align:center}.audio-options summary svg{width:16px;height:16px;vertical-align:middle;margin-right:7px}.audio-timeline{display:flex;align-items:center;gap:10px;min-height:44px;font-size:12px;font-variant-numeric:tabular-nums}.audio-timeline input{height:44px;min-width:0;flex:1;accent-color:var(--green);margin:0}.audio-timeline select{min-height:44px;border:0;background:transparent;color:var(--ink);font-size:13px}

.view-report .study-main{max-width:850px}.report-summary{display:grid;grid-template-columns:112px minmax(0,1fr);align-items:center;gap:28px;margin:12px 0 30px;padding-bottom:26px;border-bottom:1px solid var(--line)}
.score-ring{width:108px;height:108px;border:3px solid var(--green);outline:1px solid #a9cdb5;outline-offset:4px;border-radius:50%;display:grid;place-items:center;text-align:center;color:var(--green)}.score-ring strong{font-size:36px;line-height:1.15;font-weight:600}.score-ring span{display:block;font-size:12px;color:var(--muted);margin-top:4px}
.dimension-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.dimension strong{display:block;font-size:29px;color:var(--blue);font-weight:600;line-height:1.3}.dimension:nth-child(2) strong{color:var(--red)}.dimension:nth-child(3) strong{color:var(--gold)}.dimension span{display:block;font-size:12px;color:var(--muted);margin-top:5px}.saved-note{font-size:12px;color:var(--muted);margin-top:10px}
.section-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:13px}.section-heading h2{font-family:var(--sans);font-size:20px;font-weight:600}.section-heading h2>svg{width:23px;height:23px;margin-right:7px;vertical-align:middle;color:var(--blue)}.section-count{font-size:13px;color:var(--muted)}
.practice-section{margin:25px 0}.practice-intro{font-size:14px;color:var(--muted);line-height:1.9}.practice-selector{display:flex;flex-wrap:wrap;gap:8px;margin:15px 0 22px}.word-result{width:61px;min-height:87px;padding:8px 5px;background:#f0f7f2;border:1px solid transparent;border-bottom:2px solid var(--green);border-radius:4px 4px 0 0;text-align:center;color:var(--ink)}.word-result ruby{font:25px/1.5 var(--serif)}.word-result rt{font:11px/1.5 var(--sans);color:var(--muted)}.word-result strong{display:block;margin-top:4px;font-size:12px;font-weight:500}.word-result>svg{width:14px;height:14px;color:var(--green);margin-top:4px}.word-result.warn,.word-result.fair{background:#fffae2;border-bottom-color:#c4a03b}.word-result.error,.word-result.poor{background:var(--red-soft);border-bottom-color:var(--red)}
.practice-pick{display:grid;grid-template-columns:1fr 15px;align-items:center;justify-items:center;gap:4px 0;min-width:58px;padding:8px 6px}.practice-pick ruby{grid-column:1/-1}.practice-pick small{font-size:11px;color:var(--muted);line-height:1.5;white-space:nowrap}.practice-pick>svg{width:13px;height:13px;margin:0}.practice-pick[aria-pressed=true]{border-color:var(--green);background:#e4f3e8;box-shadow:0 2px 0 var(--green)}
.practice-card{padding:18px 0 21px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);min-width:0}.practice-card-heading{display:flex;align-items:center;justify-content:space-between;gap:13px;margin-bottom:12px}.practice-card-heading h3{font-size:21px}.practice-tip{font-size:14px;line-height:1.85;color:var(--muted)}.contrast-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:13px;font-size:13px;color:var(--muted)}.contrast-heading .text-button{font-size:13px}.contrast-pair{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:9px 0 16px}
.sound-word{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-width:0;min-height:118px;padding:9px 7px;background:var(--blue-soft);border:0;border-bottom:2px solid #a1cbd9;border-radius:4px 4px 0 0}.sound-word ruby{font:29px/1.5 var(--serif);color:var(--blue)}.sound-word rt{font:13px/1.5 var(--sans)}.sound-context{font-size:12px;color:var(--ink)}.sound-kind{font-size:11px;color:var(--muted)}.sound-word svg{width:17px;height:17px;margin-top:3px;color:var(--blue)}
[data-audio-state=playing]{outline:2px solid var(--blue);outline-offset:1px}[data-audio-state=loading]{outline:2px dashed #b38a29;outline-offset:1px}
.practice-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:13px}.practice-actions .button{font-size:13px;min-height:44px;padding:8px 11px}.practice-actions svg{width:18px;height:18px}.assessment-note{font-size:12px;line-height:1.8;color:var(--muted);margin-top:12px}
.ai-report-header{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:14px 0;flex-wrap:wrap}.ai-report-header h2{font-size:22px}.report-disclosure{padding:0;border-bottom:1px solid var(--line)}.report-disclosure>summary{cursor:pointer;min-height:58px;padding:15px 0;font-size:15px;color:var(--ink)}.report-disclosure summary>svg{width:18px;height:18px;vertical-align:middle}.report-disclosure[open]{padding-bottom:18px}.report-prose{font-size:14px;line-height:1.95;white-space:pre-wrap;color:#496861}
.word-grid{display:flex;flex-wrap:wrap;gap:8px}.report-line{padding:15px 0;border-bottom:1px solid var(--line)}.report-line-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px;flex-wrap:wrap}.report-line-heading h3{font-size:17px}.report-line-heading>span{font:16px var(--serif)}.report-empty{text-align:center;padding:70px 20px;color:var(--muted)}.report-empty>img{width:100px;height:100px;object-fit:contain;margin:0 auto 17px}.report-empty>svg{width:48px;height:48px;margin-bottom:18px}.report-empty h2{font-size:26px;margin-bottom:22px;color:var(--ink)}
.study-next{display:flex;align-items:center;justify-content:flex-end;gap:12px;flex-wrap:wrap;margin:23px 0 6px}.study-next p{margin-right:auto;font-size:13px;color:var(--muted)}

.writing-layout,.quiz-layout{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);align-items:start;gap:60px;padding-top:9px}.writing-context .art-stage,.quiz-art .art-stage{margin-bottom:23px}.writing-context h2,.panel-title{font-size:24px;margin-bottom:10px}.writing-context p,.quiz-art p{font-size:15px;line-height:1.9;color:var(--muted)}
.writing-tool{width:100%;max-width:390px;margin:0 auto}.writing-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px}.writing-pinyin{font-size:27px;color:var(--blue);font-weight:500}.writing-counter{font-size:13px;color:var(--muted);margin-top:2px}.writing-board{position:relative;width:100%;aspect-ratio:1;border:2px solid #bad5bf;border-radius:5px;background:#fff;overflow:hidden;box-shadow:4px 5px 0 #edf4eb}.writing-board:before,.writing-board:after{content:'';position:absolute;pointer-events:none}.writing-board:before{top:0;left:50%;height:100%;border-left:1px dashed #d0e0cd}.writing-board:after{top:50%;left:0;width:100%;border-top:1px dashed #d0e0cd}.writing-board canvas{position:absolute;inset:0;width:100%;height:100%;z-index:2;touch-action:none}.writing-hint{position:absolute;inset:0;display:grid;place-items:center;font:180px/1 var(--serif);color:#dce9da;pointer-events:none}.stroke-hint{position:absolute;inset:0;z-index:3;background:#fff;display:grid;place-items:center;pointer-events:none}.stroke-hint svg{width:100%;height:100%}.writing-controls{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:18px}.writing-tools{display:flex;gap:5px}.writing-tools .icon-button{background:#f0f7ef}.writing-feedback{min-height:24px;margin-top:12px;font-size:13px;color:var(--muted)}.practice-results{display:flex;gap:8px;flex-wrap:wrap;margin-top:20px}.result-chip{padding:5px 9px;font:20px var(--serif);color:var(--green);background:var(--green-soft);border-bottom:2px solid var(--green)}.result-chip.wrong{color:var(--red);background:var(--red-soft);border-color:var(--red)}
.quiz-top{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:13px;color:var(--muted);margin-bottom:12px}.quiz-progress{height:5px;background:var(--gold-soft);margin-bottom:23px;border-radius:3px;overflow:hidden}.quiz-progress i{display:block;height:100%;background:#ddb94a;transition:width .2s}.quiz-prompt{font-family:var(--sans);font-size:23px;font-weight:500;line-height:1.7;margin-bottom:23px}.quiz-options{display:grid;gap:12px}.quiz-option{display:flex;align-items:center;gap:14px;min-height:71px;padding:15px 17px;text-align:left;font-size:20px;line-height:1.6;border:1px solid #d6e4d7;border-radius:6px;background:#fff;word-break:break-word}.quiz-option>span{width:30px;height:30px;display:grid;place-items:center;flex-shrink:0;border:1px solid #d6e2d5;border-radius:50%;font:500 14px var(--sans);color:var(--muted)}.quiz-option:hover:not(:disabled){border-color:#99bfab;background:#f4faf3}.quiz-option.correct{background:var(--green-soft);border-color:var(--green);color:var(--green);opacity:1}.quiz-option.incorrect{background:var(--red-soft);border-color:var(--red);color:var(--red);opacity:1}.quiz-explanation{min-height:73px;padding:18px 0;color:var(--muted);font-size:14px;line-height:1.9}.quiz-next{display:flex;justify-content:flex-end}.completion{padding:55px 15px;text-align:center}.completion>svg{width:62px;height:62px;color:var(--gold);margin-bottom:20px}.completion h2{font-size:28px;margin-bottom:13px}.completion p{font-size:15px;color:var(--muted);margin-bottom:24px}.completion-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}

.chat-layout{display:grid;grid-template-columns:230px minmax(0,1fr);gap:44px;max-width:1000px;margin:0 auto;padding-top:10px}.poet-profile img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 20%;border-radius:4px}.poet-profile h2{font-size:26px;margin:17px 0 8px}.poet-profile p{font-size:14px;line-height:1.9;color:var(--muted)}.chat-tool{display:flex;flex-direction:column;min-width:0;min-height:500px}.chat-messages{display:flex;flex-direction:column;gap:20px;min-height:260px;max-height:440px;overflow-y:auto;overscroll-behavior:contain;padding:0 10px 18px 0}.chat-message{display:flex;align-items:start;gap:10px}.chat-message>img{width:42px;height:42px;object-fit:cover;object-position:50% 20%;border-radius:50%;flex-shrink:0}.chat-message.user{justify-content:flex-end}.chat-bubble{min-width:0;max-width:90%;padding:13px 16px;background:#f0f7ef;border-radius:6px;font-size:16px;line-height:1.85;white-space:pre-wrap;overflow-wrap:anywhere}.chat-message.user .chat-bubble{background:var(--blue-soft);color:#2d6171}.chat-bubble .icon-button{display:flex;align-items:center;justify-content:center;margin-top:8px}.chat-suggestions{display:flex;gap:4px 15px;flex-wrap:wrap;padding:12px 0}.chat-suggestions button{min-height:44px;padding:7px 0;border:0;background:transparent;text-align:left;font-size:14px;color:var(--green);text-decoration:underline;text-decoration-color:#b5d1bb;text-underline-offset:5px}.chat-form{display:flex;align-items:flex-end;gap:10px;padding:9px;border:1px solid #accdb3;border-radius:6px;background:#fff}.chat-form:focus-within{outline:1px solid var(--green);border-color:var(--green)}.chat-form textarea{resize:none;border:0;outline:0;min-width:0;flex:1;padding:5px;max-height:120px;color:var(--ink);background:#fff;font-size:16px}.chat-form button{background:var(--green);color:#fff}.chat-error{font-size:13px;color:var(--red);padding:8px 0}

dialog{padding:24px;border:1px solid var(--line);border-radius:7px;background:#fff;color:var(--ink);max-width:calc(100vw - 24px);box-shadow:0 15px 65px #153c343b}dialog::backdrop{background:#173f36b8}.dialog-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:20px}.dialog-heading h2{font-family:var(--sans);font-size:22px;font-weight:600}.video-dialog{padding:16px;max-height:94svh;overflow:auto}.video-dialog .dialog-heading{margin-bottom:12px}.video-dialog video{display:block;max-height:75svh;max-width:100%;width:auto;height:auto;margin:0 auto;background:#111}.profile-dialog{width:440px}.profile-dialog label{display:flex;flex-direction:column;gap:8px;font-size:15px;margin-bottom:18px}.profile-dialog input,.profile-dialog select{width:100%;min-height:48px;padding:10px;border:1px solid #bfd7c5;border-radius:4px;color:var(--ink);background:#fff;font-size:16px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}.dialog-actions{display:flex;justify-content:flex-end}.error-text{font-size:14px;color:var(--red);line-height:1.8}.toast{position:fixed;left:50%;bottom:25px;transform:translate(-50%,10px);max-width:calc(100vw - 28px);padding:12px 18px;border-radius:6px;background:#285640;color:#fff;font-size:13px;text-align:center;opacity:0;pointer-events:none;z-index:100;transition:opacity .16s,transform .16s}.toast.visible{opacity:1;transform:translate(-50%,0)}
@keyframes spin{to{transform:rotate(360deg)}}@keyframes wave{from{height:5px}to{height:23px}}

@media(min-width:1600px){.library{max-width:1320px}.workspace{max-width:1460px}.record-layout{gap:65px}.record-tool>.verse ruby{font-size:34px;min-width:46px}}
@media(max-width:1100px){.site-header{padding-inline:25px}.library{padding-inline:26px}.workspace{padding-inline:28px}.library-books{gap:24px 20px}.poem-card-title h2{font-size:24px}.poem-card-body{padding:14px 15px 0}.record-layout{gap:28px;grid-template-columns:minmax(0,1.15fr) minmax(310px,.85fr)}.verse ruby{font-size:28px;min-width:38px}.verse .punct{font-size:28px;width:16px}.reading-scene{gap:25px;grid-template-columns:minmax(0,1.1fr) minmax(290px,.9fr)}.writing-layout,.quiz-layout{gap:36px}.chat-layout{grid-template-columns:195px minmax(0,1fr);gap:30px}}
@media(max-width:820px){.school-name{display:none}.library-heading-art{width:190px;gap:8px}.library-heading-art img{width:70px;height:70px}.library-books{gap:22px 16px}.poem-card-title h2{font-size:23px}.poem-poet{width:39px;height:39px}.record-layout{grid-template-columns:1fr;gap:12px;max-width:650px;margin:0 auto;min-height:0}.record-art{max-height:290px}.record-tool{width:100%;max-width:450px}.record-tool>.verse ruby{font-size:31px;min-width:43px}.reading-scene{grid-template-columns:1fr;gap:19px}.reading-scene .art-stage{max-height:290px}.poem-lines{gap:11px}.writing-layout,.quiz-layout{grid-template-columns:1fr}.writing-context,.quiz-art{display:none}.chat-layout{grid-template-columns:1fr}.poet-profile{display:none}.chat-tool{min-height:0}}
@media(max-width:760px){
 .site-header{min-height:60px;padding:8px 16px;gap:12px}.brand{gap:8px}.brand-mark{width:34px;height:34px}.brand-mark svg{width:23px;height:23px}.brand strong{font-size:14px}.brand-sub{font-size:10px;margin-top:1px}.profile-button{width:44px;padding:8px}.profile-button>span{display:none}.header-right{gap:0}
 .library{padding:21px 16px 19px}.library-heading{min-height:83px;margin-bottom:19px;gap:12px}.library-heading h1{font-size:31px}.library-heading .eyebrow{font-size:10px;max-width:190px}.library-sub{font-size:12px;margin-top:6px}.library-heading-art{width:115px;height:85px;gap:3px}.library-heading-art img{width:65px;height:65px}.library-heading-art img:nth-child(2){width:40px;height:40px}.library-heading-art img:nth-child(3){display:none}
 .library-books{grid-template-columns:repeat(2,minmax(0,1fr));gap:19px 13px}.poem-entry{border-left-width:4px;box-shadow:2px 3px 0 #e8efe8}.poem-grade{top:8px;left:8px;min-height:22px;padding:2px 6px;font-size:10px}.poem-card-body{padding:11px 10px 0}.poem-card-title{gap:6px;min-height:39px;align-items:center}.poem-card-title h2{font-size:22px;line-height:1.4}.poem-poet{width:31px;height:31px;border-width:1px}.poem-author{font-size:11px;margin:4px 0 11px;line-height:1.5}.poem-open{min-height:44px;font-size:12px;gap:5px}.poem-open>svg{width:16px;height:16px}.poem-open>svg:last-child{width:15px;height:15px}.library-tail{margin-top:20px;min-height:51px}.library-tail img{width:40px;height:40px}.library-tail img:nth-child(2){width:31px;height:31px}.library-footer{font-size:10px;margin-top:7px}
 .workspace{padding:0 16px 24px;min-height:100svh}.lesson-bar{min-height:78px;margin-bottom:15px;padding:12px 0;gap:11px}.back-library{width:44px;min-width:44px;min-height:44px;display:flex;flex-direction:column;justify-content:center;gap:1px;font-size:10px}.back-library svg{width:20px;height:20px}.lesson-title h1{font-size:25px;line-height:1.3}.lesson-title p{font-size:11px;margin-top:3px}.lesson-menu>summary{width:44px;height:44px}.menu-panel{width:212px}.view-heading{margin-bottom:14px}.view-heading h2{font-size:18px}.view-heading p{font-size:12px}
 .record-layout{display:flex;flex-direction:column;gap:7px;padding:0;align-items:stretch}.record-art{max-height:245px;border-radius:2px}.verse-list{margin-top:8px;gap:2px;padding-bottom:0}.verse-list-item{font-size:13px;min-height:44px}.verse-list:has(.verse-list-item:nth-child(8)){margin-inline:-16px;width:calc(100% + 32px);max-width:none;gap:0;padding-inline:4px}.record-tool{padding:2px 0 0;max-width:100%;width:100%}.record-counter{min-height:44px;font-size:12px}.record-tool>.verse{margin:8px 0 15px;min-height:70px}.record-tool>.verse ruby{font-size:31px;min-width:41px}.record-tool>.verse .punct{font-size:31px;width:18px}.verse rt{font-size:13px}.record-model{gap:10px;margin-bottom:22px}.record-model .button,.record-model>button{min-height:44px;font-size:13px;padding:9px 14px}.record-model svg{width:20px;height:20px}.record-actions{min-height:114px;gap:9px}.mic-button{min-height:115px;font-size:16px;gap:13px;padding:5px 14px}.mic-button svg{width:74px;height:74px;padding:22px;box-shadow:0 4px 0 #b84741,0 0 0 6px var(--red-soft)}#record-controls{min-height:128px}.record-status{font-size:12px;margin-top:10px}.record-result{font-size:35px}.record-actions .button{min-height:44px;padding:8px 11px;font-size:13px;gap:6px}.record-review{margin:10px 0 3px}.record-review button{min-height:47px}.record-sticker,.lesson-sticker{width:51px;height:51px}
 .reading-experience{display:grid;grid-template-columns:1fr}.reading-scene{display:contents}.poem-landscape{grid-row:1}.reading-scene .art-stage{max-height:none}.reader-controls{grid-row:2;display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:0 0 20px;padding:5px 0}.reader-controls>.media-buttons{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:9px}.reader-controls>.read-start{grid-column:1/-1}.reader-controls .button{font-size:14px;min-height:47px;padding:10px 12px}.poem-text{grid-row:3}.audio-options{grid-row:4;width:100%;margin-top:12px}.scene-dots{margin-top:0}.poem-lines{gap:11px;padding:0}.verse,.verse-line{min-height:63px}.verse ruby{min-width:39px;font-size:29px}.verse .punct{font-size:29px;width:17px}.poem-lines.long{gap:5px}.poem-lines.long .verse,.poem-lines.long .verse-line{min-height:49px}.poem-lines.long .verse ruby,.poem-lines.long .punct{font-size:26px}
 .report-summary{grid-template-columns:86px minmax(0,1fr);gap:18px;margin:7px 0 24px;padding-bottom:24px}.score-ring{width:81px;height:81px;border-width:2px;outline-offset:3px}.score-ring strong{font-size:29px}.score-ring span{font-size:10px}.report-summary .eyebrow{font-size:10px;margin-bottom:7px}.dimension-grid{gap:9px}.dimension strong{font-size:24px}.dimension span{font-size:10px;line-height:1.5;margin-top:4px}.section-heading h2{font-size:18px}.section-count{font-size:11px}.practice-section{margin:22px 0}.practice-selector{gap:7px;margin:13px 0 20px}.word-result{width:57px;min-height:85px}.practice-pick{min-width:55px}.word-result ruby{font-size:25px}.practice-card{padding:15px 0 18px}.practice-card-heading h3{font-size:18px}.practice-tip{font-size:13px}.contrast-heading,.contrast-heading .text-button{font-size:12px}.contrast-pair{gap:7px;margin-top:8px}.sound-word{min-height:109px;padding:8px 4px}.sound-word ruby{font-size:28px}.sound-word rt{font-size:12px}.sound-context{font-size:12px}.sound-kind{font-size:10px}.practice-actions{gap:7px}.practice-actions .button{padding:8px 9px;font-size:12px}.practice-actions svg{width:17px;height:17px}.ai-report-header h2{font-size:21px}.ai-report-header .button{font-size:14px}.report-disclosure>summary{min-height:54px;padding:14px 0}.word-grid{gap:6px}.word-analysis .word-result{width:calc((100% - 24px)/5);min-height:79px}.word-analysis .word-result ruby{font-size:23px}.report-line-heading{gap:7px}.report-line-heading>span{font-size:14px}.report-line-heading h3{font-size:16px}.study-next{gap:10px;justify-content:center}.study-next .button{font-size:14px;flex:1;padding-inline:12px}.report-empty{padding:45px 12px}.report-empty h2{font-size:24px}
 .writing-layout,.quiz-layout{padding-top:0}.writing-tool{max-width:370px}.writing-pinyin{font-size:27px}.writing-controls{gap:8px;flex-wrap:wrap;margin-top:17px}.writing-controls>.button{font-size:14px;min-height:44px;padding:9px 12px}.writing-tools{gap:5px}.writing-feedback{font-size:13px}.quiz-prompt{font-size:22px;margin-bottom:21px}.quiz-option{font-size:19px;min-height:65px;padding:13px;gap:12px}.completion{padding:36px 10px}.completion h2{font-size:25px}
 .chat-layout{padding-top:0}.chat-messages{max-height:49svh;min-height:220px;padding-right:0;gap:16px}.chat-message{gap:8px}.chat-message>img{width:36px;height:36px}.chat-bubble{max-width:calc(100% - 42px);font-size:15px;padding:11px 12px}.chat-suggestions{gap:3px 12px;padding:10px 0}.chat-suggestions button{font-size:13px}.chat-form{padding:8px}.chat-error{font-size:12px}.keyboard-open .lesson-bar{display:none}.keyboard-open .chat-suggestions{display:none}.keyboard-open .chat-messages{min-height:100px;max-height:calc(var(--visual-height,100svh) - 140px)}
 .video-dialog{padding:12px}.video-dialog video{max-height:73svh}.video-dialog .dialog-heading h2{font-size:19px}.dialog-heading{gap:12px}.dialog-heading h2{font-size:21px}.toast{bottom:20px;max-width:calc(100vw - 26px);width:max-content;font-size:13px}
}
@media(max-width:380px){
 .site-header{padding-inline:13px}.library,.workspace{padding-inline:13px}.library-heading h1{font-size:29px}.library-heading-art{width:100px}.library-heading-art img{width:59px;height:59px}.library-heading-art img:nth-child(2){width:36px;height:36px}.library-books{gap:17px 11px}.poem-card-body{padding-inline:9px}.poem-card-title h2{font-size:20px}.poem-poet{width:27px;height:27px}.poem-author{font-size:10px}.poem-open{font-size:11px;gap:4px}.poem-open>svg{width:15px;height:15px}.lesson-title h1{font-size:23px}.lesson-bar{gap:9px}.record-tool>.verse ruby{font-size:29px;min-width:37px}.record-tool>.verse .punct{font-size:29px;width:16px}.verse-list:has(.verse-list-item:nth-child(8)){margin-inline:-13px;width:calc(100% + 26px);padding-inline:4px}.verse ruby{min-width:36px;font-size:27px}.verse .punct{font-size:27px;width:15px}.record-model{margin-bottom:21px}.writing-tools{gap:4px}.writing-controls>.button{padding-inline:10px}.practice-pick{width:56px;min-width:54px}
}
@media(max-width:340px){
 .library-heading h1{font-size:27px}.library-heading-art{width:84px}.library-heading-art img{width:53px;height:53px}.library-heading-art img:nth-child(2){width:30px;height:30px}.library-heading .eyebrow{font-size:9px}.poem-card-title h2{font-size:19px}.poem-poet{width:24px;height:24px}.poem-card-title{gap:4px}.poem-open{font-size:10px}.poem-author{font-size:9px}.lesson-title h1{font-size:21px}.lesson-title p{font-size:10px}.lesson-bar{gap:7px}.record-tool>.verse ruby{font-size:27px;min-width:34px}.record-tool>.verse .punct{font-size:27px;width:15px}.verse rt{font-size:12px}.verse ruby{min-width:33px;font-size:25px}.verse .punct{font-size:25px;width:14px}.record-model{gap:8px}.record-model .button,.record-model>button{padding-inline:11px}.writing-controls>.button{width:100%}.practice-pick{width:53px;min-width:51px}.report-summary{grid-template-columns:77px minmax(0,1fr);gap:12px}.score-ring{width:73px;height:73px}.dimension strong{font-size:22px}.dimension span{font-size:9px}
}
@media(max-width:760px) and (max-height:740px){
 .lesson-bar{min-height:70px;padding-block:10px;margin-bottom:12px}.record-art{max-height:195px}.record-layout{gap:5px}.record-tool>.verse{margin-top:2px;margin-bottom:9px;min-height:64px}.record-model{margin-bottom:17px}.record-actions{min-height:106px}.mic-button{min-height:108px;gap:12px}.mic-button svg{width:70px;height:70px;padding:21px}.record-status{margin-top:8px}#record-controls{min-height:120px}.record-wave{height:17px;margin-bottom:8px}
}
@media(min-width:761px) and (max-height:820px){
 .lesson-bar{min-height:82px;margin-bottom:14px}.record-layout{min-height:calc(100svh - 125px);padding-bottom:15px}.record-art{max-height:400px}.record-tool>.verse{margin-block:12px}.record-model{margin-bottom:20px}.reading-experience{display:flex;flex-direction:column}.reader-controls{order:-1;margin:0 0 19px;padding:0 0 8px}.reading-scene .art-stage{max-height:345px}.reading-scene .poem-lines{gap:10px}.reading-scene .poem-lines.long{gap:2px}.reading-scene .poem-lines.long .verse,.reading-scene .poem-lines.long .verse-line{min-height:46px}.reading-scene .poem-lines.long .verse ruby,.reading-scene .poem-lines.long .punct{font-size:24px}
}
@media(max-width:760px){.practice-decoration{width:40px;height:40px;top:3px;left:50%;right:auto;transform:translateX(-50%) rotate(-8deg)}.reader-toolbar{margin-bottom:14px}.reader-toolbar h2{font-size:18px}.poem-card-title h2 small{display:block;margin:2px 0 0;font-size:10px}}
/* A small illustrated book: one activity, one usable page. */
:root{--bg:#f5f3eb;--ink:#304c43;--muted:#738075;--line:#deded0;--green:#3c6856;--green-soft:#eaf0e6;--red:#af6854;--red-soft:#f6eae1;--blue:#55797c;--blue-soft:#eaf0ee;--gold:#9a8150;--gold-soft:#f3edda}
body{background:linear-gradient(#f5f3ebef,#f5f3ebef),url('vendor/reading-art/white-paper.webp') repeat;background-size:auto,420px}
.site-header{min-height:64px;padding:8px max(28px,calc((100vw - 1160px)/2));border-color:var(--line)}
.brand-mark{border-radius:50%;width:34px;height:34px;background:transparent;color:var(--green);border:1px solid #bac7b7}.brand strong{font-size:13px;letter-spacing:1.3px;font-weight:600}
.button{border-radius:100px;border-color:#d6dbcf;background:#fffdf6;box-shadow:none;font-weight:500}.button.primary{box-shadow:0 3px 10px #304c4312;background:var(--green);border-color:var(--green)}
.icon-button{border-radius:50%}.button:hover:not(:disabled){background:#edf1e6}.button.primary:hover:not(:disabled){background:#315b49}
.library{max-width:1220px;min-height:0;height:calc(100dvh - 64px);padding:18px 30px 10px;display:flex;flex-direction:column}
.library-heading{flex-shrink:0;min-height:0;margin-bottom:20px;gap:16px}.library-heading h1{font-size:clamp(26px,2.5vw,38px);display:flex;align-items:center;gap:17px;line-height:1.55}.library-heading .eyebrow{font-size:11px;letter-spacing:1px;margin-bottom:3px}.library-sub{font-size:13px;margin-top:4px}
.poetry-seal{display:inline-grid;place-items:center;border:1px solid #b77559;outline:1px solid #b77559;outline-offset:3px;border-radius:2px;width:27px;height:29px;color:#a56d52;font:18px var(--serif);transform:rotate(-5deg)}
.paper-bird{width:150px;height:83px;object-fit:contain;margin-right:18px}
.library-books{flex:1;min-height:0;grid-template-rows:repeat(2,minmax(200px,1fr));gap:20px 25px;padding:2px 0 8px}
.poem-card{--book-color:#536f58!important;--book-soft:#edf0e5!important;min-height:0}.poem-card:nth-child(2){--book-color:#a57566!important}.poem-card:nth-child(3){--book-color:#687b86!important}.poem-card:nth-child(4){--book-color:#657858!important}.poem-card:nth-child(5){--book-color:#a08b59!important}.poem-card:nth-child(6){--book-color:#736a83!important}
.poem-entry{border:1px solid #dddccc;border-left:1px solid #d3d4c5;border-radius:5px 15px 15px 5px;box-shadow:3px 4px 0 #eceadf,4px 5px 0 #d6d7c8,0 9px 20px #304c4308;background:#fffdf6;padding:7px 7px 0 12px;transition:transform .2s,box-shadow .2s}
.poem-entry:before{content:'';position:absolute;top:0;left:5px;width:1px;height:100%;background:#e4e1d2;z-index:2}.poem-entry:hover{transform:translateY(-3px);border-color:#bac5b1;box-shadow:3px 6px 0 #e8e9dd,4px 7px 0 #c5cbb9,0 14px 24px #304c4310}
.poem-art{aspect-ratio:auto;min-height:70px;flex:1;border-radius:2px 9px 2px 2px;background-size:cover;background-position:center}.poem-art>img{object-fit:cover;object-position:center}
.poem-grade{top:0;left:auto;right:10px;padding:5px 6px 12px;font-size:10px;color:#fff;background:var(--book-color);border-radius:0;clip-path:polygon(0 0,100% 0,100% 100%,50% calc(100% - 5px),0 100%);letter-spacing:.5px}
.poem-card-body{padding:9px 10px 0;flex:0;position:relative}.poem-card-title{min-height:34px;gap:8px}.poem-card-title h2{font-size:24px;line-height:1.45}.poem-card-title h2 small{font-size:11px;display:inline-block;margin-left:6px}.poem-poet{width:34px;height:34px;border:1px solid #dadccd;filter:saturate(.8)}
.poem-author{margin:1px 0 6px;font-size:11px}.poem-open{min-height:34px;font-size:11px;border-top-color:#ebe8dc;font-weight:500}.poem-open>svg{width:15px;height:15px}.poem-open>svg:last-child{width:17px;height:17px}
.library-footer{margin-top:8px;min-height:36px;flex-shrink:0;font-size:10px}.library-footer a{min-height:36px}
.library.credits-page{height:auto;min-height:0}.credits-page .report-prose p+p{margin-top:18px}
.workspace{height:100dvh;min-height:0;max-width:1320px;display:grid;grid-template-rows:auto minmax(0,1fr);padding:0 36px 24px}
.lesson-bar{min-height:87px;padding:15px 0;margin:0 0 15px;border-bottom:1px solid var(--line)}.lesson-title h1{font-size:26px}.lesson-title p{font-size:11px;letter-spacing:1px}.lesson-menu>summary{background:#fffcf3;border:1px solid #d8ddcf;border-radius:50%}.menu-panel{border-radius:16px;background:#fffdf6;box-shadow:0 15px 45px #304c4326;padding:9px}.menu-panel>a,.menu-panel>button{border-radius:8px}
.study-main{min-height:0;height:100%;max-width:1160px}.view-section{height:100%;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:3px}
.record-layout{height:100%;min-height:0;max-width:none;grid-template-columns:minmax(0,1.3fr) minmax(320px,.9fr);gap:36px;padding:0;align-items:center}
.record-landscape{padding:14px 14px 4px;border:1px solid #dedccd;background:#fffdf7;border-radius:3px;box-shadow:0 6px 25px #304c430a;position:relative}
.record-landscape:before,.poem-landscape:before{content:'';width:33px;height:4px;background:#b98962;position:absolute;top:-2px;left:calc(50% - 16px);border-radius:2px;opacity:.65}
.record-art{max-height:calc(100dvh - 250px);border-radius:1px;background:#f8f5e9}.verse-list{margin-top:7px;padding-bottom:0;gap:3px}.verse-list-item{border-radius:50%;min-height:44px}.verse-list-item:after{display:none}.verse-list-item.current{background:#e5ebdd}
.record-practice{align-self:stretch;display:flex;align-items:center;justify-content:center}.record-tool{padding:16px 0;width:100%;max-width:420px}.record-counter>span{color:#79816e}.record-counter{font-size:12px}.record-tool>.verse{margin:16px 0 20px}.record-model{margin-bottom:24px}.record-model .button{border-radius:100px;background:#e5ebdf;font-size:13px}.record-model>[data-action=video]{background:#eceee7}
.mic-button{min-height:112px;font-size:15px;font-weight:500;gap:14px}.mic-button svg{width:72px;height:72px;padding:22px;background:#ab6956;box-shadow:0 0 0 7px #eee3d7,0 0 0 8px #dccfba}.mic-button:hover svg{background:#965a49}.record-status{font-size:12px}
.record-actions{min-height:90px;flex-wrap:nowrap}.record-review{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;max-width:100%;scrollbar-width:thin;padding:6px 2px;margin:10px 0}.record-review>span{flex-shrink:0;max-width:4em;line-height:1.6;text-align:left}.record-review button{flex-shrink:0;background:#eaf0e2}.record-result{font-family:var(--serif);font-size:34px}.record-result+.record-status{margin-top:4px}#record-controls{min-height:145px}
.view-read #view{display:flex;flex-direction:column}.reader-toolbar{margin:0 0 8px;flex-shrink:0}.reader-toolbar h2{font:500 15px var(--sans);color:var(--muted)}
.reading-experience{display:flex;flex-direction:column;flex:1;min-height:0;justify-content:center}.reading-scene{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(290px,.9fr);gap:38px;flex:1;min-height:0;align-items:center}
.poem-landscape{position:relative;padding:12px 12px 0;border:1px solid #dedccd;background:#fffdf7;box-shadow:0 6px 25px #304c430a}.reading-scene .art-stage{max-height:calc(100dvh - 295px)}
.poem-text{display:flex;flex-direction:column;min-height:240px;justify-content:center;padding:20px 6px}.reading-folio{display:flex;justify-content:space-between;color:#8d957f;font-size:11px;border-bottom:1px solid var(--line);padding-bottom:12px;letter-spacing:1px}.poem-lines{min-height:145px;justify-content:center;gap:12px}.page-turner{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:7px;border-top:1px solid var(--line);padding-top:6px}.page-turner .text-button{font-size:12px}
.reader-controls{order:0;display:flex;flex-wrap:nowrap;justify-content:center;margin:12px 0 0;padding:5px 0;flex-shrink:0;gap:12px}.reader-controls .media-buttons{display:flex;gap:9px}.reader-controls .button{font-size:13px;min-height:44px;padding:10px 17px}.media-buttons .button{background:#edf0e5;border-color:#dce1d1}.media-buttons>[data-action=video]{background:#eff0ea;border-color:#dde1d8}.audio-options{width:100%;max-width:500px;flex-shrink:0;margin:0 auto}.audio-timeline{gap:9px;font-size:10px}
.poem-dialog{width:540px;max-height:88dvh;overflow:auto;background:#faf7ed;padding:22px}.poem-dialog .verse{margin:12px 0}.poem-dialog .dialog-heading{position:sticky;top:-22px;background:#faf7ed;padding-block:5px;z-index:1}
.view-report .study-main{max-width:850px}.view-report #view{display:flex;flex-direction:column}.report-summary{flex-shrink:0;grid-template-columns:82px minmax(0,1fr);gap:25px;padding:4px 0 19px;margin:0}.score-ring{width:74px;height:74px;border:1px solid #9aa989;outline:1px solid #d5d9c7;outline-offset:4px}.score-ring strong{font:600 30px/1.15 var(--serif)}.score-ring span{font-size:9px}.dimension strong{font-size:24px;color:var(--green)}.dimension:nth-child(2) strong,.dimension:nth-child(3) strong{color:var(--green)}.dimension span{font-size:11px}.report-summary .eyebrow{font-size:11px}
.report-tabs{display:flex;gap:5px;flex-shrink:0;padding:5px;background:#e8eadd;border-radius:100px;margin:13px 0}.report-tabs button{flex:1;min-width:0;min-height:44px;padding:7px;border:0;border-radius:100px;background:transparent;font-size:13px}.report-tabs [aria-selected=true]{background:#fffdf5;box-shadow:0 2px 6px #304c4310;color:var(--green);font-weight:600}
.report-panels{min-height:0;flex:1;overflow:auto;scrollbar-width:thin;overscroll-behavior:contain}.practice-section{margin:0}.practice-selector{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:thin;gap:7px;padding:3px 2px 7px;margin:0 0 8px}.practice-pick{flex-shrink:0;width:54px;min-width:54px;min-height:71px;padding:4px;gap:0;border:1px solid #dce1cf;border-radius:7px;background:#f3f4e9}.practice-pick ruby{font-size:23px}.practice-pick[aria-pressed=true]{background:#e4eadb;border-color:#91a58c;box-shadow:none}.practice-pick small{font-size:10px}.practice-pick svg{width:12px;height:12px}.practice-card{border:0;padding:0 0 7px}.practice-card-heading{margin:0;gap:5px;min-height:48px}.practice-card-heading h3{font-size:19px}.practice-pager{display:flex;align-items:center;gap:2px;flex-shrink:0}.practice-pager span{font-size:10px;min-width:35px;text-align:center}.practice-pager .icon-button{width:44px;height:44px}
.practice-tip{font-size:13px;line-height:1.8;color:#677263}.contrast-heading{margin-top:6px;font-size:12px}.contrast-heading .text-button{font-size:12px}.contrast-pair{margin:3px 0 6px;gap:10px}.sound-word{position:relative;min-height:93px;padding:8px 5px;gap:1px;background:#edf0e6;border:1px solid #dde2d1;border-radius:10px}.sound-word ruby{font-size:28px;color:var(--green)}.sound-word rt{font-size:12px}.sound-word svg{position:absolute;right:9px;bottom:9px;width:14px;height:14px;color:#8b9d83}.sound-context{font-size:11px;color:var(--muted)}.practice-actions{flex-wrap:nowrap;gap:7px;margin-top:11px}.practice-actions .button{font-size:12px;padding:8px 13px;flex:1;white-space:nowrap}.practice-actions svg{width:16px;height:16px}
.ai-report-header{margin:8px 0 20px}.ai-report-header h2{font-size:21px}.report-prose{padding:15px 18px;border-left:2px solid #c5c9ae;background:#fffdf4;font-size:15px;line-height:2}.advice-placeholder{font-size:14px;color:var(--muted);margin:45px 12px}.score-line-tabs{display:flex;gap:5px;overflow-x:auto}.score-line-tabs button{flex-shrink:0;border:1px solid #dce0cf}.score-line-tabs [aria-pressed=true]{background:#e0e7d6}.report-line{padding:15px 0;border:0}.report-line .button{margin-top:20px}.word-analysis .word-result{border-radius:6px;width:62px}.word-grid{gap:8px}.word-analysis .section-heading{font-size:13px;margin:0 0 15px}
.writing-layout,.quiz-layout{height:100%;padding:12px 0;align-items:center;gap:55px}.writing-context .art-stage,.quiz-art .art-stage{border:12px solid #fffdf6;outline:1px solid #dddccb;box-shadow:0 8px 25px #304c4310;max-height:calc(100dvh - 300px)}.writing-context h2,.panel-title{font-size:23px}.writing-context p,.quiz-art p{font-size:13px}.writing-tool{max-width:min(380px,calc(100dvh - 300px));min-width:260px}.writing-board{border:1px solid #b9c4ab;background:#fffdf5;box-shadow:5px 5px 0 #e7e7d7}.writing-toolbar{margin-bottom:9px}.writing-pinyin{font-size:25px}.writing-hint{font-size:clamp(110px,22dvh,180px)}.writing-controls{margin-top:12px}.writing-tools{gap:3px}.writing-controls>.button{min-height:44px;font-size:13px;padding:8px 13px}.writing-feedback{font-size:12px;margin-top:8px;min-height:20px}.writing-tool>.text-button{font-size:12px}.writing-context .practice-results{max-height:85px;overflow:auto}
.quiz-top{margin-bottom:9px}.quiz-progress{height:3px;background:#e8e5d4;margin-bottom:20px}.quiz-progress i{background:#9aab7d}.quiz-prompt{font-size:22px;margin-bottom:20px}.quiz-option{background:#fffdf5;border-radius:12px;min-height:62px;font-size:18px;padding:12px 17px}.quiz-explanation{font-size:13px;min-height:70px;padding:15px 0}.quiz-next .button{min-width:140px}
.chat-layout{height:100%;min-height:0;padding:5px 0 0;align-items:stretch;grid-template-columns:200px minmax(0,1fr)}.poet-profile{padding:0 18px 0 0;border-right:1px solid var(--line)}.poet-profile img{border-radius:100px 100px 5px 5px;border:6px solid #fffdf6;outline:1px solid #d7dbca;max-height:260px}.poet-profile h2{font-size:24px}.poet-profile p{font-size:12px}.chat-tool{height:100%;min-height:0;overflow:hidden}.chat-messages{flex:1;min-height:0;max-height:none;gap:16px;padding:10px 5px 15px}.chat-bubble{background:#eef0e3;border-radius:2px 16px 16px 16px;font-size:15px}.chat-message.user .chat-bubble{background:#e1e8dc;color:var(--ink);border-radius:16px 2px 16px 16px}.chat-suggestions{flex-wrap:nowrap;overflow-x:auto;flex-shrink:0;gap:8px;padding:10px 1px;scrollbar-width:thin}.chat-suggestions button{flex-shrink:0;min-height:40px;padding:7px 13px;border:1px solid #d9ddcc;border-radius:100px;text-decoration:none;font-size:12px;background:#faf8ed}.chat-form{flex-shrink:0;border-radius:16px;background:#fffdf5;border-color:#c7d0b9}.chat-form textarea{background:transparent}.chat-form button{border-radius:50%}.chat-error{flex-shrink:0;min-height:0;padding:5px 0;font-size:12px}.chat-error:empty{display:none}
dialog{border-radius:16px;background:#fffdf6}dialog::backdrop{background:#243d34a8;backdrop-filter:blur(5px)}.toast{border-radius:100px;background:#45634b}.report-empty{margin:auto}.report-empty>img{width:180px;height:100px;max-width:100%;margin:0 auto 24px}
@media(max-width:900px){
 .workspace{padding:0 22px 16px}.record-layout{grid-template-columns:minmax(0,1fr) minmax(290px,1fr);gap:20px}.record-tool>.verse ruby{font-size:27px;min-width:34px}.record-tool>.verse .punct{font-size:27px;width:15px}.reading-scene{grid-template-columns:minmax(0,1fr) minmax(270px,1fr);gap:25px}.writing-layout,.quiz-layout{grid-template-columns:1fr}.writing-context,.quiz-art{display:none}.quiz-layout>div:last-child{width:100%;max-width:570px;margin:auto}.chat-layout{grid-template-columns:1fr}.poet-profile{display:none}.writing-tool{max-width:min(370px,calc(100dvh - 310px))}
}
@media(max-width:700px){
 .site-header{min-height:53px;padding:4px 18px}.brand strong{font-size:11px}.brand-mark{width:30px;height:30px}.brand-mark svg{width:19px;height:19px}
 .library{height:calc(100dvh - 53px);padding:15px 18px 5px}.library-heading{margin-bottom:16px;gap:6px}.library-heading h1{font-size:24px;gap:13px}.library-heading .eyebrow{font-size:9px;max-width:none;letter-spacing:.5px}.library-sub{font-size:11px;margin-top:3px}.poetry-seal{width:19px;height:22px;font-size:14px;outline-offset:2px}.paper-bird{display:none}
 .library-books{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(3,minmax(140px,1fr));gap:14px 16px}.poem-entry{padding:5px 5px 0 9px;border-radius:3px 11px 11px 3px}.poem-entry:before{left:3px}.poem-art{min-height:48px;border-radius:2px 6px 2px 2px}.poem-grade{font-size:9px;right:5px;padding:3px 4px 9px}.poem-card-body{padding:4px 5px 0}.poem-card-title{min-height:28px;gap:3px}.poem-card-title h2{font-size:19px}.poem-card-title h2 small{font-size:8px;margin-left:3px}.poem-poet{width:24px;height:24px}.poem-author{font-size:9px;margin:0 0 3px}.poem-open{font-size:10px;min-height:27px;gap:4px}.poem-open>svg{width:12px;height:12px}.poem-open>svg:last-child{width:14px;height:14px}.library-footer{margin-top:5px;font-size:9px;min-height:34px}
 .workspace{padding:0 16px max(12px,env(safe-area-inset-bottom));height:100dvh}.lesson-bar{min-height:70px;margin-bottom:10px;padding:10px 0;gap:10px}.lesson-title h1{font-size:23px}.lesson-title p{font-size:10px;letter-spacing:.5px}.back-library{font-size:9px}.lesson-menu>summary{width:44px;height:44px;font-size:9px}.view-section{padding:2px}.record-layout{display:flex;flex-direction:column;gap:8px;justify-content:center;align-items:stretch;height:100%}
 .record-landscape{padding:8px 8px 0;flex-shrink:0}.record-art{max-height:clamp(105px,calc(100dvh - 500px),225px);aspect-ratio:16/8.5}.verse-list{margin-top:1px;padding:0;gap:1px}.verse-list-item{min-width:36px;min-height:44px;grid-auto-columns:minmax(36px,1fr);font-size:11px}.verse-list:has(.verse-list-item:nth-child(8)){margin-inline:0;width:100%;max-width:100%;padding:0;grid-auto-columns:minmax(34px,1fr)}
 .record-practice{display:block;flex:0 0 auto}.record-tool{padding:0;max-width:440px}.record-counter{min-height:44px;font-size:11px}.record-tool>.verse{margin:2px 0 10px;min-height:64px}.record-tool>.verse ruby{font-size:29px;min-width:38px}.record-tool>.verse .punct{font-size:29px;width:16px}.record-model{margin-bottom:13px;gap:10px}.record-model .button{padding:9px 15px;font-size:12px}.record-actions{min-height:78px;gap:8px}.mic-button{min-height:104px;font-size:14px;gap:12px}.mic-button svg{width:64px;height:64px;padding:19px;box-shadow:0 0 0 6px #eee3d7,0 0 0 7px #dccfba}#record-controls{min-height:124px}.record-result{font-size:30px}.record-review{margin:5px 0;padding:4px 1px;gap:6px}.record-review button{min-height:44px;padding:3px 6px}.record-review ruby{font-size:22px}.record-review>span{font-size:10px}.record-review rt{font-size:10px}.record-actions .button{font-size:12px;padding:8px 12px;gap:5px}.record-status{font-size:11px;margin-top:7px}
 .reading-experience{justify-content:space-evenly;overflow:visible}.reading-scene{display:flex;flex-direction:column;flex:0 1 auto;gap:10px;align-items:stretch}.poem-landscape{padding:8px 8px 0}.reading-scene .art-stage{max-height:clamp(115px,calc(100dvh - 485px),250px)}.scene-dots button{height:34px}.poem-text{grid-row:auto;min-height:0;padding:0 3px}.reading-folio{font-size:10px;padding-bottom:4px}.poem-lines{min-height:104px;gap:0;padding:3px 0}.poem-lines .verse{min-height:50px}.poem-lines .verse ruby{font-size:27px;min-width:35px;line-height:1.5}.poem-lines .verse rt{font-size:11px}.poem-lines .punct{font-size:27px;line-height:1.5;width:15px}.page-turner{margin-top:0;padding-top:0}.page-turner .text-button{font-size:11px}.reader-toolbar{margin-bottom:4px}.reader-toolbar h2{font-size:14px}.reader-controls{display:flex;gap:8px;margin:5px 0 0;padding:0}.reader-controls .media-buttons{display:flex;gap:8px;min-width:0}.reader-controls .button{font-size:12px;padding:8px 10px;gap:5px;white-space:nowrap}.reader-controls .button svg{width:17px;height:17px}.read-start>svg:last-child{display:none}.audio-options{margin-top:3px}.audio-timeline{font-size:10px;gap:6px}.audio-timeline select{font-size:11px}.poem-dialog{padding:18px 10px}.poem-dialog .dialog-heading{top:-18px;padding-inline:8px}.poem-dialog .verse ruby{font-size:26px;min-width:35px}.poem-dialog .verse rt{font-size:11px}
 .report-summary{grid-template-columns:65px minmax(0,1fr);gap:19px;padding:5px 3px 16px}.score-ring{width:60px;height:60px}.score-ring strong{font-size:25px}.score-ring span{font-size:8px;margin-top:2px}.report-summary .eyebrow{font-size:9px;margin-bottom:5px}.dimension-grid{gap:7px}.dimension strong{font-size:21px}.dimension span{font-size:9px}.report-tabs{margin:10px 0;gap:2px;padding:3px}.report-tabs button{font-size:12px;min-height:44px}.practice-selector{margin-bottom:4px}.practice-pick{min-height:68px;width:51px;min-width:51px}.practice-card-heading h3{font-size:16px}.practice-pager{gap:0}.practice-pager span{font-size:9px;min-width:30px}.practice-tip{font-size:12px;line-height:1.75}.practice-actions .button{font-size:11px;padding:8px 9px;gap:4px}.practice-actions{gap:5px}.practice-actions svg{width:15px;height:15px}.contrast-heading{font-size:11px;margin-top:3px}.contrast-heading .text-button{font-size:11px}.contrast-pair{gap:8px}.sound-word{min-height:88px}.sound-word ruby{font-size:27px}.sound-word svg{right:7px;bottom:8px;width:13px;height:13px}.sound-context{font-size:10px}.ai-report-header h2{font-size:19px}.ai-report-header .button{font-size:12px}.report-prose{font-size:14px;padding:12px}.word-analysis .word-result{width:calc((100% - 24px)/4);min-height:83px}.word-grid{gap:8px}.report-line-heading>span{font-size:15px}
 .writing-layout,.quiz-layout{height:100%;padding:0;display:flex;align-items:center;justify-content:center}.writing-tool{min-width:0;max-width:min(350px,calc(100dvh - 315px));width:100%}.writing-toolbar{margin-bottom:8px}.writing-pinyin{font-size:24px}.writing-counter{font-size:11px}.writing-controls{flex-wrap:nowrap;gap:5px}.writing-tools{gap:1px}.writing-tools .icon-button{width:40px;height:44px}.writing-controls>.button{width:auto;min-height:44px;white-space:nowrap;font-size:12px;padding:8px 12px}.writing-feedback{font-size:11px}.writing-tool>.text-button{font-size:11px}.quiz-prompt{font-size:21px;margin-bottom:18px}.quiz-option{min-height:61px;font-size:18px;padding:11px 14px}.quiz-explanation{min-height:80px;font-size:13px;padding:15px 0}.quiz-next .button{width:100%}.quiz-top{font-size:12px}.completion{padding:28px 8px}.completion h2{font-size:24px}
 .chat-layout{padding:0;height:100%;display:flex}.chat-tool{width:100%;height:100%}.chat-messages{min-height:0;max-height:none;padding:4px 0 12px;gap:14px}.chat-bubble{font-size:14px;line-height:1.85;padding:12px;max-width:calc(100% - 40px)}.chat-message>img{width:33px;height:33px}.chat-suggestions{padding:9px 0}.chat-suggestions button{font-size:11px;min-height:44px}.chat-form{padding:7px}.chat-form textarea{font-size:16px}.keyboard-open .workspace{height:var(--visual-height,100dvh);padding-top:8px}.keyboard-open .chat-messages{min-height:0;max-height:none}.keyboard-open .chat-suggestions{display:none}
}
@media(max-width:370px){.library-heading h1{font-size:21px;gap:11px}.poem-card-title h2{font-size:17px}.poem-poet{width:21px;height:21px}.library-books{gap:12px}.workspace{padding-inline:12px}.lesson-title h1{font-size:21px}.record-tool>.verse ruby{min-width:34px;font-size:27px}.record-tool>.verse .punct{width:15px;font-size:27px}.practice-card-heading h3{font-size:14px}.practice-pager span{min-width:25px}.practice-pager .icon-button{width:40px}.reader-controls .button{font-size:11px;padding:8px;gap:4px}.poem-lines .verse ruby{min-width:33px;font-size:26px}.writing-tools .icon-button{width:38px}.writing-controls>.button{padding-inline:9px}.writing-hint{font-size:140px}}
/* Small landscape screens and large text keep a reachable scroll surface. */
@media(max-height:620px){.library{height:auto;min-height:calc(100dvh - 53px)}.library-books{grid-auto-rows:180px;grid-template-rows:none;flex:0}.record-layout{height:auto;min-height:100%;padding:10px 0}.reading-experience{flex:none;min-height:100%}.reading-scene{flex:none}.writing-tool{max-width:300px}.writing-layout,.quiz-layout{height:auto;min-height:100%;padding:12px 0}.chat-layout{height:100%}.report-panels{overflow:auto}.poem-text{min-height:180px}.record-art{max-height:165px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

/* visuals.css */
/* Illustrated reading surfaces; layout and activity behaviour live in styles.css. */
:root {
  --bg:#fbf7ec;--ink:#244f49;--muted:#667b6e;--line:#e4e4d6;
  --green:#327c66;--green-soft:#e8f2e8;--blue:#42798b;--blue-soft:#e8f2f5;
  --red:#c16850;--red-soft:#fcebe0;--gold:#9a762e;--gold-soft:#fbf1d6;
  --poem-color:#397f69;--poem-soft:#edf4e9;--poem-light:#f7faf2;
}
.poem-color-1{--poem-color:#397f69;--poem-soft:#e9f3e5;--poem-light:#f5faef;--poem-mark:url('media/poetry-motifs/goose.svg')}
.poem-color-2{--poem-color:#ae5e50;--poem-soft:#faece3;--poem-light:#fdf6f0;--poem-mark:url('media/poetry-motifs/boat.svg')}
.poem-color-3{--poem-color:#49798b;--poem-soft:#e9f1f3;--poem-light:#f2f8f8;--poem-mark:url('media/poetry-motifs/mountain.svg')}
.poem-color-4{--poem-color:#697a46;--poem-soft:#eff2e0;--poem-light:#fafbf0;--poem-mark:url('media/poetry-motifs/moon.svg')}
.poem-color-5{--poem-color:#937128;--poem-soft:#f8f0da;--poem-light:#fdf9ee;--poem-mark:url('media/poetry-motifs/sprout.svg')}
.poem-color-6{--poem-color:#79709a;--poem-soft:#f0edf7;--poem-light:#f9f6fc;--poem-mark:url('media/poetry-motifs/swallow.svg')}
.poem-color-7{--poem-color:#4f6f8f;--poem-soft:#e8eef5;--poem-light:#f4f7fb;--poem-mark:url('media/poetry-motifs/snow.svg')}
.poem-color-8{--poem-color:#a14a3c;--poem-soft:#f8e6e0;--poem-light:#fcf3ef;--poem-mark:url('media/poetry-motifs/rooster.svg')}
.poem-color-9{--poem-color:#7d5a3c;--poem-soft:#f3e9de;--poem-light:#faf5ee;--poem-mark:url('media/poetry-motifs/beans.svg')}
.poem-color-10{--poem-color:#2f7a86;--poem-soft:#e3f1f3;--poem-light:#f1f8f9;--poem-mark:url('media/poetry-motifs/oriole.svg')}
.poem-color-11{--poem-color:#8b5e83;--poem-soft:#f4eaf2;--poem-light:#faf5f9;--poem-mark:url('media/poetry-motifs/shoe.svg')}
.poem-color-12{--poem-color:#4f7a30;--poem-soft:#edf4e2;--poem-light:#f7fbf0;--poem-mark:url('media/poetry-motifs/cup.svg')}
body{background:radial-gradient(ellipse at 6% 0%,#fff9e7 0,transparent 48%),radial-gradient(ellipse at 100% 80%,#edf3e97a,transparent 55%),#fbf9f1}
.site-header{border-bottom-color:#e7e7db;background:#fffcf57d}
.brand-mark{background:#fffef6;border-color:#bfd4c1;box-shadow:0 2px 5px #264e4410}.brand strong{color:#2d6054;letter-spacing:1.8px}.profile-button{color:#3a745f}
.library{max-width:1250px;padding-top:22px}
.library-heading{margin-bottom:22px}.library-heading h1{display:block;font-size:clamp(27px,2.8vw,40px);line-height:1.45;letter-spacing:1px;color:#28564d}
.library-heading .eyebrow{font-size:11px;color:#698071;letter-spacing:1.1px;margin-bottom:6px}.library-sub{color:#738577;font-size:13px;margin-top:7px;letter-spacing:.4px}
.title-ink{display:inline-block;color:#3d876a}
.poetry-seal{display:inline-grid;margin-left:18px;vertical-align:middle;color:#bc7358;border-color:#c48567;outline-color:#d7a088;background:#fff8e8;width:26px;height:30px;font-size:18px;transform:rotate(-7deg)}
.library-flourish{width:185px;height:98px;position:relative;flex-shrink:0;isolation:isolate;margin-right:15px}
.library-flourish:before{content:'';position:absolute;z-index:-1;inset:6px 16px 5px 30px;background:#f6eccb;border-radius:59% 41% 52% 48% / 43% 57% 43% 57%;transform:rotate(-8deg)}
.library-flourish:after{content:'';position:absolute;right:4px;top:13px;width:5px;height:5px;background:#d8aa69;border-radius:50%;box-shadow:-148px 52px 0 -1px #9ab49a,3px 59px 0 -1px #d3a089}
.paper-bird{width:160px;height:90px;position:relative;top:1px;left:6px;margin:0;transform:rotate(-3deg)}
.library-books{gap:24px 27px;padding-bottom:7px}
.poem-card{--book-color:var(--poem-color)!important;--book-soft:var(--poem-soft)!important}
.poem-card:nth-child(n){--book-color:var(--poem-color)!important;--book-soft:var(--poem-soft)!important}
.poem-entry{padding:8px 8px 0 12px;border:1px solid #e3e5d8;border-left:4px solid var(--poem-color);border-radius:5px 17px 17px 5px;background:var(--poem-light);box-shadow:0 3px 0 #fffdf6,0 4px 0 #dce0ce,0 9px 20px #3851430a;transition:transform .22s,box-shadow .22s,border-color .22s}
.poem-entry:before{left:3px;background:#fff9;opacity:.9}.poem-entry:hover{border-color:var(--poem-color);box-shadow:0 3px 0 #fffdf6,0 5px 0 #d7dfcb,0 13px 24px #38514312;transform:translateY(-4px) rotate(-.3deg)}
.poem-art{border-radius:2px 10px 3px 3px}.poem-art>img{transition:transform .8s cubic-bezier(.2,.7,.3,1)}
@media(hover:hover){.poem-entry:hover .poem-art>img{transform:scale(1.025)}}
.poem-grade{background:var(--poem-color);font-size:11px;right:11px;padding:6px 8px 13px;box-shadow:0 2px 7px #2c4e3820}
.poem-card-body{padding:10px 10px 0;position:relative;isolation:isolate}
.poem-card-title{min-height:37px;padding-right:52px}.poem-card-title h2{font-size:26px;letter-spacing:.6px;color:#2e5549}.poem-card-title h2 small{font-size:11px;margin-left:5px;color:#7d897b}
.poem-emblem{position:absolute;right:6px;top:5px;width:48px;height:48px;transform:rotate(7deg);pointer-events:none;transition:transform .28s}
.poem-entry:hover .poem-emblem{transform:rotate(-3deg) translateY(-2px)}
.poem-author{font-size:11px;margin:0 0 8px;color:#708171}.poem-open{color:var(--poem-color);font-size:12px;min-height:39px;border-top:1px solid color-mix(in srgb,var(--poem-color) 14%,transparent);font-weight:500}
.poem-open>svg:last-child{width:27px;height:27px;padding:6px;border-radius:50%;background:var(--poem-soft);transition:transform .2s,background .2s}.poem-entry:hover .poem-open>svg:last-child{transform:translateX(2px);background:var(--poem-color);color:white}
.library-footer{color:#7b8b78;font-size:10px;letter-spacing:.5px}
.lesson-bar{border-bottom:0;position:relative}.lesson-bar:after{content:'';position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(90deg,var(--poem-color),#dfe5d7 24%,#dfe5d7 92%,transparent);opacity:.6}
.lesson-title{display:flex;align-items:center;gap:13px}.lesson-portrait{width:46px;height:46px;object-fit:cover;object-position:center 20%;border-radius:50%;padding:3px;background:#fffdf6;box-shadow:0 0 0 1px #dbe2d0;flex-shrink:0}.lesson-heading{min-width:0}.lesson-title h1{font-size:28px;color:#28554a;letter-spacing:.8px}.lesson-title p{color:#738674;font-size:11px}
.back-library{color:#587a66}.lesson-menu>summary{background:#fffef6;border-color:#d5e0d0;box-shadow:0 3px 0 #e7eadc;color:#44755c}.menu-panel{border-color:#dae3d1;background:#fffef7;box-shadow:0 15px 45px #304c4320}.menu-panel a[aria-current=page]{background:var(--poem-soft);color:var(--poem-color)}
.button{border-color:#d8e1cd;background:#fffef7;box-shadow:0 2px 0 #e5e9db;color:#38614e;transition:transform .17s,box-shadow .17s,background .17s,border-color .17s}
.button.primary{background:#377e63;border-color:#377e63;box-shadow:0 3px 0 #28614d,0 7px 12px #377e6310;color:#fffef5}.button.primary:hover:not(:disabled){background:#32745b;box-shadow:0 3px 0 #245740,0 8px 14px #377e631c}
.button:active:not(:disabled){transform:translateY(2px);box-shadow:none}.icon-button{color:#477d64;transition:background .17s,transform .17s}.icon-button:active:not(:disabled){transform:scale(.94)}.pinyin-toggle{background:var(--poem-soft);color:var(--poem-color)}
.record-layout,.reading-experience{position:relative;isolation:isolate}
.record-layout{padding:20px 26px;gap:45px;background:#fffdf7;border:1px solid #e2e6d8;border-radius:8px 24px 24px 8px;box-shadow:0 4px 0 #f4f1e3,0 5px 0 #e2e2d1,0 15px 40px #36563e06}
.record-layout:before{content:'';position:absolute;z-index:-1;left:58%;top:28px;bottom:28px;width:1px;background:linear-gradient(transparent,#e8e5d7 20%,#e8e5d7 80%,transparent)}
.record-landscape{padding:11px 11px 4px;background:#fffef8;border:1px solid #e2e5d6;border-radius:4px 12px 12px 4px;box-shadow:0 5px 16px #274b3d09;transform:rotate(-.45deg)}
.record-landscape:before,.poem-landscape:before{background:var(--poem-color);width:39px;height:6px;left:calc(50% - 19px);top:-3px;opacity:.5;border-radius:1px;transform:rotate(-2deg)}
.record-art{background:#faf6e9}.verse-list{gap:4px}.verse-list-item{font-size:12px;color:#80927d}.verse-list-item.current{background:var(--poem-soft);color:var(--poem-color);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--poem-color) 25%,transparent);font-weight:600}.verse-list-item.done{color:#458b68}.verse-list-item.done:not(.current){background:#f3f7ed}
.record-tool{padding:5px 0;max-width:420px}.record-counter{color:#7a8b76;position:relative}.record-counter>span{font-size:12px;font-weight:500;color:#6e866e;letter-spacing:.3px}
.practice-motif{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) rotate(5deg);width:42px;height:42px;pointer-events:none}
.record-tool>.verse{margin:22px 0 23px}.record-tool>.verse ruby{font-size:34px;min-width:43px;font-weight:600;color:#245848}.record-tool>.verse rt{color:#719476;font-size:14px;font-weight:400}.record-tool>.verse .punct{font-size:34px;color:#477b60}
.record-model{gap:12px;margin-bottom:26px}.record-model .button{background:#e6f2e6;color:#3e805e;box-shadow:0 2px 0 #d4e5d1;border:1px solid #d8e9d4}.record-model>[data-action=video]{background:#e8f2f5;color:#4f8094;box-shadow:0 2px 0 #d5e4e9;border-color:#dceaf0}
.mic-button{color:#b56049;font-weight:500;gap:15px}.mic-button svg{background:linear-gradient(145deg,#d78363,#c66a51);box-shadow:0 4px 0 #aa5543,0 0 0 7px #fff0db,0 0 0 8px #eddac0,0 8px 20px #b4714d19;border:1px solid #f0b395;transition:transform .2s,box-shadow .2s}
.mic-button:hover svg{background:linear-gradient(145deg,#d98968,#bd634c);transform:translateY(-2px) rotate(-3deg)}.mic-button:active svg{transform:translateY(2px) scale(.97);box-shadow:0 1px 0 #aa5543,0 0 0 7px #fff0db,0 0 0 8px #eddac0}
.mic-button.recording svg{background:#c26351;box-shadow:0 0 0 7px #fce7dd;animation:record-breathe 1.8s ease-in-out infinite}.record-wave.live span{background:#c8785c}
.record-result{color:#3e8260;font:600 36px/1.25 var(--serif);display:flex;align-items:center;justify-content:center;gap:4px}.record-result:before{content:'';display:block;width:35px;height:35px;margin-right:6px;background:var(--poem-mark) center/contain no-repeat;transform:rotate(-7deg)}
.record-status{color:#7d8e79}.record-review button{background:#fff2d9;border:1px solid #f0dfbd;border-radius:8px;box-shadow:0 2px 0 #f3e8cc}.record-review ruby{color:#80673d}.record-review svg{color:#a78a52}.record-review>span{color:#8b855f}
.view-read #view{padding:4px 5px}.reader-toolbar h2{color:#7a8f7b;font-size:14px}.reading-experience{padding:12px 24px 9px;border:1px solid #e3e7d9;border-radius:8px 24px 24px 8px;background:#fffdf7;box-shadow:0 4px 0 #f3f0e3,0 5px 0 #e2e2d1,0 12px 35px #36563e06}
.poem-landscape{border-color:#e0e4d4;border-radius:4px 12px 12px 4px;background:#fffef8;box-shadow:none;transform:rotate(-.4deg)}.reading-folio{color:var(--poem-color);border-color:#e6e8da;font-size:11px}.reading-folio>span:first-child:before{content:'';display:inline-block;vertical-align:middle;width:20px;height:20px;margin-right:6px;background:var(--poem-mark) center/contain no-repeat}
.poem-lines .verse ruby{color:#285c4c}.poem-lines .verse rt{color:#749778}.poem-lines .verse .punct{color:#477b60}.page-turner{border-color:#e6e8da}.scene-dots button:after{background:#dce7d2}.scene-dots button[aria-pressed=true]:after{background:var(--poem-color);box-shadow:0 0 0 4px var(--poem-soft)}
.media-buttons .button{background:#e9f4e7;color:#448461;border-color:#d8e8d2;box-shadow:0 2px 0 #d7e4cd}.media-buttons>[data-action=video]{background:#eaf3f7;color:#527e93;border-color:#dce9f0;box-shadow:0 2px 0 #d9e5ea}.audio-timeline{color:#8fa089}.audio-timeline input{accent-color:#6b9b78}
.report-summary{padding:12px 15px 17px;border:1px solid #e3e7d7;background:#fffef7;border-radius:15px;gap:23px;box-shadow:0 3px 0 #eeeddf}.score-ring{background:#f5f7e8;border:2px solid #79a17b;outline-color:#dee5c6;color:#48764e}.score-ring strong{font-size:32px}.score-ring span{color:#839072}.report-summary .eyebrow{color:#87987a}
.dimension-grid{gap:10px}.dimension{padding:7px 10px;background:#edf5e9;border-radius:8px}.dimension:nth-child(2){background:#edf3f4}.dimension:nth-child(3){background:#faf2dc}.dimension strong{color:#4b8460;font-size:23px}.dimension:nth-child(2) strong{color:#55828e}.dimension:nth-child(3) strong{color:#9a803b}.dimension span{color:#7a8b76}
.report-tabs{background:#eaf0e2;box-shadow:inset 0 1px 2px #657d4d08}.report-tabs [aria-selected=true]{background:#fffef8;color:#4a7e5e;box-shadow:0 2px 5px #5b7c4012}.report-panels{padding:2px 0}
.practice-pick{background:#fff5e0;border-color:#efdfbb;box-shadow:0 2px 0 #f2e7ce;border-radius:8px;color:#7e754c}.practice-pick ruby{color:#7b6d46}.practice-pick rt{color:#9b8b62}.practice-pick[aria-pressed=true]{background:#edf4de;border-color:#87aa79;box-shadow:0 2px 0 #bdcca0}.practice-pick.selected ruby,.practice-pick.selected rt{color:#537c4e}
.practice-card{padding:5px 13px 12px;border:1px solid #e3e8d8;border-radius:14px;background:#fffef8;box-shadow:0 3px 0 #f0efdf}.practice-card-heading h3{color:#4b7556}.practice-tip{color:#73806b;font-size:13px}.contrast-heading{color:#899378}.sound-word{background:#f0f6e9;border-color:#dee9d3;border-radius:10px;box-shadow:0 2px 0 #e3ebd9}.sound-word:nth-child(2){background:#edf4f5;border-color:#dce8e9;box-shadow:0 2px 0 #e0e9e9}.sound-word:nth-child(3){background:#fbf3e2;border-color:#ede4ca;box-shadow:0 2px 0 #efe8d2}.sound-word ruby{color:#527b56}.sound-word:nth-child(2) ruby{color:#58828a}.sound-word:nth-child(3) ruby{color:#93804b}.sound-word rt{color:inherit}.sound-context{color:#87917b}.practice-actions{margin-top:13px}
.ai-report-header h2{color:#547551}.report-prose{background:#fffef5;border:1px solid #e8e9d8;border-left:3px solid #d6b967;border-radius:3px 14px 14px 3px;box-shadow:0 3px 0 #f0eddf}.score-line-tabs [aria-pressed=true]{background:var(--poem-soft);border-color:var(--poem-color);color:var(--poem-color)}
.word-result.warn,.word-result.fair{background:#fff4da;border-color:#e5d496}.word-result.error,.word-result.poor{background:#fff0e4;border-color:#e8c7aa}
.writing-context .art-stage,.quiz-art .art-stage{border-color:#fffef7;outline-color:#e2e5d4;border-radius:4px 15px 15px 4px;box-shadow:0 7px 25px #31573c0a;transform:rotate(-.5deg)}
.writing-context h2,.panel-title{color:#53784f}.writing-context p,.quiz-art p{color:#7e8c72}
.writing-pinyin{color:#5a8c63}.writing-counter{color:#8b977f}.writing-board{border-color:#b8cfa9;background:linear-gradient(#fffdf480,#fffdf480),url('vendor/reading-art/white-paper.webp') center/cover;box-shadow:5px 5px 0 #e7eccf,6px 6px 0 #d7dec1;border-radius:7px;outline:7px solid #fffdf5}
.writing-board:before,.writing-board:after{border-color:#d4dfbe}.writing-tools .icon-button{background:#ecf4e3;color:#6c9465;border:1px solid #dfe9ce;border-radius:9px}.writing-toolbar [data-action=write-speak]{background:#e9f3e4;color:#568753;border:1px solid #d5e4c8}.writing-hint{color:#d5e5c8}.writing-controls{margin-top:17px}.writing-feedback{color:#899476}
.writing-board{contain:layout paint;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.writing-board canvas{display:block;cursor:crosshair;user-select:none;-webkit-user-select:none}
.quiz-top{color:#7e9376}.quiz-top>span:first-child{padding:4px 10px;background:var(--poem-soft);color:var(--poem-color);border-radius:100px;font-size:12px}.quiz-progress{height:6px;background:#edf0df;border-radius:100px;overflow:visible}.quiz-progress i{position:relative;background:linear-gradient(90deg,#94b676,#5c9870);border-radius:100px}.quiz-progress i:after{content:'';position:absolute;right:-4px;top:-2px;width:10px;height:10px;background:#fff9df;border:2px solid #7ba267;border-radius:50%}
.quiz-prompt{color:#385d4d}.quiz-option{border-color:#dfe6d1;background:#fffef6;box-shadow:0 3px 0 #e7ebd9;border-radius:13px;transition:transform .15s,background .15s,border-color .15s}.quiz-option>span{background:#f0f5e6;border-color:#dce6cd;color:#7d9770}.quiz-option:hover:not(:disabled){transform:translateX(3px);background:#f7fbed;border-color:#a8c29a}.quiz-option.correct{background:#edf6e6;border-color:#80b47d;box-shadow:0 3px 0 #c4ddb0;color:#427a49}.quiz-option.correct>span{background:#84af72;color:#fff;border-color:#84af72}.quiz-option.incorrect{background:#fff0e8;border-color:#dfad96;box-shadow:0 3px 0 #f0daca;color:#a3654e}.quiz-explanation{color:#7c8c70}
.completion>svg{background:#fcf2d3;border:1px solid #ecdba3;border-radius:40% 60% 54% 46%;padding:10px;width:75px;height:75px;color:#b89643;transform:rotate(-7deg)}.completion h2{color:#4d7b53}
.chat-tool{padding:15px 16px 12px;background:#fffdf7;border:1px solid #e1e6d6;border-radius:18px;box-shadow:0 4px 0 #eeeddf}.chat-bubble{background:#eff5e5;border:1px solid #e5ebd7;color:#426047}.chat-message.user .chat-bubble{background:#e5f0ee;border-color:#d8e7e2;color:#3e7063}.chat-message>img{padding:2px;border:1px solid #d9e2cc;background:#fffef8}.chat-suggestions button{background:#fbf8ec;border-color:#e8e2ca;color:#849068}.chat-form{border-color:#c9dcbf;box-shadow:0 2px 0 #e9eddb;background:#fffef9}.chat-form button{background:#57936b;color:#fff}
.poet-profile{border-right:0}.poet-profile img{border-color:#fffef8;outline-color:#dae3cc;box-shadow:0 4px 0 #edecde,0 10px 22px #395a3c08}.poet-profile h2{color:var(--poem-color)}.poet-profile p{color:#7e9076}
[data-audio-state=playing]{outline:2px solid #75a985;outline-offset:2px;box-shadow:0 0 0 5px #eef5e0}.sound-word[data-audio-state=playing]{background:#e7f4e1;border-color:#7aad7d}
:focus-visible{outline:3px solid #4a8490;outline-offset:4px}
@keyframes record-breathe{50%{box-shadow:0 0 0 10px #fae4da}}
@media(max-width:1100px){
 .record-layout{gap:28px;padding:16px 19px;grid-template-columns:minmax(0,1.2fr) minmax(285px,1fr)}.record-layout:before{display:none}.record-tool>.verse ruby{font-size:29px;min-width:35px}.record-tool>.verse .punct{font-size:29px;width:15px}.reading-experience{padding-inline:16px}.reading-scene{gap:25px;grid-template-columns:minmax(0,1.1fr) minmax(270px,1fr)}
 .poem-card-title h2{font-size:23px}.poem-card-title{padding-right:39px}.poem-emblem{width:39px;height:39px;right:5px}.poem-card-title h2 small{display:block;margin:0;font-size:10px}.poem-card-title{min-height:40px}
}
@media(max-width:900px) and (min-width:701px){
 .record-layout{gap:22px;padding-inline:15px;grid-template-columns:minmax(0,1fr) minmax(255px,1fr)}.record-tool>.verse ruby{font-size:26px;min-width:31px}.record-tool>.verse rt{font-size:11px}.record-tool>.verse .punct{font-size:26px;width:14px}.record-model{gap:8px}.record-model .button{font-size:12px;padding-inline:10px}.reading-experience{padding-inline:12px}.reading-scene{gap:16px;grid-template-columns:minmax(0,1fr) minmax(245px,1fr)}.reading-scene .verse ruby{font-size:25px;min-width:30px}.reading-scene .verse .punct{font-size:25px;width:14px}.poem-emblem{display:none}.poem-card-title{padding-right:0}
}
@media(max-width:700px){
 .site-header{background:#fffcf682}.brand strong{font-size:11px;letter-spacing:1.4px}.library{padding:16px 17px 5px}.library-heading{margin-bottom:16px;min-height:0;gap:0}.library-heading h1{font-size:23px;letter-spacing:.3px;line-height:1.5;white-space:nowrap}.library-heading .eyebrow{font-size:9px;letter-spacing:.5px;margin-bottom:5px}.library-sub{font-size:11px;letter-spacing:0;margin-top:5px}.title-ink:after{height:6px;bottom:3px}.poetry-seal{display:none}
 .library-flourish{display:block;width:53px;height:56px;margin:0 0 0 -7px;align-self:center}.library-flourish:before{inset:5px 0 6px 2px;background:#f6edcf}.library-flourish:after{width:3px;height:3px;right:1px;top:2px;box-shadow:-48px 41px 0 -1px #99b896}.paper-bird{display:block;width:65px;height:47px;max-width:none;top:5px;left:-7px;transform:rotate(-9deg)}
 .library-books{gap:15px 16px}.poem-entry{padding:5px 5px 0 8px;border-left-width:3px;border-radius:4px 12px 12px 4px;box-shadow:0 3px 0 #fffdf6,0 4px 0 #dce0ce,0 7px 16px #38514309}.poem-entry:before{left:2px}.poem-art{border-radius:2px 7px 2px 2px}.poem-grade{font-size:10px;right:6px;padding:4px 5px 10px}.poem-card-body{padding:5px 5px 0}.poem-card-title{min-height:29px;padding-right:27px}.poem-card-title h2{font-size:20px;letter-spacing:.3px}.poem-card-title h2 small{display:inline-block;font-size:8px;margin-left:2px}.poem-emblem{display:block;width:31px;height:31px;right:1px;top:3px;transform:rotate(7deg)}.poem-author{font-size:10px;margin:0 0 5px}.poem-open{min-height:31px;font-size:11px;gap:4px}.poem-open>svg{width:13px;height:13px}.poem-open>svg:last-child{width:22px;height:22px;padding:5px}.library-footer{font-size:9px;letter-spacing:.2px}
 .lesson-bar{margin-bottom:11px}.lesson-title{gap:8px}.lesson-portrait{width:32px;height:32px;padding:2px}.lesson-title h1{font-size:22px;letter-spacing:.4px}.lesson-title p{font-size:10px}.lesson-menu>summary{box-shadow:0 2px 0 #e7eadc}.back-library{font-size:10px}
 .record-layout{border:0;background:transparent;box-shadow:none;border-radius:0;padding:0;gap:10px;justify-content:center}.record-landscape{padding:8px 8px 0;box-shadow:0 3px 0 #f3efdf,0 4px 0 #e0e3d1,0 9px 22px #31523907;border-radius:4px 12px 12px 4px;transform:rotate(-.4deg);margin:0 2px}.record-landscape:before{height:5px;top:-2px;width:31px;left:calc(50% - 15px)}.record-art{max-height:clamp(100px,calc(100dvh - 520px),215px)}.verse-list{gap:2px}.verse-list-item{font-size:11px}.verse-list-item.current{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--poem-color) 20%,transparent)}
 .record-practice{padding:0 8px;background:transparent}.record-tool{padding:2px 0 0}.record-counter>span{font-size:11px}.practice-motif{width:36px;height:36px}.record-tool>.verse{margin:6px 0 14px;min-height:65px}.record-tool>.verse ruby{font-size:31px;min-width:38px}.record-tool>.verse rt{font-size:13px;color:#638b67}.record-tool>.verse .punct{font-size:31px;width:16px}.record-model{margin-bottom:19px;gap:11px}.record-model .button{font-size:12px;padding:9px 15px;gap:7px}.mic-button{gap:13px;font-size:14px;min-height:106px}.mic-button svg{width:64px;height:64px;padding:19px}.record-result{font-size:32px}.record-result:before{width:29px;height:29px;margin-right:4px}.record-status{font-size:11px}.record-review{margin:6px 0}.record-review button{border-radius:7px}.record-actions{gap:7px;min-height:75px}.record-actions .button{font-size:12px;padding:8px 10px}.record-result+.record-status{margin-top:4px}
 .view-read #view{padding:2px}.reader-toolbar{margin-bottom:7px}.reader-toolbar h2{font-size:13px}.reading-experience{padding:0;background:transparent;border:0;box-shadow:none;border-radius:0;justify-content:space-evenly}.reading-scene{gap:12px}.poem-landscape{margin:0 2px;padding:8px 8px 0;border-radius:4px 12px 12px 4px;box-shadow:none}.poem-landscape:before{height:5px;top:-2px}.reading-scene .art-stage{max-height:clamp(100px,calc(100dvh - 510px),225px)}.poem-text{padding:0 6px}.reading-folio{font-size:10px;min-height:25px;align-items:center}.reading-folio>span:first-child:before{width:18px;height:18px;margin-right:5px}.reading-folio>span:last-child{font-variant-numeric:tabular-nums}.poem-lines{padding:4px 0}.poem-lines .verse ruby{font-size:29px;min-width:35px}.poem-lines .verse rt{font-size:12px;color:#658d69}.poem-lines .punct{font-size:29px}.page-turner .icon-button{background:#f0f4e6;border:1px solid #e4ead6}.page-turner .text-button{font-size:12px}.reader-controls{gap:8px;margin-top:9px}.reader-controls .button{font-size:12px;padding:9px 10px}.reader-controls .media-buttons{gap:8px}.audio-timeline{color:#849b80}
 .report-summary{padding:9px 9px 11px;gap:13px;border-radius:13px;grid-template-columns:60px minmax(0,1fr)}.score-ring{width:55px;height:55px;outline-offset:3px}.score-ring strong{font-size:25px}.score-ring span{font-size:8px}.report-summary .eyebrow{font-size:9px;margin-bottom:5px}.dimension-grid{gap:5px}.dimension{padding:5px 5px;border-radius:7px}.dimension strong{font-size:20px}.dimension span{font-size:9px;line-height:1.4;margin-top:3px}.report-tabs{margin:12px 0 10px}.report-tabs button{font-size:12px}.practice-card{padding:3px 9px 10px;border-radius:12px}.practice-card-heading{gap:1px}.practice-card-heading h3{font-size:15px}.practice-tip{font-size:12px;line-height:1.8}.practice-pager span{min-width:25px}.practice-pager .icon-button{width:38px}.contrast-heading{font-size:11px;margin-top:3px}.sound-word{min-height:85px}.sound-word ruby{font-size:27px}.sound-word rt{font-size:12px}.practice-actions{gap:5px;margin-top:12px}.practice-actions .button{font-size:11px;padding:8px 7px}.practice-actions svg{width:14px;height:14px}.practice-selector{padding-top:3px;padding-bottom:8px}.practice-pick{min-height:68px}.report-panels{padding-bottom:5px}.word-analysis .word-result{font-size:12px}
 .writing-layout{padding-inline:8px}.writing-board{outline-width:6px;border-radius:7px}.writing-controls{margin-top:17px}.writing-tools .icon-button{border-radius:9px}.writing-pinyin{font-size:25px}.writing-toolbar{margin-bottom:13px}.writing-toolbar [data-action=write-speak]{width:44px;height:44px}.writing-feedback{font-size:12px}.writing-tool>.text-button{color:#879976}.quiz-prompt{font-size:22px;line-height:1.7}.quiz-options{gap:14px}.quiz-option{min-height:64px;font-size:19px}.quiz-progress{margin-bottom:20px;height:5px}.quiz-top>span:first-child{font-size:11px}.quiz-explanation{font-size:13px;min-height:77px}.quiz-next .button{min-height:47px}
 .chat-tool{padding:0;background:transparent;border:0;box-shadow:none;border-radius:0}.chat-bubble{font-size:14px;line-height:1.85}.chat-message>img{width:34px;height:34px}.chat-suggestions button{font-size:11px}.chat-form{padding:8px;border-radius:17px}.chat-form button{background:#508d67;box-shadow:0 2px 0 #38704e}.poem-dialog{background:#fffdf2}.poem-dialog .dialog-heading{background:#fffdf2}
}
@media(max-width:370px){
 .library{padding-inline:14px}.library-heading h1{font-size:21px;letter-spacing:0}.library-flourish{width:46px;min-width:46px;margin-left:-11px}.library-flourish:before{inset:8px 0 5px}.paper-bird{width:57px;left:-6px;top:7px;height:40px}.library-heading .eyebrow{font-size:9px;letter-spacing:0}.library-sub{font-size:10px}.library-books{gap:13px 12px}.poem-card-title h2{font-size:18px;letter-spacing:0}.poem-emblem{width:27px;height:27px;right:0;top:5px}.poem-card-title{padding-right:24px}.poem-card-title h2 small{display:none}.poem-author{font-size:9px}.poem-open{font-size:10px;min-height:30px}.poem-open>svg:last-child{width:21px;height:21px}.poem-grade{font-size:9px}.lesson-portrait{display:none}.lesson-title h1{font-size:22px}.record-practice{padding:0 5px}.record-tool>.verse ruby{font-size:28px;min-width:34px}.record-tool>.verse .punct{font-size:28px;width:14px}.record-tool>.verse rt{font-size:12px}.record-actions .button{font-size:11px;padding-inline:9px}.record-model .button{font-size:12px;padding-inline:13px}.record-model{gap:9px}.practice-motif{width:32px;height:32px}.poem-lines .verse ruby{font-size:27px;min-width:33px}.poem-lines .verse rt{font-size:11px}.poem-lines .punct{font-size:27px;width:14px}.reader-controls .button{font-size:11px;padding:9px 8px}.report-summary{gap:10px;padding-inline:7px;grid-template-columns:54px minmax(0,1fr)}.score-ring{width:50px;height:50px}.score-ring strong{font-size:23px}.dimension{padding:5px 3px}.dimension strong{font-size:18px}.dimension span{font-size:8px}.practice-card-heading h3{font-size:14px}.practice-pager .icon-button{width:35px}.practice-pager span{font-size:9px;min-width:25px}.practice-actions .button{font-size:10px;padding-inline:6px}.practice-actions{gap:4px}.writing-controls>.button{font-size:11px;padding-inline:8px}.writing-tools .icon-button{width:36px}
}
@media(max-width:340px){.library-heading h1{font-size:19px}.library-flourish{width:40px;min-width:40px;margin-left:-8px}.library-sub{font-size:9px}.poem-card-title h2{font-size:17px}.poem-emblem{width:25px;height:25px}.poem-card-title{padding-right:21px}.library-books{gap:12px 10px}.record-tool>.verse ruby{font-size:26px;min-width:32px}.record-tool>.verse .punct{font-size:26px;width:14px}.practice-card-heading h3{font-size:13px}.practice-pager .icon-button{width:33px}.practice-actions svg{display:none}.lesson-title h1{font-size:21px}}
@media(max-height:740px) and (max-width:700px){.record-art{max-height:150px}.record-tool>.verse{margin:3px 0 11px;min-height:61px}.record-model{margin-bottom:17px}.record-layout{gap:8px}.record-counter{min-height:42px}.record-result{font-size:29px}.record-result:before{width:26px;height:26px}.record-review{margin:4px 0}.record-actions{min-height:69px}}
@media(max-height:620px){.record-layout{height:auto;min-height:100%;padding-block:10px}.reading-experience{height:auto;min-height:100%;padding-block:10px}.library-books{grid-auto-rows:190px}.writing-tool{max-width:280px}.quiz-layout{padding-block:15px}}
/* Small learning text stays clear against the warm paper surfaces. */
.record-tool>.verse rt,.poem-lines .verse rt{color:#54744f}
.poem-author,.library-sub,.library-heading .eyebrow,.lesson-title p{color:#647361}
.practice-tip,.record-counter>span,.record-status,.quiz-top,.quiz-explanation,.writing-feedback{color:#64705b}

/* Assessment presents one task at a time; optional tools live in the menu. */
.record-progress{display:flex;gap:6px;padding:13px 8px 10px;justify-content:center}
.record-progress i{height:3px;flex:1;max-width:48px;border-radius:5px;background:#ebece0}
.record-progress .done{background:#8da98b}.record-progress .current{background:var(--poem-color)}
.record-tool{min-height:352px}
.record-tool[data-step=read]>.verse{margin-top:26px}
.record-layout[data-record-busy=true] .record-model{visibility:hidden;pointer-events:none}
.record-feedback{display:flex;flex-direction:column;align-items:center;padding-top:10px}
.feedback-motif{width:72px;height:72px;margin:0 auto 14px}
.record-feedback .record-result{font-size:52px;line-height:1.2}
.record-feedback .record-result:before{display:none}
.record-feedback-title{font:500 20px/1.6 var(--serif);color:#46684e;margin:10px 0 16px}
.record-feedback .record-actions{width:100%;min-height:64px;gap:14px}
.record-word-heading{display:flex;align-items:center;justify-content:space-between;min-height:38px;color:#64705b;font-size:12px}
.record-word-heading .text-button{font-size:12px}
.record-tool .record-review{display:flex;justify-content:center;overflow:visible;padding:0;margin:12px 0 10px}
.record-tool .record-review .focus-word,.practice-card .practice-pick.focus-word{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;width:116px;min-width:116px;min-height:128px;padding:12px;background:#fff3dc;border:1px solid #e8d7b1;border-radius:22px;box-shadow:0 4px 0 #eee2c8;color:#71572c}
.record-review .focus-word ruby,.practice-card .focus-word ruby{font:500 54px/1.2 var(--serif);color:inherit}
.record-review .focus-word rt,.practice-card .focus-word rt{font:400 17px/1.6 var(--sans);color:inherit}
.record-review .focus-word svg,.practice-card .focus-word svg{width:19px;height:19px;color:inherit}
.record-word-hint{font-size:13px;line-height:1.7;color:#64705b}
.record-word-pager{display:flex;justify-content:center;gap:65px;margin-top:3px}
.record-tool[data-step=words] .record-actions{min-height:66px;gap:14px}
.view-record .menu-panel{max-height:calc(100dvh - 115px);overflow-y:auto;overscroll-behavior:contain}
.menu-group{padding-bottom:7px;margin-bottom:7px;border-bottom:1px solid #dce3d0}
.menu-group button{display:flex;align-items:center;gap:10px;text-align:left;width:100%;min-height:44px;padding:9px 11px;border:0;border-radius:8px;background:transparent;color:var(--ink);font-size:13px}
.menu-group button:hover:not(:disabled){background:#edf3e6}.menu-group svg{width:18px;height:18px}
.record-lines-dialog{width:min(460px,calc(100vw - 28px));max-height:85dvh;padding:20px;overflow:auto}
#record-lines{display:flex;flex-direction:column;gap:6px;margin-top:14px}
#record-lines .verse-list-item{display:flex;align-items:center;gap:14px;min-height:54px;border:1px solid #e0e5d5;border-radius:12px;padding:9px 12px;text-align:left;background:#fffdf7;color:#315e4b;font:400 20px/1.5 var(--serif)}
#record-lines .verse-list-item.current{background:#edf4e6;border-color:#92b19b}
#record-lines .line-number{font:500 12px var(--sans);color:#64705b;min-width:15px}
#record-lines svg{width:16px;height:16px;margin-left:auto;flex-shrink:0}
.view-report .report-tabs{margin-top:2px}
.view-report .report-panels{display:flex;flex-direction:column}
#panel-practice{flex:1;display:flex;flex-direction:column;justify-content:center}
#practice-section{width:100%;max-width:530px;margin:0 auto}
#focused-practice .practice-card{padding:20px 26px 24px;border:1px solid #e0e5d5;border-radius:24px;background:#fffdf7;box-shadow:0 4px 0 #edeee2}
.practice-card .practice-card-heading{margin:0 0 15px;min-height:44px}
.practice-card .practice-card-heading h3{font:500 17px var(--serif)}
.practice-card .practice-selector{display:flex;justify-content:center;padding:0 0 5px;margin:0;overflow:visible}
.practice-card .practice-pick.focus-word{background:#edf5e6;border-color:#c5daba;color:#315f45;box-shadow:0 4px 0 #e3ecd9}
.practice-card .practice-tip{font-size:14px;line-height:1.85;margin:22px 0;text-align:center;color:#52694e}
.practice-card .practice-actions{margin-top:20px;gap:12px}
.practice-card .practice-actions .button{flex:0 1 auto;min-height:46px;font-size:13px;padding:10px 16px}
.practice-card .practice-back{font-size:12px;margin:0 0 10px}
.practice-card .comparison-title{text-align:center;font:500 22px/1.7 var(--serif);margin:10px 0 23px;color:#315f45}
.practice-card .contrast-pair{margin:0 0 24px;gap:12px}
.practice-card .sound-word{min-height:133px;gap:9px}
.practice-card .sound-word ruby{font-size:39px}.practice-card .sound-word rt{font-size:15px}
.practice-card .sound-context{font-size:12px}
.report-next-activities{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;flex-shrink:0;margin-top:12px;padding-top:12px;border-top:1px solid #e0e5d5}
.report-next-activities a{display:flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:8px;border:1px solid #dce5cf;border-radius:13px;background:#f1f6e8;color:#426547;font-size:13px}
.report-next-activities a:nth-child(2){background:#fcf4e4;border-color:#e9ddbc;color:#80612e}
.report-next-activities a:nth-child(3){background:#edf4f5;border-color:#d7e5e7;color:#456c75}
.report-next-activities svg{width:20px;height:20px;flex-shrink:0}.report-next-activities a:hover{filter:brightness(.97)}
.word-analysis .word-grid{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:thin;padding:2px 1px 6px;scroll-snap-type:x proximity}
.word-analysis .word-result{display:grid;grid-template-columns:1fr 16px;align-items:center;gap:3px;width:62px;min-width:62px;min-height:83px;flex-shrink:0;padding:6px 7px;scroll-snap-align:start}
.word-analysis .word-result ruby{grid-column:1/-1;line-height:1.3}
.word-analysis .word-result strong{margin:0;text-align:left}.word-analysis .word-result>svg{margin:0}
.word-analysis .report-line>.button{margin-top:12px}
@media(max-width:700px){
 .record-tool{min-height:334px}.record-tool[data-step=read]>.verse{margin-top:10px}
 .record-feedback .record-result{font-size:46px}.feedback-motif{width:62px;height:62px;margin-bottom:12px}
 .record-feedback-title{font-size:20px;margin:9px 0 15px}
 .record-progress{padding:11px 6px 10px}.record-tool .record-counter{min-height:36px}
 .record-tool .record-review .focus-word{width:94px;min-width:94px;min-height:104px;padding:8px;border-radius:18px}
 .record-review .focus-word ruby{font-size:44px}.record-review .focus-word rt{font-size:15px}
 .record-tool .record-review{margin:5px 0 10px}.record-word-hint{font-size:12px}
 .record-word-pager{margin:0;gap:55px}.record-tool[data-step=words] .record-actions{min-height:59px}
 #focused-practice .practice-card{padding:18px 18px 22px}.practice-card .practice-card-heading{margin-bottom:16px}
 .practice-card .practice-pager .icon-button{width:44px;height:44px}.practice-card .practice-pager span{font-size:11px}
 .practice-card .practice-tip{font-size:14px;margin:21px 0}.practice-card .practice-actions .button{font-size:12px;padding:10px 12px}
 .practice-card .contrast-pair{gap:8px}.practice-card .sound-word{min-height:116px}.practice-card .sound-word ruby{font-size:33px}
 #record-lines .verse-list-item{font-size:18px;gap:9px}.record-lines-dialog{padding:16px}
 .report-next-activities{gap:7px;margin-top:10px;padding-top:10px}.report-next-activities a{gap:5px;font-size:11px;padding:6px;min-height:47px}.report-next-activities svg{width:17px;height:17px}
}
@media(max-height:660px) and (max-width:700px){
 .record-tool{min-height:306px}.record-art{max-height:110px}.record-feedback{padding-top:0}
 .feedback-motif{width:48px;height:48px}.record-tool[data-step=read]>.verse{margin-top:4px}
 .record-word-heading{min-height:32px}.record-tool .record-counter{min-height:30px}
 #focused-practice .practice-card{padding-block:10px}.practice-card .practice-tip{margin:12px 0}
 .practice-card .practice-card-heading{margin-bottom:10px}.practice-card .practice-actions{margin-top:12px}
 .practice-card .practice-pick.focus-word{min-height:109px;width:104px;min-width:104px}
}
.practice-pick rt{color:#7d6c44}.practice-pick.selected ruby,.practice-pick.selected rt{color:#426a42}
.sound-word ruby{color:#426640}.sound-word:nth-child(2) ruby{color:#406771}.sound-word:nth-child(3) ruby{color:#7b642e}.sound-context{color:#66745c}
.dimension span,.report-summary .eyebrow,.score-ring span,.chat-suggestions button,.writing-counter{color:#637052}
.writing-context p,.quiz-art p,.poet-profile p{color:#64745b}
/* The reading advice follows the student's grade; one quiet control is enough. */
.report-grade-label{display:flex;align-items:center;gap:8px;margin-top:5px;font-size:12px;color:#637052}
.report-grade-label select{min-height:44px;padding:7px 28px 7px 11px;border:1px solid #d4dfc8;border-radius:9px;background:#fbfcf3;color:#3e654e;font:inherit;font-size:14px}
.ai-report-header{flex-wrap:nowrap;align-items:center;gap:10px;margin-bottom:14px}
.ai-report-header>.button{flex-shrink:0}
.ai-advice[data-student-grade="1"] .report-prose,.ai-advice[data-student-grade="2"] .report-prose{font-size:18px;line-height:2}
.ai-advice[data-student-grade="3"] .report-prose,.ai-advice[data-student-grade="4"] .report-prose{font-size:16px;line-height:1.95}
.ai-advice[data-student-grade="5"] .report-prose,.ai-advice[data-student-grade="6"] .report-prose{font-size:15px;line-height:1.95}
.report-prose{overflow-wrap:anywhere}
/* A larger square keeps touch coordinates natural without stretching characters. */
.view-write .writing-layout{gap:32px;padding:0 4px;align-items:center}
.view-write .writing-tool{width:100%;min-width:0;max-width:min(520px,calc(100dvh - 250px))}
.view-write .writing-toolbar{min-height:44px;margin:0 0 8px}
.view-write .writing-toolbar>div{display:flex;align-items:center;gap:18px;min-width:0}
.view-write .writing-counter{margin:0;font-size:12px;white-space:nowrap}
.view-write .writing-board{outline:0;border:1px solid #c5d4b6;border-radius:13px;box-shadow:0 3px 0 #e2e9d4;background:#fffef9}
.view-write .writing-board:before,.view-write .writing-board:after{border-color:#dce4d1}
.view-write .writing-hint{font-size:clamp(145px,31dvh,260px)}
.view-write .writing-controls{margin-top:8px;gap:8px;flex-wrap:nowrap}
.view-write .writing-tools{gap:4px}
.view-write .writing-tools .icon-button{width:44px;height:44px}
.view-write .writing-controls>.button{width:auto;min-height:44px;font-size:13px;padding:9px 16px;white-space:nowrap}
.writing-status{display:flex;align-items:center;gap:10px;min-height:44px;margin-top:2px}
.view-write .writing-feedback{flex:1;min-width:0;min-height:0;margin:0;font-size:12px;line-height:1.65}
.writing-status>.text-button{flex-shrink:0;min-height:44px;font-size:12px;white-space:nowrap}
.writing-status>.text-button svg{width:15px;height:15px}
@media(max-width:960px){
 .view-write .writing-layout{display:flex;justify-content:center;height:100%;min-height:0;padding:0}
 .view-write .writing-tool{max-width:min(540px,calc(100dvh - 220px));margin:0 auto}
}
@media(max-width:700px){
 .workspace.view-write{padding-inline:8px;padding-bottom:max(8px,env(safe-area-inset-bottom))}
 .view-write .lesson-bar{margin-inline:8px}
 .view-write .view-section{padding:0 1px}
 .view-write .writing-layout{align-items:center}
 .view-write .writing-tool{max-width:100%;min-width:0}
 .view-write .writing-toolbar{margin-bottom:6px;padding-inline:5px}
 .view-write .writing-pinyin{font-size:28px}
 .view-write .writing-counter{font-size:12px}
 .view-write .writing-controls{gap:4px;margin-top:6px}
 .view-write .writing-tools{gap:3px}
 .view-write .writing-tools .icon-button{width:42px}
 .view-write .writing-controls>.button{padding-inline:12px}
 .view-write .writing-status{gap:6px;padding-inline:3px}
 .ai-report-header h2{font-size:18px}
 .ai-report-header>.button{font-size:12px;padding-inline:10px}
}
@media(max-height:600px) and (orientation:landscape) and (max-width:1100px){
 .workspace.view-write{padding:0 12px 8px}
 .view-write .lesson-bar{min-height:56px;margin-bottom:4px;padding:4px 0}
 .view-write .lesson-title h1{font-size:21px}
 .view-write .lesson-portrait{width:38px;height:38px}
 .view-write .writing-context{display:none}
 .view-write .view-section{padding:0}
 .view-write .writing-layout{display:flex;height:100%;min-height:0;padding:0;align-items:center}
 .view-write .writing-tool{display:grid;grid-template-columns:minmax(0,calc(100dvh - 88px)) minmax(176px,220px);grid-template-rows:auto 1fr auto;gap:8px 20px;max-width:none;width:max-content;margin:0 auto}
 .view-write .writing-board{grid-column:1;grid-row:1/4;align-self:center}
 .view-write .writing-toolbar{grid-column:2;margin:0;gap:5px}
 .view-write .writing-toolbar>div{gap:9px}
 .view-write .writing-controls{grid-column:2;align-self:center;flex-direction:column;align-items:stretch;gap:10px;margin:0}
 .view-write .writing-tools{justify-content:space-between;gap:2px}
 .view-write .writing-controls>.button{width:100%}
 .view-write .writing-status{grid-column:2;gap:4px;min-height:44px;margin:0;flex-wrap:wrap}
 .view-write .writing-feedback{flex-basis:100%;font-size:11px}
 .view-write .writing-status>.text-button{min-height:32px;font-size:11px}
}
.verse.verse-compound{display:flex;flex-direction:column;align-items:center;gap:9px}
.verse-compound .verse-clause{display:flex;align-items:flex-end;justify-content:center;white-space:nowrap}
.record-tool>.verse.verse-compound{margin-top:10px;margin-bottom:12px}
@media(max-height:650px){.verse.verse-compound{gap:5px}.record-tool>.verse.verse-compound{margin-top:0;margin-bottom:8px}.record-tool>.verse.verse-compound ruby{font-size:25px;min-width:30px;line-height:1.5}.record-tool>.verse.verse-compound rt{font-size:11px}.record-tool:has(.verse-compound) .record-model{margin-bottom:8px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* 多元小遊戲：每一關只保留一個清楚任務，方便小學生專心完成。 */
.quiz-shell{display:flex;flex-direction:column;gap:18px;min-height:100%;padding-bottom:18px}
.quiz-mode-nav{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;padding:10px;border:1px solid #e5e5d5;border-radius:18px;background:linear-gradient(135deg,#fffdf4,#f6f8ec);box-shadow:0 8px 24px #57664b10}
.quiz-mode-tab{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;align-items:center;column-gap:7px;row-gap:1px;min-width:0;padding:9px 10px;border:1px solid transparent;border-radius:12px;background:transparent;color:#61705d;text-align:left;cursor:pointer;transition:background .18s,transform .18s,border-color .18s}
.quiz-mode-tab svg{grid-row:1 / span 2;width:18px;height:18px;color:#83a26f}.quiz-mode-tab span{font-size:13px;font-weight:700;white-space:nowrap}.quiz-mode-tab small{overflow:hidden;color:#9a9d89;font-size:10px;line-height:1.3;text-overflow:ellipsis;white-space:nowrap}.quiz-mode-tab:hover{background:#fffef7;transform:translateY(-1px)}.quiz-mode-tab.selected{border-color:#b7cda7;background:#edf6e6;color:#426848;box-shadow:0 3px 0 #d7e7c9}.quiz-mode-tab.selected svg{color:#5e9263}
.quiz-listen-button{display:inline-flex;align-items:center;gap:7px;min-height:39px;margin:-7px 0 17px;padding:8px 14px;border:1px solid #c8d9b9;border-radius:999px;background:#f2f8e9;color:#4d7b50;font-size:14px;cursor:pointer}.quiz-listen-button svg{width:16px;height:16px}.quiz-listen-button:hover{background:#e7f2dd}
.quiz-game-layout{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(340px,.95fr);align-items:start;gap:50px}.quiz-game-art .art-stage{margin-bottom:20px}.game-badge{display:inline-flex;align-items:center;gap:6px;margin-bottom:9px;padding:5px 10px;border-radius:999px;background:#fff3cc;color:#9b7a32;font-size:12px}.game-badge svg{width:15px;height:15px}.quiz-game-card{padding:22px 24px;border:1px solid #e2e5d4;border-radius:18px;background:#fffef8;box-shadow:0 11px 28px #56614c10}.quiz-game-card .quiz-prompt{margin-bottom:18px}.quiz-game-card .quiz-explanation{min-height:58px}.quiz-game-card .quiz-next{margin-top:3px}
@media(max-width:820px){.quiz-mode-nav{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding:8px}.quiz-mode-tab{padding:8px 7px}.quiz-mode-tab small{display:none}.quiz-mode-tab span{font-size:12px}.quiz-game-layout{grid-template-columns:1fr;gap:14px}.quiz-game-art{display:none}.quiz-game-card{padding:19px 16px}}
@media(max-width:460px){.quiz-mode-nav{grid-template-columns:repeat(2,minmax(0,1fr))}.quiz-mode-tab{grid-template-columns:auto 1fr}.quiz-game-card .quiz-option{min-height:56px}}

/* exploration.css */
/* The scene and one observation share a single activity screen. */
.view-explore #view{overflow:auto}
.explore{--explore-ink:#31584e;--explore-accent:var(--poem-color,#397f69);height:100%;min-height:0;display:flex;flex-direction:column;gap:16px;color:var(--explore-ink)}
.explore [hidden]{display:none!important}
.explore button,.explore a{-webkit-tap-highlight-color:transparent}
.explore button{font:inherit;cursor:pointer}
.explore button:disabled{cursor:default}
.explore button:focus-visible,.explore a:focus-visible,.explore canvas:focus-visible{outline:3px solid #a7782f;outline-offset:3px}
.explore svg{width:19px;height:19px;flex-shrink:0}
.explore-heading{display:flex;justify-content:space-between;align-items:center;flex:none;padding:0 5px}
.explore-eyebrow{font-size:11px;letter-spacing:1.4px;color:#7a8974;margin:0 0 4px}
.explore-heading h2{font:600 clamp(25px,2.4vw,34px)/1.25 var(--serif,serif);letter-spacing:1.5px;margin:0}
.explore-motif{width:54px;height:54px;transform:rotate(5deg)}
.explore-layout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,.9fr);align-items:stretch;gap:34px;flex:1;min-height:0;padding:0 3px 3px}
.explore-visual{display:flex;flex-direction:column;min-height:0;min-width:0}
.explore-stage{position:relative;isolation:isolate;flex:1;min-height:200px;overflow:hidden;border-radius:20px 20px 8px 8px;background:#efeede;border:1px solid #dfdfca;box-shadow:0 3px 0 #f7f3e6,0 4px 0 #dedfce}
.explore-scene{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;object-position:center;transition:filter .35s,opacity .35s;z-index:-1}
.explore-stage:after{content:'';position:absolute;inset:0;pointer-events:none;border-radius:inherit;box-shadow:inset 0 0 28px #7d775514}
.explore-scene-name{position:absolute;bottom:12px;left:14px;max-width:calc(100% - 28px);padding:6px 11px;border-radius:7px;background:#fffdf2e8;color:#456453;font:500 12px/1.5 var(--sans,sans-serif);letter-spacing:.5px;box-shadow:0 2px 9px #314a3910;pointer-events:none;z-index:2}
.explore-canvas{position:absolute;inset:0;z-index:1}
.explore-canvas canvas{display:block;width:100%;height:100%;touch-action:none;cursor:grab}
.explore-canvas canvas:active{cursor:grabbing}
.is-model .explore-scene{opacity:0}
.is-model .explore-stage{background:radial-gradient(ellipse at 50% 38%,#fffef9 0%,#f0f2e8 57%,#e4ebe0 100%)}
.is-model .explore-stage:after{box-shadow:inset 0 0 48px #7d917110}
.explore-view-label{position:absolute;right:14px;top:14px;z-index:2;padding:6px 10px;border:1px solid #d7e1d2;border-radius:20px;background:#fffef9dc;font-size:11px;letter-spacing:.5px;color:#537061;pointer-events:none}
.explore-expand{position:absolute;top:12px;left:12px;z-index:3;display:flex;align-items:center;gap:6px;min-height:35px;padding:6px 10px;border:1px solid #d7e1d2;border-radius:20px;background:#fffef8ed;color:#537061;font-size:11px!important;box-shadow:0 2px 7px #45634309}
.explore-expand svg{width:15px;height:15px}
.explore.is-expanded .explore-heading,.explore.is-expanded .explore-card{display:none}
.explore.is-expanded .explore-layout{display:flex;min-height:0;flex:1}
.explore.is-expanded .explore-visual{width:100%;height:100%;min-height:0}
.explore.is-expanded .explore-stage{min-height:0;flex:1}
.explore.is-expanded .explore-model-tools{position:static;padding:0;background:none;margin-top:8px}
.explore.is-expanded .explore-expand{background:#fffdf4;color:#365e47;border-color:#a8b99e}
.explore.is-expanded .explore-expand svg{transform:rotate(180deg)}
.explore-image-fallback{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:8px;padding:15px;background:linear-gradient(145deg,#f7f4e8,#e4ecd9)}
.explore-image-fallback p{font-size:12px;margin:0}
.explore-image-fallback button{border:1px solid #bbccb4;border-radius:20px;min-height:40px;padding:4px 14px;background:#fffdf5;color:#42654b}
.explore-view-controls{display:flex;align-items:center;justify-content:space-between;gap:9px;margin-top:13px;flex:none}
.explore-mode{display:inline-flex;border:1px solid #d9e1cf;background:#f1f3e8;border-radius:99px;padding:4px;flex:none}
.explore-mode button{min-height:39px;display:flex;align-items:center;gap:6px;padding:6px 13px;border:0;border-radius:99px;background:transparent;color:#6b7d67;font-size:12px;white-space:nowrap}
.explore-mode button[aria-pressed=true]{background:#fffef6;color:#356149;box-shadow:0 1px 4px #254a3720}
.explore-mode button[aria-busy=true]{color:#6a715f}
.explore-gesture{font-size:10px;line-height:1.5;color:#778875;max-width:150px;margin:0;text-align:right}
.explore-model-tools{display:flex;align-items:center;justify-content:space-between;gap:8px;flex:none;margin-top:8px;min-height:39px}
.explore-presets{display:flex;gap:6px}
.explore-presets button{border:1px solid #dce3d1;border-radius:9px;min-height:38px;background:#fffdf4;color:#496752;padding:6px 13px;font-size:12px}
.explore-presets button[aria-pressed=true]{background:#e5efdf;border-color:#8eac82;color:#355d47;box-shadow:inset 0 0 0 1px #8eac8230}
.explore-zoom{display:flex;gap:6px;margin-left:auto}
.explore-zoom button{width:39px;min-height:39px;display:grid;place-items:center;border:1px solid #dce3d1;border-radius:50%;background:#fffdf4;color:#496752}
.explore-notice{font-size:11px;line-height:1.5;color:#805f36;margin:7px 2px 0;flex:none}
.explore-loading{position:absolute;inset:auto 12px 48px;display:flex;align-items:center;justify-content:center;gap:8px;min-height:43px;padding:9px;background:#fffef4ed;color:#61765d;border:1px solid #dbe2cd;border-radius:11px;font-size:12px;z-index:3;box-shadow:0 4px 14px #51654a10}
.explore-spinner{width:15px;height:15px;flex:none;border-radius:50%;border:2px solid #d9e3cf;border-top-color:#668e6c;animation:explore-spin .85s linear infinite}
@keyframes explore-spin{to{transform:rotate(360deg)}}
.explore-card{display:flex;flex-direction:column;align-self:center;min-width:0;max-height:100%;padding:21px 22px 19px;border:1px solid #e0e2d0;border-radius:7px 22px 22px 7px;background:#fffdf4;box-shadow:4px 5px 0 #edeedc;overflow:auto;scrollbar-width:thin}
.explore-card-top{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:17px}
.explore-step{display:inline-flex;align-items:center;gap:5px;font-size:11px;letter-spacing:.5px;color:#728369}
.explore-step svg{width:15px;height:15px}
.explore-dots{display:flex;gap:5px}.explore-dots i{width:6px;height:6px;background:#e6e8d7;border-radius:50%}.explore-dots .is-filled{background:#839d71}
.explore-card h3{font:600 clamp(17px,1.6vw,22px)/1.5 var(--sans,sans-serif);color:#3c6151;margin:0 0 14px;outline:none}
.explore-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;margin-bottom:12px}
.explore-title-row h3{margin:0}
.explore-clue{display:flex;align-items:center;gap:4px;min-height:34px;flex:none;border:0;border-radius:20px;padding:5px 9px;color:#9b674c;background:#f7eee2;font-size:11px!important;white-space:nowrap}
.explore-clue svg{width:14px;height:14px}
.explore-verse{display:flex;align-items:center;justify-content:space-between;gap:7px;min-height:64px;padding:8px 0;margin-bottom:13px;border-block:1px solid #e8e8d8}
.explore-verse>p{font:500 clamp(18px,1.6vw,23px)/1.5 var(--serif,serif);letter-spacing:1.2px;margin:0;color:#65805d}
.explore-word{display:flex;align-items:center;gap:6px;flex:none;min-width:56px;min-height:49px;padding:4px 8px;border-radius:9px;background:#edf3e6;border:1px solid #dce6d1;color:#4e7958}
.explore-word>span{display:flex;flex-direction:column;align-items:center;font:500 22px/1.2 var(--serif,serif)}
.explore-word small{font:400 10px/1.3 var(--sans,sans-serif)}
.explore-word svg{width:15px;height:15px}
.explore-word.playing{background:#dcecd2}
.explore-question{border:0;padding:0;margin:0;min-width:0}
.explore-question legend{font-size:14px;font-weight:500;line-height:1.6;margin-bottom:10px;padding:0}
.explore-answers{display:flex;flex-direction:column;gap:9px}
.explore-answers button{display:flex;align-items:center;gap:9px;min-height:44px;padding:9px 11px;width:100%;border:1px solid #dde3d0;background:#fcfdf5;border-radius:10px;text-align:left;font-size:13px;color:#526d54;line-height:1.5;transition:background .15s,border-color .15s}
.explore-answer-dot{display:grid;place-items:center;width:18px;height:18px;flex:none;border:1px solid #becdb2;border-radius:50%;background:#fffdf5}
.explore-answer-dot svg{width:13px;height:13px}
.explore-answers button.is-correct{background:#edf5e3;border-color:#86ad74;color:#3e733f}
.explore-answers button.is-correct .explore-answer-dot{background:#6c965e;color:#fff;border-color:#6c965e}
.explore-answers button.is-wrong{background:#fff2e7;border-color:#dcae8b;color:#976b48}
.explore-answers button:disabled:not(.is-correct){opacity:.65}
.explore-guide{display:flex;align-items:center;gap:9px;min-height:84px;margin:9px 0 12px;padding:8px 10px 7px 3px;border-radius:12px;background:linear-gradient(110deg,#f7eee700,#f7eee780)}
.explore-guide>img{width:50px;height:66px;object-fit:contain;flex:none;filter:drop-shadow(0 3px 3px #ae877619)}
.explore-guide>div{min-width:0}
.explore-guide-name{font-size:10px;letter-spacing:.7px;color:#a87861}
.explore-feedback{min-height:34px;margin:3px 0 0;font-size:12px;line-height:1.7;color:#74816b}
.explore-feedback.is-correct{color:#547b4d}
.explore-next{display:flex;align-items:center;justify-content:center;gap:10px;min-height:44px;padding:9px 13px;width:100%;border:1px solid #477858;border-radius:10px;background:#477858;color:#fffdf4;font:500 13px/1.5 var(--sans,sans-serif);text-decoration:none;box-shadow:0 3px 0 #365c43;margin-top:auto}
.explore-next:disabled{color:#96a18a;background:#edf0e3;border-color:#e1e5d5;box-shadow:none}
.explore-finish{text-align:center;margin:7px 0 21px}
.explore-finish>img{display:block;margin:0 auto 17px;transform:rotate(-6deg)}
.explore-finish>.explore-finish-shishi{width:90px;height:100px;object-fit:contain;transform:none}
.explore-finish h3{margin-bottom:12px}
.explore-finish p{font-size:14px;line-height:1.9;color:#738369;margin:0}
.explore-finish-actions{display:flex;flex-direction:column;gap:9px}
.explore-again{border:0;color:#75856a;background:transparent;min-height:40px;font-size:12px}
@media(hover:hover){.explore-answers button:not(:disabled):hover,.explore-presets button:hover,.explore-zoom button:hover{background:#f0f6e7;border-color:#9caf88}.explore-mode button:hover{color:#315c45}}
@media(max-width:1000px){.explore-layout{gap:20px;grid-template-columns:minmax(0,1.15fr) minmax(270px,.9fr)}.explore-card{padding:17px}.explore-gesture{display:none}.explore-view-controls{justify-content:center}.explore-card h3{font-size:19px}.explore-verse>p{font-size:19px;letter-spacing:.6px}.explore-verse{gap:4px}.explore-word{padding-inline:6px}}
@media(max-width:700px){
  .explore{gap:10px}.explore-heading{padding-inline:2px}.explore-heading h2{font-size:25px}.explore-eyebrow{font-size:9px;margin-bottom:3px;letter-spacing:1px}.explore-motif{width:42px;height:42px}
  .explore-layout{display:flex;flex-direction:column;gap:11px;padding:0 1px 3px}.explore-visual{flex:1;min-height:165px}.explore-stage{min-height:110px;border-radius:15px 15px 6px 6px}.explore-scene-name{font-size:10px;left:10px;bottom:8px;padding:4px 8px}
  .explore-view-controls{margin-top:8px;justify-content:space-between}.explore-mode{padding:3px}.explore-mode button{min-height:35px;padding:5px 12px;font-size:11px}.explore-mode svg{width:16px;height:16px}.explore-gesture{display:block;font-size:9px;max-width:114px}.explore-model-tools{margin-top:5px;min-height:35px}.explore-presets button{min-height:35px;padding:4px 11px;font-size:11px}.explore-zoom button{width:35px;min-height:35px}.explore-notice{font-size:10px;margin-top:4px}
  .explore-card{align-self:stretch;flex:none;max-height:none;padding:13px 15px 12px;border-radius:5px 16px 16px 5px;box-shadow:2px 3px 0 #edeedc;overflow:visible}.explore-card-top{margin-bottom:6px}.explore-step{font-size:10px}.explore-card h3{font-size:17px;line-height:1.4;margin-bottom:7px}
  .explore-title-row{margin-bottom:6px;align-items:center}.explore-title-row h3{margin:0}.explore-clue{font-size:10px!important;padding:5px 7px;min-height:32px}.explore-clue svg{width:12px;height:12px}.explore-guide{min-height:59px;margin:6px 0;gap:7px;padding:2px 5px 2px 0}.explore-guide>img{width:37px;height:53px}.explore-guide-name{font-size:9px}.explore-guide .explore-feedback{margin:2px 0 0;min-height:30px;font-size:11px;line-height:1.45}.explore-view-label{top:9px;right:9px;font-size:10px;padding:4px 9px}.explore-finish>.explore-finish-shishi{height:70px;width:62px;margin-bottom:7px}
  .explore-verse{min-height:50px;margin-bottom:7px;padding:4px 0}.explore-verse>p{font-size:20px;letter-spacing:1px}.explore-word{min-height:43px;padding:2px 8px}.explore-word>span{font-size:19px}.explore-word small{font-size:9px}.explore-question legend{font-size:12px;line-height:1.4;margin-bottom:7px}.explore-answers{gap:6px}.explore-answers button{font-size:12px;min-height:40px;padding:7px 9px}.explore-answer-dot{width:16px;height:16px}.explore-feedback{font-size:11px;line-height:1.5;min-height:34px;margin:7px 0}.explore-next{min-height:40px;padding:7px 10px;font-size:12px}.explore-next svg{width:16px;height:16px}
  .explore-finish{margin:3px 0 12px}.explore-finish>img{width:49px;height:49px;margin-bottom:8px}.explore-finish p{font-size:12px;line-height:1.7}.explore-finish-actions{gap:4px}.explore-again{min-height:33px;font-size:11px}
}
@media(max-width:370px){.explore-gesture{display:none}.explore-view-controls{justify-content:center}.explore-card{padding-inline:11px}.explore-verse>p{font-size:18px;letter-spacing:.5px}.explore-word{min-width:51px;padding-inline:5px}.explore-card h3{font-size:16px}.explore-question legend{font-size:11px}.explore-answers button{font-size:11px}.explore-feedback{font-size:10px;min-height:31px}}
@media(max-width:700px) and (max-height:700px){
  .explore-guide{min-height:49px;margin-block:4px}.explore-guide>img{height:45px;width:33px}.explore-guide .explore-feedback{font-size:10px;min-height:27px}.explore-guide-name{font-size:8px}.explore-title-row{margin-bottom:4px}.explore-clue{min-height:28px}
  .explore{gap:6px}.explore-heading h2{font-size:21px}.explore-eyebrow{display:none}.explore-motif{width:29px;height:29px}.explore-layout{gap:7px}.explore-visual{min-height:135px}.explore-stage{min-height:88px}.explore-view-controls{margin-top:5px}.explore-mode button{min-height:32px;font-size:10px;padding:4px 10px}.explore-mode{padding:2px}.explore-model-tools{margin-top:4px}.explore-card{padding-block:9px}.explore-card h3{font-size:15px;margin-bottom:5px}.explore-card-top{margin-bottom:4px}.explore-verse{min-height:43px;margin-bottom:5px;padding-block:2px}.explore-word{min-height:38px}.explore-word>span{font-size:18px}.explore-verse>p{font-size:18px}.explore-question legend{margin-bottom:5px}.explore-answers{gap:5px}.explore-answers button{min-height:36px;padding-block:6px}.explore-feedback{min-height:29px;line-height:1.45;margin:5px 0}.explore-next{min-height:37px;padding-block:6px}
}
@media(max-width:700px) and (max-height:580px){.explore-heading{display:none}.explore-layout{gap:6px}.explore-card{padding-block:8px}.explore-feedback{font-size:10px}.explore-card h3{font-size:14px}.explore-visual{min-height:125px}.explore-scene-name{font-size:9px;padding:3px 7px}.explore-model-tools{position:absolute;z-index:3;right:8px;top:8px;margin:0;padding:3px;border-radius:9px;background:#fffdf4e6}.explore-visual{position:relative}.explore-model-tools button{min-height:30px}.explore-zoom button{width:30px}.explore-presets button{padding:3px 7px;font-size:10px}.explore-zoom{gap:3px}.explore-presets{gap:3px}}
@media(max-width:700px) and (max-height:700px){.explore:not(.is-expanded) .explore-expand{top:8px;left:8px;width:32px;min-height:32px;justify-content:center;padding:5px}.explore:not(.is-expanded) .explore-expand span{display:none}}
@media(max-height:600px) and (min-width:701px){.explore-heading{display:none}.explore-layout{gap:22px}.explore-card{padding:13px}.explore-card-top{margin-bottom:6px}.explore-card h3{font-size:17px;margin-bottom:7px}.explore-verse{min-height:48px;margin-bottom:7px;padding-block:4px}.explore-feedback{min-height:35px;font-size:11px;margin:7px 0}.explore-question legend{font-size:12px}.explore-answers button{min-height:39px;font-size:12px;padding-block:6px}.explore-next{min-height:39px}.explore-stage{min-height:160px}}
@media(prefers-reduced-motion:reduce){.explore *{animation:none!important;transition:none!important}}

/* exploration-loading.css */
/* A quiet placeholder for the illustration's initial network load. */
.explore-image-loading{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:48px 18px;text-align:center;pointer-events:none;background:linear-gradient(145deg,#f7f4e8,#e4ecd9);color:#647b61}
.explore-image-loading img{width:80px;height:80px;object-fit:contain;opacity:.8}
.explore-image-loading p{margin:0;font-size:12px;line-height:1.5;letter-spacing:.7px}

/* shishi.css */
.shishi-guide{position:fixed;left:max(12px,env(safe-area-inset-left));bottom:calc(10px + env(safe-area-inset-bottom));z-index:35;width:74px;color:#355348;font:15px/1.7 var(--sans,'Microsoft JhengHei',sans-serif);pointer-events:none}
.shishi-guide[hidden],.shishi-guide [hidden]{display:none!important}
.shishi-guide-button{display:flex;flex-direction:column;align-items:center;justify-content:center;width:74px;height:91px;margin:0;padding:0;border:0;border-radius:22px;background:transparent;color:#476553;pointer-events:auto;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.shishi-guide-art{position:relative;display:block;flex:none;width:72px;height:72px;pointer-events:none}
.shishi-guide-art>img,.shishi-guide-canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.shishi-guide-art>img{opacity:1;transition:opacity .14s ease}.shishi-guide-canvas{opacity:0;transition:opacity .18s ease;pointer-events:none}.shishi-guide-canvas canvas{display:block;width:100%;height:100%}
.shishi-guide:not([data-model=ready]) .shishi-guide-art{animation:none;transform-origin:50% 65%}
.shishi-guide-art>img.shishi-gesture{transition:none;object-fit:contain}
.shishi-guide[data-model=ready] .shishi-guide-canvas{opacity:1}.shishi-guide[data-model=ready] .shishi-guide-art>img,.shishi-guide[data-model=ready] .shishi-guide-fallback{opacity:0}
.shishi-guide-fallback{position:absolute;inset:12px;display:grid;place-items:center;border:1px solid #c1d2b8;border-radius:48% 46% 42% 48%;background:#f0f5e8;font:25px/1 var(--serif,serif)}
.shishi-guide-label{display:block;box-sizing:border-box;min-height:19px;margin-top:-1px;padding:0 7px;border:1px solid #cbd9c4;border-radius:9px;background:#fffef9;color:#536b54;font-size:11px;line-height:18px;white-space:nowrap;box-shadow:0 1px 2px #34452e08}
.shishi-guide-button:hover .shishi-guide-label{background:#f0f6e9;border-color:#9bb492}.shishi-guide-button:focus-visible,.shishi-guide button:focus-visible{outline:3px solid #618b68;outline-offset:3px}.shishi-guide-button:disabled{opacity:.58;cursor:default}
.shishi-bubble{position:absolute;left:2px;bottom:calc(100% + 12px);width:min(286px,calc(100vw - 30px));box-sizing:border-box;padding:15px 16px 12px;border:1px solid #cbd9c0;border-radius:18px 18px 18px 7px;background:#fffef8;box-shadow:0 7px 28px #294d3716;pointer-events:auto;animation:shishi-bubble-in .16s ease-out}
.shishi-bubble:after{content:'';position:absolute;left:26px;bottom:-6px;width:10px;height:10px;background:#fffef8;border-right:1px solid #cbd9c0;border-bottom:1px solid #cbd9c0;transform:rotate(45deg)}
.shishi-bubble-heading{display:flex;align-items:flex-start;gap:8px}.shishi-bubble h2{flex:1;margin:0;padding-top:9px;font:600 17px/1.4 var(--sans,'Microsoft JhengHei',sans-serif);color:#315840;text-wrap:balance}
.shishi-dismiss{display:grid;place-items:center;flex:none;width:44px;height:44px;margin:-4px -9px 0 0;padding:12px;border:0;border-radius:50%;background:transparent;color:#6d7e68;cursor:pointer}.shishi-dismiss:hover{background:#edf3e7}.shishi-dismiss svg{display:block;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round}
.shishi-hint-text{margin:5px 0 10px;color:#566b52;font-size:15px;line-height:1.8;text-wrap:pretty}.shishi-understood{display:block;min-height:44px;margin:0 0 0 auto;padding:8px 17px;border:1px solid #cbd9c0;border-radius:11px;background:#eef4e7;color:#386344;font:600 14px/1.5 var(--sans,sans-serif);cursor:pointer;touch-action:manipulation}.shishi-understood:hover{background:#e2ecd9}
@keyframes shishi-bubble-in{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:700px){.shishi-guide{left:max(8px,env(safe-area-inset-left));bottom:calc(6px + env(safe-area-inset-bottom));width:62px}.shishi-guide-button{width:62px;height:69px}.shishi-guide-art{width:52px;height:52px}.shishi-guide-label{font-size:10px;line-height:16px;min-height:17px;padding:0 6px}.shishi-bubble{left:0;width:min(280px,calc(100vw - 24px));padding:12px 14px 10px}.shishi-bubble h2{font-size:16px}.shishi-hint-text{font-size:14px}}
@media(max-height:450px){.shishi-guide{bottom:6px}.shishi-guide-button{height:65px}.shishi-guide-art{width:48px;height:48px}.shishi-bubble{bottom:calc(100% + 8px);padding:9px 12px;max-height:calc(100dvh - 95px);overflow:auto}.shishi-hint-text{margin:0 0 6px;line-height:1.6}.shishi-bubble h2{font-size:15px}.shishi-bubble:after{display:none}}
@media(prefers-reduced-motion:reduce){.shishi-bubble,.shishi-guide:not([data-model=ready]) .shishi-guide-art{animation:none}.shishi-guide-art>img,.shishi-guide-canvas{transition:none}}

/* A free-standing companion. Its body is the handle; there is no label or tile. */
.shishi-guide{width:132px;left:12px;bottom:8px;font-size:18px}
.shishi-guide-button{width:132px;height:168px;border-radius:50%;touch-action:none;cursor:grab;user-select:none}
.shishi-guide-art{width:176px;height:176px}
.shishi-guide[data-dragging] .shishi-guide-button{cursor:grabbing}
.shishi-bubble{position:fixed;bottom:auto;width:min(340px,calc(100vw - 20px));max-height:calc(100dvh - 20px);overflow:auto}
.shishi-bubble:after{display:none}
.shishi-bubble h2{font-size:22px}.shishi-hint-text{font-size:18px;line-height:1.75}.shishi-understood{font-size:18px;min-height:48px}
@media(max-width:700px){.shishi-guide{width:90px;left:10px;bottom:6px}.shishi-guide-button{width:90px;height:120px}.shishi-guide-art{width:128px;height:128px}.shishi-bubble h2{font-size:20px}.shishi-hint-text{font-size:18px}}
@media(max-height:450px){.shishi-guide-button{height:100px}.shishi-guide-art{width:112px;height:112px}}

/* library-shishi.css */
/* Independent full-body welcome, aligned with the library title. */
.library-heading.library-with-shishi{display:block;position:relative;padding-bottom:0;z-index:3}
.library-with-shishi>div{min-width:0}
.library-heading.library-with-shishi h1{display:block;white-space:nowrap;text-wrap:nowrap;line-height:1.3}
.library-title-start{white-space:nowrap}
/* Export the text baseline, not the centre of the taller mascot, to the title. */
.library-title-end{display:inline-flex;align-items:center;vertical-align:baseline;white-space:nowrap;gap:6px}
.library-heading .library-shishi{position:relative;display:inline-block;flex:0 0 76px;width:76px;height:112px;padding:0;border:0;background:none;box-shadow:none;cursor:pointer;touch-action:manipulation;border-radius:18px;vertical-align:middle}
.library-shishi:focus-visible{outline:3px solid #277e76;outline-offset:3px}
.library-shishi-art{position:relative;display:block;width:100%;height:100%;pointer-events:none}
.library-shishi-art img{position:absolute;inset:0;display:block;width:100%;height:100%;max-width:none;object-fit:contain}
.library-guide-bubble{position:absolute;box-sizing:border-box;width:min(360px,100%);padding:17px 46px 17px 20px;border:1px solid #c4d9c6;border-radius:20px;background:#fffdf6;color:#294f44;box-shadow:0 4px 16px #193d3312;z-index:2}
.library-guide-bubble[hidden]{display:none}
.library-guide-bubble::before{content:"";position:absolute;left:var(--guide-tail);top:-7px;width:12px;height:12px;background:#fffdf6;border-top:1px solid #c4d9c6;border-left:1px solid #c4d9c6;transform:translateX(-50%) rotate(45deg)}
.library-guide-bubble[data-placement=beside]::before{left:-7px;top:var(--guide-tail);transform:translateY(-50%) rotate(-45deg)}
.library-guide-bubble p{font:400 clamp(17px,2vw,20px)/1.5 var(--sans);margin:0;white-space:nowrap;text-wrap:nowrap}
.library-guide-bubble .library-guide-close{position:absolute;right:2px;top:2px;display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:transparent;color:#476457;font:400 28px/1 var(--sans);cursor:pointer;touch-action:manipulation}
.library-guide-bubble button:focus-visible{outline:3px solid #277e76;outline-offset:1px}
.account-dialog .teacher-reset-open{margin-top:12px;width:100%;white-space:normal}
.teacher-reset-dialog{width:min(440px,calc(100vw - 32px));padding:24px;border:0;border-radius:24px;color:#243c37;box-sizing:border-box}
.teacher-reset-dialog::backdrop{background:rgb(18 35 31 / .38)}
.teacher-reset-dialog h2{font-size:24px;line-height:1.4;margin:0 0 14px}
.teacher-reset-dialog p{font-size:18px;line-height:1.65;margin:0 0 20px}
.teacher-reset-actions{display:flex;gap:12px;flex-wrap:wrap}
.teacher-reset-actions .button{flex:1;min-width:128px;justify-content:center}
.teacher-reset-dialog [role=alert]{margin-top:14px;font-size:16px;color:#a43630}
@media(max-width:480px){.library-heading.library-with-shishi h1{font-size:clamp(25px,7.4vw,32px)}.library-heading .library-shishi{flex-basis:60px;width:60px;height:90px}.library-title-end{gap:4px}.teacher-reset-dialog{padding:22px}.library-guide-bubble{padding-left:16px}}

/* refresh.css */
/* Keep the catalogue focused on its six poems; illustrations support activities. */
.header-right{margin-left:auto}
.library-heading{min-height:0;margin-bottom:18px;padding-right:0}
.library-heading h1{font-size:clamp(28px,3vw,42px)}
.library-heading .library-sub{color:#557564}
.library-footer .shishi-home{display:flex;align-items:center;gap:5px}
.lesson-tools{display:flex;align-items:center;gap:12px;flex-shrink:0;margin-left:auto}
.lesson-title{flex:1;min-width:0}
.lesson-title h1{white-space:normal}
.reading-toolbar-links{display:flex;align-items:center;gap:12px}
.reading-toolbar-links a{font-size:12px;gap:5px}
.reading-toolbar-links a svg{width:16px;height:16px}
.view-read #view{display:flex;flex-direction:column}.view-read .reader-toolbar{flex-shrink:0}.view-read .reading-experience{flex:1;min-height:0}
.report-empty .empty-shishi{width:150px;height:160px;object-fit:contain}
.shishi-note{display:flex;align-items:center;gap:9px;text-align:left;color:#668171;font-size:12px;line-height:1.65;margin:8px 0}
.shishi-note img{width:44px;height:53px;object-fit:contain;flex-shrink:0}
.shishi-note strong{display:block;color:#8a5268;font-size:11px;letter-spacing:.5px}
.shishi-note p{margin:0!important;font-size:12px!important;line-height:1.65!important}
.writing-context .shishi-note{max-width:390px;margin:12px auto 0}
.quiz-mode-nav{display:flex;overflow-x:auto;gap:6px;padding:5px;flex-shrink:0;scrollbar-width:thin;border-radius:14px}
.quiz-mode-tab{flex:1;min-width:90px;grid-template-columns:1fr;justify-items:center;gap:3px;padding:9px 8px}
.quiz-mode-tab small{display:none}.quiz-mode-tab svg{width:19px;height:19px}
.poetry-play{display:grid;grid-template-columns:minmax(0,1fr) minmax(340px,1fr);gap:34px;align-items:start}
.play-scene{position:relative;margin-top:10px;border-radius:10px 24px 10px 24px;overflow:hidden;background:#f1f0e4;border:1px solid #e3e3d3}
.play-scene>img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}
.play-scene-caption{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 16px;font-size:12px;background:#fffaf0}
.play-scene-caption button{font-size:12px}
.play-card{min-width:0;background:#fffdf6;padding:20px 24px;border:1px solid #e0e5d6;border-radius:22px;box-shadow:0 5px 0 #eeeade}
.play-guide{display:flex;align-items:center;gap:12px;margin-bottom:10px}
.play-guide>img{width:46px;height:58px;object-fit:contain}.play-guide span{font-size:11px;color:#9e5d70}.play-guide h2{font-family:var(--serif);font-size:24px;margin:3px 0 0}
.play-instruction{font-size:13px;color:#617e6e;margin:8px 0 16px}
.poem-puzzle{display:grid;gap:7px}.puzzle-slot{min-height:39px;border:1px dashed #d4dbcc;display:flex;align-items:center;gap:10px;padding:6px 11px;border-radius:10px;color:#899888}
.puzzle-slot>span{font-size:11px;font-family:var(--sans);opacity:.8}.puzzle-slot p{font-family:var(--serif);margin:0;font-size:17px;line-height:1.5}.puzzle-slot.filled{border-style:solid;background:#eff5e9;color:#345f48}.puzzle-slot.active{border-color:#b3955b;background:#fff8df;color:#8f7848}
.puzzle-pieces{display:flex;flex-wrap:wrap;gap:7px;margin-top:16px}
.puzzle-pieces button{padding:9px 11px;min-height:44px;font-family:var(--serif);font-size:16px;line-height:1.5;border:1px solid #dce1d3;border-radius:10px;background:#fffdf6;color:#355d50;text-align:left;flex:1 1 45%}
.puzzle-pieces button:hover{background:#f0f6e9}.puzzle-pieces button.try-again{border-color:#c78566;background:#fff2e7}
.play-message{min-height:36px;line-height:1.7;font-size:13px;color:#6e7e66;margin:12px 0 6px}.play-actions{display:flex;align-items:center;justify-content:space-between;gap:9px}
.play-actions .button,.play-actions .text-button{font-size:12px}
.rhythm-verse{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:4px;margin:28px 0 24px;min-height:60px}
.rhythm-char{display:grid;place-items:center;font:32px var(--serif);color:#9aab9a;min-width:31px;padding:5px 2px;border-bottom:3px solid transparent;transition:color .15s,transform .15s}
.rhythm-char.tapped{color:#32745b}.rhythm-char.current{color:#b0677b;transform:translateY(-5px);border-color:#d59caa}.rhythm-verse b{font-weight:400;color:#bc9d6c;margin:0 5px}
.rhythm-tools{display:flex;justify-content:center;gap:10px}.rhythm-tools .button{font-size:12px}
.rhythm-drum{display:flex;flex-direction:column;align-items:center;justify-content:center;width:164px;height:164px;margin:28px auto 14px;border-radius:50%;border:1px solid #cfa0a0;background:radial-gradient(circle at 38% 30%,#fff7ed,#f4d8cd);box-shadow:0 7px 0 #c89282,0 12px 24px #9a5e4318;touch-action:manipulation;color:#956653}
.rhythm-drum>span{font:44px var(--serif)}.rhythm-drum small{font-size:11px;margin-top:9px}.rhythm-drum:active:not(:disabled){transform:translateY(5px);box-shadow:0 2px 0 #c89282}.rhythm-drum:disabled{opacity:.7}.beat-counter{font-size:12px;color:#83917c}
.quiz-game-art .art-stage{aspect-ratio:3/2}.quiz-game-art .art-stage img{object-fit:cover}
.completion>img.shishi-complete{width:104px;height:125px;object-fit:contain;margin:auto}
.play-finished{text-align:center;padding:16px 0}.play-finished>img{width:145px;height:115px;object-fit:contain;margin:auto}.play-finished h3{font:21px var(--serif);margin:14px 0 7px}
@media(max-width:820px){.poetry-play{grid-template-columns:1fr;gap:0}.play-scene{display:none}.play-card{max-width:620px;width:100%;margin:auto}.quiz-mode-tab{min-width:86px}.quiz-mode-tab span{font-size:12px}}
@media(max-width:700px){
 .library-heading{min-height:0;padding-right:0;margin-bottom:14px}.library-heading h1{font-size:24px;line-height:1.4;white-space:normal;letter-spacing:0}.library-heading .title-ink{display:inline-block}.library-heading .eyebrow{font-size:9px;letter-spacing:0}.library-heading .library-sub{font-size:10px;letter-spacing:0;margin-top:5px}
 .library-books{gap:12px 13px;grid-template-rows:repeat(3,minmax(126px,1fr))}.library-footer{margin-top:3px}.library-footer .shishi-home{font-size:10px}
 .lesson-tools{gap:6px}.lesson-title{gap:7px}.lesson-title h1{font-size:21px}.lesson-title p{font-size:9px}.lesson-portrait{display:none}.lesson-bar{gap:9px}.lesson-menu>summary{width:42px;height:42px}
 .reading-toolbar-links{gap:5px}.reading-toolbar-links a{font-size:11px}
 .play-card{padding:14px 15px;border-radius:15px;box-shadow:none}.play-guide{gap:9px;margin-bottom:6px}.play-guide h2{font-size:21px}.play-guide img{width:38px;height:46px}.play-instruction{margin:6px 0 12px;font-size:12px}
 .puzzle-slot{min-height:35px;padding:4px 9px;gap:8px}.puzzle-slot p{font-size:15px}.poem-puzzle{gap:5px}.puzzle-pieces{gap:6px;margin-top:12px}.puzzle-pieces button{font-size:15px;flex-basis:100%;padding:7px 10px;min-height:42px}
 .play-message{font-size:12px;min-height:27px;margin:10px 0 4px}.rhythm-char{font-size:29px;min-width:27px}.rhythm-verse{gap:2px;margin:22px 0 19px}.rhythm-verse b{margin:0 2px}.rhythm-drum{width:145px;height:145px;margin:24px auto 16px}.rhythm-drum>span{font-size:38px}
}
@media(max-width:370px){.library-heading .eyebrow{font-size:8px}.library-heading h1{font-size:22px}.lesson-title h1{font-size:18px}.play-card{padding:12px}.rhythm-char{font-size:25px;min-width:24px}}
@media(prefers-reduced-motion:reduce){.rhythm-char,.rhythm-drum{transition:none;transform:none!important}}
@media(max-width:700px){
 .quiz-shell{gap:10px;padding-bottom:4px}.quiz-mode-nav{gap:2px;padding:3px;overflow:visible}.quiz-mode-tab{min-width:0;padding:7px 2px;grid-template-rows:auto auto;gap:3px}.quiz-mode-tab svg{grid-row:1}.quiz-mode-tab span{font-size:10px;grid-row:2;letter-spacing:0}
 .puzzle-slot:not(.filled):not(.active){display:none}.puzzle-pieces button{flex-basis:45%;font-size:14px;min-height:48px}.play-guide>div>span{font-size:10px}.play-card{padding:12px 13px}.play-message{min-height:24px}
}
@media(max-height:640px) and (max-width:700px){
 .library{height:calc(100dvh - 53px);min-height:0;padding-top:8px}.library-heading{min-height:0;margin-bottom:10px}.library-heading h1{font-size:21px;line-height:1.3}.library-heading .eyebrow{margin-bottom:3px}.library-heading .library-sub{font-size:9px}.library-books{flex:1;grid-template-rows:repeat(3,minmax(100px,1fr));grid-auto-rows:auto;gap:9px 12px;padding-bottom:2px}.poem-art{min-height:26px}.poem-card-title{min-height:24px}.poem-card-title h2{font-size:17px}.poem-emblem{width:23px;height:23px}.poem-author{font-size:8px;margin-bottom:2px}.poem-open{min-height:25px;font-size:9px}.library-footer{min-height:44px;margin-top:2px}
 .record-layout{padding-block:0;gap:4px}.record-tool{min-height:0}.record-art{max-height:86px}.record-model{margin-bottom:9px}.record-tool>.verse{margin-block:3px 7px;min-height:52px}.record-counter{min-height:37px}#record-controls{min-height:110px}.record-actions{min-height:62px}.record-tool>.verse.verse-compound ruby{font-size:24px;min-width:29px}.record-tool>.verse.verse-compound{gap:1px}
 .reading-experience{padding-block:0}.reading-scene .art-stage{max-height:90px}.poem-text{min-height:0}.reading-scene{gap:6px}.poem-lines{min-height:85px}.poem-lines .verse{min-height:41px}.reading-folio{min-height:20px}.scene-dots button{height:25px}.reader-toolbar{margin-bottom:3px}.page-turner .icon-button{width:36px;height:36px}.poem-lines .verse ruby{font-size:25px;min-width:30px}
 .rhythm-verse{margin:15px 0 13px;min-height:50px}.rhythm-drum{width:113px;height:113px;margin:17px auto 11px}.rhythm-drum small{font-size:9px}.rhythm-drum>span{font-size:31px}.play-guide h2{font-size:19px}.play-instruction{margin-bottom:9px}
}

/* challenge.css */
/* A finite lesson, with one task and one primary action at a time. */
.view-quiz{--ch-ink:#284a40;--ch-muted:#748077;--ch-leaf:#3e7160;--ch-line:#d9dfd2;--ch-paper:#fffdf6}
.view-quiz .lesson-bar{min-height:72px;margin-bottom:8px;border-bottom:0}
.view-quiz .lesson-title h1{font:500 22px/1.4 var(--serif)}
.view-quiz .lesson-title p{color:var(--ch-muted);font-size:11px}
.view-quiz .study-main{max-width:1100px;min-height:0}
.view-quiz #view{overflow:hidden;padding:0}
.challenge-shell{width:100%;height:100%;min-height:0;display:flex;flex-direction:column;color:var(--ch-ink);padding:12px 26px 14px;background:linear-gradient(145deg,#fffef8 0%,#f5f4e9 100%);border:1px solid #e3e5d8;border-radius:26px}
.challenge-shell button,.challenge-shell a{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.challenge-shell button{font:inherit;cursor:pointer;color:inherit}
.challenge-shell button:focus-visible,.challenge-shell a:focus-visible{outline:3px solid #54836b;outline-offset:4px}
.challenge-shell button:disabled{cursor:default}
.challenge-shell [hidden]{display:none!important}
.challenge-shell .challenge-primary{display:inline-flex;align-items:center;justify-content:center;gap:20px;min-height:48px;padding:12px 24px;border:1px solid var(--ch-leaf);border-radius:14px;background:var(--ch-leaf);color:#fffdf4;font-size:15px;font-weight:600;text-decoration:none;transition:background .18s,transform .18s}
.challenge-primary:hover{background:#315e4e;transform:translateY(-1px)}
.challenge-primary:disabled{background:#e4e8dc;border-color:#e4e8dc;color:#8a9689;transform:none}
.challenge-text-button{min-height:44px;padding:8px 10px;border:0;background:none;font-size:13px!important;color:var(--ch-muted)!important;text-decoration:underline;text-underline-offset:5px}
.challenge-eyebrow{font:500 11px/1.5 var(--sans);letter-spacing:2px;color:var(--ch-muted);margin:0}
.challenge-header{flex:none;max-width:1040px;width:100%;margin:0 auto 6px;padding:3px 0 10px}
.challenge-header>div:first-child{display:flex;justify-content:space-between;align-items:center;margin-bottom:9px}
.challenge-count{font:500 22px/1 var(--serif);font-variant-numeric:tabular-nums}.challenge-count small{font:400 12px/1 var(--sans);color:var(--ch-muted)}
.challenge-steps{display:flex;gap:7px}.challenge-steps i{height:3px;flex:1;border-radius:4px;background:#e2e6d9}.challenge-steps .done{background:#b4c8b5}.challenge-steps .current{background:#668c73}
.challenge-body{flex:1;min-height:0;overflow:auto;scrollbar-width:thin;overscroll-behavior:contain;display:flex;flex-direction:column;justify-content:center}
.challenge-footer{flex:none;border-top:1px solid var(--ch-line);margin-top:10px;padding-top:10px;display:flex;align-items:center;justify-content:flex-end;gap:20px}
.challenge-feedback{flex:1;font-size:14px;line-height:1.7}.challenge-feedback:empty{display:none}.challenge-feedback strong{font-size:15px;font-weight:600}.challenge-feedback p{margin:3px 0 0;color:#597262}.challenge-feedback .challenge-text-button{font-size:12px!important;padding:0;min-height:30px}
.challenge-footer-actions{display:flex;align-items:center;justify-content:flex-end;gap:12px;flex-shrink:0}
.challenge-prompt{font:500 clamp(21px,2.5vw,29px)/1.6 var(--serif);letter-spacing:.5px;margin:0 0 10px;outline:none}
.challenge-instruction{font-size:13px;line-height:1.7;color:var(--ch-muted);margin:0 0 20px}
.challenge-audio-status,.challenge-manipulation-status{font-size:12px;color:var(--ch-muted);line-height:1.65;min-height:20px;margin:15px 0 0}
.challenge-intro{display:grid;grid-template-columns:1fr .9fr;align-items:center;gap:35px;padding:40px}
.challenge-intro-art{position:relative;min-width:0;align-self:center}
.challenge-intro-art>img:first-child{display:block;width:100%;max-height:440px;object-fit:contain}
.challenge-intro-motif{position:absolute;left:50%;top:40%;transform:translate(-50%,-50%);width:95px;height:95px}
.challenge-intro-copy h2{font:500 clamp(25px,3vw,38px)/1.65 var(--serif);letter-spacing:1px;margin:14px 0 16px}
.challenge-intro-copy>p:not(.challenge-eyebrow){font-size:15px;line-height:1.8;color:#66766b;margin:0 0 18px}
.challenge-trip{display:flex;gap:10px;margin:22px 0}.challenge-trip span{width:36px;height:36px;display:grid;place-items:center;border:1px solid #d9dfce;border-radius:50%;color:#637b60;font-family:var(--serif);background:#f5f5e8}.challenge-trip span:nth-child(even){border-color:#e6d9c5;color:#917656;background:#faf2e1}
.challenge-intro-copy>.challenge-kind-note{font-size:12px!important}.challenge-intro-copy>.challenge-text-button{display:block;margin-top:8px}
.challenge-sound-layout{display:grid;grid-template-columns:1fr 1fr;gap:45px;align-items:center;width:100%;padding:10px 5px}
.challenge-sound-stage{position:relative;min-width:0;height:370px;display:flex;align-items:center;justify-content:center}
.challenge-market{width:100%;height:100%;object-fit:contain;pointer-events:none}
.challenge-pod{position:absolute;left:50%;top:34%;transform:translate(-50%,-50%);height:150px;width:90px;background:transparent;border:0;padding:0;touch-action:none!important;z-index:2;transition:filter .2s}
.challenge-pod img{height:100%;width:100%;object-fit:contain;pointer-events:none}
.challenge-pod>svg{position:absolute;bottom:19%;left:calc(50% - 13px);width:26px;height:26px;padding:4px;border-radius:50%;background:#f4eedb;color:#684c29;pointer-events:none}
.challenge-pod:hover{filter:drop-shadow(0 4px 7px #8a725338)}
.challenge-pod.is-playing{animation:ch-sway .6s ease-in-out infinite alternate}
.challenge-stage-note{position:absolute;left:10%;right:10%;top:65%;font-size:13px;text-align:center;color:#5f4830;pointer-events:none}
.challenge-model-link{position:absolute;bottom:0;left:50%;transform:translateX(-50%);background:none;border:0;font-size:12px!important;min-height:36px;white-space:nowrap;text-decoration:underline;text-underline-offset:4px;color:#7d806b!important}
.challenge-shelves{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;align-items:stretch}.challenge-shelves:has(>button:nth-child(4)){grid-template-columns:repeat(2,minmax(0,1fr))}.challenge-shelves:has(>button:nth-child(2):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}
.challenge-shelf{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;min-width:0;min-height:100px;padding:15px 5px 20px;border:1px solid #dfd7c4;border-bottom:7px solid #c5ab80;border-radius:12px 12px 5px 5px;background:#f9f3e4;transition:background .2s,border-color .2s,translate .2s}
.challenge-shelf>span{font-size:27px;font-weight:500;line-height:1.3;letter-spacing:1px}.challenge-shelf:has(.challenge-tone)>span{font-size:16px;letter-spacing:0}
.challenge-shelf:disabled:not([aria-pressed="true"]):not(.is-correct){opacity:.65}
.challenge-shelf[aria-pressed="true"]{border-color:#64876b;background:#e7edde;translate:0 -4px}
.challenge-shelf.is-correct{border-color:#6f936a;background:#e8f0df}
.challenge-shelf>i{position:absolute;width:8px;height:8px;border-radius:50%;bottom:6px;background:#cfbd9a}.challenge-shelf[aria-pressed="true"]>i{background:#668a69}
.challenge-tone{width:68px;height:34px;color:#739475}
.is-dragging{z-index:20!important;opacity:.9;transition:none!important;cursor:grabbing!important}
.challenge-writing-layout{width:100%;margin:auto;display:grid;grid-template-columns:.9fr 1.1fr;gap:35px;align-items:center;max-width:830px}
.challenge-writing-heading{padding-left:10px}
.challenge-listen{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:48px;padding:10px 18px;background:#edf1e6;border:1px solid #d5dfcf;border-radius:14px;font-size:15px!important}.challenge-listen svg{width:21px;height:21px}.challenge-listen.is-playing{background:#dce9d5}
.challenge-writing-holder{min-width:0}.challenge-writing-holder[inert]{opacity:.55}
.challenge-writing-holder .cw-skip{display:none}
.challenge-writing-holder .cw-status{font-size:12px}
.challenge-shell .challenge-writing .cw-board{width:min(100%,290px)}
.challenge-shell .challenge-writing.is-answered .cw-board{width:min(100%,176px)}
.challenge-hands-layout{display:grid;grid-template-columns:.9fr 1.1fr;gap:30px;align-items:center;width:100%;padding:6px 0}
.challenge-hands-work{min-width:0}.challenge-hands-work .challenge-prompt{font-size:24px}.challenge-hands-work .challenge-instruction{margin-bottom:14px}
.challenge-model-stage{position:relative;width:100%;height:285px;border-radius:20px;overflow:hidden;background:radial-gradient(ellipse at 50% 45%,#fffdf6,#ececdf)}
.challenge-model-poster{width:100%;height:100%;object-fit:contain}.challenge-model-canvas{position:absolute;inset:0}.challenge-model-canvas canvas{display:block;width:100%;height:100%;touch-action:none}
.challenge-model-status{position:absolute;left:12px;right:12px;bottom:12px;font-size:12px;text-align:center;color:#667366;background:#fffdf4df;border-radius:8px}.challenge-model-status:empty{display:none}
.challenge-model-tools{display:flex;justify-content:center;flex-wrap:wrap;gap:6px;margin-top:8px}.challenge-model-tools button{background:#f6f5eb;border:1px solid #dce1d2;border-radius:10px;padding:9px 12px;font-size:12px!important;min-height:42px}
.challenge-pod-viewer{width:100%;height:100%}.challenge-pod-viewer .challenge-model-stage{height:calc(100% - 55px)}
.challenge-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-bottom:16px}.challenge-cards:has(>button:nth-child(2):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}.challenge-cards:has(>button:nth-child(4):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}
.challenge-card{position:relative;min-height:68px;min-width:0;border:1px solid #d6ddce;border-radius:13px;background:#fffef8;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;padding:7px;font-size:13px!important;line-height:1.5;touch-action:none!important;transition:border .2s,opacity .2s}
.challenge-card>img{display:block;width:100%;height:85px;object-fit:cover;border-radius:8px;pointer-events:none}.challenge-card[aria-pressed="true"]{border:2px solid #729274;padding:6px;background:#f0f4e7}.challenge-card.is-placed{opacity:.46}.challenge-card.is-placed[aria-pressed="true"]{opacity:1}
.challenge-poem-3 .challenge-card>img,.challenge-poem-6 .challenge-card>img{object-fit:contain;background:#f1efe7}
.challenge-color{display:block;width:30px;height:30px;border-radius:50%;background:var(--card-color);border:1px solid #b8c4b1;box-shadow:inset 0 0 0 3px #ffffff44}
.challenge-slots{display:flex;flex-direction:column;gap:7px}
.challenge-slot{width:100%;display:flex;align-items:center;gap:12px;text-align:left;border:1px dashed #bccbb5;border-radius:11px;background:#f0f3e6;min-height:48px;padding:6px 12px;font-size:13px!important}
.challenge-slot-label{color:#526d51;flex-shrink:0;min-width:70px}.challenge-slot-label>b{display:inline-grid;place-items:center;border:1px solid #cad5c0;width:24px;height:24px;border-radius:50%;margin-right:10px;font-size:11px;font-weight:500}
.challenge-slot-content{color:#99a18e;font-size:12px;display:flex;align-items:center;gap:8px;min-width:0}.challenge-slot-content>img{width:42px;height:31px;object-fit:cover;border-radius:4px}.challenge-slot-content .challenge-color{width:24px;height:24px}
.challenge-slot.is-filled{border-style:solid;background:#fafbf2}.challenge-slot.is-filled .challenge-slot-content{color:#36583c}
.challenge-field{height:305px;position:relative;overflow:hidden;background:linear-gradient(#e9edde,#faf6e6);border-radius:24px;border:1px solid #e0e3d3}
.challenge-field-ground{position:absolute;left:6%;right:6%;top:12%;height:77%;border-radius:50% 45% 32% 30%;transform:perspective(650px) rotateX(22deg);background:radial-gradient(ellipse at 20% 30%,#d4b58c55 1px,transparent 2px) 0 0/13px 17px,radial-gradient(ellipse at 60% 50%,#ac865c55 1px,transparent 2px) 0 0/17px 19px,linear-gradient(135deg,#c8b18c,#a9946f);box-shadow:0 12px 0 -3px #9b8666}
.challenge-field-ground{background:linear-gradient(#e6c79222,#6f54392a),url('media/challenges/field-soil-v1.webp') center/cover;box-shadow:0 9px 0 -2px #7c654b,0 15px 10px -9px #594c3730}
.challenge-grass{position:absolute;width:20px;height:36px;border-left:3px solid #69834b;border-radius:60% 0 0 0;transform-origin:bottom}.challenge-grass:before,.challenge-grass:after{content:'';position:absolute;bottom:0;width:12px;height:25px;border-left:3px solid #839950;border-radius:90% 0 0 0;transform:rotate(-25deg);transform-origin:bottom}.challenge-grass:after{height:31px;transform:rotate(25deg);border-color:#566d3d}
.challenge-bean{position:absolute;width:5px;height:28px;border-radius:50%;background:#4b733d;z-index:2}.challenge-bean b{position:absolute;left:3px;top:-2px;width:23px;height:13px;border-radius:2px 90% 2px 90%;background:#638944;transform:rotate(-30deg);box-shadow:inset 0 1px 0 #8fa765}.challenge-bean b+b{left:-20px;top:7px;transform:rotate(25deg) scaleX(-1);background:#76984c}
.challenge-field-caption{position:absolute;bottom:12px;left:8px;right:8px;text-align:center;color:#746f51;font-size:12px}
.challenge-density{border:0;padding:0;margin:0 0 17px;display:flex;gap:8px}.challenge-density legend{font-size:14px;margin-bottom:8px}.challenge-density button{min-height:45px;flex:1;border:1px solid #d5ddc8;border-radius:11px;background:#f9faef;font-size:14px!important}.challenge-density button[aria-pressed="true"]{background:#dfe8ce;border-color:#88a16e}
.challenge-goose{width:100%;height:270px;border-radius:20px;background:#f0f1e5;display:grid;place-items:center}.challenge-goose svg{width:90%;height:100%;max-height:280px}
.challenge-results{padding:22px 35px;justify-content:center;overflow:auto}
.challenge-results-heading{display:flex;align-items:center;gap:24px;margin-bottom:22px;flex-shrink:0}.challenge-results-heading h2{font:500 28px/1.5 var(--serif);margin:5px 0}.challenge-results-heading p:not(.challenge-eyebrow){font-size:13px;color:#788272;margin:0;line-height:1.7}
.challenge-result-list{display:flex;flex-direction:column;gap:7px;max-width:680px;width:100%;margin:0 auto 20px}
.challenge-result-row{display:flex;align-items:center;gap:16px;min-height:58px;width:100%;text-align:left;padding:8px 16px;border:1px solid #dfe3d3;border-radius:12px;background:#fffef7;font-size:14px!important}.challenge-result-number{width:26px;height:26px;border:1px solid #d7deca;border-radius:50%;display:grid;place-items:center;font-size:12px;color:#7a8e6b}.challenge-result-row small{font-size:11px;color:#809078;display:block;line-height:1.5;margin-top:2px}.challenge-result-row em{margin-left:auto;font-size:12px;color:#698557;font-style:normal}
.challenge-results-actions{display:flex;justify-content:center;align-items:center;gap:14px;flex-wrap:wrap}.challenge-result-extras{display:flex;align-items:center;justify-content:center;gap:24px;margin-top:18px}.challenge-result-extras a{font-size:12px;color:#75846b;text-underline-offset:5px;min-height:35px;display:flex;align-items:center}
@keyframes ch-sway{from{rotate:-3deg}to{rotate:3deg}}
@media(max-width:900px){.challenge-shell{padding-inline:18px}.challenge-sound-layout{gap:22px}.challenge-sound-stage{height:300px}.challenge-hands-layout{gap:19px}.challenge-model-stage{height:250px}.challenge-hands-work .challenge-prompt{font-size:21px}.challenge-intro{padding:25px;gap:22px}}
@media(max-width:700px){
 .view-quiz .lesson-bar{min-height:61px;padding:8px 0;margin-bottom:4px}.view-quiz .lesson-title h1{font-size:20px}.view-quiz .lesson-title p{font-size:10px}.view-quiz.workspace{padding-inline:12px;padding-bottom:max(9px,env(safe-area-inset-bottom))}
 .challenge-shell{padding:12px 15px;border-radius:20px}.challenge-header{padding-bottom:7px;margin-bottom:4px}.challenge-header>div:first-child{margin-bottom:8px}.challenge-count{font-size:20px}.challenge-eyebrow{font-size:10px;letter-spacing:1px}
 .challenge-body{justify-content:flex-start}.challenge-prompt{font-size:21px;margin-bottom:7px;line-height:1.5;letter-spacing:0}.challenge-instruction{font-size:12px;margin-bottom:12px;line-height:1.55}
 .challenge-footer{margin-top:8px;padding-top:9px;flex-direction:column;gap:7px;align-items:stretch}.challenge-footer-actions{justify-content:space-between;gap:8px}.challenge-footer-actions>.challenge-primary{margin-left:auto;min-height:44px;padding:10px 18px;font-size:14px}.challenge-footer .challenge-text-button{font-size:11px!important;padding-inline:0;min-height:38px}.challenge-feedback{font-size:12px;line-height:1.65}.challenge-feedback strong{font-size:13px}.challenge-feedback p{margin-top:1px}.challenge-feedback .challenge-text-button{min-height:25px}
 .challenge-intro{display:flex;justify-content:center;gap:5px;padding:15px 22px;overflow:auto}.challenge-intro-art{width:min(100%,230px);flex:none}.challenge-intro-art>img:first-child{height:180px}.challenge-intro-motif{width:47px;height:47px}.challenge-intro-copy{width:100%;text-align:center}.challenge-intro-copy h2{font-size:25px;line-height:1.55;margin:9px 0}.challenge-intro-copy>p:not(.challenge-eyebrow){font-size:13px;line-height:1.7;margin:0 0 10px}.challenge-trip{justify-content:center;margin:14px 0;gap:10px}.challenge-trip span{width:30px;height:30px;font-size:13px}.challenge-intro-copy>.challenge-text-button{margin:5px auto 0}
 .challenge-sound-layout{display:flex;flex-direction:column;gap:9px;padding:0;flex:1;justify-content:center}.challenge-sound-stage{width:min(100%,270px);height:225px;flex:none}.challenge-pod{height:92px;width:65px;top:34%}.challenge-pod>svg{width:22px;height:22px;left:calc(50% - 11px)}.challenge-stage-note{font-size:10px;top:64%}.challenge-model-link{font-size:10px!important;min-height:28px;bottom:0}.challenge-sound-work{width:100%}.challenge-sound-work .challenge-prompt{text-align:center;font-size:22px}.challenge-sound-work .challenge-instruction{display:none}.challenge-shelves{gap:9px}.challenge-shelf{min-height:85px;padding-top:10px;padding-bottom:15px;border-bottom-width:5px}.challenge-shelf>span{font-size:25px}.challenge-tone{height:26px}.challenge-shelf:has(.challenge-tone)>span{font-size:13px}.challenge-shelves:has(>button:nth-child(4)){grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}.challenge-shelf:has(.challenge-tone){min-height:84px}.challenge-tone{width:48px}
 .challenge-audio-status,.challenge-manipulation-status{font-size:11px;margin-top:10px;text-align:center;min-height:18px}
 .challenge-writing-layout{display:flex;flex-direction:column;justify-content:center;gap:7px;flex:1}.challenge-writing-heading{padding:0;text-align:center}.challenge-writing-heading .challenge-prompt{font-size:21px;margin-bottom:9px}.challenge-writing-heading .challenge-audio-status{margin-top:5px}.challenge-listen{min-height:43px;font-size:13px!important;padding:8px 16px}.challenge-writing-holder{width:100%}
 .challenge-hands-layout{display:flex;flex-direction:column;gap:10px;padding:0}.challenge-observation{width:100%}.challenge-model-stage{height:145px;border-radius:13px}.challenge-model-tools{margin-top:5px;gap:5px}.challenge-model-tools button{min-height:34px;padding:6px 10px;font-size:11px!important}.challenge-hands-work{width:100%}.challenge-hands-work .challenge-prompt{font-size:18px;line-height:1.55}.challenge-hands-work .challenge-instruction{font-size:11px;margin-bottom:9px}.challenge-cards{gap:6px;margin-bottom:10px}.challenge-card{font-size:11px!important;min-height:57px;gap:4px;padding:5px;border-radius:9px}.challenge-card>img{height:66px;border-radius:5px}.challenge-card[aria-pressed="true"]{padding:4px}.challenge-slots{gap:6px}.challenge-slot{min-height:43px;padding:5px 8px;gap:7px;font-size:12px!important}.challenge-slot-label{min-width:53px}.challenge-slot-content{font-size:11px;gap:5px}.challenge-slot-content>img{width:34px;height:26px}.challenge-slot-label>b{width:19px;height:19px;margin-right:7px;font-size:10px}.challenge-manipulation-status{margin-top:7px}
 .challenge-field{height:210px;width:100%;flex:none;border-radius:15px}.challenge-field-layout{gap:14px}.challenge-density{margin-bottom:12px}.challenge-density legend{margin-bottom:5px;font-size:13px}.challenge-density button{font-size:13px!important;min-height:42px}.challenge-grass{height:29px;width:16px}.challenge-grass:before{height:20px}.challenge-grass:after{height:25px}.challenge-field-caption{font-size:10px;bottom:9px}.challenge-goose{height:160px}.challenge-color{height:24px;width:24px}
 .challenge-results{padding:16px 14px;justify-content:center}.challenge-results-heading{gap:12px;margin-bottom:16px}.challenge-results-heading>img{width:49px;height:49px}.challenge-results-heading h2{font-size:22px;margin:4px 0}.challenge-results-heading p:not(.challenge-eyebrow){font-size:11px}.challenge-result-list{gap:7px;margin-bottom:13px}.challenge-result-row{padding:8px 10px;gap:10px;font-size:13px!important;min-height:58px}.challenge-result-row em{font-size:11px}.challenge-result-row small{font-size:10px}.challenge-result-extras{gap:15px;margin-top:7px}.challenge-result-extras a{font-size:11px}.challenge-results-actions{gap:2px}.challenge-results-actions .challenge-primary{font-size:13px;min-height:44px;padding:10px 16px}.challenge-results-actions .challenge-text-button{font-size:11px!important}
}
@media(max-width:700px) and (max-height:740px){
 .challenge-shell .challenge-writing .cw-board{width:min(100%,220px)}
 .challenge-shell .challenge-writing.is-answered .cw-board{width:min(100%,158px)}
 .challenge-shell{padding:9px 12px}.challenge-header{padding-bottom:3px}.challenge-sound-stage{height:175px;width:215px}.challenge-pod{height:77px;width:55px}.challenge-stage-note{font-size:9px}.challenge-model-link{bottom:-4px;font-size:9px!important}.challenge-sound-layout{gap:10px}.challenge-sound-work .challenge-prompt{font-size:19px}.challenge-shelf{min-height:74px}.challenge-shelf:has(.challenge-tone){min-height:72px}.challenge-shelf>span{font-size:23px}.challenge-audio-status{margin-top:7px}.challenge-writing-layout{gap:3px}.challenge-writing-heading .challenge-prompt{font-size:18px;margin-bottom:7px}.challenge-writing-heading .challenge-audio-status{margin-top:3px}.challenge-model-stage{height:108px}.challenge-hands-layout{gap:8px}.challenge-card>img{height:45px}.challenge-hands-work .challenge-prompt{font-size:16px}.challenge-hands-work .challenge-instruction{margin-bottom:6px}.challenge-slot{min-height:39px;padding-block:4px}.challenge-card{min-height:49px}.challenge-manipulation-status{font-size:10px;margin-top:4px}.challenge-field{height:165px}.challenge-field-layout{gap:10px}.challenge-density{margin-bottom:8px}.challenge-goose{height:116px}.challenge-intro-art>img:first-child{height:140px}.challenge-intro-copy h2{font-size:23px}.challenge-trip{margin:10px 0}.challenge-results-heading{margin-bottom:10px}.challenge-result-row{min-height:49px;padding-block:5px}.challenge-result-list{gap:5px}.challenge-results-heading h2{font-size:21px}
}
@media(max-width:370px){.challenge-shell{border-radius:15px;padding-inline:10px}.challenge-sound-stage{height:155px}.challenge-sound-work .challenge-prompt{font-size:18px}.challenge-tone{width:42px}.challenge-shelf:has(.challenge-tone)>span{font-size:11px}.challenge-footer-actions{gap:4px}.challenge-feedback{font-size:11px}.challenge-result-extras{gap:10px}.challenge-result-extras a{font-size:10px}.challenge-card{font-size:10px!important}.challenge-slot-label{font-size:11px}.challenge-slot-content{font-size:10px}.challenge-slot-label>b{margin-right:4px}}
@media(max-height:630px){.challenge-shell .challenge-writing .cw-board{width:min(100%,188px)}.challenge-shell .challenge-writing.is-answered .cw-board{width:min(100%,148px)}}
@media(max-width:700px) and (max-height:650px){
 .challenge-hands-layout{display:grid;grid-template-columns:100px minmax(0,1fr);align-items:center;gap:7px 10px}
 .challenge-hands-work{display:contents}.challenge-observation{grid-column:1;grid-row:1}.challenge-hands-work>.challenge-prompt{grid-column:2;grid-row:1;margin:0;font-size:15px;line-height:1.6}
 .challenge-hands-work>.challenge-instruction,.challenge-hands-work>.challenge-cards,.challenge-hands-work>.challenge-slots,.challenge-hands-work>.challenge-manipulation-status,.challenge-hands-work>.challenge-density{grid-column:1/-1;margin:0}
 .challenge-model-stage{height:87px}.challenge-model-tools{gap:3px;margin-top:3px}.challenge-model-tools button{font-size:10px!important;min-height:30px;padding:5px 6px}
 .challenge-hands-work>.challenge-instruction{font-size:10px;line-height:1.5;margin:2px 0}.challenge-card>img{height:60px}.challenge-slot{min-height:40px}
 .challenge-poem-2 .challenge-observation,.challenge-poem-4 .challenge-observation{display:none}.challenge-poem-2 .challenge-hands-work>.challenge-prompt,.challenge-poem-4 .challenge-hands-work>.challenge-prompt{grid-column:1/-1;margin:8px 0;font-size:17px}
 .challenge-goose{height:108px}.challenge-field{grid-column:1;grid-row:1;height:128px;border-radius:12px}.challenge-field-caption{display:none}.challenge-field-ground{left:3%;right:3%;height:70%;top:15%}.challenge-grass{width:10px;height:19px;border-left-width:2px}.challenge-grass:before{width:8px;height:13px;border-left-width:2px}.challenge-grass:after{width:8px;height:17px;border-left-width:2px}.challenge-bean{height:18px;width:3px}.challenge-bean b{width:14px;height:8px;left:1px}.challenge-bean b+b{left:-12px;top:5px}
 .challenge-hands-work>.challenge-density{margin-top:5px}.challenge-density legend{font-size:12px}.challenge-density button{min-height:40px}
 .challenge-writing-heading .challenge-audio-status{display:none}.challenge-writing-heading .challenge-prompt{font-size:17px}.challenge-writing-layout{gap:5px}.challenge-shell .challenge-writing .cw-status{margin:3px 0;min-height:18px}
}
@media(max-height:550px) and (min-width:701px){.challenge-sound-stage{height:220px}.challenge-model-stage{height:170px}.challenge-prompt{font-size:21px}.challenge-intro-art>img:first-child{max-height:240px}.challenge-intro-copy h2{font-size:26px}.challenge-results{justify-content:flex-start}}
@media(prefers-reduced-motion:reduce){.challenge-shell *{animation:none!important;transition:none!important}}

/* lesson-map.css */
.lesson-map{--map-paper:#fffdf5;--map-ink:#234b41;--map-muted:#527164;--map-line:#dbe3d6;display:flex;flex-direction:column;width:100%;max-width:1000px;min-width:0;margin:0 auto;gap:22px;color:var(--map-ink)}
.lesson-map a{color:inherit;text-decoration:none;touch-action:manipulation}.lesson-map a:focus-visible{outline:3px solid #568e7a;outline-offset:3px}
.lesson-map-hero{display:flex;align-items:center;gap:14px;min-height:52px}.lesson-map-motif{width:48px;height:48px;object-fit:contain}.lesson-map-hero h2{font:600 26px/1.4 var(--serif,'Noto Serif HK',serif);margin:0}
.lesson-map-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;min-width:0}
.lesson-map-step{display:flex;flex-direction:column;min-width:0;min-height:185px;padding:18px;border:1px solid var(--map-line);border-radius:18px;background:var(--map-paper);transition:background .15s,border-color .15s}
a.lesson-map-step:hover{background:#f1f6eb;border-color:#91b2a1}.lesson-map-step.is-resume{border-color:#80a18a}.lesson-map-step-explore{background:#eff6f4}.lesson-map-step-quiz{background:#faf3e5}.lesson-map-step-animation{background:#f0eee7;color:#667363}
.lesson-map-step-top{display:flex;align-items:center;gap:10px;margin-bottom:14px;min-height:30px}.lesson-map-number{font:600 18px/1.3 var(--serif,serif);color:#5f7f6d}.lesson-map-step-icon{display:grid;place-items:center;width:30px;height:30px;color:#487e68}.lesson-map-step-icon svg{width:27px;height:27px}.lesson-map-step-arrow{display:grid;place-items:center;margin-left:auto;color:#789182}.lesson-map-step-arrow svg{width:18px;height:18px}
.lesson-map-step-copy{min-width:0}.lesson-map-step h3{font:600 20px/1.4 var(--sans,'Noto Sans HK',sans-serif);margin:0;text-wrap:balance}.lesson-map-status{display:block;margin-top:9px;font-size:16px;line-height:1.45;color:var(--map-muted)}
.lesson-map-extras{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;width:100%;max-width:620px;margin:0 auto;padding-top:12px;border-top:1px solid #dce5d8}.lesson-map-extras a{display:flex;align-items:center;justify-content:center;gap:8px;min-height:52px;border-radius:12px;font-size:18px;font-weight:500;color:#476b58}.lesson-map-extras svg{width:21px;height:21px}.lesson-map-extras a:hover{color:#2b654f;background:#edf3e9}
@media(max-width:800px){.lesson-map{max-width:560px;gap:16px}.lesson-map-steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.lesson-map-step{min-height:150px;padding:15px}.lesson-map-hero h2{font-size:24px}.lesson-map-extras{gap:6px;padding-top:8px}}
@media(max-width:420px){.lesson-map{gap:12px}.lesson-map-hero{min-height:42px;gap:10px}.lesson-map-motif{width:38px;height:38px}.lesson-map-hero h2{font-size:22px}.lesson-map-steps{gap:10px}.lesson-map-step{min-height:145px;padding:12px}.lesson-map-step-top{margin-bottom:8px;gap:8px}.lesson-map-step h3{font-size:20px}.lesson-map-status{margin-top:7px}.lesson-map-extras a{gap:5px;font-size:18px}.lesson-map-extras svg{width:18px;height:18px}}
@media(max-width:360px){.lesson-map-step{padding:10px;min-height:144px}.lesson-map-step h3{font-size:18px}.lesson-map-step-top{min-height:24px;margin-bottom:6px}.lesson-map-step-icon{width:25px;height:25px}.lesson-map-step-icon svg{width:24px;height:24px}.lesson-map-status{margin-top:6px}.lesson-map-extras a{gap:3px;font-size:18px}.lesson-map-extras svg{width:17px;height:17px}}
@media(max-width:800px) and (max-height:650px){.lesson-map{gap:9px}.lesson-map-hero{min-height:32px}.lesson-map-motif{width:30px;height:30px}.lesson-map-hero h2{font-size:20px}.lesson-map-steps{gap:8px}.lesson-map-step{min-height:136px;padding:9px 10px}.lesson-map-step-top{margin-bottom:4px;min-height:24px}.lesson-map-step h3{font-size:18px}.lesson-map-status{margin-top:5px}.lesson-map-extras{padding-top:6px}.lesson-map-extras a{min-height:46px}}
@media(prefers-reduced-motion:reduce){.lesson-map-step{transition:none}}

/* platform.css */
.workspace:has(>.lesson-tabs){grid-template-rows:auto auto minmax(0,1fr)}
.lesson-tabs{display:flex;align-items:center;justify-content:center;gap:8px;min-height:45px;margin:-6px 0 11px;flex-shrink:0}
.lesson-tabs a{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:8px 20px;border-radius:12px;color:#7d8978;font-size:13px;text-decoration:none;border:1px solid transparent}
.lesson-tabs a>span{width:21px;height:21px;border:1px solid #d7decd;border-radius:50%;font-size:10px;display:grid;place-items:center}
.lesson-tabs a[aria-current]{color:#355f49;background:#eef2e5;border-color:#dfe6d4}
.lesson-tabs a[aria-current]>span{background:#759276;color:#fffdf5;border-color:#759276}
.lesson-tabs a:focus-visible{outline:3px solid #739573;outline-offset:2px}
.view-lesson #view{overflow:hidden;padding:0}.view-lesson .study-main{max-width:1080px}.view-lesson .lesson-bar{min-height:69px;margin-bottom:5px}
.view-lesson .lesson-title h1{font-size:25px}.view-lesson .lesson-portrait{width:38px;height:38px}
.record-unfold-note{font-size:11px;color:#81937e;line-height:1.5;text-align:center;margin:8px 0 0}
.reading-mode{display:flex;gap:5px}.reading-mode button{background:transparent;border:0;border-radius:8px;min-height:40px;padding:8px 14px;font-size:13px;color:#8a947e;cursor:pointer;letter-spacing:0}
.reading-mode button[aria-pressed="true"]{background:#e9efdd;color:#487151}
.reading-story{padding:19px 2px 12px}.reading-story[hidden],.poem-lines[hidden]{display:none!important}
.story-eyebrow{font-size:10px;letter-spacing:1.5px;color:#91a087;margin:0 0 8px}
.reading-story h3{font:500 26px/1.55 var(--serif);margin:0 0 13px;color:#3f694e}
.story-meaning{font-size:16px;line-height:2;color:#627661;margin:0 0 16px;max-width:34em}
.story-question{font-size:13px;line-height:1.9;color:#8b7858;padding-left:12px;border-left:2px solid #d8c595;margin:0 0 11px}
.story-question>span{font-size:10px;display:block;color:#a89573;letter-spacing:1px}
.reading-story>.text-button{font-size:12px;color:#71906c;min-height:44px}
.view-read .reading-experience{box-shadow:none}.view-read .poem-landscape{box-shadow:none}
.view-read .reader-controls{flex-wrap:wrap}.view-read .reader-controls .button{min-height:44px}
.view-read .reader-toolbar h2{font-size:14px}.view-read .reading-toolbar-links>a{display:none}
.keyboard-open .lesson-tabs{display:none}
.challenge-results-heading .challenge-result-detail{font-size:11px!important;color:#9aa28e!important;margin-top:4px!important}
.challenge-results-actions [data-ch="recommended"]{background:#527f60}.challenge-results-actions [data-ch="postcard"]{border:1px solid #cfdac2;padding:9px 15px;border-radius:12px;text-decoration:none;color:#537349!important}
.challenge-market,.challenge-pod img{transition:opacity .25s}.challenge-pod img:not([data-loaded]){opacity:0}.challenge-pod img[data-loaded]{opacity:1}
.living-field-picture{position:absolute;inset:0}.living-field-canvas{position:absolute;inset:0;border-radius:inherit;overflow:hidden}.living-field-canvas[hidden]{display:none}.living-field-canvas canvas{display:block;width:100%;height:100%;touch-action:none}
.challenge-field .living-grass,.challenge-field .living-bean{position:absolute;display:block;object-fit:contain;width:42px;height:61px;transform:translate(-50%,-75%);transform-origin:bottom;pointer-events:none}
.challenge-field .living-bean{width:46px;height:62px;z-index:3}
.living-field-tools{display:flex;justify-content:center;align-items:center;gap:7px;margin-top:6px;flex-wrap:wrap}
.living-field-tools button{font-size:11px!important;min-height:38px;padding:7px 11px;background:#edf2e3;color:#5d7857;border:1px solid #d8e1cb;border-radius:10px;cursor:pointer}
.living-field-tools .living-field-status{font-size:11px;color:#7b8c70;line-height:1.5}.living-field-status:empty{display:none}
.living-field-wrap{min-width:0;width:100%}
.challenge-result-extras .challenge-text-button{font-size:12px!important;min-height:44px;padding:4px;color:#75846b}
.challenge-result-extras a{min-height:44px}
@media(max-width:700px){
 .lesson-tabs{gap:4px;margin:-6px 0 7px;min-height:44px}.lesson-tabs a{flex:1;gap:5px;padding:6px 4px;font-size:11px;min-height:44px}.lesson-tabs a>span{width:18px;height:18px;font-size:9px}
 .workspace:has(>.lesson-tabs)>.lesson-bar{min-height:61px;padding-block:8px;margin-bottom:6px}.view-lesson .lesson-title h1{font-size:21px}.view-lesson .lesson-bar{min-height:62px}
 .record-unfold-note{font-size:10px;margin:4px 0}.reading-mode button{min-height:36px;font-size:12px;padding:6px 12px}.reading-story{padding:10px 2px 5px}.story-eyebrow{font-size:9px;margin-bottom:4px}.reading-story h3{font-size:21px;margin:0 0 6px}.story-meaning{font-size:14px;line-height:1.85;margin-bottom:10px}.story-question{font-size:12px;margin-bottom:2px;line-height:1.7}.story-question>span{font-size:9px}.reading-story>.text-button{font-size:11px;min-height:36px}
 .view-read .reader-toolbar{display:none}.view-read .reading-experience{justify-content:center;gap:7px}.view-read .reading-scene{gap:7px;flex:1;min-height:0;justify-content:center}.view-read .poem-landscape{padding:4px 6px 0}.view-read .reading-scene .art-stage{max-height:clamp(95px,calc(100dvh - 565px),185px)}.view-read .scene-dots button{height:25px}.view-read .page-turner .icon-button{height:36px;width:36px}.view-read .page-turner{min-height:38px}.view-read .reader-controls{margin:0;justify-content:center;gap:6px}.view-read .reader-controls .button{font-size:11px;padding:7px 9px;min-height:40px}.view-read .reader-controls .media-buttons{gap:6px}.view-read .audio-timeline{height:26px}.view-read .audio-options{margin:0}
 .challenge-field .living-grass{width:32px;height:48px}.challenge-field .living-bean{width:35px;height:48px}.living-field-tools{margin-top:4px;gap:5px}.living-field-tools button{min-height:34px;padding:6px 10px;font-size:10px!important}.living-field-tools .living-field-status{font-size:10px}
 .challenge-results-actions{gap:8px}.challenge-results-actions .challenge-text-button{min-height:38px}.challenge-results-heading .challenge-result-detail{font-size:10px!important}
}
@media(max-width:700px) and (max-height:680px){
 .view-read .reading-experience{height:100%;min-height:0;flex:1;gap:3px;padding:0}.view-read .reading-scene{display:grid;grid-template-columns:85px minmax(0,1fr);align-items:center;gap:10px;flex:1}.view-read .poem-landscape{border:0;padding:0;margin:0;align-self:start;margin-top:10px;background:transparent}.view-read .poem-landscape:before{display:none}.view-read .reading-scene .art-stage{max-height:110px;height:100px;aspect-ratio:auto}.view-read .scene-stage{height:100%!important;aspect-ratio:auto!important}.view-read .scene-dots button{width:18px;min-width:18px;height:25px}.view-read .scene-dots{gap:0}.view-read .poem-text{padding:0;min-height:0}.view-read .reading-folio{padding:0;gap:4px}.reading-mode{gap:0}.reading-mode button{font-size:10px;min-height:34px;padding:5px 8px}.view-read .reading-story{padding:7px 0 1px}.view-read .story-eyebrow{display:none}.view-read .reading-story h3{font-size:18px;margin-bottom:6px}.view-read .story-meaning{font-size:13px;line-height:1.85;margin-bottom:8px}.view-read .story-question{font-size:11px;padding-left:8px}.view-read .reading-story>.text-button{min-height:34px;font-size:10px}.view-read .page-turner{gap:5px}.view-read .page-turner .text-button{font-size:10px}.view-read .page-turner .icon-button{height:34px;width:34px}.view-read .poem-lines .verse{min-height:50px}.view-read .poem-lines .verse ruby{min-width:25px;font-size:22px}.view-read .poem-lines .verse rt{font-size:10px}.view-read .poem-lines .punct{font-size:22px;width:10px}.view-read .poem-lines .verse-compound{flex-direction:column}
 .view-record .record-layout{padding:0;min-height:0;height:100%}.view-record .record-unfold-note{font-size:9px;margin-top:2px}.view-record .record-counter{min-height:30px}.view-record .record-art{max-height:76px}.view-record #record-controls{min-height:95px}
 .challenge-field-layout>.living-field-wrap{grid-column:1;grid-row:1}.challenge-field-layout .challenge-field{height:113px}.living-field-tools button{min-height:32px;padding:5px 7px}.living-field-tools .living-field-status{position:static;font-size:9px}.challenge-field .living-grass{width:18px;height:28px}.challenge-field .living-bean{width:21px;height:30px}
 .challenge-results-heading .challenge-eyebrow{display:none}.challenge-results-heading{margin-bottom:10px}.challenge-results-heading h2{font-size:20px}.challenge-result-row{min-height:44px;padding:3px 8px}.challenge-result-list{gap:4px;margin-bottom:10px}.challenge-results-actions{flex-wrap:nowrap;gap:6px}.challenge-results-actions .challenge-primary{padding:9px 12px;gap:0}.challenge-results-actions [data-ch="postcard"]{padding:9px 10px;min-height:44px}.challenge-result-extras{gap:8px;margin-top:5px}.challenge-result-extras .challenge-text-button{font-size:10px!important}.challenge-result-extras a{font-size:10px}
}

/* simplify.css */
/* Clear reading actions and space for the small guide. */
.poem-author{font-size:16px;line-height:1.5;color:#597362}
.lesson-title p{font-size:15px;line-height:1.5;letter-spacing:.3px;color:#5e7563}
.library-heading{margin-bottom:20px}.library-footer{justify-content:flex-end}
.workspace.lesson-shell{padding-bottom:104px}.workspace:has(>.lesson-tabs){grid-template-rows:auto minmax(0,1fr)}
.lesson-tabs{display:none}
.record-layout{position:relative;padding-bottom:0;box-shadow:none}
.record-landscape{box-shadow:none;transform:none}
.record-art,#reading-art{touch-action:pan-y;user-select:none;cursor:grab}
.record-art:active,#reading-art:active{cursor:grabbing}
.record-art:focus-visible,#reading-art:focus-visible{outline:3px solid #81a185;outline-offset:3px}
.record-line-nav{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;align-items:center;gap:4px}
.record-line-nav>.icon-button{width:44px;height:44px;border:0;background:transparent;box-shadow:none}
.record-line-nav>.icon-button:disabled{opacity:.22}
.record-unfold-note{font-size:12px;line-height:1.65;margin:0}
.record-model{display:flex;align-items:center;justify-content:center;gap:9px}
.pinyin-command{white-space:nowrap}.pinyin-command svg{width:16px;height:16px}
.record-bottom{position:fixed;bottom:18px;left:100px;right:24px;display:flex;align-items:center;justify-content:center;gap:14px;min-height:44px;z-index:20}
.record-bottom .text-button{min-height:44px;font-size:13px}
.record-bottom .text-button svg{width:17px;height:17px}
.view-read .story-experience{height:100%;min-height:0;display:flex;flex-direction:column;gap:14px}
.story-experience .reading-scene{flex:1;min-height:0}
.story-experience .reading-folio{min-height:36px;font-size:12px}
.story-experience .reading-story{padding-top:16px}
.story-experience .story-bottom{display:flex;align-items:center;justify-content:center;gap:30px;flex-shrink:0}
.story-bottom .page-turner{width:auto;min-width:270px;border:0;gap:15px;margin:0}
.story-bottom .page-turner>span{font-size:12px;color:#7b8c72}
.story-bottom .icon-button{min-height:44px;min-width:44px}
.view-report .report-prose{font-size:17px;line-height:2.05;white-space:pre-line;max-width:40em;margin:18px auto 0}
.view-report .ai-advice{padding:18px 24px}.view-report .ai-report-header h2{font-size:23px}
.view-report .advice-placeholder[hidden]{display:none}.view-report .report-grade-label{font-size:13px}
.view-report .report-next-activities{min-height:44px}
.empty-motif{width:90px;height:90px;object-fit:contain;margin-bottom:16px}
@media(max-width:700px){
 .workspace.lesson-shell{padding-bottom:78px}.lesson-bar{min-height:72px;margin-bottom:8px;padding-block:8px}.lesson-title p{font-size:14px}.view-lesson .lesson-title p{font-size:14px}
 .poem-author{font-size:13px;line-height:1.6;margin-bottom:4px}.library-heading{margin-bottom:16px}
 .record-layout{padding-bottom:0;gap:5px}.record-art{max-height:clamp(95px,calc(100dvh - 560px),205px)}
 .record-line-nav{grid-template-columns:38px minmax(0,1fr) 38px;gap:0}.record-line-nav>.icon-button{width:38px;height:38px}.record-unfold-note{font-size:10px;line-height:1.5}
 .record-model .button{font-size:12px;padding:8px 12px;min-height:42px}.record-bottom .text-button{font-size:12px}.record-bottom{gap:6px;min-height:44px;bottom:12px;left:78px;right:12px;flex-wrap:wrap}
 .story-experience .reading-scene{display:flex;flex-direction:column;gap:12px;justify-content:center}.story-experience .poem-landscape{width:100%;max-width:430px;margin:0;padding:0;border:0;background:transparent}
 .story-experience .poem-landscape:before{display:none}.story-experience .reading-scene .art-stage{height:auto;aspect-ratio:16/9;max-height:210px}.story-experience .scene-stage{height:100%!important;aspect-ratio:16/9!important}
 .story-experience .poem-text{width:100%;padding:0 5px;min-height:0}.story-experience .reading-story{padding:9px 0 0}.story-experience .reading-story h3{font-size:22px}.story-experience .story-meaning{font-size:15px;line-height:1.9;margin-bottom:12px}.story-experience .story-question{font-size:13px}.story-experience .reading-story>.text-button{min-height:44px;font-size:12px}
 .story-experience .story-bottom{gap:8px;justify-content:space-between}.story-bottom .page-turner{min-width:0;gap:0;flex:1}.story-bottom .page-turner>span{font-size:10px;max-width:110px;text-align:center}.story-bottom>.button{min-height:44px;padding:8px 12px;font-size:12px}
 .view-report .ai-advice{padding:14px}.view-report .report-prose{font-size:15px;line-height:1.95;margin-top:14px}.view-report .ai-report-header h2{font-size:20px}.view-report .report-grade-label{font-size:12px}
}
@media(max-width:700px) and (max-height:680px){
 .library-heading{margin-bottom:10px;min-height:35px}.library-heading h1{font-size:21px}.poem-author{font-size:12px;margin:0 0 3px}.poem-card-title{min-height:23px}.library-footer{min-height:36px}
 .view-record .record-layout{height:100%;padding:0;min-height:0;gap:3px}.view-record .record-art{max-height:70px}.record-line-nav{min-height:32px}.record-line-nav>.icon-button{min-height:32px;height:32px}.view-record .record-unfold-note{font-size:9px}.view-record .record-counter{min-height:25px}.view-record .record-model{margin-bottom:10px}.view-record .record-model .button{min-height:40px;font-size:11px;padding:7px 10px}.view-record #record-controls{min-height:94px}.view-record .mic-button{min-height:88px;font-size:12px;gap:10px}.view-record .mic-button svg{width:55px;height:55px;padding:16px}.view-record .record-status:empty{display:none}.view-record .record-tool>.verse{margin-block:2px 6px;min-height:53px}.view-record .record-tool>.verse.verse-compound ruby{font-size:23px}
 .story-experience{padding:0!important;gap:4px!important}.story-experience .reading-scene{display:grid;grid-template-columns:86px minmax(0,1fr);gap:10px;align-items:center}.story-experience .reading-scene .art-stage{max-height:none;aspect-ratio:16/9;height:auto}.story-experience .poem-text{padding:0}.story-experience .reading-folio{font-size:10px;min-height:27px}.story-experience .reading-story h3{font-size:19px}.story-experience .story-meaning{font-size:13px;line-height:1.9;margin-bottom:9px}.story-experience .story-question{font-size:11px;line-height:1.7}.story-experience .reading-story>.text-button{font-size:10px}.story-bottom .icon-button{min-width:36px;width:36px}
 .view-report .report-prose{font-size:14px;line-height:1.8}.view-report .ai-advice{padding:11px}.view-report .report-next-activities{gap:3px}.view-report .report-next-activities a{font-size:10px}
}
.view-read .story-experience{flex:1;min-height:0;padding:15px;overflow:hidden}
.view-read .story-experience .reading-scene{min-height:0;flex:1}
.view-read .story-experience .poem-landscape{min-height:0}
.view-read .story-experience .art-stage{max-height:100%;overflow:hidden}
.view-explore .explore-visual{min-height:0}
@media(max-width:700px) and (max-height:680px){
 .view-explore .explore-guide{display:none}
 .view-explore .explore-layout{gap:6px}.view-explore .explore-next{min-height:44px}
 .view-write .writing-tool{max-width:min(100%,calc(100dvh - 316px))}
 .view-write .writing-layout{padding-block:0;min-height:0;height:100%}
}
@media(min-width:701px){.view-explore .explore-stage{min-height:0}.view-explore .explore-visual{min-height:0}}
.view-write .writing-layout{min-height:0;height:100%}
.view-write .writing-tool{max-height:100%}
.workspace.view-quiz:has(.challenge-body){padding-bottom:14px}
@media(max-width:700px){
 .workspace.view-quiz:has(.challenge-body){padding-bottom:max(9px,env(safe-area-inset-bottom))}
 .view-quiz .challenge-footer-actions{padding-left:54px}
 .view-quiz .challenge-feedback [data-ch=show-solution]{margin-left:54px;min-height:32px}
}
@media(min-width:701px) and (min-height:451px){.view-write .writing-tool{max-width:min(430px,calc(100dvh - 350px))}}
@media(max-width:700px) and (max-height:680px){.view-record .record-model{margin-bottom:3px}.view-record .record-progress{margin:0;padding:3px 6px 4px}.view-read .story-bottom{padding-bottom:6px}}
@media(max-width:700px) and (max-height:680px){
 .view-quiz .challenge-shell:has(.has-feedback) .challenge-cards,
 .view-quiz .challenge-shell:has(.has-feedback) .challenge-instruction,
 .view-quiz .challenge-shell:has(.has-feedback) .challenge-density{display:none}
 .view-quiz .challenge-shell:has(.has-feedback) .challenge-goose,
 .view-quiz .challenge-shell:has(.has-feedback) .challenge-model-stage{height:86px}
 .view-quiz .challenge-shell:has(.has-feedback) .challenge-sound-stage{height:95px}
 .view-quiz .challenge-shell:has(.has-feedback) .challenge-pod{height:55px;width:40px}
 .view-quiz .challenge-shell:has(.has-feedback) .challenge-stage-note,
 .view-quiz .challenge-shell:has(.has-feedback) .challenge-model-link{display:none}
 .view-quiz .challenge-shell:has(.has-feedback) .challenge-writing-heading .challenge-prompt{display:none}
 .view-quiz .challenge-shell .challenge-writing.is-answered .cw-answer{margin:2px 0 4px}
 .view-quiz .challenge-shell .challenge-writing.is-answered .cw-answer strong{font-size:32px}
 .view-quiz .challenge-results{padding-block:8px;justify-content:flex-start}
 .view-quiz .challenge-results-heading{margin-bottom:4px}
 .view-quiz .challenge-result-list{margin-bottom:3px;gap:4px}
 .view-quiz .challenge-result-row{min-height:44px;padding-block:3px}
 .view-quiz .challenge-results-heading .challenge-result-detail{display:none}
 .view-record .record-layout[data-record-busy=true] .record-model{display:none}
 .view-record .record-wave{margin-top:0;margin-bottom:4px}
 .view-record .record-tool .record-review{margin:0}
 .view-record .record-word-pager:has(button:first-child:disabled):has(button:last-child:disabled){display:none}
 .view-explore .explore-card[data-feedback] .explore-verse{display:none}
 .view-explore .explore-card[data-feedback] .explore-guide{display:block;min-height:0;padding:0;margin:5px 0}
 .view-explore .explore-card[data-feedback] .explore-guide>img,.view-explore .explore-card[data-feedback] .explore-guide-name{display:none}
 .view-explore .explore-card[data-feedback] .explore-feedback{font-size:11px;min-height:0;margin:0;line-height:1.55}
}

/* large-type.css */
/* Final reading scale: useful labels stay legible, with one task per screen. */
:root{--child-body:18px;--child-secondary:16px;--child-action:18px}
body{font-size:var(--child-body)}
.workspace :is(.button,.text-button,.menu-panel a,.menu-panel button),.profile-button{font-size:var(--child-action);min-height:48px;line-height:1.45}
.workspace .icon-button{width:48px;height:48px;min-width:48px;min-height:48px}
.workspace .lesson-title h1{font-size:clamp(26px,2.7vw,34px);line-height:1.3;letter-spacing:0}
.workspace .lesson-title p{font-size:18px;line-height:1.4;letter-spacing:0;margin-top:3px}
.workspace .back-library,.workspace .lesson-menu>summary{font-size:16px;line-height:1.3;min-height:50px}
.workspace .lesson-menu>summary{width:52px;height:52px}
.workspace .lesson-bar{padding-block:12px;margin-bottom:12px;min-height:90px}
.workspace.lesson-shell{padding-bottom:24px}
.workspace .view-section{padding:3px;scrollbar-width:thin}
.workspace :is(.eyebrow,.section-count,.view-heading p,.loading-page p,.error-text,.empty-note,.practice-pager span,.report-grade-label,.report-line-heading h3,.audio-timeline,.reading-folio){font-size:16px;line-height:1.55}
.workspace :is(.view-heading h2,.section-heading h2,.panel-title,.report-empty h2,.completion h2){font-size:26px;line-height:1.4}
.workspace :is(input,textarea,select){font-size:18px}
.toast,.error-text,.chat-error{font-size:16px;line-height:1.6}
.profile-dialog label,.profile-dialog .eyebrow{font-size:16px;line-height:1.5}
.profile-dialog :is(input,select){font-size:18px;min-height:48px}
dialog :is(button,.button){font-size:18px;min-height:48px}
dialog .icon-button{width:48px;min-width:48px;height:48px}
dialog h2{font-size:26px;line-height:1.4}
.workspace :is(rt,.verse rt,.focus-word rt,.sound-word rt,.practice-pick rt){font-size:16px;line-height:1.35}
.workspace .verse ruby{font-size:32px;min-width:38px;line-height:1.6}
.workspace .verse .punct{font-size:30px;line-height:1.6}

.library-heading h1{font-size:clamp(28px,3.5vw,40px)}
.library .poem-card-title h2{font-size:24px;line-height:1.3}
.library .poem-card-title h2 small,.library .poem-grade,.library-footer{font-size:16px}
.library .poem-author{font-size:18px;line-height:1.4;margin:4px 0 6px}
.library .poem-open{font-size:18px;min-height:48px}
.library .poem-open svg{width:18px;height:18px}
.library-footer a{min-height:44px}

.workspace.view-record .record-layout{height:100%;min-height:0;gap:28px;align-items:center}
.workspace.view-record .record-landscape{padding:10px 10px 2px}
.workspace.view-record .record-art{max-height:calc(100dvh - 310px)}
.workspace.view-record .record-line-nav{grid-template-columns:48px minmax(0,1fr) 48px;min-height:48px}
.workspace.view-record .record-unfold-note{font-size:16px;line-height:1.55;text-align:center}
.workspace.view-record .record-counter,.workspace.view-record .record-word-heading{font-size:16px;min-height:36px;line-height:1.5}
.workspace.view-record .record-counter>span{font-size:16px}
.workspace.view-record .record-tool{max-width:460px;padding:4px 0;min-height:0}
.workspace.view-record .record-tool>.verse{margin:10px 0 16px;min-height:64px}
.workspace.view-record .record-tool>.verse rt,.workspace.view-record .record-tool>.verse.verse-compound rt{font-size:16px;line-height:1.2}
.workspace.view-record .record-model{gap:10px;margin:0 0 20px}
.workspace.view-record .record-model .button{font-size:18px;min-height:50px;padding:10px 16px}
.workspace.view-record .record-model svg{width:22px;height:22px}
.workspace.view-record .record-actions{min-height:88px;gap:10px}
.workspace.view-record .record-actions .button{font-size:18px;min-height:50px;padding:10px 16px}
.workspace.view-record .mic-button{font-size:20px;min-height:110px;gap:14px}
.workspace.view-record .mic-button svg{width:70px;height:70px;padding:21px}
.workspace.view-record #record-controls{min-height:116px}
.workspace.view-record .record-status,.workspace.view-record .record-word-hint{font-size:16px;line-height:1.6;margin-top:8px}
.workspace.view-record .record-bottom{position:static;width:100%;grid-column:1/-1;flex-wrap:wrap;justify-content:center;min-height:50px;margin-top:0;gap:4px 16px}
.workspace.view-record .record-bottom .text-button{font-size:18px;min-height:48px}
.workspace.view-record .record-bottom svg{width:20px;height:20px}
.workspace.view-record .record-feedback-title{font-size:24px;line-height:1.4}
.workspace.view-record .record-result small{font-size:18px}
.workspace.view-record .record-word-pager{margin:3px 0}
.workspace.view-record .record-review .focus-word ruby{font-size:58px}
.workspace.view-record .record-review .focus-word rt{font-size:20px}
.workspace.view-record .record-review .focus-word{min-height:102px;padding:7px 15px}

.workspace.view-write .writing-layout{height:100%;min-height:0;padding:0;align-items:center}
.workspace.view-write .writing-tool{width:100%;min-width:0;max-width:min(440px,calc(100dvh - 350px));max-height:100%}
.workspace.view-write .writing-pinyin{font-size:28px;line-height:1.3}
.workspace.view-write .writing-counter{font-size:16px;line-height:1.5}
.workspace.view-write .writing-toolbar{margin-bottom:9px;min-height:58px}
.workspace.view-write .writing-controls{margin-top:10px;gap:8px;display:grid;grid-template-columns:1fr auto;align-items:center}
.workspace.view-write .writing-tools{gap:4px;display:flex}
.workspace.view-write .writing-tools .icon-button{width:46px;min-width:46px;height:48px;min-height:48px}
.workspace.view-write .writing-controls>.button{width:auto;font-size:18px;padding:9px 14px;min-height:48px}
.workspace.view-write .writing-feedback{font-size:16px;line-height:1.5;margin:7px 0 0;min-height:0}
.workspace.view-write .writing-status{font-size:16px;line-height:1.5}
.workspace.view-write .writing-status .text-button{font-size:16px;min-height:48px}
.workspace.view-write .writing-context p,.workspace.view-write .shishi-note p{font-size:16px!important;line-height:1.7!important}
.workspace.view-write .shishi-note strong{font-size:18px}

.workspace.view-report .report-tabs button{font-size:18px;min-height:50px}
.workspace.view-report .report-prose{font-size:18px;line-height:1.85;padding:13px 16px}
.workspace.view-report :is(.report-grade-label,.advice-placeholder,.practice-tip,.sound-context,.sound-kind,.practice-pager span,.practice-pick small,.contrast-heading,.dimension span,.score-ring span,.report-next-activities a){font-size:16px;line-height:1.55}
.workspace.view-report .ai-report-header h2,.workspace.view-report .practice-card-heading h3{font-size:24px}
.workspace.view-report .ai-report-header{flex-wrap:wrap;gap:10px;margin:0 0 10px}
.workspace.view-report .ai-report-header>div{min-width:0;flex:1 1 200px}
.workspace.view-report .report-grade-label{white-space:nowrap;flex-wrap:nowrap;font-size:16px}
.workspace.view-report .report-grade-label select{font-size:16px;min-width:104px;min-height:44px}
.workspace.view-report .word-result strong,.workspace.view-report .section-heading span,.workspace.view-report .report-line-heading>span,.workspace.view-report .good-news{font-size:16px}
.workspace.view-report .practice-intro{font-size:16px;line-height:1.55}
.workspace.view-report .report-next-activities{display:flex;flex-wrap:wrap;gap:6px 16px}
.workspace.view-report .report-next-activities a{min-height:48px}
.workspace.view-report .score-ring{width:76px;height:76px}.workspace.view-report .score-ring strong{font-size:30px}
.workspace.view-report .dimension strong{font-size:26px}
.workspace.view-report .practice-actions{flex-wrap:wrap}.workspace.view-report .practice-actions .button{font-size:16px;min-height:48px}
.workspace.view-report .report-summary{padding-bottom:10px}
.workspace.view-report .practice-tip{margin-block:7px}.workspace.view-report .sound-word{min-height:112px}

.workspace.view-chat .chat-bubble{font-size:18px;line-height:1.8}
.workspace.view-chat .chat-suggestions button{font-size:16px;min-height:48px}
.workspace.view-chat .chat-form textarea{font-size:18px}
.workspace.view-chat .chat-error,.workspace.view-chat .poet-profile p{font-size:16px}
.workspace.view-chat .chat-form button{min-width:48px;min-height:48px}

.workspace .explore :is(.explore-eyebrow,.explore-step,.explore-scene-name,.explore-view-label,.explore-gesture,.explore-notice,.explore-feedback,.explore-guide-name,.explore-word small,.explore-loading){font-size:16px;line-height:1.5}
.workspace .explore :is(.explore-mode button,.explore-presets button,.explore-clue,.explore-expand,.explore-next){font-size:16px!important;min-height:48px;padding:8px 12px}
.workspace .explore .explore-answers button{font-size:18px;line-height:1.5;min-height:52px}
.workspace .explore .explore-question legend{font-size:18px;line-height:1.55}
.workspace .explore .explore-card h3{font-size:24px}
.workspace .explore .explore-verse>p{font-size:24px}
.workspace .explore .explore-zoom button{min-width:48px;min-height:48px}
.workspace .explore .explore-word>span{font-size:28px}
.workspace .explore .explore-title-row{flex-wrap:wrap}
.workspace .explore .explore-card{padding:16px;gap:0}
.workspace .explore .explore-card-top{margin-bottom:10px}


@media(max-width:700px){
 :root{--child-body:18px;--child-secondary:16px;--child-action:18px}
 .workspace.lesson-shell{padding:0 12px 12px;height:100dvh}
 .workspace .lesson-bar{gap:8px;margin-bottom:8px;padding:8px 0;min-height:84px}
 .workspace .lesson-title h1{font-size:26px}.workspace .lesson-title p{font-size:17px}
 .workspace .back-library{min-width:48px;width:48px;font-size:16px}.workspace .lesson-menu>summary{font-size:16px;width:48px;height:50px}
 .workspace .view-section{padding:1px}
 .workspace.view-record .record-layout{display:flex;flex-direction:column;gap:8px;justify-content:center;align-items:stretch}
 .workspace.view-record .record-art{max-height:clamp(108px,calc(100dvh - 515px),260px);aspect-ratio:16/9}
 .workspace.view-record .record-landscape{padding:7px 7px 0}
 .workspace.view-record .record-line-nav{grid-template-columns:44px minmax(0,1fr) 44px;min-height:44px}
 .workspace.view-record .record-line-nav>.icon-button{min-width:44px;min-height:44px;width:44px;height:44px}
 .workspace.view-record .record-unfold-note{font-size:16px;line-height:1.4}
 .workspace.view-record .record-tool>.verse{min-height:65px;margin:4px 0 10px}
 .workspace.view-record .record-tool>.verse ruby{font-size:30px;min-width:36px}
 .workspace.view-record .record-tool>.verse.verse-compound ruby{font-size:28px;min-width:35px}
 .workspace.view-record .record-tool>.verse .punct{font-size:28px;width:13px}
 .workspace.view-record .record-model{margin:0 0 12px;gap:8px}
 .workspace.view-record .record-model .button{font-size:18px;min-height:50px;padding:10px 12px}
 .workspace.view-record .record-counter{min-height:28px;font-size:16px}
 .workspace.view-record .record-actions{min-height:78px;gap:8px}
 .workspace.view-record .record-actions .button{font-size:18px;min-height:48px;padding:9px 12px}
 .workspace.view-record .record-feedback .record-actions{display:grid;grid-template-columns:1fr;justify-items:end;gap:7px;min-height:0}
 .workspace.view-record .record-feedback .record-actions .button{min-width:156px;white-space:nowrap}
 .workspace.view-record .mic-button{display:flex;flex-direction:row;min-height:72px;gap:15px;font-size:20px;padding:8px 20px}
 .workspace.view-record .mic-button svg{width:54px;height:54px;padding:16px}
 .workspace.view-record #record-controls{min-height:80px}
 .workspace.view-record .record-bottom{position:static;min-height:48px;gap:0 12px;flex-wrap:wrap;padding:0;margin:0}
 .workspace.view-record .record-bottom .text-button{font-size:18px;min-height:48px}
 .workspace.view-record .record-actions,.workspace.view-record .record-bottom{padding-left:96px}
 .workspace.view-record .record-actions .mic-button{padding-left:0;padding-right:0;gap:11px;white-space:nowrap}
 .workspace.view-record .record-progress{padding:3px 6px 5px;margin:0}
 .workspace.view-record .record-word-hint{font-size:16px;margin:4px 0}.workspace.view-record .record-word-pager{margin:0}
 .workspace.view-write .writing-tool{max-width:min(390px,calc(100dvh - 330px));width:100%}
 .workspace.view-write .writing-controls{grid-template-columns:1fr;gap:7px;margin-top:9px}
 .workspace.view-write .writing-tools{justify-content:space-between;gap:4px}
 .workspace.view-write .writing-controls>.button{width:100%;font-size:18px}
 .workspace.view-write .writing-controls>.button{width:calc(100% - 60px);justify-self:end}
 .workspace.view-write .writing-status{display:flex;align-items:center;justify-content:space-between;gap:6px}
 .workspace.view-write .writing-status .text-button{font-size:16px;white-space:nowrap}
 .workspace.view-write .writing-feedback{font-size:16px;line-height:1.4}
 .workspace.view-report .ai-report-header{display:grid;grid-template-columns:1fr auto;align-items:center;gap:7px}
 .workspace.view-report .ai-report-header>div{display:contents}
 .workspace.view-report .ai-report-header h2{grid-column:1/-1;font-size:24px}
 .workspace.view-report .report-grade-label{gap:0;margin:0;font-size:0}
 .workspace.view-report .report-grade-label select{font-size:16px;min-width:105px}
 .workspace.view-report .ai-report-header>.button{font-size:16px;min-height:44px;padding:8px 11px}
 .workspace.view-report #panel-advice .ai-report-header{padding-left:100px;min-height:128px;display:grid;grid-template-columns:1fr;align-content:center;gap:8px}
 .workspace.view-report #panel-advice .ai-report-header h2{display:none}
 .workspace.view-report #panel-advice .ai-report-header>.button{justify-self:start}
 .workspace.view-report .report-next-activities{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;overflow:visible;padding:8px 0 0;margin-top:6px;min-height:68px}
 .workspace.view-report .report-next-activities a{flex:none;min-height:58px;padding:5px 2px;white-space:nowrap;flex-direction:column;gap:2px;font-size:16px}
 .library{height:auto;min-height:calc(100dvh - 53px);padding:14px 14px 8px}
 .library .library-books{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:none;grid-auto-rows:198px;flex:1;gap:12px}
 .library .poem-card-title h2{font-size:23px}.library .poem-card-title h2 small{font-size:16px}
 .library .poem-author{font-size:16px;letter-spacing:0;white-space:nowrap}.library .poem-open{font-size:16px;min-height:44px;gap:3px}
 .library .poem-grade{font-size:16px}.library .poem-card-body{padding:7px 5px 0}.library .poem-art{height:68px;min-height:68px;flex:none}
 .library .poem-card-title{padding-right:0}
 .library .poem-emblem{top:auto;bottom:7px;right:7px;width:32px;height:32px}
 .library .poem-open{padding-right:38px;font-size:18px;white-space:nowrap}.library .poem-open>svg{display:none}.library .poem-card-title h2 small{display:none}
 .workspace .explore .explore-layout{gap:10px}.workspace .explore .explore-heading h2{font-size:28px}
 .workspace .explore .explore-stage{min-height:110px}.workspace .explore .explore-view-controls{margin-top:7px;gap:6px;flex-wrap:wrap}
 .workspace .explore .explore-gesture{max-width:none;text-align:left;font-size:16px}
 .workspace .explore .explore-card{padding:13px;max-height:none;overflow:visible}.workspace .explore .explore-answers{gap:7px}
 .workspace .explore .explore-card h3{font-size:23px}.workspace .explore .explore-title-row{margin-bottom:7px}
 .workspace .explore .explore-guide{min-height:0}.workspace .explore .explore-guide>img{display:none}
}
@media(max-width:700px) and (max-height:650px){
 .workspace .lesson-bar{min-height:78px;padding:6px 0;margin-bottom:6px}
 .workspace.view-record .record-layout{gap:5px;justify-content:flex-start}
 .workspace.view-record .record-landscape{padding:5px 6px 0}.workspace.view-record .record-art{max-height:58px}
 .workspace.view-record .record-tool>.verse{margin:2px 0 7px;min-height:57px}.workspace.view-record .record-tool>.verse.verse-compound{min-height:102px;gap:1px}
 .workspace.view-record .record-model{margin-bottom:5px}
 .workspace.view-record .record-model .button{min-height:48px;font-size:18px;padding:8px 11px}
 .workspace.view-record .record-actions{min-height:68px}.workspace.view-record .mic-button{min-height:66px;font-size:20px}
 .workspace.view-record .mic-button svg{width:48px;height:48px;padding:14px}
 .workspace.view-record #record-controls{min-height:68px}
 .workspace.view-record .record-bottom .text-button{min-height:46px;font-size:17px}
 .workspace.view-record .record-status{font-size:16px;margin-top:4px}
 .workspace.view-record .record-counter:has([data-action=record-feedback]){position:relative;min-height:28px;padding-right:112px}
 .workspace.view-record .record-counter [data-action=record-feedback]{position:absolute;right:0;top:-8px;min-height:44px;font-size:16px;gap:4px}
 .workspace.view-record .record-counter [data-action=record-feedback] svg{display:none}
 .workspace.view-record .record-feedback .feedback-motif{height:40px;width:40px;margin-bottom:5px}
 .workspace.view-record .record-feedback-title{margin:5px 0 10px}
 .workspace.view-record .record-feedback .record-result{font-size:42px}
 .workspace.view-record .record-review .focus-word{min-height:94px}.workspace.view-record .record-review .focus-word ruby{font-size:50px}
 .workspace.view-record .record-layout:has(.record-tool[data-step=words]) .record-art{max-height:48px}
 .workspace.view-record .record-layout:has(.record-tool[data-step=words]) .record-bottom{gap:0;padding-left:96px;flex-direction:column;align-items:center}
 .workspace.view-record .record-layout:has(.record-tool[data-step=words]) .record-bottom .text-button{min-height:42px;font-size:16px}
 .workspace.view-record .record-layout:has(.record-tool[data-step=words]) .record-word-pager{position:absolute;right:0;top:33px;display:flex;flex-direction:column;gap:0}
 .workspace.view-record .record-layout:has(.record-tool[data-step=words]) .record-practice{position:relative}
 .workspace.view-record .record-layout:has(.record-tool[data-step=words]) .record-tool{padding-right:0}
 .workspace.view-write .writing-tool{max-width:230px}
 .workspace.view-write .writing-toolbar{margin-bottom:6px;min-height:52px}
 .workspace.view-write .writing-pinyin{font-size:26px}.workspace.view-write .writing-counter{font-size:16px}
 .workspace.view-write .writing-controls{margin-top:8px;gap:5px}
 .workspace.view-write .writing-tools .icon-button{width:46px;min-width:46px;min-height:46px;height:46px}
 .workspace.view-write .writing-feedback{margin-top:2px}
 .workspace.view-report .report-prose{font-size:18px;line-height:1.75}.workspace.view-report .report-summary{gap:16px}
 .workspace.view-report .report-summary{display:none}
 .workspace.view-report .report-summary .score-ring{display:none}
 .workspace.view-report .report-summary .eyebrow{display:none}
 .workspace.view-report .dimension-grid{gap:4px}.workspace.view-report .dimension{display:flex;flex-direction:column;padding:3px 2px;min-width:0}
 .workspace.view-report .dimension strong{font-size:23px}.workspace.view-report .dimension span{font-size:16px;line-height:1.1;margin-top:2px}
 .workspace.view-report .dimension:first-child span{font-size:16px}
 .workspace.view-report .report-tabs{margin:7px 0}
 .workspace.view-report .report-line{padding:7px 0 0}
 .workspace.view-report .report-line-heading{display:grid;grid-template-columns:1fr;gap:3px;margin-bottom:6px}
 .workspace.view-report .report-line-heading h3{display:none}
 .workspace.view-report .report-line-heading>.icon-button{display:none}
 .workspace.view-report .report-line-heading>span{font-size:16px;line-height:1.5}
 .workspace.view-report .word-analysis .section-heading{display:none}
 .workspace.view-report .score-line-tabs{gap:7px;padding-top:2px}
 .workspace.view-report .score-line-tabs .icon-button{min-width:44px;width:44px;min-height:44px;height:44px}
 .workspace.view-report .word-analysis .section-heading>.button{font-size:16px;min-height:44px;padding:8px 11px}
 .workspace.view-report .word-analysis .word-grid{gap:7px;padding-bottom:4px}
 .workspace.view-report .word-analysis .word-result{min-height:83px}
 .workspace.view-report .report-line>.button{margin-top:7px;min-height:44px;font-size:16px}
 .workspace.view-report .ai-advice{padding:10px}
 .workspace.view-report .report-prose{padding:10px 12px;margin-top:10px}
 .workspace.view-explore .explore-layout{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:138px minmax(0,1fr);gap:8px;min-height:0}
 .workspace.view-explore .explore-visual{display:flex;flex-direction:column;flex:none;min-height:0;height:138px;position:relative}
 .workspace.view-explore .explore-stage{min-height:0;flex:1;height:auto}
 .workspace.view-explore .explore-view-controls{position:absolute;left:0;right:0;bottom:4px;display:flex;justify-content:center;margin:0;z-index:4}
 .workspace.view-explore .explore-mode{background:#fffef6eb;padding:2px;box-shadow:0 1px 8px #42604816}
 .workspace.view-explore .explore-mode button{min-height:44px;padding:8px 12px;font-size:16px}
 .workspace.view-explore .explore-scene-name,.workspace.view-explore .explore-gesture{display:none}
 .workspace.view-explore .explore-card{min-height:0;align-self:stretch;padding:10px 12px;overflow:auto}
 .workspace.view-explore .explore-card-top{display:none}
 .workspace.view-explore .explore-title-row{gap:6px;flex-wrap:nowrap;margin-bottom:5px}
 .workspace.view-explore .explore-title-row h3{font-size:22px;line-height:1.3}
 .workspace.view-explore .explore-title-row .explore-clue{min-height:44px;font-size:16px!important;padding:8px 9px}
}

/* compact-activities.css */
/* Large labels with less repeated instruction in each exercise state. */
@media(max-width:700px) and (max-height:650px){
 .workspace.view-explore #view .explore-view-controls{left:112px;right:5px;justify-content:flex-end}
 .workspace.view-explore #view .explore-mode button[aria-pressed=true]{display:none}
 .workspace.view-explore #view .explore-expand{left:auto;right:9px}
 .workspace.view-explore #view .explore.is-expanded .explore-layout{display:flex;flex:1;min-height:0}
 .workspace.view-explore #view .explore.is-expanded .explore-visual{height:100%;min-height:0;flex:1}
 .workspace.view-explore #view .explore.is-expanded .explore-view-controls{position:static;justify-content:center;flex:none}
}
.workspace .challenge-shell :is(.challenge-primary,.challenge-secondary,.challenge-text-button,.challenge-listen,.challenge-density button,.challenge-card,.challenge-slot,.challenge-model-tools button,.living-field-tools button){font-size:18px!important;line-height:1.4;min-height:48px}
.workspace .challenge-shell :is(.challenge-eyebrow,.challenge-count small,.challenge-instruction,.challenge-audio-status,.challenge-manipulation-status,.challenge-stage-note,.challenge-slot-label,.challenge-slot-content,.challenge-feedback,.challenge-result-row em,.challenge-result-row small,.challenge-result-extras a,.challenge-kind-note,.living-field-status){font-size:16px!important;line-height:1.45}
.workspace .challenge-shell .challenge-prompt{font-size:24px;line-height:1.4}
.workspace .challenge-shell .challenge-intro-copy h2{font-size:30px}
.workspace .challenge-shell .challenge-intro-copy>p{font-size:18px}
.workspace .challenge-shell .challenge-trip span{font-size:18px;width:38px;height:38px}
.workspace .challenge-shell .challenge-result-row{font-size:18px!important;min-height:52px}
.workspace .challenge-shell .challenge-results-heading h2{font-size:28px}
.workspace .challenge-shell .challenge-results-heading p{font-size:16px!important}
.workspace .challenge-shell .challenge-shelf:has(.challenge-tone)>span{font-size:18px}
.workspace .challenge-shell .challenge-density legend{font-size:18px}
.workspace .challenge-shell .challenge-writing button{font-size:18px;min-height:48px}
.workspace .challenge-shell .challenge-writing .cw-status{font-size:16px}
.workspace .challenge-shell .challenge-footer-actions{padding-left:0;gap:8px}
.workspace .challenge-shell .challenge-feedback [data-ch=show-solution]{font-size:16px!important;min-height:44px;margin-left:0}
.workspace .challenge-shell .challenge-results-actions{flex-wrap:wrap;gap:8px}
.workspace .challenge-shell .challenge-result-extras{flex-wrap:wrap;gap:8px 16px}
.workspace .challenge-shell .challenge-result-extras a{min-height:44px;display:inline-flex;align-items:center}
@media(max-width:700px){
 .workspace.view-quiz .lesson-title p{font-size:16px;white-space:nowrap}.workspace.view-quiz .lesson-bar{min-height:78px}
 .workspace .challenge-shell{padding:10px 12px}
 .workspace .challenge-shell .challenge-prompt{font-size:22px}
 .workspace .challenge-shell .challenge-card,.workspace .challenge-shell .challenge-slot{font-size:16px!important}
 .workspace .challenge-shell .challenge-card>img{height:48px}
 .workspace .challenge-shell .challenge-model-link{font-size:16px!important;min-height:44px}
 .workspace .challenge-shell .challenge-writing .cw-board{width:min(100%,230px)}
 .workspace .challenge-shell .challenge-writing.is-answered .cw-board{width:min(100%,145px)}
 .workspace .challenge-shell .challenge-result-row{gap:6px;padding:6px 8px}
 .workspace .challenge-shell .challenge-intro-art>img:first-child{height:150px}
 .workspace .challenge-shell .challenge-intro-copy h2{font-size:26px;line-height:1.45}
 .workspace .challenge-shell .challenge-results-heading p:not(.challenge-eyebrow){display:none}
 .workspace .challenge-shell .challenge-results-heading{margin-bottom:10px}
 .workspace .challenge-shell .challenge-result-row small{display:none}
 .workspace .challenge-shell .challenge-result-list{gap:5px;margin-bottom:10px}
}
@media(max-width:700px) and (max-height:650px){
 .workspace .challenge-shell .challenge-intro-art{display:none}
 .workspace .challenge-shell.challenge-intro{justify-content:center}
 .workspace .challenge-shell .challenge-intro-copy>p:not(.challenge-eyebrow):not(.challenge-kind-note){display:none}
 .workspace .challenge-shell .challenge-prompt{font-size:22px;line-height:1.35;margin:0 0 6px}
 .workspace .challenge-shell .challenge-instruction,.workspace .challenge-shell .challenge-manipulation-status:empty{display:none}
 .workspace .challenge-shell .challenge-hands-work>.challenge-instruction{display:none}
 .workspace .challenge-shell .challenge-hands-work>.challenge-manipulation-status{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
 .workspace .challenge-shell .challenge-hands-layout{gap:7px;grid-template-columns:76px minmax(0,1fr);padding:0}
 .workspace .challenge-shell .challenge-hands-work>.challenge-prompt{font-size:21px;margin:0}
 .workspace .challenge-shell .challenge-goose,.workspace .challenge-shell .challenge-model-stage{height:78px}
 .workspace .challenge-shell .challenge-model-tools{flex-wrap:wrap;gap:3px}
 .workspace .challenge-shell .challenge-model-tools button{font-size:16px!important;min-height:44px;padding:4px 7px}
 .workspace .challenge-shell .challenge-cards{gap:5px;margin:0}
 .workspace .challenge-shell .challenge-card{padding:4px;gap:3px;min-height:52px;font-size:16px!important}
 .workspace .challenge-shell .challenge-card>img{height:43px}
 .workspace .challenge-shell .challenge-slots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}
 .workspace .challenge-shell .challenge-slots:has(>button:last-child:nth-child(2)){grid-template-columns:repeat(2,minmax(0,1fr))}
 .workspace .challenge-shell .challenge-slots:has(>button:last-child:nth-child(4)){grid-template-columns:repeat(2,minmax(0,1fr))}
 .workspace .challenge-shell .challenge-slot{flex-direction:column;justify-content:center;padding:5px 3px;gap:3px;min-height:70px}
 .workspace .challenge-shell .challenge-slot-label{min-width:0;text-align:center;font-size:16px!important;line-height:1.35}
 .workspace .challenge-shell .challenge-slot-label>b{display:none}
 .workspace .challenge-shell .challenge-slot-content{font-size:16px!important;min-width:0;line-height:1.35;flex-direction:column}
 .workspace .challenge-shell .challenge-slot-content>img{width:40px;height:26px}
 .workspace .challenge-shell .challenge-type-sequence .challenge-slot-content>img{display:none}
 .workspace .challenge-shell .challenge-sound-layout{gap:7px}
 .workspace .challenge-shell .challenge-sound-stage{height:112px;width:168px}
 .workspace .challenge-shell .challenge-pod{height:64px;width:47px;top:25%}
 .workspace .challenge-shell .challenge-stage-note,.workspace .challenge-shell .challenge-model-link{display:none}
 .workspace .challenge-shell .challenge-sound-work>.challenge-audio-status{display:none}
 .workspace .challenge-shell .challenge-shelf{min-height:64px;padding:5px 8px 12px}
 .workspace .challenge-shell .challenge-shelf:has(.challenge-tone){min-height:56px;padding:5px;gap:3px;display:flex;flex-direction:column}
 .workspace .challenge-shell .challenge-shelf:has(.challenge-tone)>span{font-size:16px}
 .workspace .challenge-shell .challenge-tone{width:44px;height:24px}
 .workspace .challenge-shell .challenge-shelves:has(>button:nth-child(4)){grid-template-columns:repeat(2,minmax(0,1fr));gap:5px}
 .workspace .challenge-shell .challenge-writing-layout{gap:3px}
 .workspace .challenge-shell .challenge-writing .cw-board{width:min(100%,170px);margin:3px auto 5px}
 .workspace .challenge-shell .challenge-writing.is-answered .cw-board{width:min(100%,105px)}
 .workspace .challenge-shell .challenge-writing .cw-controls{gap:4px;flex-wrap:nowrap}
 .workspace .challenge-shell .challenge-writing .cw-tools{gap:4px}
 .workspace .challenge-shell .challenge-writing button{padding:7px 9px;font-size:16px;min-height:44px}
 .workspace .challenge-shell .challenge-writing .cw-primary{min-width:90px}
 .workspace .challenge-shell .challenge-writing .cw-status{font-size:16px;line-height:1.4;margin:4px 0;min-height:0}
 .workspace .challenge-shell .challenge-writing .cw-answer{margin:3px 0 5px}
 .workspace .challenge-shell .challenge-writing .cw-review-actions{gap:5px}
 .workspace .challenge-shell .challenge-footer{padding-top:7px}
 .workspace .challenge-shell .challenge-footer-actions{gap:6px;justify-content:flex-end}
 .workspace .challenge-shell .challenge-feedback p{font-size:16px;line-height:1.45;margin:5px 0}
 .workspace .challenge-shell .challenge-feedback [data-ch=show-solution]{min-height:44px;padding:5px 7px}
 .workspace .challenge-shell:has(.has-feedback) .challenge-sound-stage{height:66px;width:110px}
 .workspace .challenge-shell:has(.has-feedback) .challenge-pod{height:54px;width:40px;top:5%}
 .workspace .challenge-shell:has(.has-feedback) .challenge-sound-work>.challenge-prompt{display:none}
 .workspace .challenge-shell:has(.has-feedback) .challenge-observation,.workspace .challenge-shell:has(.has-feedback) .challenge-hands-work>.challenge-prompt{display:none}
 .workspace .challenge-shell:has(.has-feedback) .challenge-hands-layout{display:block}
 .workspace .challenge-shell .challenge-field{height:98px}
 .workspace .challenge-shell .challenge-density{margin-top:4px}
 .workspace .challenge-shell .challenge-density legend{font-size:18px;margin-bottom:4px}
 .workspace .challenge-shell .challenge-density button{min-height:46px}
 .workspace .challenge-shell .living-field-tools{margin-top:3px}
 .workspace .challenge-shell .living-field-tools button{min-height:44px;font-size:16px!important}
 .workspace .challenge-shell.challenge-results{justify-content:flex-start;padding:8px 10px}
 .workspace .challenge-shell .challenge-results-heading h2{font-size:24px;margin:0}
 .workspace .challenge-shell .challenge-results-heading{min-height:46px;gap:8px;margin:0 0 7px}
 .workspace .challenge-shell .challenge-results-heading>img{width:40px;height:40px}
 .workspace .challenge-shell .challenge-result-row{min-height:45px;font-size:16px!important;padding:4px 7px}
 .workspace .challenge-shell .challenge-result-row em{font-size:16px!important;white-space:nowrap}
 .workspace .challenge-shell .challenge-result-row small{display:none}
 .workspace .challenge-shell .challenge-result-list{gap:4px;margin-bottom:6px}
 .workspace .challenge-shell .challenge-results-actions{gap:4px;flex-wrap:nowrap;justify-content:flex-end}
 .workspace .challenge-shell .challenge-results-actions button,.workspace .challenge-shell .challenge-results-actions a{font-size:16px!important;min-height:46px;padding:6px 8px}
 .workspace .challenge-shell .challenge-result-extras{margin-top:3px;gap:2px 10px;justify-content:flex-end;padding-left:86px}
 .workspace .challenge-shell .challenge-result-extras button{font-size:16px!important;min-height:44px;padding:4px 6px}
}

/* extension.css */
/* Optional word practice shares the reading tool and never adds a score. */
.workspace.view-record .record-counter:has(.extension-entry){flex-wrap:wrap;gap:0 12px}
.workspace.view-record .extension-entry{font-size:18px;min-height:48px;white-space:nowrap;padding:5px 0}
.workspace.view-record .record-extension{text-align:center}
.workspace.view-record .record-extension .record-review{margin:6px 0 8px}
.workspace.view-record .record-extension .focus-word{width:140px;min-width:140px;min-height:150px}
.workspace.view-record .record-extension .focus-word ruby{font-size:72px;line-height:1.2}
.workspace.view-record .record-extension .focus-word rt{font-size:24px;line-height:1.4;visibility:visible}
.workspace.view-record .extension-final{font-size:20px;line-height:1.4;margin:8px 0 3px;color:#315e4b}
.workspace.view-record .extension-final strong{font-size:24px;margin-left:8px}
.workspace.view-record .record-extension .record-word-hint{margin:3px 0 8px}
.workspace.view-record .record-extension .record-actions{padding-left:0;min-height:56px}
.workspace.view-record .record-extension .record-actions .button{font-size:18px;min-height:48px}
.workspace.view-record .record-layout:has([data-step=extension]) .record-bottom{display:none}
@media(max-width:700px){
 .workspace.view-record .record-extension .focus-word{width:124px;min-width:124px;min-height:132px;padding:7px 15px}
 .workspace.view-record .record-extension .focus-word ruby{font-size:64px}
 .workspace.view-record .record-extension .focus-word rt{font-size:22px}
 .workspace.view-record .record-tool[data-step=extension]>.record-counter{min-height:28px}
}

/* animation.css */
.view-animation .study-main{max-width:1040px}
.view-animation .view-section{display:flex;align-items:center}
.animation-lesson{display:flex;flex-direction:column;gap:14px;width:100%;height:100%;max-height:760px;min-height:0;padding-bottom:4px}
.animation-heading{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-shrink:0}
.animation-heading h2{margin:0;color:var(--green);font-size:30px;line-height:1.35}
.animation-heading p{margin:0;color:var(--muted);font-size:20px;line-height:1.5}
.animation-stage{display:flex;align-items:center;justify-content:center;flex:1;min-height:150px;overflow:hidden;border-radius:18px;background:#1c2828}
.animation-stage video{display:block;width:100%;height:100%;min-height:0;object-fit:contain;outline-offset:-4px}
.animation-status{margin:0;text-align:center;color:var(--green);font-size:18px;line-height:1.5;flex-shrink:0}
.animation-status[hidden]{display:none}
.animation-actions{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;padding-left:100px;flex-shrink:0}
.workspace .animation-actions .button{font-size:20px;min-height:58px;padding:12px 22px;border-radius:14px;white-space:nowrap}
.animation-actions .button svg{width:24px;height:24px}
@media(max-width:700px){
 .view-animation .view-section{align-items:flex-start}
 .animation-lesson{height:auto;min-height:100%;max-height:none;justify-content:center;gap:14px;padding-bottom:88px}
 .animation-heading{justify-content:center;flex-wrap:wrap;gap:4px 14px}
 .animation-heading h2{font-size:28px}.animation-heading p{font-size:18px}
 .animation-stage{flex:none;aspect-ratio:16/9;width:100%;min-height:0;border-radius:12px}
 .animation-actions{padding-left:0;gap:10px;flex-direction:column}
 .workspace .animation-actions .button{min-width:220px;min-height:54px;font-size:20px;padding:10px 18px}
 .animation-status{font-size:18px}
}
@media(max-height:550px) and (orientation:landscape){
 body[data-screen=animation] #shishi-guide-host{display:none}
 .animation-lesson{display:grid;grid-template-columns:minmax(0,1fr) 190px;grid-template-rows:auto minmax(0,1fr) auto;gap:7px 14px;height:100%;min-height:0;padding-bottom:4px}
 .animation-heading{grid-column:1/-1;justify-content:space-between}.animation-heading h2{font-size:24px}.animation-heading p{font-size:18px}
 .animation-stage{grid-column:1;grid-row:2/4;aspect-ratio:auto;height:100%;min-height:100px}
 .animation-actions{grid-column:2;grid-row:2;flex-direction:column;padding-left:0;gap:10px}
 .workspace .animation-actions .button{min-width:0;width:100%;min-height:48px;font-size:18px;padding:8px 10px}
 .animation-status{grid-column:2;grid-row:3;font-size:16px}
}

/* mobile-tablet.css */
/* Touch layouts: keep the task, its controls and its next action together. */
.workspace .lesson-bar:has(.shishi-touch-slot) {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) 48px auto;
}
.workspace .lesson-bar > .back-library { grid-column: 1; grid-row: 1; }
.workspace .lesson-bar > .lesson-title { grid-column: 2; grid-row: 1; }
.workspace .lesson-bar > .shishi-touch-slot { grid-column: 3; grid-row: 1; align-self: center; justify-self: center; }
.workspace .lesson-bar > .lesson-tools { grid-column: 4; grid-row: 1; }
.workspace .lesson-heading { min-width: 0; }
.workspace .lesson-title p { max-width: 100%; overflow-wrap: anywhere; }
.workspace.view-quiz .lesson-title p { white-space: normal; text-wrap: balance; }
.report-empty .empty-shishi,
.completion > img.shishi-complete,
.explore-finish-shishi,
.explore-guide > img,
.explore-guide-name,
.shishi-note > img,
.shishi-note strong { display: none !important; }
.workspace.view-quiz .challenge-writing-layout { flex-shrink: 0; min-height: min-content; }
@media (min-width: 701px) {
  .workspace.view-quiz .challenge-body { justify-content: safe center; }
}
@media (max-width: 1180px) {
  .workspace.lesson-shell {
    padding-inline: max(16px, env(safe-area-inset-left)) max(16px, env(safe-area-inset-right));
    padding-bottom: max(16px, env(safe-area-inset-bottom));
  }
  .workspace .lesson-bar { gap: 12px; }
  .workspace .lesson-title { min-width: 0; }
  .workspace .lesson-title h1 { text-wrap: balance; }
  .workspace :is(.button, .text-button) { justify-content: center; text-align: center; }
  .workspace.view-record .record-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
    grid-template-rows: minmax(0, 1fr) auto;
    gap: 12px 24px;
    padding: 18px;
    align-content: center;
  }
  .workspace.view-record .record-landscape { grid-column: 1; grid-row: 1 / 3; width: 100%; margin: 0; }
  .workspace.view-record .record-practice { grid-column: 2; grid-row: 1; padding: 0; align-self: end; }
  .workspace.view-record .record-tool { width: 100%; max-width: 500px; padding: 0; }
  .workspace.view-record .record-art { max-height: min(48dvh, 390px); }
  .workspace.view-record .record-counter { min-height: 44px; gap: 8px; flex-wrap: wrap; padding: 0; }
  .workspace.view-record .record-counter:has([data-action="record-feedback"]) { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); }
  .workspace.view-record .record-counter:has([data-action="record-feedback"]) > span { justify-self: start; white-space: nowrap; }
  .workspace.view-record .record-counter [data-action="record-feedback"] { grid-column: 2; justify-self: center; }
  .workspace.view-record .record-counter:has([data-action="record-feedback"]) > .extension-entry { justify-self: end; white-space: nowrap; }
  .workspace.view-record .record-counter [data-action="record-feedback"] { position: static; font-size: 16px; min-height: 44px; }
  .workspace.view-record .record-actions { padding: 0; justify-content: center; flex-wrap: wrap; }
  .workspace.view-record .record-recovery { text-align: center; }
  .workspace.view-record .record-recovery .record-status { margin: 8px 0; }
  .workspace.view-record .record-recovery .record-actions { min-height: 52px; width: 100%; }
  .workspace.view-record .record-recovery .record-actions .button { flex: 0 1 auto; min-width: 140px; white-space: nowrap; }
  .workspace.view-record .record-recovery > .text-button { margin-inline: auto; }
  .workspace.view-record .record-feedback .record-actions { display: flex; justify-content: center; }
  .workspace.view-record .record-feedback .record-actions .button { min-width: 142px; }
  .workspace.view-record .record-bottom,
  .workspace.view-record .record-layout:has(.record-tool[data-step="words"]) .record-bottom {
    position: static; grid-column: 2; grid-row: 2; align-self: start;
    display: flex; justify-content: center; align-items: center;
    width: 100%; min-height: 48px; margin: 0; padding: 0; gap: 8px;
  }
  .workspace.view-record .record-bottom:empty { display: none; }
  .workspace.view-record .record-bottom .text-button { width: max-content; max-width: 100%; }
  .workspace.view-record .record-review { justify-content: center; }
  .workspace.view-record .record-word-pager,
  .workspace.view-record .record-layout:has(.record-tool[data-step="words"]) .record-word-pager {
    position: static; display: flex; flex-direction: row; justify-content: center; gap: 16px; margin: 6px 0;
  }
  .workspace.view-report .report-next-activities { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .workspace.view-report .report-next-activities a { justify-content: center; padding: 8px 4px; min-height: 52px; }
  .workspace.view-report .ai-report-header { align-items: center; }
  .workspace.view-report #panel-advice .ai-report-header { padding: 0; min-height: 0; }
  .workspace.view-report .report-prose { margin-top: 12px; }
  .workspace.view-write .writing-controls > .button { width: 100%; justify-self: stretch; }
  .workspace.view-write .writing-status { gap: 8px; flex-wrap: wrap; }
  .workspace.view-quiz .challenge-footer-actions { padding: 0; justify-content: center; }
  .workspace.view-quiz .challenge-intro { overflow-y: auto; }
  .workspace.view-quiz .challenge-results-actions,
  .workspace.view-quiz .challenge-result-extras { padding: 0; justify-content: center; flex-wrap: wrap; }
  .workspace.view-animation .animation-actions { padding-left: 0; }
  .workspace.view-chat .chat-bubble { overflow-wrap: anywhere; }
  .workspace.view-chat .chat-form { gap: 8px; }
  .workspace.view-chat .chat-form textarea { min-height: 48px; line-height: 1.5; }
  .workspace.view-chat .chat-error { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 6px 12px; text-align: center; }
  .workspace.view-chat .chat-error:empty { display: none; }
  .workspace.view-chat .chat-retry { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 6px 14px; font-size: 17px; white-space: nowrap; }
}

/* A portrait tablet has room for a generous picture above the reading task. */
@media (min-width: 701px) and (max-width: 1024px) and (orientation: portrait) {
  .workspace.view-record .record-layout {
    display: flex; flex-direction: column; justify-content: center;
    gap: 14px; padding: 20px; max-width: 760px; margin-inline: auto;
  }
  .workspace.view-record .record-landscape { width: min(100%, 620px); flex: 0 0 auto; }
  .workspace.view-record .record-art { height: min(29dvh, 310px); max-height: none; aspect-ratio: 16 / 9; }
  .workspace.view-record .record-practice { flex: 0 0 auto; width: 100%; align-self: center; }
  .workspace.view-record .record-bottom { flex: 0 0 auto; align-self: center; }
  .workspace.view-record .record-counter { justify-content: space-between; }
  .workspace.view-record .mic-button { flex-direction: row; min-height: 78px; gap: 18px; }
  .workspace.view-record .mic-button svg { width: 62px; height: 62px; padding: 18px; }
  .workspace.view-record #record-controls { min-height: 88px; }
  .workspace.view-record .record-model { margin-bottom: 14px; }
  .workspace.view-lesson .lesson-map { max-width: 680px; }
  .workspace.view-lesson .lesson-map-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .workspace.view-lesson .lesson-map-step { min-height: 190px; }
}

@media (max-width: 700px) {
  .workspace.lesson-shell { padding-inline: 12px; }
  .workspace .lesson-bar { min-height: 82px; margin-bottom: 8px; padding-block: 8px; gap: 6px; }
  .workspace .lesson-title h1 { font-size: clamp(23px, 6.6vw, 28px); }
  .workspace .lesson-title p { font-size: 16px; }
  .workspace .menu-panel { max-width: calc(100vw - 24px); }
  .workspace.view-record .record-layout {
    display: flex; flex-direction: column; align-items: stretch; justify-content: center;
    gap: 10px; padding: 0; border: 0; background: transparent;
    min-height: 100%; height: auto; max-width: 500px; margin-inline: auto;
  }
  .workspace.view-record .record-landscape { flex: 0 0 auto; padding: 7px 7px 0; }
  .workspace.view-record .record-art {
    height: clamp(82px, calc(100dvh - 565px), 215px);
    max-height: none; width: 100%; aspect-ratio: 16 / 9;
  }
  .workspace.view-record .record-practice { display: block; flex: 0 0 auto; align-self: stretch; }
  .workspace.view-record .record-tool { padding: 0 3px; }
  .workspace.view-record .record-counter { justify-content: space-between; min-height: 40px; gap: 4px 8px; }
  .workspace.view-record .record-counter > span { flex-shrink: 0; }
  .workspace.view-record .record-counter .text-button { min-height: 40px; font-size: 16px; padding: 5px 3px; }
  .workspace.view-record .record-counter:has([data-action="record-feedback"]) { padding: 0; }
  .workspace.view-record .record-tool > .verse { margin: 4px 0 12px; min-height: 66px; }
  .workspace.view-record .record-tool > .verse ruby { font-size: 30px; min-width: 36px; }
  .workspace.view-record .record-model { gap: 10px; margin-bottom: 12px; }
  .workspace.view-record .record-model .button { min-height: 50px; padding: 10px 13px; }
  .workspace.view-record .record-actions { min-height: 76px; gap: 10px; padding: 0; }
  .workspace.view-record .record-actions .mic-button { padding: 8px 12px; gap: 16px; min-height: 76px; }
  .workspace.view-record #record-controls { min-height: 80px; }
  .workspace.view-record .record-bottom { flex: 0 0 auto; align-self: center; min-height: 48px; padding: 0; }
  .workspace.view-record .record-feedback .record-actions { flex-wrap: wrap; }
  .workspace.view-record .record-feedback .record-actions .button { flex: 1; max-width: 210px; min-width: 130px; }
  .workspace.view-record .record-layout:has(.record-tool[data-step="words"]) .record-art { max-height: none; }
  .workspace.view-record .record-word-heading { gap: 12px; }
  .workspace.view-record .record-word-hint { text-align: center; margin: 8px 0; }
  .workspace.view-record .record-word-pager:has(button:first-child:disabled):has(button:last-child:disabled) { display: none; }
  .workspace.view-record .record-review { margin: 8px 0; }
  .workspace.view-record .record-feedback-title { margin-block: 8px 16px; }
  .workspace.view-report #view { overflow: hidden; }
  .workspace.view-report .report-tabs { margin: 4px 0 12px; padding: 4px; }
  .workspace.view-report .report-tabs button { padding: 8px 4px; font-size: 18px; }
  .workspace.view-report .ai-advice { padding: 12px; }
  .workspace.view-report #panel-advice .ai-report-header {
    display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px 8px;
    min-height: 0; padding: 0; margin-bottom: 10px;
  }
  .workspace.view-report #panel-advice .ai-report-header h2 { display: block; grid-column: 1 / -1; margin: 0; text-align: center; font-size: 24px; }
  .workspace.view-report #panel-advice .ai-report-header > .button { justify-self: end; min-height: 48px; font-size: 17px; }
  .workspace.view-report .report-grade-label select { min-height: 48px; }
  .workspace.view-report .report-prose { padding: 12px; font-size: 18px; line-height: 1.8; margin-top: 10px; }
  .workspace.view-report .report-next-activities { flex-shrink: 0; gap: 4px; margin-top: 8px; min-height: 70px; }
  .workspace.view-report .report-next-activities a { flex-direction: column; font-size: 16px; gap: 4px; padding: 6px 0; }
  .workspace.view-report .practice-card-heading { flex-wrap: wrap; justify-content: center; gap: 6px 12px; }
  .workspace.view-report .practice-card-heading h3 { font-size: 23px; }
  .workspace.view-report .practice-tip { font-size: 17px; line-height: 1.65; }
  .workspace.view-report .report-line-heading { flex-wrap: wrap; }
  .workspace.view-report .word-analysis .word-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; overflow: visible; }
  .workspace.view-report .word-analysis .word-result { width: 100%; min-width: 0; }
  .workspace.view-report .report-summary { gap: 14px; }
  .workspace.view-report .dimension span { font-size: 15px; }
  .workspace.view-write .writing-tool { width: 100%; max-width: min(390px, calc(100dvh - 335px)); }
  .workspace.view-write .writing-controls { display: grid; grid-template-columns: 1fr; gap: 10px; }
  .workspace.view-write .writing-controls > .button { width: 100%; min-height: 50px; }
  .workspace.view-write .writing-tools { justify-content: space-between; }
  .workspace.view-write .writing-status { justify-content: center; text-align: center; }
  .workspace.view-write .writing-feedback:empty { display: none; }
  .workspace.view-quiz .challenge-intro { overflow-y: auto; }
  .workspace.view-quiz .challenge-intro-copy { text-align: center; }
  .workspace.view-quiz .challenge-trip { justify-content: center; }
  .workspace.view-quiz .challenge-intro-copy > .challenge-text-button { margin-inline: auto; }
  .workspace.view-quiz .challenge-footer-actions { width: 100%; justify-content: center; }
  .workspace.view-quiz .challenge-footer-actions .challenge-primary { flex: 1; max-width: 260px; }
  .workspace.view-quiz .challenge-results-actions { display: grid; width: 100%; grid-template-columns: 1fr; }
  .workspace.view-quiz .challenge-results-actions > * { justify-content: center; text-align: center; }
  .workspace.view-quiz .challenge-result-extras { margin-top: 8px; gap: 8px 14px; }
  .workspace.view-lesson #view { overflow-y: auto; }
  .workspace.view-lesson .lesson-map { min-height: 100%; justify-content: center; padding-block: 6px; }
  .workspace.view-lesson .lesson-map-extras a { flex-direction: column; gap: 4px; min-height: 66px; }
  .workspace.view-chat .chat-messages { padding: 8px 2px 14px; }
  .workspace.view-chat .chat-bubble { padding: 12px 14px; max-width: calc(100% - 43px); }
  .workspace.view-chat .chat-suggestions { scroll-padding-inline: 4px; padding: 8px 2px; }
  .workspace.view-chat .chat-form { min-height: 64px; }
  .workspace.view-animation .animation-lesson { padding-bottom: 0; }
  .workspace.view-animation .animation-actions { width: 100%; }
  .workspace.view-animation .animation-actions .button { width: min(100%, 330px); }
  .video-dialog { width: calc(100vw - 24px); max-height: calc(100dvh - 24px); padding: 14px; }
  .video-dialog .dialog-heading { gap: 8px; }
  .video-dialog h2 { font-size: 23px; }
}

/* At the narrowest phones the result link and the optional extension word
   must have their own grid cells.  Keeping both in one centred row makes the
   two hit areas overlap around 320px wide screens. */
@media (max-width: 360px) {
  .workspace.view-record .record-counter:has([data-action="record-feedback"]) {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    grid-template-rows: auto auto;
    align-items: center;
    row-gap: 2px;
    min-height: 62px;
  }
  .workspace.view-record .record-counter:has([data-action="record-feedback"]) > span {
    grid-column: 1 / -1;
    grid-row: 1;
    justify-self: center;
  }
  .workspace.view-record .record-counter:has([data-action="record-feedback"]) [data-action="record-feedback"] {
    grid-column: 1;
    grid-row: 2;
    justify-self: start;
    min-width: 0;
    white-space: nowrap;
  }
  .workspace.view-record .record-counter:has([data-action="record-feedback"]) > .extension-entry {
    grid-column: 2;
    grid-row: 2;
    justify-self: end;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}

@media (max-width: 700px) and (max-height: 700px) {
  .workspace.view-record .record-layout { justify-content: flex-start; gap: 6px; }
  .workspace.view-record .record-art { height: clamp(58px, calc(100dvh - 550px), 145px); }
  .workspace.view-record .record-tool > .verse { margin: 2px 0 8px; }
  .workspace.view-record .record-tool > .verse.verse-compound { min-height: 102px; }
  .workspace.view-record .record-model { margin-bottom: 7px; }
  .workspace.view-record .record-review { margin: 4px 0; }
  .workspace.view-record .record-actions { min-height: 68px; }
  .workspace.view-record .record-actions .mic-button { min-height: 68px; }
  .workspace.view-record #record-controls { min-height: 72px; }
  .workspace.view-record .record-word-pager { margin: 0; }
  .workspace.view-write .writing-tool { max-width: min(100%, 270px, calc(100dvh - 330px)); }
  .workspace.view-quiz .challenge-results-actions { gap: 7px; }
  .workspace.view-lesson .lesson-map { justify-content: flex-start; gap: 10px; }
  .workspace.view-lesson .lesson-map-step { min-height: 140px; }
}

/* A phone turned sideways keeps the picture and controls alongside each other. */
@media (max-width: 1180px) and (max-height: 550px) and (orientation: landscape) {
  .workspace .lesson-bar { min-height: 66px; padding-block: 5px; margin-bottom: 5px; }
  .workspace .lesson-title h1 { font-size: 24px; }
  .workspace .lesson-title p { font-size: 16px; }
  .workspace.view-record .record-layout {
    display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
    grid-template-rows: minmax(0, 1fr) auto; gap: 2px 20px;
    height: auto; min-height: 100%; padding: 6px; max-width: none;
  }
  .workspace.view-record .record-art { height: clamp(80px, calc(100dvh - 200px), 190px); max-height: none; }
  .workspace.view-record .record-landscape { grid-column: 1; grid-row: 1 / 3; }
  .workspace.view-record .record-practice { grid-column: 2; grid-row: 1; align-self: center; }
  .workspace.view-record .record-bottom { grid-column: 2; grid-row: 2; }
  .workspace.view-record .record-counter { min-height: 36px; }
  .workspace.view-record .record-tool > .verse { min-height: 56px; margin: 2px 0 6px; }
  .workspace.view-record .record-model { margin-bottom: 6px; }
  .workspace.view-record .record-model .button { min-height: 44px; padding: 7px 11px; }
  .workspace.view-record .mic-button { flex-direction: row; min-height: 58px; font-size: 19px; gap: 14px; }
  .workspace.view-record .mic-button svg { width: 44px; height: 44px; padding: 13px; }
  .workspace.view-record .record-actions,
  .workspace.view-record #record-controls { min-height: 62px; }
  .workspace.view-record .record-tool[data-step="words"] { display: grid; grid-template-columns: 116px minmax(0, 1fr); gap: 4px 12px; }
  .workspace.view-record .record-tool[data-step="words"] > .record-counter { grid-column: 1 / -1; }
  .workspace.view-record .record-tool[data-step="words"] > .record-review { grid-column: 1; grid-row: 2 / 6; align-self: center; margin: 0; }
  .workspace.view-record .record-tool[data-step="words"] > :is(.record-word-heading, .record-word-hint, .record-word-pager, .record-actions) { grid-column: 2; }
  .workspace.view-record .record-tool[data-step="words"] > .record-word-heading { flex-wrap: wrap; justify-content: center; }
  .workspace.view-record .record-tool[data-step="words"] > .record-word-hint { margin: 0; }
  .workspace.view-record .record-tool[data-step="words"] .focus-word { min-height: 100px; }
  .workspace.view-record .record-tool[data-step="words"] .focus-word ruby { font-size: 48px; }
  .workspace.view-record .record-word-pager:has(button:first-child:disabled):has(button:last-child:disabled) { display: none; }
  .workspace.view-report .report-summary { display: none; }
  .workspace.view-report .report-tabs { margin: 0 0 8px; }
  .workspace.view-report .report-next-activities { margin-top: 5px; padding-top: 5px; min-height: 48px; }
  .workspace.view-report .report-next-activities a { min-height: 44px; }
  .workspace.view-quiz .challenge-intro { padding: 14px 22px; gap: 20px; }
  .workspace.view-quiz .challenge-intro-art > img:first-child { max-height: 210px; }
  .workspace.view-quiz .challenge-intro-copy h2 { font-size: 24px; margin: 4px 0 8px; line-height: 1.4; }
  .workspace.view-quiz .challenge-intro-copy > .challenge-eyebrow { display: none; }
  .workspace.view-quiz .challenge-intro-copy > p:not(.challenge-eyebrow) { margin-bottom: 8px; font-size: 17px; line-height: 1.5; }
  .workspace.view-quiz .challenge-trip { margin: 10px 0; }
  .workspace.view-lesson .lesson-map { padding: 0; gap: 8px; }
  .workspace.view-lesson .lesson-map-hero { display: none; }
  .workspace.view-lesson .lesson-map-steps { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .workspace.view-lesson .lesson-map-step { min-height: 145px; padding: 12px; }
  .workspace.view-lesson .lesson-map-extras a { flex-direction: row; min-height: 48px; }
}

/* Portrait activity hubs use the whole panel, with large, equally sized targets. */
@media (max-width: 1024px) and (orientation: portrait) {
  .workspace.view-lesson .lesson-map {
    display: grid; grid-template-rows: auto minmax(0, 1fr) auto;
    height: 100%; min-height: 0; max-width: 760px;
    justify-content: stretch; gap: 14px; padding-block: 6px 0;
  }
  .workspace.view-lesson .lesson-map .lesson-map-hero { min-height: 46px; gap: 12px; }
  .workspace.view-lesson .lesson-map .lesson-map-hero h2 { font-size: 25px; }
  .workspace.view-lesson .lesson-map .lesson-map-steps {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-rows: minmax(0, 1fr); min-height: 0; gap: 12px;
  }
  .workspace.view-lesson .lesson-map .lesson-map-step {
    min-height: 0; padding: 20px 16px; justify-content: center;
    gap: clamp(16px, 3dvh, 30px); border-radius: 20px;
  }
  .workspace.view-lesson .lesson-map .lesson-map-step-top { margin: 0; gap: 8px; }
  .workspace.view-lesson .lesson-map .lesson-map-step-icon { width: 34px; height: 34px; }
  .workspace.view-lesson .lesson-map .lesson-map-step-icon svg { width: 31px; height: 31px; }
  .workspace.view-lesson .lesson-map .lesson-map-step h3 { font-size: clamp(22px, 3.4vw, 28px); line-height: 1.4; }
  .workspace.view-lesson .lesson-map .lesson-map-status { font-size: 18px; line-height: 1.5; margin-top: 9px; text-wrap: balance; }
  .workspace.view-lesson .lesson-map.lesson-map-lower .lesson-map-steps { grid-template-columns: minmax(0, 1fr); }
  .workspace.view-lesson .lesson-map.lesson-map-lower .lesson-map-step {
    display: grid; grid-template-columns: 64px minmax(0, 1fr);
    align-items: center; justify-content: initial; gap: 20px; padding: 18px 24px;
  }
  .workspace.view-lesson .lesson-map.lesson-map-lower .lesson-map-step-top { justify-content: center; }
  .workspace.view-lesson .lesson-map.lesson-map-lower .lesson-map-step h3 { font-size: clamp(25px, 3.8vw, 30px); }
  .workspace.view-lesson .lesson-map .lesson-map-extras { padding-top: 5px; max-width: 280px; }
  .workspace.view-lesson .lesson-map .lesson-map-extras button { min-height: 52px; font-size: 19px; }
}
@media (max-width: 360px) and (orientation: portrait) {
  .workspace.view-lesson .lesson-map { gap: 10px; }
  .workspace.view-lesson .lesson-map .lesson-map-step { padding: 12px; gap: 12px; }
  .workspace.view-lesson .lesson-map .lesson-map-step h3 { font-size: 21px; }
  .workspace.view-lesson .lesson-map .lesson-map-status { font-size: 17px; margin-top: 6px; }
  .workspace.view-lesson .lesson-map.lesson-map-lower .lesson-map-step { grid-template-columns: 49px minmax(0, 1fr); padding: 12px 15px; gap: 14px; }
  .workspace.view-lesson .lesson-map.lesson-map-lower .lesson-map-step h3 { font-size: 24px; }
}
@media (max-width: 700px) and (min-height: 701px) and (orientation: portrait) {
  .workspace.view-lesson .lesson-map .lesson-map-steps { grid-template-columns: minmax(0, 1fr); }
  .workspace.view-lesson .lesson-map .lesson-map-step {
    display: grid; grid-template-columns: 62px minmax(0, 1fr);
    align-items: center; justify-content: initial; gap: 18px; padding: 18px 22px;
  }
  .workspace.view-lesson .lesson-map .lesson-map-step-top { justify-content: center; gap: 7px; }
  .workspace.view-lesson .lesson-map .lesson-map-step-arrow { display: none; }
  .workspace.view-lesson .lesson-map .lesson-map-step h3 { font-size: 26px; }
  .workspace.view-lesson .lesson-map .lesson-map-status { margin-top: 5px; }
}
@media (max-width: 1024px) and (max-height: 700px) and (orientation: portrait) {
  .workspace.view-lesson .lesson-map { gap: 9px; padding-top: 2px; }
  .workspace.view-lesson .lesson-map .lesson-map-hero { min-height: 36px; }
  .workspace.view-lesson .lesson-map .lesson-map-hero h2 { font-size: 22px; }
  .workspace.view-lesson .lesson-map .lesson-map-steps { gap: 9px; }
  .workspace.view-lesson .lesson-map .lesson-map-step { gap: 10px; }
  .workspace.view-lesson .lesson-map .lesson-map-extras button { min-height: 46px; }
}

/* exploration-touch.css */
/* One observation at a time; phones separate looking from answering. */
.explore-observe-task,.explore-answer-entry,.explore-back-picture{display:none}
.shishi-touch-slot{flex:0 0 48px;width:48px;height:56px;position:relative;align-self:center}
.shishi-touch-slot .shishi-guide{position:relative;left:auto;top:auto;bottom:auto;width:48px;height:56px;z-index:35}
.shishi-touch-slot .shishi-guide-button{width:48px;height:56px;cursor:pointer;touch-action:manipulation}
.shishi-touch-slot .shishi-guide-art{width:56px;height:56px;transform-origin:50% 80%}
.shishi-touch-slot .shishi-bubble{max-height:calc(100dvh - 32px);overscroll-behavior:contain}

@media(max-width:1100px),(pointer:coarse){
 .workspace.view-explore #view{overflow:auto;overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch}
 .workspace.view-explore #view .explore{height:auto;min-height:100%;gap:14px;padding-bottom:10px}
 .workspace.view-explore #view .explore-heading{display:none}
 .workspace.view-explore #view .explore-layout{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:auto;gap:20px;min-height:0;flex:1}
 .workspace.view-explore #view .explore-visual{height:auto;min-height:0;position:relative;flex:none}
 .workspace.view-explore #view .explore-stage{flex:1;min-height:290px;border-radius:20px;box-shadow:none}
 .workspace.view-explore #view .explore-view-controls{position:static;display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin:12px 0 0}
 .workspace.view-explore #view .explore-mode{display:grid;grid-template-columns:1fr 1fr;gap:4px;width:100%;padding:4px;border-radius:16px}
 .workspace.view-explore #view .explore-mode button{display:flex;justify-content:center;min-height:48px;font-size:18px;padding:8px 12px;border-radius:12px}
 .workspace.view-explore #view .explore-gesture{display:none}
 .workspace.view-explore #view .explore-expand{left:auto;right:10px;top:10px;width:auto;min-height:44px;padding:9px 11px;font-size:16px!important}
 .workspace.view-explore #view .explore-expand span{display:inline}
 .workspace.view-explore #view .explore-view-label{top:auto;bottom:12px;right:12px;font-size:16px;max-width:calc(100% - 24px)}
 .workspace.view-explore #view .explore-scene-name{display:none}
 .workspace.view-explore #view .explore-model-tools{position:static;display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:10px;padding:0;background:none}
 .workspace.view-explore #view .explore-presets{display:flex;flex:1;gap:8px}
 .workspace.view-explore #view .explore-presets button{flex:1;min-height:46px;font-size:17px;padding:8px}
 .workspace.view-explore #view .explore-zoom{margin:0;gap:7px;justify-content:center}
 .workspace.view-explore #view .explore-zoom button{width:46px;min-height:46px}
 .workspace.view-explore #view .explore-card{align-self:stretch;min-height:0;max-height:none;overflow:visible;border-radius:20px;padding:18px;box-shadow:none}
 .workspace.view-explore #view .explore-card-top{display:flex;margin-bottom:12px}
 .workspace.view-explore #view .explore-step{font-size:16px;letter-spacing:0}
 .workspace.view-explore #view .explore-title-row{gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:10px}
 .workspace.view-explore #view .explore-card h3{font-size:23px;line-height:1.4;margin:0}
 .workspace.view-explore #view .explore-clue{font-size:16px!important;min-height:44px;padding:8px 12px}
 .workspace.view-explore #view .explore-verse{gap:10px;min-height:68px;margin:0 0 14px;padding:10px 0}
 .workspace.view-explore #view .explore-verse>p{font-size:24px;line-height:1.7;letter-spacing:.5px;text-wrap:balance}
 .workspace.view-explore #view .explore-word{min-width:64px;min-height:62px;padding:5px 8px}
 .workspace.view-explore #view .explore-word>span{font-size:28px}
 .workspace.view-explore #view .explore-word small{font-size:15px}
 .workspace.view-explore #view .explore-question legend{font-size:21px;line-height:1.5;margin-bottom:14px}
 .workspace.view-explore #view .explore-answers{gap:12px}
 .workspace.view-explore #view .explore-answers button{font-size:20px;line-height:1.5;min-height:60px;padding:12px;border-radius:14px}
 .workspace.view-explore #view .explore-answer-dot{width:22px;height:22px}
 .workspace.view-explore #view .explore-guide{min-height:0;margin:14px 0;padding:10px 12px;background:#f1f5e9;border-radius:12px}
 .workspace.view-explore #view .explore-guide>img,.workspace.view-explore #view .explore-guide-name{display:none}
 .workspace.view-explore #view .explore-feedback{font-size:17px;line-height:1.65;min-height:0;margin:0}
 .workspace.view-explore #view .explore-next{font-size:19px;line-height:1.5;min-height:52px;padding:11px 15px;border-radius:14px;flex:none}
 .workspace.view-explore #view .explore-next:disabled{display:none}
 .workspace.view-explore #view .explore-notice,.workspace.view-explore #view .explore-loading{font-size:16px;line-height:1.5}
 .workspace.view-explore #view .explore-finish{margin:15px 0 24px}
 .workspace.view-explore #view .explore-finish p{font-size:20px;line-height:1.8;margin-top:15px}
 .workspace.view-explore #view .explore-finish>.explore-finish-shishi{width:105px;height:118px;margin:0 auto 18px}
 .workspace.view-explore #view .explore-again{font-size:18px;min-height:48px}
 .workspace.view-explore #view .explore.is-expanded .explore-layout{display:flex}
 .workspace.view-explore #view .explore.is-expanded .explore-stage{height:calc(100dvh - 270px);min-height:250px;flex:auto}
 .workspace.view-explore #view .explore.is-expanded .explore-visual{width:100%}
 .workspace.view-explore #view .explore.is-expanded .explore-card{display:none}
}

@media(max-width:820px){
 .workspace.view-explore #view .explore-layout{display:block;padding:0;flex:none}
 .workspace.view-explore #view .explore-visual{display:flex;gap:0}
 .workspace.view-explore #view .explore-observe-task{display:block;margin-bottom:14px}
 .workspace.view-explore #view .explore-observe-task>span{display:block;font-size:16px;line-height:1.4;color:#708467;margin-bottom:5px}
 .workspace.view-explore #view .explore-observe-task h3{font-size:24px;line-height:1.4;margin:0 0 7px;color:#365d49;outline:none}
 .workspace.view-explore #view .explore-observe-task p{font-size:18px;line-height:1.6;margin:0;color:#64765c}
 .workspace.view-explore #view .explore-stage{height:clamp(190px,34dvh,370px);min-height:190px;flex:none;aspect-ratio:auto}
 .workspace.view-explore #view .explore:not(.is-expanded) .explore-expand{width:44px;min-height:44px;justify-content:center;padding:10px;border-radius:14px}
 .workspace.view-explore #view .explore:not(.is-expanded) .explore-expand span{display:none}
 .workspace.view-explore #view .explore-answer-entry{display:flex;margin-top:16px}
 .workspace.view-explore #view .explore[data-mobile-step=observe] .explore-card{display:none}
 .workspace.view-explore #view .explore[data-mobile-step=question] .explore-visual{display:none}
 .workspace.view-explore #view .explore-card{position:relative;padding:16px;min-height:0}
 .workspace.view-explore #view .explore-back-picture{display:flex;align-items:center;gap:7px;min-height:44px;margin:0 0 12px;padding:6px 0;background:none;border:0;color:#527758;font-size:17px}
 .workspace.view-explore #view .explore-title-row{position:absolute;top:16px;right:16px;margin:0}
 .workspace.view-explore #view .explore-title-row h3{display:none}
 .workspace.view-explore #view .explore-verse{margin-bottom:18px}
 .workspace.view-explore #view .explore-guide{display:none}
 .workspace.view-explore #view .explore-card[data-feedback] .explore-guide{display:flex}
 .workspace.view-explore #view .explore-next:not(:disabled){margin-top:18px}
 .workspace.view-explore #view .explore-model-tools{display:grid;grid-template-columns:1fr;gap:8px}
 .workspace.view-explore #view .explore-presets{width:100%}
 .workspace.view-explore #view .explore.is-expanded .explore-observe-task,
 .workspace.view-explore #view .explore.is-expanded .explore-answer-entry{display:none}
 .workspace.view-explore #view .explore.is-expanded .explore-stage{height:calc(100dvh - 285px);min-height:240px}
}
@media(max-width:370px){
 .workspace.view-explore #view .explore-card{padding:13px}
 .workspace.view-explore #view .explore-title-row{top:13px;right:13px}
 .workspace.view-explore #view .explore-clue{font-size:16px!important;padding:7px}
 .workspace.view-explore #view .explore-verse>p{font-size:22px;letter-spacing:0}
 .workspace.view-explore #view .explore-observe-task h3{font-size:23px}
}
.workspace.view-explore #view .explore-model-tools{justify-content:center}.workspace.view-explore #view .explore-model-tools .explore-zoom{justify-self:center;margin-inline:auto}

/* challenge-revision.css */
/* Keep the original illustrated listening game, with no 3D detour. */
.workspace .challenge-shell .challenge-sound-layout {
  max-width: 760px; margin-inline: auto; padding: 12px 4px;
  grid-template-columns: minmax(160px, .7fr) minmax(0, 1.3fr); gap: 34px;
}
.workspace .challenge-shell .challenge-sound-stage { flex-direction: column; gap: 18px; height: auto; min-height: 160px; }
.workspace .challenge-shell .challenge-sound-token {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  width: 154px; min-height: 154px; padding: 20px; border: 1px solid #adc7b0;
  border-radius: 50%; color: #315d47; background: #edf5e6; box-shadow: 0 5px 0 #d5e3cd;
  font-size: 21px; line-height: 1.4; gap: 9px; touch-action: manipulation;
}
.workspace .challenge-shell .challenge-sound-token > svg { width: 42px; height: 42px; }
.workspace .challenge-shell .challenge-sound-token.is-playing { background: #dbeccb; box-shadow: 0 0 0 7px #ecf3e7; }
.workspace .challenge-shell .challenge-sound-stage .challenge-stage-note { position: static; margin: 0; font-size: 16px; color: #637b64; }
.workspace .challenge-shell .challenge-sound-work { min-width: 0; }
.workspace .challenge-shell .challenge-sound-work .challenge-prompt { text-wrap: balance; }
.workspace .challenge-shell .challenge-sound-work .challenge-audio-status { min-height: 46px; }
.workspace .challenge-shell .challenge-secondary {
  display: inline-flex; align-items: center; justify-content: center; min-height: 48px;
  padding: 10px 20px; border: 1px solid #b8cbb0; border-radius: 14px;
  background: #f5f8eb; color: #355e45; font-size: 18px;
}
.workspace .challenge-shell .challenge-observation-picture { display: block; width: 100%; max-height: 270px; object-fit: contain; border-radius: 18px; }
.workspace .challenge-shell .challenge-results-heading { gap: 16px; }
.workspace .challenge-shell .challenge-results-heading h2 { font-size: 29px; }
.workspace .challenge-shell .challenge-results-heading .challenge-result-detail { display: block !important; font-size: 18px !important; line-height: 1.5; color: #52684c !important; }
.workspace .challenge-shell .challenge-result-row { gap: 12px; font-size: 19px !important; min-height: 67px; padding: 9px 13px; cursor: default; }
.workspace .challenge-shell .challenge-result-number { flex-shrink: 0; width: 30px; height: 30px; font-size: 17px; }
.workspace .challenge-shell .challenge-result-knowledge { min-width: 0; overflow-wrap: anywhere; line-height: 1.4; }
.workspace .challenge-shell .challenge-result-row small { display: block !important; color: #52684c; font-size: 17px !important; }
.workspace .challenge-shell .challenge-result-row em { flex-shrink: 0; font-size: 18px !important; font-weight: 600; }
.workspace .challenge-shell .challenge-result-row em.needs-practice { color: #986443; }
.workspace .challenge-shell .challenge-results-actions { display: grid; grid-template-columns: 1fr 1fr; width: 100%; max-width: 480px; gap: 14px; margin-inline: auto; }
.workspace .challenge-shell .challenge-results-actions button { min-height: 52px; font-size: 21px; padding: 10px 14px; }
.workspace .challenge-shell .challenge-results-actions button:disabled { opacity: .55; cursor: default; }
@media (max-width: 700px) {
  .workspace .challenge-shell .challenge-sound-layout { grid-template-columns: 1fr; gap: 20px; padding: 8px 2px; }
  .workspace .challenge-shell .challenge-sound-stage { width: 100%; height: auto; min-height: 0; gap: 10px; }
  .workspace .challenge-shell .challenge-sound-token { width: 128px; min-height: 128px; font-size: 21px; padding: 16px; }
  .workspace .challenge-shell .challenge-sound-work { text-align: center; }
  .workspace .challenge-shell .challenge-sound-work .challenge-prompt { font-size: 24px; line-height: 1.45; }
  .workspace .challenge-shell .challenge-shelves { gap: 12px; }
  .workspace .challenge-shell .challenge-shelf { min-height: 86px; }
  .workspace .challenge-shell .challenge-shelf > span { font-size: 28px; }
  .workspace .challenge-shell .challenge-shelf:has(.challenge-tone) > span { font-size: 18px; }
  .workspace .challenge-shell .challenge-sound-work .challenge-audio-status { display: block; min-height: 24px; margin-top: 12px; font-size: 16px; }
  .workspace .challenge-results { justify-content: flex-start; }
  .workspace .challenge-shell .challenge-results-heading { gap: 12px; margin-bottom: 15px; }
  .workspace .challenge-shell .challenge-results-heading h2 { font-size: 27px; }
  .workspace .challenge-shell .challenge-results-heading .challenge-result-detail { font-size: 17px !important; }
  .workspace .challenge-shell .challenge-result-row { font-size: 18px !important; padding: 8px 10px; min-height: 64px; gap: 9px; }
  .workspace .challenge-shell .challenge-result-row small { font-size: 17px; }
  .workspace .challenge-shell .challenge-result-row em { font-size: 17px !important; }
  .workspace .challenge-shell .challenge-results-actions { gap: 10px; }
  .workspace .challenge-shell .challenge-results-actions button { font-size: 20px; padding-inline: 7px; }
}
@media (max-width: 700px) and (max-height: 700px) {
  .workspace .challenge-shell .challenge-sound-layout { gap: 12px; padding: 2px; }
  .workspace .challenge-shell .challenge-sound-token { width: 108px; min-height: 108px; font-size: 19px; gap: 5px; padding: 12px; }
  .workspace .challenge-shell .challenge-sound-token > svg { width: 32px; height: 32px; }
  .workspace .challenge-shell .challenge-sound-stage .challenge-stage-note { display: none; }
  .workspace .challenge-shell .challenge-sound-work .challenge-prompt { font-size: 22px; margin-bottom: 8px; }
  .workspace .challenge-shell .challenge-shelf { min-height: 72px; }
  .workspace .challenge-shell:has(.has-feedback) .challenge-sound-stage { width: 100%; height: auto; }
  .workspace .challenge-shell:has(.has-feedback) .challenge-sound-token { flex-direction: row; width: auto; min-height: 48px; padding: 8px 18px; border-radius: 28px; }
  .workspace .challenge-shell:has(.has-feedback) .challenge-sound-work .challenge-audio-status { display: none; }
}
@media (max-height: 550px) and (orientation: landscape) {
  .workspace .challenge-shell .challenge-sound-layout { grid-template-columns: 150px minmax(0, 1fr); gap: 24px; }
  .workspace .challenge-shell .challenge-sound-token { width: 104px; min-height: 104px; padding: 12px; font-size: 18px; }
  .workspace .challenge-shell .challenge-sound-token > svg { width: 30px; height: 30px; }
  .workspace .challenge-shell .challenge-sound-stage .challenge-stage-note { display: none; }
}

/* Original sound-market artwork. Tap the walnut to listen, then tap an answer. */
.workspace .challenge-shell .challenge-sound-stage.is-walnut-market {position:relative;display:block;min-height:0;width:100%;max-width:340px;height:auto;aspect-ratio:6/5;margin-inline:auto;}
.workspace .challenge-shell .is-walnut-market .challenge-market {display:block;width:100%;height:100%;object-fit:contain;}
.workspace .challenge-shell .challenge-sound-token.is-walnut {position:absolute;left:50%;top:29%;transform:translateX(-50%);display:block;width:80px;height:116px;min-width:44px;min-height:44px;padding:0;border:0;border-radius:12px;background:transparent;box-shadow:none;cursor:pointer;touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;}
.workspace .challenge-shell .challenge-sound-token.is-walnut img {display:block;width:100%;height:100%;object-fit:contain;pointer-events:none;user-select:none;-webkit-user-drag:none;}
.workspace .challenge-shell .challenge-sound-token.is-walnut > svg {position:absolute;left:50%;bottom:13%;transform:translateX(-50%);width:26px;height:26px;padding:3px;border-radius:50%;background:#fff6dd;color:#624a2e;pointer-events:none;}
.workspace .challenge-shell .challenge-sound-token.is-walnut.is-playing {animation:walnut-listen .65s ease-in-out infinite alternate;background:none;box-shadow:none;}
.workspace .challenge-shell .challenge-sound-token.is-walnut:focus-visible {outline:3px solid #528b76;outline-offset:5px;}
.workspace .challenge-shell .is-walnut-market .challenge-stage-note {display:block;position:absolute;top:auto;left:8%;right:8%;bottom:17%;margin:0;color:#594027;font-size:18px;line-height:1.35;pointer-events:none;}
.workspace .challenge-shell.challenge-type-sound .challenge-shelves{gap:12px;}
.workspace .challenge-shell.challenge-type-sound .challenge-shelf{min-height:88px;cursor:pointer;touch-action:manipulation;}
.workspace .challenge-shell.challenge-type-sound .challenge-shelf>span{font-size:clamp(28px,3vw,38px);}
.workspace .challenge-shell.challenge-type-sound .challenge-shelf:has(.challenge-tone)>span{font-size:20px;}
.workspace .challenge-shell.challenge-type-sound .challenge-shelf:disabled{cursor:default;}
.workspace .challenge-shell.challenge-type-sound .challenge-shelf:focus-visible{outline:3px solid #528b76;outline-offset:3px;}
.workspace .challenge-shell.challenge-type-sound .challenge-sound-work>.challenge-audio-status{display:block;min-height:30px;font-size:19px;line-height:1.5;margin:12px 0 0;}
@keyframes walnut-listen {from {rotate:-5deg} to {rotate:5deg}}
@media(max-width:700px) {
 .workspace .challenge-shell .challenge-sound-layout {gap:10px;}
 .workspace .challenge-shell .challenge-sound-stage.is-walnut-market {width:228px;}
 .workspace .challenge-shell .challenge-sound-token.is-walnut {width:60px;height:84px;top:26%;}
 .workspace .challenge-shell .is-walnut-market .challenge-stage-note {font-size:16px;bottom:16%;}
 .workspace .challenge-shell .challenge-sound-token.is-walnut > svg {width:23px;height:23px;}
}
@media(max-width:700px) and (max-height:700px) {
 .workspace .challenge-shell .challenge-sound-stage.is-walnut-market {width:190px;}
 .workspace .challenge-shell .challenge-sound-token.is-walnut {width:48px;height:72px;top:25%;}
 .workspace .challenge-shell:has(.has-feedback) .challenge-sound-stage.is-walnut-market {width:145px;}
 .workspace .challenge-shell:has(.has-feedback) .challenge-sound-token.is-walnut {width:42px;height:54px;top:25%;}
 .workspace .challenge-shell:has(.has-feedback) .is-walnut-market .challenge-stage-note {display:none;}
}
@media(max-height:550px) and (orientation:landscape) {
 .workspace .challenge-shell .challenge-sound-stage.is-walnut-market {width:180px;}
 .workspace .challenge-shell .challenge-sound-token.is-walnut {width:48px;height:66px;top:26%;}
 .workspace .challenge-shell .is-walnut-market .challenge-stage-note {font-size:15px;}
}
@media(prefers-reduced-motion:reduce) {.workspace .challenge-shell .challenge-sound-token.is-walnut.is-playing {animation:none;}}

/* client-review.css */
/* Four clear activities and one consistent, compact poet-chat gateway. */
.workspace .lesson-map-extras{grid-template-columns:minmax(0,1fr);max-width:240px}
.workspace .lesson-map-extras button{display:flex;align-items:center;justify-content:center;gap:10px;min-height:52px;border:0;border-radius:12px;background:transparent;color:#476b58;font:500 19px/1.5 var(--sans);cursor:pointer}
.workspace .lesson-map-extras button:hover{background:#edf3e9}
.profile-dialog{width:520px;max-height:calc(100dvh - 24px);padding:24px;border-radius:20px;overflow:auto;overscroll-behavior:contain}
.profile-dialog .dialog-heading{gap:12px;margin-bottom:18px}
.profile-dialog .dialog-heading h2{font-size:26px;line-height:1.4}
.profile-dialog label{font-size:18px}
.profile-dialog :is(input,select){border-radius:10px;min-height:50px;font-size:19px}
.profile-archive h3{font:600 23px/1.6 var(--sans);margin:0 0 14px}
.profile-progress{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.profile-progress>div{padding:15px 10px;border-radius:16px;background:#f0f5eb;text-align:center}
.profile-progress span{font-size:18px}.profile-progress strong{display:block;margin:8px 0;font-size:29px;line-height:1.3}
.profile-progress small{margin-left:5px;font-size:17px;font-weight:400}.profile-progress p{margin:0;font-size:17px;line-height:1.5}
.profile-result-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:16px}
.profile-review-note{margin:14px 0 0;font-size:18px;line-height:1.6;color:#526b54}
.profile-result-links .button{justify-content:center;padding:10px 6px;font-size:18px;line-height:1.5;text-align:center;white-space:normal}
.profile-details{margin-top:22px;padding-top:16px;border-top:1px solid #dce5d8}
.profile-details summary{min-height:48px;font:600 19px/1.6 var(--sans);cursor:pointer}.profile-details form{padding-top:8px}
@media(max-width:360px){.profile-dialog{padding:17px}.profile-dialog .dialog-heading h2{font-size:23px}.profile-progress{gap:8px}.profile-progress span{font-size:17px}.profile-result-links{gap:8px}.profile-result-links .button{font-size:17px}}
.workspace .lesson-map-lower .lesson-map-steps{grid-template-columns:repeat(3,minmax(0,1fr))}
.workspace .lesson-map-step h3{font-size:clamp(20px,2.2vw,26px);line-height:1.5;letter-spacing:0}
.workspace .lesson-map-status{line-height:1.6}
.workspace .lesson-menu .menu-panel{min-width:220px;max-width:calc(100vw - 32px);padding:8px}
.workspace .lesson-menu .menu-panel a{display:flex;align-items:center;gap:12px;min-height:52px;padding:10px 14px;font-size:19px;border-radius:12px}
.workspace .lesson-menu .menu-panel a[aria-current=page]{color:#276650;background:#eaf3e8;font-weight:700}
.workspace.view-quiz .lesson-title h1{font-size:clamp(23px,3vw,32px);line-height:1.3;white-space:normal}
.workspace .report-next-activities{grid-template-columns:repeat(2,minmax(0,1fr));justify-content:center}
.workspace .report-next-activities a{min-width:0;text-align:center;white-space:normal}
.workspace .shishi-touch-slot{--shishi-width:80px;--shishi-height:112px;width:var(--shishi-width);height:calc(var(--shishi-height) + 22px);flex-basis:var(--shishi-width)}
.workspace .lesson-bar:has(.shishi-touch-slot){grid-template-columns:auto minmax(0,1fr) var(--shishi-width,80px) auto;min-height:144px;padding-block:5px}
.shishi-touch-slot .shishi-guide{width:100%;height:100%}
.shishi-touch-slot .shishi-guide-button{width:100%;height:100%;justify-content:flex-start;gap:2px;border-radius:12px;position:relative}
.shishi-touch-slot .shishi-poet-label{display:block;flex:none;font:600 15px/20px var(--sans);white-space:nowrap;color:#476b58;background:transparent;pointer-events:none}
.shishi-touch-slot .shishi-guide-art{width:var(--shishi-width);height:var(--shishi-height);transform-origin:50% 80%;animation:none!important;overflow:visible}
.shishi-touch-slot .shishi-guide-art>img{object-fit:contain;object-position:center bottom}
.shishi-poet-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:15px}
.shishi-find-poet,.shishi-poet-actions .shishi-understood{min-height:48px;margin:0;padding:10px 16px;border:1px solid #cbd9c0;border-radius:13px;font:600 18px/1.5 var(--sans);cursor:pointer}
.shishi-find-poet{flex:1;color:white;background:#356d56;border-color:#356d56}
.shishi-poet-actions .shishi-understood{background:#fffef8;font-weight:500}
.animation-pending{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;min-height:100%;padding:24px;text-align:center}
.animation-pending img{width:88px;height:88px}.animation-pending h2{font-size:28px}.animation-pending p{font-size:21px;line-height:1.6}
.workspace.view-record .record-bottom:empty{display:none}
@media(min-width:1025px){
 .workspace.view-lesson #view{display:flex;align-items:safe center;overflow-y:auto}
}
@media(max-width:420px){
 .workspace .lesson-bar{gap:8px}
 .workspace .shishi-touch-slot{--shishi-width:72px;--shishi-height:102px}
 .workspace .lesson-bar:has(.shishi-touch-slot){grid-template-columns:auto minmax(0,1fr) 72px auto;min-height:134px}
 .workspace .lesson-map-step{min-height:150px}
 .workspace .lesson-map-step h3{font-size:20px}
 .workspace .lesson-map-status{font-size:16px}
 .workspace.view-quiz .lesson-title h1{font-size:23px}
 .workspace.view-quiz .lesson-title p{font-size:16px}
}
@media(max-width:600px) and (orientation:portrait){
 .workspace .lesson-map-lower .lesson-map-steps{grid-template-columns:minmax(0,1fr);gap:12px}
 .workspace .lesson-map-lower .lesson-map-step{display:grid;grid-template-columns:62px minmax(0,1fr);min-height:112px;align-items:center;gap:14px;padding:16px 20px}
 .workspace .lesson-map-lower .lesson-map-step-top{flex-wrap:wrap;gap:5px;margin:0;justify-content:center}
 .workspace .lesson-map-lower .lesson-map-step-arrow{display:none}
 .workspace .lesson-map-lower .lesson-map-step h3{font-size:24px}
 .workspace .lesson-map-lower .lesson-map-status{margin-top:4px;font-size:18px}
 .workspace .lesson-map-lower .lesson-map-extras{padding-top:6px}
}
@media(max-width:600px) and (max-height:650px) and (orientation:portrait){
 .workspace .lesson-map-lower .lesson-map-step{min-height:94px;padding:11px 14px}
 .workspace .lesson-map-lower .lesson-map-steps{gap:9px}
}
@media(max-height:550px) and (orientation:landscape){
 .workspace .shishi-touch-slot{--shishi-width:94px;--shishi-height:76px}
 .workspace .lesson-bar:has(.shishi-touch-slot){grid-template-columns:auto minmax(0,1fr) 94px auto;min-height:82px;padding-block:2px}
 .workspace .shishi-touch-slot{height:76px}
 .shishi-touch-slot .shishi-guide-button{flex-direction:row;justify-content:center;gap:0}
 .shishi-touch-slot .shishi-guide-art{width:52px;order:0}
 .shishi-touch-slot .shishi-poet-label{order:1;font-size:13px;line-height:18px}
 .workspace .lesson-map-step{min-height:135px}
 .workspace .lesson-map-step h3{font-size:21px}
}
#school-record-sync{display:block;padding:16px;margin:12px 0 18px;background:#f1f5ed;border:1px solid #dbe5d5;border-radius:16px;text-align:left}
#school-record-sync strong{display:block;font-size:18px;line-height:1.5;color:#2c5c47}
#school-record-sync p{font-size:16px;line-height:1.65;margin:7px 0 0;color:#526453;overflow-wrap:anywhere}
#school-record-sync .button{min-height:44px;margin-top:12px;font-size:16px}

/* ar-experience.css */
/* Client-reviewed AR entry and one short observation at a time. */
.workspace.view-explore #view .explore{height:auto;min-height:100%;padding-bottom:16px;gap:14px}
.workspace.view-explore #view .explore-heading{display:none}
.workspace.view-explore #view .explore-layout{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);grid-template-rows:auto;align-items:start;gap:24px;flex:none}
.workspace.view-explore #view .explore-visual{display:flex;height:auto;min-height:0;flex:none}
.workspace.view-explore #view .explore-stage{height:clamp(290px,50dvh,560px);min-height:290px;flex:none}
.workspace.view-explore #view .explore-view-controls{position:static;display:block;margin:14px 0 0}
.workspace.view-explore #view .explore-ar-entry{display:flex;align-items:center;justify-content:center;gap:12px;min-height:62px;width:100%;padding:13px 16px;border:1px solid #376b57;border-radius:16px;background:#477858;color:#fffef6;font-size:23px;font-weight:600;box-shadow:0 3px 0 #305d42;touch-action:manipulation}
.workspace.view-explore #view .explore-ar-entry svg{width:28px;height:28px}
.workspace.view-explore #view .explore-ar-entry:disabled{opacity:.65}
.workspace.view-explore #view .explore-card{display:flex;align-self:stretch;max-height:none;overflow:visible;padding:22px;border-radius:20px;box-shadow:none}
.workspace.view-explore #view .explore-card-top{display:flex;margin:0 0 12px}
.workspace.view-explore #view .explore-step{font-size:17px;letter-spacing:0}
.workspace.view-explore #view .explore-verse{margin:0 0 16px;padding:10px 0;gap:12px}
.workspace.view-explore #view .explore-verse>p{font-size:25px;line-height:1.65;letter-spacing:.5px}
.workspace.view-explore #view .explore-question legend{font-size:23px;line-height:1.45;margin-bottom:14px}
.workspace.view-explore #view .explore-answers{gap:12px}
.workspace.view-explore #view .explore-answers button{font-size:21px;min-height:58px;padding:12px;line-height:1.5}
.workspace.view-explore #view .explore-feedback{font-size:18px;line-height:1.6;min-height:0;margin:14px 0 0;color:#5d7156}
.workspace.view-explore #view .explore-feedback:empty{display:none}
.workspace.view-explore #view .explore-next{margin-top:18px;min-height:54px;font-size:20px;flex:none}
.workspace.view-explore #view .explore-next:disabled{display:none}
.workspace.view-explore #view .explore-notice{margin:12px 0 0;padding:11px 13px;background:#f0f3e8;border-radius:12px;font-size:17px;line-height:1.55;color:#607456}
.workspace.view-explore #view .explore-model-tools{display:flex;position:static;flex-wrap:wrap;gap:8px;background:none;padding:0;margin-top:12px}
.workspace.view-explore #view .explore-finish-mark{display:grid;place-items:center;width:70px;height:70px;margin:10px auto 18px;background:#eaf3e0;border-radius:50%;color:#477858}
.workspace.view-explore #view .explore-finish-mark svg{width:38px;height:38px}
.workspace.view-explore #view .explore-finish h3{font-size:25px;line-height:1.4;margin:0 0 12px}
.workspace.view-explore #view .explore-finish p{font-size:19px;line-height:1.7}
.workspace.view-explore #view .explore-again{font-size:19px;min-height:48px}
.workspace.view-explore #view .explore.is-expanded .explore-layout{display:block}
.workspace.view-explore #view .explore.is-expanded .explore-visual{display:flex;width:100%}
.workspace.view-explore #view .explore.is-expanded .explore-card{display:none}
.workspace.view-explore #view .explore.is-expanded .explore-stage{height:calc(100dvh - 270px);min-height:300px}
@media(max-width:820px){
 .workspace.view-explore #view .explore-layout{grid-template-columns:minmax(0,1fr);gap:16px}
 .workspace.view-explore #view .explore-stage{height:clamp(200px,29dvh,330px);min-height:200px}
 .workspace.view-explore #view .explore-card{padding:17px}
 .workspace.view-explore #view .explore-verse>p{font-size:23px;letter-spacing:0}
 .workspace.view-explore #view .explore-question legend{font-size:22px}
 .workspace.view-explore #view .explore-ar-entry{min-height:58px;font-size:22px}
 .workspace.view-explore #view .explore-view-controls{margin-top:12px}
 .workspace.view-explore #view .explore-answers button{font-size:20px;min-height:56px}
 .workspace.view-explore #view .explore-model-tools{display:flex}
}
@media(max-width:370px){
 .workspace.view-explore #view .explore-card{padding:14px}
 .workspace.view-explore #view .explore-verse>p{font-size:22px}
}

/* Model-only observation: no camera layer or system AR hand-off. */
.workspace.view-explore #view .explore-model-hint{width:100%;margin:0;color:#536d58;text-align:center;font-size:18px;line-height:1.5;text-wrap:balance}
.workspace.view-explore #view .explore-model-tools{gap:8px;margin-top:10px}
.workspace.view-explore #view .explore-zoom button{width:48px;min-height:48px}
.workspace.view-explore #view .explore-word small{font-size:17px;line-height:1.4}
.workspace.view-explore #view .explore-expand{min-height:44px;font-size:17px!important}
.workspace.view-explore #view .explore-scene-name{font-size:17px}
.workspace.view-explore #view .explore-loading,.workspace.view-explore #view .explore-image-loading p,.workspace.view-explore #view .explore-image-fallback p{font-size:18px;line-height:1.5}
.workspace.view-explore #view .explore-image-fallback button{min-height:48px;font-size:18px}
@media(min-width:660px) and (orientation:landscape) and (max-height:700px){
 .workspace.view-explore #view .explore-layout{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:16px}
 .workspace.view-explore #view .explore-stage{height:clamp(220px,calc(100dvh - 230px),400px);min-height:220px}
 .workspace.view-explore #view .explore-card{padding:16px}
 .workspace.view-explore #view .explore-verse{margin-bottom:10px;padding-block:8px}
 .workspace.view-explore #view .explore-model-hint{font-size:17px}
 .workspace.view-explore #view .explore.is-expanded .explore-stage{height:calc(100dvh - 205px);min-height:220px}
}
@media(min-width:660px) and (orientation:landscape) and (max-height:480px){
 .workspace.view-explore #view .explore-stage{height:200px;min-height:200px}
 .workspace.view-explore #view .explore-card{padding:12px}
 .workspace.view-explore #view .explore-card-top{margin-bottom:8px}
 .workspace.view-explore #view .explore-verse{margin-bottom:8px;padding-block:4px}
 .workspace.view-explore #view .explore-question legend{margin-bottom:8px}
 .workspace.view-explore #view .explore-answers{gap:8px}
 .workspace.view-explore #view .explore-answers button{min-height:52px;padding:9px 12px}
 .workspace.view-explore #view .explore-zoom button{width:44px;min-height:44px}
 .workspace.view-explore #view .explore.is-expanded .explore-stage{height:calc(100dvh - 190px);min-height:200px}
}

/* poem-games/goose.css */
.poem-goose-game{width:100%;max-width:760px;margin-inline:auto;display:grid;gap:14px;color:#254a3f;font-family:inherit;min-width:0}
.poem-goose-game *{box-sizing:border-box}
.poem-goose-game .goose-instruction{display:flex;align-items:center;justify-content:space-between;gap:12px}
.poem-goose-game .goose-instruction p{font-size:clamp(19px,2.4vw,24px);font-weight:600;line-height:1.45;margin:0}
.poem-goose-game .goose-progress{font-family:inherit;font-weight:600;font-size:18px;line-height:1.2;white-space:nowrap;color:#61776b;font-variant-numeric:tabular-nums}
.poem-goose-game .goose-picture{position:relative;isolation:isolate;aspect-ratio:3/2;width:min(100%,690px);justify-self:center;overflow:hidden;border-radius:22px;background:#f2eee4;touch-action:pan-y;border:1px solid #849d8c36}
.poem-goose-game .goose-base,.poem-goose-game .goose-layer{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain;pointer-events:none;user-select:none;-webkit-user-drag:none}
.poem-goose-game .goose-layer{opacity:0;transition:opacity .75s ease}
.poem-goose-game .goose-layer.is-filled{opacity:1}
.poem-goose-game .goose-part{position:absolute;left:var(--x);top:var(--y);width:52px;height:52px;min-width:44px;min-height:44px;transform:translate(-50%,-50%);padding:0;border:0;border-radius:50%;display:grid;place-items:center;background:transparent;color:#fff;z-index:2;cursor:pointer;touch-action:manipulation;box-shadow:none}
.poem-goose-game .goose-part span{display:grid;place-items:center;width:27px;height:27px;line-height:1;font-family:system-ui,sans-serif;font-size:23px;font-weight:400;border:1.5px solid #fffffff0;border-radius:50%;background:#345c4b9c;box-shadow:0 0 0 6px #ffffff2b;transition:background .2s,transform .2s}
.poem-goose-game .goose-part.is-filled span{background:#eaf3e9e8;color:#305747;font-size:18px;box-shadow:0 0 0 4px #ffffff20}
.poem-goose-game .goose-part:disabled{cursor:default}
.poem-goose-game .goose-part:focus-visible{outline:3px solid #eeae50;outline-offset:1px}
.poem-goose-game .goose-part:hover:not(:disabled) span{transform:scale(1.12)}
.poem-goose-game.is-complete .goose-part{visibility:hidden}
.poem-goose-game .goose-palette{display:flex;justify-content:center;gap:12px;padding:0 2px}
.poem-goose-game .goose-paint{position:relative;display:flex;align-items:center;justify-content:center;gap:9px;min-width:0;min-height:60px;max-width:190px;flex:1;padding:10px 14px;background:#fffefb;border:1.5px solid #d8dfd4;border-radius:19px;color:#345345;font-family:inherit;font-size:23px;font-weight:600;line-height:1.2;cursor:pointer;touch-action:none;box-shadow:0 3px 0 #e6eade;transition:background .2s,border-color .2s;user-select:none;-webkit-user-select:none}
.poem-goose-game .goose-paint i{width:31px;height:31px;flex:none;display:block;border-radius:50%;background:#fffefa;border:1.5px solid #d7d3c6;box-shadow:inset 0 -3px 0 #00000008}
.poem-goose-game .goose-paint-red i{background:#bf5b46;border-color:#a94d3d}
.poem-goose-game .goose-paint-green i{background:#548b70;border-color:#477b5e}
.poem-goose-game .goose-paint[aria-pressed=true]{border-color:#4b7c64;background:#f0f7ed;box-shadow:0 0 0 2px #4b7c6420,0 3px 0 #d5e4d3}
.poem-goose-game .goose-paint b{position:absolute;right:5px;top:3px;font-size:13px;line-height:1;color:#52764f}
.poem-goose-game .goose-paint>span{white-space:nowrap}
.poem-goose-game .goose-paint:disabled{cursor:default;opacity:.68}
.poem-goose-game .goose-paint:focus-visible,.poem-goose-game .goose-loading button:focus-visible{outline:3px solid #de9b34;outline-offset:4px}
.poem-goose-game .goose-paint.is-dragging{z-index:10;opacity:.92;box-shadow:0 7px 16px #274f3829}
.poem-goose-game .goose-feedback{font-size:20px;font-weight:500;line-height:1.5;text-align:center;margin:0;min-height:1.5em;color:#4a6a59;text-wrap:pretty}
.poem-goose-game .goose-loading{position:absolute;inset:0;z-index:4;display:grid;align-content:center;justify-items:center;gap:15px;padding:20px;background:#f5f2eae8;font-size:21px;line-height:1.5;text-align:center}
.poem-goose-game .goose-loading button{min-height:48px;padding:10px 22px;border:1px solid #97ad9b;border-radius:14px;background:#fffefa;color:#254a3f;font-family:inherit;font-weight:600;font-size:20px;line-height:1.2;cursor:pointer}
.poem-goose-game .goose-caption{position:absolute;bottom:12px;right:14px;display:flex;flex-direction:column;gap:4px;padding:10px 14px;border-radius:12px;background:#fefbf0e8;color:#315240;font-family:'Noto Serif HK','Source Han Serif HK',serif;font-size:clamp(18px,3vw,26px);font-weight:600;line-height:1.45;letter-spacing:.12em;pointer-events:none}
.poem-goose-game [hidden]{display:none!important}
.poem-goose-game .goose-ripple{position:absolute;z-index:1;width:32px;height:20px;border:2px solid #fffef4;box-shadow:0 0 0 7px #ffffff32;border-radius:50%;pointer-events:none;animation:goose-colour-ripple .8s ease-out forwards}
@keyframes goose-colour-ripple{from{transform:translate(-50%,-50%) scale(.5);opacity:.95}to{transform:translate(-50%,-50%) scale(3);opacity:0}}
.poem-goose-game.is-reduced-motion .goose-layer{transition:none}
.poem-goose-game.is-reduced-motion .goose-ripple{display:none}
.poem-goose-game .goose-paint{min-height:68px;font-size:25px;padding:12px 16px}
.poem-goose-game .goose-paint i{width:35px;height:35px}
@media(max-width:420px){.poem-goose-game{gap:12px}.poem-goose-game .goose-instruction{gap:8px}.poem-goose-game .goose-instruction p{font-size:19px}.poem-goose-game .goose-progress{font-size:16px}.poem-goose-game .goose-palette{gap:8px}.poem-goose-game .goose-paint{font-size:23px;min-height:66px;padding:10px 8px;gap:6px;border-radius:16px}.poem-goose-game .goose-paint i{width:28px;height:28px}.poem-goose-game .goose-feedback{font-size:19px}.poem-goose-game .goose-picture{border-radius:16px}.poem-goose-game .goose-caption{bottom:8px;right:8px;padding:8px 10px}}
@media(max-width:370px){.poem-goose-game .goose-paint{flex-direction:column;gap:5px;padding:8px 5px;font-size:21px;min-height:72px}}
@media(prefers-reduced-motion:reduce){.poem-goose-game .goose-layer,.poem-goose-game .goose-part span,.poem-goose-game .goose-paint{transition:none}.poem-goose-game .goose-ripple{display:none}}

/* poem-games/zeng.css */
.farewell-story{width:100%;max-width:760px;margin:auto;display:grid;gap:12px;color:#355346;min-width:0;font-family:inherit}.farewell-story *{box-sizing:border-box}.farewell-story button{font-family:inherit;touch-action:manipulation;cursor:pointer}.farewell-story [hidden]{display:none!important}.fs-header{display:flex;align-items:center;justify-content:space-between;gap:10px}.fs-eyebrow{font-size:15px;letter-spacing:.13em;color:#708474}.fs-header h3{margin:2px 0 0;font-size:clamp(22px,3vw,29px);font-weight:650;line-height:1.4}.fs-progress{font-size:19px;white-space:nowrap;color:#69816b;font-variant-numeric:tabular-nums}.fs-stage{position:relative;isolation:isolate;aspect-ratio:3/2;border-radius:20px;overflow:hidden;background:#ecebd6;border:1px solid #c7d0b8}.fs-scene{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}.fs-boat{--boat-x:67%;--boat-y:83%;position:absolute;left:var(--boat-x);top:var(--boat-y);width:38%;padding:0;border:0;background:none!important;transform:translate(-50%,-50%);z-index:3;transition:left .7s ease,top .7s ease;touch-action:none!important;box-shadow:none!important;opacity:1!important}.fs-boat:active{transition:none}.fs-boat img{display:block;width:100%;height:auto;pointer-events:none;user-select:none}.farewell-story[data-placed=true] .fs-boat{--boat-x:62%;--boat-y:63%;cursor:default}.farewell-story[data-complete=true] .fs-boat{--boat-x:76%;--boat-y:59%}.farewell-story[data-selected=true] .fs-boat{filter:drop-shadow(0 0 5px #fffbce)}.fs-dock{position:absolute;left:62%;top:67%;transform:translate(-50%,-50%);width:27%;height:16%;min-height:44px;border-radius:50%;border:2px dashed #fff9d7;background:#ffffe648;color:#38614f;z-index:2;box-shadow:0 0 22px #fffbdc8c;display:grid;place-items:center}.fs-dock span{white-space:nowrap;background:#fff9e9ed;border-radius:18px;padding:4px 10px;font-size:17px}.fs-dock:disabled{opacity:.65}.fs-waterlight{position:absolute;left:46%;top:60%;width:43%;height:25%;border-radius:50%;background:radial-gradient(ellipse,#fff3c465,transparent 70%);opacity:0;transition:opacity 1s;pointer-events:none}.farewell-story[data-complete=true] .fs-waterlight{opacity:1}.fs-friend{position:absolute;left:27%;top:70%;transform:translateX(-50%);padding:2px 8px;background:#fffbe7da;border-radius:12px;font-size:14px;color:#436249}.fs-note{position:absolute;right:4%;top:6%;background:#fff9e8ef;border:1px solid #d9d0af77;border-radius:17px;padding:10px 14px;font:600 clamp(22px,3vw,29px)/1.5 var(--serif,serif);text-align:center}.fs-note span{font-size:.66em;letter-spacing:.08em}.fs-loading{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:14px;background:#f4f0dfeb;z-index:8;font-size:20px;text-align:center;padding:20px}.fs-loading button{min-height:48px;background:#fffdf2;border:1px solid #bbc9b5;color:#36543e;border-radius:15px;padding:8px 20px;font-size:20px}.fs-verse{margin:0;text-align:center;font-size:clamp(25px,4vw,33px);font-weight:600;line-height:1.4;letter-spacing:.09em}.fs-task{margin:0;text-align:center;font-size:19px;line-height:1.45;color:#60755f;text-wrap:pretty}.fs-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}.fs-actions button{min-height:52px;border:1px solid #bfcdb9;border-radius:16px;padding:10px 18px;font-size:21px;font-weight:600;background:#fffdf4;color:#355943;display:inline-flex;align-items:center;justify-content:center;gap:9px}.fs-actions button svg{width:23px;height:23px;flex:none}.fs-actions .fs-next{background:#446d50;color:#fffdf1;border-color:#446d50}.fs-actions button:disabled{opacity:.62}.fs-feedback{margin:0;min-height:2.8em;font-size:18px;line-height:1.45;text-align:center;text-wrap:pretty;color:#55715a}.fs-rhythm{display:grid;gap:10px}.fs-beats{display:flex;gap:13px;justify-content:center}.fs-beats i{width:12px;height:12px;border:2px solid #b8c6ac;border-radius:50%;background:#f5f4e5}.fs-beats i.is-done{background:#548468;border-color:#548468}.fs-feet{display:flex;justify-content:center;gap:14px}.fs-feet button{display:flex;align-items:center;justify-content:center;gap:12px;width:40%;max-width:210px;min-height:64px;border:1px solid #c2cfb9;border-radius:19px;background:#eff4e7;color:#355942;font-size:24px;font-weight:600;transition:background .12s,transform .12s;opacity:1!important}.fs-feet button:last-child{background:#fbefe1;color:#805b43;border-color:#dec9af}.fs-feet button span{font-size:32px;line-height:1}.fs-feet button.is-sounding{background:#476f50!important;color:#fff!important;transform:translateY(3px);box-shadow:0 0 0 4px #c5d9b89e}.fs-feet button:disabled{cursor:default}.fs-compose{display:grid;gap:12px}.fs-line{display:flex;gap:7px;justify-content:center;align-items:center;font-size:24px}.fs-line b{font-weight:500}.fs-slot{min-width:58px;min-height:48px;padding:6px;border:1px dashed #becdb9;border-radius:10px;display:grid;place-items:center;color:#91a28e;background:#f4f5e9}.fs-slot.is-next{border-color:#5d8764;background:#eef5e7}.fs-slot.is-filled{color:#355b40;background:#e7f0df;border-style:solid}.fs-tickets{display:flex;justify-content:center;gap:11px}.fs-tickets button{border:1px solid #d7c9ac;border-radius:13px 13px 18px 18px;padding:9px 16px;min-width:66px;min-height:52px;background:#fff5dd;color:#74573e;font-size:24px;font-weight:600;box-shadow:0 3px 0 #e1d7bd;opacity:1}.fs-tickets .is-used{visibility:hidden}.farewell-story button:focus-visible{outline:3px solid #bf924d;outline-offset:3px}.farewell-story.is-reduced-motion *{transition:none!important;animation:none!important}@media(max-width:420px){.farewell-story{gap:10px}.fs-stage{border-radius:16px}.fs-header h3{font-size:22px}.fs-eyebrow{font-size:14px}.fs-verse{font-size:24px;letter-spacing:.04em}.fs-task{font-size:18px}.fs-feedback{font-size:17px}.fs-actions{gap:9px}.fs-actions button{font-size:20px;min-height:50px;padding:9px 15px}.fs-friend{font-size:12px}.fs-dock span{font-size:15px}.fs-note{padding:7px 10px}.fs-slot{min-width:51px;font-size:22px}.fs-tickets button{font-size:22px;padding:8px 14px}.fs-feet button{min-height:60px;font-size:23px}}@media(prefers-reduced-motion:reduce){.farewell-story *{transition:none!important;animation:none!important}}
.challenge-freeplay .fs-eyebrow{display:none}.farewell-story .fs-feedback:empty{display:none}
.fs-control-panel{display:flex;flex-direction:column;min-width:0;gap:12px}
.fs-activity{display:flex;flex-direction:column;gap:14px;min-width:0;padding:16px;border:1px solid #dce5ce;border-radius:20px;background:#f3f6e9}
.fs-activity .fs-verse{font-size:28px;line-height:1.5;letter-spacing:0;color:#305c49}
.fs-activity .fs-task{font-size:20px;line-height:1.45}
.fs-control-panel .fs-rhythm,.fs-control-panel .fs-compose{display:flex;flex-direction:column;gap:16px}
.fs-control-panel .fs-beats i{display:grid;place-items:center;width:36px;height:36px;font:500 20px/1 var(--sans);font-style:normal;color:#64826a}
.fs-control-panel .fs-beats i.is-done{color:white}
.fs-control-panel .fs-feedback:empty{display:none}
@media(max-width:700px){.farewell-story .fs-stage{grid-row:1}.fs-control-panel{grid-row:2}.fs-control-panel .fs-eyebrow{display:none}.fs-control-panel .fs-activity{gap:12px;padding:14px}.fs-control-panel .fs-header h3{font-size:24px}.fs-control-panel .fs-activity .fs-verse{font-size:27px}.fs-control-panel .fs-task{font-size:20px}.fs-control-panel .fs-feedback{font-size:19px}.fs-control-panel .fs-feet button{min-height:76px;font-size:27px}.fs-control-panel .fs-tickets button{font-size:28px;min-height:64px;padding-inline:12px}.fs-control-panel .fs-slot{font-size:25px;min-height:54px;min-width:50px}.fs-control-panel .fs-actions button{flex:1;min-height:54px;font-size:21px}}

/* poem-games/views.css */
.poem-view-game{width:100%;max-width:860px;margin:0 auto;color:#284e42;font-family:var(--sans);display:flex;flex-direction:column;gap:14px;min-width:0}
.pvg-heading{text-align:center}.pvg-kicker{font-size:16px;letter-spacing:.1em;color:#7f7963}.pvg-heading h3{margin:6px 0 0;font:600 clamp(21px,2.4vw,27px)/1.45 var(--sans)}
.pvg-stage{position:relative;width:100%;aspect-ratio:3/2;max-height:430px;overflow:hidden;background:#e7eee5;border-radius:18px;isolation:isolate;box-shadow:0 2px 12px #455b3810;flex-shrink:0}
.pvg-layer{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;user-select:none;pointer-events:none}
.spring-near{will-change:opacity,transform}.spring-far{will-change:transform}.pvg-location{position:absolute;left:50%;bottom:12px;transform:translateX(-50%);max-width:95%;border:1px solid #e6ddc5a0;border-radius:30px;padding:6px 14px;background:#fffdf2eb;font-size:17px;line-height:1.4;white-space:nowrap;pointer-events:none}
.pvg-viewfinder{position:absolute;inset:13% 14%;pointer-events:none}.pvg-viewfinder i{position:absolute;width:28px;height:28px;border:3px solid #fffffa;filter:drop-shadow(0 1px 3px #42534966)}.pvg-viewfinder i:nth-child(1){top:0;left:0;border-right:0;border-bottom:0}.pvg-viewfinder i:nth-child(2){top:0;right:0;border-left:0;border-bottom:0}.pvg-viewfinder i:nth-child(3){bottom:0;left:0;border-top:0;border-right:0}.pvg-viewfinder i:nth-child(4){bottom:0;right:0;border-top:0;border-left:0}
.pvg-shutter{position:absolute;inset:0;background:white;opacity:0;pointer-events:none}.is-snapping .pvg-shutter{animation:pvg-shutter .32s ease-out}@keyframes pvg-shutter{0%{opacity:.7}100%{opacity:0}}
.pvg-camera-control{display:flex;align-items:center;gap:14px;padding:2px 8px;font-size:19px;white-space:nowrap}.pvg-camera-control input{width:100%;min-width:35px;height:48px;accent-color:#4b785f;touch-action:pan-y;cursor:ew-resize}
.pvg-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}.pvg-actions button,.pvg-retry{display:inline-flex;align-items:center;justify-content:center;gap:9px;border:1px solid #adc6ae;border-radius:14px;background:#fffef7;color:#365f4b;font:500 20px/1.4 var(--sans);min-height:52px;padding:11px 20px;cursor:pointer;touch-action:manipulation}.pvg-actions svg{width:25px;height:25px;flex:none}.pvg-actions .pvg-main{background:#3b7056;color:#fffef7;border-color:#3b7056}.pvg-actions button:disabled{opacity:.5;cursor:default}.pvg-actions button:focus-visible,.poem-view-game input:focus-visible,.rain-spot:focus-visible,.rain-cloud:focus-visible{outline:3px solid #d6a865;outline-offset:3px}
.pvg-photo-tray{display:flex;justify-content:center;gap:16px}.pvg-photo-tray figure{display:flex;align-items:center;gap:9px;margin:0;padding:7px 10px 7px 7px;border:1px dashed #bccbb5;border-radius:12px;background:#f3f5ee;opacity:.45;min-width:0}.pvg-photo-tray figure.is-collected{border-style:solid;opacity:1;background:#fffef8}.pvg-photo-tray img{width:68px;aspect-ratio:3/2;object-fit:cover;border-radius:5px;filter:grayscale(1)}.pvg-photo-tray .is-collected img{filter:none}.pvg-photo-tray figcaption{font-size:18px;line-height:1.4}
.pvg-status{min-height:1.6em;text-align:center;font-size:18px;line-height:1.6;margin:0;color:#65705c}.pvg-retry{align-self:center}
.rain-dry-veil{position:absolute;inset:0;background:#ae98774d;mix-blend-mode:color;opacity:calc(1 - var(--rain-progress,0));pointer-events:none;transition:opacity .8s}.rain-cloud{position:absolute;top:18%;left:50%;transform:translate(-50%,-50%);width:100px;height:78px;border:0;background:transparent;filter:drop-shadow(0 4px 5px #41656622);cursor:grab;touch-action:none;z-index:3;padding:0}.rain-cloud svg{width:100%;height:100%}.rain-cloud:active{cursor:grabbing}
.rain-spot{position:absolute;left:var(--spot-x);top:68%;transform:translate(-50%,-50%);width:82px;height:60px;border:1px solid #fffdf8;background:#fffdf0cc;border-radius:50%;color:#466c60;font:500 18px/1.4 var(--sans);cursor:pointer;box-shadow:0 0 0 6px #f9fff730;touch-action:manipulation}.rain-spot.is-watered{opacity:.28;background:#b6d5bf}.rain-spot.is-watered span{visibility:hidden}.rain-progress{position:absolute;top:12px;right:12px;background:#fffdf2e6;border-radius:20px;padding:5px 11px;font-size:16px;pointer-events:none}
.poem-view-game [hidden]{display:none!important}
@media(max-width:500px){.poem-view-game{gap:11px}.pvg-heading h3{font-size:22px}.pvg-stage{border-radius:14px}.pvg-camera-control{gap:8px;font-size:17px;padding:0}.pvg-actions{gap:9px}.pvg-actions button{font-size:18px;min-height:50px;padding:10px 14px}.pvg-location{font-size:14px;padding:5px 10px;bottom:8px}.pvg-photo-tray{gap:8px}.pvg-photo-tray figure{gap:6px;padding:6px}.pvg-photo-tray img{width:48px}.pvg-photo-tray figcaption{font-size:16px}.pvg-status{font-size:17px}.rain-cloud{width:80px;height:62px}.rain-spot{width:65px;height:50px;font-size:16px}.rain-progress{font-size:14px}}
.spring-near{transition:opacity .9s cubic-bezier(.22,.8,.25,1),transform .9s cubic-bezier(.22,.8,.25,1)}.spring-far{transition:transform .9s cubic-bezier(.22,.8,.25,1)}
.rain-spot{padding:0;white-space:nowrap}
.rain-spot.is-watered i{position:absolute;inset:-38px 8px 6px;background:repeating-linear-gradient(108deg,transparent 0 13px,#bce4e9 14px 16px,transparent 17px 28px);clip-path:polygon(0 0,100% 0,88% 100%,0 100%);pointer-events:none;animation:pvg-rain .7s ease-out both}
@keyframes pvg-rain{0%{opacity:.9;transform:translateY(-14px)}100%{opacity:0;transform:translateY(15px)}}
.challenge-type-microgame .pvg-kicker{display:none}
@media(max-width:500px) and (max-height:740px){.challenge-type-microgame .poem-view-game{gap:8px}.challenge-type-microgame .pvg-stage{max-height:145px}.challenge-type-microgame .pvg-heading h3{font-size:20px;margin-top:0}.challenge-type-microgame .pvg-camera-control input{height:44px}.challenge-type-microgame .pvg-status{font-size:16px}.challenge-type-microgame .pvg-photo-tray img{width:36px}.challenge-type-microgame .pvg-photo-tray figure{padding:4px}.rain-spot{height:44px}.rain-cloud{width:64px;height:50px}}
.poem-view-game[data-assets=loading] .pvg-stage::after,.poem-view-game[data-assets=error] .pvg-stage::after{content:'小畫卷正在展開…';position:absolute;inset:0;z-index:5;display:grid;place-content:center;padding:20px;background:#e9eee1;color:#55705c;font-size:19px;text-align:center}
.poem-view-game[data-assets=error] .pvg-stage::after{content:'畫卷還沒打開，請在下方重試。'}
@media(prefers-reduced-motion:reduce){.is-snapping .pvg-shutter,.rain-spot.is-watered i{animation:none}.rain-dry-veil,.mountain-end,.spring-near{transition:none}}
.mountain-stage{background:radial-gradient(ellipse at 50% 82%,#d5ddd04d,transparent 68%),linear-gradient(#e9f0ee,#f9f8ee);touch-action:pan-y;cursor:ew-resize}
.mountain-model{position:absolute;inset:0}.mountain-model canvas{display:block;width:100%;height:100%;touch-action:pan-y}
.mountain-loading{position:absolute;inset:0;z-index:4;display:grid;place-content:center;margin:0;padding:24px;background:#ecf1e9e8;text-align:center;font-size:19px;color:#4a685c}
.pvg-photo-image{display:grid;place-items:center;flex:none;width:68px;aspect-ratio:3/2;border-radius:5px;background:#e7ede1;overflow:hidden}.pvg-photo-image svg{width:24px;height:24px;color:#81947e}.pvg-photo-image img{display:block;width:100%;height:100%;object-fit:contain;background:linear-gradient(#e9f0ee,#f9f8ee)}
@media(max-width:500px){.pvg-photo-image{width:48px}.mountain-game .pvg-camera-control{font-size:16px}.mountain-game .pvg-stage{min-height:175px}}
@media(max-width:500px) and (max-height:740px){.challenge-type-microgame .mountain-game .pvg-stage{min-height:170px}.challenge-type-microgame .pvg-photo-image{width:36px}}
@media(prefers-reduced-motion:reduce){.spring-far,.spring-near{transition:none!important;transform:none!important}}

/* poem-games/garden-river.css */
.poem-garden,.poem-river{--gr-ink:#294c3b;--gr-leaf:#527955;max-width:900px;width:100%;margin-inline:auto;color:var(--gr-ink)}
.gr-instruction{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 10px}.gr-instruction p{margin:0;font-size:clamp(18px,2.3vw,23px);line-height:1.45;font-weight:650}.gr-count{flex:none;min-width:64px;text-align:center;padding:5px 10px;border-radius:18px;background:#edf3e7;font-size:18px;font-variant-numeric:tabular-nums;color:#3c6447}
.gr-picture{position:relative;isolation:isolate;width:100%;aspect-ratio:3/2;overflow:hidden;border-radius:20px;background:#d9d8c1;border:1px solid #d2d9c4;box-shadow:0 6px 20px #2c443110}.gr-background{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none;user-select:none}.gr-actionline{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:10px}.gr-method{font-size:clamp(16px,2vw,18px);line-height:1.5;color:#54705a}.gr-audio{font:inherit;font-size:17px;flex:none;min-height:44px;padding:8px 14px;border:1px solid #c6d6be;background:#f4f8ef;color:#355c3b;border-radius:22px;cursor:pointer;touch-action:manipulation}.gr-audio:before{content:'♪';margin-right:6px;font-size:21px}.gr-feedback{min-height:2.9em;font-size:clamp(17px,2vw,20px);line-height:1.55;margin:10px 0 0;text-align:center}.gr-loading{position:absolute;inset:0;z-index:130;background:#f7f8edd9;display:flex;align-items:center;justify-content:center;gap:14px;flex-direction:column;font-size:19px}.gr-loading[hidden]{display:none}.gr-loading button{font:inherit;color:#365c3d;min-height:44px;border:1px solid #bdceb7;border-radius:16px;padding:8px 20px;background:#fff}.poem-garden button:focus-visible,.poem-river button:focus-visible{outline:3px solid #176b50;outline-offset:3px}
.garden-plant{position:absolute;left:var(--x);top:var(--y);width:var(--size);height:auto;aspect-ratio:800/870;min-width:44px;min-height:44px;transform:translate(-50%,calc(-100% + var(--lift,0px)));z-index:var(--depth);padding:0;border:0;border-radius:45%;background:none;touch-action:none;cursor:grab;transition:opacity .36s ease,filter .2s ease;filter:drop-shadow(0 5px 3px #24301c30);-webkit-tap-highlight-color:transparent}.garden-plant img{display:block;width:100%;height:100%;object-fit:contain;transform:rotate(var(--turn));transform-origin:50% 95%;pointer-events:none;user-select:none}.garden-plant:hover:not(:disabled){filter:drop-shadow(0 0 5px #f4f1b1)}.garden-plant.is-bean{width:calc(var(--size) * .88);z-index:20}.garden-plant.is-weed{z-index:calc(var(--depth) + 30)}.garden-plant:disabled{opacity:1}.garden-plant.is-pulled{pointer-events:none;opacity:0;transform:translate(-50%,calc(-100% - 45px)) rotate(12deg);transition:transform .48s cubic-bezier(.18,.7,.23,1),opacity .38s ease}.garden-root{position:absolute;left:45%;bottom:-1%;width:10%;height:5%;border-radius:50%;background:#5b4c3133;filter:blur(1px);pointer-events:none}.garden-plant.is-shaking img{animation:garden-careful .48s ease}.garden-moonlight{position:absolute;inset:0;z-index:110;pointer-events:none;opacity:0;background:radial-gradient(ellipse at 74% 15%,#fffac147,transparent 56%);transition:opacity 1.2s}.poem-garden.is-done .garden-moonlight{opacity:1}.garden-end{position:absolute;left:18%;right:18%;top:20%;z-index:115;display:grid;gap:3px;text-align:center;color:#354b33;text-shadow:0 1px 8px #fffde6;background:#f7f2dcca;border:1px solid #fff9d994;border-radius:15px;padding:10px 12px;animation:gr-appear .55s ease}.garden-end[hidden]{display:none}.garden-end span{font-family:var(--serif,'Noto Serif HK',serif);font-size:clamp(22px,4vw,34px);letter-spacing:.12em}.garden-end small{font-size:clamp(15px,2vw,19px)}.poem-garden.is-readonly .garden-plant{cursor:default}
/* Keep transparent image margins from stealing taps from a neighbouring plant. */
.garden-plant{pointer-events:none}.garden-plant::after{content:'';position:absolute;inset:10% 6% 0;border-radius:44%;pointer-events:auto}.garden-plant:disabled::after,.garden-plant.is-pulled::after{pointer-events:none}
.garden-plant{transform:translate3d(calc(-50% + var(--sway,0px)),calc(-100% + var(--lift,0px)),0);user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.poem-garden .garden-plant,.garden-plant::after{touch-action:none}.garden-plant.is-pulling{z-index:125;cursor:grabbing;will-change:transform}
.garden-plant.is-pulled{transform:translate3d(-50%,calc(-100% - var(--pull-distance,65px)),0) rotate(12deg)}
.river-picture{touch-action:pan-y;cursor:crosshair}.river-picture.is-painting{touch-action:none}.river-waiting{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.river-wind{position:absolute;left:var(--x);top:var(--y);z-index:5;transform:translate(-50%,-50%);display:grid;place-items:center;gap:0;min-width:48px;min-height:48px;padding:5px 11px;border:1px solid #fffdeaaa;border-radius:24px;background:#fffdebdf;color:#4a6650;box-shadow:0 3px 9px #32483622;font:inherit;font-size:15px;cursor:pointer;touch-action:manipulation}.river-wind svg{width:21px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round}.river-wind.is-green{opacity:0;pointer-events:none;transition:opacity .4s}.river-wind:disabled{cursor:default}.river-moon{position:absolute;left:74.7%;top:14.3%;z-index:8;transform:translate(-50%,-50%);width:9%;aspect-ratio:1;min-width:44px;min-height:44px;border:0;border-radius:50%;background:transparent;box-shadow:0 0 0 2px #fff7c3b8,0 0 18px 9px #fff4b574;cursor:pointer;animation:river-moon-call 1.8s ease-in-out infinite}.river-moon[hidden]{display:none}.river-moon span{position:absolute;top:calc(100% + 5px);left:50%;transform:translateX(-50%);padding:3px 8px;border-radius:12px;white-space:nowrap;font:inherit;font-size:16px;color:#4b584d;background:#fff9dbdd}.river-moonlight{position:absolute;inset:0;pointer-events:none;z-index:3;opacity:0;transition:opacity 1s;background:radial-gradient(ellipse at 74.7% 14.3%,#fff7ba50,transparent 52%)}.poem-river.is-done .river-moonlight{opacity:1}.river-verse{position:absolute;left:18%;right:16%;bottom:14%;z-index:6;text-align:center;color:#2f5147;font:clamp(20px,4vw,35px)/1.5 var(--serif,'Noto Serif HK',serif);padding:8px 10px;background:#ffffeddd;border:1px solid #fdfbedbc;border-radius:16px;letter-spacing:.07em;text-shadow:0 1px 5px white;animation:gr-appear .5s ease}.river-verse[hidden]{display:none}.river-brush{position:absolute;z-index:10;pointer-events:none;width:14%;aspect-ratio:1;border:1px solid #fffaf0;border-radius:50%;box-shadow:0 0 0 2px #6b976840;background:#f8ffee15;transform:translate(-50%,-50%)}.river-brush[hidden]{display:none}
@keyframes garden-careful{0%,100%{transform:rotate(var(--turn))}25%{transform:rotate(calc(var(--turn) - 5deg))}70%{transform:rotate(calc(var(--turn) + 5deg))}}@keyframes gr-appear{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes river-moon-call{50%{box-shadow:0 0 0 4px #fff7c38a,0 0 23px 12px #fff4b592}}
@media(max-width:500px){.gr-instruction{gap:8px}.gr-instruction p{font-size:18px}.gr-count{min-width:54px;padding:4px 7px;font-size:16px}.gr-picture{border-radius:15px}.gr-actionline{gap:7px}.gr-method{font-size:16px}.gr-audio{font-size:16px;padding:8px 10px}.gr-feedback{font-size:17px;text-align:left}.garden-end{left:14%;right:14%;top:14%;padding:6px 10px}.garden-end span{font-size:23px}.garden-end small{font-size:15px}.river-wind{font-size:14px;padding:4px 8px}.river-verse{left:9%;right:9%;bottom:15%;font-size:23px}.river-moon span{font-size:15px}.garden-plant{min-width:44px}}
@media(prefers-reduced-motion:reduce){.garden-plant,.garden-moonlight,.river-moonlight,.river-wind{transition:none}.garden-plant.is-shaking img,.garden-end,.river-verse,.river-moon{animation:none}}

/* Three chapters of the river game; scoped so the garden keeps its own layout. */
.journey-river .river-wind,.journey-river .rj-stops{display:none!important}
.journey-river{display:grid;gap:12px;max-width:760px}.journey-river *{box-sizing:border-box}.journey-river [hidden]{display:none!important}.journey-river button{font-family:inherit;touch-action:manipulation}.rj-header{display:flex;justify-content:space-between;gap:10px;align-items:center}.rj-header>div>span{font-size:15px;letter-spacing:.13em;color:#708474}.rj-header h3{margin:2px 0 0;font-size:clamp(22px,3vw,29px);font-weight:650;line-height:1.4}.rj-progress{font-size:19px;white-space:nowrap;font-weight:500;color:#69816b;font-variant-numeric:tabular-nums}.journey-river .gr-picture{box-shadow:none;cursor:default}.journey-river .gr-picture.is-painting{cursor:crosshair}.journey-river[data-chapter="0"] .river-waiting{visibility:hidden}.journey-river .river-moon{animation:none;touch-action:none}.rj-boat-target{position:absolute;left:43%;top:77%;transform:translate(-50%,-50%);width:35%;height:17%;min-height:48px;padding:0;z-index:9;border:2px dashed #fff9d0;border-radius:50%;background:#fff6c522;cursor:pointer;box-shadow:0 0 18px #fff4c844}.rj-boat-target span{position:absolute;top:100%;left:50%;transform:translateX(-50%);white-space:nowrap;font-size:17px;padding:3px 9px;border-radius:12px;background:#fff9e5ec;color:#42604d}.journey-river[data-berthed="true"][data-chapter="0"] .rj-boat-target{border-style:solid;border-color:#709778;background:#e8f5cd15}.rj-boat-target:disabled{opacity:.72;cursor:default}.rj-light-path{position:absolute;inset:0;width:100%;height:100%;z-index:4;pointer-events:none;opacity:0;transition:opacity .5s}.rj-light-path path{fill:none;stroke:#fff8caa8;stroke-width:.8;stroke-dasharray:1.5 2.4;stroke-linecap:round}.journey-river[data-chapter="2"] .rj-light-path{opacity:1}.journey-river.is-done .rj-light-path{opacity:0}.rj-moving-light{position:absolute;width:16%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,#fff4c1a0,#fff2c031 44%,transparent 70%);pointer-events:none;z-index:11}.journey-river.is-light-selected .rj-boat-target{box-shadow:0 0 24px #ffeecb99;border-style:solid}.journey-river .river-verse{top:14%;bottom:auto;left:28%;right:5%;font-size:clamp(23px,3vw,30px);padding:9px 12px;letter-spacing:.08em;background:#ffffebdf}.journey-river .river-verse small{font-family:inherit;font-size:.64em;letter-spacing:.04em}.rj-verse{margin:0;text-align:center;font-size:clamp(25px,4vw,33px);font-weight:600;line-height:1.4;letter-spacing:.09em}.rj-task{margin:0;text-align:center;font-size:19px;line-height:1.45;color:#60755f;text-wrap:pretty}.rj-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}.journey-river .gr-audio,.rj-next{min-height:52px;border:1px solid #bfcdb9;border-radius:16px;padding:10px 18px;font-size:21px;font-weight:600;background:#fffdf4;color:#355943;cursor:pointer;line-height:1.3}.rj-next{background:#446d50;border-color:#446d50;color:#fffdf1}.journey-river .gr-audio:disabled{opacity:.62}.rj-stops{display:flex;justify-content:center;gap:10px}.rj-stops span{font-size:17px;padding:4px 10px;border-radius:20px;color:#89987d;background:#edf0e4;transition:background .3s,color .3s}.rj-stops span::before{content:'○';margin-right:5px}.rj-stops span.is-green{color:#3c6c44;background:#e1edcf}.rj-stops span.is-green::before{content:'✓'}.journey-river .gr-feedback{margin:0;min-height:2.8em;font-size:18px;line-height:1.45;text-align:center;color:#55715a;text-wrap:pretty}.journey-river.is-reduced-motion *{animation:none!important;transition:none!important}@media(max-width:420px){.journey-river{gap:10px}.rj-header h3{font-size:22px}.rj-header>div>span{font-size:14px}.rj-verse{font-size:24px;letter-spacing:.04em}.rj-task{font-size:18px}.journey-river .gr-feedback{font-size:17px}.journey-river .gr-audio,.rj-next{font-size:20px;padding:9px 15px;min-height:50px}.rj-boat-target span,.rj-stops span{font-size:15px}.rj-stops{gap:7px}.rj-stops span{padding:4px 8px}.journey-river .river-verse{left:24%;right:4%;font-size:22px}.journey-river .river-moon span{font-size:15px}}
.challenge-type-microgame .rj-header>div>span{display:none}.journey-river .rj-boat-target span{top:80%}

/* poem-games/river-puzzle.css */
.river-puzzle-game{width:100%;max-width:900px;margin-inline:auto;color:#294d43;font-family:var(--sans);display:flex;flex-direction:column;gap:12px;min-width:0}
.river-puzzle-heading{display:flex;align-items:end;justify-content:space-between;gap:14px}.river-puzzle-heading span{display:block;color:#7b765f;font-size:17px;line-height:1.35}.river-puzzle-heading h3{margin:2px 0 0;font:650 clamp(23px,3vw,30px)/1.35 var(--sans);letter-spacing:0}.river-puzzle-heading b{flex:none;min-width:72px;padding:6px 12px;border-radius:18px;background:#edf3e7;color:#41654e;text-align:center;font-size:18px;font-variant-numeric:tabular-nums}
.river-puzzle-work{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(220px,.72fr);align-items:center;gap:18px;min-width:0}.river-puzzle-board{position:relative;isolation:isolate;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:4px;width:100%;aspect-ratio:3/2;overflow:hidden;border:1px solid #bccbb8;border-radius:16px;background-color:#e5ece3;background-image:none;background-position:center;background-size:cover;box-shadow:0 5px 18px #34513e14}.river-puzzle-board::after{content:'';position:absolute;inset:0;z-index:4;pointer-events:none;border-radius:inherit;box-shadow:inset 0 0 0 1px #fff9}
.river-puzzle-slot{position:relative;z-index:1;min-width:44px;min-height:44px;overflow:hidden;padding:0;border:1px dashed #66816d78;background:#fffdf159;color:#506d5c;cursor:pointer;touch-action:manipulation}.river-puzzle-slot.has-piece{touch-action:none}.river-puzzle-slot:first-child{border-top-left-radius:14px}.river-puzzle-slot:nth-child(3){border-top-right-radius:14px}.river-puzzle-slot:nth-child(4){border-bottom-left-radius:14px}.river-puzzle-slot:nth-child(6){border-bottom-right-radius:14px}.river-puzzle-slot:hover:not(:disabled),.river-puzzle-slot.is-drop-target{z-index:3;border-color:#d39a49;background:#fff7d88a;box-shadow:inset 0 0 0 3px #f4c86c}.river-puzzle-slot:focus-visible,.river-puzzle-piece:focus-visible,.river-puzzle-actions button:focus-visible{z-index:5;outline:3px solid #176b50;outline-offset:-4px}.river-puzzle-slot:disabled{cursor:default}.river-slot-number{display:grid;place-items:center;width:100%;height:100%;font:600 clamp(20px,3vw,28px)/1 var(--sans);color:#61786670}
.river-puzzle-piece{--piece-position:0 0;display:block;background-image:var(--river-art);background-repeat:no-repeat;background-size:300% 200%;background-position:var(--piece-position);-webkit-tap-highlight-color:transparent}.river-puzzle-slot>.river-puzzle-piece{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.river-puzzle-slot>.river-puzzle-piece>span{display:block;width:100%;height:100%}.river-puzzle-piece.is-selected{box-shadow:inset 0 0 0 4px #f3bc57,0 0 0 2px #fff;filter:saturate(1.08)}.river-puzzle-piece.is-drag-source{opacity:.28}
.river-puzzle-side{display:flex;flex-direction:column;gap:10px;min-width:0}.river-puzzle-instruction{margin:0;font-size:18px;line-height:1.55;color:#526c5d}.river-puzzle-tray{display:grid;grid-template-columns:repeat(3,minmax(44px,1fr));gap:8px;min-height:104px;padding:9px;border:1px solid #d3ddcd;border-radius:14px;background:#f4f6eeee}.river-puzzle-tray>.river-puzzle-piece{width:100%;aspect-ratio:1;padding:0;border:1px solid #fff;border-radius:8px;box-shadow:0 3px 8px #334b3730;cursor:grab;touch-action:none}.river-puzzle-tray>.river-puzzle-piece:active{cursor:grabbing}.river-tray-empty{grid-column:1/-1;align-self:center;text-align:center;font-size:17px;line-height:1.5;color:#66806d}
.river-puzzle-actions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}.river-puzzle-actions button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:50px;padding:9px 17px;border:1px solid #b9cbae;border-radius:14px;background:#fffef7;color:#356148;font:550 19px/1.4 var(--sans);cursor:pointer;touch-action:manipulation}.river-puzzle-actions button:first-child{background:#3d7458;color:#fff;border-color:#3d7458}.river-puzzle-actions button:disabled{opacity:.56;cursor:default}.river-puzzle-status{min-height:1.6em;margin:0;text-align:center;color:#5a6f60;font-size:18px;line-height:1.55}.river-puzzle-preload{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;clip-path:inset(50%)!important;white-space:nowrap!important}
.river-puzzle-ghost{position:fixed;z-index:9999;width:92px;aspect-ratio:1;transform:translate(-50%,-50%) rotate(2deg);border:2px solid #fff;border-radius:10px;background-image:var(--river-art);background-repeat:no-repeat;background-size:300% 200%;background-position:var(--piece-position);box-shadow:0 10px 30px #1e352b59;pointer-events:none}.river-puzzle-game.is-dragging .river-puzzle-slot:not(.is-drop-target){filter:saturate(.82)}
.river-puzzle-game.is-complete .river-puzzle-heading,.river-puzzle-game.is-complete .river-puzzle-side{display:none}.river-puzzle-game.is-complete .river-puzzle-work{display:block}.river-puzzle-game.is-complete .river-puzzle-board{gap:0;max-width:700px;margin-inline:auto;background-image:var(--river-art);box-shadow:0 7px 22px #334f3b22}.river-puzzle-game.is-complete .river-puzzle-slot{border:0}.river-puzzle-game.is-complete .river-puzzle-piece{box-shadow:none}.river-puzzle-game:is(.is-complete,.is-readonly) :is(.river-puzzle-piece,.river-puzzle-slot){touch-action:pan-y}.river-puzzle-game[data-assets=loading] .river-puzzle-board::before,.river-puzzle-game[data-assets=error] .river-puzzle-board::before{content:'春江畫卷正在展開…';position:absolute;inset:0;z-index:8;display:grid;place-items:center;padding:20px;background:#edf1e7;color:#536d5c;font-size:19px;text-align:center}.river-puzzle-game[data-assets=error] .river-puzzle-board::before{content:'畫卷還沒打開，請按下方按鈕重試。'}
.challenge-type-microgame .challenge-body:has(.river-puzzle-game.is-complete){justify-content:flex-start}
@media(max-width:700px){.river-puzzle-game{gap:8px}.river-puzzle-heading{align-items:center}.river-puzzle-heading>div>span{display:none}.river-puzzle-heading h3{font-size:23px}.river-puzzle-heading b{min-width:65px;font-size:17px;padding:5px 10px}.river-puzzle-work{display:flex;flex-direction:column;gap:8px}.river-puzzle-board{max-width:330px;border-radius:13px}.river-puzzle-side{width:100%;gap:6px}.river-puzzle-instruction{text-align:center;font-size:17px;line-height:1.4}.river-puzzle-tray{align-self:center;width:min(100%,210px);min-height:78px;padding:6px;gap:6px}.river-puzzle-actions button{min-height:48px;font-size:18px;padding:8px 14px}.river-puzzle-status{font-size:17px;line-height:1.4;text-align:left}.river-puzzle-ghost{width:76px}}
@media(max-width:370px) and (max-height:650px){.river-puzzle-game{gap:7px}.river-puzzle-heading span{display:none}.river-puzzle-heading h3{font-size:21px}.river-puzzle-board{max-height:168px;width:auto;max-width:100%;align-self:center}.river-puzzle-instruction{font-size:16px}.river-puzzle-tray{min-height:66px;gap:5px;padding:5px}.river-puzzle-actions button{min-height:46px}.river-puzzle-status{font-size:16px;min-height:1.45em}}
@media(orientation:landscape) and (max-height:500px){.challenge-type-microgame .river-puzzle-game{gap:7px}.challenge-type-microgame .river-puzzle-heading{display:none}.challenge-type-microgame .river-puzzle-work{grid-template-columns:210px minmax(280px,360px);justify-content:center;gap:12px}.challenge-type-microgame .river-puzzle-board{width:210px;height:140px;aspect-ratio:auto;border-radius:11px}.challenge-type-microgame .river-puzzle-side{gap:5px}.challenge-type-microgame .river-puzzle-instruction{font-size:16px;line-height:1.35;text-align:left}.challenge-type-microgame .river-puzzle-tray{grid-template-columns:repeat(6,minmax(44px,1fr));min-height:58px;padding:5px;gap:5px}.challenge-type-microgame .river-puzzle-actions button{min-height:44px;padding:6px 13px;font-size:17px}.challenge-type-microgame .river-puzzle-status{font-size:16px;min-height:1.4em;line-height:1.4}}
@media(prefers-reduced-motion:reduce){.river-puzzle-ghost{transform:translate(-50%,-50%)}}

/* Six stable tray positions prevent the remaining fragments from resizing and
   spilling out when another piece is moved into the picture. */
.river-puzzle-tray{box-sizing:border-box;grid-template-rows:repeat(2,minmax(0,1fr));align-items:stretch;min-width:0;flex-shrink:0}
.river-puzzle-tray>.river-puzzle-piece,.river-puzzle-tray>.river-tray-space{min-width:0;min-height:0;max-width:100%;width:100%;aspect-ratio:1}
.river-puzzle-tray>.river-tray-space{display:block;border:1px dashed #d9e1d1;border-radius:8px;background:#e9efe330;pointer-events:none}
@media(orientation:landscape) and (max-height:500px){.challenge-type-microgame .river-puzzle-tray{grid-template-rows:minmax(0,1fr)}}

/* poem-games/spring-search.css */
.rain-catcher{
  --rc-ink:#264f48;--rc-green:#39715b;--rc-gold:#b29a64;
  width:100%;max-width:700px;margin:auto;display:grid;gap:10px;
  color:var(--rc-ink);font-family:var(--sans);min-width:0;
}
.rain-catcher *{box-sizing:border-box}
.rain-catcher [hidden]{display:none!important}
.rain-catcher .rc-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}
.rain-catcher .rc-heading h3{font-size:clamp(25px,3vw,30px);font-weight:700;letter-spacing:.05em;line-height:1.3;margin:0}
.rain-catcher .rc-round-count{flex:none;font-size:17px;line-height:1.4;color:#5c7568;letter-spacing:.02em}
.rain-catcher .rc-collection{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;width:min(100%,430px);justify-self:center;padding:1px 0 3px}
.rain-catcher .rc-collection>span{position:relative;display:grid;place-items:center;min-width:0;height:49px;color:#829487;border:1px solid #d5dfcf;border-radius:15px 15px 18px 18px;background:linear-gradient(160deg,#fffef5,#f0f4e9);box-shadow:inset 0 1px 0 #fff;transition:background .3s,border-color .3s,box-shadow .3s}
.rain-catcher .rc-collection b{font:500 23px/1.2 var(--serif,serif)}
.rain-catcher .rc-collection i{position:absolute;right:7px;bottom:7px;width:5px;height:5px;border-radius:50%;background:#ccd6c6}
.rain-catcher .rc-collection .is-current{color:#2f6854;border-color:#91b6a0;background:linear-gradient(150deg,#fffef5,#e7f2df);box-shadow:inset 0 1px 0 #fff,0 0 0 2px #dcebd15e}
.rain-catcher .rc-collection .is-current i{background:#659078}
.rain-catcher .rc-collection .is-earned{border-color:#aecb9d;color:#355d3b;background:linear-gradient(145deg,#f5f9df,#e5edce)}
.rain-catcher .rc-collection .is-earned b{font-size:27px;font-weight:600}
.rain-catcher .rc-collection .is-earned i{width:9px;height:6px;right:6px;bottom:7px;border-radius:75% 10% 75% 10%;transform:rotate(-23deg);background:#689351}
.rain-catcher .rc-mission{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:54px;border-radius:17px;background:linear-gradient(105deg,#e9f1e3,#f5f5e9);border:1px solid #e0e8d7;padding:4px 6px 4px 15px;font-size:20px;line-height:1.4}
.rain-catcher .rc-mission strong{font-size:29px;font-weight:700;color:#215c49;padding-inline:5px;letter-spacing:.025em}
.rain-catcher .rc-mission button{flex:none;width:46px;height:46px;display:grid;place-items:center;border:1px solid #c4d4ba;border-radius:50%;background:linear-gradient(#fffef8,#f4f7e9);box-shadow:0 2px 3px #35513b06;color:#35694b;cursor:pointer}
.rain-catcher .rc-mission svg{width:24px;height:24px}
.rain-catcher .rc-field{position:relative;width:100%;aspect-ratio:1.5;max-height:380px;min-height:210px;overflow:hidden;isolation:isolate;background:#e3eddf;border-radius:23px;border:1px solid #cbdacb;box-shadow:inset 0 0 0 1px #ffffff65,0 3px 12px #34554306;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;contain:layout paint}
.rain-catcher .rc-scene{position:absolute;width:100%;height:100%;inset:0;object-fit:cover;pointer-events:none;filter:saturate(.9)}
.rain-catcher .rc-spring-light{position:absolute;inset:0;background:linear-gradient(135deg,#f9eb943b,transparent 55%,#a1d78734);opacity:var(--spring-earned,0);transition:opacity .8s;pointer-events:none}
.rain-catcher .rc-drizzle{position:absolute;inset:-20% 0;pointer-events:none;opacity:.3;background:repeating-linear-gradient(105deg,transparent 0 61px,#edf9ff 62px 63px,transparent 64px 127px);mask-image:linear-gradient(transparent,#0006,transparent);animation:rc-rain 3s linear infinite;animation-play-state:paused}
.rain-catcher[data-phase=falling] .rc-drizzle{animation-play-state:running}
.rain-catcher .rc-lanes{position:absolute;inset:0;display:grid;grid-template-columns:repeat(3,1fr);pointer-events:none;opacity:.16;background:linear-gradient(90deg,transparent 33.1%,#fcfff566 33.3%,transparent 33.6%,transparent 66.4%,#fcfff566 66.7%,transparent 66.9%)}
.rain-catcher .rc-lanes i{display:none}
.rain-catcher .rc-drops{position:absolute;top:0;inset-inline:0;height:0;pointer-events:none;will-change:transform}
.rain-catcher .rc-drop{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;justify-content:center;width:88px;height:97px;padding:17px 4px 7px;text-align:center;color:#224e48;isolation:isolate;transition:opacity .2s}
.rain-catcher .rc-drop:before{content:'';position:absolute;z-index:-1;width:78%;height:75%;left:11%;top:18%;transform:rotate(45deg);border-radius:12% 67% 67% 67%;border:1px solid #7aaea49c;background:radial-gradient(ellipse at 23% 15%,#fffffffa 0,#ffffffe8 25%,#e5f7edee 57%,#c6e4dbec 100%);box-shadow:inset 2px 2px 3px #ffffffed,inset -2px -3px 5px #6eafa432,2px 4px 6px #24565316;transition:background .2s,box-shadow .2s}
.rain-catcher .rc-drop:after{content:'';position:absolute;width:20%;height:9%;left:22%;top:24%;border-radius:50%;background:#fff9;transform:rotate(-45deg);pointer-events:none}
.rain-catcher .rc-glyph{position:relative;display:grid;place-items:center;width:57px;height:57px;flex:none;font:500 45px/1 KaiTi,STKaiti,var(--serif,serif);color:#244c45;filter:drop-shadow(0 1px 0 #ffffffa8)}
.rain-catcher .rc-character{display:block;width:100%;height:100%;fill:currentColor;overflow:visible}
.rain-catcher .rc-drop>small{position:absolute;left:0;right:0;bottom:1px;min-height:18px;font-size:16px;font-weight:600;line-height:1.2;color:#326350;letter-spacing:.025em;text-shadow:0 1px #ffffffe8}
.rain-catcher .rc-drop-shine{position:absolute;width:5px;height:5px;right:20%;top:35%;border-radius:50%;background:#ffffffb3;pointer-events:none}
.rain-catcher .rc-drop.is-caught:before{border-color:#8ca665;background:radial-gradient(ellipse at 25% 20%,#fffff4,#edf7cce8 55%,#c1dfa6ee);box-shadow:inset 2px 2px 3px #fffefa,inset -2px -3px 5px #71964423,0 0 0 4px #fff9cb46}
.rain-catcher .rc-drop.is-wrong:before{border-color:#bea572;background:radial-gradient(ellipse at 25% 20%,#fffff8,#fff6d8ee 55%,#f1e6c8ee)}
.rain-catcher .rc-catch-line{position:absolute;top:79%;left:10%;right:10%;height:12%;border-radius:50%;background:radial-gradient(ellipse,#f4ffe337 0,#efffdc0a 60%,transparent 72%);pointer-events:none}
.rain-catcher .rc-boat{position:absolute;left:0;top:80%;width:125px;height:70px;transform:translate3d(0,0,0) translate(-50%,-30%);pointer-events:none;transition:transform .14s ease-out;will-change:transform}
.rain-catcher.is-dragging .rc-boat{transition:none}
.rain-catcher .rc-boat img{position:relative;display:block;width:100%;height:100%;object-fit:contain;z-index:1}
.rain-catcher .rc-boat-ripple{position:absolute;left:4%;right:4%;top:64%;height:25%;border-radius:50%;border:1px solid #fffbdcba;box-shadow:0 0 0 5px #e0f3da36;transform:scaleY(.62)}
.rain-catcher .rc-splash{position:absolute;inset:0;pointer-events:none}
.rain-catcher .rc-splash i{position:absolute;left:49%;top:34%;width:5px;height:9px;opacity:0;border-radius:70% 70% 65% 65%;background:#f1fff3;border:1px solid #95c7b8}
.rain-catcher .rc-splash i:first-child{--rc-splash-x:-30px;--rc-splash-y:-18px}
.rain-catcher .rc-splash i:nth-child(2){--rc-splash-x:3px;--rc-splash-y:-28px}
.rain-catcher .rc-splash i:last-child{--rc-splash-x:28px;--rc-splash-y:-15px}
.rain-catcher.is-celebrating .rc-splash i{animation:rc-splash .6s ease-out both}
.rain-catcher.is-celebrating .rc-boat-ripple{animation:rc-ripple .7s ease-out both}
.rain-catcher .rc-intro,.rain-catcher .rc-ending,.rain-catcher .rc-loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:18px;text-align:center;z-index:4}
.rain-catcher .rc-intro{background:linear-gradient(180deg,#edf4e80d,#edf4e83b)}
.rain-catcher .rc-intro>div{width:min(100%,370px);padding:20px 16px 18px;border-radius:23px;background:linear-gradient(155deg,#fffef4f5,#f4f8e9eb);border:1px solid #fffffff5;box-shadow:0 8px 28px #385a3310,inset 0 0 0 4px #fffdf533}
.rain-catcher .rc-intro strong,.rain-catcher .rc-ending>strong{display:block;font-size:24px;line-height:1.4;letter-spacing:.015em}
.rain-catcher .rc-intro p{font-size:19px;margin:9px 0 15px;line-height:1.5;color:#5a7462;text-wrap:pretty}
.rain-catcher .rc-intro-icon{display:block;margin:0 auto 9px;width:35px;height:35px;color:#719568}
.rain-catcher .rc-intro-icon svg{width:100%;height:100%}
.rain-catcher button{font-family:var(--sans);line-height:1.3;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.rain-catcher .rc-primary{min-height:49px;padding:10px 20px;border:1px solid #326950;border-radius:15px;background:linear-gradient(155deg,#467e64,#326850);box-shadow:inset 0 1px 0 #ffffff24,0 2px 3px #294d3810;color:#fffef3;font-size:20px;font-weight:600;cursor:pointer}
.workspace .rain-catcher button.rc-primary{color:#fffef3}
.rain-catcher .rc-controls{display:grid;grid-template-columns:58px minmax(0,1fr) 58px;gap:12px;width:min(100%,400px);justify-self:center}
.rain-catcher .rc-controls>button:not(.rc-primary){border:1px solid #bacdb1;border-radius:15px;background:linear-gradient(#fffef6,#f4f5e7);box-shadow:inset 0 1px 0 #fff;color:#38684c;font-size:29px;line-height:1;min-height:49px;cursor:pointer}
.rain-catcher button:disabled{opacity:.5;cursor:default}
.rain-catcher button:focus-visible,.rain-catcher .rc-field:focus-visible{outline:3px solid #b3934a;outline-offset:3px}
.rain-catcher button:active:not(:disabled){filter:brightness(.97)}
.rain-catcher .rc-slow-catch{border:1px solid #d8e1cd;border-radius:12px;background:#f3f6e8;color:#456c4f;font-size:18px;min-height:44px;padding:8px 12px;cursor:pointer;width:min(100%,400px);justify-self:center}
.rain-catcher .rc-status{font-size:18px;line-height:1.6;margin:0;text-align:center;color:#58725d;min-height:1.6em;text-wrap:pretty}
.rain-catcher[data-phase=falling] .rc-status,.rain-catcher[data-phase=paused] .rc-status,.rain-catcher[data-phase=steady] .rc-status{display:none}
.rain-catcher[data-phase=intro] .rc-status,.rain-catcher[data-phase=feedback] .rc-status,.rain-catcher[data-phase=done] .rc-status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.rain-catcher .rc-feedback{position:absolute;left:7%;right:7%;top:6%;z-index:3;padding:9px 13px;border:1px solid #e1e8ca;border-radius:15px;background:linear-gradient(145deg,#fffef7f5,#f3f8e6f0);text-align:center;color:#315c48;line-height:1.35;box-shadow:0 3px 15px #35513b0d;pointer-events:none}
.rain-catcher .rc-feedback strong{display:block;font-size:23px;font-weight:600}
.rain-catcher .rc-feedback span{display:block;margin-top:3px;font-size:17px;color:#58715b}
.rain-catcher .rc-feedback[data-result=incorrect]{border-color:#e2d8b8;background:linear-gradient(145deg,#fffef5f7,#f9f1dff2)}
.rain-catcher .rc-ending{flex-direction:column;gap:14px;background:linear-gradient(160deg,#f0f6e7e8,#e5f2d8c7)}
.rain-catcher .rc-wordbook{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;width:min(100%,480px)}
.rain-catcher .rc-wordbook>button{display:grid;place-items:center;gap:4px;min-width:0;min-height:76px;padding:9px 3px;border:1px solid #d3ddbd;border-radius:16px;background:linear-gradient(140deg,#fffef5,#f3f6df);box-shadow:inset 0 1px 0 #fff;color:#355d47;cursor:pointer}
.rain-catcher .rc-wordbook>button>span{font:500 33px/1.1 KaiTi,STKaiti,var(--serif,serif)}
.rain-catcher .rc-word-glyph{display:block;width:40px;height:40px;max-width:100%}
.rain-catcher .rc-wordbook small{font-size:17px;line-height:1.2;color:#657651}
.rain-catcher .rc-replay{justify-self:center;min-height:46px;padding:9px 20px;border:1px solid #aec6a2;border-radius:14px;background:linear-gradient(#fffef6,#edf3e0);color:#3b6950;font-size:19px;font-weight:600;cursor:pointer}
.rain-catcher .rc-ending p{font-size:18px;margin:0;line-height:1.5;color:#597256}
.rain-catcher .rc-loading{flex-direction:column;gap:12px;background:#f2f5e8;font-size:20px}
.rain-catcher .rc-loading button{font-size:19px;min-height:48px;border:1px solid #acbf9f;background:#fffef6;color:#426e49;border-radius:14px;padding:9px 18px}
.rain-catcher.is-done .rc-field,.rain-catcher[data-phase=intro] .rc-field{touch-action:pan-y;overscroll-behavior:auto}
.rain-catcher.is-done .rc-lanes{display:none}
@keyframes rc-rain{from{transform:translateY(-15px)}to{transform:translateY(25px)}}
@keyframes rc-ripple{0%{transform:scale(.9,.62);opacity:1}100%{transform:scale(1.65,1);opacity:0}}
@keyframes rc-splash{0%{transform:translate(0,0) scale(.7);opacity:0}20%{opacity:.95}100%{transform:translate(var(--rc-splash-x),var(--rc-splash-y)) scale(.3);opacity:0}}
@media(max-width:420px){
  .rain-catcher{gap:8px}.rain-catcher .rc-heading h3{font-size:25px}.rain-catcher .rc-round-count{font-size:16px}
  .rain-catcher .rc-collection{gap:7px}.rain-catcher .rc-collection>span{height:44px;border-radius:13px 13px 16px 16px}
  .rain-catcher .rc-collection b{font-size:21px}.rain-catcher .rc-collection .is-earned b{font-size:25px}
  .rain-catcher .rc-mission{font-size:18px;padding-left:10px;min-height:51px}.rain-catcher .rc-mission strong{font-size:28px;padding-inline:3px}
  .rain-catcher .rc-field{aspect-ratio:1.1;max-height:330px;border-radius:19px}
  .rain-catcher .rc-drop{width:77px;height:88px;padding-top:17px}.rain-catcher .rc-glyph{width:49px;height:49px;font-size:40px}.rain-catcher .rc-drop>small{font-size:15px}
  .rain-catcher .rc-boat{width:113px;height:65px}.rain-catcher .rc-status{font-size:17px}
  .rain-catcher .rc-intro>div{padding:17px 12px}.rain-catcher .rc-intro strong{font-size:23px}.rain-catcher .rc-intro p{font-size:18px}
  .rain-catcher .rc-controls{gap:9px;grid-template-columns:55px minmax(0,1fr) 55px}
  .rain-catcher .rc-feedback strong{font-size:21px}.rain-catcher .rc-feedback span{font-size:16px}
  .rain-catcher .rc-ending{padding:14px;gap:12px}.rain-catcher .rc-wordbook{gap:5px}.rain-catcher .rc-wordbook>button{min-height:67px;border-radius:13px}
  .rain-catcher .rc-wordbook>button>span{font-size:29px}.rain-catcher .rc-wordbook small{font-size:15px}
  .rain-catcher .rc-word-glyph{width:34px;height:34px}
}
@media(max-width:360px){
  .rain-catcher .rc-mission{font-size:17px}.rain-catcher .rc-mission strong{font-size:25px}
  .rain-catcher .rc-drop{width:66px;height:79px}.rain-catcher .rc-glyph{width:43px;height:43px;font-size:35px}
  .rain-catcher .rc-boat{width:99px;height:58px}.rain-catcher .rc-intro-icon{display:none}.rain-catcher .rc-ending>strong{font-size:21px}
  .rain-catcher .rc-wordbook>button>span{font-size:27px}.rain-catcher .rc-wordbook small{font-size:13px}
  .rain-catcher .rc-word-glyph{width:31px;height:31px}
}
@media(max-width:520px) and (max-height:700px){
  .rain-catcher{gap:6px}.rain-catcher .rc-heading h3{font-size:23px}
  .rain-catcher .rc-collection{gap:6px;padding:0}.rain-catcher .rc-collection>span{height:36px;border-radius:11px}.rain-catcher .rc-collection b{font-size:18px}.rain-catcher .rc-collection .is-earned b{font-size:23px}
  .rain-catcher .rc-field{height:165px;min-height:165px;max-height:165px;aspect-ratio:auto}
  .rain-catcher .rc-drop{width:60px;height:67px;padding:12px 3px 5px}.rain-catcher .rc-glyph{width:40px;height:40px;font-size:33px}.rain-catcher .rc-drop>small{bottom:-1px;font-size:13px}
  .rain-catcher .rc-boat{width:90px;height:46px}.rain-catcher .rc-intro{padding:6px}.rain-catcher .rc-intro>div{padding:11px}
  .rain-catcher .rc-intro-icon{display:none}.rain-catcher .rc-intro strong{font-size:20px}.rain-catcher .rc-intro p{font-size:16px;margin:5px 0 8px}
  .rain-catcher .rc-primary{min-height:46px;font-size:19px;padding:8px 14px}.rain-catcher .rc-controls>button:not(.rc-primary){min-height:46px}
  .rain-catcher .rc-mission{min-height:46px}.rain-catcher .rc-mission button{width:42px;height:42px}.rain-catcher .rc-status{font-size:16px;line-height:1.45}
  .rain-catcher .rc-feedback{padding:6px 9px;top:5%;border-radius:12px}.rain-catcher .rc-feedback strong{font-size:18px}.rain-catcher .rc-feedback span{font-size:14px;margin-top:1px}
  .rain-catcher .rc-ending{gap:8px;padding:10px}.rain-catcher .rc-ending>strong{font-size:20px}.rain-catcher .rc-wordbook>button{min-height:63px;padding:5px 2px}.rain-catcher .rc-ending p{display:none}
}
@media(min-width:1000px) and (max-height:900px){
  .rain-catcher{max-width:960px;grid-template-columns:minmax(0,1.35fr) minmax(300px,1fr);gap:10px 24px;align-items:center}
  .rain-catcher .rc-field{grid-column:1;grid-row:1 / span 5;height:340px;min-height:280px;max-height:340px;aspect-ratio:auto}
  .rain-catcher .rc-heading,.rain-catcher .rc-collection,.rain-catcher .rc-mission,.rain-catcher .rc-controls,.rain-catcher .rc-slow-catch,.rain-catcher .rc-replay{grid-column:2}
  .rain-catcher .rc-status{grid-column:1 / -1}
  .rain-catcher .rc-mission{font-size:18px;padding-left:10px}.rain-catcher .rc-mission strong{font-size:27px}
  .rain-catcher .rc-wordbook{gap:7px}.rain-catcher .rc-wordbook small{font-size:16px}
}
@media(orientation:landscape) and (max-height:500px) and (min-width:560px){
  .rain-catcher{grid-template-columns:minmax(210px,.8fr) minmax(285px,1.2fr);align-items:center;gap:5px 12px}
  .rain-catcher .rc-field{height:145px;min-height:145px;max-height:145px;width:238px;max-width:100%;justify-self:center;grid-column:1;grid-row:1 / span 4;aspect-ratio:auto}
  .rain-catcher .rc-heading,.rain-catcher .rc-collection,.rain-catcher .rc-mission,.rain-catcher .rc-controls,.rain-catcher .rc-slow-catch,.rain-catcher .rc-replay{grid-column:2}
  .rain-catcher .rc-heading h3{font-size:20px}.rain-catcher .rc-round-count{font-size:15px}
  .rain-catcher .rc-collection{gap:6px;padding:0}.rain-catcher .rc-collection>span{height:29px;border-radius:10px}.rain-catcher .rc-collection b{font-size:17px}.rain-catcher .rc-collection .is-earned b{font-size:22px}.rain-catcher .rc-collection i{right:5px;bottom:5px;width:4px;height:4px}
  .rain-catcher .rc-mission{min-height:44px;padding:0 5px 0 9px;font-size:16px}.rain-catcher .rc-mission strong{font-size:23px}.rain-catcher .rc-mission button{width:42px;height:42px}
  .rain-catcher .rc-controls{justify-self:stretch;width:100%;gap:8px;grid-template-columns:48px 1fr 48px}.rain-catcher .rc-controls button{min-height:44px;font-size:18px;padding:7px 10px}
  .rain-catcher .rc-controls>button:not(.rc-primary){min-height:44px;font-size:24px}.rain-catcher .rc-controls>.rc-primary{min-height:44px}
  .rain-catcher[data-phase=paused] .rc-controls{grid-row:4;width:calc(100% - 115px);gap:5px;grid-template-columns:44px minmax(0,1fr) 44px;justify-self:start}
  .rain-catcher[data-phase=paused] .rc-controls>.rc-primary{font-size:16px;padding-inline:4px}
  .rain-catcher[data-phase=paused] .rc-slow-catch{grid-row:4;justify-self:end;width:107px;min-height:44px;font-size:15px;line-height:1.2;padding:3px 5px}
  .rain-catcher .rc-drop{width:53px;height:61px;padding:11px 3px 4px}.rain-catcher .rc-glyph{width:35px;height:35px;font-size:30px}.rain-catcher .rc-drop>small{font-size:12px;bottom:-1px}
  .rain-catcher .rc-boat{width:77px;height:41px}.rain-catcher .rc-intro{padding:6px}.rain-catcher .rc-intro>div{padding:10px}
  .rain-catcher .rc-intro-icon{display:none}.rain-catcher .rc-intro strong{font-size:18px}.rain-catcher .rc-intro p{font-size:15px;margin:4px 0 7px}.rain-catcher .rc-intro .rc-primary{min-height:44px;font-size:17px;padding:5px 12px}
  .rain-catcher .rc-feedback{padding:6px;top:5%;border-radius:12px}.rain-catcher .rc-feedback strong{font-size:17px}.rain-catcher .rc-feedback span{font-size:13px;margin-top:1px}
  .rain-catcher .rc-status{grid-column:1 / -1;font-size:16px;line-height:1.4}.rain-catcher .rc-slow-catch{min-height:40px;font-size:16px;padding:5px 8px}
  .rain-catcher .rc-ending{padding:8px;gap:7px}.rain-catcher .rc-ending>strong{font-size:18px}.rain-catcher .rc-ending p{display:none}
  .rain-catcher .rc-wordbook{width:190px;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}.rain-catcher .rc-wordbook>button{min-height:47px;padding:4px 2px;border-radius:10px;gap:1px}.rain-catcher .rc-wordbook>button>span{font-size:23px}.rain-catcher .rc-wordbook small{font-size:12px}
  .rain-catcher .rc-word-glyph{width:27px;height:27px}.rain-catcher .rc-replay{min-height:44px;font-size:17px;padding:7px 14px}
}
.rain-catcher.is-reduced .rc-drizzle{display:none}
.rain-catcher.is-reduced .rc-boat,.rain-catcher.is-reduced .rc-spring-light,.rain-catcher.is-reduced .rc-collection>span{transition:none}
.rain-catcher.is-reduced .rc-splash i,.rain-catcher.is-reduced .rc-boat-ripple{animation:none!important}
@media(prefers-reduced-motion:reduce){
  .rain-catcher .rc-drizzle{display:none}
  .rain-catcher .rc-boat,.rain-catcher .rc-spring-light,.rain-catcher .rc-drop,.rain-catcher .rc-collection>span{transition:none}
  .rain-catcher .rc-splash i,.rain-catcher .rc-boat-ripple{animation:none!important}
}

/* poem-games/snow-count.css */
.poem-snow-game{--sc-ink:#2c4858;--sc-soft:#5b7484;--sc-paper:#fffdf8;--sc-line:#d5dee3;--sc-plum:#b4545e;position:relative;display:block;width:100%;max-width:820px;margin-inline:auto;min-width:0;color:var(--sc-ink);font-family:var(--sans)}
.poem-snow-game *{box-sizing:border-box}
.poem-snow-game [hidden]{display:none!important}
.poem-snow-game .sc-layout{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;align-content:center;height:100%;min-width:0}
.poem-snow-game .sc-head{display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0}
.poem-snow-game .sc-task{margin:0;font-size:clamp(19px,2.4vw,24px);font-weight:700;line-height:1.4;text-wrap:balance}
.poem-snow-game .sc-chip{flex:none;padding:4px 12px;border-radius:999px;background:#e8eff3;color:var(--sc-soft);font-size:17px;font-weight:700;line-height:1.4;font-variant-numeric:tabular-nums;white-space:nowrap}
.poem-snow-game .sc-stage{position:relative;isolation:isolate;width:100%;aspect-ratio:16/9;justify-self:center;overflow:hidden;border-radius:20px;background:#e7edf0;border:1px solid #7f97a640;box-shadow:0 14px 28px -20px #23404f99;user-select:none;-webkit-user-select:none;touch-action:manipulation;font-family:var(--sans);container-type:inline-size}
.poem-snow-game .sc-scene{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1.3s ease;pointer-events:none;user-select:none;-webkit-user-drag:none}
.poem-snow-game .sc-scene.is-on{opacity:1}
.poem-snow-game .sc-veil{position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(115% 95% at 50% 42%,#fff0 28%,#f2f6f8c4 100%),#ffffff1f;opacity:0;transition:opacity 1.4s ease}
.poem-snow-game .sc-veil.is-on{opacity:1}
.poem-snow-game .sc-fall{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:hidden}
.poem-snow-game .sc-fall[data-level="off"]{display:none}
.poem-snow-game .sc-fall i{position:absolute;top:0;left:var(--x);width:var(--s);height:100%;animation:sc-fall var(--d) linear var(--t) infinite;will-change:transform}
.poem-snow-game .sc-fall i::before{content:"";position:absolute;left:0;top:0;width:var(--s);height:var(--s);border-radius:50%;background:radial-gradient(circle,#fff 0 40%,#ffffffa8 60%,#fff0 76%);box-shadow:0 0 1.5px #4d67794d;opacity:var(--o)}
.poem-snow-game .sc-fall[data-level="0"] i:nth-child(n+19),.poem-snow-game .sc-fall[data-level="1"] i:nth-child(n+39),.poem-snow-game .sc-fall[data-level="2"] i:nth-child(n+65){display:none}
.poem-snow-game .sc-flakes,.poem-snow-game .sc-plums,.poem-snow-game .sc-bigs{position:absolute;inset:0;pointer-events:none}
.poem-snow-game .sc-stage button{-webkit-tap-highlight-color:transparent;font-family:var(--sans)}
.poem-snow-game .sc-flake,.poem-snow-game .sc-plum,.poem-snow-game .sc-big{position:absolute;left:var(--x);top:var(--y);aspect-ratio:1;margin:0;padding:0;border:0;border-radius:50%;background:transparent;pointer-events:auto;cursor:pointer;display:grid;place-items:center}
.poem-snow-game .sc-flake{z-index:3;width:clamp(48px,10%,92px);transform:translate(-50%,-50%);touch-action:manipulation;transition:opacity .3s ease,transform .3s ease}
.poem-snow-game .sc-flake::before,.poem-snow-game .sc-big::before{content:"";position:absolute;inset:2%;border-radius:50%;background:radial-gradient(circle,#ffffffeb 0 17%,#ffffff70 42%,#fff0 69%);transition:opacity .4s,box-shadow .25s}
.poem-snow-game .sc-flake svg{position:relative;width:76%;height:76%;overflow:visible;animation:sc-drift var(--d) ease-in-out var(--t) infinite alternate}
.poem-snow-game .sc-flake:hover:not(:disabled) svg{filter:drop-shadow(0 0 5px #fff)}
.poem-snow-game .sc-flake.is-caught{opacity:0;transform:translate(-50%,-50%) scale(.5);pointer-events:none}
.poem-snow-game .sc-flake:disabled,.poem-snow-game .sc-plum:disabled,.poem-snow-game .sc-big:disabled,.poem-snow-game .sc-sky:disabled{cursor:default}
.poem-snow-game svg .sc-edge{fill:none;stroke:#42617a;stroke-opacity:.5;stroke-width:10;stroke-linecap:round;stroke-linejoin:round}
.poem-snow-game svg .sc-core{fill:none;stroke:#fff;stroke-width:4.6;stroke-linecap:round;stroke-linejoin:round}
.poem-snow-game svg .sc-hub{fill:#fff;stroke:#42617a;stroke-opacity:.45;stroke-width:3}
.poem-snow-game button:focus-visible{outline:3px solid #de9b34;outline-offset:3px}
.poem-snow-game .sc-sky{position:absolute;inset:0;z-index:3;width:100%;height:100%;margin:0;padding:0;border:0;border-radius:inherit;background:transparent;cursor:pointer;touch-action:manipulation}
.poem-snow-game .sc-sky:focus-visible{outline-offset:-7px}
.poem-snow-game .sc-sky-hint{position:absolute;left:50%;top:20%;transform:translate(-50%,-50%);padding:8px 20px;border-radius:999px;background:#fffdf8e8;color:var(--sc-ink);font-size:clamp(17px,2.3vw,22px);font-weight:700;letter-spacing:.1em;line-height:1.3;white-space:nowrap;box-shadow:0 0 0 6px #ffffff5c,0 8px 18px -10px #23404f99;animation:sc-breathe 2.4s ease-in-out infinite;transition:opacity .4s}
.poem-snow-game .sc-sky:disabled .sc-sky-hint{opacity:0}
.poem-snow-game .sc-ripple{position:absolute;z-index:4;width:76px;height:76px;margin:-38px 0 0 -38px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 8px #ffffff40,inset 0 0 18px #ffffffa0;pointer-events:none;animation:sc-ripple 1s ease-out forwards}
.poem-snow-game .sc-plum{z-index:3;width:clamp(52px,11%,96px);transform:translate(-50%,-50%);touch-action:manipulation}
.poem-snow-game .sc-plum span{position:absolute;inset:8%;border-radius:50%;border:3px dashed #bf5f69;box-shadow:0 0 0 3px #ffffffc4,inset 0 0 0 3px #ffffffa8,0 0 14px 2px #ffffffd0;transition:transform .25s,border-color .25s,box-shadow .25s}
.poem-snow-game .sc-plum:not(:disabled) span{animation:sc-ring 2.8s ease-in-out infinite}
.poem-snow-game .sc-plum:nth-child(2n) span{animation-delay:-1.4s}
.poem-snow-game.is-carrying .sc-plum span{border-style:solid;border-color:#d4943a;animation-duration:1.4s}
.poem-snow-game .sc-plum.is-near span{transform:scale(1.22);border-color:#e08a24;box-shadow:0 0 0 4px #fff,0 0 0 8px #e3a5487a,0 0 26px #fff;animation:none}
.poem-snow-game .sc-task span{display:inline-block}
.poem-snow-game .sc-plum.is-glow::after{content:"";position:absolute;inset:-35%;border-radius:50%;background:radial-gradient(circle,#fffef7 0 18%,#fff3dcb0 40%,#fff0 70%);pointer-events:none;animation:sc-glow 1.5s ease-out forwards}
.poem-snow-game[data-stage="done"] .sc-plums{display:none}
.poem-snow-game .sc-big{z-index:4;width:clamp(56px,12.5%,104px);transform:translate(calc(-50% + var(--dx,0px)),calc(-50% + var(--dy,0px)));cursor:grab;touch-action:none;transition:left .6s cubic-bezier(.3,.7,.3,1),top .6s cubic-bezier(.3,.7,.3,1),transform .6s cubic-bezier(.3,.7,.3,1)}
.poem-snow-game .sc-big-art{position:absolute;inset:11%;display:grid;place-items:center;transition:opacity .8s ease .45s,transform .9s ease .45s,filter .8s ease .45s}
.poem-snow-game .sc-big-art svg{width:100%;height:100%;overflow:visible;animation:sc-drift 8s ease-in-out infinite alternate}
.poem-snow-game .sc-big:nth-child(2n) .sc-big-art svg{animation-duration:9.5s;animation-delay:-3s}
.poem-snow-game .sc-big.is-selected::before{box-shadow:0 0 0 4px #e3a548,0 0 0 10px #ffffff80}
.poem-snow-game .sc-big.is-dragging{z-index:6;cursor:grabbing;transition:none}
.poem-snow-game .sc-big.is-dragging .sc-big-art{transform:scale(1.12);transition:transform .15s}
.poem-snow-game .sc-big.is-gone{pointer-events:none}
.poem-snow-game .sc-big.is-gone::before{opacity:0}
.poem-snow-game .sc-big.is-gone .sc-big-art{opacity:0;transform:scale(.3);filter:blur(3px)}
.poem-snow-game .sc-bigs.is-nudge .sc-big:not(:disabled) .sc-big-art{animation:sc-nudge .8s ease}
.poem-snow-game .sc-end{position:absolute;z-index:5;left:3.5%;top:6%;display:grid;gap:3px;max-width:86%;padding:9px 16px 10px;border-radius:14px;background:#fffdf8eb;box-shadow:0 10px 22px -14px #23404fb3;color:var(--sc-ink);pointer-events:none;animation:sc-appear .9s ease both}
.poem-snow-game .sc-end span{font-size:clamp(18px,4cqw,28px);font-weight:700;letter-spacing:.1em;line-height:1.3}
.poem-snow-game .sc-end small{font-size:clamp(14px,2.3cqw,16px);line-height:1.4;color:var(--sc-soft)}
.poem-snow-game .sc-loading{position:absolute;inset:0;z-index:8;display:grid;place-content:center;justify-items:center;gap:14px;padding:20px;background:#edf2f4ee;font-size:20px;line-height:1.5;text-align:center}
.poem-snow-game .sc-loading button{min-height:48px;padding:10px 22px;border:1px solid #9fb2bd;border-radius:14px;background:var(--sc-paper);color:var(--sc-ink);font-size:19px;font-weight:700;cursor:pointer}
.poem-snow-game .sc-ghost{position:absolute;left:0;top:0;z-index:20;display:block;pointer-events:none;filter:drop-shadow(0 0 6px #fff)}
.poem-snow-game .sc-ghost svg{display:block;width:100%;height:100%;overflow:visible}
.poem-snow-game .sc-card{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px 18px;min-width:0;padding:10px 16px;border-radius:18px;background:var(--sc-paper);border:1px solid var(--sc-line);box-shadow:0 3px 0 #e5ebee}
.poem-snow-game .sc-count{display:grid;justify-items:center;align-content:center;min-width:4.4em;min-height:66px;line-height:1.15}
.poem-snow-game .sc-count small{font-size:15px;font-weight:600;color:var(--sc-soft);letter-spacing:.06em}
.poem-snow-game .sc-count b{font-family:var(--serif);font-size:clamp(31px,4.2vw,40px);font-weight:700;letter-spacing:.06em;color:var(--sc-ink);white-space:nowrap}
.poem-snow-game .sc-count b.is-muted{color:#8aa0ad}
.poem-snow-game .sc-marks{display:grid;grid-template-columns:repeat(5,30px);gap:6px 7px}
.poem-snow-game .sc-marks[data-kind="flurry"]{grid-template-columns:repeat(3,auto);gap:8px}
.poem-snow-game .sc-mark{position:relative;width:30px;height:30px;border-radius:50%;border:1.5px dashed #b6c5cd;transition:border-color .3s,background-color .3s}
.poem-snow-game .sc-mark svg{position:absolute;inset:2px;width:calc(100% - 4px);height:calc(100% - 4px);overflow:visible;opacity:0;transform:scale(.4);transition:opacity .3s,transform .4s cubic-bezier(.3,1.6,.5,1)}
.poem-snow-game .sc-mark.is-on{border-style:solid;border-color:#9bb2c1;background:#dbe6ed}
.poem-snow-game .sc-mark.is-on svg{opacity:1;transform:none}
.poem-snow-game .sc-marks[data-kind="hide"] .sc-mark{border-style:solid;border-color:#c3d1d9;background:#e3ecf1}
.poem-snow-game .sc-marks[data-kind="hide"] .sc-mark>svg:first-child{opacity:1;transform:none}
.poem-snow-game .sc-marks[data-kind="hide"] .sc-mark.is-on{border-color:#e3bcc0;background:#fbf2f1}
.poem-snow-game .sc-marks[data-kind="hide"] .sc-mark.is-on>svg:first-child{opacity:0;transform:scale(.3)}
.poem-snow-game .sc-bloom circle{fill:#fffdfb;stroke:#c7787f;stroke-width:3.5}
.poem-snow-game .sc-bloom .sc-heart{fill:#e6b24e;stroke:#c7787f;stroke-width:2}
.poem-snow-game .sc-pill{padding:5px 12px;border-radius:999px;border:1.5px dashed #b6c5cd;color:#8ea2ae;font-family:var(--serif);font-size:19px;font-style:normal;font-weight:700;line-height:1.3;letter-spacing:.04em;white-space:nowrap;transition:background-color .3s,border-color .3s,color .3s}
.poem-snow-game .sc-pill.is-on{border-style:solid;border-color:#9bb2c1;background:#dbe6ed;color:var(--sc-ink)}
.poem-snow-game .sc-actionline{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px 18px;min-width:0}
.poem-snow-game .sc-verse{display:flex;margin:0;font-family:var(--serif);font-size:clamp(25px,3vw,30px);font-weight:700;line-height:1.3;letter-spacing:.06em;white-space:nowrap}
.poem-snow-game .sc-verse span{color:#2c485830;transition:color .45s ease}
.poem-snow-game .sc-verse span.is-lit{color:var(--sc-ink)}
.poem-snow-game .sc-listen{display:inline-flex;align-items:center;gap:8px;min-height:48px;padding:8px 18px;border:1.5px solid #c1cfd7;border-radius:16px;background:var(--sc-paper);color:var(--sc-ink);font-family:inherit;font-size:19px;font-weight:700;line-height:1.2;white-space:nowrap;cursor:pointer;box-shadow:0 3px 0 #e0e8ec}
.poem-snow-game .sc-listen svg{width:22px;height:22px;flex:none;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.poem-snow-game .sc-listen:hover:not(:disabled){background:#f3f7f9}
.poem-snow-game .sc-listen:disabled{cursor:default;opacity:.65}
.poem-snow-game .sc-listen[aria-busy="true"]{opacity:1;background:#e9f0f4}
.poem-snow-game .sc-feedback{margin:0;min-height:2.9em;font-size:19px;line-height:1.45;text-align:center;color:#3d596a;text-wrap:pretty}
.poem-snow-game.is-instant *,.poem-snow-game.is-instant *::before{transition:none!important}
/* Round 4: the poem board. Cells come from the stage width; the gap shrinks so four rows always fit its 16:9 height. */
.poem-snow-game[data-stage="seek"] .sc-veil,.poem-snow-game[data-stage="done"] .sc-veil{background:radial-gradient(120% 100% at 50% 50%,#ffffffb8 30%,#f2f6f8d9 100%)}
.poem-snow-game[data-stage="done"] .sc-fall{z-index:5}
.poem-snow-game .sc-poem{--sc-cell:clamp(44px,11.6cqw,96px);--sc-gap:max(0px,min(1.6cqw,(56.25cqw - 4 * var(--sc-cell)) / 4));position:absolute;inset:0;z-index:4;display:grid;align-content:center;justify-content:center;gap:var(--sc-gap)}
.poem-snow-game .sc-row{display:grid;grid-template-columns:repeat(7,var(--sc-cell));border-radius:calc(var(--sc-cell) * .28);transition:background-color .35s,box-shadow .35s}
.poem-snow-game .sc-row.is-reading{background:#fde9b0c9;box-shadow:0 0 0 3px #e8c57a8c}
.poem-snow-game .sc-tile{position:relative;width:var(--sc-cell);height:var(--sc-cell);margin:0;padding:0;border:0;border-radius:24%;background:transparent;color:var(--sc-ink);cursor:pointer;touch-action:manipulation}
.poem-snow-game .sc-tile:disabled{cursor:default;opacity:1}
.poem-snow-game .sc-tile:focus-visible{z-index:2;outline-offset:-1px}
.poem-snow-game[data-stage="seek"] .sc-tile{animation:sc-pop .5s cubic-bezier(.3,1.4,.5,1) calc(var(--n) * 22ms) both}
.poem-snow-game .sc-face{position:absolute;inset:max(2px,6%);display:grid;place-items:center;border-radius:22%;background:#fffdf8f5;border:1.5px solid #c6d4dc;box-shadow:0 2px 0 #d2dde4,0 6px 12px -8px #23404f80;transition:background-color .3s,border-color .3s,transform .15s}
.poem-snow-game .sc-face::before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(110deg,#fff0 35%,#ffffff 50%,#fff0 65%) no-repeat;background-size:260% 100%;background-position:130% 0;opacity:0;pointer-events:none}
.poem-snow-game .sc-tile:hover:not(:disabled) .sc-face{border-color:#97afbe;transform:translateY(-1px)}
.poem-snow-game .sc-tile:active:not(:disabled) .sc-face{transform:translateY(1px);box-shadow:0 1px 0 #d2dde4}
.poem-snow-game .sc-char{position:relative;z-index:1;font-family:var(--serif);font-size:calc(var(--sc-cell) * .54);font-weight:700;line-height:1}
.poem-snow-game .sc-tile.is-seen .sc-face{background:#ebf3f7f5;border-color:#b3c8d4}
.poem-snow-game .sc-tile.is-seen .sc-face::after{content:"";position:absolute;right:9%;bottom:10%;width:max(6px,15%);height:max(6px,15%);border-radius:50% 0 50% 50%;transform:rotate(-45deg);background:#93bfd8}
.poem-snow-game .sc-tile.is-shimmer .sc-face::before{animation:sc-shimmer .75s ease-out}
.poem-snow-game .sc-poem.is-nudge .sc-tile:not(.is-seen) .sc-char{animation:sc-nudge .8s ease}
.poem-snow-game .sc-melt,.poem-snow-game .sc-cap{position:absolute;right:-9%;top:-13%;z-index:3;width:44%;height:44%;pointer-events:none}
.poem-snow-game .sc-melt svg,.poem-snow-game .sc-cap svg{display:block;width:100%;height:100%;overflow:visible}
.poem-snow-game .sc-melt{animation:sc-melt 1.1s ease-in forwards}
.poem-snow-game .sc-cap{opacity:0}
.poem-snow-game[data-stage="done"] .sc-cap{opacity:1}
.poem-snow-game[data-stage="done"] .sc-tile.is-seen .sc-face{background:#fffdf8f5;border-color:#c6d4dc}
.poem-snow-game[data-stage="done"] .sc-face::after,.poem-snow-game[data-stage="done"] .sc-tile.is-seen .sc-face::after{content:"";position:absolute;left:3%;right:3%;top:-9%;bottom:auto;width:auto;height:30%;border-radius:45% 45% 0 0/90% 90% 0 0;transform:none;transform-origin:50% 100%;background:radial-gradient(ellipse 22% 50% at 17% 50%,#fff 95%,#fff0),radial-gradient(ellipse 26% 56% at 48% 44%,#fff 95%,#fff0),radial-gradient(ellipse 22% 48% at 80% 52%,#fff 95%,#fff0),linear-gradient(#fff,#fff) 50% 0/100% 50% no-repeat;filter:drop-shadow(0 1.5px 0 #b5c8d3)}
.poem-snow-game.is-celebrate .sc-cap{animation:sc-settle 1.5s cubic-bezier(.3,.6,.4,1) calc(var(--k) * 1ms) both}
.poem-snow-game.is-celebrate .sc-face{animation:sc-frost 1.2s ease calc(var(--k) * 1ms + 700ms) both}
.poem-snow-game.is-celebrate .sc-face::after{animation:sc-pile .9s ease-out calc(var(--k) * 1ms + 500ms) both}
.poem-snow-game .sc-ask{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px 12px;min-width:0;padding:10px 14px;border-radius:18px;background:var(--sc-paper);border:1px solid var(--sc-line);box-shadow:0 3px 0 #e5ebee}
.poem-snow-game .sc-ask.is-pulse{animation:sc-call 1.2s ease}
.poem-snow-game .sc-want{display:grid;justify-items:center;line-height:1.1;padding-right:2px}
.poem-snow-game .sc-want small{font-size:14px;font-weight:600;color:var(--sc-soft);letter-spacing:.04em;white-space:nowrap}
.poem-snow-game .sc-want b{font-family:var(--serif);font-size:clamp(34px,4.4vw,42px);font-weight:700;color:#3f7ea4}
.poem-snow-game .sc-want.is-pulse b{animation:sc-nudge .6s ease 2}
.poem-snow-game .sc-answer{min-height:56px;min-width:84px;padding:8px 18px;border:2px solid #b7cad5;border-radius:16px;background:#fff;color:var(--sc-ink);font-family:inherit;font-size:22px;font-weight:700;line-height:1.2;white-space:nowrap;cursor:pointer;box-shadow:0 4px 0 #cddae2;transition:transform .12s,box-shadow .12s,background-color .2s,border-color .2s}
.poem-snow-game .sc-answer:hover:not(:disabled){background:#f2f8fb;border-color:#8eaec1}
.poem-snow-game .sc-answer:active:not(:disabled){transform:translateY(3px);box-shadow:0 1px 0 #cddae2}
.poem-snow-game .sc-answer:disabled{cursor:default;opacity:.6}
.poem-snow-game .sc-count b.is-seal{display:grid;place-items:center;width:1.45em;height:1.45em;margin-top:3px;border-radius:12px;background:var(--sc-plum);color:#fffdf8;font-size:clamp(30px,3.6vw,36px);letter-spacing:0;transform:rotate(-5deg);box-shadow:inset 0 0 0 3px #fffdf84d,0 3px 0 #8e3d46}
.poem-snow-game.is-celebrate .sc-count b.is-seal{animation:sc-stamp .6s cubic-bezier(.3,1.5,.5,1) 1.1s both}
.poem-snow-game .sc-marks[data-kind="done"]{display:block}
.poem-snow-game .sc-wonder{display:grid;gap:2px;font-family:var(--serif);font-size:clamp(20px,2.4vw,24px);font-weight:700;line-height:1.35;letter-spacing:.03em;color:var(--sc-ink)}
.poem-snow-game .sc-wonder span{white-space:nowrap}
.poem-snow-game .sc-task.has-poet{display:flex;align-items:center;gap:12px}
.poem-snow-game .sc-task .sc-say{display:block}
.poem-snow-game .sc-task.has-poet .sc-say{position:relative;padding:6px 13px;border-radius:14px;background:var(--sc-paper);border:1px solid var(--sc-line)}
.poem-snow-game .sc-task.has-poet .sc-say::before{content:"";position:absolute;left:-7px;top:50%;width:12px;height:12px;margin-top:-6px;background:inherit;border-left:1px solid var(--sc-line);border-bottom:1px solid var(--sc-line);transform:rotate(45deg)}
.poem-snow-game .sc-poet{position:relative;flex:none;width:52px;height:52px;border-radius:50%;overflow:hidden;background:#e8eff3;box-shadow:0 0 0 2px #fff,0 0 0 3px #c6d4dc}
.poem-snow-game .sc-poet img{position:absolute;width:220%;max-width:none;height:auto;left:-48.6%;top:-23.4%}
@keyframes sc-fall{from{transform:translate3d(0,-4%,0)}to{transform:translate3d(var(--w),101%,0)}}
@keyframes sc-drift{from{transform:translate(-4px,-5px) rotate(-18deg)}to{transform:translate(4px,6px) rotate(24deg)}}
@keyframes sc-breathe{50%{box-shadow:0 0 0 13px #ffffff33,0 8px 18px -10px #23404f99}}
@keyframes sc-ripple{from{transform:scale(.3);opacity:1}to{transform:scale(3.4);opacity:0}}
@keyframes sc-ring{50%{transform:scale(1.1)}}
@keyframes sc-glow{0%{opacity:0;transform:scale(.4)}25%{opacity:1}100%{opacity:0;transform:scale(1.3)}}
@keyframes sc-fade{0%{opacity:0}25%{opacity:1}100%{opacity:0}}
@keyframes sc-nudge{30%{transform:scale(1.16)}60%{transform:scale(.95)}}
@keyframes sc-appear{from{opacity:0;transform:translateY(6px)}}
@keyframes sc-pop{from{opacity:0;transform:scale(.6)}}
@keyframes sc-shimmer{0%{opacity:1;background-position:130% 0}100%{opacity:1;background-position:-30% 0}}
@keyframes sc-melt{0%{opacity:0;transform:scale(.4) rotate(0deg)}22%{opacity:1;transform:scale(1.05) rotate(30deg)}60%{opacity:.85;transform:translateY(25%) scale(.6) rotate(60deg)}100%{opacity:0;transform:translateY(110%) scale(.12) rotate(80deg)}}
@keyframes sc-settle{0%{opacity:0;transform:translate(-40%,-170%) rotate(-100deg) scale(.6)}35%{opacity:1}100%{opacity:1;transform:none}}
@keyframes sc-frost{40%{background-color:#ffffff;box-shadow:0 0 0 3px #ffffffd0,0 0 16px 4px #ffffffc0}}
@keyframes sc-call{25%,60%{box-shadow:0 0 0 5px #e8c57a99,0 3px 0 #e5ebee}}
@keyframes sc-pile{from{opacity:0;transform:scaleY(0)}}
@keyframes sc-stamp{from{opacity:0;transform:rotate(-5deg) scale(1.8)}to{opacity:1;transform:rotate(-5deg)}}
@media (orientation:landscape) and (min-width:701px),(orientation:landscape) and (max-height:500px){
  .poem-snow-game{max-width:1280px}
  .poem-snow-game .sc-layout{grid-template-columns:minmax(0,1.75fr) minmax(250px,.9fr);grid-template-rows:minmax(0,1fr) auto auto minmax(0,1fr);column-gap:22px;row-gap:12px;align-items:center}
  .poem-snow-game .sc-stage{grid-column:1;grid-row:1/5;width:min(100%,calc(100cqh * 16 / 9));align-self:center}
  .poem-snow-game .sc-head{grid-column:2;grid-row:1;align-self:end;flex-direction:column;align-items:flex-start;gap:6px}
  .poem-snow-game .sc-chip{order:-1}
  .poem-snow-game .sc-card,.poem-snow-game .sc-ask{grid-column:2;grid-row:2}
  .poem-snow-game .sc-want{flex-basis:100%;display:flex;align-items:baseline;justify-content:center;gap:10px}
  .poem-snow-game .sc-task.has-poet{font-size:20px;gap:10px}
  .poem-snow-game .sc-poet{width:44px;height:44px}
  .poem-snow-game .sc-actionline{grid-column:2;grid-row:3}
  .poem-snow-game .sc-feedback{grid-column:2;grid-row:4;align-self:start;min-height:0;font-size:18px;line-height:1.45}
}
@media (orientation:landscape) and (max-height:500px){
  .poem-snow-game .sc-layout{grid-template-columns:min(calc(100cqh * 16 / 9),calc((100svh - 200px) * 16 / 9),58%) minmax(0,1fr);column-gap:16px;row-gap:5px}
  .poem-snow-game .sc-stage{width:100%;border-radius:14px}
  .poem-snow-game .sc-head{flex-direction:row;align-items:center;justify-content:space-between;gap:8px}
  .poem-snow-game .sc-task{font-size:17px;line-height:1.35}
  .poem-snow-game .sc-chip{order:1;font-size:14px;padding:2px 9px}
  .poem-snow-game .sc-card{justify-content:flex-start;padding:5px 12px;gap:4px 10px;border-radius:14px}
  .poem-snow-game .sc-count{display:flex;align-items:baseline;gap:6px;min-width:0;min-height:0;white-space:nowrap}
  .poem-snow-game .sc-count small{font-size:14px}
  .poem-snow-game .sc-count b{font-size:25px}
  .poem-snow-game .sc-marks{grid-template-columns:repeat(5,22px);gap:3px 4px}
  .poem-snow-game .sc-mark{width:22px;height:22px}
  .poem-snow-game .sc-marks[data-kind="flurry"]{gap:5px}
  .poem-snow-game .sc-pill{font-size:15px;padding:2px 8px}
  .poem-snow-game .sc-actionline{justify-content:flex-start;gap:6px 12px}
  .poem-snow-game .sc-verse{font-size:21px}
  .poem-snow-game .sc-listen{min-height:44px;padding:6px 13px;font-size:17px;border-radius:13px}
  .poem-snow-game .sc-listen svg{width:19px;height:19px}
  .poem-snow-game .sc-feedback{font-size:15px;line-height:1.35;text-align:left}
  .poem-snow-game .sc-loading{font-size:17px}
  .poem-snow-game .sc-ask{justify-content:flex-start;flex-wrap:nowrap;padding:5px 10px;gap:8px;border-radius:14px}
  .poem-snow-game .sc-want{flex-basis:auto;gap:5px}
  .poem-snow-game .sc-want b{font-size:26px}
  .poem-snow-game .sc-answer{min-height:44px;min-width:60px;padding:4px 12px;font-size:18px;border-radius:13px;box-shadow:0 3px 0 #cddae2}
  .poem-snow-game .sc-count b.is-seal{font-size:24px;border-radius:9px;margin-top:0}
  .poem-snow-game .sc-wonder{display:block;font-size:16px;line-height:1.3}
  .poem-snow-game .sc-wonder span{white-space:normal}
  .poem-snow-game .sc-task.has-poet{font-size:17px}
  .poem-snow-game .sc-task.has-poet .sc-say{padding:0;border:0;background:none}
  .poem-snow-game .sc-task.has-poet .sc-say::before,.poem-snow-game .sc-task .sc-poet{display:none}
}
@media (max-width:700px){
  .poem-snow-game .sc-layout{gap:10px}
  .poem-snow-game .sc-stage{border-radius:16px}
}
@media (max-width:420px){
  .poem-snow-game .sc-task{font-size:19px}
  .poem-snow-game .sc-chip{font-size:15px;padding:3px 10px}
  .poem-snow-game .sc-card{padding:8px 12px;gap:6px 12px}
  .poem-snow-game .sc-count{min-height:62px}
  .poem-snow-game .sc-count b{font-size:32px}
  .poem-snow-game .sc-marks{grid-template-columns:repeat(5,28px);gap:6px}
  .poem-snow-game .sc-mark{width:28px;height:28px}
  .poem-snow-game .sc-pill{font-size:17px;padding:4px 8px}
  .poem-snow-game .sc-marks[data-kind="flurry"]{gap:5px}
  .poem-snow-game .sc-verse{font-size:25px;letter-spacing:.04em}
  .poem-snow-game .sc-listen{font-size:18px;padding:8px 14px}
  .poem-snow-game .sc-feedback{font-size:18px}
  .poem-snow-game .sc-end{padding:6px 10px 7px;border-radius:10px}
  .poem-snow-game .sc-sky-hint{padding:6px 15px}
  .poem-snow-game .sc-ask{padding:8px 10px;gap:8px}
  .poem-snow-game .sc-want b{font-size:32px}
  .poem-snow-game .sc-answer{min-width:68px;padding:8px 12px;font-size:20px}
  .poem-snow-game .sc-wonder{font-size:19px}
  .poem-snow-game .sc-poet{width:46px;height:46px}
  .poem-snow-game .sc-task.has-poet{gap:10px}
  .poem-snow-game .sc-task.has-poet .sc-say{padding:5px 10px}
}
@media (max-width:370px){
  .poem-snow-game .sc-task{font-size:18px}
  .poem-snow-game .sc-count{min-width:3.6em;min-height:55px}
  .poem-snow-game .sc-count b{font-size:28px}
  .poem-snow-game .sc-marks{grid-template-columns:repeat(5,25px);gap:5px}
  .poem-snow-game .sc-mark{width:25px;height:25px}
  .poem-snow-game .sc-verse{font-size:22px;letter-spacing:.02em}
  .poem-snow-game .sc-listen{padding:8px 11px;font-size:17px}
  .poem-snow-game .sc-answer{min-width:56px;padding:8px 10px;font-size:18px}
  .poem-snow-game .sc-want b{font-size:28px}
}
.poem-snow-game.is-reduced .sc-fall i{animation:none;transform:translateY(var(--y))}
.poem-snow-game.is-reduced .sc-flake svg,.poem-snow-game.is-reduced .sc-big-art svg,.poem-snow-game.is-reduced .sc-sky-hint,.poem-snow-game.is-reduced .sc-plum span,.poem-snow-game.is-reduced .sc-end,.poem-snow-game.is-reduced .sc-bigs.is-nudge .sc-big-art{animation:none!important}
.poem-snow-game.is-reduced .sc-flake,.poem-snow-game.is-reduced .sc-flake.is-caught{transform:translate(-50%,-50%);transition:opacity .2s}
.poem-snow-game.is-reduced .sc-big{transition:none}
.poem-snow-game.is-reduced .sc-big-art,.poem-snow-game.is-reduced .sc-big.is-dragging .sc-big-art{transform:none;filter:none;transition:opacity .5s ease}
.poem-snow-game.is-reduced .sc-ripple{display:none}
.poem-snow-game.is-reduced .sc-plum.is-glow::after{animation:sc-fade 1.5s ease-out forwards;transform:none}
.poem-snow-game.is-reduced .sc-scene,.poem-snow-game.is-reduced .sc-veil{transition-duration:.4s}
.poem-snow-game.is-reduced .sc-tile,.poem-snow-game.is-reduced .sc-face,.poem-snow-game.is-reduced .sc-face::before,.poem-snow-game.is-reduced .sc-face::after,.poem-snow-game.is-reduced .sc-char,.poem-snow-game.is-reduced .sc-cap,.poem-snow-game.is-reduced .sc-ask,.poem-snow-game.is-reduced .sc-want b,.poem-snow-game.is-reduced .sc-count b.is-seal{animation:none!important}
.poem-snow-game.is-reduced .sc-melt{display:none}
.poem-snow-game.is-reduced .sc-ask.is-pulse{box-shadow:0 0 0 4px #e8c57a99,0 3px 0 #e5ebee}
.poem-snow-game.is-reduced .sc-tile.is-shimmer .sc-face{background:#ffffff;border-color:#97afbe}
.poem-snow-game.is-reduced .sc-want.is-pulse b{text-decoration:underline 3px #e8c57a;text-underline-offset:4px}
@media (prefers-reduced-motion:reduce){
  .poem-snow-game .sc-fall i{animation:none;transform:translateY(var(--y))}
  .poem-snow-game .sc-flake svg,.poem-snow-game .sc-big-art svg,.poem-snow-game .sc-sky-hint,.poem-snow-game .sc-plum span,.poem-snow-game .sc-end,.poem-snow-game .sc-bigs.is-nudge .sc-big-art{animation:none!important}
  .poem-snow-game .sc-ripple{display:none}
  .poem-snow-game .sc-big{transition:none}
  .poem-snow-game .sc-tile,.poem-snow-game .sc-face,.poem-snow-game .sc-face::before,.poem-snow-game .sc-face::after,.poem-snow-game .sc-char,.poem-snow-game .sc-cap,.poem-snow-game .sc-ask,.poem-snow-game .sc-want b,.poem-snow-game .sc-count b.is-seal{animation:none!important}
  .poem-snow-game .sc-melt{display:none}
}

/* poem-games/rooster.css */
.poem-rooster-game{--ink:#3d3125;--red:#a8432c;--soft:#76634d;--d:0;width:100%;max-width:760px;margin-inline:auto;align-self:start;display:grid;gap:12px;color:var(--ink);font-family:inherit;min-width:0}
.poem-rooster-game *{box-sizing:border-box}
.poem-rooster-game [hidden]{display:none!important}
.poem-rooster-game button{font-family:inherit;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.poem-rooster-game button:disabled{cursor:default}
.poem-rooster-game button:focus-visible,.poem-rooster-game .rr-range:focus-visible{outline:3px solid #de9b34;outline-offset:3px}
.poem-rooster-game .rr-head{display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0}
.poem-rooster-game .rr-instruction{margin:0;min-width:0;font-size:clamp(19px,2.4vw,24px);font-weight:600;line-height:1.45;text-wrap:balance}
.poem-rooster-game .rr-instruction span{display:inline-block}
.poem-rooster-game .rr-progress{flex:none;padding:6px 14px;border-radius:999px;background:#fff7e8;border:1px solid #e6d2b0;color:#8a5a2b;font-weight:700;font-size:18px;line-height:1.2;font-variant-numeric:tabular-nums;white-space:nowrap}

.poem-rooster-game .rr-stage{position:relative;isolation:isolate;container-type:inline-size;width:100%;aspect-ratio:16/9;justify-self:center;overflow:hidden;overflow:clip;border-radius:20px;background:#ebe2d1;border:1px solid #8b6c4a33;box-shadow:0 14px 28px -20px #5b3b1c80;touch-action:pan-y;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}
.poem-rooster-game.is-look .rr-stage{cursor:pointer}
.poem-rooster-game .rr-scene,.poem-rooster-game .rr-layer{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:cover;pointer-events:none;-webkit-user-drag:none}
.poem-rooster-game .rr-day{transition:opacity .9s ease}
.poem-rooster-game:not(.is-look) .rr-day{opacity:0}
.poem-rooster-game .rr-sky{opacity:calc((var(--d) - .2) * 1.25);-webkit-mask-image:linear-gradient(180deg,#000 34%,transparent 47%),linear-gradient(90deg,transparent 42%,#000 57%);-webkit-mask-composite:source-in;mask-image:linear-gradient(180deg,#000 34%,transparent 47%),linear-gradient(90deg,transparent 42%,#000 57%);mask-composite:intersect}
.poem-rooster-game .rr-warm{background:linear-gradient(200deg,transparent 30%,#ffb46a 72%,#ffd38c);mix-blend-mode:soft-light;opacity:calc(var(--d) * .75)}
.poem-rooster-game .rr-dark{background:linear-gradient(180deg,#0e1533,#1c2750 58%,#283152);mix-blend-mode:multiply;opacity:calc((1 - var(--d)) * .8)}
.poem-rooster-game .rr-stars{inset:0 0 54% 45%;width:auto;height:auto;opacity:calc(.95 - var(--d) * 1.7);background:
  radial-gradient(circle at 8% 24%,#fffbe8 0 1.4px,transparent 2.6px),radial-gradient(circle at 19% 62%,#fffbe8 0 1px,transparent 2px),radial-gradient(circle at 27% 14%,#fffbe8 0 1.6px,transparent 3px),
  radial-gradient(circle at 38% 40%,#fffbe8 0 1px,transparent 2px),radial-gradient(circle at 47% 9%,#fffbe8 0 1.2px,transparent 2.4px),radial-gradient(circle at 58% 55%,#fffbe8 0 1.4px,transparent 2.6px),
  radial-gradient(circle at 66% 30%,#fffbe8 0 1px,transparent 2px),radial-gradient(circle at 84% 12%,#fffbe8 0 1.6px,transparent 3px),radial-gradient(circle at 91% 46%,#fffbe8 0 1.1px,transparent 2.2px),
  radial-gradient(circle at 74% 70%,#fffbe8 0 .9px,transparent 1.8px),radial-gradient(circle at 33% 80%,#fffbe8 0 .9px,transparent 1.8px)}
.poem-rooster-game .rr-moon{position:absolute;left:73%;top:8%;width:4.4cqi;height:4.4cqi;border-radius:50%;box-shadow:inset -1.2cqi .5cqi 0 0 #f8efcf;filter:drop-shadow(0 0 1cqi #f8efcf99);transform:translateY(calc(var(--d) * 9cqi)) rotate(-18deg);opacity:calc(1 - var(--d) * 1.5);pointer-events:none}
.poem-rooster-game .rr-sunclip{position:absolute;left:0;right:0;top:0;height:44.6%;overflow:hidden;pointer-events:none}
.poem-rooster-game .rr-sun{position:absolute;left:88.4%;top:calc(100% + 3cqi - var(--d) * 3.7cqi);width:3.6cqi;height:3.6cqi;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,#fffbe9 0 30%,#ffd67c 62%,#f6a54d);box-shadow:0 0 2.2cqi .8cqi #ffd27a99;opacity:calc(var(--d) * 1.4)}
.poem-rooster-game .rr-glow{position:absolute;left:88.4%;top:44%;width:80cqi;height:50cqi;transform:translate(-50%,-50%);background:radial-gradient(closest-side,#ffd9a0d0,#ffb07a50 45%,transparent);mix-blend-mode:screen;opacity:calc(var(--d) * .7);pointer-events:none}
.poem-rooster-game .rr-dawn{opacity:0;transition:opacity 1.4s ease}
.poem-rooster-game.is-open .rr-dawn{opacity:1}
.poem-rooster-game .rr-veil{background:linear-gradient(180deg,#26305a,#1d2547);mix-blend-mode:multiply;opacity:0;transition:opacity .9s ease}
.poem-rooster-game.is-open .rr-veil{opacity:calc((1 - var(--o)) * .3)}
.poem-rooster-game .rr-walk{position:absolute;left:var(--l);top:var(--t);width:var(--bw);height:var(--bh);display:none;pointer-events:none;-webkit-user-drag:none}
.poem-rooster-game.is-look.is-strut .rr-walk{display:block}
.poem-rooster-game .rr-cock{transform-origin:62% 100%}
.poem-rooster-game.is-strut-in .rr-cock{animation:rr-strut-in 2.9s linear both}
.poem-rooster-game.is-strut-show .rr-cock{animation:rr-strut-show 1.5s ease-in-out both}
.poem-rooster-game.is-strut-in .rr-spot,.poem-rooster-game.is-strut-in .rr-chip{opacity:0;pointer-events:none}
@keyframes rr-strut-in{
  0%{opacity:0;transform:translateX(-100%) scale(.84)}
  6%{opacity:1}
  13%{transform:translateX(-84%) translateY(-3.2%) scale(.86) rotate(-2.5deg)}
  22%{transform:translateX(-70%) scale(.88) rotate(1deg)}
  31%{transform:translateX(-56%) translateY(-3.2%) scale(.9) rotate(-2.5deg)}
  40%{transform:translateX(-43%) scale(.92) rotate(1deg)}
  49%{transform:translateX(-31%) translateY(-3.2%) scale(.94) rotate(-2.5deg)}
  58%{transform:translateX(-20%) scale(.96) rotate(1deg)}
  67%{transform:translateX(-11%) translateY(-2.6%) scale(.98) rotate(-2deg)}
  76%{transform:translateX(-4%) rotate(.6deg)}
  84%{transform:translateY(-1.6%) rotate(-1.2deg) scale(1.02)}
  92%{transform:scale(1.015,.99)}
  100%{opacity:1;transform:none}}
@keyframes rr-strut-show{
  20%{transform:translateY(-2.6%) rotate(-2.2deg)}
  40%{transform:translateX(1.4%) rotate(.8deg)}
  60%{transform:translateX(2.4%) translateY(-2.6%) rotate(-2.2deg)}
  80%{transform:translateX(1%) rotate(.6deg)}}
.poem-rooster-game .rr-nhole,.poem-rooster-game .rr-nhead{position:absolute;left:30.625%;top:7.778%;width:13.4375%;height:23.889%;display:none;background:var(--rr-nhead) 0 0/200% 100% no-repeat;pointer-events:none}
.poem-rooster-game .rr-nhead{background-position:100% 0;transform-origin:48.8% 79.1%}
.poem-rooster-game.is-dawn.is-shake .rr-nhole,.poem-rooster-game.is-dawn.is-shake .rr-nhead{display:block}
.poem-rooster-game.is-dawn.is-shake .rr-nhead{animation:rr-no 1.1s ease-in-out both}
@keyframes rr-no{15%{transform:rotate(-8deg)}35%{transform:rotate(7deg)}55%{transform:rotate(-6deg)}75%{transform:rotate(4deg)}}
.poem-rooster-game .rr-shakes{position:absolute;z-index:3;left:28%;top:5%;width:19%;height:26%;overflow:visible;opacity:0;pointer-events:none}
.poem-rooster-game .rr-shakes path{fill:none;stroke:#fff6dc;stroke-width:3;stroke-linecap:round;vector-effect:non-scaling-stroke;filter:drop-shadow(0 0 2px #0b1233)}
.poem-rooster-game.is-dawn.is-shake .rr-shakes{animation:rr-flash 1.1s ease both}
@keyframes rr-flash{0%,100%{opacity:0}20%,75%{opacity:.95}}
.poem-rooster-game .rr-light{position:absolute;left:var(--x);top:var(--y);width:var(--s);aspect-ratio:1.5;transform:translate(-50%,-50%) scale(.6);border-radius:50%;background:radial-gradient(closest-side,#fff0c0,#ffc36a99 40%,transparent);mix-blend-mode:screen;opacity:0;transition:opacity .8s ease,transform .8s ease;pointer-events:none}
.poem-rooster-game .rr-light.is-on{opacity:.85;transform:translate(-50%,-50%) scale(1)}
.poem-rooster-game .rr-rings{position:absolute;z-index:3;left:41%;top:4.5%;width:9cqi;height:9cqi;overflow:visible;pointer-events:none;opacity:0}
.poem-rooster-game .rr-rings path{fill:none;stroke:#7c3317;stroke-width:3.6;stroke-linecap:round;filter:drop-shadow(0 0 1.6px #fff6dc) drop-shadow(0 0 3px #fff6dc)}
.poem-rooster-game.is-crowing .rr-rings{opacity:1}
.poem-rooster-game.is-crowing .rr-rings path{animation:rr-ring 1.1s ease-out 2 both}
.poem-rooster-game.is-crowing .rr-rings path:nth-child(2){animation-delay:.14s}
.poem-rooster-game.is-crowing .rr-rings path:nth-child(3){animation-delay:.28s}
@keyframes rr-ring{0%{opacity:0;transform:translateX(-4px)}35%{opacity:1}100%{opacity:0;transform:translateX(7px)}}
.poem-rooster-game .rr-hush{position:absolute;z-index:4;left:46.5%;top:8%;display:grid;gap:.3em;padding:.55em .8em .6em;border-radius:.8em;background:#fffaf0f0;box-shadow:0 .5cqi 1.4cqi #0b123355;font-family:var(--sans);font-size:clamp(15px,2.8cqi,26px);font-weight:800;line-height:1.15;color:#5a4a3a;letter-spacing:.06em;white-space:nowrap;opacity:0;transform:scale(.7);transform-origin:0 100%;transition:opacity .25s ease,transform .25s cubic-bezier(.3,1.5,.5,1);pointer-events:none}
.poem-rooster-game .rr-hush b:last-child{color:#a8432c}
.poem-rooster-game .rr-hush::before{content:'';position:absolute;left:-.55em;bottom:.9em;border-style:solid;border-width:.4em .6em .4em 0;border-color:transparent #fffaf0f0 transparent transparent}
.poem-rooster-game .rr-hush.is-on{opacity:1;transform:none}
.poem-rooster-game .rr-tap{position:absolute;z-index:3;inset:0;display:none}
.poem-rooster-game.is-look .rr-tap{display:block}
.poem-rooster-game .rr-sunzone{position:absolute;z-index:3;left:46%;right:0;top:0;bottom:16%;display:none;touch-action:none;cursor:ns-resize}
.poem-rooster-game.is-dawn .rr-sunzone{display:block}
.poem-rooster-game .rr-pull{position:absolute;right:2.4cqi;top:58%;transform:translateY(-50%);display:flex;align-items:center;gap:.8cqi;padding:.7cqi 1.8cqi;border-radius:999px;background:#fff8e8ea;color:#7a4a1e;font-family:var(--sans);font-size:clamp(14px,2.3cqi,20px);font-weight:700;line-height:1.2;white-space:nowrap;box-shadow:0 .5cqi 1.6cqi #0b123366}
.poem-rooster-game .rr-pull i{width:0;height:0;border-style:solid;border-width:0 .9cqi 1.3cqi;border-color:transparent transparent #e2913a}
.poem-rooster-game:not(.is-reduced) .rr-pull{animation:rr-bob 1.8s ease-in-out infinite}
@keyframes rr-bob{50%{transform:translateY(calc(-50% - .8cqi))}}

.poem-rooster-game .rr-spot{position:absolute;z-index:4;left:var(--x);top:var(--y);width:var(--w);height:var(--h);min-width:44px;min-height:44px;transform:translate(-50%,-50%);padding:0;margin:0;border:0;border-radius:50%;background:transparent;color:inherit;cursor:pointer}
.poem-rooster-game .rr-spot svg{position:absolute;inset:-9%;width:118%;height:118%;overflow:visible;pointer-events:none}
.poem-rooster-game .rr-spot.is-top{top:auto;bottom:calc(100% - var(--y));height:max(6.75cqi,44px);min-width:60px;transform:translateX(-50%);border-radius:50% 50% 40% 40%}
.poem-rooster-game .rr-spot.is-top svg{top:auto;bottom:-10%;height:calc(6.75cqi * 1.2)}
.poem-rooster-game .rr-spot path{fill:none;stroke:#b4472f;stroke-width:3;stroke-linecap:round;stroke-dasharray:1 1;stroke-dashoffset:1;opacity:.92;filter:drop-shadow(0 1px 0 #fffbf2aa)}
.poem-rooster-game .rr-spot.is-found path{stroke-dashoffset:0;transition:stroke-dashoffset .8s ease}
.poem-rooster-game .rr-spot:focus-visible{outline:3px dashed #f2b450;outline-offset:3px}
.poem-rooster-game .rr-spot.is-hint::after{content:'';position:absolute;inset:-4%;border-radius:50%;box-shadow:0 0 0 3px #fff6dcd0,0 0 2.4cqi 1cqi #f6c76a;animation:rr-breathe 1.8s ease-in-out infinite;pointer-events:none}
@keyframes rr-breathe{50%{opacity:.35;transform:scale(1.06)}}
.poem-rooster-game .rr-chip{position:absolute;z-index:5;left:var(--x);top:var(--y);display:grid;gap:.25cqi;padding:.8cqi 1.8cqi 1cqi;border-radius:1.6cqi;background:#fffaf1ee;border:1px solid #d8bf9a;box-shadow:0 .6cqi 1.8cqi -.6cqi #5b3b1c66;font-family:var(--sans);line-height:1.25;pointer-events:none;opacity:0;transform:translateY(.8cqi) scale(.92);transform-origin:0 50%;transition:opacity .35s ease,transform .35s ease}
.poem-rooster-game .rr-chip.is-on{opacity:1;transform:none}
.poem-rooster-game .rr-chip::before{content:'';position:absolute;left:-1cqi;top:50%;width:1.8cqi;height:1.8cqi;background:#fffaf1;border-left:1px solid #d8bf9a;border-bottom:1px solid #d8bf9a;transform:translateY(-50%) rotate(45deg)}
.poem-rooster-game .rr-chip b{font-size:clamp(15px,3.1cqi,28px);color:var(--red);letter-spacing:.08em}
.poem-rooster-game .rr-chip small{font-size:clamp(14px,1.9cqi,17px);color:#6d5a44;font-weight:600}
@container (max-width:470px){.poem-rooster-game .rr-chip small{display:none}.poem-rooster-game .rr-chip{padding:.8cqi 2.2cqi}}
.poem-rooster-game .rr-caption{position:absolute;z-index:5;right:2.2cqi;top:2.2cqi;display:grid;justify-items:end;gap:.2em;padding:1cqi 2.4cqi 1.2cqi;border-radius:1.8cqi;background:#fff8ebe8;border:1px solid #e3c79c;color:#8a3a22;font-family:var(--sans);line-height:1.25;box-shadow:0 .6cqi 2cqi -.8cqi #5b3b1c66;opacity:0;transform:translateY(-1cqi);transition:opacity .6s ease .2s,transform .6s ease .2s;pointer-events:none}
.poem-rooster-game .rr-caption b{font-size:clamp(15px,3cqi,30px);letter-spacing:.06em;white-space:nowrap}
.poem-rooster-game .rr-caption small{font-size:clamp(14px,2.1cqi,20px);font-weight:700;color:#8a6a48;letter-spacing:.14em}
.poem-rooster-game.is-done .rr-caption{opacity:1;transform:none}
.poem-rooster-game .rr-loading{position:absolute;inset:0;z-index:8;display:grid;align-content:center;justify-items:center;gap:14px;padding:20px;background:#f6f0e4eb;font-size:20px;line-height:1.5;text-align:center;color:var(--ink)}
.poem-rooster-game .rr-loading button{min-height:48px;padding:10px 22px;border:1px solid #c7a77d;border-radius:14px;background:#fffdf8;color:var(--ink);font-size:20px;font-weight:600;cursor:pointer}

.poem-rooster-game .rr-panel{display:grid;gap:12px;align-content:start;min-width:0}
.poem-rooster-game .rr-clues{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:0;padding:0;list-style:none}
.poem-rooster-game .rr-clue{display:flex;align-items:center;gap:12px;min-width:0;padding:10px 12px;border-radius:18px;background:#fffdf8;border:1.5px dashed #dcc9a8;transition:border-color .3s,background .3s}
.poem-rooster-game .rr-clue.is-found{border-style:solid;border-color:#ddb083;background:#fff5e4}
.poem-rooster-game .rr-thumb{position:relative;flex:none;width:62px;height:62px;border-radius:14px;overflow:hidden;background:var(--rr-scene2) var(--thumb) no-repeat,#ece3d2;box-shadow:inset 0 0 0 1px #8b6c4a26}
.poem-rooster-game .rr-thumb::after{content:'?';position:absolute;inset:0;display:grid;place-items:center;font-size:30px;font-weight:700;color:#8a6f4f;background:#f8f1e3d0;-webkit-backdrop-filter:blur(3px) grayscale(1);backdrop-filter:blur(3px) grayscale(1)}
.poem-rooster-game .rr-clue.is-found .rr-thumb::after{content:none}
.poem-rooster-game .rr-clue span{min-width:0}
.poem-rooster-game .rr-clue b{display:block;font-size:22px;line-height:1.25;color:#6b5a48}
.poem-rooster-game .rr-clue.is-found b{color:var(--red);letter-spacing:.06em}
.poem-rooster-game .rr-clue small{display:block;font-size:16px;line-height:1.35;color:var(--soft);font-weight:600}
.poem-rooster-game .rr-next{min-height:56px;padding:10px 20px;border:0;border-radius:18px;background:linear-gradient(180deg,#44528a,#2d3765);color:#fff8e8;font-size:21px;font-weight:700;cursor:pointer;box-shadow:0 4px 0 #1f2749}
.poem-rooster-game .rr-next.is-wait{background:#d9cfbf;color:#5d4a36;box-shadow:0 4px 0 #b7a78f;cursor:default}
.poem-rooster-game .rr-skybar{display:flex;align-items:center;gap:10px;padding:6px 8px;border-radius:999px;background:linear-gradient(90deg,#e3e2ef,#fbefdc);border:1px solid #dacdb7}
.poem-rooster-game .rr-step{flex:none;width:52px;height:52px;padding:0;border-radius:50%;border:1.5px solid #d6c3a3;background:#fffdf8;display:grid;place-items:center;cursor:pointer;box-shadow:0 3px 0 #eadcc4}
.poem-rooster-game .rr-step:disabled{opacity:.45;box-shadow:none}
.poem-rooster-game .rr-step i{display:block}
.poem-rooster-game .rr-step.is-moon i{width:24px;height:24px;border-radius:50%;box-shadow:inset -7px 3px 0 0 #6b679e;transform:rotate(-15deg)}
.poem-rooster-game .rr-step.is-sun i{width:20px;height:20px;border-radius:50%;background:radial-gradient(circle,#ffeaa8,#f5a640);box-shadow:0 0 0 4px #f8c66a55,0 0 0 8px #f8c66a22}
.poem-rooster-game .rr-range{flex:1;min-width:0;height:52px;margin:0;padding:0;background:transparent;-webkit-appearance:none;appearance:none;cursor:pointer;border-radius:999px}
.poem-rooster-game .rr-range::-webkit-slider-runnable-track{height:14px;border-radius:999px;background:linear-gradient(90deg,#27304f,#5d5a8a 38%,#e7a25e 78%,#f8d27a)}
.poem-rooster-game .rr-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:46px;height:46px;margin-top:-16px;border-radius:50%;border:3px solid #fffaf0;background:radial-gradient(circle at 42% 38%,#fffbe6,#ffd36e 45%,#f19a3c);box-shadow:0 3px 8px #7a3f1366,0 0 0 6px #f7c25a40}
.poem-rooster-game .rr-range::-moz-range-track{height:14px;border-radius:999px;background:linear-gradient(90deg,#27304f,#5d5a8a 38%,#e7a25e 78%,#f8d27a)}
.poem-rooster-game .rr-range::-moz-range-thumb{width:40px;height:40px;border-radius:50%;border:3px solid #fffaf0;background:radial-gradient(circle at 42% 38%,#fffbe6,#ffd36e 45%,#f19a3c);box-shadow:0 3px 8px #7a3f1366,0 0 0 6px #f7c25a40}
.poem-rooster-game .rr-range:disabled{opacity:.6;cursor:default}
.poem-rooster-game .rr-crow{display:flex;align-items:center;justify-content:center;gap:12px;min-height:64px;padding:10px 20px;border-radius:20px;border:1.5px solid #c9b79b;background:#f3eee5;color:#6b5a48;cursor:pointer;box-shadow:0 4px 0 #ddd0bb;transition:background .4s,color .4s,box-shadow .4s,border-color .4s}
.poem-rooster-game .rr-crow span{font-size:26px;font-weight:800;letter-spacing:.14em;line-height:1.2}
.poem-rooster-game .rr-crow small{font-size:16px;font-weight:600;opacity:.85}
.poem-rooster-game.is-bright .rr-crow{background:linear-gradient(180deg,#d4573a,#b3432b);border-color:#a23a24;color:#fff8ec;box-shadow:0 4px 0 #8c2f1c,0 0 0 6px #f6b75a44}
.poem-rooster-game.is-bright:not(.is-reduced) .rr-crow{animation:rr-call 1.8s ease-in-out infinite}
@keyframes rr-call{50%{box-shadow:0 4px 0 #8c2f1c,0 0 0 12px #f6b75a1c}}
.poem-rooster-game .rr-lane{position:relative;overflow:hidden;overflow:clip;container-type:inline-size;border-radius:16px;aspect-ratio:900/360;background:linear-gradient(180deg,#f6d5a3,#fbeedb 75%);border:1px solid #dcc8a6}
.poem-rooster-game .rr-lane::before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#1b2346,#3a4068 75%);opacity:calc(1 - var(--d));pointer-events:none}
.poem-rooster-game .rr-lane-art{position:absolute;left:0;right:0;bottom:0;aspect-ratio:900/280;filter:brightness(calc(.5 + var(--d) * .5)) saturate(calc(.55 + var(--d) * .45))}
.poem-rooster-game .rr-lane-img{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none}
.poem-rooster-game .rr-door{position:absolute;left:var(--x);top:var(--y);width:var(--w);height:var(--h);perspective:220px;transition:box-shadow .8s ease}
.poem-rooster-game .rr-door.is-open{box-shadow:inset 0 5px 6px -2px #7a4a1e66,inset 0 0 8px #c9873a55}
.poem-rooster-game .rr-leaf{position:absolute;top:0;bottom:0;width:50.5%;background:var(--rr-door,linear-gradient(#8f4c2f,#7a3f27)) 0 0/200% 100% no-repeat,#8a4a2e;filter:saturate(.78) brightness(.96);transition:transform 1s cubic-bezier(.3,.7,.25,1),filter 1s ease}
.poem-rooster-game .rr-door.is-open .rr-leaf{filter:saturate(.7) brightness(.66)}
.poem-rooster-game .rr-leaf.is-l{left:0;transform-origin:0 50%}
.poem-rooster-game .rr-leaf.is-r{right:0;background-position:100% 0,0 0;transform-origin:100% 50%}
.poem-rooster-game .rr-door.is-open .rr-leaf.is-l{transform:rotateY(-66deg)}
.poem-rooster-game .rr-door.is-open .rr-leaf.is-r{transform:rotateY(66deg)}
.poem-rooster-game .rr-spill{position:absolute;left:-55%;right:-55%;bottom:-16%;height:30%;border-radius:50%;background:radial-gradient(closest-side,#ffd58acc,#ffd58a00);opacity:0;transition:opacity .8s ease .25s}
.poem-rooster-game .rr-door.is-open .rr-spill{opacity:1}
.poem-rooster-game.is-open:not(.is-done) .rr-door:not(.is-open)::after{content:'';position:absolute;inset:-4% -9%;border-radius:8px;box-shadow:0 0 0 2px #fff3d0e6,0 0 12px 4px #f6c76acc;animation:rr-breathe 1.8s ease-in-out calc(var(--i) * .2s) infinite;pointer-events:none}
.poem-rooster-game .rr-folk{position:absolute;left:7%;right:7%;bottom:1%;height:90%;background:var(--rr-folk) calc(var(--f) * 100% / 3) 100%/400% 100% no-repeat;transform-origin:50% 100%;opacity:0;transform:translateY(12%) scale(.92);transition:opacity .4s ease .35s,transform .55s cubic-bezier(.3,1.5,.5,1) .35s}
.poem-rooster-game .rr-door.is-open .rr-folk{opacity:1;transform:none}
.poem-rooster-game .rr-door.is-new .rr-folk{animation:rr-wave .9s ease-in-out 1s 2}
@keyframes rr-wave{30%{transform:translateY(-4%) rotate(-3deg)}70%{transform:translateY(-1%) rotate(2deg)}}
.poem-rooster-game .rr-win{position:absolute;left:var(--x);top:var(--y);width:5.6%;height:19%;transform:translate(-50%,-50%);border-radius:30%;background:radial-gradient(closest-side,#ffeab0 35%,#ffc8664d 72%,transparent);mix-blend-mode:screen;opacity:0;transition:opacity .8s ease .3s;pointer-events:none}
.poem-rooster-game .rr-win.is-on{opacity:1}
.poem-rooster-game .rr-perch{position:absolute;left:var(--x);top:var(--y);width:8.3%;aspect-ratio:133/150;transform:translate(-50%,-100%);pointer-events:none}
.poem-rooster-game .rr-hop{display:block;width:100%;height:100%;opacity:0;transform:translateY(30%) scale(.8);transform-origin:50% 100%;transition:opacity .3s ease .45s,transform .5s cubic-bezier(.3,1.6,.5,1) .45s}
.poem-rooster-game .rr-perch.is-on .rr-hop{opacity:1;transform:none}
.poem-rooster-game .rr-chick{display:block;width:100%;height:100%;background:var(--rr-chick) calc(var(--f) * 100% / 3) 100%/400% 100% no-repeat;transform-origin:50% 100%;filter:drop-shadow(0 1px 1px #3d312566)}
.poem-rooster-game .rr-perch.is-crow .rr-chick{animation:rr-chirp .9s ease-in-out}
@keyframes rr-chirp{20%{transform:rotate(calc(var(--k) * 8deg)) scale(1.06,1.08)}40%{transform:rotate(calc(var(--k) * 3deg))}60%{transform:rotate(calc(var(--k) * 9deg)) scale(1.06,1.08)}}
.poem-rooster-game .rr-oo{position:absolute;z-index:2;left:var(--x);top:var(--y);padding:.2em .55em .28em;border-radius:1em;background:#fffaf0f4;border:1.5px solid #e2b77a;color:#a8432c;font-family:var(--sans);font-size:clamp(14px,3cqi,19px);font-weight:800;line-height:1.15;letter-spacing:.04em;white-space:nowrap;box-shadow:0 2px 6px #5b3b1c40;opacity:0;transform:translate(0,-50%) scale(.6);transform-origin:0 50%;transition:opacity .2s ease,transform .3s cubic-bezier(.3,1.6,.5,1);pointer-events:none}
.poem-rooster-game .rr-oo.is-left{transform:translate(-100%,-50%) scale(.6);transform-origin:100% 50%}
.poem-rooster-game .rr-oo.is-on{opacity:1;transform:translate(0,-50%)}
.poem-rooster-game .rr-oo.is-left.is-on{transform:translate(-100%,-50%)}
.poem-rooster-game .rr-house{position:absolute;z-index:3;left:var(--x);width:var(--w);top:4%;bottom:6%;margin:0;padding:0;border:0;border-radius:12px;background:transparent;cursor:pointer}
.poem-rooster-game .rr-house:disabled{cursor:default}
.poem-rooster-game .rr-house:focus-visible{outline:3px solid #de9b34;outline-offset:-4px}
.poem-rooster-game .rr-count{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:0;padding:0;list-style:none}
.poem-rooster-game .rr-count li{position:relative;display:grid;place-items:center;min-height:42px;padding:4px 6px;border-radius:12px;border:1.5px dashed #d8c3a0;background:#fffdf8;color:#ad9a82;font-size:16px;font-weight:800;letter-spacing:.1em;line-height:1.2;white-space:nowrap;transition:background .4s,border-color .4s,color .4s}
.poem-rooster-game .rr-count li:nth-child(2){font-size:17px}
.poem-rooster-game .rr-count li:nth-child(3){font-size:19px}
.poem-rooster-game .rr-count li:nth-child(4){font-size:21px}
.poem-rooster-game .rr-count li+li::before{content:'';position:absolute;left:-5px;top:50%;width:6px;height:6px;border-top:2px solid #d8b98c;border-right:2px solid #d8b98c;transform:translate(-50%,-50%) rotate(45deg)}
.poem-rooster-game .rr-count li.is-on{border-style:solid;border-color:#dc9d55;background:linear-gradient(180deg,#fff3d6,#ffdfa4);color:#8a3a22}
.poem-rooster-game .rr-count li.is-new{animation:rr-pop .6s cubic-bezier(.3,1.6,.5,1)}
@keyframes rr-pop{0%{transform:scale(.7)}100%{transform:none}}

.poem-rooster-game .rr-actionline{display:flex;align-items:center;justify-content:space-between;gap:10px 14px;flex-wrap:wrap}
.poem-rooster-game .rr-method{font-size:18px;color:var(--soft);font-weight:600;line-height:1.4}
.poem-rooster-game .rr-audio{display:inline-flex;align-items:center;gap:9px;min-height:52px;padding:10px 20px;border-radius:16px;border:1.5px solid #cfa77a;background:#fffaf1;color:#7a3c22;font-size:20px;font-weight:700;cursor:pointer;box-shadow:0 3px 0 #ead8bd}
.poem-rooster-game .rr-audio::before{content:'';width:0;height:0;border-style:solid;border-width:8px 0 8px 12px;border-color:transparent transparent transparent currentColor}
.poem-rooster-game .rr-feedback{margin:0;min-height:3em;font-size:20px;line-height:1.5;text-align:center;color:#5b4a38;text-wrap:pretty}

@media (min-width:701px) and (orientation:landscape){
  .poem-rooster-game{grid-template-columns:minmax(0,1.45fr) minmax(260px,1fr);grid-template-rows:auto minmax(0,1fr) auto auto;align-items:start;column-gap:22px}
  .poem-rooster-game .rr-stage{grid-column:1;grid-row:1/5;align-self:start;width:min(100%,calc(100cqh * 16 / 9))}
  .poem-rooster-game .rr-head,.poem-rooster-game .rr-panel,.poem-rooster-game .rr-actionline,.poem-rooster-game .rr-feedback{grid-column:2}
  .poem-rooster-game .rr-head{grid-row:1;align-self:start}
  .poem-rooster-game .rr-panel{grid-row:2;align-self:center}
  .poem-rooster-game .rr-actionline{grid-row:3}
  .poem-rooster-game .rr-feedback{grid-row:4;text-align:left}
  .poem-rooster-game .rr-clues{grid-template-columns:1fr}
  .poem-rooster-game.is-dawn .rr-lane{display:none}
}
@media (min-width:900px) and (min-height:620px) and (orientation:landscape){
  .poem-rooster-game .rr-stage{align-self:center}
  .poem-rooster-game .rr-instruction{font-size:27px}
  .poem-rooster-game .rr-progress{font-size:21px;padding:8px 16px}
  .poem-rooster-game .rr-clue b{font-size:25px}
  .poem-rooster-game .rr-clue small{font-size:18px}
  .poem-rooster-game .rr-thumb{width:72px;height:72px}
  .poem-rooster-game .rr-next{min-height:66px;font-size:24px}
  .poem-rooster-game .rr-crow{min-height:74px}
  .poem-rooster-game .rr-crow span{font-size:30px}
  .poem-rooster-game .rr-method{font-size:20px}
  .poem-rooster-game .rr-audio{font-size:22px;min-height:58px}
  .poem-rooster-game .rr-feedback{font-size:22px}
}
@media (orientation:landscape) and (max-height:500px){
  .poem-rooster-game{gap:8px;column-gap:16px}
  .poem-rooster-game .rr-stage{position:sticky;top:0;z-index:1}
  .poem-rooster-game .rr-instruction{font-size:18px}
  .poem-rooster-game .rr-progress{font-size:15px;padding:4px 10px}
  .poem-rooster-game .rr-panel{gap:8px}
  .poem-rooster-game .rr-clue{padding:6px 10px;gap:10px}
  .poem-rooster-game .rr-thumb{width:46px;height:46px;border-radius:11px}
  .poem-rooster-game .rr-clue b{font-size:19px}
  .poem-rooster-game .rr-clue small{font-size:14px}
  .poem-rooster-game .rr-next{min-height:48px;font-size:18px}
  .poem-rooster-game .rr-skybar{padding:2px 6px}
  .poem-rooster-game .rr-step{width:46px;height:46px}
  .poem-rooster-game .rr-range{height:46px}
  .poem-rooster-game .rr-crow{min-height:50px;padding:6px 14px}
  .poem-rooster-game .rr-crow span{font-size:22px}
  .poem-rooster-game .rr-crow small{font-size:14px}
  .poem-rooster-game .rr-method{display:none}
  .poem-rooster-game .rr-actionline{justify-content:flex-start}
  .poem-rooster-game .rr-audio{min-height:46px;font-size:17px;padding:6px 14px}
  .poem-rooster-game .rr-feedback{font-size:16px;line-height:1.4;min-height:2.8em}
  .poem-rooster-game.is-dawn .rr-lane{display:none}
  .poem-rooster-game .rr-count{gap:6px}
  .poem-rooster-game .rr-count li{min-height:36px;padding:2px 4px}
}
@media (min-width:560px) and (orientation:portrait),(min-width:560px) and (max-width:700px){
  .poem-rooster-game.is-dawn .rr-panel{grid-template-columns:minmax(0,1fr) auto}
  .poem-rooster-game .rr-lane,.poem-rooster-game .rr-count{grid-column:1/-1}
}
@media (max-width:700px){
  .poem-rooster-game .rr-stage{border-radius:16px}
}
@media (max-width:420px){
  .poem-rooster-game{gap:10px}
  .poem-rooster-game .rr-instruction{font-size:19px}
  .poem-rooster-game .rr-progress{font-size:16px;padding:5px 11px}
  .poem-rooster-game .rr-clues{grid-template-columns:1fr;gap:8px}
  .poem-rooster-game .rr-clue{gap:9px;padding:8px 10px;border-radius:16px}
  .poem-rooster-game .rr-thumb{width:48px;height:48px;border-radius:11px}
  .poem-rooster-game .rr-clue b{font-size:20px}
  .poem-rooster-game .rr-clue small{font-size:15px}
  .poem-rooster-game .rr-skybar{gap:6px;padding:4px 6px}
  .poem-rooster-game .rr-step{width:48px;height:48px}
  .poem-rooster-game .rr-crow span{font-size:24px}
  .poem-rooster-game .rr-method{font-size:16px}
  .poem-rooster-game .rr-audio{font-size:18px;padding:8px 16px}
  .poem-rooster-game .rr-feedback{font-size:18px}
  .poem-rooster-game .rr-count{gap:7px}
  .poem-rooster-game .rr-count li{letter-spacing:.04em}
}
@media (max-width:370px){
  .poem-rooster-game .rr-instruction{font-size:17px}
  .poem-rooster-game .rr-crow small{display:none}
  .poem-rooster-game .rr-method{display:none}
  .poem-rooster-game .rr-actionline{justify-content:center}
}
.poem-rooster-game.is-reduced *,.poem-rooster-game.is-reduced *::before,.poem-rooster-game.is-reduced *::after{transition:none!important;animation:none!important}
.poem-rooster-game.is-reduced .rr-walk,.poem-rooster-game.is-reduced .rr-nhole,.poem-rooster-game.is-reduced .rr-nhead,.poem-rooster-game.is-reduced .rr-shakes{display:none!important}
@media (prefers-reduced-motion:reduce){.poem-rooster-game *,.poem-rooster-game *::before,.poem-rooster-game *::after{transition:none!important;animation:none!important}
  .poem-rooster-game .rr-walk,.poem-rooster-game .rr-nhole,.poem-rooster-game .rr-nhead,.poem-rooster-game .rr-shakes{display:none!important}}

/* poem-games/seven-steps.css */
.poem-seven-steps{--ss-ink:#294c3b;--ss-soft:#5f7566;--ss-paper:#fffdf7;--ss-line:#dcd8c8;--ss-gold:#e3a548;--ss-fire:#c9673a;display:block;width:100%;max-width:900px;margin-inline:auto;align-self:start;align-self:safe center;color:var(--ss-ink);font-family:var(--sans);min-width:0}
.poem-seven-steps *{box-sizing:border-box}
.poem-seven-steps [hidden]{display:none!important}
.poem-seven-steps button{font-family:inherit;color:inherit;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.poem-seven-steps button:focus-visible{outline:3px solid #de9b34;outline-offset:3px}
.poem-seven-steps .ss-layout{display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"head" "stage" "side";gap:12px;height:100%;align-content:center}
.poem-seven-steps .ss-head{grid-area:head;display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0}
.poem-seven-steps .ss-instruction{margin:0;font-size:clamp(19px,2.4vw,24px);font-weight:650;line-height:1.42}
.poem-seven-steps .ss-instruction span{display:inline-block}
.poem-seven-steps .ss-progress{flex:none;min-width:66px;padding:5px 12px;border-radius:18px;background:#edf3e7;color:#3c6447;font-size:18px;font-weight:600;text-align:center;font-variant-numeric:tabular-nums}
.poem-seven-steps.is-done .ss-progress{background:#f6e5c8;color:#8a4f24}

/* Stage: the three scene paintings stay 16:9; every overlay is placed in % of that box. */
.poem-seven-steps .ss-stage{grid-area:stage;position:relative;isolation:isolate;width:100%;aspect-ratio:16/9;justify-self:center;overflow:hidden;border-radius:20px;background:#e9e2d2;border:1px solid #d6d2c1;box-shadow:0 6px 20px #2c443114;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.poem-seven-steps .ss-scene,.poem-seven-steps .ss-hintplant{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none;-webkit-user-drag:none}
.poem-seven-steps .ss-scene-2,.poem-seven-steps .ss-scene-3{opacity:0;transition:opacity 1.1s ease}
.poem-seven-steps .ss-scene.is-on{opacity:1}
.poem-seven-steps .ss-patch{position:absolute;left:var(--l);top:var(--t);width:var(--w);height:auto;opacity:0;pointer-events:none;transition:opacity .9s ease .35s;-webkit-user-drag:none}
.poem-seven-steps .ss-patch.is-on{opacity:1;transition:none}
.poem-seven-steps .ss-hintplant{opacity:0;transition:opacity .8s ease;-webkit-mask-image:radial-gradient(ellipse 21% 32% at 41% 26%,#000 52%,transparent 100%);mask-image:radial-gradient(ellipse 21% 32% at 41% 26%,#000 52%,transparent 100%)}
.poem-seven-steps .ss-hintplant.is-on{opacity:.34}
.poem-seven-steps .ss-glow{position:absolute;left:29%;top:88%;width:34%;height:34%;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(closest-side,#ffb35a70,#ff8a3a2c 55%,transparent);mix-blend-mode:screen;opacity:0;pointer-events:none;transition:opacity 1.2s ease}
.poem-seven-steps .ss-glow.is-on{opacity:1;animation:ss-flicker 2.4s ease-in-out 1.2s 6 alternate}
.poem-seven-steps .ss-tear{position:absolute;left:var(--x);top:var(--y);z-index:2;width:3.1%;min-width:13px;transform:translate(-50%,-50%) translateY(-8px);opacity:0;pointer-events:none;transition:opacity .35s ease,transform .7s cubic-bezier(.3,.7,.4,1);filter:drop-shadow(0 1px 1px #24403555)}
.poem-seven-steps .ss-tear.is-on{opacity:1;transform:translate(-50%,-50%)}
.poem-seven-steps .ss-tear svg,.poem-seven-steps .ss-sob-icons svg{display:block;width:100%;height:auto;fill:#d8eef4;stroke:#5c8fa3;stroke-width:1.4}
.poem-seven-steps .ss-shine{fill:none;stroke:#fff;stroke-width:1.6;stroke-linecap:round}
.poem-seven-steps .ss-token{position:absolute;left:var(--x);top:var(--y);z-index:3;display:grid;place-items:center;width:clamp(30px,6.4%,52px);aspect-ratio:1;transform:translate(-50%,-50%) scale(.6);border-radius:50%;background:#fffaf0f2;border:2px solid #b5523b;color:#9a3f2c;font-size:clamp(16px,2.6vw,26px);font-weight:700;line-height:1;box-shadow:0 3px 8px #3b2a1a38;opacity:0;pointer-events:none;transition:opacity .35s ease,transform .45s cubic-bezier(.3,1.4,.5,1),left 1s ease,top 1s ease}
.poem-seven-steps .ss-token.is-on{opacity:1;transform:translate(-50%,-50%) scale(1)}
.poem-seven-steps[data-step="6"] .ss-token,.poem-seven-steps[data-step="7"] .ss-token{opacity:1;transform:translate(-50%,-50%) scale(.92)}
.poem-seven-steps .ss-fx{position:absolute;inset:0;z-index:4;pointer-events:none;overflow:hidden}

/* Drop targets: soft ink rings with a paper label, only shown when they are useful. */
.poem-seven-steps .ss-target{position:absolute;left:var(--x);top:var(--y);z-index:5;width:var(--w);height:var(--h);min-width:46px;min-height:46px;transform:translate(-50%,-50%);padding:0;border:2.5px dashed #fffaeef2;border-radius:50%;background:radial-gradient(closest-side,#fff8e42e,#fff8e412 70%,transparent);box-shadow:0 0 0 2px #4a332066,inset 0 0 0 2px #4a33204d,0 0 14px 4px #fff4d633;cursor:pointer;transition:border-color .2s,background .2s,box-shadow .2s}
.poem-seven-steps .ss-target>span{position:absolute;left:50%;top:var(--ly,0%);transform:translate(-50%,-50%);padding:3px 11px;border-radius:999px;background:#fffaf0f0;color:#2d4a3c;font-size:clamp(14px,1.9vw,18px);font-weight:650;line-height:1.35;white-space:nowrap;box-shadow:0 2px 6px #2a1d1033}
.poem-seven-steps .ss-target-stove{--ly:50%}
.poem-seven-steps .ss-target-root{--ly:118%;border-style:solid;border-color:#fff6dfd9;background:#fffaf033}
.poem-seven-steps .ss-target-root svg{position:absolute;left:50%;top:50%;width:62%;transform:translate(-50%,-50%);fill:none;stroke:#7a5532;stroke-width:2.6;stroke-linecap:round}
.poem-seven-steps .ss-target.is-calling{border-color:#ffe2a4;animation:ss-call 1.6s ease-in-out infinite}
.poem-seven-steps .ss-target.is-over,.poem-seven-steps .ss-target:hover:not(:disabled){border-style:solid;border-color:#ffd27a;background:radial-gradient(closest-side,#fff3c94d,#ffe6a01f 70%,transparent);box-shadow:0 0 0 4px #ffcf7366,0 0 22px 8px #ffd98a55}
.poem-seven-steps .ss-target:disabled{cursor:default}
.poem-seven-steps[data-step="4"] .ss-target-pot>span{--ly:0%}
.poem-seven-steps .ss-caption{position:absolute;right:3.5%;top:5%;z-index:6;display:flex;flex-direction:column;gap:2px;padding:9px 16px;border-radius:14px;background:#fefbf0e6;color:#315240;font-size:clamp(17px,2.6vw,27px);font-weight:650;line-height:1.45;letter-spacing:.12em;box-shadow:0 4px 14px #2a1d1026;pointer-events:none;animation:ss-rise .7s ease both}
.poem-seven-steps .ss-loading{position:absolute;inset:0;z-index:9;display:grid;align-content:center;justify-items:center;gap:14px;padding:20px;background:#f5f2eae8;font-size:20px;line-height:1.5;text-align:center}
.poem-seven-steps .ss-loading button{min-height:48px;padding:10px 22px;border:1px solid #97ad9b;border-radius:14px;background:#fffefa;font-weight:600;font-size:19px;cursor:pointer}

/* Spawned motion (never created when reducedMotion is on). */
.poem-seven-steps .ss-bean{position:absolute;left:var(--x);top:24%;width:2.3%;min-width:7px;aspect-ratio:1.15;border-radius:50%;background:radial-gradient(circle at 35% 30%,#f6e2b0,#d4a85e 60%,#a87a3c);box-shadow:0 1px 1px #5a3d1a55;opacity:0;animation:ss-fall .8s cubic-bezier(.5,0,.8,.6) var(--d) both}
.poem-seven-steps .ss-pour{position:absolute;left:63%;top:31%;width:17%;transform-origin:85% 70%;animation:ss-pour 1.4s ease both}
.poem-seven-steps .ss-pour img,.poem-seven-steps .ss-push img{display:block;width:100%;height:auto}
.poem-seven-steps .ss-drip{position:absolute;left:var(--x);top:71.5%;width:.7%;min-width:4px;aspect-ratio:.7;border-radius:50% 50% 50% 50%/60% 60% 40% 40%;background:#e9dcc0;box-shadow:inset -1px -1px 0 #b39a6e88;opacity:0;animation:ss-drip .9s ease-in var(--d) 3}
.poem-seven-steps .ss-push{position:absolute;left:44%;top:84%;width:17%;animation:ss-push 1.2s ease both}
.poem-seven-steps .ss-gudu{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);padding:1px 8px;border-radius:999px;background:#fffaf0dd;color:#5c4126;font-size:clamp(14px,1.8vw,18px);font-style:normal;font-weight:700;letter-spacing:.06em;animation:ss-gudu 1.2s ease-out both}

/* Side panel: footprints, materials, action line and feedback. */
.poem-seven-steps .ss-side{grid-area:side;display:flex;flex-direction:column;gap:12px;min-width:0}
.poem-seven-steps .ss-walk{--at:0;position:relative;display:grid;grid-template-columns:repeat(9,minmax(0,1fr));align-items:end;justify-items:center;padding:36px 4px 6px;border-radius:18px;background:linear-gradient(#fbf7ec,#f3eedf);border:1px solid #e3dccb}
.poem-seven-steps .ss-walk::before{content:'';position:absolute;left:8%;right:8%;bottom:9px;height:2px;border-radius:2px;background:repeating-linear-gradient(90deg,#c9bfa6 0 6px,transparent 6px 12px)}
.poem-seven-steps .ss-foot{width:min(22px,64%);display:block;transform:translateY(-3px) rotate(-8deg);transition:transform .4s ease}
.poem-seven-steps .ss-foot.is-right{transform:translateY(3px) scaleX(-1) rotate(-8deg)}
.poem-seven-steps .ss-foot:nth-child(1){grid-column:2}
.poem-seven-steps .ss-foot svg{display:block;width:100%;height:auto;fill:#d8d0bd;transition:fill .45s ease,filter .45s ease}
.poem-seven-steps .ss-foot.is-lit svg{fill:#2f5443;filter:drop-shadow(0 0 4px #f2c76d)}
.poem-seven-steps .ss-seal{display:grid;place-items:center;width:min(34px,90%);aspect-ratio:1;border-radius:7px;border:2px solid #c9b8a0;color:#b9ab95;font-size:18px;line-height:1;font-weight:700;transition:background .4s,color .4s,border-color .4s}
.poem-seven-steps .ss-seal.is-lit{background:#b5523b;border-color:#9a3f2c;color:#fff7ea;box-shadow:0 2px 6px #9a3f2c55}
.poem-seven-steps .ss-walker{position:absolute;top:3px;left:calc((var(--at) + .5) * (100% - 8px) / 9 + 4px);width:32px;height:32px;transform:translateX(-50%);border-radius:50%;overflow:hidden;border:2px solid #fff;background:#efe6d3;box-shadow:0 2px 6px #2a1d1040;transition:left .7s cubic-bezier(.4,1.3,.5,1)}
.poem-seven-steps .ss-walker img{width:100%;height:100%;object-fit:cover;object-position:50% 14%;display:block}
.poem-seven-steps .ss-tray{display:flex;flex-wrap:wrap;justify-content:center;align-items:stretch;gap:10px;min-height:66px}
.poem-seven-steps .ss-item{position:relative;display:flex;align-items:center;justify-content:center;gap:8px;min-width:0;min-height:66px;flex:1 1 150px;max-width:240px;padding:6px 14px;border:1.5px solid var(--ss-line);border-radius:18px;background:var(--ss-paper);font-size:19px;font-weight:650;line-height:1.25;cursor:pointer;box-shadow:0 3px 0 #e6e1d2;transition:border-color .2s,background .2s,box-shadow .2s,opacity .2s,transform .2s;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.poem-seven-steps .ss-item span{white-space:nowrap}
.poem-seven-steps .ss-item img{display:block;height:50px;width:auto;max-width:86px;object-fit:contain;pointer-events:none;-webkit-user-drag:none;filter:drop-shadow(0 2px 2px #3b2a1a2e)}
.poem-seven-steps .ss-item.is-draggable{touch-action:none;cursor:grab}
.poem-seven-steps .ss-item[aria-pressed=true]{border-color:#c98b3a;background:#fff3d9;box-shadow:0 0 0 4px #e3a54870,0 3px 0 #ead7b4;transform:translateY(-2px)}
.poem-seven-steps .ss-item:hover:not(:disabled){border-color:#b9c7b1}
.poem-seven-steps .ss-item.is-source{opacity:.45}
.poem-seven-steps .ss-item:disabled{cursor:default}
.poem-seven-steps .ss-item.is-used{opacity:.5;background:#f2efe6;box-shadow:none}
.poem-seven-steps .ss-chip{flex:0 1 170px;gap:6px}
.poem-seven-steps .ss-item.ss-chip img{height:40px;max-width:64px}
.poem-seven-steps .ss-chip b{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;border:2px solid #b5523b;color:#9a3f2c;background:#fffaf0;font-size:25px;line-height:1}
.poem-seven-steps .ss-sobs{display:flex;align-items:center;justify-content:center;gap:12px;padding:8px 14px;border-radius:16px;background:#f3f5ee;font-size:18px;font-weight:600;color:var(--ss-soft)}
.poem-seven-steps .ss-sob-icons{display:flex;gap:6px}
.poem-seven-steps .ss-sob-icons i{width:20px;opacity:.35;filter:grayscale(1);transition:opacity .3s,filter .3s}
.poem-seven-steps .ss-sob-icons i.is-on{opacity:1;filter:none}
.poem-seven-steps .ss-kin{width:100%;display:grid;gap:8px;text-align:center}
.poem-seven-steps .ss-kin div{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.poem-seven-steps .ss-kin button{min-height:58px;padding:8px 6px;border:1.5px solid var(--ss-line);border-radius:16px;background:var(--ss-paper);font-size:22px;font-weight:650;letter-spacing:.08em;cursor:pointer;box-shadow:0 3px 0 #e6e1d2}
.poem-seven-steps .ss-kin button:hover:not(:disabled){border-color:#c98b3a;background:#fff6e2}
.poem-seven-steps .ss-kin button:disabled{cursor:default;opacity:.7}
.poem-seven-steps .ss-summary{width:100%;padding:12px 16px;border-radius:16px;background:#fbf4e4;border:1px solid #ecdcbc;text-align:center}
.poem-seven-steps .ss-summary b{display:block;font-size:21px;letter-spacing:.1em;color:#7b3e22}
.poem-seven-steps .ss-summary p{margin:6px 0 0;font-size:17px;line-height:1.55;color:#4b5f50;text-align:left}
.poem-seven-steps .ss-actionline{display:flex;align-items:center;justify-content:space-between;gap:10px}
.poem-seven-steps .ss-method{font-size:17px;line-height:1.4;color:var(--ss-soft)}
.poem-seven-steps .ss-audio{flex:none;display:inline-flex;align-items:center;gap:7px;min-height:48px;padding:8px 16px;border:1px solid #b9cbae;border-radius:999px;background:#fffef7;color:#356148;font-size:18px;font-weight:600;cursor:pointer}
.poem-seven-steps .ss-audio svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.poem-seven-steps .ss-audio svg path:first-child{fill:currentColor}
.poem-seven-steps .ss-feedback{margin:0;min-height:3em;font-size:18px;line-height:1.5;color:#4a6a59;text-align:center;text-wrap:pretty}
.poem-seven-steps .ss-ghost{position:fixed;left:0;top:0;z-index:80;width:112px;transform:translate(-50%,-62%) rotate(-6deg);pointer-events:none;filter:drop-shadow(0 8px 10px #2a1d1045)}
.poem-seven-steps .ss-ghost img{display:block;width:100%;height:auto}
.poem-seven-steps .ss-ghost b{display:grid;place-items:center;width:56px;height:56px;margin:auto;border-radius:50%;border:2px solid #b5523b;background:#fffaf0;color:#9a3f2c;font-size:30px}
.poem-seven-steps.is-readonly .ss-actionline .ss-method{visibility:hidden}

@keyframes ss-call{50%{box-shadow:0 0 0 4px #ffd27a59,0 0 20px 8px #ffd98a4d}}
@keyframes ss-flicker{from{opacity:.75}to{opacity:1}}
@keyframes ss-rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes ss-fall{0%{opacity:0;top:22%}15%{opacity:1}80%{opacity:1}100%{opacity:0;top:50%}}
@keyframes ss-pour{0%{opacity:0;transform:rotate(0)}20%{opacity:1}55%{transform:rotate(-28deg)}85%{opacity:1}100%{opacity:0;transform:rotate(-28deg)}}
@keyframes ss-drip{0%{opacity:0;top:71.5%}20%{opacity:.95}100%{opacity:0;top:80%}}
@keyframes ss-push{0%{opacity:0;transform:translateX(30%)}25%{opacity:1}80%{opacity:1;transform:translateX(-60%) scale(.9)}100%{opacity:0;transform:translateX(-70%) scale(.85)}}
@keyframes ss-gudu{0%{opacity:0;transform:translate(-50%,-30%) scale(.8)}25%{opacity:1;transform:translate(-50%,-60%) scale(1)}100%{opacity:0;transform:translate(-50%,-150%)}}

/* Landscape: picture on the left, the walk and the materials on the right. */
@media (orientation:landscape) and (min-width:701px),(orientation:landscape) and (max-height:500px){
 .poem-seven-steps{max-width:1280px}
 .poem-seven-steps .ss-layout{grid-template-columns:minmax(0,1.75fr) minmax(290px,1fr);grid-template-rows:auto minmax(0,1fr);grid-template-areas:"stage head" "stage side";column-gap:22px;row-gap:12px;align-items:center}
 .poem-seven-steps .ss-stage{width:min(100%,calc((100cqh - 24px) * 16 / 9));align-self:center}
 .poem-seven-steps .ss-head{align-self:end}
 .poem-seven-steps .ss-side{align-self:start}
}
@media (orientation:landscape) and (min-width:1100px) and (min-height:700px){
 .poem-seven-steps .ss-instruction{font-size:26px}
 .poem-seven-steps .ss-item{min-height:76px;font-size:21px}
 .poem-seven-steps .ss-item img{height:60px;max-width:100px}
 .poem-seven-steps .ss-item.ss-chip img{height:48px;max-width:76px}
 .poem-seven-steps .ss-feedback{font-size:20px}
 .poem-seven-steps .ss-walk{padding-top:48px}
 .poem-seven-steps .ss-walker{width:42px;height:42px}
 .poem-seven-steps .ss-foot{width:min(27px,64%)}
 .poem-seven-steps .ss-seal{width:min(40px,90%);font-size:21px}
}
@media (orientation:portrait) and (min-width:701px){
 .poem-seven-steps .ss-walk{padding-top:46px}
 .poem-seven-steps .ss-walker{width:40px;height:40px}
 .poem-seven-steps .ss-foot{width:min(27px,64%)}
 .poem-seven-steps .ss-seal{width:min(40px,90%);font-size:21px}
 .poem-seven-steps .ss-item{min-height:74px;font-size:21px}
 .poem-seven-steps .ss-item img{height:58px;max-width:100px}
 .poem-seven-steps .ss-item.ss-chip img{height:50px;max-width:80px}
 .poem-seven-steps .ss-chip{flex-basis:200px}
}
/* Short phone landscape: the host gives the game only ~180px of height, so the picture
   takes the full height and the right column packs the walk, materials and feedback. */
@media (orientation:landscape) and (max-height:500px){
 .poem-seven-steps .ss-layout{grid-template-columns:min(calc((100cqh - 2px) * 16 / 9),56%) minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);column-gap:12px;row-gap:5px;align-items:start}
 .poem-seven-steps .ss-stage{width:100%;border-radius:12px}
 .poem-seven-steps .ss-head{gap:8px;align-self:start}
 .poem-seven-steps .ss-instruction{font-size:17px;line-height:1.3}
 .poem-seven-steps .ss-progress{min-width:50px;padding:2px 8px;font-size:15px}
 .poem-seven-steps .ss-side{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"walk walk" "tray audio" "fb fb";gap:5px 8px;align-items:center}
 .poem-seven-steps .ss-walk{grid-area:walk;min-height:30px;padding:3px 2px;align-items:center;border-radius:12px}
 .poem-seven-steps .ss-walk::before{bottom:5px}
 .poem-seven-steps .ss-walker{top:50%;width:24px;height:24px;transform:translate(-50%,-50%)}
 .poem-seven-steps .ss-foot{width:min(14px,60%)}
 .poem-seven-steps .ss-seal{width:min(23px,90%);font-size:14px;border-radius:5px}
 .poem-seven-steps .ss-tray{grid-area:tray;gap:6px;min-height:46px}
 .poem-seven-steps .ss-item{min-height:46px;max-width:200px;padding:3px 10px;font-size:16px;border-radius:13px;gap:6px;flex-basis:110px}
 .poem-seven-steps .ss-item img{height:34px;max-width:58px}
 .poem-seven-steps .ss-chip b{width:36px;height:36px;font-size:20px}
 .poem-seven-steps .ss-item.ss-chip img{height:26px;max-width:44px}
 .poem-seven-steps .ss-sobs{padding:4px 10px;font-size:15px;gap:8px}
 .poem-seven-steps .ss-sob-icons i{width:15px}
 .poem-seven-steps .ss-kin div{gap:6px}
 .poem-seven-steps .ss-kin button{min-height:46px;font-size:18px}
 .poem-seven-steps .ss-summary{padding:5px 10px;border-radius:12px}
 .poem-seven-steps .ss-summary b{display:none}
 .poem-seven-steps .ss-summary p{margin:0;font-size:14px;line-height:1.45}
 .poem-seven-steps .ss-actionline{display:contents}
 .poem-seven-steps .ss-method{display:none}
 .poem-seven-steps .ss-audio{grid-area:audio;min-height:44px;padding:4px 11px;gap:5px;font-size:15px}
 .poem-seven-steps .ss-audio svg{width:19px;height:19px}
 .poem-seven-steps .ss-feedback{grid-area:fb;min-height:2.8em;font-size:15px;line-height:1.4;text-align:left}
 .poem-seven-steps .ss-target>span{font-size:14px;padding:1px 7px}
 .poem-seven-steps .ss-token{font-size:17px}
 .poem-seven-steps .ss-caption{right:3%;top:4%;gap:0;padding:4px 8px;border-radius:9px;font-size:14px;line-height:1.4;letter-spacing:.04em}
 .poem-seven-steps.is-done .ss-walk{display:none}
 .poem-seven-steps.is-done .ss-side{grid-template-areas:"tray tray" "fb audio"}
}
@media (max-width:420px){
 .poem-seven-steps .ss-layout{gap:10px}
 .poem-seven-steps .ss-instruction{font-size:19px}
 .poem-seven-steps .ss-progress{min-width:56px;padding:4px 8px;font-size:16px}
 .poem-seven-steps .ss-stage{border-radius:15px}
 .poem-seven-steps .ss-side{gap:10px}
 .poem-seven-steps .ss-item{flex-basis:140px;padding:6px 10px;font-size:18px;gap:6px}
 .poem-seven-steps .ss-item img{height:44px;max-width:70px}
 .poem-seven-steps .ss-method{font-size:15px}
 .poem-seven-steps .ss-audio{padding:7px 12px;font-size:17px}
 .poem-seven-steps .ss-feedback{font-size:17px;text-align:left}
 .poem-seven-steps .ss-target>span{font-size:14px;padding:2px 8px}
 .poem-seven-steps .ss-caption{padding:5px 9px;border-radius:10px;letter-spacing:.06em}
}
@media (max-width:370px){
 .poem-seven-steps .ss-item{flex-direction:column;gap:2px;padding:5px 6px;font-size:16px}
 .poem-seven-steps .ss-item.ss-chip{flex-direction:row;gap:4px}
 .poem-seven-steps .ss-item img{height:38px}
 .poem-seven-steps .ss-kin button{font-size:19px;letter-spacing:0}
 .poem-seven-steps .ss-walker{width:26px;height:26px}
}
.poem-seven-steps.is-reduced .ss-scene,.poem-seven-steps.is-reduced .ss-patch,.poem-seven-steps.is-reduced .ss-tear,.poem-seven-steps.is-reduced .ss-token,.poem-seven-steps.is-reduced .ss-glow,.poem-seven-steps.is-reduced .ss-hintplant,.poem-seven-steps.is-reduced .ss-walker,.poem-seven-steps.is-reduced .ss-foot svg,.poem-seven-steps.is-reduced .ss-seal{transition:none}
.poem-seven-steps.is-reduced .ss-glow,.poem-seven-steps.is-reduced .ss-target,.poem-seven-steps.is-reduced .ss-caption{animation:none}
@media (prefers-reduced-motion:reduce){
 .poem-seven-steps .ss-scene,.poem-seven-steps .ss-patch,.poem-seven-steps .ss-tear,.poem-seven-steps .ss-token,.poem-seven-steps .ss-glow,.poem-seven-steps .ss-hintplant,.poem-seven-steps .ss-walker,.poem-seven-steps .ss-foot svg,.poem-seven-steps .ss-seal{transition:none}
 .poem-seven-steps .ss-glow,.poem-seven-steps .ss-target,.poem-seven-steps .ss-caption,.poem-seven-steps .ss-fx *{animation:none}
 .poem-seven-steps .ss-fx{display:none}
}

/* poem-games/couplet.css */
.poem-couplet-game{--pc-ink:#294c3b;--pc-soft:#5f7566;--pc-paper:#fffdf7;--pc-line:#dcd8c8;display:block;width:100%;max-width:880px;margin-inline:auto;color:var(--pc-ink);font-family:var(--sans);min-width:0}
.poem-couplet-game *{box-sizing:border-box}
.poem-couplet-game [hidden]{display:none!important}
.poem-couplet-game button{font-family:inherit;color:inherit;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.poem-couplet-game button:disabled{opacity:1}
.poem-couplet-game img{max-width:none}
.poem-couplet-game button:focus-visible{outline:3px solid #de9b34;outline-offset:3px}
.poem-couplet-game .pc-layout{display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"head" "stage" "side";gap:12px;height:100%;align-content:center}
.poem-couplet-game .pc-head{grid-area:head;display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0}
.poem-couplet-game .pc-instruction{margin:0;min-height:2.84em;font-size:clamp(19px,2.4vw,24px);font-weight:650;line-height:1.42;text-wrap:balance}
.poem-couplet-game .pc-progress{flex:none;min-width:66px;padding:5px 12px;border-radius:18px;background:#edf3e7;color:#3c6447;font-size:18px;font-weight:600;text-align:center;font-variant-numeric:tabular-nums}
.poem-couplet-game.is-done .pc-progress{background:#f6e5c8;color:#8a4f24}

/* Stage: one 1600×900 painting (the "world") that gains a line of the poem each round; overlays sit in % of it and 1cqw = 16 painting px. */
.poem-couplet-game .pc-stage{grid-area:stage;position:relative;isolation:isolate;width:100%;aspect-ratio:16/9;justify-self:center;overflow:hidden;border-radius:20px;background:#e9e2d2;border:1px solid #d6d2c1;box-shadow:0 6px 20px #2c443114;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.poem-couplet-game .pc-world{position:absolute;top:0;left:0;width:100%;height:100%;container-type:inline-size;overflow:hidden}
.poem-couplet-game.is-live[data-round="0"] .pc-world{touch-action:none;cursor:crosshair}
.poem-couplet-game.is-live[data-round="2"] .pc-world{touch-action:none}
.poem-couplet-game .pc-world img{-webkit-user-drag:none;pointer-events:none}
.poem-couplet-game .pc-scene{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .9s ease}
.poem-couplet-game .pc-scene.is-on{opacity:1}
.poem-couplet-game .pc-gap{position:absolute;left:25.9375%;top:17.333%;width:16.75%;height:23.889%}
.poem-couplet-game .pc-pale,.poem-couplet-game .pc-canvas{position:absolute;inset:0;width:100%;height:100%;opacity:0;pointer-events:none;transition:opacity .9s ease}
.poem-couplet-game .pc-pale.is-on,.poem-couplet-game .pc-canvas.is-on{opacity:1}
.poem-couplet-game .pc-haze{position:absolute;left:48%;top:28%;width:52%;height:42%;border-radius:50%;background:radial-gradient(closest-side,#f7f5efe6,#f3f0e6b3 55%,#f3f0e600);opacity:0;pointer-events:none;transition:opacity .8s ease}
.poem-couplet-game .pc-haze.is-on{opacity:1;animation:poem-couplet-drift 6s ease-in-out infinite}

/* Round 1: the brush, the orioles flying in and singing. */
.poem-couplet-game .pc-brush{position:absolute;left:var(--bx,21%);top:var(--by,86%);width:1.6cqw;height:18.96cqw;transform:translate(-50%,-100%) rotate(var(--br,24deg));transform-origin:50% 100%;pointer-events:none;transition:left .35s ease,top .35s ease,transform .35s ease,opacity .5s ease,visibility 0s}
.poem-couplet-game .pc-brush img{display:block;width:100%;height:100%;filter:drop-shadow(2px 3px 2px #3b2a1a55)}
.poem-couplet-game .pc-brush.is-held{transition:opacity .5s ease}
.poem-couplet-game .pc-fly{position:absolute;left:var(--x);top:var(--y);width:9.4cqw;height:auto;transform:translate(-50%,-50%);opacity:0}
.poem-couplet-game.is-arriving .pc-fly{animation:poem-couplet-arrive 1.45s cubic-bezier(.3,.6,.4,1) var(--d) both}
.poem-couplet-game .pc-bird{position:absolute;padding:0;border:0;background:none;cursor:pointer}
.poem-couplet-game .pc-bird::before{content:'';position:absolute;left:50%;top:50%;width:max(100%,48px);height:max(100%,48px);transform:translate(-50%,-50%);border-radius:50%}
.poem-couplet-game .pc-bird img{display:block;width:100%;height:100%;filter:drop-shadow(0 0 0 #fff0)}
.poem-couplet-game .pc-bird:disabled{cursor:default}
.poem-couplet-game .pc-bird.is-away{visibility:hidden;opacity:0;pointer-events:none}
.poem-couplet-game .pc-bird.is-cue img{animation:poem-couplet-glow 1.8s ease-in-out infinite}
.poem-couplet-game .pc-bird.is-sing img{animation:poem-couplet-sing .9s ease-out}
.poem-couplet-game .pc-chirp{position:absolute;left:50%;bottom:92%;padding:2px 10px;border-radius:14px;background:#fffaf0f5;color:#7b4a12;font-size:clamp(14px,1.6cqw,19px);font-weight:700;line-height:1.4;white-space:nowrap;box-shadow:0 2px 6px #2a1d1033;transform:translate(-50%,0) scale(.6);opacity:0;pointer-events:none}
.poem-couplet-game .pc-bird.is-sing .pc-chirp{animation:poem-couplet-chirp .9s ease-out}

/* Round 2: egrets on the river bank fly up into the dashed line in the sky. */
.poem-couplet-game .pc-flock{position:absolute;inset:0;pointer-events:none;transition:transform 1.2s cubic-bezier(.3,.7,.3,1),opacity .5s ease,visibility 0s}
.poem-couplet-game .pc-flock.is-low{transform:translate(-2%,6%)}
.poem-couplet-game .pc-flock svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.poem-couplet-game .pc-flock polyline{fill:none;stroke:#fffdf4d9;stroke-width:2.5;stroke-dasharray:3 9;stroke-linecap:round;vector-effect:non-scaling-stroke;transition:opacity .5s}
.poem-couplet-game .pc-flock:not(.is-low) polyline{opacity:0}
.poem-couplet-game .pc-slot{position:absolute;left:var(--x);top:var(--y);width:max(var(--w),26px);height:max(var(--h),26px);transform:translate(-50%,-50%);border:2.5px dashed #fffdf4;border-radius:40%;background:#ffffff2e;box-shadow:0 0 0 1.5px #3d556659;transition:opacity .3s}
.poem-couplet-game .pc-slot.is-full{opacity:0}
.poem-couplet-game .pc-flock.is-cue .pc-slot:not(.is-full){animation:poem-couplet-call 1.6s ease-in-out infinite}
.poem-couplet-game .pc-slotimg{position:absolute;opacity:0}
.poem-couplet-game .pc-slotimg.is-on{opacity:1}
.poem-couplet-game .pc-slotimg.is-in{animation:poem-couplet-flyin .8s cubic-bezier(.3,.6,.35,1) both}
.poem-couplet-game .pc-egret{position:absolute;padding:0;border:0;background:none;transform:translate(calc(-50% + var(--dx,0px)),calc(-100% + var(--dy,0px)));touch-action:none;cursor:grab;transition:transform .3s cubic-bezier(.3,1.3,.5,1),filter .2s}
.poem-couplet-game .pc-egret::before{content:'';position:absolute;left:50%;top:50%;width:max(100%,48px);height:max(100%,48px);transform:translate(-50%,-50%)}
.poem-couplet-game .pc-egret img{display:block;width:100%;height:100%;filter:drop-shadow(0 2px 2px #2c3f4a40)}
.poem-couplet-game .pc-egret:not(:disabled) img{animation:poem-couplet-glow 2.4s ease-in-out infinite}
.poem-couplet-game .pc-egret:hover:not(:disabled){filter:brightness(1.06)}
.poem-couplet-game .pc-egret.is-held{z-index:4;cursor:grabbing;transition:none}
.poem-couplet-game .pc-egret.is-held img{animation:none;filter:drop-shadow(3px 10px 6px #2c3f4a55)}
.poem-couplet-game .pc-egret:disabled{cursor:default}

/* Round 3: a window to push open and slide like a viewfinder until it "holds" the snowy 西嶺 (窗含). */
.poem-couplet-game .pc-lens{position:absolute;inset:0;width:100%;height:100%;opacity:0;visibility:hidden;clip-path:inset(calc(var(--wy)*1% - 16.62%) calc(91.21% - var(--wx)*1%) calc(83.46% - var(--wy)*1%) calc(var(--wx)*1% - 8.65%));transition:opacity .5s ease,visibility 0s linear .5s}
.poem-couplet-game .pc-lens.is-on{opacity:1;visibility:visible;transition:opacity .5s ease,visibility 0s}
.poem-couplet-game .pc-window{position:absolute;left:calc(var(--wx)*1% - 11%);top:calc(var(--wy)*1% - 20.62%);width:22%;height:41.24%;padding:0;border:0;border-radius:6px;background:none;perspective:900px;touch-action:none;cursor:grab;transition:opacity .5s ease,visibility 0s}
.poem-couplet-game .pc-window:disabled{cursor:default}
.poem-couplet-game .pc-window:not(.is-open){cursor:pointer}
.poem-couplet-game .pc-window.is-held{cursor:grabbing}
.poem-couplet-game .pc-frame{position:absolute;inset:0;width:100%;height:100%;filter:drop-shadow(0 6px 8px #2c1f1255)}
.poem-couplet-game .pc-shutter{position:absolute;top:9.7%;height:80.4%;width:39.65%;transition:transform 1s cubic-bezier(.4,.1,.3,1),opacity .4s ease .7s}
.poem-couplet-game .pc-shutter[data-side=l]{left:10.68%;transform-origin:0 50%}
.poem-couplet-game .pc-shutter[data-side=r]{left:50.33%;transform-origin:100% 50%}
.poem-couplet-game .pc-shutter img{display:block;width:100%;height:100%}
.poem-couplet-game .pc-window:not(.is-open):not(:disabled){animation:poem-couplet-glow 1.8s ease-in-out infinite}
.poem-couplet-game .pc-window:not(.is-open):hover:not(:disabled) [data-side=l]{transform:rotateY(-14deg)}
.poem-couplet-game .pc-window:not(.is-open):hover:not(:disabled) [data-side=r]{transform:rotateY(14deg)}
.poem-couplet-game .pc-window.is-open [data-side=l]{transform:rotateY(-72deg);opacity:0}
.poem-couplet-game .pc-window.is-open [data-side=r]{transform:rotateY(72deg);opacity:0}
.poem-couplet-game .pc-glow{position:absolute;left:73.2%;top:35.5%;width:13%;aspect-ratio:1;transform:translate(-50%,-50%) scale(.6);border-radius:50%;background:radial-gradient(closest-side,#ffffffcc,#fff8e080 45%,#fff8e000);opacity:0;pointer-events:none;transition:opacity .6s ease .3s,transform .9s ease .3s}
.poem-couplet-game .pc-glow.is-on{opacity:1;transform:translate(-50%,-50%)}

/* Round 4: row the boat in along the dashed route, then pull its rope to the post (泊). */
.poem-couplet-game .pc-route{position:absolute;inset:0;width:100%;height:100%;opacity:0;pointer-events:none;transition:opacity .5s ease}
.poem-couplet-game .pc-route.is-on{opacity:1}
.poem-couplet-game .pc-route path{fill:none;stroke:#fffdf4e6;stroke-width:3;stroke-dasharray:4 10;stroke-linecap:round;vector-effect:non-scaling-stroke;filter:drop-shadow(0 0 1px #2c3f4a99)}
.poem-couplet-game .pc-boat{position:absolute;left:var(--bx,88.75%);top:var(--by,75.1%);width:calc(23.75cqw*var(--bs,.09));height:calc(17.22cqw*var(--bs,.09));padding:0;border:0;background:none;transform:translate(-50%,-100%);touch-action:none;cursor:grab;transition:opacity .5s ease,visibility 0s}
.poem-couplet-game .pc-boat::before{content:'';position:absolute;left:50%;top:50%;width:max(100%,52px);height:max(100%,52px);transform:translate(-50%,-50%);border-radius:30%}
.poem-couplet-game .pc-boat img{display:block;width:100%;height:100%;filter:drop-shadow(0 3px 3px #1d2b3355)}
.poem-couplet-game .pc-boat:not(:disabled)::after{content:'';position:absolute;left:50%;top:50%;width:max(130%,60px);height:max(130%,60px);transform:translate(-50%,-50%);border:2.5px dashed #fffdf4;border-radius:50%;pointer-events:none;animation:poem-couplet-call 1.7s ease-in-out infinite}
.poem-couplet-game .pc-boat.is-held{cursor:grabbing}
.poem-couplet-game .pc-boat:disabled{cursor:default}
.poem-couplet-game .pc-post{position:absolute;left:94.06%;top:82.2%;width:3.3cqw;height:9.375cqw;padding:0;border:0;background:none;transform:translateX(-50%);cursor:pointer;transition:opacity .5s ease,visibility 0s}
.poem-couplet-game .pc-post::before{content:'';position:absolute;left:50%;top:50%;width:max(100%,48px);height:max(100%,48px);transform:translate(-50%,-50%)}
.poem-couplet-game .pc-post img{display:block;width:100%;height:100%;filter:drop-shadow(1px 3px 2px #1d2b3355)}
.poem-couplet-game .pc-post:disabled{cursor:default}
.poem-couplet-game .pc-rope{position:absolute;inset:0;width:100%;height:100%;opacity:0;pointer-events:none;transition:opacity .4s ease}
.poem-couplet-game .pc-rope.is-on{opacity:1}
.poem-couplet-game .pc-rope path{fill:none;stroke:#8a6a3c;stroke-width:4;stroke-linecap:round;vector-effect:non-scaling-stroke;filter:drop-shadow(0 1px 0 #3b2a1a80)}
.poem-couplet-game .pc-knob{position:absolute;left:86.125%;top:88.11%;width:48px;height:48px;padding:0;border:3px solid #fffaf0;border-radius:50%;background:radial-gradient(circle at 40% 35%,#c49a5e,#8a6a3c 70%);box-shadow:0 2px 6px #2a1d1066;transform:translate(-50%,-50%);touch-action:none;cursor:grab;animation:poem-couplet-call 1.7s ease-in-out infinite;transition:opacity .4s ease,visibility 0s}
.poem-couplet-game .pc-knob::after{content:'';position:absolute;inset:11px;border:3px solid #fffaf0cc;border-radius:50%}
.poem-couplet-game .pc-knob.is-held{cursor:grabbing;animation:none}

/* Marks: glow rings, paper tags and colour badges. */
.poem-couplet-game .pc-ring{position:absolute;left:var(--x);top:var(--y);width:var(--w);aspect-ratio:var(--a,1);transform:translate(-50%,-50%) rotate(var(--r,0deg)) scale(.85);border-radius:50%;border:2.5px dashed #fffaeef2;background:radial-gradient(closest-side,#fff8e400,#fff8e426);box-shadow:0 0 0 2px #4a332040,0 0 16px 5px #ffdb8a55;opacity:0;pointer-events:none;transition:opacity .5s ease,transform .5s cubic-bezier(.3,1.4,.5,1)}
.poem-couplet-game .pc-ring.is-on{opacity:1;transform:translate(-50%,-50%) rotate(var(--r,0deg));animation:poem-couplet-call 1.8s ease-in-out infinite}
.poem-couplet-game .pc-tag{position:absolute;left:var(--x);top:var(--y);padding:2px 11px;border-radius:999px;background:#fffaf0f2;color:#7b3e22;font-size:clamp(14px,1.75cqw,20px);font-weight:700;line-height:1.4;letter-spacing:.06em;white-space:nowrap;box-shadow:0 2px 6px #2a1d1033;transform:translate(-50%,-50%) scale(.75);opacity:0;pointer-events:none;transition:opacity .3s ease,transform .3s ease}
.poem-couplet-game .pc-tag.is-on{opacity:1;transform:translate(-50%,-50%);transition:opacity .45s ease var(--d),transform .55s cubic-bezier(.3,1.5,.5,1) var(--d)}
@container (max-width:440px){.poem-couplet-game .pc-tag .pc-more{display:none}}
.poem-couplet-game .pc-badge{position:absolute;left:var(--x);top:var(--y);display:grid;place-items:center;width:clamp(30px,3.4cqw,46px);aspect-ratio:1;border-radius:50%;background:var(--bg);color:var(--fg);border:2.5px solid #fffaf0;box-shadow:0 2px 6px #2a1d1055;font-size:clamp(16px,2cqw,24px);font-weight:700;transform:translate(-50%,-50%) scale(.4);opacity:0;pointer-events:none;transition:opacity .3s ease,transform .3s ease}
.poem-couplet-game .pc-badge.is-on{opacity:1;transform:translate(-50%,-50%);transition:opacity .4s ease var(--d),transform .5s cubic-bezier(.3,1.6,.5,1) var(--d)}
.poem-couplet-game .pc-loading{position:absolute;inset:0;z-index:9;display:grid;align-content:center;justify-items:center;gap:14px;padding:20px;background:#f4f0dfeb;font-size:20px;line-height:1.5;text-align:center}
.poem-couplet-game .pc-loading button{min-height:48px;padding:10px 22px;border:1px solid #97ad9b;border-radius:14px;background:#fffefa;font-weight:600;font-size:19px;cursor:pointer}
/* Elements that belong to another round fade out (kept after the element rules so it wins). */
.poem-couplet-game .is-off{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .5s ease,visibility 0s linear .5s}

/* Side panel: the four lines, the action line and feedback. */
.poem-couplet-game .pc-side{grid-area:side;display:flex;flex-direction:column;gap:12px;min-width:0;container:pc-side/inline-size}
.poem-couplet-game .pc-verse{display:grid;grid-template-columns:repeat(2,max-content);grid-template-rows:repeat(2,auto);grid-auto-flow:column;justify-content:center;column-gap:22px;row-gap:2px;margin:0;padding:8px 12px;border:1px solid #dce5ce;border-radius:16px;background:#f3f6e9}
.poem-couplet-game .pc-line{position:relative;display:flex;margin:0;padding:0 4px;border-radius:10px;color:#3d6a52;font-size:clamp(19px,2.6vw,24px);font-weight:600;line-height:1.55;transition:background .3s}
.poem-couplet-game .pc-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.poem-couplet-game .pc-ch{display:inline-block;width:1.08em;text-align:center;border-radius:5px;transition:color .5s ease,background .5s ease}
.poem-couplet-game .pc-line:not(.is-done) .pc-ch{color:transparent;background:linear-gradient(transparent 82%,#c9d2bb 82%,#c9d2bb 88%,transparent 88%) center/78% 100% no-repeat}
.poem-couplet-game .pc-line.is-now{background:#fbf3d9}
.poem-couplet-game .pc-line.is-now:not(.is-done) .pc-ch{background-image:linear-gradient(transparent 82%,#dcb76a 82%,#dcb76a 88%,transparent 88%)}
.poem-couplet-game .pc-line.is-done .pc-ch:nth-child(3){transition-delay:.06s}.poem-couplet-game .pc-line.is-done .pc-ch:nth-child(4){transition-delay:.12s}.poem-couplet-game .pc-line.is-done .pc-ch:nth-child(5){transition-delay:.18s}.poem-couplet-game .pc-line.is-done .pc-ch:nth-child(6){transition-delay:.24s}.poem-couplet-game .pc-line.is-done .pc-ch:nth-child(7){transition-delay:.3s}.poem-couplet-game .pc-line.is-done .pc-ch:nth-child(8){transition-delay:.36s}
.poem-couplet-game .pc-line.is-reading{color:#294c3b;background:#f2d58f80}
/* Finale: matching words of each couplet share a tint (對仗) and shimmer twice. */
.poem-couplet-game.is-done .pc-ch[data-p="0"]{background:#f6d98a66}
.poem-couplet-game.is-done .pc-ch[data-p="1"]{background:#bfe0c47a}
.poem-couplet-game.is-done .pc-ch[data-p="2"]{background:#f2b8a066}
.poem-couplet-game.is-done .pc-ch[data-p="3"]{background:#b9d3ef80}
.poem-couplet-game.is-done .pc-ch{animation:poem-couplet-shimmer 1.1s ease-in-out .9s 2}
.poem-couplet-game.is-done .pc-ch[data-p="1"]{animation-delay:1.15s}
.poem-couplet-game.is-done .pc-ch[data-p="2"]{animation-delay:1.4s}
.poem-couplet-game.is-done .pc-ch[data-p="3"]{animation-delay:1.65s}
.poem-couplet-game .pc-pair{margin:-4px 0 0;font-size:14px;line-height:1.45;color:#6b7d6f;text-align:center}
.poem-couplet-game .pc-actionline{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.poem-couplet-game .pc-primary{flex:1 1 150px;min-height:52px;padding:10px 20px;border:0;border-radius:16px;background:#446d50;color:#fff!important;font-size:20px;font-weight:650;letter-spacing:.06em;cursor:pointer;box-shadow:0 3px 0 #2f4f39;transition:background .2s,transform .1s}
.poem-couplet-game .pc-primary:hover:not(:disabled,.is-busy){background:#3a5f45}
.poem-couplet-game .pc-primary:active:not(:disabled,.is-busy){transform:translateY(2px);box-shadow:0 1px 0 #2f4f39}
.poem-couplet-game .pc-primary.is-next{background:#b8743a;box-shadow:0 3px 0 #8a5426}
.poem-couplet-game .pc-primary.is-next:hover:not(:disabled,.is-busy){background:#a6662f}
.poem-couplet-game .pc-primary:disabled,.poem-couplet-game .pc-primary.is-busy{opacity:.5;cursor:default}
.poem-couplet-game .pc-notes{display:flex;gap:8px;flex:none}
.poem-couplet-game .pc-note{width:52px;height:52px;padding:0;border:1.5px solid #d9c9a6;border-radius:50%;background:#fffaf0;color:#7b3e22!important;font-size:23px;font-weight:700;cursor:pointer;box-shadow:0 3px 0 #e6dcc4;transition:background .2s,border-color .2s,transform .1s}
.poem-couplet-game .pc-note:hover{border-color:#c98b3a;background:#fff2d6}
.poem-couplet-game .pc-note[aria-pressed=true]{background:#b8743a;border-color:#b8743a;color:#fff!important;box-shadow:0 3px 0 #8a5426}
.poem-couplet-game .pc-listen{flex:none;display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:52px;margin-left:auto;padding:8px 18px;border:1px solid #b9cbae;border-radius:999px;background:#fffef7;color:#356148!important;font-size:18px;font-weight:600;cursor:pointer}
.poem-couplet-game .pc-listen svg{width:22px;height:22px;flex:none;stroke-linecap:round;stroke-linejoin:round}
.poem-couplet-game .pc-listen svg path{fill:none}
.poem-couplet-game .pc-listen.is-busy{opacity:.7;cursor:default}
.poem-couplet-game .pc-feedback{margin:0;min-height:3em;font-size:19px;line-height:1.5;color:#55715a;text-align:center;text-wrap:pretty}

@keyframes poem-couplet-call{50%{box-shadow:0 0 0 4px #ffd27a59,0 0 22px 8px #ffd98a59}}
@keyframes poem-couplet-glow{0%,100%{filter:drop-shadow(0 0 0 #fff2c000)}50%{filter:drop-shadow(0 0 6px #fff2c0) drop-shadow(0 0 2px #ffd36a)}}
@keyframes poem-couplet-arrive{0%{opacity:0;transform:translate(calc(-50% + var(--fx)),calc(-50% + var(--fy))) scale(.7) rotate(-8deg)}15%{opacity:1}70%{transform:translate(calc(-50% + 1cqw),calc(-50% - 2cqw)) scale(1.05) rotate(4deg)}100%{opacity:1;transform:translate(-50%,-50%)}}
@keyframes poem-couplet-flyin{0%{opacity:.3;transform:translate(var(--fx),var(--fy)) scale(.8)}40%{opacity:1}100%{opacity:1;transform:none}}
@keyframes poem-couplet-sing{0%,100%{transform:none}20%{transform:translateY(-6%) rotate(-5deg)}45%{transform:translateY(0) rotate(4deg)}65%{transform:translateY(-4%) rotate(-3deg)}}
@keyframes poem-couplet-chirp{0%{opacity:0;transform:translate(-50%,10%) scale(.6)}25%,75%{opacity:1;transform:translate(-50%,0) scale(1)}100%{opacity:0;transform:translate(-50%,-30%) scale(1)}}
@keyframes poem-couplet-shimmer{50%{box-shadow:0 0 0 2px #fffaf0,0 0 12px 3px #f2c75c99}}
@keyframes poem-couplet-drift{50%{transform:translateX(-2%) scale(1.04)}}

/* Landscape: picture on the left, verse and actions on the right. */
@media (orientation:landscape) and (min-width:701px),(orientation:landscape) and (max-height:500px){
 .poem-couplet-game{max-width:1280px}
 .poem-couplet-game .pc-layout{grid-template-columns:minmax(0,1.7fr) minmax(270px,1fr);grid-template-rows:auto minmax(0,1fr);grid-template-areas:"stage head" "stage side";column-gap:22px;row-gap:12px;align-items:center}
 .poem-couplet-game .pc-stage{width:min(100%,calc((100cqh - 24px) * 16 / 9));align-self:start}
 .poem-couplet-game .pc-head{align-self:end;align-items:flex-start}
 .poem-couplet-game .pc-side{align-self:start}
 .poem-couplet-game .pc-verse{grid-template-columns:max-content;grid-template-rows:none;grid-auto-flow:row;row-gap:0;padding:8px 14px}
 .poem-couplet-game .pc-line{font-size:clamp(17px,1.9vw,25px)}
}
@media (orientation:landscape) and (min-width:1100px) and (min-height:700px){
 .poem-couplet-game .pc-instruction{font-size:26px}
 .poem-couplet-game .pc-feedback{font-size:20px}
}
/* A narrow side column keeps the four note chips and 聽全詩 on one line. */
@container pc-side (max-width:360px){
 .poem-couplet-game .pc-notes{gap:6px}
 .poem-couplet-game .pc-note{width:46px;height:46px;font-size:21px}
 .poem-couplet-game .pc-listen{padding:8px 13px;font-size:17px}
}
@media (orientation:landscape) and (max-height:500px){
 .poem-couplet-game .pc-layout{grid-template-columns:minmax(0,1.45fr) minmax(250px,1fr);column-gap:14px;row-gap:4px}
 .poem-couplet-game .pc-stage{border-radius:14px;width:min(100%,calc((100cqh - 8px) * 16 / 9))}
 .poem-couplet-game .pc-head{gap:8px}
 .poem-couplet-game .pc-instruction{min-height:2.7em;font-size:17px;line-height:1.35}
 .poem-couplet-game .pc-progress{min-width:52px;padding:3px 8px;font-size:15px}
 .poem-couplet-game .pc-side{gap:4px}
 .poem-couplet-game .pc-verse{padding:3px 8px;border-radius:12px}
 .poem-couplet-game .pc-line{font-size:17px;line-height:1.45}
 .poem-couplet-game:not(.is-done) .pc-line:not(.is-now){display:none}
 .poem-couplet-game.is-done .pc-verse{grid-template-columns:repeat(2,max-content);grid-template-rows:repeat(2,auto);grid-auto-flow:column;column-gap:10px}
 .poem-couplet-game.is-done .pc-line{font-size:15px;padding:0 2px}
 .poem-couplet-game.is-done .pc-instruction{min-height:0}
 .poem-couplet-game.is-done .pc-progress{display:none}
 .poem-couplet-game .pc-pair{display:none}
 .poem-couplet-game .pc-primary{min-height:44px;padding:5px 12px;font-size:17px;flex-basis:100px}
 .poem-couplet-game .pc-note{width:44px;height:44px;font-size:19px}
 .poem-couplet-game .pc-notes{gap:6px}
 .poem-couplet-game .pc-listen{min-height:44px;padding:5px 12px;font-size:15px}
 .poem-couplet-game .pc-feedback{font-size:15px;line-height:1.4;min-height:2.8em;text-align:left}
}
/* Phones held upright: a 4:3 window onto the painting that pans to each round's part of the picture. */
@media (orientation:portrait) and (max-width:700px){
 .poem-couplet-game .pc-stage{aspect-ratio:4/3}
 .poem-couplet-game .pc-world{width:133.333%;left:calc(var(--pan,0) * -33.333%);transition:left .8s cubic-bezier(.4,.1,.3,1)}
}
@media (max-width:420px){
 .poem-couplet-game .pc-layout{gap:10px}
 .poem-couplet-game .pc-instruction{font-size:19px}
 .poem-couplet-game .pc-progress{min-width:56px;padding:4px 8px;font-size:16px}
 .poem-couplet-game .pc-stage{border-radius:15px}
 .poem-couplet-game .pc-side{gap:10px}
 .poem-couplet-game .pc-verse{column-gap:12px;padding:6px 8px}
 .poem-couplet-game .pc-line{font-size:19px;padding:0 2px}
 .poem-couplet-game .pc-primary{font-size:19px;padding:10px 14px}
 .poem-couplet-game .pc-notes{gap:6px}
 .poem-couplet-game .pc-note{width:48px;height:48px;font-size:21px}
 .poem-couplet-game .pc-listen{padding:8px 14px;font-size:17px}
 .poem-couplet-game .pc-feedback{font-size:17px;text-align:left}
}
@media (max-width:370px){
 .poem-couplet-game .pc-line{font-size:17px}
 .poem-couplet-game .pc-listen span{font-size:16px}
}
/* Reduced motion: everything jumps to its end state; cues keep a still glow instead of pulsing. */
.poem-couplet-game.is-reduced *,.poem-couplet-game.is-reduced *::before,.poem-couplet-game.is-reduced *::after{animation:none!important;transition:none!important}
.poem-couplet-game.is-reduced .pc-bird.is-cue img,.poem-couplet-game.is-reduced .pc-egret:not(:disabled) img,.poem-couplet-game.is-reduced .pc-window:not(.is-open):not(:disabled){filter:drop-shadow(0 0 5px #fff2c0) drop-shadow(0 0 2px #ffd36a)}
.poem-couplet-game.is-reduced .pc-bird.is-sing .pc-chirp{opacity:1;transform:translate(-50%,0)}
@media (prefers-reduced-motion:reduce){
 .poem-couplet-game *,.poem-couplet-game *::before,.poem-couplet-game *::after{animation:none!important;transition:none!important}
 .poem-couplet-game .pc-bird.is-cue img,.poem-couplet-game .pc-egret:not(:disabled) img,.poem-couplet-game .pc-window:not(.is-open):not(:disabled){filter:drop-shadow(0 0 5px #fff2c0) drop-shadow(0 0 2px #ffd36a)}
 .poem-couplet-game .pc-bird.is-sing .pc-chirp{opacity:1;transform:translate(-50%,0)}
}

/* poem-games/shoe-market.css */
.poem-shoe-game{--sm-ink:#34433a;--sm-mute:#6b6650;--sm-red:#b3442e;--sm-green:#4d6c4c;--sm-wood:#7b5934;--sm-edge:#e2d0aa;width:100%;max-width:1120px;margin-inline:auto;min-width:0;color:var(--sm-ink);font-family:inherit;display:flex;flex-direction:column;justify-content:center}
.poem-shoe-game *{box-sizing:border-box}
.poem-shoe-game [hidden]{display:none!important}
.poem-shoe-game button{font-family:inherit;color:inherit;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.poem-shoe-game button:disabled{cursor:default;opacity:1}
.poem-shoe-game button:focus-visible{outline:3px solid #c48a3c;outline-offset:3px}
.poem-shoe-game img{user-select:none;-webkit-user-select:none;-webkit-user-drag:none}
.poem-shoe-game .sm-frame{display:grid;grid-template-areas:"head" "stage" "side";gap:12px;min-width:0}
.poem-shoe-game .sm-head{grid-area:head;display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0}
.poem-shoe-game .sm-say{margin:0;font-size:clamp(18px,2.3vw,23px);font-weight:650;line-height:1.45;text-wrap:pretty}
.poem-shoe-game :is(.sm-say,.sm-moral>p,.sm-moral>small,.sm-feedback) span{display:inline-block}
.poem-shoe-game .sm-progress{flex:none;min-width:62px;padding:5px 11px;border-radius:18px;background:#f2e7cf;color:var(--sm-wood);font-size:18px;font-weight:600;text-align:center;font-variant-numeric:tabular-nums}

/* Picture stage: the four user paintings cross-fade; overlays sit on painted objects. */
.poem-shoe-game .sm-stage{grid-area:stage;position:relative;isolation:isolate;container-type:inline-size;width:100%;aspect-ratio:16/9;overflow:hidden;border-radius:20px;background:#eadcbf;border:1px solid #dccaa4;box-shadow:0 8px 24px #4b361a14;font-family:var(--sans)}
.poem-shoe-game .sm-scene{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .7s ease;pointer-events:none}
.poem-shoe-game .sm-scene.is-on{opacity:1}
.poem-shoe-game .sm-patch{position:absolute;left:23.0625%;top:50.667%;width:19.3125%;height:7.889%;opacity:0;transition:opacity .9s ease;pointer-events:none;z-index:1}
.poem-shoe-game .sm-patch.is-on{opacity:1}
.poem-shoe-game .sm-prints{position:absolute;left:38.6%;top:82.6%;width:19%;height:17%;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(closest-side,#fff7d895,#fff4cc3a 62%,transparent);opacity:0;transition:opacity .6s;pointer-events:none;z-index:1}
.poem-shoe-game .sm-mark{position:absolute;left:36.75%;top:53.67%;width:clamp(9px,1.5cqi,15px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 35% 35%,#e4775f,#a5321f 72%);box-shadow:0 0 0 2px #fff5e2c0,0 2px 3px #0005;transform:translate(-50%,-50%);opacity:0;transition:opacity .5s .5s;pointer-events:none;z-index:2}
.poem-shoe-game .sm-mark::after{content:'';position:absolute;left:44%;top:78%;width:2px;height:130%;border-radius:2px;background:#a5321f;transform:rotate(16deg);transform-origin:top}
.poem-shoe-game .sm-prints.is-on,.poem-shoe-game .sm-mark.is-on{opacity:1}
.poem-shoe-game .sm-seat,.poem-shoe-game .sm-knock{position:absolute;z-index:4;transform:translate(-50%,-50%);min-width:44px;min-height:44px;padding:0;border:2px dashed #fff8e2;background:#fff4d02e;box-shadow:0 0 0 1px #7b593440,0 0 22px #fff3c770;transition:background .25s,box-shadow .25s}
.poem-shoe-game .sm-seat{left:33%;top:54.5%;width:31%;height:15%;border-radius:46%}
.poem-shoe-game .sm-knock{left:80.5%;top:37%;width:22%;height:34%;border-radius:18px;display:grid;place-items:center}
.poem-shoe-game .sm-seat span,.poem-shoe-game .sm-knock span{padding:.25em .7em;border-radius:12px;background:#fffaf0ee;color:#6b4a2b;font-size:clamp(14px,2.6cqi,18px);font-weight:650;white-space:nowrap;box-shadow:0 2px 6px #3b2a1426}
.poem-shoe-game .sm-knock span{padding-inline:.5em}
.poem-shoe-game .sm-seat span{position:absolute;left:50%;top:-5px;transform:translate(-50%,-100%)}
.poem-shoe-game .sm-seat:not(:disabled),.poem-shoe-game .sm-knock:not(:disabled){animation:sm-call 2.4s ease-in-out infinite}
.poem-shoe-game .sm-seat.is-ready,.poem-shoe-game .sm-seat.is-over,.poem-shoe-game .sm-seat:hover:not(:disabled),.poem-shoe-game .sm-knock:hover:not(:disabled){background:#fff3c85e;border-style:solid;box-shadow:0 0 0 3px #fff8e2b0,0 0 28px #ffeeb0}
.poem-shoe-game .sm-sign{position:absolute;left:80.5%;top:34%;z-index:3;transform:translate(-50%,-50%) rotate(-3deg);padding:.3em .7em .3em .9em;font-size:clamp(14px,3.6cqi,28px);font-weight:700;letter-spacing:.22em;color:#6d3a22;background:linear-gradient(#f4e5c4,#e5cc9b);border:1px solid #b88b55;border-radius:6px;box-shadow:0 5px 12px #2a180a45;opacity:0;transition:opacity .4s;pointer-events:none}
.poem-shoe-game .sm-sign.is-on{opacity:1}
.poem-shoe-game .sm-bubble{position:absolute;z-index:5;margin:0;padding:.42em .78em;border-radius:14px;background:#fffaf0f2;border:1px solid #e4d2ad;color:#3e3224;font-size:clamp(14px,2.9cqi,22px);font-weight:650;line-height:1.3;white-space:nowrap;box-shadow:0 4px 12px #3b2a1426;opacity:0;transform:translateY(6px);transition:opacity .4s ease,transform .4s ease;pointer-events:none}
.poem-shoe-game .sm-bubble.is-on{opacity:1;transform:none}
.poem-shoe-game .sm-bubble::after{content:'';position:absolute;width:11px;height:11px;background:#fffaf0;border:1px solid #e4d2ad;border-top:0;border-left:0}
.poem-shoe-game .is-forgot{right:57%;top:5%}.poem-shoe-game .is-forgot::after{right:-6px;top:58%;transform:rotate(-45deg)}
.poem-shoe-game .is-seller{right:16%;top:17%}.poem-shoe-game .is-seller::after{right:-6px;top:24%;transform:rotate(-45deg)}
.poem-shoe-game .is-ask{left:5%;top:10%}.poem-shoe-game .is-ask::after{right:22%;bottom:-6px;transform:rotate(45deg)}
.poem-shoe-game .is-stubborn{left:69%;top:36%}.poem-shoe-game .is-stubborn::after{left:-6px;top:30%;transform:rotate(135deg)}
/* Tagging board: two cropped story pictures (home, market) with dashed drop spots on painted objects.
   A canvas is the whole 1600x900 scene scaled so that --cw source px fill the pane, shifted by --cx/--cy. */
.poem-shoe-game .sm-board{position:absolute;inset:0;z-index:6;background:#eadcbf;opacity:0;visibility:hidden;transition:opacity .5s,visibility 0s .5s}
.poem-shoe-game .sm-board.is-on{opacity:1;visibility:visible;transition:opacity .5s}
.poem-shoe-game .sm-pane{position:absolute;top:0;height:100%;overflow:hidden;container:sm-pane/size}
.poem-shoe-game .sm-pane.is-home{left:0;width:58%;--cx:110;--cy:90;--cw:835}
.poem-shoe-game .sm-pane.is-market{left:58%;width:42%;--cx:928;--cy:0;--cw:672}
.poem-shoe-game .sm-pane.is-market::before{content:'';position:absolute;left:0;top:0;bottom:0;z-index:4;width:4px;background:#f6ecd6;box-shadow:0 0 6px #3b2a1440;pointer-events:none}
.poem-shoe-game .sm-canvas{position:absolute;left:0;top:0;width:calc(100% * 1600 / var(--cw));aspect-ratio:16/9;translate:calc(-100% * var(--cx) / 1600) calc(-100% * var(--cy) / 900)}
.poem-shoe-game .sm-pic{display:block;width:100%;height:100%;pointer-events:none}
.poem-shoe-game .sm-place{position:absolute;bottom:8px;left:12px;z-index:5;padding:2px 10px;border-radius:12px;background:#fffaf0e6;color:#6b4a2b;font-size:14px;font-weight:700;letter-spacing:.12em;box-shadow:0 2px 6px #3b2a1426;pointer-events:none}
.poem-shoe-game .sm-spot{--px:calc(100cqw / var(--cw));position:absolute;z-index:2;min-width:44px;min-height:44px;padding:0;border:0;border-radius:14px;background:none;transform:translate(-50%,-50%);touch-action:manipulation}
.poem-shoe-game .sm-spot[data-sm-spot=ruler]{z-index:3}
.poem-shoe-game .sm-spot svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;fill:#fff4d014;stroke:#fff8e2;stroke-width:2.5;stroke-dasharray:8 6;stroke-linejoin:round;filter:drop-shadow(0 0 2px #3b2a14b0);transition:fill .2s,stroke .2s}
.poem-shoe-game .sm-spot svg *{vector-effect:non-scaling-stroke}
.poem-shoe-game .sm-spot:focus-visible{outline-offset:-3px}
.poem-shoe-game.is-picking .sm-spot:not(:disabled) svg{fill:#fff4d03a;animation:sm-glow 1.8s ease-in-out infinite}
.poem-shoe-game .sm-spot.is-over svg{fill:#fff3c870;stroke-dasharray:none;stroke-width:3.5}
@media (hover:hover){.poem-shoe-game .sm-spot:hover:not(:disabled) svg{fill:#fff3c870;stroke-dasharray:none;stroke-width:3.5}}
.poem-shoe-game .sm-spot.is-hint svg{stroke:#ffd76a;stroke-width:4.5;stroke-dasharray:none;fill:#ffe08a50;animation:sm-glow .9s ease-in-out infinite}
.poem-shoe-game .sm-spot.is-no svg{stroke:#f3a58e;fill:#b3442e33;stroke-dasharray:none}
.poem-shoe-game .sm-spot.is-no{animation:sm-shake .45s ease}
.poem-shoe-game .sm-spot.is-filled{pointer-events:none}
.poem-shoe-game .sm-spot.is-filled svg{fill:none;stroke:#e9f4dc;stroke-dasharray:none;stroke-width:2;opacity:.85;animation:none}
/* The foot spot is a small picture of the measuring, reusing the measure-step art. */
.poem-shoe-game .sm-vig{left:3%;top:4%;width:40%;aspect-ratio:1600/860;transform:none;z-index:3;border-radius:12px;border:2.5px dashed #fff8e2;background:radial-gradient(120% 95% at 38% 30%,#fffbf2,#f0e2c4);box-shadow:0 0 0 1px #7b593450,0 6px 14px #3b2a1440;transition:border-color .2s,box-shadow .2s}
.poem-shoe-game .sm-vig-art{position:absolute;inset:0;overflow:hidden;border-radius:inherit;pointer-events:none}
.poem-shoe-game .sm-vig-foot{position:absolute;left:0;top:-20.93%;width:75%;height:105.465%}
.poem-shoe-game .sm-vig-ruler{position:absolute;left:6.5%;top:84.77%;width:91%;height:10.78%;filter:drop-shadow(0 1px 1px #4b361a40)}
.poem-shoe-game .sm-vig-art::after{content:'';position:absolute;left:74.94%;top:5%;bottom:12%;border-left:2px dashed #b3442eb0}
.poem-shoe-game .sm-vig-art i{position:absolute;left:74.94%;top:90.14%;width:9px;height:9px;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle at 35% 35%,#e4775f,#a5321f 72%);box-shadow:0 0 0 2px #fff7e6}
.poem-shoe-game.is-picking .sm-vig:not(:disabled){animation:sm-call 1.8s ease-in-out infinite}
.poem-shoe-game .sm-vig.is-over{border-style:solid;box-shadow:0 0 0 3px #fff8e2b0,0 0 24px #ffeeb0}
@media (hover:hover){.poem-shoe-game .sm-vig:hover:not(:disabled){border-style:solid;box-shadow:0 0 0 3px #fff8e2b0,0 0 24px #ffeeb0}}
.poem-shoe-game .sm-vig.is-hint{border:3.5px solid #ffd76a;animation:sm-call .9s ease-in-out infinite}
.poem-shoe-game .sm-vig.is-no{border-color:#e9a08a}
.poem-shoe-game .sm-vig.is-filled{border:2px solid #cfe6b8}
/* A pinned tag pops in next to its spot. The phrase line only shows when the pane is tall enough. */
.poem-shoe-game .sm-pin{position:absolute;z-index:4;display:grid;justify-items:center;gap:2px;pointer-events:none;opacity:0;scale:.5;transition:opacity .2s,scale .4s cubic-bezier(.3,1.7,.5,1)}
.poem-shoe-game .is-filled>.sm-pin{opacity:1;scale:1}
.poem-shoe-game .sm-chip{display:flex;align-items:baseline;gap:.28em;padding:.16em .6em .2em;border-radius:10px;background:#fffaf0f5;border:2px solid #c9a46a;color:#4a3420;font-size:15px;font-weight:650;line-height:1.3;white-space:nowrap;box-shadow:0 3px 8px #2a180a50}
.poem-shoe-game .sm-pin.is-du .sm-chip{border-color:#8fae7c}
.poem-shoe-game .sm-chip b{font-size:1.3em;line-height:1;color:var(--sm-red)}
.poem-shoe-game .sm-chip i{font-style:normal;font-weight:500;color:#8a6a45}
.poem-shoe-game .sm-pin small{display:none;padding:.1em .55em;border-radius:8px;background:#3b2a14d0;color:#fffaf0;font-size:14px;line-height:1.4;white-space:nowrap}
.poem-shoe-game .sm-pin small b{color:#ffc95c;font-weight:800}
@container sm-pane (min-height:270px){.poem-shoe-game .sm-pin small{display:block}}
.poem-shoe-game [data-sm-spot=foot]>.sm-pin{left:calc(100% + 6px);top:50%;translate:0 -50%;justify-items:start}
.poem-shoe-game [data-sm-spot=ruler]>.sm-pin{left:50%;bottom:calc(50% + var(--px) * 34 + 3px);translate:-50% 0}
.poem-shoe-game [data-sm-spot=seat]>.sm-pin{left:30%;top:88%;translate:-50% 0}
.poem-shoe-game [data-sm-spot=stall]>.sm-pin{left:62%;bottom:92%;translate:-50% 0}
.poem-shoe-game .sm-loading{position:absolute;inset:0;z-index:20;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:16px;text-align:center;background:#f7f0dfe8;color:#5b5140;font-size:19px}
.poem-shoe-game .sm-loading button{min-height:48px;padding:8px 20px;border:1px solid #cdb98f;border-radius:16px;background:#fffaf0;font-size:19px;color:#5b4126}

/* Work panel */
.poem-shoe-game .sm-side{grid-area:side;display:flex;flex-direction:column;gap:10px;min-width:0}
.poem-shoe-game .sm-panel{display:flex;flex-direction:column;gap:12px;padding:14px;border-radius:20px;background:#fbf5e6;border:1px solid #ecdfc2;min-width:0}
.poem-shoe-game .sm-text{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px 12px}
.poem-shoe-game .sm-line{margin:0;flex:1 1 240px;font-size:clamp(18px,2vw,21px);line-height:1.6;letter-spacing:.03em;color:#3c4537;text-wrap:pretty}
.poem-shoe-game .sm-line b{color:var(--sm-red);font-weight:700}
.poem-shoe-game .sm-line span{white-space:nowrap}
.poem-shoe-game .sm-gloss{display:inline-flex;align-items:center;gap:7px;min-height:44px;padding:5px 13px;border-radius:22px;border:1px solid #e0cba2;background:#fffaf0;color:#5d4429;font-size:17px;box-shadow:0 2px 0 #eadcbc}
.poem-shoe-game .sm-gloss b{font-size:23px;line-height:1;color:var(--sm-red)}
.poem-shoe-game .sm-gloss i{font-style:normal;color:#8a6a45}
.poem-shoe-game .sm-gloss svg{width:19px;height:19px;flex:none;color:#8a6a45}
.poem-shoe-game .sm-measure,.poem-shoe-game .sm-fit{position:relative;width:100%;max-width:560px;align-self:center;overflow:hidden;border-radius:16px;border:1px solid #eadbbb;background:radial-gradient(120% 95% at 38% 30%,#fffbf2,#f0e2c4)}
.poem-shoe-game .sm-measure::before,.poem-shoe-game .sm-fit::before{content:'';position:absolute;inset:0 0 auto;height:24%;z-index:1;pointer-events:none;background:linear-gradient(#fcf6ea,#fcf6ea00)}
.poem-shoe-game .sm-measure{--knot:40%;aspect-ratio:1600/860}
.poem-shoe-game .sm-measure .sm-foot{position:absolute;left:0;top:-20.93%;width:75%;height:105.465%;pointer-events:none}
.poem-shoe-game .sm-guide{position:absolute;left:var(--knot);top:5%;bottom:12%;z-index:2;border-left:2px dashed #b3442eb0;transform:translateX(-1px);pointer-events:none}
.poem-shoe-game .sm-track{position:absolute;left:0;right:0;top:72%;bottom:0;z-index:3;touch-action:none;cursor:pointer}
.poem-shoe-game .sm-ruler{position:absolute;left:6.5%;width:91%;top:45.6%;height:38.5%;pointer-events:none;filter:drop-shadow(0 2px 2px #4b361a40)}
.poem-shoe-game .sm-heel{position:absolute;left:7.75%;top:40%;height:50%;border-left:2px solid #5d4429;pointer-events:none}
.poem-shoe-game .sm-knot{position:absolute;left:var(--knot);top:64.8%;width:44px;height:44px;transform:translate(-50%,-50%);padding:0;border:0;border-radius:50%;background:transparent;display:grid;place-items:center;touch-action:none;cursor:grab}
.poem-shoe-game .sm-knot i{position:relative;width:20px;height:20px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#e4775f,#a5321f 72%);box-shadow:0 0 0 3px #fff7e6,0 3px 6px #0005}
.poem-shoe-game .sm-knot i::before,.poem-shoe-game .sm-knot i::after{content:'';position:absolute;left:46%;top:82%;width:2px;height:14px;border-radius:2px;background:#a5321f;transform:rotate(22deg);transform-origin:top}
.poem-shoe-game .sm-knot i::after{transform:rotate(-14deg)}
.poem-shoe-game .sm-card{position:relative;display:grid;justify-items:center;gap:8px;width:min(100%,460px);align-self:center;padding:18px 18px 10px;border-radius:18px;border:1.5px solid var(--sm-edge);background:#fffaf0;box-shadow:0 4px 0 #e8dbbd;touch-action:none;transition:transform .2s,box-shadow .2s}
.poem-shoe-game .sm-rule{position:relative;display:block;width:100%}
.poem-shoe-game .sm-rule img{display:block;width:100%;height:auto;pointer-events:none;filter:drop-shadow(0 2px 2px #4b361a40)}
.poem-shoe-game .sm-rule i{position:absolute;left:75.2%;top:50%;width:16px;height:16px;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle at 35% 35%,#e4775f,#a5321f 72%);box-shadow:0 0 0 2px #fff7e6,0 2px 4px #0005}
.poem-shoe-game .sm-card>span:last-child{font-size:17px;color:var(--sm-wood);font-weight:600}
.poem-shoe-game .sm-card[aria-pressed=true]{border-color:var(--sm-green);box-shadow:0 0 0 3px #b9cfa9,0 8px 16px #3b2a1426;transform:translateY(-3px)}
.poem-shoe-game .is-dragging{position:relative;z-index:40;transition:none!important;cursor:grabbing;box-shadow:0 12px 26px #3b2a1445!important;opacity:.94}
.poem-shoe-game .sm-ask{display:grid;gap:10px}
.poem-shoe-game .sm-ask p{margin:0;font-size:19px;font-weight:600;text-align:center}
.poem-shoe-game .sm-ask div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.poem-shoe-game .sm-ask button{min-height:58px;padding:10px 12px;border-radius:16px;border:1.5px solid #dccaa2;background:#fffaf0;color:#4a3a26;font-size:20px;font-weight:650;line-height:1.3;box-shadow:0 3px 0 #e6d8b8}
.poem-shoe-game .sm-ask button:hover:not(:disabled){background:#fff4dc}
.poem-shoe-game .sm-ask button.is-picked{background:#eef3e4;border-color:var(--sm-green);color:#2f5134}
.poem-shoe-game .sm-ask button:disabled:not(.is-picked){opacity:.55}
.poem-shoe-game .sm-fitting{display:grid;gap:10px}
.poem-shoe-game .sm-fit{justify-self:center;aspect-ratio:1600/950;transition:box-shadow .2s}
.poem-shoe-game .sm-fit.is-over{box-shadow:0 0 0 3px #e4c68a}
.poem-shoe-game .sm-fit .sm-foot{position:absolute;left:0;top:-18.947%;width:75%;height:95.474%;pointer-events:none}
.poem-shoe-game .sm-ground{position:absolute;left:5%;width:72%;top:73%;height:7%;border-radius:50%;background:radial-gradient(closest-side,#5a3f2036,transparent);pointer-events:none;transition:top .35s}
.poem-shoe-game .sm-worn{position:absolute;left:6.383%;top:43.711%;width:73.336%;height:51.19%;opacity:0;transform:translateY(-5%);transition:opacity .35s,transform .35s;pointer-events:none}
.poem-shoe-game .sm-fit:not([data-size=none]) .sm-worn{opacity:1;transform:none}
.poem-shoe-game .sm-fit[data-size=small] .sm-worn{left:19.911%;top:50.884%;width:57.202%;height:39.928%}
.poem-shoe-game .sm-fit[data-size=big] .sm-worn{left:6.041%;top:35.559%;width:91.67%;height:63.988%}
.poem-shoe-game .sm-fit[data-size=right] .sm-ground{top:91%}
.poem-shoe-game .sm-fit[data-size=small] .sm-ground{top:87%;left:16%;width:62%}
.poem-shoe-game .sm-fit[data-size=big] .sm-ground{top:95%;width:92%}
.poem-shoe-game .sm-tray{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.poem-shoe-game .sm-tray button{position:relative;display:flex;align-items:flex-end;justify-content:center;min-height:70px;padding:28px 8px 10px;border-radius:16px;border:1.5px solid var(--sm-edge);background:#fffaf0;box-shadow:0 3px 0 #e8dcc0;touch-action:none}
.poem-shoe-game .sm-tray img{display:block;height:auto;pointer-events:none;filter:drop-shadow(0 2px 2px #3b2a1430)}
.poem-shoe-game .sm-tray .is-big img{width:100%}.poem-shoe-game .sm-tray .is-right img{width:80%}.poem-shoe-game .sm-tray .is-small img{width:62%}
.poem-shoe-game .sm-tray span{position:absolute;left:9px;top:5px;font-size:16px;font-weight:700;color:var(--sm-wood)}
.poem-shoe-game .sm-tray button:hover:not(:disabled){background:#fff4dc}
.poem-shoe-game .sm-tray button.is-on{border-color:var(--sm-green);background:#eef3e4;box-shadow:0 0 0 3px #b9cfa9}
.poem-shoe-game .sm-tags{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.poem-shoe-game .sm-tags button{position:relative;display:grid;place-items:center;min-height:62px;padding:8px 10px 8px 24px;border-radius:8px 16px 16px 8px;border:1.5px solid #dcc296;background:#fffaf0;color:#4a3420;box-shadow:0 3px 0 #e6d8b8;touch-action:none;transition:transform .2s,box-shadow .2s,background .2s}
.poem-shoe-game .sm-tags button::before{content:'';position:absolute;left:10px;top:50%;width:8px;height:8px;margin-top:-4px;border-radius:50%;background:#e9dcc0;box-shadow:inset 0 1px 2px #0003}
.poem-shoe-game .sm-tags .is-du{background:#f4f6ec;border-color:#b5c6a0}
.poem-shoe-game .sm-tags button:hover:not(:disabled){background:#fff4dc}
.poem-shoe-game .sm-tags .sm-face,.poem-shoe-game .sm-tags .sm-used{grid-area:1/1}
.poem-shoe-game .sm-face{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:center;column-gap:.35em;font-size:19px;font-weight:650;line-height:1.3}
.poem-shoe-game .sm-face b{font-size:27px;line-height:1;color:var(--sm-red)}
.poem-shoe-game .sm-face i{font-style:normal;font-weight:500;font-size:17px;color:#8a6a45}
.poem-shoe-game .sm-used{visibility:hidden;font-size:17px;font-weight:600;letter-spacing:.04em;color:#5f7a52}
.poem-shoe-game .sm-used b{color:var(--sm-red)}
.poem-shoe-game .sm-tags button.is-used{border-style:dashed;background:transparent;box-shadow:none}
.poem-shoe-game .sm-tags button.is-used::before{visibility:hidden}
.poem-shoe-game .is-used .sm-face{visibility:hidden}.poem-shoe-game .is-used .sm-used{visibility:visible}
.poem-shoe-game .sm-tags button[aria-pressed=true]{border-color:var(--sm-green);background:#eef3e4;box-shadow:0 0 0 3px #b9cfa9;transform:translateY(-3px)}
.poem-shoe-game .sm-tags button.is-return{z-index:40;animation:sm-return .36s cubic-bezier(.3,1.35,.5,1)}
.poem-shoe-game .sm-feedback b{color:var(--sm-red)}
.poem-shoe-game .sm-moral{display:grid;justify-items:center;gap:8px;padding:4px;text-align:center}
.poem-shoe-game .sm-moral>img{width:min(68%,300px);height:auto;filter:drop-shadow(0 2px 2px #4b361a40)}
.poem-shoe-game .sm-moral>b{font-size:24px;letter-spacing:.12em;color:#6d3a22}
.poem-shoe-game .sm-moral>p{margin:0;font-size:20px;line-height:1.55;text-wrap:balance}
.poem-shoe-game .sm-moral>small{font-size:16px;line-height:1.55;color:var(--sm-mute);text-wrap:pretty}
.poem-shoe-game .sm-bonus{display:grid;gap:6px;width:100%;margin-top:4px;padding-top:10px;border-top:1px dashed #dccaa4}
.poem-shoe-game .sm-bonus>p{margin:0;font-size:16px;color:var(--sm-mute)}
.poem-shoe-game .sm-flips{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.poem-shoe-game .sm-flip{min-height:66px;padding:0;border:0;background:none;perspective:600px}
.poem-shoe-game .sm-flip-in{display:grid;height:100%;transform-style:preserve-3d;transition:transform .5s ease}
.poem-shoe-game .sm-flip.is-flipped .sm-flip-in{transform:rotateY(180deg)}
.poem-shoe-game .sm-front,.poem-shoe-game .sm-back{grid-area:1/1;display:grid;place-items:center;align-content:center;gap:1px;padding:6px 8px;border-radius:14px;border:1.5px solid #dcc296;background:#fffaf0;box-shadow:0 3px 0 #e6d8b8;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.poem-shoe-game .sm-back{transform:rotateY(180deg);background:#eef3e4;border-color:#a9c098}
.poem-shoe-game .sm-flip b{font-size:25px;line-height:1.1;color:var(--sm-red)}
.poem-shoe-game .sm-back>span{font-size:18px;font-weight:600}
.poem-shoe-game .sm-back>span b{margin-inline:.2em}
.poem-shoe-game .sm-flip small{font-size:15px;line-height:1.35;color:#6b5a40}
.poem-shoe-game .sm-flip small b{font-size:inherit}
.poem-shoe-game .sm-flip:hover:not(:disabled) .sm-front{background:#fff4dc}
.poem-shoe-game .sm-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.poem-shoe-game .sm-actions button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:10px 18px;border-radius:16px;border:1px solid #d9c7a0;background:#fffaf0;color:#4a3a26;font-size:20px;font-weight:600}
.poem-shoe-game .sm-actions svg{width:22px;height:22px;flex:none}
.poem-shoe-game .sm-actions .sm-next{background:var(--sm-green);border-color:var(--sm-green);color:#fffdf2}
.poem-shoe-game .sm-actions button:disabled,.poem-shoe-game .sm-gloss:disabled{opacity:.6}
.poem-shoe-game .sm-feedback{margin:0;min-height:2.9em;font-size:18px;line-height:1.5;text-align:center;color:#5d5a45;text-wrap:pretty}
.poem-shoe-game .is-wiggle{animation:sm-wiggle .45s ease}
@keyframes sm-call{50%{box-shadow:0 0 0 4px #fff8e2a8,0 0 30px #ffeeb0}}
@keyframes sm-wiggle{25%{translate:-5px 0}75%{translate:5px 0}}
@keyframes sm-shake{25%{translate:-4px 0}75%{translate:4px 0}}
@keyframes sm-glow{50%{filter:drop-shadow(0 0 7px #ffeeb0) drop-shadow(0 0 2px #3b2a14b0)}}
@keyframes sm-return{from{translate:var(--dx) var(--dy)}}

@media (min-width:701px) and (orientation:landscape){
  .poem-shoe-game .sm-frame{grid-template-columns:minmax(0,1.3fr) minmax(300px,1fr);grid-template-areas:"head head" "stage side";column-gap:22px;align-items:start}
  .poem-shoe-game .sm-side{gap:8px}
  .poem-shoe-game .sm-text{justify-content:flex-start}
}
@media (max-width:700px){
  .poem-shoe-game .sm-frame{gap:10px}
  .poem-shoe-game .sm-panel{padding:12px;gap:10px}
}
@media (max-width:420px){
  .poem-shoe-game .sm-say{font-size:18px}
  .poem-shoe-game .sm-progress{min-width:54px;padding:4px 8px;font-size:16px}
  .poem-shoe-game .sm-stage{border-radius:15px}
  .poem-shoe-game .sm-panel{padding:10px;border-radius:16px}
  .poem-shoe-game .sm-line{font-size:18px;flex-basis:100%;text-align:center}
  .poem-shoe-game .sm-gloss{font-size:16px}
  .poem-shoe-game .sm-ask button{font-size:19px;padding:8px}
  .poem-shoe-game .sm-actions button{flex:1;font-size:19px;padding:8px 12px}
  .poem-shoe-game .sm-feedback{font-size:17px}
  .poem-shoe-game .sm-tags{gap:8px}
  .poem-shoe-game .sm-tags button{min-height:58px;padding:6px 6px 6px 20px}
  .poem-shoe-game .sm-tags button::before{left:7px}
  .poem-shoe-game .sm-face{font-size:18px}.poem-shoe-game .sm-face b{font-size:24px}.poem-shoe-game .sm-face i{font-size:16px}
  .poem-shoe-game .sm-used{font-size:16px;letter-spacing:0}
}
@media (max-width:370px){
  .poem-shoe-game .sm-say{font-size:17px}
  .poem-shoe-game .sm-line{font-size:17px}
  .poem-shoe-game .sm-tray{gap:7px}
}
@media (max-width:600px) and (orientation:portrait){
  /* Narrow portrait: the two pictures stack so each crop stays big enough to aim at. */
  .poem-shoe-game:is([data-stage=tag],[data-stage=done]) .sm-stage{aspect-ratio:16/18}
  .poem-shoe-game .sm-pane.is-home{width:100%;height:55%;--cx:30;--cy:120;--cw:960}
  .poem-shoe-game .sm-pane.is-market{left:0;top:55%;width:100%;height:45%;--cx:640;--cy:110;--cw:960}
  .poem-shoe-game .sm-pane.is-market::before{right:0;bottom:auto;width:auto;height:4px}
  .poem-shoe-game .sm-vig{width:36%}
}
@media (orientation:landscape) and (max-height:500px){
  /* Short landscape phones: buttons + feedback go under the picture so each column fits the height. */
  .poem-shoe-game .sm-frame{grid-template-columns:minmax(0,1.08fr) minmax(250px,1fr);grid-template-areas:"stage head" "stage panel" "act panel" "fb panel";grid-template-rows:auto auto auto 1fr;column-gap:14px;row-gap:6px;align-items:start}
  .poem-shoe-game .sm-side{display:contents}.poem-shoe-game .sm-panel{grid-area:panel}.poem-shoe-game .sm-actions{grid-area:act}.poem-shoe-game .sm-feedback{grid-area:fb}
  .poem-shoe-game .sm-stage{border-radius:14px}
  .poem-shoe-game .sm-say{font-size:16px;line-height:1.35}
  .poem-shoe-game .sm-progress{min-width:50px;padding:3px 8px;font-size:15px}
  .poem-shoe-game .sm-panel{padding:8px;gap:7px;border-radius:14px}
  .poem-shoe-game .sm-text{gap:4px 8px;justify-content:flex-start}
  .poem-shoe-game .sm-line{flex-basis:100%;font-size:15px;line-height:1.45}
  .poem-shoe-game .sm-gloss{font-size:14px;padding:3px 10px}.poem-shoe-game .sm-gloss b{font-size:19px}
  .poem-shoe-game .sm-measure{max-width:340px}
  .poem-shoe-game .sm-card{padding:12px 12px 6px;gap:4px;width:min(100%,330px)}
  .poem-shoe-game .sm-ask p{font-size:16px}.poem-shoe-game .sm-ask button{min-height:48px;font-size:17px;padding:6px}
  .poem-shoe-game .sm-fitting{grid-template-columns:minmax(0,1fr) 96px;align-items:center;gap:8px}
  .poem-shoe-game .sm-tray{grid-template-columns:1fr;gap:6px}
  .poem-shoe-game .sm-tray button{min-height:46px;align-items:center;padding:5px 6px 5px 26px}.poem-shoe-game .sm-tray span{font-size:15px;top:50%;left:8px;transform:translateY(-50%)}
  .poem-shoe-game .sm-tags{gap:6px}
  .poem-shoe-game .sm-tags button{min-height:48px;padding:4px 6px 4px 20px}.poem-shoe-game .sm-tags button::before{left:7px}
  .poem-shoe-game .sm-face{font-size:16px}.poem-shoe-game .sm-face b{font-size:21px}.poem-shoe-game .sm-face i{font-size:15px}.poem-shoe-game .sm-used{font-size:15px;letter-spacing:0}
  .poem-shoe-game .sm-bonus{gap:4px;padding-top:6px;margin-top:2px}.poem-shoe-game .sm-bonus>p{font-size:14px}
  .poem-shoe-game .sm-flips{gap:6px}.poem-shoe-game .sm-flip{min-height:52px}.poem-shoe-game .sm-flip b{font-size:20px}.poem-shoe-game .sm-back>span{font-size:16px}.poem-shoe-game .sm-flip small{font-size:14px}
  .poem-shoe-game .sm-moral{gap:4px}.poem-shoe-game .sm-moral>img{display:none}.poem-shoe-game .sm-moral>b{font-size:19px}.poem-shoe-game .sm-moral>p{font-size:16px}.poem-shoe-game .sm-moral>small{font-size:14px}
  .poem-shoe-game .sm-actions button{min-height:46px;font-size:17px;padding:6px 14px}
  .poem-shoe-game .sm-feedback{font-size:15px;min-height:0;line-height:1.4}
}
.poem-shoe-game.is-reduced *,.poem-shoe-game.is-reduced *::before,.poem-shoe-game.is-reduced *::after{transition:none!important;animation:none!important}
@media (prefers-reduced-motion:reduce){.poem-shoe-game *,.poem-shoe-game *::before,.poem-shoe-game *::after{transition:none!important;animation:none!important}}

/* poem-games/guest.css */
.poem-guest-game{--gk-ink:#294c3b;--gk-soft:#5f7566;--gk-paper:#fffdf7;--gk-line:#dcd8c8;--gk-gold:#e3a548;display:block;width:100%;max-width:880px;margin-inline:auto;color:var(--gk-ink);font-family:var(--sans);min-width:0}
.poem-guest-game *{box-sizing:border-box}
.poem-guest-game [hidden]{display:none!important}
.poem-guest-game button{font-family:inherit;color:inherit;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.poem-guest-game button:disabled{opacity:1}
.poem-guest-game img{max-width:none}
.poem-guest-game button:focus-visible{outline:3px solid #de9b34;outline-offset:3px}
.poem-guest-game .gk-layout{display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"head" "stage" "side";gap:12px;height:100%;align-content:center}
.poem-guest-game .gk-head{grid-area:head;display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0}
.poem-guest-game .gk-instruction{margin:0;font-size:clamp(19px,2.4vw,24px);font-weight:650;line-height:1.42;text-wrap:balance}
.poem-guest-game .gk-progress{flex:none;min-width:66px;padding:5px 12px;border-radius:18px;background:#edf3e7;color:#3c6447;font-size:18px;font-weight:600;text-align:center;font-variant-numeric:tabular-nums}
.poem-guest-game.is-done .gk-progress{background:#f6e5c8;color:#8a4f24}

/* Stage: three 16:9 scene paintings; every overlay sits in % of the painting. */
.poem-guest-game .gk-stage{grid-area:stage;position:relative;isolation:isolate;container-type:inline-size;width:100%;aspect-ratio:16/9;justify-self:center;overflow:hidden;border-radius:20px;background:#e9e2d2;border:1px solid #d6d2c1;box-shadow:0 6px 20px #2c443114;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.poem-guest-game .gk-scene{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;pointer-events:none;-webkit-user-drag:none;transition:opacity .9s ease}
.poem-guest-game .gk-scene.is-on{opacity:1}
.poem-guest-game .gk-layer{position:absolute;inset:0;z-index:2;visibility:hidden;opacity:0;transition:opacity .5s ease,visibility 0s linear .5s}
.poem-guest-game .gk-layer.is-on{visibility:visible;opacity:1;transition:opacity .6s ease .25s,visibility 0s}
.poem-guest-game .gk-layer img{-webkit-user-drag:none;pointer-events:none}

/* Fallen petals on the flower path. */
.poem-guest-game .gk-pile{position:absolute;left:var(--x);top:var(--y);z-index:3;width:max(44px,9.5%);min-height:44px;aspect-ratio:100/56;padding:0;border:0;border-radius:40%;background:none;transform:translate(-50%,-50%);touch-action:none;cursor:pointer;transition:transform .2s ease,opacity .2s ease}
.poem-guest-game .gk-pile svg{display:block;width:100%;height:100%;overflow:visible;filter:drop-shadow(0 1px 1px #6b4a3a40)}
.poem-guest-game .gk-pile:hover:not(:disabled){transform:translate(-50%,-50%) scale(1.06)}
.poem-guest-game .gk-pile:disabled{cursor:default}
.poem-guest-game .gk-pile::before{content:'';position:absolute;z-index:-1;inset:-8% -4%;border-radius:50%;background:radial-gradient(closest-side,#fffbeccc,#fff6dc80 55%,#fff6dc00);opacity:.25;pointer-events:none}
.poem-guest-game .gk-pile:not(:disabled)::before{animation:gk-breathe 2.4s ease-in-out infinite}
.poem-guest-game .gk-pile.is-swept{pointer-events:none;opacity:0;transform:translate(calc(-50% + var(--fx,60px)),calc(-50% + var(--fy,-20px))) rotate(24deg) scale(.7);transition:transform .6s cubic-bezier(.2,.7,.3,1),opacity .6s ease}
.poem-guest-game .gk-gap{position:absolute;left:23.125%;top:46.667%;width:10%;height:32.444%;pointer-events:none}
.poem-guest-game .gk-broom{position:absolute;z-index:4;left:calc(var(--bx,28.4%) - 2.8%);top:calc(var(--by,76.7%) - 28.9%);width:5.6%;height:28.9%;transform:rotate(var(--br,-13deg));transform-origin:50% 100%;pointer-events:none;transition:left .22s ease,top .22s ease,transform .22s ease}
.poem-guest-game .gk-broom img{display:block;width:100%;height:100%;filter:drop-shadow(1px 2px 1px #3b2a1a40)}
.poem-guest-game .gk-broom.is-active{pointer-events:auto;touch-action:none;cursor:grab}
.poem-guest-game .gk-broom.is-active::before{content:'';position:absolute;inset:-6% -60%}
.poem-guest-game .gk-broom.is-held{cursor:grabbing;transition:left .05s linear,top .05s linear,transform .12s ease}
.poem-guest-game .gk-broom.is-held img{filter:drop-shadow(2px 6px 4px #3b2a1a55)}

/* 蓬門: a closed reed door laid over the painted open one. */
.poem-guest-game .gk-door{position:absolute;left:29.6%;top:33%;z-index:2;width:17.8%;height:38.5%;padding:0;border:0;border-radius:6px;background:none;perspective:700px;cursor:pointer;visibility:visible;transition:visibility 0s linear 1.2s}
.poem-guest-game .gk-door:disabled{cursor:default}
.poem-guest-game .gk-leaf{position:absolute;top:0;bottom:0;left:0;width:50.5%;overflow:hidden;transform-origin:0 50%;transition:transform 1s cubic-bezier(.4,.1,.3,1),opacity .5s ease .65s}
.poem-guest-game .gk-leaf+.gk-leaf{left:auto;right:0;transform-origin:100% 50%}
.poem-guest-game .gk-leaf img{position:absolute;top:0;left:0;width:198%;height:100%;filter:drop-shadow(0 3px 3px #2c1f1240)}
.poem-guest-game .gk-leaf+.gk-leaf img{left:auto;right:0}
.poem-guest-game .gk-door.is-cue{animation:gk-glow 1.8s ease-in-out infinite}
.poem-guest-game .gk-door.is-cue::after{content:'蓬門';position:absolute;left:50%;top:-2%;transform:translate(-50%,-100%);padding:2px 12px;border-radius:999px;background:#fffaf0f2;color:#5c4126;font-size:clamp(14px,2.3cqw,18px);font-weight:700;letter-spacing:.12em;white-space:nowrap;box-shadow:0 2px 6px #2a1d1033}
.poem-guest-game .gk-door:hover.is-cue .gk-leaf:first-child{transform:rotateY(-12deg)}
.poem-guest-game .gk-door:hover.is-cue .gk-leaf+.gk-leaf{transform:rotateY(12deg)}
.poem-guest-game .gk-door.is-open{visibility:hidden;pointer-events:none}
.poem-guest-game .gk-door.is-open .gk-leaf{opacity:0;transform:rotateY(-80deg)}
.poem-guest-game .gk-door.is-open .gk-leaf+.gk-leaf{transform:rotateY(80deg)}

/* Hand-made overlays: glow rings, paper tags, speech bubbles. */
.poem-guest-game .gk-spot{position:absolute;left:var(--x);top:var(--y);z-index:5;width:var(--w);min-width:48px;aspect-ratio:1;transform:translate(-50%,-50%);padding:0;border:2.5px dashed #fffaeef2;border-radius:50%;background:radial-gradient(closest-side,#fff8e436,#fff8e414 70%,transparent);box-shadow:0 0 0 2px #4a332066,inset 0 0 0 2px #4a33204d,0 0 14px 4px #fff4d633;cursor:pointer;animation:gk-call 1.7s ease-in-out infinite;transition:border-color .2s,background .2s}
.poem-guest-game .gk-spot:hover{border-style:solid;border-color:#ffd27a;background:radial-gradient(closest-side,#fff3c955,#ffe6a022 70%,transparent)}
.poem-guest-game .gk-spot>span,.poem-guest-game .gk-mark>b{position:absolute;left:50%;top:0;transform:translate(-50%,-115%);padding:2px 11px;border-radius:999px;background:#fffaf0f2;color:#2d4a3c;font-size:clamp(14px,2.3cqw,18px);font-weight:700;line-height:1.4;letter-spacing:.06em;white-space:nowrap;box-shadow:0 2px 6px #2a1d1033;pointer-events:none}
.poem-guest-game .gk-mark{position:absolute;left:var(--x);top:var(--y);z-index:3;width:var(--w);aspect-ratio:var(--a,1);transform:translate(-50%,-50%) scale(.85);border-radius:50%;border:2px solid #ffe3a6e6;background:radial-gradient(closest-side,#fff1c240,transparent);box-shadow:0 0 16px 5px #ffdb8a66,inset 0 0 10px #fff3d066;opacity:0;pointer-events:none;transition:opacity .5s ease,transform .5s cubic-bezier(.3,1.4,.5,1)}
.poem-guest-game .gk-mark.is-on{opacity:1;transform:translate(-50%,-50%)}
.poem-guest-game .gk-mark>b{top:100%;transform:translate(-50%,5px);color:#7b3e22}
.poem-guest-game .gk-mark[data-gk-mark=wine]>b{top:0;transform:translate(-50%,-112%)}
.poem-guest-game .gk-glow{position:absolute;left:var(--x);top:var(--y);z-index:3;width:var(--w);aspect-ratio:1;transform:translate(-50%,-50%) scale(.6);border-radius:50%;background:radial-gradient(closest-side,#fff8dc00 34%,#fff0c0e6 54%,#ffd36a99 72%,#ffd36a00);opacity:0;pointer-events:none}
.poem-guest-game .gk-glow::after{content:'';position:absolute;left:72%;top:8%;width:30%;aspect-ratio:1;background:#fffbe8;clip-path:polygon(50% 0,61% 39%,100% 50%,61% 61%,50% 100%,39% 61%,0 50%,39% 39%);filter:drop-shadow(0 0 2px #ffd36a)}
.poem-guest-game.is-toast .gk-glow{animation:gk-cheers 1.6s ease-out var(--d) both}
.poem-guest-game .gk-bubble{position:absolute;left:var(--x);top:var(--y);z-index:6;max-width:44%;padding:5px 13px;border-radius:16px;background:#fffaf0f5;color:#3b2c1c;font-size:clamp(14px,2.6cqw,21px);font-weight:700;line-height:1.4;white-space:nowrap;box-shadow:0 3px 10px #2a1d1033;transform:translate(-50%,-100%) scale(.6);transform-origin:50% 120%;opacity:0;pointer-events:none;transition:opacity .3s ease,transform .4s cubic-bezier(.3,1.5,.5,1)}
.poem-guest-game .gk-bubble::after{content:'';position:absolute;left:50%;top:calc(100% - 1px);width:12px;height:9px;transform:translateX(-50%);background:inherit;clip-path:polygon(0 0,100% 0,40% 100%)}
.poem-guest-game .gk-bubble.is-on{opacity:1;transform:translate(-50%,-100%)}
.poem-guest-game .gk-end{position:absolute;right:3.5%;top:5%;z-index:6;display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 16px;border-radius:14px;background:#fefbf0e8;color:#315240;box-shadow:0 4px 14px #2a1d1026;pointer-events:none;opacity:0;transform:translateY(8px);transition:opacity .7s ease 1.2s,transform .7s ease 1.2s}
.poem-guest-game .gk-end b{font-size:clamp(16px,3cqw,28px);letter-spacing:.16em;color:#7b3e22}
.poem-guest-game .gk-end small{font-size:clamp(14px,1.9cqw,17px);font-weight:600;letter-spacing:.04em}
.poem-guest-game .gk-end.is-on{opacity:1;transform:none}
@container (max-width:520px){.poem-guest-game .gk-end{right:2.5%;top:3.5%;padding:3px 12px}.poem-guest-game .gk-end small{display:none}}
.poem-guest-game .gk-loading{position:absolute;inset:0;z-index:9;display:grid;align-content:center;justify-items:center;gap:14px;padding:20px;background:#f4f0dfeb;font-size:20px;line-height:1.5;text-align:center}
.poem-guest-game .gk-loading button{min-height:48px;padding:10px 22px;border:1px solid #97ad9b;border-radius:14px;background:#fffefa;font-weight:600;font-size:19px;cursor:pointer}

/* Side panel: verse, choices, action line, feedback. */
.poem-guest-game .gk-side{grid-area:side;display:flex;flex-direction:column;gap:12px;min-width:0}
.poem-guest-game .gk-verse{margin:0;padding:10px 14px;border:1px solid #dce5ce;border-radius:16px;background:#f3f6e9;color:#93a596;font-size:clamp(21px,2.6vw,25px);font-weight:600;line-height:1.5;letter-spacing:.1em;text-align:center}
.poem-guest-game .gk-verse span{display:inline-block;transition:color .4s}
.poem-guest-game .gk-verse .is-done{color:#3d6a52}
.poem-guest-game .gk-verse .is-now{color:#294c3b;background:linear-gradient(transparent 62%,#f2d58f99 62%)}
.poem-guest-game .gk-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.poem-guest-game .gk-choice{position:relative;display:grid;justify-items:center;align-content:center;gap:4px;min-width:0;min-height:120px;padding:8px 8px 10px;border:1.5px solid var(--gk-line);border-radius:18px;background:var(--gk-paper);font-size:19px;font-weight:650;line-height:1.3;cursor:pointer;box-shadow:0 3px 0 #e6e1d2;transition:border-color .2s,background .2s,opacity .3s,filter .3s,transform .2s}
.poem-guest-game .gk-choice img{display:block;width:100%;height:clamp(64px,10vw,96px);object-fit:contain;pointer-events:none;-webkit-user-drag:none;filter:drop-shadow(0 3px 3px #3b2a1a2e)}
.poem-guest-game .gk-choice:hover:not(:disabled){border-color:#c98b3a;background:#fff6e2;transform:translateY(-2px)}
.poem-guest-game .gk-choice:disabled{cursor:default}
.poem-guest-game .gk-choice.is-right{border-color:#6f9a6d;background:#f1f7ea;box-shadow:0 0 0 3px #a9c9a040,0 3px 0 #d4e3cd}
.poem-guest-game .gk-choice.is-right::after{content:'✓';position:absolute;right:8px;top:6px;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#4f7d58;color:#fff;font-size:18px;font-weight:700}
.poem-guest-game .gk-choice.is-wrong{opacity:.55;filter:grayscale(.5);box-shadow:none}
.poem-guest-game .gk-choice.is-shake{animation:gk-shake .45s ease}
.poem-guest-game .gk-summary{padding:12px 16px;border-radius:16px;background:#fbf3e2;border:1px solid #ecdcbc;text-align:center}
.poem-guest-game .gk-summary b{display:block;font-size:21px;letter-spacing:.12em;color:#7b3e22}
.poem-guest-game .gk-summary p{margin:6px 0 0;font-size:17px;line-height:1.6;color:#4b5f50;text-align:left}
.poem-guest-game .gk-actionline{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.poem-guest-game .gk-primary{flex:1 1 150px;min-height:52px;padding:10px 20px;border:0;border-radius:16px;background:#446d50;color:#fff!important;font-size:20px;font-weight:650;letter-spacing:.06em;cursor:pointer;box-shadow:0 3px 0 #2f4f39;transition:background .2s,transform .1s}
.poem-guest-game .gk-primary:hover:not(:disabled,.is-busy){background:#3a5f45}
.poem-guest-game .gk-primary:active:not(:disabled,.is-busy){transform:translateY(2px);box-shadow:0 1px 0 #2f4f39}
.poem-guest-game .gk-primary.is-next{background:#b8743a;box-shadow:0 3px 0 #8a5426}
.poem-guest-game .gk-primary.is-next:hover:not(:disabled,.is-busy){background:#a6662f}
.poem-guest-game .gk-primary:disabled,.poem-guest-game .gk-primary.is-busy{opacity:.5;cursor:default}
.poem-guest-game .gk-listen{flex:none;display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:52px;margin-left:auto;padding:8px 18px;border:1px solid #b9cbae;border-radius:999px;background:#fffef7;color:#356148!important;font-size:18px;font-weight:600;cursor:pointer}
.poem-guest-game .gk-listen svg{width:22px;height:22px;flex:none;stroke-linecap:round;stroke-linejoin:round}
.poem-guest-game .gk-listen svg path{fill:none}
.poem-guest-game .gk-listen:disabled,.poem-guest-game .gk-listen.is-busy{opacity:.7;cursor:default}
.poem-guest-game .gk-feedback{margin:0;min-height:3em;font-size:19px;line-height:1.5;color:#55715a;text-align:center;text-wrap:pretty}

@keyframes gk-call{50%{box-shadow:0 0 0 4px #ffd27a59,0 0 20px 8px #ffd98a4d,inset 0 0 0 2px #4a33204d}}
@keyframes gk-glow{0%,100%{filter:drop-shadow(0 0 0 #ffe2a400)}50%{filter:drop-shadow(0 0 7px #ffe2a4)}}
@keyframes gk-breathe{50%{opacity:1}}
@keyframes gk-shake{20%{transform:translateX(-6px)}40%{transform:translateX(5px)}60%{transform:translateX(-4px)}80%{transform:translateX(2px)}}
@keyframes gk-cheers{0%{opacity:0;transform:translate(-50%,-50%) scale(.5)}35%{opacity:1;transform:translate(-50%,-50%) scale(1.15)}100%{opacity:.75;transform:translate(-50%,-50%) scale(1)}}

/* Landscape: picture on the left, verse and choices on the right. */
@media (orientation:landscape) and (min-width:701px),(orientation:landscape) and (max-height:500px){
 .poem-guest-game{max-width:1280px}
 .poem-guest-game .gk-layout{grid-template-columns:minmax(0,1.7fr) minmax(270px,1fr);grid-template-rows:auto minmax(0,1fr);grid-template-areas:"stage head" "stage side";column-gap:22px;row-gap:12px;align-items:center}
 .poem-guest-game .gk-stage{width:min(100%,calc((100cqh - 24px) * 16 / 9));align-self:start}
 .poem-guest-game .gk-head{align-self:end;align-items:flex-start}
 .poem-guest-game .gk-side{align-self:start}
 .poem-guest-game .gk-choice img{height:clamp(56px,7.5vw,92px)}
}
@media (orientation:landscape) and (min-width:1100px) and (min-height:700px){
 .poem-guest-game .gk-instruction{font-size:26px}
 .poem-guest-game .gk-feedback{font-size:20px}
}
@media (orientation:landscape) and (max-height:500px){
 .poem-guest-game .gk-layout{grid-template-columns:minmax(0,1.45fr) minmax(250px,1fr);column-gap:14px;row-gap:6px}
 .poem-guest-game .gk-stage{border-radius:14px;width:min(100%,calc((100cqh - 8px) * 16 / 9))}
 .poem-guest-game .gk-head{gap:8px}
 .poem-guest-game .gk-instruction{font-size:17px;line-height:1.35}
 .poem-guest-game .gk-progress{min-width:52px;padding:3px 8px;font-size:15px}
 .poem-guest-game .gk-side{gap:6px}
 .poem-guest-game .gk-verse{padding:4px 8px;font-size:17px;letter-spacing:.04em;border-radius:12px}
 .poem-guest-game .gk-choices{gap:6px}
 .poem-guest-game .gk-choice{min-height:0;padding:4px 4px 6px;font-size:15px;border-radius:14px;gap:2px}
 .poem-guest-game .gk-choice img{height:46px}
 .poem-guest-game .gk-choice.is-right::after{width:22px;height:22px;font-size:14px;right:4px;top:4px}
 .poem-guest-game .gk-summary{padding:6px 10px}.poem-guest-game .gk-summary b{font-size:16px}.poem-guest-game .gk-summary p{font-size:14px;line-height:1.45;margin-top:2px}
 .poem-guest-game .gk-primary{min-height:44px;padding:5px 12px;font-size:17px;flex-basis:100px}
 .poem-guest-game .gk-listen{min-height:44px;padding:5px 12px;font-size:15px}
 .poem-guest-game .gk-feedback{font-size:15px;line-height:1.4;min-height:2.8em;text-align:left}
}
@media (max-width:420px){
 .poem-guest-game .gk-layout{gap:10px}
 .poem-guest-game .gk-instruction{font-size:19px;min-height:2.84em}
 .poem-guest-game .gk-progress{min-width:56px;padding:4px 8px;font-size:16px}
 .poem-guest-game .gk-stage{border-radius:15px}
 .poem-guest-game .gk-side{gap:10px}
 .poem-guest-game .gk-verse{font-size:21px;letter-spacing:.04em;padding:8px 10px}
 .poem-guest-game .gk-choice{min-height:108px;font-size:18px}
 .poem-guest-game .gk-primary{font-size:19px;padding:10px 14px}
 .poem-guest-game .gk-listen{padding:8px 14px;font-size:17px}
 .poem-guest-game .gk-feedback{font-size:17px;text-align:left}
 .poem-guest-game .gk-end{padding:4px 9px;border-radius:10px}
}
@media (max-width:370px){
 .poem-guest-game .gk-verse{font-size:19px;letter-spacing:0}
 .poem-guest-game .gk-choice{font-size:16px}
 .poem-guest-game .gk-listen span{font-size:16px}
}
.poem-guest-game.is-reduced .gk-scene,.poem-guest-game.is-reduced .gk-layer,.poem-guest-game.is-reduced .gk-leaf,.poem-guest-game.is-reduced .gk-door,.poem-guest-game.is-reduced .gk-broom,.poem-guest-game.is-reduced .gk-pile,.poem-guest-game.is-reduced .gk-mark,.poem-guest-game.is-reduced .gk-bubble,.poem-guest-game.is-reduced .gk-end,.poem-guest-game.is-reduced .gk-verse span,.poem-guest-game.is-reduced .gk-choice{transition:none}
.poem-guest-game.is-reduced .gk-spot,.poem-guest-game.is-reduced .gk-door,.poem-guest-game.is-reduced .gk-choice,.poem-guest-game.is-reduced .gk-pile::before{animation:none}
.poem-guest-game.is-reduced .gk-pile:not(:disabled)::before{opacity:.7}
.poem-guest-game.is-reduced.is-toast .gk-glow{animation:none;opacity:.8;transform:translate(-50%,-50%)}
@media (prefers-reduced-motion:reduce){
 .poem-guest-game .gk-scene,.poem-guest-game .gk-layer,.poem-guest-game .gk-leaf,.poem-guest-game .gk-door,.poem-guest-game .gk-broom,.poem-guest-game .gk-pile,.poem-guest-game .gk-mark,.poem-guest-game .gk-bubble,.poem-guest-game .gk-end{transition:none}
 .poem-guest-game .gk-spot,.poem-guest-game .gk-door,.poem-guest-game .gk-choice,.poem-guest-game .gk-pile::before{animation:none}
 .poem-guest-game .gk-pile:not(:disabled)::before{opacity:.7}
 .poem-guest-game.is-toast .gk-glow{animation:none;opacity:.8;transform:translate(-50%,-50%)}
}

/* challenge-game-integration.css */
/* Practice opens directly at its next question. The poem game is question one. */
.workspace .challenge-type-microgame{padding:12px 18px;overflow:hidden}
.workspace .challenge-type-microgame .challenge-header{margin-bottom:4px;padding-bottom:7px}
.workspace .challenge-type-microgame .challenge-header .challenge-eyebrow{font-size:18px;letter-spacing:0}
.workspace .challenge-type-microgame .challenge-count{font-size:24px}
.workspace .challenge-type-microgame .challenge-body{display:block;justify-content:flex-start;overscroll-behavior:contain}
.workspace .challenge-game-holder{min-width:0;width:100%}
.workspace .challenge-game-loading{display:flex;min-height:220px;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:20px;font-size:20px;line-height:1.6}
.workspace .challenge-type-microgame .challenge-footer{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px 14px;padding-top:8px}
.workspace .challenge-type-microgame .challenge-footer-actions{display:flex;justify-content:center;align-items:center;flex:none;gap:8px;margin-inline:auto}
.workspace .challenge-type-microgame .challenge-footer .challenge-text-button{font-size:18px!important;min-height:46px}
.workspace .challenge-type-microgame .challenge-footer .challenge-primary{font-size:20px;min-width:150px;min-height:50px;justify-content:center}
.workspace .challenge-type-microgame .challenge-feedback{flex:1;min-width:100px;font-size:18px;line-height:1.5;margin:0;text-align:center}
.workspace .challenge-type-microgame .challenge-feedback:empty{display:none}
.workspace .challenge-type-microgame .challenge-feedback strong{font-size:21px}
.workspace .challenge-type-microgame .challenge-feedback .challenge-text-button{display:block;margin:auto}
.workspace .challenge-results-actions:has(>button:only-child){grid-template-columns:minmax(0,1fr);max-width:360px}
.workspace .challenge-results-actions>button{justify-content:center}
@media(max-width:700px){
 .workspace .challenge-type-microgame{padding:9px 10px;border-radius:18px}
 .workspace .challenge-type-microgame .challenge-header{padding-bottom:5px}
 .workspace .challenge-type-microgame .challenge-header .challenge-eyebrow{font-size:17px}
 .workspace .challenge-type-microgame .challenge-count{font-size:22px}
 .workspace .challenge-type-microgame .challenge-feedback{font-size:17px}
 .workspace .challenge-type-microgame .challenge-feedback strong{font-size:19px}
 .workspace .challenge-type-microgame .challenge-footer .challenge-primary{min-width:140px}
 .workspace .challenge-results-actions{grid-template-columns:minmax(0,1fr)!important;max-width:360px;gap:10px}
 .workspace .challenge-results-actions>.challenge-primary{min-height:54px;font-size:21px}
}
@media(max-height:550px) and (orientation:landscape){
 .workspace .challenge-type-microgame{padding:7px 12px}
 .workspace .challenge-type-microgame .challenge-header>div:first-child{margin-bottom:4px}
 .workspace .challenge-type-microgame .challenge-footer{padding-top:4px}
}
@media(max-width:600px) and (max-height:650px) and (orientation:portrait){
 .workspace.view-quiz #view{overflow-y:auto;overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch}
 .workspace.view-quiz .challenge-type-microgame{height:auto;min-height:100%;overflow:visible}
 .workspace.view-quiz .challenge-type-microgame .challenge-body{flex:none;overflow:visible}
}
@media(max-width:370px) and (max-height:650px) and (orientation:portrait){
 .workspace .challenge-type-microgame .poem-goose-game{gap:8px}
 .workspace .challenge-type-microgame .goose-picture{width:min(100%,220px)}
 .workspace .challenge-type-microgame .goose-paint{flex-direction:row;min-height:48px;padding:8px 5px;gap:5px;font-size:20px}
 .workspace .challenge-type-microgame .goose-paint i{width:18px;height:18px}
}
/* Taller phones give the existing scene and controls more room, without
   adding instructions or forcing the compact layout onto short screens. */
@media(max-width:600px) and (min-height:760px) and (orientation:portrait){
 .workspace .challenge-type-microgame .challenge-body{display:flex;justify-content:safe center}
 .workspace .challenge-type-microgame .garden-picture{aspect-ratio:1.08;max-height:340px}
 .workspace .challenge-type-microgame .poem-garden{padding-block:10px}
 .workspace .challenge-type-microgame .farewell-story{gap:18px}
 .workspace .challenge-type-microgame .fs-stage{aspect-ratio:4/3}
}

/* student-ui.css */
/* Keep ordinary Chinese text in the same complete, variable-weight family. */
body{font-synthesis:none;text-rendering:optimizeLegibility}
.lesson-heading .poem-heading-audio{display:inline-flex;align-items:center;justify-content:flex-start;gap:7px;max-width:100%;min-height:40px;margin:0;padding:2px 4px 2px 0;border:0;border-radius:8px;background:transparent;color:inherit;font:inherit;letter-spacing:inherit;text-align:left;vertical-align:middle;cursor:pointer;touch-action:manipulation;box-shadow:none}
.lesson-heading p .poem-heading-audio{min-height:36px}
.poem-heading-audio>span:first-child{min-width:0;overflow-wrap:anywhere}
.poem-heading-audio .heading-audio-symbol{position:relative;display:inline-flex;flex:0 0 18px;width:18px;height:18px;align-items:center;justify-content:center;color:#4f7c66}
.poem-heading-audio .heading-audio-symbol svg{width:18px;height:18px}
.poem-heading-audio[data-audio-state=loading] .heading-audio-symbol svg{visibility:hidden}
.poem-heading-audio[data-audio-state=loading] .heading-audio-symbol::after{content:"";position:absolute;inset:1px;border:2px solid #c6d8ca;border-top-color:#39745d;border-radius:50%;animation:heading-audio-spin .8s linear infinite}
.lesson-heading .poem-heading-audio[data-audio-state=playing]{background:#edf5e6;outline:2px solid #75a985;outline-offset:1px;box-shadow:none}
.lesson-heading .poem-heading-audio:focus-visible{outline:3px solid #277e76;outline-offset:2px}
.poem-heading-audio:disabled{cursor:default;opacity:.55}
@keyframes heading-audio-spin{to{transform:rotate(360deg)}}
.library-heading h1{font-family:var(--sans);font-size:clamp(32px,4.2vw,52px);font-weight:700;line-height:1.3;letter-spacing:0;text-wrap:balance}
.workspace .lesson-map-step h3{font-weight:600;line-height:1.45}
.workspace .lesson-map-status{color:#476450;font-weight:400}
.challenge-instruction,.challenge-prompt,.gr-instruction p,.rj-task,.rj-verse,.rc-instruction,.rc-task{font-family:var(--sans);font-synthesis:none}
.school-login-heading{display:flex;align-items:center;gap:20px;margin-bottom:18px}
.school-login-mascot{display:block;flex:none;width:112px;height:162px;padding:0;border:0;background:transparent;cursor:pointer;touch-action:manipulation;border-radius:16px}
.school-login-sprite{display:block;position:relative;width:100%;height:100%;pointer-events:none}
.school-login-sprite>img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center bottom}
.school-login-heading>div{min-width:0}
/* School badge, the partnership line and the platform name stack to the right of 詩詩. */
.school-login-brand{flex:1;display:flex;flex-direction:column;align-items:center;text-align:center;margin-top:-14px}
.school-login-badge{display:block;width:auto;height:84px}
.school-login .school-login-partners{margin:6px 0 8px;font:400 16px/1.45 var(--sans);color:#5d655f;letter-spacing:.04em}
.school-login-partners span{white-space:nowrap}
/* The taller heading still leaves the login button in view on a 768px-high laptop. */
@media(min-width:481px) and (max-height:860px){main.school-login{padding-block:20px}}
.school-login .school-login-eyebrow{font:400 17px/1.5 var(--sans);color:#4e6857;letter-spacing:0}
.school-login #school-login-title{font-family:'Noto Serif HK','Songti TC','PMingLiU',serif;font-size:clamp(29px,calc(8.6vw - 12px),48px);font-weight:700;line-height:1.35;margin:2px 0 0;color:#2d5c4d;text-wrap:balance}
.school-login .school-login-card{width:min(100%,640px)}
.school-login label{font-weight:600;color:#234c41}
.school-login input{font-weight:400}
.school-login input::placeholder{color:#64756b;opacity:1;font-weight:400}
.school-login .school-login-help{font-size:16px;color:#526858}
@media(max-width:480px){.school-login-heading{gap:12px;margin-bottom:12px}.school-login-mascot{width:76px;height:112px}.school-login .school-login-eyebrow{font-size:16px}.school-login #school-login-title{font-size:32px}.library-heading h1{font-size:32px}.workspace .lesson-map-step h3{font-size:23px}.workspace .lesson-map-lower .lesson-map-step h3{font-size:24px}}
@media(max-width:360px){.school-login-heading{gap:8px}.school-login-mascot{width:65px;height:100px}.school-login #school-login-title{font-size:29px}.workspace .lesson-map-step h3{font-size:21px}}

/* Account actions stay separate from the learning archive. */
.account-dialog{width:min(380px,calc(100vw - 32px));padding:24px;border:1px solid var(--line);border-radius:20px}
.account-dialog .dialog-heading{margin-bottom:22px;gap:16px}
.account-dialog h2{font:600 24px/1.4 var(--sans);overflow-wrap:anywhere}
.account-dialog #account-logout{display:flex;width:100%;min-height:52px;font-size:20px}
.profile-dialog #school-record-sync{margin-top:18px;padding-top:14px;border-top:1px solid var(--line);font-size:16px}

/* One score and one selected verse fill the available learning space. */
.workspace.view-report .study-main{width:100%;max-width:1380px}
.workspace.view-report #view{display:grid;grid-template-columns:clamp(160px,17vw,220px) minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto;align-items:stretch;gap:20px 24px;overflow:auto;min-height:0;padding:12px 6px 4px;scrollbar-width:thin;overscroll-behavior:contain}
.workspace.view-report .report-summary{display:flex;align-items:center;justify-content:center;min-width:0;margin:0;padding:20px 8px;border:1px solid #dce5d7;border-radius:28px;background:linear-gradient(160deg,#f2f7ec,#faf9ef);position:static}
.workspace.view-report .score-ring{display:grid;width:clamp(136px,14vw,178px);height:auto;aspect-ratio:1;min-width:0;place-items:center;border:2px solid #719275;outline:1px solid #d4dfc9;outline-offset:6px;border-radius:50%;padding:12px;background:#fffef8;color:#315d48;font-variant-numeric:tabular-nums;box-shadow:0 10px 28px #54794d0d}
.workspace.view-report .score-ring>div{min-width:0;max-width:100%;text-align:center}
.workspace.view-report .score-ring strong{display:block;font:600 clamp(42px,4.3vw,60px)/1.15 var(--sans);letter-spacing:-1px;white-space:nowrap}
.workspace.view-report .score-ring span{display:block;margin-top:8px;font:400 clamp(18px,1.8vw,24px)/1.4 var(--sans);white-space:nowrap}
.workspace.view-report .word-analysis{min-width:0;min-height:0;display:flex;flex-direction:column;gap:18px}
.workspace.view-report .score-line-tabs{display:flex;flex-wrap:wrap;gap:10px;overflow:visible;padding:0;flex:none}
.workspace.view-report .score-line-tabs button{flex:1;min-width:0;width:auto;height:auto;min-height:56px;padding:10px 14px;font-size:clamp(20px,2.2vw,27px);border-radius:15px;white-space:nowrap;line-height:1.35;background:#fffdf8;border:1px solid #d8e1d2;box-shadow:none}
.workspace.view-report .score-line-tabs button[aria-pressed=true]{background:#e7efdf;border-color:#789c75;color:#315d48;box-shadow:inset 0 -3px #6c956f}
.workspace.view-report .report-line{display:flex;flex:1;flex-direction:column;min-height:0;gap:18px;padding:0;border:0}
.workspace.view-report .report-sentence{display:flex;flex:1;align-items:stretch;position:relative;width:100%;min-height:190px;padding:clamp(14px,2vw,24px);border:1px solid #d5dfcb;border-radius:26px;background:linear-gradient(145deg,#fffef9,#f6f8ef);color:var(--ink);text-align:center;touch-action:manipulation;box-shadow:0 8px 24px #3a664608}
.workspace.view-report .word-analysis .word-grid{display:grid;flex:1;grid-template-columns:repeat(var(--report-columns,5),minmax(0,1fr));grid-auto-rows:minmax(0,1fr);gap:clamp(7px,1vw,14px);overflow:visible;padding:0;width:100%;min-width:0}
.workspace.view-report .word-analysis .word-result{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;min-width:0;max-width:none;min-height:0;padding:20px 4px;border-radius:18px;border:1px solid #d7e5d8;border-bottom:3px solid #779c7f;background:linear-gradient(#f5faf3,#e9f3e9);gap:10px}
.workspace.view-report .word-analysis .word-result ruby{font-size:clamp(36px,4.7vw,64px);line-height:1.55}
.workspace.view-report .word-analysis .word-result rt{font:400 clamp(17px,1.95vw,25px)/1.3 var(--sans);color:#526b59}
.workspace.view-report .word-analysis .word-result strong{font:600 clamp(23px,2.5vw,32px)/1.4 var(--sans);text-align:center;margin:0}
.workspace.view-report .word-analysis .word-result.warn,.workspace.view-report .word-analysis .word-result.fair{background:linear-gradient(#fffaf0,#faf0d5);border-color:#e6d7ac;border-bottom-color:#bb9b41}
.workspace.view-report .word-analysis .word-result.error,.workspace.view-report .word-analysis .word-result.poor{background:linear-gradient(#fff6ef,#fae9e2);border-color:#ebd1c5;border-bottom-color:#bc7765}
.workspace.view-report .word-analysis button.word-result{cursor:pointer;appearance:none;color:inherit;font:inherit;text-align:center;touch-action:manipulation}
.workspace.view-report .word-analysis button.word-result:focus-visible{outline:3px solid #397962;outline-offset:3px}
.workspace.view-report .word-analysis button.word-result[aria-pressed="true"]{box-shadow:inset 0 0 0 3px #397962;background:#e5f0e1}
.workspace.view-report .report-line-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch;justify-content:center;gap:12px;flex:none;margin:0}
.workspace.view-report .report-line-actions .button{margin:0;min-height:62px;padding:12px 10px;font-size:clamp(19px,2vw,25px);justify-content:center;border-radius:16px;white-space:nowrap}
.workspace.view-report .report-line-actions .button svg{width:25px;height:25px}
.workspace.view-report .report-next{grid-column:1/-1;display:flex;justify-content:flex-end;padding:0}
.workspace.view-report .report-animation-next{width:min(100%,420px);min-height:68px;border-radius:18px;padding:14px 24px;font-size:26px;gap:14px}
.workspace.view-report .report-animation-next svg{width:28px;height:28px}
.workspace.view-report .report-animation-next svg:last-child{margin-left:auto}
.workspace.view-report .report-empty{grid-column:1/-1;align-self:center}
@media(max-width:700px){
 .workspace.view-report #view{display:flex;flex-direction:column;align-items:stretch;gap:14px;padding:8px 2px 4px}
 .workspace.view-report .report-summary{flex:none;align-self:center;border:0;padding:4px;background:none}
 .workspace.view-report .score-ring{width:112px;padding:8px;outline-offset:4px}
 .workspace.view-report .score-ring strong{font-size:36px}
 .workspace.view-report .score-ring span{font-size:17px;margin-top:4px}
 .workspace.view-report .word-analysis{flex:1;min-height:auto;gap:12px}
 .workspace.view-report .score-line-tabs{gap:6px}
 .workspace.view-report .score-line-tabs button{min-height:48px;padding:8px 4px;font-size:18px;border-radius:12px}
 .workspace.view-report .report-line{gap:12px;min-height:auto}
 .workspace.view-report .report-sentence{min-height:146px;padding:12px 8px;border-radius:20px}
 .workspace.view-report .word-analysis .word-grid{gap:6px}
 .workspace.view-report .word-analysis .word-result{min-height:118px;padding:12px 2px;border-radius:12px;gap:2px}
 .workspace.view-report .word-analysis .word-result ruby{font-size:34px;line-height:1.5}
 .workspace.view-report .word-analysis .word-result rt{font-size:17px}
 .workspace.view-report .word-analysis .word-result strong{font-size:22px}
 .workspace.view-report .report-line-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
 .workspace.view-report .report-line-actions .button{min-height:50px;padding:9px 8px;font-size:18px;gap:7px;border-radius:13px}
 .workspace.view-report .report-line-actions .button svg{width:22px;height:22px}
 .workspace.view-report .report-line-actions .report-reread{grid-column:1/-1;justify-self:center;width:min(100%,260px)}
 .workspace.view-report .report-next{flex:none;margin-top:auto;padding-top:2px}
 .workspace.view-report .report-animation-next{width:100%;min-height:58px;font-size:22px;padding:11px 20px;border-radius:15px}
}
/* Pinyin stays legible on a narrow phone; seven-character clauses wrap 4 + 3. */
@media(max-width:520px){
 .workspace.view-report .word-analysis .word-grid[data-columns="7"]{grid-template-columns:repeat(8,minmax(0,1fr))}
 .workspace.view-report .word-analysis .word-grid[data-columns="7"] .word-result{grid-column:span 2}
 .workspace.view-report .word-analysis .word-grid[data-columns="7"] .word-result:nth-child(7n + 5){grid-column:2/span 2}
}
@media(max-width:360px){
 .workspace.view-report .score-line-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
 .workspace.view-report .word-analysis .word-grid[data-columns="5"]{grid-template-columns:repeat(6,minmax(0,1fr))}
 .workspace.view-report .word-analysis .word-grid[data-columns="5"] .word-result{grid-column:span 2}
 .workspace.view-report .word-analysis .word-grid[data-columns="5"] .word-result:nth-child(5n + 4){grid-column:2/span 2}
}
@media(min-width:701px) and (max-height:680px){
 .workspace.view-report #view{grid-template-columns:144px minmax(0,1fr);gap:12px 18px;padding-top:4px}
 .workspace.view-report .score-ring{width:122px;padding:8px}
 .workspace.view-report .score-ring strong{font-size:40px}
 .workspace.view-report .score-ring span{font-size:17px}
 .workspace.view-report .word-analysis,.workspace.view-report .report-line{gap:10px}
 .workspace.view-report .score-line-tabs button{min-height:46px;font-size:20px;padding:7px 10px}
 .workspace.view-report .report-sentence{min-height:0;padding:12px}
 .workspace.view-report .word-analysis .word-result{padding:8px 2px;border-radius:12px;gap:0}
 .workspace.view-report .word-analysis .word-result ruby{font-size:36px;line-height:1.45}
 .workspace.view-report .word-analysis .word-result rt{font-size:17px}
 .workspace.view-report .word-analysis .word-result strong{font-size:22px}
 .workspace.view-report .report-line-actions .button{min-height:48px;font-size:19px;padding:8px}
 .workspace.view-report .report-animation-next{min-height:52px;font-size:22px;padding:9px 20px}
}
@media(min-width:701px) and (max-height:450px){
 .workspace.view-report #view{overflow:auto;grid-template-rows:minmax(178px,1fr) auto;gap:8px 14px}
 .workspace.view-report .report-summary{padding:10px 6px}
 .workspace.view-report .report-line-actions .button{min-height:44px;font-size:17px;padding:6px}
 .workspace.view-report .score-line-tabs button{min-height:44px;font-size:18px}
 .workspace.view-report .word-analysis .word-result ruby{font-size:30px}
 .workspace.view-report .word-analysis .word-result rt{font-size:16px}
 .workspace.view-report .word-analysis .word-result strong{font-size:18px}
}

.workspace .challenge-shell .challenge-writing .cw-status{font-size:18px;line-height:1.5}

/* Pinyin needs its own space: a syllable wider than the character must not touch
   the next syllable. Keep the whole sentence's existing read action. */
.workspace.view-record .record-tool>.verse ruby{flex:0 0 auto;min-width:0;padding-inline:3px}
/* Paired five-character verses share equal columns. Intrinsic pinyin widths
   must not shift each row's characters independently. */
.workspace.view-record .record-tool>.verse.verse-compound>.verse-clause:has(>ruby:nth-of-type(5)):not(:has(>ruby:nth-of-type(6))){display:grid;grid-template-columns:repeat(5,minmax(0,1fr)) 18px;align-items:end;width:100%;max-width:360px}
.workspace.view-record .record-tool>.verse.verse-compound>.verse-clause:has(>ruby:nth-of-type(5)):not(:has(>ruby:nth-of-type(6)))>ruby{width:100%;min-width:0;box-sizing:border-box;text-align:center}
.workspace.view-record .record-tool>.verse.verse-compound>.verse-clause:has(>ruby:nth-of-type(5)):not(:has(>ruby:nth-of-type(6)))>.punct{width:18px;text-align:center}
@media(max-width:360px){
 .workspace.view-record .record-counter:has([data-action="record-feedback"]):has(.extension-entry){grid-template-columns:minmax(0,1fr) auto;gap:0 8px}
 .workspace.view-record .record-counter:has([data-action="record-feedback"])>.extension-entry{grid-column:2;grid-row:1}
 .workspace.view-record .record-counter:has(.extension-entry)>[data-action="record-feedback"]{grid-column:1/-1;grid-row:2;justify-self:center;min-height:44px}
 .workspace.view-record .record-tool>.verse:has(>ruby:nth-of-type(7)),
 .workspace.view-record .record-tool>.verse>.verse-clause:has(>ruby:nth-of-type(7)){display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:6px 0;width:100%;max-width:300px;margin-inline:auto}
 .workspace.view-record .record-tool>.verse:has(>ruby:nth-of-type(7))>ruby,
 .workspace.view-record .record-tool>.verse>.verse-clause:has(>ruby:nth-of-type(7))>ruby{grid-column:span 2;min-width:0;padding-inline:0}
 .workspace.view-record .record-tool>.verse:has(>ruby:nth-of-type(7))>ruby:nth-of-type(5),
 .workspace.view-record .record-tool>.verse>.verse-clause:has(>ruby:nth-of-type(7))>ruby:nth-of-type(5){grid-column:2/span 2}
 .workspace.view-record .record-tool>.verse:has(>ruby:nth-of-type(7))>.punct,
 .workspace.view-record .record-tool>.verse>.verse-clause:has(>ruby:nth-of-type(7))>.punct{grid-column:8;grid-row:2;justify-self:start;width:auto}
}

/* The sentence being recorded is the task's primary reading surface. Equal
   character cells keep pinyin from shifting paired five-character lines. */
.workspace.view-record .record-tool[data-step="read"]>.verse{font-size:48px;line-height:1.45;min-height:90px;margin-block:12px 18px}
.workspace.view-record .record-tool[data-step="read"]>.verse ruby{font-size:48px;line-height:1.45;min-width:0;padding-inline:0;text-align:center}
.workspace.view-record .record-tool[data-step="read"]>.verse rt{font-size:18px;line-height:1.3;letter-spacing:0}
.workspace.view-record .record-tool[data-step="read"]>.verse .punct{font-size:44px;line-height:1.45;width:22px;text-align:center}
.workspace.view-record .record-tool[data-step="read"]>.verse:has(>ruby:nth-of-type(7)){display:grid;grid-template-columns:repeat(7,minmax(0,1fr)) 22px;align-items:end;width:100%;max-width:500px;margin-inline:auto;gap:0}
.workspace.view-record .record-tool[data-step="read"]>.verse.verse-compound{gap:8px;min-height:166px}
.workspace.view-record .record-tool[data-step="read"]>.verse.verse-compound>.verse-clause{width:100%;max-width:420px}
.workspace.view-record .record-tool[data-step="read"]>.verse.verse-compound>.verse-clause:has(>ruby:nth-of-type(5)):not(:has(>ruby:nth-of-type(6))){grid-template-columns:repeat(5,minmax(0,1fr)) 22px;max-width:420px}
.workspace.view-record .record-tool[data-step="read"]>.verse.verse-compound>.verse-clause>.punct{width:22px}
@media(max-width:700px){
 .workspace.view-record .record-tool[data-step="read"]>.verse{min-height:80px;margin-block:8px 14px}
 .workspace.view-record .record-tool[data-step="read"]>.verse ruby{font-size:40px;line-height:1.45}
 .workspace.view-record .record-tool[data-step="read"]>.verse rt{font-size:16px;line-height:1.3}
 .workspace.view-record .record-tool[data-step="read"]>.verse .punct{font-size:36px;width:18px}
 .workspace.view-record .record-tool[data-step="read"]>.verse:has(>ruby:nth-of-type(7)){grid-template-columns:repeat(7,minmax(0,1fr)) 18px;max-width:420px}
 .workspace.view-record .record-tool[data-step="read"]>.verse.verse-compound{min-height:142px;gap:6px}
 .workspace.view-record .record-tool[data-step="read"]>.verse.verse-compound>.verse-clause:has(>ruby:nth-of-type(5)):not(:has(>ruby:nth-of-type(6))){grid-template-columns:repeat(5,minmax(0,1fr)) 18px;max-width:360px}
 .workspace.view-record .record-tool[data-step="read"]>.verse.verse-compound>.verse-clause>.punct{width:18px}
}
@media(max-width:360px){
 .workspace.view-record .record-tool[data-step="read"]>.verse ruby{font-size:36px}
 .workspace.view-record .record-tool[data-step="read"]>.verse:has(>ruby:nth-of-type(7)){grid-template-columns:repeat(8,minmax(0,1fr));gap:5px 0;max-width:300px}
}
/* Prose sentences (鄭人買履) have clauses of eight to ten characters. Shrink the
   whole sentence together so each clause stays on one row inside the column. */
.workspace.view-record .record-tool[data-step="read"]>.verse.verse-compound:has(>.verse-clause>ruby:nth-of-type(8))>.verse-clause{max-width:none}
.workspace.view-record .record-tool[data-step="read"]>.verse.verse-compound:has(>.verse-clause>ruby:nth-of-type(8)) ruby{font-size:42px}
.workspace.view-record .record-tool[data-step="read"]>.verse.verse-compound:has(>.verse-clause>ruby:nth-of-type(8)) .punct{font-size:38px;width:18px}
@media(max-width:700px){
 .workspace.view-record .record-tool[data-step="read"]>.verse.verse-compound:has(>.verse-clause>ruby:nth-of-type(8)) ruby{font-size:min(40px,calc((100vw - 64px) / 11))}
 .workspace.view-record .record-tool[data-step="read"]>.verse.verse-compound:has(>.verse-clause>ruby:nth-of-type(8)) rt{font-size:13px}
 .workspace.view-record .record-tool[data-step="read"]>.verse.verse-compound:has(>.verse-clause>ruby:nth-of-type(8)) .punct{font-size:min(36px,calc((100vw - 64px) / 12));width:14px}
}
@media(max-width:360px){
 .workspace.view-record .record-tool[data-step="read"]>.verse.verse-compound:has(>.verse-clause>ruby:nth-of-type(8))>.verse-clause{display:flex;width:100%;max-width:none;gap:0}
 .workspace.view-record .record-tool[data-step="read"]>.verse.verse-compound:has(>.verse-clause>ruby:nth-of-type(8))>.verse-clause>ruby,
 .workspace.view-record .record-tool[data-step="read"]>.verse.verse-compound:has(>.verse-clause>ruby:nth-of-type(8))>.verse-clause>ruby:nth-of-type(5),
 .workspace.view-record .record-tool[data-step="read"]>.verse.verse-compound:has(>.verse-clause>ruby:nth-of-type(8))>.verse-clause>.punct{grid-column:auto;grid-row:auto}
}
@media(min-width:701px) and (max-height:560px) and (orientation:landscape){
 .workspace.view-record .record-tool[data-step="read"]>.record-counter{min-height:32px}
 .workspace.view-record .record-tool[data-step="read"] .practice-motif{width:30px;height:30px}
 .workspace.view-record .record-tool[data-step="read"]>.verse{min-height:64px;margin-block:0 4px}
 .workspace.view-record .record-tool[data-step="read"]>.verse ruby{font-size:36px;line-height:1.15}
 .workspace.view-record .record-tool[data-step="read"]>.verse rt{font-size:16px}
 .workspace.view-record .record-tool[data-step="read"]>.verse .punct{font-size:34px;line-height:1.15}
 .workspace.view-record .record-tool[data-step="read"]>.verse.verse-compound{min-height:126px;gap:4px}
 .workspace.view-record .record-tool[data-step="read"]>.record-model{margin-bottom:4px}
 .workspace.view-record .record-tool[data-step="read"] #record-controls,
 .workspace.view-record .record-tool[data-step="read"] .record-actions{min-height:58px}
}

/* access-ui.css */
.header-right{display:flex;align-items:center;gap:12px}
.teacher-entry{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:8px 13px;border:1px solid #c8d8c5;border-radius:12px;background:#f7faee;color:#315b43;font:600 17px/1.35 var(--sans);text-decoration:none;white-space:nowrap}
.teacher-entry:focus-visible{outline:3px solid #377460;outline-offset:3px}
.library-books:has(>.poem-card:only-child){grid-template-columns:minmax(0,560px);justify-content:center}
@media(max-width:700px){.lesson-tools:has(.teacher-entry){gap:6px}.lesson-tools .teacher-entry{font-size:15px;padding:7px 9px}.lesson-bar:has(.teacher-entry) .lesson-heading h1{font-size:20px}.lesson-bar:has(.teacher-entry) .lesson-portrait{display:none}.header-right{gap:8px}}
/* A teacher has one more action than a pupil. Give the title its own row
   before the controls can squeeze a long poem name into a vertical column. */
@media(max-width:520px){
 .workspace .lesson-bar:has(.teacher-entry){grid-template-columns:44px minmax(0,1fr) auto;grid-template-rows:auto 76px;min-height:0;gap:4px 8px;padding-block:8px}
 .workspace .lesson-bar:has(.teacher-entry)>.lesson-title{grid-column:2/-1;grid-row:1}
 .workspace .lesson-bar:has(.teacher-entry)>.shishi-touch-slot{grid-column:1/3;grid-row:2;justify-self:end}
 .workspace .lesson-bar:has(.teacher-entry)>.lesson-tools{grid-column:3;grid-row:2}
 .workspace .lesson-bar:has(.teacher-entry) .lesson-heading h1{font-size:23px;line-height:1.3;text-wrap:initial}
 .workspace .lesson-bar:has(.teacher-entry) .lesson-title p{overflow-wrap:normal}
 .workspace .lesson-bar:has(.teacher-entry) .shishi-touch-slot{--shishi-width:52px;--shishi-height:72px;width:110px;height:76px}
 .workspace .lesson-bar:has(.teacher-entry) .shishi-guide-button{flex-direction:row;justify-content:flex-start;gap:4px}
 .workspace .lesson-bar:has(.teacher-entry) .shishi-guide-art{order:0}
 .workspace .lesson-bar:has(.teacher-entry) .shishi-poet-label{order:1}
}
@media(max-width:360px){
 .workspace .lesson-bar:has(.shishi-touch-slot){grid-template-columns:44px minmax(0,1fr) auto;grid-template-rows:auto 76px;min-height:0;gap:4px 8px;padding-block:8px}
 .workspace .lesson-bar>.lesson-title{grid-column:2/-1;grid-row:1}
 .workspace .lesson-bar>.shishi-touch-slot{grid-column:1/3;grid-row:2;justify-self:end}
 .workspace .lesson-bar>.lesson-tools{grid-column:3;grid-row:2}
 .workspace .lesson-title h1{font-size:23px;line-height:1.3;text-wrap:initial}
 .workspace .lesson-title p{overflow-wrap:normal}
 .workspace .shishi-touch-slot{--shishi-width:52px;--shishi-height:72px;width:110px;height:76px}
 .workspace .shishi-touch-slot .shishi-guide-button{flex-direction:row;justify-content:flex-start;gap:4px}
 .workspace .shishi-touch-slot .shishi-guide-art{order:0}
 .workspace .shishi-touch-slot .shishi-poet-label{order:1}
 /* The reading task needs room for its microphone on a narrow phone. Keep
    pupil navigation, title and mascot in one compact header row. */
 .workspace.view-record .lesson-bar:has(.shishi-touch-slot):not(:has(.teacher-entry)){grid-template-columns:40px minmax(0,1fr) 46px 44px;grid-template-rows:auto;gap:4px;padding-block:4px;margin-bottom:6px}
 .workspace.view-record .lesson-bar:not(:has(.teacher-entry))>.lesson-title{grid-column:2;grid-row:1}
 .workspace.view-record .lesson-bar:not(:has(.teacher-entry))>.shishi-touch-slot{grid-column:3;grid-row:1;justify-self:center;--shishi-width:44px;--shishi-height:60px;width:46px;height:80px}
 .workspace.view-record .lesson-bar:not(:has(.teacher-entry))>.lesson-tools{grid-column:4;grid-row:1}
 .workspace.view-record .lesson-bar:not(:has(.teacher-entry)) .lesson-title h1{font-size:22px;line-height:1.25}
 .workspace.view-record .lesson-bar:not(:has(.teacher-entry)) .poem-heading-audio{gap:3px;padding-right:0}
 .workspace.view-record .lesson-bar:not(:has(.teacher-entry)) h1 .poem-heading-audio>span:first-child{text-wrap:balance}
 .workspace.view-record .lesson-bar:not(:has(.teacher-entry)) .shishi-guide-button{flex-direction:column;justify-content:center;gap:0}
 .workspace.view-record .lesson-bar:not(:has(.teacher-entry)) .shishi-poet-label{font-size:14px;line-height:20px}
 .workspace.view-record .lesson-bar:not(:has(.teacher-entry)) .lesson-menu>summary{width:44px;height:48px}
 .workspace.view-record #view{padding-bottom:8px;scroll-padding-bottom:8px}
}
/* The login title is one complete name, including on a 320px phone. Keep the
   mascot and school badge beside it without allowing the later auth stylesheet to wrap it. */
.school-login .school-login-heading #school-login-title{white-space:nowrap;text-wrap:nowrap;letter-spacing:0}
@media(max-width:480px){
 .school-login .school-login-heading{gap:8px}
 .school-login .school-login-heading .school-login-mascot{width:clamp(52px,17vw,76px);height:clamp(78px,25vw,112px)}
 .school-login .school-login-heading .school-login-badge{height:clamp(46px,14vw,62px)}
 .school-login .school-login-heading .school-login-brand{margin-top:-6px}
 .school-login .school-login-heading .school-login-partners{margin-top:4px;margin-bottom:5px;font-size:clamp(12px,3.4vw,14px);letter-spacing:.02em}
 .school-login .school-login-heading #school-login-title{font-size:clamp(21px,calc(9.6vw - 9.2px),34px);line-height:1.35}
}

/* tablet-layout.css */
/* Give landscape tablets the space below a compact lesson bar. The game
   layouts that follow this file keep their own scene/control proportions. */
/* Book covers retain their complete composition even when browser toolbars
   reduce the viewport height. The page can grow instead of cropping artwork. */
.library:not(.credits-page){height:auto;min-height:calc(100dvh - 64px);padding-bottom:calc(32px + env(safe-area-inset-bottom))}
.library .library-books{flex:none;grid-template-rows:none;grid-auto-rows:auto;align-items:start;padding-bottom:18px}
.library .poem-entry{height:100%;min-height:0}
.library .poem-art{flex:none;height:auto;min-height:0;aspect-ratio:16/9;background-size:contain;background-repeat:no-repeat}
.library .poem-art>img{display:block;width:100%;height:100%;object-fit:contain;object-position:center;transform:none}
.library .poem-card-body{flex:none}
.library .library-footer{margin-top:8px;padding-bottom:8px}
.chat-response{display:flex;flex-direction:column;align-items:flex-start;max-width:90%;min-width:0}
.chat-response .chat-bubble{max-width:100%;width:auto}
.chat-message.user .chat-response{align-items:flex-end}
.chat-response .chat-reply-audio{display:inline-flex;align-items:center;justify-content:center;align-self:flex-start;width:44px;min-width:44px;height:36px;min-height:36px;margin:3px 0 0;padding:6px 10px;border:0;background:transparent;box-shadow:none;color:#537969}
.chat-response .chat-reply-audio svg{width:19px;height:19px}
@media (min-width:701px) and (max-width:1400px) and (min-height:560px) and (orientation:landscape){
 .workspace.lesson-shell:not(.view-quiz){padding-inline:max(16px,env(safe-area-inset-left)) max(16px,env(safe-area-inset-right));padding-bottom:max(12px,env(safe-area-inset-bottom))}
 .workspace.lesson-shell:not(.view-quiz) .lesson-bar:has(.shishi-touch-slot){grid-template-columns:auto minmax(0,1fr) 100px auto;min-height:86px;padding-block:3px;margin-bottom:8px;gap:14px}
 .workspace.lesson-shell:not(.view-quiz) .shishi-touch-slot{--shishi-width:56px;--shishi-height:74px;width:100px;height:78px;flex-basis:100px}
 .workspace.lesson-shell:not(.view-quiz) .shishi-touch-slot .shishi-guide-button{flex-direction:row;justify-content:center;gap:0}
 .workspace.lesson-shell:not(.view-quiz) .shishi-touch-slot .shishi-guide-art{width:56px;height:74px;order:0}
 .workspace.lesson-shell:not(.view-quiz) .shishi-touch-slot .shishi-poet-label{order:1;font-size:15px;line-height:20px}
 .workspace.lesson-shell:not(.view-quiz) .lesson-title h1{font-size:28px;line-height:1.3}
 .workspace.lesson-shell:not(.view-quiz) .lesson-title p{font-size:17px;line-height:1.4;margin-top:3px}
 .workspace.view-lesson .study-main{width:100%;max-width:1200px;min-height:0}
 .workspace.view-lesson #view{align-items:stretch;padding:12px 20px 0;min-height:0}
 .workspace.view-lesson .lesson-map{height:100%;max-width:none;min-height:0;gap:14px}
 .workspace.view-lesson .lesson-map-hero{min-height:44px;flex:none}
 .workspace.view-lesson .lesson-map-hero h2{font-size:27px}
 .workspace.view-lesson .lesson-map-steps{flex:1;min-height:0;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:16px}
 .workspace.view-lesson .lesson-map-step{min-height:0;padding:18px 24px;justify-content:center}
 .workspace.view-lesson .lesson-map-step-top{margin-bottom:10px}
 .workspace.view-lesson .lesson-map-step h3{font-size:30px;line-height:1.4}
 .workspace.view-lesson .lesson-map-status{font-size:19px;margin-top:8px}
 .workspace.view-lesson .lesson-map-extras{flex:none;padding-top:6px;max-width:320px}
 .workspace.view-lesson .lesson-map-extras a{min-height:46px}
}
/* The observation card uses the same generous type and touch targets as the
   landscape games, while feedback can still flow if text is enlarged. */
@media (min-width:900px) and (min-height:620px) and (orientation:landscape){
 .workspace.view-explore #view .explore-card{padding:22px 26px;justify-content:center}
 .workspace.view-explore #view .explore-card-top{margin-bottom:12px}
 .workspace.view-explore #view .explore-step{font-size:20px}
 .workspace.view-explore #view .explore-dots{gap:8px}
 .workspace.view-explore #view .explore-dots i{width:9px;height:9px}
 .workspace.view-explore #view .explore-verse{margin-bottom:16px;padding-block:12px}
 .workspace.view-explore #view .explore-verse>p{font-size:29px;line-height:1.5}
 .workspace.view-explore #view .explore-word{min-width:76px;min-height:70px;gap:10px;padding:6px 10px;border-radius:14px}
 .workspace.view-explore #view .explore-word>span{font-size:29px}
 .workspace.view-explore #view .explore-word small{font-size:16px;line-height:1.4}
 .workspace.view-explore #view .explore-word svg{width:23px;height:23px}
 .workspace.view-explore #view .explore-question legend{font-size:26px;line-height:1.45;margin-bottom:14px}
 .workspace.view-explore #view .explore-answers{gap:14px}
 .workspace.view-explore #view .explore-answers button{font-size:24px;min-height:66px;gap:13px;padding:12px 16px;border-radius:15px;line-height:1.45}
 .workspace.view-explore #view .explore-answer-dot{width:24px;height:24px}
 .workspace.view-explore #view .explore-answer-dot svg{width:17px;height:17px}
 .workspace.view-explore #view .explore-feedback{font-size:21px;line-height:1.5;margin-top:16px}
 .workspace.view-explore #view .explore-next{font-size:24px!important;min-height:60px;margin-top:18px}
 .workspace.view-explore #view .explore-finish h3{font-size:30px}
 .workspace.view-explore #view .explore-finish p{font-size:23px;line-height:1.6}
 .workspace.view-explore #view .explore-again{font-size:23px;min-height:58px}
}
@media (min-width:701px) and (max-width:1400px) and (min-height:560px) and (max-height:680px) and (orientation:landscape){
 .workspace.view-lesson #view{padding-top:4px}
 .workspace.view-lesson .lesson-map{gap:8px}
 .workspace.view-lesson .lesson-map-steps{gap:12px}
 .workspace.view-lesson .lesson-map-step{padding:12px 20px}
 .workspace.view-lesson .lesson-map-step h3{font-size:26px}
 .workspace.view-lesson .lesson-map-step-top{margin-bottom:5px}
 .workspace.view-lesson .lesson-map-status{margin-top:5px}
}

@media (min-width:900px) and (min-height:620px) and (orientation:landscape){
 .workspace.view-explore #view .explore-layout{grid-template-columns:minmax(0,1.2fr) minmax(340px,1fr);align-items:stretch;gap:28px}
 .workspace.view-explore #view .explore-card{justify-content:space-between;padding:24px 28px;gap:12px}
 .workspace.view-explore #view .explore-card-top{margin-bottom:0}
 .workspace.view-explore #view .explore-verse{margin:0;padding-block:14px}
 .workspace.view-explore #view .explore-verse>p{font-size:30px}
 .workspace.view-explore #view .explore-question{margin-block:auto}
 .workspace.view-explore #view .explore-question legend{font-size:28px}
 .workspace.view-explore #view .explore-answers button{font-size:26px;min-height:72px}
 .workspace.view-explore #view .explore-feedback{font-size:23px;margin-top:0}
 .workspace.view-explore #view .explore-next{font-size:26px!important;min-height:66px;margin-top:0}
 .workspace.view-explore #view .explore-finish{margin-block:auto}
 .workspace.view-explore #view .explore-finish-actions{margin-top:auto}
}

/* Browser toolbars leave many tablets less than 700 CSS pixels high. Keep
   their reading controls large as well; scale type before adding empty gaps. */
@media (min-width:900px) and (min-height:620px) and (orientation:landscape){
 .workspace.view-explore #view .explore-card{gap:10px;padding:18px 22px}
 .workspace.view-explore #view .explore-card h3{font-size:clamp(27px,3.5vh,35px);line-height:1.35;margin-bottom:8px}
 .workspace.view-explore #view .explore-verse>p{font-size:clamp(29px,3.8vh,38px);line-height:1.4}
 .workspace.view-explore #view .explore-word>span{font-size:clamp(30px,4vh,38px)}
 .workspace.view-explore #view .explore-question legend{font-size:clamp(26px,3.4vh,33px);line-height:1.4;margin-bottom:10px}
 .workspace.view-explore #view .explore-answers{gap:10px}
 .workspace.view-explore #view .explore-answers button{font-size:clamp(25px,3.3vh,32px);min-height:clamp(60px,9vh,90px);padding:10px 14px;line-height:1.35}
 .workspace.view-explore #view .explore-feedback{font-size:clamp(23px,3.1vh,30px);line-height:1.45}
 .workspace.view-explore #view .explore-next{font-size:clamp(25px,3.3vh,31px)!important;min-height:clamp(60px,8.5vh,84px)}
}

/* Carry the available activity height through the flex/grid chain. The older
   image layout used flex:none, leaving the bottom third of tall tablets empty. */
@media (min-width:900px) and (min-height:620px) and (orientation:landscape){
 .workspace.view-explore #view .explore{height:100%;min-height:0;padding-bottom:0;gap:0}
 .workspace.view-explore #view .explore-layout{flex:1;min-height:0;grid-template-rows:minmax(0,1fr);padding-bottom:0;gap:20px}
 .workspace.view-explore #view .explore-visual{height:100%;min-height:0}
 .workspace.view-explore #view .explore-stage{height:auto;min-height:0;flex:1}
 .workspace.view-explore #view .explore-card{height:100%;min-height:0;justify-content:flex-start;gap:clamp(10px,1.7vh,18px);padding:clamp(14px,2.2vh,24px);container:explore-card / size}
 .workspace.view-explore #view .explore-card-top{flex:none}
 .workspace.view-explore #view .explore-verse{flex:none;padding-block:clamp(6px,1.5vh,16px)}
 .workspace.view-explore #view .explore-question{flex:1;min-height:0;display:flex;flex-direction:column;margin:0}
 .workspace.view-explore #view .explore-question legend{margin-bottom:clamp(10px,2vh,20px)}
 .workspace.view-explore #view .explore-answers{flex:1;grid-template-rows:repeat(2,minmax(58px,1fr));gap:clamp(10px,2vh,22px)}
 .workspace.view-explore #view .explore-answers button{height:100%;min-height:58px;font-size:clamp(25px,3.8vh,38px);padding:12px 18px}
 .workspace.view-explore #view .explore-answer-dot{width:clamp(26px,3.3vh,34px);height:clamp(26px,3.3vh,34px);flex:none}
 .workspace.view-explore #view .explore-feedback{flex:none;font-size:clamp(22px,3.1vh,30px);line-height:1.45}
 .workspace.view-explore #view .explore-next{flex:none}
 .workspace.view-explore #view .explore-finish{flex:1;display:flex;flex-direction:column;justify-content:center;margin:0}
 .workspace.view-explore #view .explore-finish p{font-size:clamp(25px,3.4vh,34px);line-height:1.6}
 .workspace.view-explore #view .explore-finish-mark{width:clamp(76px,12vh,124px);height:clamp(76px,12vh,124px)}
 .workspace.view-explore #view .explore-finish-actions{margin:0;gap:12px}
 .workspace.view-explore #view .explore-finish-actions button,.workspace.view-explore #view .explore-finish-actions a{font-size:clamp(24px,3.3vh,32px);min-height:clamp(58px,9vh,88px)}
 .workspace.view-explore #view .explore.is-expanded .explore-layout{display:flex}
 .workspace.view-explore #view .explore.is-expanded .explore-stage{height:auto;min-height:0;flex:1}
}
@media (min-width:900px) and (min-height:620px) and (max-height:740px) and (orientation:landscape){
 .workspace.view-explore #view .explore-card{padding:12px 16px;gap:8px}
 .workspace.view-explore #view .explore-verse{padding-block:4px;min-height:62px}
 .workspace.view-explore #view .explore-verse>p{font-size:27px;line-height:1.4}
 .workspace.view-explore #view .explore-question legend{font-size:25px;line-height:1.35;margin-bottom:8px}
 .workspace.view-explore #view .explore-word{min-width:66px;min-height:62px;padding:4px 7px}
 .workspace.view-explore #view .explore-word>span{font-size:29px}
 .workspace.view-explore #view .explore-feedback{font-size:22px;line-height:1.4}
 .workspace.view-explore #view .explore-next{min-height:54px;font-size:25px!important;padding-block:8px}
 .workspace.view-explore #view .explore-card:has(.explore-next:not(:disabled)) .explore-question{flex:none}
 .workspace.view-explore #view .explore-card:has(.explore-next:not(:disabled)) .explore-question legend,
 .workspace.view-explore #view .explore-card:has(.explore-next:not(:disabled)) .explore-answers button:not(.is-correct){display:none}
 .workspace.view-explore #view .explore-card:has(.explore-next:not(:disabled)) .explore-answers{grid-template-rows:auto}
 .workspace.view-explore #view .explore-card:has(.explore-next:not(:disabled)) .explore-answers button{min-height:54px;padding-block:8px;font-size:25px}
 .workspace.view-explore #view .explore-card:has(.explore-next:not(:disabled)) .explore-feedback{flex:1;display:flex;align-items:center}
}

/* tablet-games.css */
/* Tablets keep the play area and its controls together, using the space below
   the lesson bar rather than sizing a tall scene from the screen width. */
@media (min-width:701px){
 .workspace.view-quiz.lesson-shell{padding-inline:20px;padding-bottom:10px}
 .workspace.view-quiz .lesson-bar:has(.shishi-touch-slot){grid-template-columns:auto minmax(0,1fr) 94px auto;min-height:82px;padding-block:3px;margin-bottom:6px;gap:16px}
 .workspace.view-quiz .shishi-touch-slot{--shishi-width:54px;--shishi-height:70px;width:94px;height:74px;flex-basis:94px}
 .workspace.view-quiz .shishi-touch-slot .shishi-guide-button{flex-direction:row;justify-content:center;gap:0}
 .workspace.view-quiz .shishi-touch-slot .shishi-guide-art{width:54px;height:70px;order:0}
 .workspace.view-quiz .shishi-touch-slot .shishi-poet-label{order:1;font-size:15px;line-height:20px}
 .workspace.view-quiz .lesson-title h1{font-size:28px;line-height:1.25}
 .workspace.view-quiz .lesson-title p{font-size:17px;line-height:1.35;margin-top:4px}
 .workspace.view-quiz .study-main{width:100%;max-width:1440px;min-height:0}
 .workspace.view-quiz #view{overflow:auto;padding:0;min-height:0}
 .workspace.view-quiz .challenge-shell{padding:10px 18px 12px;border-radius:20px;overflow:visible}
 .workspace.view-quiz .challenge-header{max-width:none;margin-bottom:6px;padding:0 0 6px}
 .workspace.view-quiz .challenge-header>div:first-child{margin-bottom:7px}
 .workspace.view-quiz .challenge-header .challenge-eyebrow{font-size:18px;letter-spacing:0}
 .workspace.view-quiz .challenge-count{font-size:24px}
 .workspace.view-quiz .challenge-body{container:tablet-play / size;min-width:0;min-height:0;overflow:auto;justify-content:safe center}
 .workspace.view-quiz .challenge-game-holder{height:100%;display:grid;align-items:center;min-height:0}
 .workspace.view-quiz .challenge-type-microgame .challenge-body{display:flex}
 .workspace.view-quiz .challenge-footer{margin-top:8px;padding-top:8px;gap:10px 18px;min-height:54px;flex-wrap:nowrap}
 .workspace.view-quiz .challenge-footer-actions{width:auto;margin-inline:0;flex:none;gap:10px;padding:0}
 .workspace.view-quiz .challenge-footer .challenge-primary{min-height:48px;min-width:150px;font-size:21px;padding:9px 20px}
 .workspace.view-quiz .challenge-footer .challenge-feedback{font-size:18px;line-height:1.4;text-align:left}
 .workspace.view-quiz .challenge-footer .challenge-feedback p{margin:3px 0 0;line-height:1.4}
 .workspace.view-quiz .challenge-footer .challenge-feedback .challenge-text-button{display:inline-flex;min-height:40px;margin:0 0 0 12px;padding:3px 6px}
 .workspace.view-quiz .challenge-footer .challenge-feedback strong{font-size:20px}
 .workspace.view-quiz .challenge-shell .challenge-sound-layout{width:100%;max-width:1000px;gap:30px;padding:8px;grid-template-columns:minmax(220px,.8fr) minmax(0,1.2fr)}
 .workspace.view-quiz .challenge-shell .challenge-sound-stage.is-walnut-market{width:min(100%,320px);max-height:100cqh;aspect-ratio:6/5}
 .workspace.view-quiz .challenge-shell .challenge-sound-work .challenge-prompt{font-size:28px;line-height:1.4}
 .workspace.view-quiz .challenge-shell .challenge-sound-work .challenge-audio-status{font-size:17px;min-height:0;margin-top:12px}
 .workspace.view-quiz .challenge-shell .challenge-shelves{gap:14px}
 .workspace.view-quiz .challenge-shell .challenge-shelf{min-height:90px}
 .workspace.view-quiz .challenge-writing-layout{min-height:0;max-width:1050px;margin:auto;width:100%;align-items:center}
 .workspace.view-quiz .challenge-writing .cw-board{width:min(100%,300px)}
 .workspace.view-quiz .challenge-writing button{font-size:19px;min-height:48px}
 .workspace.view-quiz .challenge-writing .cw-status{font-size:17px;line-height:1.4}
 .workspace.view-quiz .challenge-shell.challenge-results{padding:18px 28px;overflow:auto}
 .workspace.view-quiz .challenge-results-heading{margin-bottom:14px}
 .workspace.view-quiz .challenge-result-list{max-width:900px;margin-bottom:15px;gap:8px}
 .workspace.view-quiz .challenge-result-row{min-height:60px;padding:8px 14px}
 .workspace.view-quiz .challenge-results-actions{padding:0}
}

@media (min-width:701px) and (orientation:landscape){
 .workspace.view-quiz .challenge-game-holder>section{max-width:none;width:100%;margin:0;min-height:0;gap:10px 24px}
 .workspace.view-quiz .poem-goose-game{grid-template-columns:minmax(0,1.65fr) minmax(240px,.8fr);grid-template-rows:auto auto 1fr;align-content:center;align-items:center}
 .workspace.view-quiz .poem-goose-game .goose-picture{grid-column:1;grid-row:1/4;width:min(100%,calc(100cqh * 1.5));height:auto;aspect-ratio:3/2;align-self:center;justify-self:center}
 .workspace.view-quiz .poem-goose-game .goose-instruction{grid-column:2;align-self:end}
 .workspace.view-quiz .poem-goose-game .goose-instruction p{font-size:24px;line-height:1.45}
 .workspace.view-quiz .poem-goose-game .goose-palette{grid-column:2;display:grid;grid-template-columns:minmax(0,1fr);justify-content:stretch;gap:12px;padding:0}
 .workspace.view-quiz .poem-goose-game .goose-paint{width:100%;max-width:none;min-height:58px;font-size:25px}
 .workspace.view-quiz .poem-goose-game .goose-feedback{grid-column:2;align-self:start;font-size:19px;line-height:1.4;min-height:0}
 .workspace.view-quiz .farewell-story{grid-template-columns:minmax(0,1.5fr) minmax(290px,1fr);grid-template-rows:auto auto auto auto auto auto;align-content:center;align-items:center}
 .workspace.view-quiz .farewell-story>*{grid-column:2}
 .workspace.view-quiz .farewell-story .fs-stage{grid-column:1;grid-row:1/6;width:min(100%,calc((100cqh - 58px) * 1.5));height:auto;aspect-ratio:3/2;justify-self:center;align-self:center}
 .workspace.view-quiz .farewell-story .fs-verse{grid-column:1;grid-row:6;font-size:27px;line-height:1.4;letter-spacing:.04em}
 .workspace.view-quiz .farewell-story .fs-header{grid-row:1}
 .workspace.view-quiz .farewell-story .fs-header h3{font-size:24px;line-height:1.35}
 .workspace.view-quiz .farewell-story .fs-eyebrow{display:none}
 .workspace.view-quiz .farewell-story .fs-task{grid-row:2;font-size:19px;line-height:1.4}
 .workspace.view-quiz .farewell-story .fs-rhythm,.workspace.view-quiz .farewell-story .fs-compose{grid-row:3}
 .workspace.view-quiz .farewell-story .fs-actions{grid-row:4;gap:8px}
 .workspace.view-quiz .farewell-story .fs-actions button{min-height:48px;padding:8px 15px;font-size:20px}
 .workspace.view-quiz .farewell-story .fs-feedback{grid-row:5/7;min-height:0;font-size:18px;line-height:1.4}
 .workspace.view-quiz .farewell-story .fs-feet button{min-height:55px;width:46%}
 .workspace.view-quiz .farewell-story .fs-compose{gap:8px}
 .workspace.view-quiz .farewell-story .fs-slot{min-width:52px}
 .workspace.view-quiz .poem-view-game{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(280px,.9fr);align-content:center;align-items:center}
 .workspace.view-quiz .poem-view-game>*{grid-column:2}
 .workspace.view-quiz .poem-view-game .pvg-stage{grid-column:1;grid-row:1/9;width:min(100%,calc(100cqh * 1.5));height:auto;max-height:none;aspect-ratio:3/2;justify-self:center;align-self:center}
 .workspace.view-quiz .poem-view-game .pvg-heading h3{font-size:25px;margin:0}
 .workspace.view-quiz .poem-view-game .pvg-camera-control{padding:0;gap:10px;font-size:20px}
 .workspace.view-quiz .poem-view-game .pvg-photo-tray{gap:8px;flex-wrap:wrap}
 .workspace.view-quiz .poem-view-game .pvg-status{font-size:18px;line-height:1.4;min-height:0}
 .workspace.view-quiz .poem-garden{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(250px,.8fr);grid-template-rows:auto auto 1fr;align-content:center;align-items:center}
 .workspace.view-quiz .poem-garden .gr-picture{grid-column:1;grid-row:1/4;width:min(100%,calc(100cqh * 1.5));height:auto;aspect-ratio:3/2;justify-self:center;align-self:center}
 .workspace.view-quiz .poem-garden .gr-instruction{grid-column:2;display:grid;gap:14px;margin:0;align-self:end}
 .workspace.view-quiz .poem-garden .gr-instruction p{font-size:24px;line-height:1.45}
 .workspace.view-quiz .poem-garden .gr-count{justify-self:center;font-size:21px}
 .workspace.view-quiz .poem-garden .gr-actionline{grid-column:2;flex-wrap:wrap;justify-content:center;margin:0}
 .workspace.view-quiz .poem-garden .gr-feedback{grid-column:2;align-self:start;min-height:0;font-size:20px;line-height:1.5;margin:0}
 .workspace.view-quiz .river-puzzle-game{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(280px,.9fr);grid-template-rows:auto auto auto auto;align-content:center;align-items:center}
 .workspace.view-quiz .river-puzzle-game .river-puzzle-work{display:contents}
 .workspace.view-quiz .river-puzzle-game .river-puzzle-board{grid-column:1;grid-row:1/5;width:min(100%,calc(100cqh * 1.5));height:auto;max-width:none;aspect-ratio:3/2;justify-self:center;align-self:center}
 .workspace.view-quiz .river-puzzle-game .river-puzzle-heading{grid-column:2;grid-row:1}
 .workspace.view-quiz .river-puzzle-game .river-puzzle-heading>div>span{display:none}
 .workspace.view-quiz .river-puzzle-game .river-puzzle-heading h3{font-size:25px}
 .workspace.view-quiz .river-puzzle-game .river-puzzle-side{grid-column:2;grid-row:2;gap:12px}
 .workspace.view-quiz .river-puzzle-game .river-puzzle-tray{width:min(100%,280px);align-self:center}
 .workspace.view-quiz .river-puzzle-game .river-puzzle-actions{grid-column:2;grid-row:3}
 .workspace.view-quiz .river-puzzle-game .river-puzzle-status{grid-column:2;grid-row:4;font-size:18px;line-height:1.4;min-height:0}
 .workspace.view-quiz .rain-catcher{grid-template-columns:minmax(0,1.65fr) minmax(280px,.9fr);align-content:center;align-items:center}
 .workspace.view-quiz .rain-catcher>*{grid-column:2}
 .workspace.view-quiz .rain-catcher .rc-field{grid-column:1;grid-row:1/10;width:min(100%,calc(100cqh * 1.5));height:auto;min-height:0;max-height:none;aspect-ratio:3/2;justify-self:center;align-self:center}
 .workspace.view-quiz .rain-catcher .rc-heading h3{font-size:27px}
 .workspace.view-quiz .rain-catcher .rc-collection{gap:7px}
 .workspace.view-quiz .rain-catcher .rc-mission{width:100%;font-size:20px}
 .workspace.view-quiz .rain-catcher .rc-controls{gap:9px;grid-template-columns:52px minmax(0,1fr) 52px}
 .workspace.view-quiz .rain-catcher .rc-status{min-height:0;font-size:18px;line-height:1.4}
 .workspace.view-quiz .challenge-writing-layout{display:grid;grid-template-columns:minmax(220px,.7fr) minmax(440px,1.3fr);gap:24px}
 .workspace.view-quiz .challenge-writing-heading .challenge-prompt{font-size:27px;line-height:1.45}
 .workspace.view-quiz .challenge-writing-holder{min-width:0}
 .workspace.view-quiz .challenge-writing{max-width:none;display:grid;grid-template-columns:minmax(0,1fr) 145px;gap:8px 16px;align-items:center}
 .workspace.view-quiz .challenge-writing .cw-board{grid-column:1;grid-row:1/4;width:min(100%,calc(100cqh - 55px));max-width:330px;margin:0;justify-self:center}
 .workspace.view-quiz .challenge-writing .cw-controls{grid-column:2;grid-row:1;flex-direction:column;gap:10px}
 .workspace.view-quiz .challenge-writing .cw-tools,.workspace.view-quiz .challenge-writing .cw-submit{display:flex;flex-direction:column;gap:10px}
 .workspace.view-quiz .challenge-writing .cw-skip{flex-basis:auto;font-size:17px;line-height:1.4;padding:6px 2px}
 .workspace.view-quiz .challenge-writing .cw-status{grid-column:1/-1;grid-row:4;margin:0;min-height:0}
 .workspace.view-quiz .challenge-writing .cw-review{grid-column:2;grid-row:2/4}
 .workspace.view-quiz .challenge-writing .cw-answer{flex-wrap:wrap;gap:6px;margin:0 0 8px}
 .workspace.view-quiz .challenge-writing .cw-review-actions{gap:8px}
 .workspace.view-quiz .challenge-writing.is-answered .cw-board{width:min(100%,calc(100cqh - 55px));max-width:280px}
}

/* On a taller landscape screen, use the right column for comfortable reading
   and touch targets. Scene widths and aspect ratios stay unchanged. */
@media (min-width:1000px) and (min-height:740px) and (orientation:landscape){
 .workspace.view-quiz .challenge-game-holder>section{row-gap:16px}
 .workspace.view-quiz .poem-goose-game .goose-instruction p,
 .workspace.view-quiz .poem-garden .gr-instruction p{font-size:29px;line-height:1.45}
 .workspace.view-quiz .poem-goose-game .goose-progress{font-size:22px}
 .workspace.view-quiz .poem-goose-game .goose-palette{gap:16px}
 .workspace.view-quiz .poem-goose-game .goose-paint{min-height:78px;font-size:29px;gap:16px;border-radius:20px}
 .workspace.view-quiz .poem-goose-game .goose-paint i{width:38px;height:38px}
 .workspace.view-quiz .poem-goose-game .goose-feedback{font-size:22px;line-height:1.5}
 .workspace.view-quiz .farewell-story .fs-header h3{font-size:29px;line-height:1.4}
 .workspace.view-quiz .farewell-story .fs-progress{font-size:22px}
 .workspace.view-quiz .farewell-story .fs-task{font-size:23px;line-height:1.5}
 .workspace.view-quiz .farewell-story .fs-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 .workspace.view-quiz .farewell-story .fs-actions button{width:100%;min-height:60px;font-size:22px;padding:11px 9px}
 .workspace.view-quiz .farewell-story .fs-actions svg{width:26px;height:26px}
 .workspace.view-quiz .farewell-story .fs-feedback{font-size:21px;line-height:1.5}
 .workspace.view-quiz .farewell-story .fs-rhythm{gap:16px}
 .workspace.view-quiz .farewell-story .fs-beats i{width:17px;height:17px}
 .workspace.view-quiz .farewell-story .fs-feet button{min-height:78px;font-size:29px}
 .workspace.view-quiz .farewell-story .fs-feet button span{font-size:37px}
 .workspace.view-quiz .farewell-story .fs-compose{gap:16px}
 .workspace.view-quiz .farewell-story .fs-line{font-size:28px;gap:7px}
 .workspace.view-quiz .farewell-story .fs-slot{min-width:58px;min-height:62px}
 .workspace.view-quiz .farewell-story .fs-tickets button{font-size:29px;min-width:80px;min-height:68px}
 .workspace.view-quiz .poem-view-game .pvg-heading h3{font-size:30px;line-height:1.45}
 .workspace.view-quiz .poem-view-game .pvg-camera-control{font-size:24px;gap:12px}
 .workspace.view-quiz .poem-view-game .pvg-camera-control input{height:62px}
 .workspace.view-quiz .poem-view-game .pvg-actions{display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
 .workspace.view-quiz .poem-view-game .pvg-actions button{width:100%;min-height:64px;font-size:24px}
 .workspace.view-quiz .poem-view-game .pvg-actions svg{width:29px;height:29px}
 .workspace.view-quiz .poem-view-game .pvg-photo-tray{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 .workspace.view-quiz .poem-view-game .pvg-photo-tray figure{flex-direction:column;gap:8px;padding:10px}
 .workspace.view-quiz .poem-view-game .pvg-photo-image{width:100%;max-width:120px}
 .workspace.view-quiz .poem-view-game .pvg-photo-tray figcaption{font-size:23px}
 .workspace.view-quiz .poem-view-game .pvg-status{font-size:21px;line-height:1.5}
 .workspace.view-quiz .poem-garden .gr-instruction{gap:20px}
 .workspace.view-quiz .poem-garden .gr-count{font-size:27px;min-width:102px;padding:9px 18px;border-radius:24px}
 .workspace.view-quiz .poem-garden .gr-actionline{display:grid;justify-content:stretch;gap:16px}
 .workspace.view-quiz .poem-garden .gr-method{font-size:23px;line-height:1.5;text-align:center}
 .workspace.view-quiz .poem-garden .gr-audio{min-height:66px;font-size:25px;width:100%;border-radius:18px}
 .workspace.view-quiz .poem-garden .gr-feedback{font-size:23px;line-height:1.55}
 .workspace.view-quiz .river-puzzle-game .river-puzzle-heading h3{font-size:29px;line-height:1.4}
 .workspace.view-quiz .river-puzzle-game .river-puzzle-heading b{font-size:22px;padding:8px 12px}
 .workspace.view-quiz .river-puzzle-game .river-puzzle-side{gap:16px}
 .workspace.view-quiz .river-puzzle-game .river-puzzle-instruction{font-size:23px;line-height:1.45}
 .workspace.view-quiz .river-puzzle-game .river-puzzle-tray{width:min(100%,330px);padding:12px;gap:10px;border-radius:18px}
 .workspace.view-quiz .river-puzzle-game .river-puzzle-actions{display:grid;grid-template-columns:minmax(0,1fr)}
 .workspace.view-quiz .river-puzzle-game .river-puzzle-actions button{min-height:60px;font-size:23px;width:100%}
 .workspace.view-quiz .river-puzzle-game .river-puzzle-status{font-size:21px;line-height:1.45}
 .workspace.view-quiz .rain-catcher .rc-heading h3{font-size:31px}
 .workspace.view-quiz .rain-catcher .rc-round-count{font-size:21px}
 .workspace.view-quiz .rain-catcher .rc-collection{gap:10px}
 .workspace.view-quiz .rain-catcher .rc-collection>span{height:66px}
 .workspace.view-quiz .rain-catcher .rc-collection b{font-size:29px}
 .workspace.view-quiz .rain-catcher .rc-collection .is-earned b{font-size:33px}
 .workspace.view-quiz .rain-catcher .rc-mission{font-size:24px;min-height:74px;padding:7px 8px 7px 14px}
 .workspace.view-quiz .rain-catcher .rc-mission strong{font-size:35px;padding-inline:3px}
 .workspace.view-quiz .rain-catcher .rc-mission button{width:56px;height:56px}
 .workspace.view-quiz .rain-catcher .rc-mission svg{width:29px;height:29px}
 .workspace.view-quiz .rain-catcher .rc-controls{width:100%;grid-template-columns:64px minmax(0,1fr) 64px;gap:12px}
 .workspace.view-quiz .rain-catcher .rc-controls>button{min-height:68px;font-size:24px;padding:11px 8px}
 .workspace.view-quiz .rain-catcher .rc-controls>button:not(.rc-primary){font-size:35px}
 .workspace.view-quiz .rain-catcher .rc-slow-catch,.workspace.view-quiz .rain-catcher .rc-replay{width:100%;min-height:62px;font-size:23px}
}

@media (min-width:701px) and (orientation:portrait){
 .workspace.view-quiz .challenge-game-holder>section{max-width:760px;gap:12px}
 .workspace.view-quiz .poem-goose-game .goose-picture{width:min(100%,calc((100cqh - 170px) * 1.5));justify-self:center}
 .workspace.view-quiz .farewell-story .fs-stage{width:min(100%,calc((100cqh - 325px) * 1.5));justify-self:center}
 .workspace.view-quiz .farewell-story .fs-feedback{min-height:0}
 .workspace.view-quiz .poem-view-game .pvg-stage{width:min(100%,calc((100cqh - 270px) * 1.5));height:auto;max-height:none;align-self:center;aspect-ratio:3/2}
 .workspace.view-quiz .poem-garden .gr-picture{width:min(100%,calc((100cqh - 170px) * 1.5));margin-inline:auto}
 .workspace.view-quiz .rain-catcher .rc-field{width:min(100%,calc((100cqh - 300px) * 1.5));height:auto;min-height:210px;max-height:none;justify-self:center;aspect-ratio:3/2}
 .workspace.view-quiz .river-puzzle-game .river-puzzle-work{grid-template-columns:minmax(0,1.4fr) minmax(210px,.8fr);gap:15px}
 .workspace.view-quiz .challenge-writing-layout{gap:14px}
 .workspace.view-quiz .challenge-writing-heading .challenge-prompt{font-size:28px}
}

@media (min-width:1000px) and (max-width:1100px) and (min-height:740px) and (orientation:landscape){
 .workspace.view-quiz .challenge-game-holder>.poem-view-game{row-gap:12px}
 .workspace.view-quiz .poem-view-game .pvg-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 .workspace.view-quiz .poem-view-game .pvg-actions button{font-size:23px;padding-inline:10px;gap:7px}
 .workspace.view-quiz .poem-view-game .pvg-photo-image{max-width:105px}
}

/* Very short landscape windows still retain scrolling as a fallback; no
   overflow clipping is used to conceal a scene or an active control. */
@media (min-width:701px) and (orientation:landscape) and (max-height:650px){
 .workspace.view-quiz .lesson-bar:has(.shishi-touch-slot){min-height:74px;padding-block:0;margin-bottom:4px}
 .workspace.view-quiz .shishi-touch-slot{height:70px;--shishi-height:66px}
 .workspace.view-quiz .shishi-touch-slot .shishi-guide-art{height:66px}
 .workspace.view-quiz .challenge-shell{padding:8px 14px}
 .workspace.view-quiz .challenge-header{margin-bottom:4px;padding-bottom:4px}
 .workspace.view-quiz .challenge-game-holder>section{column-gap:20px;row-gap:8px}
 .workspace.view-quiz .challenge-footer{margin-top:6px;padding-top:6px}
 .workspace.view-quiz .challenge-footer .challenge-feedback{font-size:17px}
 .workspace.view-quiz .challenge-shell .challenge-sound-stage.is-walnut-market{width:min(100%,280px)}
 .workspace.view-quiz .poem-goose-game .goose-palette{gap:9px}
 .workspace.view-quiz .poem-goose-game .goose-paint{min-height:52px}
 .workspace.view-quiz .farewell-story .fs-header h3{font-size:22px}
 .workspace.view-quiz .farewell-story .fs-task,.workspace.view-quiz .farewell-story .fs-feedback{font-size:17px}
 .workspace.view-quiz .farewell-story .fs-actions button{font-size:18px;padding:7px 12px}
 .workspace.view-quiz .rain-catcher .rc-intro{padding:12px}
 .workspace.view-quiz .rain-catcher .rc-intro>div{padding:12px 16px}
 .workspace.view-quiz .rain-catcher .rc-intro-icon{width:26px;height:26px;margin-bottom:5px}
 .workspace.view-quiz .rain-catcher .rc-intro p{margin:6px 0 10px;font-size:18px}
 .workspace.view-quiz .rain-catcher .rc-collection>span{height:45px}
 .workspace.view-quiz .rain-catcher .rc-heading h3{font-size:25px}
 .workspace.view-quiz .river-puzzle-game .river-puzzle-tray{width:min(100%,230px);gap:6px;padding:7px}
 .workspace.view-quiz .river-puzzle-game .river-puzzle-side{gap:8px}
 .workspace.view-quiz .river-puzzle-game .river-puzzle-instruction{font-size:17px;line-height:1.4}
 .workspace.view-quiz .river-puzzle-game .river-puzzle-actions button{padding:8px 14px;font-size:18px;min-height:46px}
}

/* The instruction and controls fill the right side of the play board. Explicit
   rows keep the last useful action near its bottom without adding filler. */
@media (min-width:900px) and (min-height:620px) and (orientation:landscape){
 .workspace.view-quiz .challenge-game-holder>section{height:100%;align-content:stretch;column-gap:28px;row-gap:14px;grid-template-columns:minmax(0,1.35fr) minmax(310px,1fr)}
 .workspace.view-quiz .poem-goose-game{grid-template-rows:auto minmax(0,1fr) auto}
 .workspace.view-quiz .poem-goose-game .goose-instruction{align-self:start}
 .workspace.view-quiz .poem-goose-game .goose-instruction p{font-size:29px}
 .workspace.view-quiz .poem-goose-game .goose-palette{align-self:center;gap:16px;width:100%}
 .workspace.view-quiz .poem-goose-game .goose-paint{min-height:82px;font-size:30px}
 .workspace.view-quiz .poem-goose-game .goose-paint i{width:40px;height:40px}
 .workspace.view-quiz .poem-goose-game .goose-feedback{align-self:end;font-size:23px}
 .workspace.view-quiz .farewell-story{grid-template-rows:auto auto minmax(0,1fr) auto auto auto}
 .workspace.view-quiz .farewell-story .fs-header{align-self:start}
 .workspace.view-quiz .farewell-story .fs-header h3{font-size:30px}
 .workspace.view-quiz .farewell-story .fs-task{font-size:25px}
 .workspace.view-quiz .farewell-story .fs-feedback{align-self:end;font-size:23px}
 .workspace.view-quiz .farewell-story .fs-actions button{font-size:24px;min-height:64px}
 .workspace.view-quiz .poem-view-game{grid-template-rows:auto auto auto minmax(0,1fr) auto}
 .workspace.view-quiz .poem-view-game .pvg-stage{grid-row:1/6}
 .workspace.view-quiz .poem-view-game .pvg-heading{grid-row:1;align-self:start}
 .workspace.view-quiz .poem-view-game .pvg-camera-control{grid-row:2;font-size:25px}
 .workspace.view-quiz .poem-view-game .pvg-actions{grid-row:3;grid-template-columns:repeat(2,minmax(0,1fr))}
 .workspace.view-quiz .poem-view-game .pvg-actions button{font-size:24px;min-height:66px;padding-inline:8px}
 .workspace.view-quiz .poem-view-game .pvg-photo-tray{grid-row:4;align-self:stretch;align-items:stretch}
 .workspace.view-quiz .poem-view-game .pvg-photo-tray figure{justify-content:center;min-width:0;padding:12px 8px}
 .workspace.view-quiz .poem-view-game .pvg-photo-image{width:100%;max-width:145px;min-height:68px}
 .workspace.view-quiz .poem-view-game .pvg-photo-tray figcaption{font-size:25px}
 .workspace.view-quiz .poem-view-game .pvg-status{grid-row:5;align-self:end;font-size:22px}
 .workspace.view-quiz .poem-garden{grid-template-rows:auto minmax(0,1fr) auto}
 .workspace.view-quiz .poem-garden .gr-instruction{align-self:start;gap:22px}
 .workspace.view-quiz .poem-garden .gr-instruction p{font-size:31px;text-wrap:balance}
 .workspace.view-quiz .poem-garden .gr-count{font-size:30px;min-width:118px;padding:12px 22px}
 .workspace.view-quiz .poem-garden .gr-actionline{align-self:center;gap:22px;display:grid;justify-content:stretch}
 .workspace.view-quiz .poem-garden .gr-method{font-size:26px;text-align:center}
 .workspace.view-quiz .poem-garden .gr-audio{font-size:27px;min-height:78px;width:100%}
 .workspace.view-quiz .poem-garden .gr-feedback{align-self:end;font-size:25px}
 .workspace.view-quiz .river-puzzle-game{grid-template-rows:auto minmax(0,1fr) auto auto}
 .workspace.view-quiz .river-puzzle-game .river-puzzle-heading{align-self:start}
 .workspace.view-quiz .river-puzzle-game .river-puzzle-side{align-self:stretch;justify-content:space-evenly}
 .workspace.view-quiz .river-puzzle-game .river-puzzle-instruction{font-size:25px}
 .workspace.view-quiz .river-puzzle-game .river-puzzle-tray{width:min(100%,350px)}
 .workspace.view-quiz .river-puzzle-game .river-puzzle-actions button{font-size:25px;min-height:66px}
 .workspace.view-quiz .river-puzzle-game .river-puzzle-status{font-size:22px;align-self:end}
 .workspace.view-quiz .rain-catcher{grid-template-rows:auto minmax(78px,1fr) minmax(90px,1fr) auto auto}
 .workspace.view-quiz .rain-catcher .rc-field{grid-row:1/6}
 .workspace.view-quiz .rain-catcher .rc-heading{grid-row:1;align-self:start}
 .workspace.view-quiz .rain-catcher .rc-heading h3{font-size:33px}
 .workspace.view-quiz .rain-catcher .rc-collection{grid-row:2;align-self:center}
 .workspace.view-quiz .rain-catcher .rc-collection>span{height:78px}
 .workspace.view-quiz .rain-catcher .rc-collection b{font-size:32px}
 .workspace.view-quiz .rain-catcher .rc-mission{grid-row:3;align-self:center;font-size:26px;min-height:96px}
 .workspace.view-quiz .rain-catcher .rc-mission strong{font-size:39px}
 .workspace.view-quiz .rain-catcher .rc-controls{grid-row:4;align-self:end}
 .workspace.view-quiz .rain-catcher .rc-controls>button{min-height:76px;font-size:26px}
 .workspace.view-quiz .rain-catcher .rc-slow-catch{grid-row:5;align-self:end;font-size:25px;min-height:66px}
 .workspace.view-quiz .rain-catcher .rc-replay{grid-row:4;font-size:25px;min-height:70px}
}

@media (min-width:900px) and (min-height:620px) and (orientation:landscape){
 .workspace.view-quiz .challenge-game-holder>section{column-gap:24px;row-gap:12px}
 .workspace.view-quiz .poem-goose-game .goose-instruction p,
 .workspace.view-quiz .poem-garden .gr-instruction p,
 .workspace.view-quiz .farewell-story .fs-header h3,
 .workspace.view-quiz .poem-view-game .pvg-heading h3,
 .workspace.view-quiz .river-puzzle-game .river-puzzle-heading h3{font-size:clamp(28px,4.1vh,38px);line-height:1.4}
 .workspace.view-quiz .poem-goose-game .goose-paint{min-height:clamp(70px,11vh,108px);font-size:clamp(30px,4.1vh,39px)}
 .workspace.view-quiz .farewell-story .fs-task,
 .workspace.view-quiz .farewell-story .fs-feedback,
 .workspace.view-quiz .poem-garden .gr-method,
 .workspace.view-quiz .poem-garden .gr-feedback,
 .workspace.view-quiz .river-puzzle-game .river-puzzle-instruction,
 .workspace.view-quiz .poem-view-game .pvg-camera-control,
 .workspace.view-quiz .poem-view-game .pvg-photo-tray figcaption,
 .workspace.view-quiz .rain-catcher .rc-mission{font-size:clamp(25px,3.5vh,33px);line-height:1.4}
 .workspace.view-quiz .poem-goose-game .goose-feedback,
 .workspace.view-quiz .poem-view-game .pvg-status,
 .workspace.view-quiz .river-puzzle-game .river-puzzle-status{font-size:clamp(23px,3.2vh,30px);line-height:1.4}
 .workspace.view-quiz .poem-garden .gr-count{font-size:clamp(35px,5.3vh,52px);min-width:140px;padding:15px 24px}
 .workspace.view-quiz .poem-garden .gr-audio,
 .workspace.view-quiz .farewell-story .fs-actions button,
 .workspace.view-quiz .poem-view-game .pvg-actions button,
 .workspace.view-quiz .river-puzzle-game .river-puzzle-actions button{font-size:clamp(25px,3.6vh,34px);min-height:clamp(64px,9.5vh,96px)}
 .workspace.view-quiz .rain-catcher .rc-collection>span{height:clamp(70px,10vh,100px)}
 .workspace.view-quiz .rain-catcher .rc-mission strong{font-size:clamp(40px,5.7vh,54px)}
 .workspace.view-quiz .rain-catcher .rc-controls>button{font-size:clamp(26px,3.6vh,33px);min-height:clamp(66px,9vh,90px)}
}

/* The garden's two existing instructions become readable working areas, with
   the real weed counter and listening action filling the right column. */
@media (min-width:900px) and (min-height:620px) and (orientation:landscape){
 .workspace.view-quiz .poem-garden{grid-template-rows:minmax(0,1.05fr) minmax(0,1fr) auto}
 .workspace.view-quiz .poem-garden .gr-instruction{height:100%;width:100%;align-self:stretch;justify-items:center;align-content:center;gap:clamp(12px,2.5vh,28px);padding:clamp(12px,2vh,22px);border:1px solid #dae3cc;border-radius:24px;background:#f2f6e9}
 .workspace.view-quiz .poem-garden .gr-instruction p{font-size:clamp(28px,4.3vh,42px);text-align:center;line-height:1.4}
 .workspace.view-quiz .poem-garden .gr-count{display:grid;place-items:center;min-width:clamp(148px,19vw,244px);min-height:clamp(70px,12vh,130px);font-size:clamp(42px,7.4vh,76px);line-height:1.15;padding:8px 20px;border:1px solid #d1dfc5;border-radius:24px;background:#fffef6;font-weight:600}
 .workspace.view-quiz .poem-garden .gr-actionline{height:100%;align-self:stretch;grid-template-rows:auto minmax(60px,1fr);gap:clamp(10px,2vh,22px);padding:clamp(10px,1.8vh,20px);border:1px solid #dce4d0;border-radius:24px;background:#fffdf4}
 .workspace.view-quiz .poem-garden .gr-method{font-size:clamp(25px,3.8vh,36px);line-height:1.4;text-wrap:balance}
 .workspace.view-quiz .poem-garden .gr-audio{height:100%;font-size:clamp(28px,4.3vh,40px);min-height:60px;border-radius:20px;background:#eaf3e0}
 .workspace.view-quiz .poem-garden .gr-audio::before{font-size:1.2em}
 .workspace.view-quiz .poem-garden .gr-feedback:empty{display:none}
}
@media (min-width:900px) and (min-height:620px) and (max-height:820px) and (orientation:landscape){
 .workspace.view-quiz .poem-garden{grid-template-rows:minmax(132px,1.05fr) minmax(112px,1fr) auto;row-gap:10px}
 .workspace.view-quiz .poem-garden .gr-instruction{grid-template-columns:minmax(0,1fr) auto;gap:10px;padding:10px}
 .workspace.view-quiz .poem-garden .gr-instruction p{font-size:26px;line-height:1.35;text-wrap:pretty}
 .workspace.view-quiz .poem-garden .gr-count{min-width:90px;min-height:70px;padding:7px;font-size:36px;border-radius:20px}
 .workspace.view-quiz .poem-garden .gr-actionline{padding:10px;gap:8px}
 .workspace.view-quiz .poem-garden .gr-method{font-size:25px;line-height:1.35}
 .workspace.view-quiz .poem-garden .gr-feedback{font-size:23px;line-height:1.4}
}
@media (min-width:900px) and (min-height:620px) and (max-height:740px) and (orientation:landscape){
 .workspace.view-quiz .poem-view-game .pvg-camera-control{gap:5px}
 .workspace.view-quiz .poem-view-game .pvg-camera-control input{height:44px}
 .workspace.view-quiz .poem-view-game .pvg-photo-tray{gap:8px}
 .workspace.view-quiz .poem-view-game .pvg-photo-tray figure{flex-direction:row;gap:7px;padding:8px 6px;min-height:80px}
 .workspace.view-quiz .poem-view-game .pvg-photo-image{width:64px;max-width:64px;min-height:48px}
 .workspace.view-quiz .poem-view-game .pvg-photo-tray figcaption{font-size:23px}
 .workspace.view-quiz .poem-view-game .pvg-status{font-size:23px;line-height:1.35}
 .workspace.view-quiz .poem-view-game .pvg-actions button{font-size:23px;min-height:56px}
}

/* The two collected photos lead the mountain controls, with the full image
   filling each frame instead of a tiny thumbnail in an oversized panel. */
@media(min-width:701px) and (orientation:landscape){
 .workspace.view-quiz .mountain-game{grid-template-rows:auto auto auto minmax(0,1fr);align-content:stretch}
 .workspace.view-quiz .mountain-game .pvg-heading{display:none}
 .workspace.view-quiz .mountain-game .pvg-stage{grid-row:1/5}
 .workspace.view-quiz .mountain-game .pvg-photo-tray{grid-row:1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;height:auto;min-height:0;align-self:start;align-items:stretch}
 .workspace.view-quiz .mountain-game .pvg-photo-tray figure{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto;justify-content:stretch;align-content:stretch;gap:7px;padding:8px;min-height:0;opacity:1}
 .workspace.view-quiz .mountain-game .pvg-photo-image{width:100%;max-width:none;height:auto;min-height:0;aspect-ratio:3/2}
 .workspace.view-quiz .mountain-game .pvg-photo-image img{width:100%;height:100%;object-fit:contain}
 .workspace.view-quiz .mountain-game .pvg-photo-tray figcaption{font-size:clamp(22px,3.1vh,30px);text-align:center;white-space:nowrap}
 .workspace.view-quiz .mountain-game .pvg-camera-control{grid-row:2;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:8px;font-size:clamp(21px,3.2vh,29px)}
 .workspace.view-quiz .mountain-game .pvg-actions{grid-row:3;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 .workspace.view-quiz .mountain-game .pvg-actions button{font-size:clamp(22px,3.2vh,29px);min-height:clamp(54px,8vh,74px);padding:8px}
 .workspace.view-quiz .mountain-game .pvg-status{grid-row:4;align-self:center;font-size:clamp(23px,3.5vh,34px);line-height:1.5}
 .workspace.view-quiz .mountain-game .pvg-retry{grid-row:5}
 .workspace.view-quiz .river-puzzle-game .river-puzzle-tray{width:min(100%,350px,calc((100cqh - 228px) * 1.5));min-width:180px;min-height:0;aspect-ratio:3/2;gap:8px;padding:8px;align-self:center}
 .workspace.view-quiz .river-puzzle-game .river-puzzle-tray>.river-puzzle-piece,.workspace.view-quiz .river-puzzle-game .river-puzzle-tray>.river-tray-space{height:100%;aspect-ratio:auto}
 .workspace.view-quiz .river-puzzle-game .river-puzzle-side{min-height:0;gap:12px;justify-content:center}
 .workspace.view-quiz .river-puzzle-game .river-puzzle-actions{position:relative;z-index:1;align-self:center}
 .workspace.view-quiz .farewell-story .fs-header h3{font-size:clamp(28px,4.2vh,40px)}
 .workspace.view-quiz .farewell-story .fs-task,.workspace.view-quiz .farewell-story .fs-feedback{font-size:clamp(25px,3.7vh,35px);line-height:1.4}
 .workspace.view-quiz .farewell-story .fs-verse{font-size:clamp(29px,4.2vh,40px);letter-spacing:.02em}
 .workspace.view-quiz .farewell-story .fs-line{font-size:clamp(28px,4.1vh,38px)}
 .workspace.view-quiz .farewell-story .fs-tickets button{font-size:clamp(29px,4.2vh,40px)}
 .workspace.view-quiz .farewell-story .fs-dock span,.workspace.view-quiz .farewell-story .fs-friend{font-size:clamp(18px,2.7vh,25px)}
}

@media(min-width:701px) and (orientation:landscape){
 .workspace.view-quiz .river-puzzle-game.is-complete{grid-template-rows:auto minmax(0,1fr) auto}
 .workspace.view-quiz .river-puzzle-game.is-complete .river-puzzle-heading{display:flex;grid-row:1;align-self:start}
 .workspace.view-quiz .river-puzzle-game.is-complete .river-puzzle-board{grid-row:1/4}
 .workspace.view-quiz .river-puzzle-game.is-complete .river-puzzle-status{grid-row:2;align-self:center;font-size:clamp(27px,4vh,38px);line-height:1.6;text-wrap:balance}
 .workspace.view-quiz .river-puzzle-game.is-complete .river-puzzle-actions{grid-row:3;align-self:end}
}

/* Each farewell chapter owns the same complete right-hand activity area.
   Hidden controls no longer leave their old rows empty between instructions. */
@media(min-width:701px) and (orientation:landscape){
 .workspace.view-quiz .farewell-story{grid-template-columns:minmax(0,1.35fr) minmax(310px,1fr);grid-template-rows:minmax(0,1fr);align-items:stretch}
 .workspace.view-quiz .farewell-story .fs-stage{grid-column:1;grid-row:1;width:min(100%,calc(100cqh * 1.5));align-self:center}
 .workspace.view-quiz .farewell-story .fs-control-panel{grid-column:2;grid-row:1;height:100%;min-height:0;gap:clamp(10px,1.6vh,18px)}
 .workspace.view-quiz .farewell-story .fs-header{flex:none;align-items:center}
 .workspace.view-quiz .farewell-story .fs-header h3{font-size:clamp(27px,4vh,37px);line-height:1.3}
 .workspace.view-quiz .farewell-story .fs-progress{font-size:clamp(21px,3vh,28px)}
 .workspace.view-quiz .farewell-story .fs-activity{flex:1;min-height:0;justify-content:center;padding:clamp(14px,2vh,24px);gap:clamp(16px,2.8vh,30px)}
 .workspace.view-quiz .farewell-story .fs-verse{font-size:clamp(30px,4.6vh,47px);line-height:1.45;letter-spacing:0;flex:none}
 .workspace.view-quiz .farewell-story .fs-task{font-size:clamp(23px,3.5vh,33px);line-height:1.45;flex:none}
 .workspace.view-quiz .farewell-story .fs-rhythm,.workspace.view-quiz .farewell-story .fs-compose{flex:1;min-height:0;justify-content:center;gap:clamp(14px,2.5vh,28px)}
 .workspace.view-quiz .farewell-story .fs-beats{gap:clamp(14px,2vw,24px)}
 .workspace.view-quiz .farewell-story .fs-beats i{width:clamp(36px,5.5vh,56px);height:clamp(36px,5.5vh,56px);font-size:clamp(23px,3.3vh,32px)}
 .workspace.view-quiz .farewell-story .fs-feet{flex:1;max-height:180px;gap:14px}
 .workspace.view-quiz .farewell-story .fs-feet button{flex:1;width:100%;max-width:none;height:100%;min-height:76px;font-size:clamp(30px,4.7vh,46px);gap:8px;border-radius:20px}
 .workspace.view-quiz .farewell-story .fs-feet button span{font-size:1.2em}
 .workspace.view-quiz .farewell-story .fs-compose{gap:clamp(18px,3vh,32px)}
 .workspace.view-quiz .farewell-story .fs-line{font-size:clamp(27px,4.3vh,41px);gap:8px;flex:1;max-height:118px}
 .workspace.view-quiz .farewell-story .fs-slot{flex:1;min-width:0;min-height:58px;height:100%;padding:6px 2px}
 .workspace.view-quiz .farewell-story .fs-tickets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;flex:1;max-height:118px}
 .workspace.view-quiz .farewell-story .fs-tickets button{width:100%;min-width:0;min-height:62px;height:100%;font-size:clamp(28px,4.5vh,44px);padding:8px 4px}
 .workspace.view-quiz .farewell-story .fs-actions{flex:none;display:flex;flex-wrap:nowrap;gap:12px}
 .workspace.view-quiz .farewell-story .fs-actions button{flex:1;width:auto;min-height:clamp(56px,8vh,78px);font-size:clamp(24px,3.6vh,34px);padding:9px 8px}
 .workspace.view-quiz .farewell-story .fs-feedback{flex:none;font-size:clamp(22px,3.2vh,30px);line-height:1.4;min-height:0}
 .workspace.view-quiz .farewell-story[data-stage="0"] .fs-activity{gap:clamp(24px,5vh,48px)}
 .workspace.view-quiz .farewell-story[data-complete="true"] .fs-verse{font-size:clamp(33px,5vh,49px)}
 .workspace.view-quiz .farewell-story[data-stage="0"] .fs-control-panel,
 .workspace.view-quiz .farewell-story[data-complete="true"] .fs-control-panel{height:auto;align-self:center}
 .workspace.view-quiz .farewell-story[data-stage="0"] .fs-activity,
 .workspace.view-quiz .farewell-story[data-complete="true"] .fs-activity{flex:none;padding-block:clamp(24px,5vh,54px)}
 .workspace.view-quiz .farewell-story[data-stage="0"] .fs-task{font-size:clamp(26px,4vh,37px)}
}
@media(min-width:701px) and (max-height:740px) and (orientation:landscape){
 .workspace.view-quiz .farewell-story .fs-control-panel{gap:8px}
 .workspace.view-quiz .farewell-story .fs-activity{padding:12px;gap:10px}
 .workspace.view-quiz .farewell-story .fs-verse{font-size:29px}
 .workspace.view-quiz .farewell-story .fs-task{font-size:23px;line-height:1.35}
 .workspace.view-quiz .farewell-story .fs-rhythm,.workspace.view-quiz .farewell-story .fs-compose{gap:12px}
 .workspace.view-quiz .farewell-story .fs-feedback{font-size:21px}
 .workspace.view-quiz .farewell-story .fs-header h3{font-size:27px}
 .workspace.view-quiz .farewell-story .fs-beats i{width:34px;height:34px;font-size:22px}
 .workspace.view-quiz .farewell-story .fs-feet button{min-height:66px;font-size:30px}
 .workspace.view-quiz .farewell-story .fs-slot{min-height:52px;font-size:27px}
 .workspace.view-quiz .farewell-story .fs-tickets button{min-height:58px;font-size:28px}
}

/* dictation-layout.css */
/* One layout for the listening task, handwriting square and its three actions.
   Keep this after the general tablet/game sheets. */
.workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-body {container:dictation-work / size;}
.workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing-layout {
  display:grid;grid-template-columns:minmax(0,1fr);align-items:center;
  width:100%;max-width:720px;min-height:0;margin:auto;gap:18px;
}
.workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing-heading {
  min-width:0;padding:0;text-align:center;
}
.workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing-heading .challenge-prompt {
  margin:0 0 18px;font-family:var(--sans);font-size:30px;font-weight:500;
  line-height:1.5;letter-spacing:0;text-wrap:balance;
}
.workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing-prompts {
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;
  width:100%;max-width:420px;margin-inline:auto;
}
.workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing-prompts button,
.workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing-heading .cw-review button {
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  width:100%;min-width:0;min-height:66px;margin:0;padding:12px 8px;
  border:1px solid #bacdbc;border-radius:17px;background:#f0f6e9;color:#294f3d;
  font:500 23px/1.35 var(--sans);font-size:23px!important;
  cursor:pointer;touch-action:manipulation;
}
.workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing-prompts svg {
  flex:none;width:27px;height:27px;
}
.workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing-heading .challenge-audio-status {
  display:block;min-height:0;margin:12px 0 0;color:#526a58;
  font-size:18px;line-height:1.5;text-align:center;
}
.workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing-heading .challenge-audio-status:empty {display:none;}
.workspace.view-quiz .challenge-shell.challenge-type-dictation .cw-review {
  padding:0;text-align:center;grid-area:auto;width:100%;max-width:420px;margin:12px auto 0;
}
.workspace.view-quiz .challenge-shell.challenge-type-dictation .cw-review-actions {display:grid;grid-template-columns:minmax(0,1fr);gap:0;}
.workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing-holder {width:100%;min-width:0;}
.workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing.cw-expanded {
  --cw-pad-size:430px;
  display:grid;grid-template-columns:minmax(0,1fr);align-items:start;
  width:100%;max-width:430px;margin:0 auto;gap:12px;color:#233d32;
}
.workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing .cw-status {
  grid-column:1;grid-row:1;justify-self:center;
  width:min(100%,var(--cw-pad-size));min-height:29px;margin:0;
  font-size:21px!important;line-height:1.45;text-align:center;color:#365846;
  overflow-wrap:anywhere;text-wrap:balance;
}
.workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing .cw-status:empty {display:none;}
.workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing .cw-board {
  position:relative;grid-column:1;grid-row:2;justify-self:center;
  width:min(100%,var(--cw-pad-size));max-width:none;aspect-ratio:1;margin:0;
  overflow:hidden;border:1px solid #adc2b3;border-radius:22px;background-color:#fff;
  background-image:linear-gradient(90deg,transparent calc(50% - .5px),#dce4d9 calc(50% - .5px),#dce4d9 calc(50% + .5px),transparent calc(50% + .5px)),linear-gradient(transparent calc(50% - .5px),#dce4d9 calc(50% - .5px),#dce4d9 calc(50% + .5px),transparent calc(50% + .5px));
}
.workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing .cw-board,
.workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing .cw-board * {
  touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;
}
.workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing canvas {
  position:absolute;inset:0;display:block;width:100%;height:100%;cursor:crosshair;background:#fff;
}
.workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing .cw-animation {
  position:absolute;inset:0;display:grid;place-items:center;min-width:0;min-height:0;
  background:#fff;font-family:var(--serif);line-height:1;
}
.workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing .cw-animation svg {
  position:absolute;inset:0;display:block;width:100%;height:100%;
}
.workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing .cw-actions {
  grid-column:1;grid-row:3;display:block;min-width:0;width:100%;align-self:center;
}
.workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing .cw-controls {
  grid-area:auto;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr) minmax(0,1fr);
  align-items:center;gap:10px;
}
.workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing button {
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  width:100%;min-width:0;min-height:56px;margin:0;padding:10px 8px;
  border:1px solid #c9d8c9;border-radius:15px;background:#fffef8;color:#294c3b;
  font:500 22px/1.35 var(--sans);cursor:pointer;touch-action:manipulation;
}
.workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing button.cw-primary {
  min-height:66px;font-size:25px;font-weight:600;color:#fff;background:#286650;border-color:#286650;
}
.workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing button.cw-skip {
  display:inline-flex;flex-basis:auto;background:#f6f7ee;color:#526450;border-color:#d9e2d3;
}
.workspace.view-quiz .challenge-shell.challenge-type-dictation button:focus-visible {outline:3px solid #528b76;outline-offset:3px;}
.workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing button:disabled,
.workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing-heading button:disabled {opacity:.48;cursor:default;}

@media (min-width:701px) {
  .workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing.cw-expanded {
    grid-template-columns:minmax(0,430px) 144px;justify-content:center;max-width:none;gap:12px 22px;
  }
  .workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing .cw-actions {grid-column:2;grid-row:2;}
  .workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing .cw-controls {grid-template-columns:minmax(0,1fr);gap:18px;}
  .workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing button {min-height:64px;font-size:24px;}
  .workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing button.cw-primary {min-height:86px;font-size:28px;}
}
@media (min-width:900px) and (orientation:landscape) {
  .workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing-layout {
    grid-template-columns:minmax(270px,.8fr) minmax(0,1.5fr);max-width:1280px;gap:30px;
  }
  .workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing-heading .challenge-prompt {font-size:34px;line-height:1.6;margin-bottom:28px;}
  .workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing-prompts {gap:14px;}
  .workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing-prompts button {min-height:76px;font-size:24px!important;}
  .workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing.cw-expanded {
    --cw-pad-size:min(460px,max(220px,calc(100cqh - 78px)));
    grid-template-columns:minmax(0,460px) 136px;gap:14px 22px;
  }
  .workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing .cw-status {font-size:23px!important;}
}
@media (min-width:701px) and (max-width:999px) and (orientation:landscape) {
  .workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing-layout {grid-template-columns:minmax(230px,.85fr) minmax(0,1.4fr);gap:18px;}
  .workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing-heading .challenge-prompt {font-size:28px;margin-bottom:18px;}
  .workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing-prompts {gap:9px;}
  .workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing-prompts button {gap:5px;font-size:21px!important;min-height:62px;padding-inline:5px;}
  .workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing.cw-expanded {--cw-pad-size:min(380px,max(170px,calc(100cqh - 74px)));grid-template-columns:minmax(0,1fr) 100px;gap:10px 14px;}
  .workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing button {font-size:21px;min-height:56px;}
  .workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing button.cw-primary {font-size:25px;min-height:72px;}
}
@media (max-width:700px) {
  .workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing-layout {gap:14px;flex:none;}
  .workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing-heading .challenge-prompt {font-size:27px;line-height:1.4;margin-bottom:12px;}
  .workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing-prompts {gap:10px;}
  .workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing-prompts button {min-height:56px;font-size:22px!important;border-radius:14px;}
  .workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing-heading .challenge-audio-status {font-size:16px;line-height:1.4;margin-top:8px;}
  .workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing.cw-expanded {--cw-pad-size:min(350px,max(210px,calc(100cqh - 328px)));gap:10px;}
  .workspace.view-quiz .challenge-shell.challenge-type-dictation:has(.cw-review:not([hidden])) .challenge-writing.cw-expanded {--cw-pad-size:min(350px,max(200px,calc(100cqh - 392px)));}
  .workspace.view-quiz .challenge-shell.challenge-type-dictation:has(.cw-review:not([hidden])) .challenge-audio-status {display:none;}
  .workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing .cw-status {font-size:19px!important;min-height:0;}
  .workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing .cw-controls {gap:8px;}
  .workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing button {min-height:52px;font-size:21px;border-radius:13px;}
  .workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing button.cw-primary {min-height:60px;font-size:24px;}
  .workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing-heading .cw-review button {min-height:52px;font-size:21px!important;}
}
@media (max-height:600px) and (orientation:landscape) {
  .workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing-layout {gap:16px;}
  .workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-body {justify-content:flex-start;}
  .workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing-layout {margin-block:auto;}
  .workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing-heading .challenge-prompt {font-size:25px;line-height:1.4;margin-bottom:14px;}
  .workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing-heading .challenge-audio-status {display:none;}
  .workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing-prompts button {min-height:52px;font-size:21px!important;}
  .workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing.cw-expanded {--cw-pad-size:min(350px,max(160px,calc(100cqh - 68px)));grid-template-columns:minmax(0,1fr) 106px;gap:8px 12px;}
  .workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing .cw-controls {gap:10px;}
  .workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing button {min-height:46px;font-size:20px;padding-block:8px;}
  .workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing button.cw-primary {min-height:60px;font-size:24px;}
  .workspace.view-quiz .challenge-shell.challenge-type-dictation .challenge-writing .cw-status {font-size:18px!important;}
}

/* pack.css */
/* The school badge and name hold the header's left corner on every screen with a header. */
.school-brand{display:flex;align-items:center;gap:12px;min-width:0}
.school-title{font-family:var(--serif);font-size:21px;font-weight:700;line-height:1.3;letter-spacing:2px;color:#2d6054;white-space:nowrap}
@media(max-width:820px){.school-brand{gap:10px}.school-title{font-size:18px;letter-spacing:1.5px}}
@media(max-width:700px){.school-brand{gap:8px}.school-title{font-size:16px;letter-spacing:1px}}
@media(max-width:360px){.school-title{font-size:15px;letter-spacing:.5px}}
/* ICP filing number, shown only on aiducation.hk.cn (inline script in index.html); the login screen leaves room for it. */
.icp-footer{padding:10px 16px 14px;text-align:center;font-family:var(--sans);font-size:12px;line-height:1.5}
.icp-footer a{color:#6b7d74;text-decoration:none}
.icp-footer a:hover{text-decoration:underline}
body:has(.icp-footer:not([hidden])) .school-login{min-height:calc(100svh - 44px)}
body:has(.lesson-shell) .icp-footer{display:none}
/* Last seen at the login form (index.html head script): the header and poem-loading text stay hidden until the form replaces them. */
html[data-school-boot=login] .site-header{display:none}
html[data-school-boot=login] #app>.loading-page>:is(.spinner,.spinner+p){visibility:hidden}
/* aiducation.hk.cn showcase (showcase.mjs): no school badge, name or header at all, and a dialog explaining account-only features. */
html[data-showcase] .site-header{display:none}
.showcase-dialog p{margin:0 0 20px;color:var(--ink);font:16px/1.75 var(--sans)}
.showcase-dialog .button{width:100%;min-height:48px;justify-content:center}
.school-badge{display:block;flex:none;width:auto;height:48px;margin-block:-4px}
@media(max-width:820px){.school-badge{height:42px}}
@media(max-width:700px){.school-badge{height:40px;margin-block:0}}
/* One-tap resource pack: a small pill under the library title (app.js renderPackButton). */
.library-heading .pack-button{margin-top:6px}
.pack-button{display:inline-flex;align-items:center;gap:7px;min-height:32px;padding:4px 14px;white-space:nowrap;border:1.5px solid #9dbca8;border-radius:100px;background:#fffdf6;color:#286249;font-family:var(--sans,inherit);font-size:13px;font-weight:600;line-height:1.3;letter-spacing:.3px;cursor:pointer;box-shadow:0 2px 6px #203e2510;transition:background .15s,border-color .15s}
.pack-button::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:#c57b13}
.pack-button:hover:not(:disabled){background:#edf1e6}
.pack-button:focus-visible{outline:3px solid #c57b13;outline-offset:3px}
.pack-button[aria-busy=true]::before{background:#286249;animation:pack-pulse 1.2s ease-in-out infinite}
.pack-button[data-state=paused]::before{background:#8a9a8c}
.pack-button[data-state=error]{border-color:#d9a08c;color:#a2492f}
.pack-button[data-state=error]::before{background:#c2533b}
.pack-button[data-state=complete]{border-color:#7fb08f;background:#eef7ee;color:#3c6b4d;cursor:default;box-shadow:none}
.pack-button[data-state=complete]::before{background:#3c8f5a}
.pack-button:disabled{opacity:1}
.pack-button[hidden]{display:none}
@keyframes pack-pulse{0%,100%{opacity:1}50%{opacity:.35}}
@media(max-width:820px){.pack-button{min-height:30px;font-size:12px;padding:3px 12px}}
@media(max-width:380px){.pack-button{gap:5px;padding:3px 10px;letter-spacing:0}}
@media(prefers-reduced-motion:reduce){.pack-button[aria-busy=true]::before{animation:none}}

/* syllable-parts.css */
/* The initial, final and tone of the character being practised after reading. */
.workspace.view-record .syllable-parts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;width:100%;max-width:340px;margin:8px auto 2px;padding:0;list-style:none}
.workspace.view-record .syllable-part{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:0;padding:5px 3px 6px;border:1px solid #d6e5da;border-bottom-width:3px;border-radius:12px;background:#f4faf5;text-align:center}
.workspace.view-record .syllable-part .part-name{font-size:14px;line-height:1.35;color:var(--muted)}
.workspace.view-record .syllable-part .part-sound{font:600 21px/1.3 var(--sans);color:var(--ink);white-space:nowrap}
.workspace.view-record .syllable-part .part-state{display:inline-flex;align-items:center;justify-content:center;gap:2px;font-size:14px;font-weight:600;line-height:1.35;color:var(--muted);white-space:nowrap}
.workspace.view-record .syllable-part .part-state svg{width:15px;height:15px;flex-shrink:0;stroke-width:3}
.workspace.view-record .syllable-part.ok{border-bottom-color:#9cc9ad}
.workspace.view-record .syllable-part.ok .part-state{color:var(--green)}
.workspace.view-record .syllable-part.near{background:#fff8e7;border-color:#ecdcae;border-bottom-color:#d1b35f}
.workspace.view-record .syllable-part.near .part-state{color:#855d0c}
.workspace.view-record .syllable-part.miss{background:#fff1ec;border-color:#efcabd;border-bottom-color:#d58a74}
.workspace.view-record .syllable-part.miss .part-state{color:var(--red)}
.workspace.view-record .syllable-part:is(.unknown,.none){background:#f7f7f3;border-color:#e4e4dc}
/* Phones: the cards sit beside the character so the next button stays in view. */
@media (max-width:700px) and (orientation:portrait){
.workspace.view-record .record-tool[data-step=words]:has(>.syllable-parts){display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:10px;align-items:center}
.workspace.view-record .record-tool[data-step=words]:has(>.syllable-parts)>*{grid-column:1/-1}
.workspace.view-record .record-tool[data-step=words]:has(>.syllable-parts)>.record-review{grid-column:1}
.workspace.view-record .record-tool[data-step=words]>.syllable-parts{grid-column:2;margin:0;gap:6px}
}
@media (max-width:400px) and (orientation:portrait){
.workspace.view-record .record-tool[data-step=words]:has(>.syllable-parts){column-gap:8px}
.workspace.view-record .syllable-part{padding:4px 2px 5px}
.workspace.view-record .syllable-part .part-name{font-size:13px}
.workspace.view-record .syllable-part .part-sound{font-size:18px}
.workspace.view-record .syllable-part .part-state{font-size:13px}
}
@media (max-width:340px) and (orientation:portrait){
.workspace.view-record .record-tool[data-step=words]>.syllable-parts{gap:4px}
.workspace.view-record .syllable-part .part-name,.workspace.view-record .syllable-part .part-state{font-size:12px}
.workspace.view-record .syllable-part .part-sound{font-size:16px}
.workspace.view-record .syllable-part .part-state svg{display:none}
}
/* Phone landscape: the character already has its own column, and the cards
   carry the hint, so it is left out to keep the next button in view. */
@media (max-width:1180px) and (max-height:550px) and (orientation:landscape){
.workspace.view-record .record-tool[data-step=words]>.syllable-parts{grid-column:2;margin:0 auto;gap:6px}
.workspace.view-record .syllable-part{padding:3px 2px 4px}
.workspace.view-record .syllable-part .part-name{font-size:13px;line-height:1.25}
.workspace.view-record .syllable-part .part-sound{font-size:18px;line-height:1.2}
.workspace.view-record .syllable-part .part-state{font-size:13px;line-height:1.3}
.workspace.view-record .record-tool[data-step=words]:has(>.syllable-parts)>.record-word-hint{display:none}
}
@media (max-width:760px) and (max-height:550px) and (orientation:landscape){
.workspace.view-record .syllable-part .part-sound{font-size:15px}
.workspace.view-record .syllable-part .part-state{font-size:12px}
.workspace.view-record .syllable-part .part-state svg{display:none}
}
/* Each part to practise, one per line under a word's score in the results.
   Always present, so the characters of one line stay level. */
.workspace.view-report .word-analysis .word-result .word-part{display:flex;flex-direction:column;align-items:center;gap:2px;min-height:1.35em;font:700 clamp(14px,1.45vw,17px)/1.35 var(--sans);color:#855d0c;white-space:nowrap}
.workspace.view-report .word-analysis .word-result.error .word-part{color:var(--red)}

/* chat-voice.css */
/* Speech input in the poet conversation: a quiet microphone beside the send
   button, red while listening, and one line of status below the box. */
.chat-form .chat-voice{background:#eef5e8;color:#3f7a57;border:1px solid #cfe0c6;box-shadow:none}
.chat-form .chat-voice:hover:not(:disabled){background:#e2eed9}
.chat-form .chat-voice.recording{background:#c9503f;border-color:#b0473a;color:#fff;animation:chat-voice-pulse 1.3s ease-in-out infinite}
.chat-form .chat-voice:disabled{opacity:.75;cursor:default}
.chat-form .chat-voice .spinner{width:18px;height:18px;margin:0}
.chat-voice-status{margin:7px 4px 0;font-size:13px;line-height:1.6;color:var(--muted)}
.chat-voice-status:empty{display:none}
.chat-voice-status.live{color:#b0473a;font-variant-numeric:tabular-nums}
.chat-voice-status.done{color:#3f7a57}
.chat-voice-status.error{color:var(--red)}
@keyframes chat-voice-pulse{0%,100%{box-shadow:0 0 0 0 rgba(201,80,63,.45)}50%{box-shadow:0 0 0 7px rgba(201,80,63,0)}}
@media(prefers-reduced-motion:reduce){.chat-form .chat-voice.recording{animation:none}}
@media(max-width:600px){.chat-voice-status{font-size:12px;margin-top:5px}}