/* Tinggushi — an illustrated poetry house. Shared Chinese/English system. */
:root{--paper:#f8f5ed;--ink:#263c42;--muted:#6c7776;--orange:#ad5139;--line:#d9dcd4;--sage:#e9ede4;--serif:'Noto Serif CJK SC','Songti SC',Georgia,serif}
body{background:var(--paper);color:var(--ink);-webkit-font-smoothing:antialiased}html{scroll-padding-top:110px}.wrap{max-width:1320px;padding-left:64px;padding-right:64px}header{padding:18px max(40px,calc((100vw - 1192px)/2));background:#f8f5edf5;border-bottom:1px solid #263c421c}.brand img{width:112px}nav{gap:32px;font-size:13px}.button{border-radius:3px;background:var(--ink);padding:15px 26px;font-weight:500;letter-spacing:.5px}.button.small{border-radius:3px}a.button:hover{background:#ad5139;border-color:#ad5139}.eyebrow{letter-spacing:2.5px;font-size:10px;color:#7b8279}.eyebrow i{background:#ad5139}h1,h2,h3{font-family:var(--serif)}h1{font-size:clamp(46px,4.7vw,70px);line-height:1.26;letter-spacing:1px}h2{font-size:44px;line-height:1.35}h3{font-size:24px}.hero{padding-top:74px;padding-bottom:80px;grid-template-columns:1fr 1.13fr;gap:45px;position:relative}.hero-copy .eyebrow{margin-bottom:28px}.intro{font-size:15px;line-height:2.1;margin-top:28px;margin-bottom:30px}.hero-art{grid-template-columns:.8fr 1.12fr .8fr;gap:16px;position:relative;padding:20px 0}.hero-art:before{content:'';position:absolute;width:85%;aspect-ratio:1;border:1px solid #a8b9b34f;border-radius:50%;left:8%;top:3%;z-index:-1}.hero-art:after{content:'听 · 读 · 玩';position:absolute;bottom:-25px;right:0;letter-spacing:7px;font-size:10px;color:#687771}.hero-poem{transition:transform .6s}.hero-poem img,.hero-poem-main img{border-radius:140px 140px 2px 2px;box-shadow:none}.hero-poem:first-child{transform:translateY(-35px)}.hero-poem:last-child{transform:translateY(40px)}.hero-poem-main{margin:0}.hero-poem>span{font-size:15px;letter-spacing:2px;margin-top:20px}.hero-poem>small{font-size:9px;line-height:1.8}.hero-note{margin-top:32px;border-top:1px solid var(--line);padding-top:20px;max-width:340px}.hero-note .reader-avatar{width:38px;height:38px}.promise{background:#eef0e9;border:0}.promise .wrap{padding-top:19px;padding-bottom:19px;letter-spacing:1px;font-size:11px}.promise b{font-size:8px;color:#95a49a}
/* Sample: a spacious illustration with the listening desk beside it. */
.trial-section{max-width:1320px;padding:0 64px;margin:88px auto 0}.trial-layout{padding:0;gap:76px;border-radius:0;background:none;grid-template-columns:.9fr 1.1fr;align-items:center}.trial-layout>div:first-child{background:#e8ece5;padding:32px 65px;position:relative}.trial-layout>div:first-child:after{content:'THE FIRST LITTLE POEM';position:absolute;bottom:13px;left:0;right:0;text-align:center;font-size:8px;letter-spacing:3px;color:#6c7e75}.trial-layout>div:first-child img{max-width:270px!important;border-radius:2px!important;box-shadow:0 12px 25px #243a2910}.trial-copy h2{font-size:42px;line-height:1.4;margin-bottom:24px}.trial-copy .poem-label{border-top:1px solid var(--line);padding-top:18px;margin-top:24px}.trial-copy .poem-label span{display:inline;margin-left:14px;font-size:10px}.trial-copy>p{font-size:14px;line-height:2}.pack-facts span{border:0;border-left:2px solid #a7b7a5;border-radius:0;padding:0 12px 0 8px;font-size:11px}.audio-label{display:block;margin-top:24px;font-size:11px}audio{border-radius:8px}.trial-copy .muted{font-size:11px;margin-top:15px}
/* Three pages of a small playbook, each activity uses the same art language. */
.play-section{padding-top:110px;padding-bottom:86px}.section-heading{align-items:flex-end;margin-bottom:40px}.section-heading>p{font-size:14px;line-height:2;max-width:390px}.play-grid{gap:24px}.play-grid article,.play-grid article:first-child{padding:24px 22px 20px;background:#f0f0e7;border:0;border-radius:2px;position:relative;overflow:hidden}.play-grid article:nth-child(2){background:#ecefe9}.play-grid article:nth-child(3){background:#f1eae0}.play-grid article+article{border:0}.play-grid .step{font:11px sans-serif;letter-spacing:3px;color:#7d897e;margin-bottom:20px;display:flex;align-items:center;gap:12px}.play-grid .step:after{content:'';width:30px;height:1px;background:#bfc5b5}.play-grid h3{font-size:24px;line-height:1.5;margin-bottom:12px}.play-grid article>p{font-size:13px;min-height:96px;line-height:1.9}.play-grid .mini-demo{border:0;border-radius:0;background:transparent;padding:0;overflow:visible;margin:12px 0 18px;min-height:270px;justify-content:flex-start;width:100%;gap:12px}.mini-stage{height:175px;flex-shrink:0;border-radius:80px 80px 2px 2px;overflow:hidden;position:relative;background:#e3e8da}.mini-demo .mini-caption{font-size:11px;line-height:1.8;min-height:40px;margin:0;color:#67756c}.mini-demo button{border:0;border-radius:3px;background:#fffdf7;padding:10px 15px;font-size:12px;min-height:44px;box-shadow:0 1px 0 #263c4215;color:var(--ink)}.mini-demo button:hover{background:var(--ink);color:#fff}.mini-demo .demo-buttons{gap:0;width:100%;align-items:center}.mini-demo .demo-replay{box-shadow:none;font-size:10px;padding:10px 8px}.play-grid .activity-link{width:100%;border-top:1px solid #a5af9f60;padding-top:13px;text-decoration:none;letter-spacing:.5px;font-size:11px;min-height:44px}.play-section>.muted{margin-top:24px;font-size:12px;max-width:800px;line-height:1.9}.wake-art{position:absolute;width:100%;height:100%;object-fit:cover;object-position:50% 55%;filter:brightness(.76) saturate(.8);transition:filter 1s,transform 1.8s}.dawn-disc{position:absolute;width:54px;height:54px;border-radius:50%;background:#fff7cd;right:27px;top:28px;opacity:0;transform:translateY(20px);transition:transform 1s,opacity 1s;box-shadow:0 0 35px #fff9ca55}.wake-letter{position:absolute;left:25px;top:22px;font:28px var(--serif);color:#fffdf3;opacity:0;transition:opacity .6s}.mini-z{font:italic 20px Georgia;color:#fffdf3;top:22px;right:26px;letter-spacing:5px}.awake .wake-art{filter:brightness(1.04) saturate(1);transform:scale(1.035)}.awake .dawn-disc{opacity:1;transform:translateY(0)}.awake .wake-letter{opacity:1}.mini-demo .relay-line{gap:12px;padding:16px 10px}.mini-demo .relay-head{font:52px var(--serif);color:var(--orange);padding-right:14px;border-right:1px solid #a9b4a7}.mini-demo .relay-head small{font:11px sans-serif;letter-spacing:1px;margin-bottom:9px}.mini-demo .relay-rest{font:26px var(--serif);letter-spacing:2px;max-width:155px}.mini-demo .relay-rest.relay-hidden{font-size:13px;letter-spacing:4px;line-height:2.8;color:#97a693}.mini-demo[data-demo=relay] .mini-stage{background:#dce4da}.mini-demo[data-demo=door] .mini-stage{background:#e8dcca}.mini-door{background:#f4eddc;border:0;border-radius:60px 60px 0 0;width:86px;height:124px;z-index:1;margin-top:25px;box-shadow:12px 9px 0 #c8b89b44}.mini-door .door-leaf{background:#6a8177;border:1px solid #80978c;border-radius:60px 60px 0 0;box-shadow:none}.door-leaf i{width:59px;height:100px;border:1px solid #c5d2bd60;border-radius:45px 45px 0 0}.mini-door .door-leaf:after{content:'';width:5px;height:5px;border-radius:50%;background:#e9d3a1;right:10px;top:70px}.mini-door .behind-door{font:32px var(--serif);color:#ad6b3f}.morning-orbit{position:absolute;width:112px;height:112px;border:1px solid #c7b797;border-radius:50%;top:18px;left:calc(50% - 56px)}
/* Collections: designed tabs, no browser-form appearance. */
.season-section{padding-top:80px;padding-bottom:88px}.series-picker{display:grid;grid-template-columns:145px 1fr auto;align-items:center;gap:24px;padding:0 0 26px;border-bottom:1px solid var(--line);margin-bottom:0}.series-identity{font-family:var(--serif);font-size:19px;line-height:1.5}.collection-kicker{display:block;font:8px sans-serif;letter-spacing:2px;color:#849087;margin-bottom:8px}.series-options{display:flex;gap:12px}.series-option{display:grid;grid-template-columns:auto 1fr;align-items:center;column-gap:16px;text-align:left;padding:14px 20px;border:1px solid #cdd4c9;background:transparent;min-height:72px;border-radius:3px}.series-option b{grid-row:span 2;font:30px Georgia;letter-spacing:-1px}.series-option span{font-size:12px}.series-option i{font-size:9px;font-style:normal;opacity:.7;margin-top:3px}.series-option.is-current{background:var(--ink);color:#fff;border-color:var(--ink)}.series-option.upcoming{border-style:dashed;color:#79847e;cursor:default}.series-picker #season-motion{border:0;background:transparent;border-radius:0;font-size:10px;letter-spacing:1px;padding:10px 0;margin:0}.season-nav{margin:24px 0 32px}.season-navigation-head{font-size:11px;letter-spacing:1px}.season-arrows button{width:38px;height:38px;border-color:#cfd7cd;font-size:16px}#season-tabs{gap:20px;padding:5px 3px 14px;scrollbar-width:none}#season-tabs::-webkit-scrollbar{display:none}#season-tabs button{flex-basis:194px;height:275px;border-radius:100px 100px 3px 3px;background:#e9eee4;color:var(--ink);border:1px solid transparent;box-shadow:none}#season-tabs button:after{background:linear-gradient(180deg,transparent 20%,#142a2233 45%,#142a22de 100%)}#season-tabs button[aria-selected=true]{box-shadow:0 0 0 2px #ad5139;outline-offset:4px}#season-tabs .season-tile-copy{padding:21px 17px}#season-tabs strong{font:21px var(--serif);line-height:1.4}#season-tabs .season-period{font-size:9px;letter-spacing:1px;margin-bottom:12px}#season-tabs .season-tile-status{font-size:9px;margin-top:10px}.season-scroll-hint{font-size:10px;letter-spacing:1px;margin-top:8px}.season-status{font-family:var(--serif);font-size:20px;padding-top:28px;padding-bottom:6px;color:var(--ink)}.poem-grid{gap:36px 24px}.poem-card img,.planned-art{border-radius:2px}.poem-card h3,.planned-poem h3{font-size:19px;margin-top:14px}.poem-number{border-radius:0;background:#fffdf2dd;font-size:9px;width:22px;height:22px;line-height:22px}.season-offer{border-radius:2px;background:#263c42;padding:40px 44px;margin-top:54px}.season-offer h3{font-family:var(--serif);font-size:32px}.season-offer .button{border-radius:2px}.offer-price{border-left:1px solid #d2d9ce33;padding-left:45px}.price{font-size:42px}.about{padding-top:60px;padding-bottom:85px;gap:80px;grid-template-columns:.7fr 1.3fr}.reader-portrait{width:230px;border-radius:120px 120px 2px 2px}.about h2{font-size:38px;line-height:1.5}.about p{font-size:14px;line-height:2.1}blockquote{font-family:var(--serif);font-size:21px;line-height:2;border-color:#bdb59c;padding-left:24px}.about-sign>span:last-child{font-size:10px;letter-spacing:2px}.faq{padding-top:72px;padding-bottom:72px}.faq h2{font-size:34px}.closing-note{padding-top:50px;padding-bottom:50px}.closing-note h2{font-size:34px}footer{padding-top:36px!important;padding-bottom:36px!important}.mini-demo button:focus-visible,.series-option:focus-visible{outline:2px solid var(--orange);outline-offset:4px}
@media(min-width:1500px){.hero{padding-top:94px;padding-bottom:100px}.hero-art{gap:20px}}
@media(max-width:1050px){.wrap{padding-left:32px;padding-right:32px}.hero{gap:28px}.trial-section{padding:0 32px}.trial-layout{gap:40px}.trial-layout>div:first-child{padding:28px 35px}.trial-copy h2{font-size:34px}.play-grid{gap:14px}.play-grid article,.play-grid article:first-child{padding:22px 16px}.mini-demo .relay-rest{font-size:22px}.series-picker{grid-template-columns:115px 1fr auto;gap:12px}.series-option{padding:12px 15px;column-gap:10px}.series-option b{font-size:26px}.play-grid h3{font-size:21px}}
@media(max-width:700px){html{scroll-padding-top:120px}.wrap{padding-left:22px;padding-right:22px}header{padding:12px 20px 0;gap:6px}.brand img{width:90px}nav{gap:20px;justify-content:space-between;font-size:11px;padding:4px 0 8px}.button{padding:13px 20px}.header-actions .button{font-size:10px;padding:9px 12px}.hero{padding-top:40px;padding-bottom:50px;gap:36px}.hero h1{font-size:46px;line-height:1.25}.hero-copy .eyebrow{font-size:9px;margin-bottom:23px}.intro{margin-top:20px;font-size:14px;line-height:1.9}.hero-art{max-width:460px;padding:16px 0 20px;gap:12px}.hero-poem:first-child{transform:translateY(-15px)}.hero-poem:last-child{transform:translateY(20px)}.hero-poem>span{font-size:11px;letter-spacing:1px;margin-top:14px}.hero-poem>small{font-size:8px}.hero-art:after{font-size:8px;bottom:-12px;letter-spacing:4px}.hero-note{max-width:none;padding-top:16px;margin-top:25px}.promise .wrap{font-size:10px;letter-spacing:0;padding-top:18px;padding-bottom:18px}.trial-section{padding:0 22px;margin-top:46px}.trial-layout{display:grid;grid-template-columns:1fr;gap:30px}.trial-layout>div:first-child{padding:24px 55px 32px}.trial-layout>div:first-child img{max-width:225px!important}.trial-copy h2{font-size:33px}.trial-copy p{font-size:13px}.trial-copy .poem-label span{font-size:9px}.trial-copy .eyebrow{font-size:9px}.play-section{padding-top:66px;padding-bottom:52px}.section-heading h2{font-size:33px}.section-heading>p{font-size:13px}.section-heading{margin-bottom:26px}.play-grid{gap:18px}.play-grid article,.play-grid article:first-child{padding:24px}.play-grid h3{font-size:25px}.play-grid article>p{min-height:0;font-size:13px}.play-grid .mini-demo{margin:14px 0 17px;min-height:0;gap:14px}.mini-stage{height:200px}.mini-demo .relay-rest{font-size:29px;max-width:185px}.mini-demo .mini-caption{min-height:20px;font-size:12px}.mini-demo button{font-size:12px}.mini-demo .demo-buttons{justify-content:center}.play-section>.muted{font-size:11px}.season-section{padding-top:48px;padding-bottom:50px}.series-picker{grid-template-columns:1fr auto;gap:16px;padding-bottom:20px}.series-identity{font-size:17px}.collection-kicker{font-size:7px;letter-spacing:1.8px;margin-bottom:5px}.series-options{grid-column:1/-1;grid-row:2;gap:10px}.series-option{flex:1;padding:12px 14px;column-gap:11px;min-width:0;min-height:74px}.series-option b{font-size:29px}.series-option span{font-size:11px}.series-option i{font-size:8px}.series-picker #season-motion{grid-column:2;grid-row:1;font-size:10px}.season-nav{margin-top:20px}#season-tabs{gap:15px}#season-tabs button{flex-basis:166px;height:246px}#season-tabs strong{font-size:19px}#season-tabs .season-tile-copy{padding:18px 14px}.season-status{font-size:18px}.poem-grid{gap:28px 17px}.poem-card h3,.planned-poem h3{font-size:17px}.season-offer{padding:28px 24px;margin-top:35px}.season-offer h3{font-size:28px}.offer-price{border-left:0;border-top:1px solid #d2d9ce33;padding:22px 0 0}.about{padding-top:25px;padding-bottom:50px;gap:26px}.reader-portrait{width:155px}.about h2{font-size:30px}.about p{font-size:13px}.about blockquote{font-size:19px}.faq{padding-top:46px;padding-bottom:46px}.faq h2{font-size:30px}.closing-note{padding-top:32px;padding-bottom:36px}.closing-note h2{font-size:29px}footer{padding-top:28px!important;padding-bottom:28px!important}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
html:lang(en) .hero-art:after{content:'LISTEN · READ · PLAY';letter-spacing:2px}html:lang(en) .hero-poem>span{letter-spacing:0;font-size:14px;line-height:1.5}html:lang(en) .hero-poem>small{letter-spacing:0}html:lang(en) .series-option span{font-size:11px}html:lang(en) .series-option i{font-size:8px}@media(max-width:700px){html:lang(en) .hero-poem>span{font-size:11px}html:lang(en) .series-option{column-gap:8px;padding:12px 10px}html:lang(en) .series-option b{font-size:24px}}
.benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:42px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding-top:34px;padding-bottom:32px}.benefits article{position:relative;padding-left:59px}.benefit-label{position:absolute;top:0;left:0;display:flex;flex-direction:column;gap:6px}.benefit-label small{font:9px Georgia;color:#8b9389;letter-spacing:1px}.benefit-label b{font:34px var(--serif);color:#ad5139}.benefits h3{font-size:19px;margin-bottom:10px;line-height:1.55}.benefits p{font-size:12px;line-height:1.95;color:var(--muted);margin:0}html:lang(en) .benefits article{padding-left:0}html:lang(en) .benefit-label{position:static;flex-direction:row;align-items:center;gap:10px;margin-bottom:15px}html:lang(en) .benefit-label b{font-size:26px}@media(max-width:850px){.benefits{gap:22px}.benefits article{padding-left:42px}.benefits h3{font-size:17px}.benefit-label b{font-size:28px}}@media(max-width:700px){.benefits{grid-template-columns:1fr;gap:0;padding-top:8px;padding-bottom:8px}.benefits article{padding:24px 0 24px 57px}.benefits article+article{border-top:1px solid var(--line)}.benefit-label{top:24px}.benefits h3{font-size:21px;margin-bottom:8px}.benefits p{font-size:13px}.benefit-label b{font-size:32px}html:lang(en) .benefits article{padding:24px 0}}
