/* Hallmark · shape: blue product cover then subject explorer · genre: editorial · theme: brand · redesign: full · hero: product cover · nav: open masthead · footer: compact colophon · signature: oversized slogan over three real practice screens
 * paper: brand blue and cool paper · accent: logo blue · display: PingFang SC · body: PingFang SC · axes: blue-cover/sans/blue · posture: product cover · v2.0.0 */
/* Hallmark · pre-emit critique: P4 H5 E4 S4 R5 V4 · weakest: E, alternate the cover, subject explorer, editorial learning rows and download desk */
/* Hallmark · waive 47b · real content inside screenshot frames · the user requests comparing actual practice, resources and school subjects together */
/* Hallmark · waive 11 · container scale on interactive screenshots · the user explicitly requires hover enlargement to read Chinese subject names */
@import url('./tokens.css?v=20261023');
@import url('./base.css?v=20261023');
html{scroll-behavior:smooth;scroll-padding-top:var(--space-lg)}a{text-decoration:none}button{cursor:pointer;color:inherit}.wrap{width:min(1184px,calc(100% - 96px));margin-inline:auto}
header{background:var(--color-surface)}nav{min-height:88px;display:flex;align-items:center;justify-content:space-between;gap:var(--space-md)}.brand{display:flex;align-items:center;gap:12px;font-weight:700;font-size:20px;white-space:nowrap}.brand img{width:44px;height:44px;border-radius:12px}.brand small{display:block;font-size:11px;color:var(--color-muted);font-weight:400;margin-top:4px}.navlinks{display:flex;gap:var(--space-lg);font-size:14px;color:var(--color-ink-2)}.navlinks a:hover{color:var(--color-accent)}.navbutton{display:inline-flex;align-items:center;min-height:44px;padding:var(--space-xs) 20px;background:var(--color-paper-2);border-radius:8px;font-size:14px;white-space:nowrap}.navbutton:hover{background:var(--color-paper-3)}
.hero{background:var(--color-cover);color:var(--color-cover-ink);--button-fill:var(--color-surface);--button-ink:var(--color-accent);overflow:clip}.hero,.downloads{--color-focus:var(--color-cover-ink)}.hero-inner{padding-top:var(--space-lg)}.hero-copy{text-align:center}.hero h1{font-size:clamp(44px,5.1vw,72px);line-height:1.2;font-weight:750;letter-spacing:-.045em;max-width:none;color:var(--color-cover-ink)}.hero-copy>p{font-size:17px;line-height:1.8;color:var(--color-cover-muted);margin-top:var(--space-sm)}.hero-actions{display:flex;justify-content:center;gap:var(--space-sm);margin-top:var(--space-md)}.button{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px var(--space-md);border:1px solid var(--color-rule);border-radius:8px;font-size:15px;font-weight:600;white-space:nowrap;transition:transform var(--dur-micro) var(--ease-out)}.primary{background:var(--button-fill);color:var(--button-ink);border-color:var(--button-fill)}.primary:hover{filter:brightness(.95)}.quiet{border-color:var(--color-cover-muted);color:var(--color-cover-ink);background:none}.quiet:hover{background:var(--color-hover)}.button:active,.navbutton:active{transform:translateY(1px)}button:disabled,[aria-disabled=true]{opacity:.55;cursor:not-allowed}[aria-busy=true]{cursor:progress}
.product-spread{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-lg);align-items:end;width:min(700px,100%);margin:var(--space-lg) auto 0}.product-spread figure{margin:0;min-width:0}.phone{cursor:zoom-in;position:relative;background:var(--color-surface);padding:4px;border-radius:16px;overflow:clip;transition:transform var(--dur-short) var(--ease-out)}.phone img{display:block;width:100%;height:100%;object-fit:cover;object-position:top;border-radius:12px}.product-spread .phone{height:320px}.product-spread .spread-side .phone{height:268px}.product-spread figcaption{font-size:12px;text-align:center;color:var(--color-cover-muted);margin:var(--space-sm) 0 20px;line-height:1.6}.phone:hover,.phone:focus-visible{transform:scale(1.12);z-index:3;box-shadow:0 16px 40px var(--color-shadow)}
.proof-strip{border-bottom:1px solid var(--color-rule);background:var(--color-surface)}.proof-inner{min-height:100px;display:flex;align-items:center;justify-content:space-between;gap:var(--space-lg)}.proof-inner p{font-size:14px;color:var(--color-muted)}.proof-inner p:first-child{display:flex;align-items:baseline;gap:12px}.proof-inner strong{font-size:36px;color:var(--color-accent);font-variant-numeric:tabular-nums;letter-spacing:-.04em}.section{padding-block:112px}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:var(--space-lg);margin-bottom:var(--space-xl)}h2{line-height:1.35;letter-spacing:-.04em}.section-heading>p{color:var(--color-ink-2);font-size:16px;line-height:1.9;max-width:28em}
.experience-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:var(--space-lg);align-items:stretch}.experience-copy{padding:var(--space-sm) var(--space-lg) var(--space-sm) 0;display:flex;flex-direction:column;justify-content:center}.tabs{display:flex;gap:var(--space-md);border-bottom:1px solid var(--color-rule)}.tabs button{background:none;border:0;border-bottom:3px solid var(--color-paper);padding:var(--space-sm) 0;min-height:56px;white-space:nowrap;font-size:16px;color:var(--color-muted)}.tabs button.active{color:var(--color-accent);border-bottom-color:var(--color-accent);font-weight:650}.tabs button:hover{color:var(--color-ink)}.tabs button:active{transform:translateY(1px)}#feature-panel{padding-top:var(--space-lg);min-height:212px}#feature-panel h3{font-size:25px;line-height:1.6;letter-spacing:-.02em}#feature-panel p{font-size:15px;line-height:1.95;color:var(--color-ink-2);margin-top:var(--space-sm)}.subject-examples{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-sm);margin-top:var(--space-sm)}.subject-examples span{font-size:14px;padding-left:12px;border-left:2px solid var(--color-accent);line-height:1.5}.experience-copy>small{display:block;font-size:12px;line-height:1.8;color:var(--color-muted);margin-top:var(--space-md)}.preview-stage{background:var(--color-paper-2);padding:var(--space-lg);border-radius:16px}.composition-title h3{font-size:23px;line-height:1.5}.composition-title>p{font-size:13px;color:var(--color-muted);margin-top:var(--space-xs)}.showcase-phones{display:flex;gap:var(--space-md);align-items:center;margin-top:var(--space-lg)}.showcase-phones .phone{width:calc(50% - 12px);height:420px;box-shadow:0 8px 24px var(--color-shadow)}.showcase-phones .secondary-phone{height:352px}.stage-bottom{font-size:12px;color:var(--color-muted);margin-top:var(--space-md)}
.learning-section{background:var(--color-paper-2);padding-block:var(--space-3xl)}.learning-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:var(--space-lg)}.learning-intro{padding-right:var(--space-lg)}.learning-intro>p{font-size:16px;line-height:1.95;color:var(--color-ink-2);margin-top:var(--space-md);max-width:21em}.text-link{display:inline-flex;font-size:15px;color:var(--color-accent);min-height:44px;align-items:center;text-decoration:underline;text-underline-offset:6px;margin-top:var(--space-md)}.feature-grid{display:flex;flex-direction:column;gap:var(--space-lg)}.feature-grid article{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);column-gap:var(--space-md);border-top:1px solid var(--color-rule);padding-top:var(--space-md)}.feature-grid h3{font-size:20px;line-height:1.6;grid-row:1/3;letter-spacing:-.02em}.feature-grid p{font-size:15px;line-height:1.9;color:var(--color-ink-2)}.feature-tags{display:flex;flex-wrap:wrap;gap:var(--space-sm);font-size:12px;color:var(--color-muted);margin-top:var(--space-sm)}.gallery-heading{display:flex;justify-content:space-between;align-items:end;gap:var(--space-lg);margin-bottom:var(--space-xl)}.gallery-heading p{font-size:16px;color:var(--color-ink-2);line-height:1.9}.screenshot-gallery{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--space-sm);align-items:start}.screenshot-gallery a{display:block;cursor:zoom-in;border-radius:16px;overflow:clip;transition:transform var(--dur-short) var(--ease-out)}.screenshot-gallery a:nth-child(even){margin-top:40px}.screenshot-gallery img{width:100%;height:auto}.screenshot-gallery a:hover,.screenshot-gallery a:focus-visible{transform:scale(1.1);z-index:2}.gallery-note{font-size:12px;color:var(--color-muted);margin-top:var(--space-md)}
.company-section{padding-block:var(--space-2xl);border-block:1px solid var(--color-rule)}.company-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--space-lg);align-items:center}.company-title h2{font-size:32px}.company-title>p{font-size:14px;color:var(--color-muted);margin-top:20px}.company-detail{padding-left:var(--space-lg)}.company-seal{display:flex;align-items:center;gap:var(--space-sm)}.company-seal svg{width:48px;height:48px;color:var(--color-accent)}.company-seal span{font-size:12px;color:var(--color-muted)}.company-seal small{font-size:19px;font-weight:650;color:var(--color-ink);display:block;margin-top:4px}.company-detail>p{font-size:15px;line-height:1.9;color:var(--color-ink-2);margin-top:20px}.company-facts{display:flex;flex-wrap:wrap;gap:var(--space-sm) var(--space-md);font-size:12px;color:var(--color-muted);margin-top:var(--space-md)}.company-facts b{color:var(--color-ink);font-weight:600}
.downloads{background:var(--color-ink);color:var(--color-paper);padding-block:80px;--button-fill:var(--color-surface);--button-ink:var(--color-ink)}.download-heading{display:flex;align-items:end;justify-content:space-between;gap:var(--space-lg);margin-bottom:var(--space-xl)}.download-heading h2{font-size:48px}.download-heading>p{font-size:16px;color:var(--color-cover-muted);line-height:1.8}.download-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-lg)}.download-grid article{border-top:1px solid var(--color-muted);padding-top:var(--space-md)}.download-grid h3{font-size:22px;line-height:1.5}.download-grid p{font-size:14px;color:var(--color-cover-muted);margin-top:12px;min-height:48px}.download-grid .button{width:100%;padding-inline:12px;font-size:14px;margin-top:var(--space-md)}.download-grid .outline{background:none;color:var(--color-paper);border-color:var(--color-cover-rule)}.download-grid .outline:hover{background:var(--color-ink-2)}.download-grid small{display:block;font-size:12px;color:var(--color-cover-muted);line-height:1.8;margin-top:12px}.download-tip{font-size:13px;line-height:1.8;color:var(--color-cover-muted);margin-top:40px}
.official{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:var(--space-lg);align-items:start}.official-heading h2{font-size:36px}.official-heading p{font-size:15px;line-height:1.9;color:var(--color-ink-2);margin-top:var(--space-md)}.social-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-md)}.qr-frame{border:0;display:block;width:100%;aspect-ratio:1;padding:var(--space-xs);background:var(--color-surface);border-radius:8px;cursor:zoom-in}.qr-frame img{width:100%;height:100%;object-fit:contain}.social-list small{display:block;font-size:12px;color:var(--color-muted);margin-top:var(--space-sm)}.social-list h3{font-size:15px;line-height:1.6;letter-spacing:0;margin-top:var(--space-xs)}.social-list p{font-size:12px;color:var(--color-muted);line-height:1.8;margin-top:var(--space-xs)}.view-code{min-height:36px;background:none;border:0;padding:0;color:var(--color-accent);font-size:13px;text-decoration:underline;text-underline-offset:4px;margin-top:var(--space-xs)}
footer{border-top:1px solid var(--color-rule);padding-block:var(--space-lg) var(--space-md)}.footer-top{display:flex;align-items:center;justify-content:space-between;gap:var(--space-md)}.footer-top>a:last-child{font-size:15px;color:var(--color-accent);text-decoration:underline;text-underline-offset:6px}.footer-bottom{display:flex;flex-wrap:wrap;gap:var(--space-sm) var(--space-lg);margin-top:var(--space-lg);font-size:12px;color:var(--color-muted)}
dialog{width:min(440px,calc(100% - 32px));max-height:90dvh;overflow-y:auto;background:var(--color-paper);color:var(--color-ink);padding:var(--space-lg);border:0;border-radius:16px}dialog::backdrop{background:var(--color-backdrop)}dialog>button{position:absolute;right:12px;top:12px;display:grid;place-items:center;width:40px;height:40px;padding:0;background:var(--color-paper-2);border:0;border-radius:50%;font-size:28px;z-index:4}dialog h3{font-size:20px;line-height:1.6;padding-right:var(--space-lg);margin-bottom:var(--space-md)}dialog>img{width:100%;height:auto}dialog>p{font-size:13px;line-height:1.8;color:var(--color-muted);margin-top:20px}dialog>a{display:inline-flex;align-items:center;min-height:44px;font-size:15px;text-decoration:underline;color:var(--color-accent);margin-top:12px}.image-viewer{width:min(960px,calc(100% - 24px));padding:var(--space-md);max-height:94dvh}.image-viewer>img{width:min(100%,740px);margin-inline:auto}.image-viewer>button{position:fixed;right:calc((100% - min(960px,100% - 24px))/2 + 12px);top:5dvh;box-shadow:0 4px 16px var(--color-shadow)}.image-viewer>p{text-align:center}#toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:500;max-width:calc(100% - 32px);background:var(--color-ink);color:var(--color-paper);padding:12px var(--space-md);border-radius:8px;font-size:14px;line-height:1.6;pointer-events:none;opacity:0}#toast.show{opacity:1}
@media(min-width:1440px){.hero-inner{padding-top:40px}.product-spread{width:760px}.product-spread .phone{height:372px}.product-spread .spread-side .phone{height:312px}}
@media(max-width:1000px){.wrap{width:calc(100% - 48px)}.navlinks{gap:20px}.hero h1{font-size:56px}.product-spread{width:640px}.product-spread .phone{height:344px}.product-spread .spread-side .phone{height:288px}.proof-inner{gap:var(--space-md)}.proof-inner p{font-size:12px}.section-heading h2{font-size:34px}.section-heading>p{font-size:14px}.experience-copy{padding-right:0}.tabs{gap:var(--space-sm)}.tabs button{font-size:14px}.preview-stage{padding:var(--space-md)}.showcase-phones{gap:var(--space-sm)}.showcase-phones .phone{width:calc(50% - 8px);height:352px}.showcase-phones .secondary-phone{height:288px}.composition-title h3{font-size:20px}.learning-intro{padding-right:0}.feature-grid article{display:block}.feature-grid p{margin-top:12px}.gallery-heading p{font-size:14px}.company-title h2{font-size:28px}.company-detail{padding-left:0}.download-grid{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:40px}.download-heading>p{max-width:20em;font-size:15px}.official{grid-template-columns:minmax(0,1fr)}.official-heading{display:flex;align-items:end;justify-content:space-between;gap:var(--space-md)}.official-heading p{margin-top:0}.social-list{max-width:760px}.screenshot-gallery{gap:12px}}
@media(max-width:700px){.wrap{width:calc(100% - 40px)}nav{min-height:76px;gap:12px}.brand{font-size:16px;gap:var(--space-xs)}.brand img{width:36px;height:36px}.brand small{font-size:10px}.navlinks{display:none}.navbutton{font-size:12px;min-height:40px;padding:var(--space-xs) 12px}.hero-inner{padding-top:40px}.hero h1{font-size:clamp(29px,7.5vw,50px);line-height:1.35;letter-spacing:-.045em}.hero-copy>p{font-size:14px;line-height:1.9;max-width:21em;margin:20px auto 0}.hero-actions{gap:12px;margin-top:var(--space-md)}.hero-actions .button{font-size:14px;padding-inline:20px;min-height:48px}.product-spread{gap:12px;margin-top:40px;width:100%;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr) minmax(0,1fr)}.product-spread .phone{height:220px;padding:4px;border-radius:12px}.product-spread .phone img{border-radius:8px}.product-spread .spread-side .phone{height:180px}.product-spread figcaption{font-size:10px;line-height:1.8;margin-block:12px var(--space-sm)}.proof-inner{min-height:112px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--space-xs) var(--space-sm);padding-block:20px}.proof-inner strong{font-size:30px}.proof-inner p:first-child{gap:var(--space-xs)}.proof-inner p{font-size:12px}.proof-inner p:last-child{grid-column:1/-1;font-size:11px}.section{padding-block:var(--space-2xl)}.section-heading{display:block;margin-bottom:var(--space-lg)}.section-heading h2{font-size:32px}.section-heading>p{font-size:14px;margin-top:20px}.experience-grid{grid-template-columns:minmax(0,1fr);gap:var(--space-lg)}.experience-copy{padding:0}.tabs{justify-content:space-between;gap:var(--space-sm)}.tabs button{font-size:15px;min-height:56px;padding-block:var(--space-sm)}#feature-panel{padding-top:var(--space-md);min-height:0}#feature-panel h3{font-size:23px}#feature-panel p{font-size:14px;margin-top:12px}.subject-examples{gap:var(--space-sm);margin-top:var(--space-md)}.subject-examples span{font-size:13px}.experience-copy>small{margin-top:20px}.preview-stage{padding:var(--space-md) 20px}.composition-title h3{font-size:22px}.showcase-phones{gap:var(--space-sm);margin-top:var(--space-md)}.showcase-phones .phone{height:340px;width:calc(50% - 8px)}.showcase-phones .secondary-phone{height:280px}.stage-bottom{font-size:11px;margin-top:20px}.learning-section{padding-block:var(--space-2xl)}.learning-grid{grid-template-columns:minmax(0,1fr);gap:var(--space-lg)}.learning-intro>p{font-size:15px;margin-top:20px;max-width:25em}.text-link{margin-top:12px}.feature-grid{gap:28px}.feature-grid article{display:grid;grid-template-columns:minmax(0,1fr);padding-top:20px;gap:12px}.feature-grid h3{grid-row:auto;font-size:21px}.feature-grid p{margin:0;font-size:14px}.feature-tags{margin-top:4px}.gallery-heading{display:block;margin-bottom:var(--space-lg)}.gallery-heading p{font-size:14px;margin-top:20px}.screenshot-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px var(--space-sm)}.screenshot-gallery a{border-radius:12px}.screenshot-gallery a:nth-child(even){margin-top:0}.screenshot-gallery a:last-child{grid-column:1/-1;width:calc(50% - 8px);justify-self:center}.gallery-note{font-size:11px;line-height:1.8;margin-top:20px}.company-section{padding-block:56px}.company-grid{grid-template-columns:minmax(0,1fr);gap:var(--space-lg)}.company-title h2{font-size:28px}.company-title>p{font-size:13px;margin-top:var(--space-sm)}.company-seal small{font-size:18px}.company-detail>p{font-size:14px;margin-top:20px}.company-facts{font-size:12px;gap:12px 20px;margin-top:20px}.downloads{padding-block:var(--space-2xl)}.download-heading{display:block;margin-bottom:var(--space-lg)}.download-heading h2{font-size:36px}.download-heading>p{font-size:14px;max-width:none;margin-top:20px}.download-grid{grid-template-columns:minmax(0,1fr);gap:var(--space-lg)}.download-grid article{padding-top:20px}.download-grid p{min-height:0;margin-top:var(--space-xs)}.download-grid .button{margin-top:20px;min-height:48px}.download-grid small{margin-top:12px}.download-tip{font-size:12px;margin-top:var(--space-lg)}.official-heading{display:block}.official-heading h2{font-size:32px}.official-heading p{font-size:14px;margin-top:20px}.social-list{grid-template-columns:minmax(0,1fr);gap:var(--space-lg)}.social-list article{display:grid;grid-template-columns:120px minmax(0,1fr);column-gap:var(--space-md);align-content:center}.qr-frame{width:120px;grid-row:1/5}.social-list small{margin-top:0}.social-list h3{font-size:16px;margin-top:4px}.social-list p{margin-top:4px}.view-code{margin-top:4px;justify-self:start}.footer-top .brand small{display:none}.footer-top>a:last-child{font-size:13px}.footer-bottom{font-size:11px;gap:12px 20px;margin-top:var(--space-md)}.image-viewer{padding:var(--space-sm)}.image-viewer>img{width:100%}}
@media(max-width:360px){.hero h1{font-size:28px}.hero-actions .button{padding-inline:var(--space-sm)}.product-spread .phone{height:196px}.product-spread .spread-side .phone{height:164px}.product-spread figcaption{font-size:9px}.proof-inner p{font-size:11px}.showcase-phones .phone{height:292px}.showcase-phones .secondary-phone{height:248px}.social-list article{column-gap:var(--space-sm)}.tabs button{font-size:14px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}

.douyin-crop,.modal-code{display:block;position:relative;width:100%;aspect-ratio:1;overflow:clip}.douyin-crop{height:100%}.qr-frame.douyin .douyin-crop>img,.douyin-modal .modal-code>img{position:absolute;left:-25%;top:-30%;width:150%;height:auto;max-width:none;object-fit:initial}.modal-code>img{display:block;width:100%;height:auto}