/* Longmò: warm illustrated villages, clear little surfaces, expressive controls. */
.activity-dialog{--atelier-art:url('./art/atelier-hsk-v2.webp');--activity-accent:#bf2845;--activity-dark:#51283a;--activity-surface:#ffefdc;background:#623847;isolation:isolate}
:root[data-system=traditional] .activity-dialog{--atelier-art:url('./art/atelier-tocfl-v2.webp');--activity-accent:#167bae;--activity-dark:#153d58;--activity-surface:#e5faff;background:#163955}
.activity-dialog::before{content:'';position:fixed;inset:0;max-width:700px;margin:auto;z-index:-1;background-image:linear-gradient(180deg,#101d3312,#17253630),var(--atelier-art);background-size:cover;background-position:center top;pointer-events:none}
.activity-dialog .activity-top{background:#253147e8;color:#fff5de;border:0;box-shadow:0 3px 15px #15233342;backdrop-filter:blur(10px)}
.activity-dialog .activity-top button{background:#ffffff1c;border:1px solid #ffffff50;color:white;box-shadow:0 3px 0 #0002;border-radius:17px;font-size:22px}
.activity-dialog .activity-main{max-width:600px;margin:auto;padding-top:30px!important;padding-bottom:44px!important}
.activity-dialog .activity-main>h1{font-size:30px;color:#fff7e8;text-shadow:0 2px 6px #10212bba;margin-bottom:18px;font-weight:850;letter-spacing:-.5px}
.activity-dialog .activity-main>small{display:inline-block;background:#213a50e8;color:#ffe4a6;border:1px solid #ffffff50;border-radius:25px;padding:7px 12px;font-size:11px;font-weight:800;letter-spacing:.6px}
.activity-dialog .activity-main>p:not(.activity-feedback):not(.activity-model):not(.activity-exercise-cn){color:#fff8ed;font-weight:550;text-shadow:0 1px 4px #15283e;background:#18364bbd;padding:12px 15px;border-radius:16px;font-size:14px;line-height:1.6}
.activity-dialog .activity-main button:not(.activity-word){border:2px solid #ffffff70;box-shadow:0 5px 0 #49283766,0 6px 12px #12304116;transition:transform .12s,box-shadow .12s;min-height:48px}
.activity-dialog .activity-main button:not(.activity-word):active{transform:translateY(3px);box-shadow:0 2px 0 #49283766}
.activity-dialog .activity-main button:focus-visible{outline:3px solid #ffe583;outline-offset:4px}
.activity-dialog .activity-main button:disabled{box-shadow:0 2px 0 #172b4230;opacity:.68}
.activity-dialog .activity-main .activity-primary{background:linear-gradient(160deg,var(--activity-accent),color-mix(in srgb,var(--activity-accent),#102832 18%));border-color:#ffffff40;color:white;box-shadow:0 5px 0 color-mix(in srgb,var(--activity-accent),#142f4b 35%);padding:15px 18px}
.activity-dialog .activity-hero{min-height:265px;background:linear-gradient(90deg,#172636df,#24344722),var(--atelier-art);background-size:cover;background-position:center 18%;border:2px solid #fff1d477;border-radius:28px;box-shadow:0 8px 0 #2c35434a,0 16px 30px #102e3e50;padding:24px 20px;margin-bottom:28px;overflow:hidden}
.activity-dialog .activity-hero small{font-size:10px;letter-spacing:1.1px;display:block;width:74%;font-weight:800;color:#ffe3a1;line-height:1.8}
.activity-dialog .activity-hero h1{font-size:31px;line-height:1.12;width:68%;color:#fff7de;text-shadow:0 2px 4px #142a3750;margin-top:13px;margin-bottom:12px;letter-spacing:-.7px}
.activity-dialog .activity-hero p{width:64%;font-size:13px;line-height:1.6;color:#fff7e8;margin:0;text-shadow:0 1px 4px #182736}
.activity-dialog .activity-hero img{width:43%;max-height:205px;right:-3px;bottom:4px;filter:drop-shadow(0 8px 9px #132e4950);animation:atelier-welcome .45s ease-out}
.activity-dialog .activity-grid{gap:15px;margin-top:0}
.activity-dialog .activity-grid button{position:relative;gap:9px;padding:15px 13px 18px;text-align:left;background:#fff0bc;border:2px solid #fff5dc;box-shadow:0 6px 0 #7b493bc9,0 8px 15px #142d3e30;border-radius:24px;overflow:hidden;min-height:176px}
.activity-dialog .activity-grid button:nth-child(3n+2){background:#dcd3fa;border-color:#f6f0ff}
.activity-dialog .activity-grid button:nth-child(3n){background:#bce9dc;border-color:#effff8}
.activity-dialog .activity-grid i{width:55px;height:55px;background:#ffffffa3;border-radius:18px;display:grid;place-items:center;color:#a33142;box-shadow:0 4px 0 #a54e4120;transform:rotate(-6deg);margin-bottom:3px}
:root[data-system=traditional] .activity-dialog .activity-grid i{color:#246da4}
.activity-dialog .activity-grid i svg{width:38px;height:38px}
.activity-dialog .activity-grid b{font-size:17px;line-height:1.24;letter-spacing:-.25px;padding-right:7px;color:#442e46}
.activity-dialog .activity-grid span{font-size:12px;font-weight:600;line-height:1.5;color:#594556;max-width:95%}
.activity-dialog .activity-grid em{font-size:18px;font-style:normal;position:absolute;top:14px;right:12px;opacity:.6}
.activity-dialog .activity-tone-options{gap:14px;margin:22px 0}
.activity-dialog .activity-tone-options button{background:#ffecbc;border:2px solid #fff4dc;border-radius:25px;min-height:130px;padding:17px;box-shadow:0 6px 0 #88523fd9}
.activity-dialog .activity-tone-options button:nth-child(2){background:#c2eade}.activity-dialog .activity-tone-options button:nth-child(3){background:#d7d3ff}.activity-dialog .activity-tone-options button:nth-child(4){background:#ffc8bd}
.activity-dialog .activity-tone-options b{font-size:18px}.activity-dialog .activity-tone-options path{stroke-width:8}
.activity-dialog .activity-main>.activity-model{width:max-content;max-width:100%;margin:20px auto;padding:12px 26px;border-radius:22px;background:#f5e7bce8;color:var(--activity-dark);border:2px solid #fff5de;box-shadow:0 5px 0 #3d334050;font-size:35px!important}
.activity-dialog .activity-main>.activity-feedback{background:#17695e;color:#fff;border:2px solid #bcf6d2;font-size:15px;box-shadow:0 5px 0 #10483e;border-radius:22px;text-shadow:none}
.activity-dialog .activity-main details{background:#f2ddc6ef;color:#542e40;border:1px solid #ffffffb0;padding:16px;box-shadow:0 4px 0 #142d4030}
:root[data-system=traditional] .activity-dialog .activity-main details{background:#ccecf4ef;color:#173b54}
.activity-dialog .activity-scene-list{gap:17px;margin-top:24px}
.activity-dialog .activity-scene-list>button{background:#ffe7bdeb;border:2px solid #fff4dd;border-radius:24px;min-height:112px;padding:16px}
:root[data-system=traditional] .activity-dialog .activity-scene-list>button{background:#d0edf6ed;border-color:#f2fcff}
.activity-dialog .activity-scene-list>button:disabled{background:#203a4ce8;color:#f4efea;border-color:#ffffff50;opacity:1;box-shadow:none}
.activity-dialog .activity-scene-list>button:disabled img{filter:grayscale(.7);opacity:.65}
.activity-dialog .activity-scene-list small{line-height:1.55;font-size:12px}
.activity-dialog .activity-scene{background:linear-gradient(180deg,#12384410,#18364470),var(--atelier-art);background-size:cover;background-position:center 29%;padding:24px 15px;min-height:235px;border:2px solid #fff1d9bd;border-radius:26px;box-shadow:0 6px 0 #172e454d;align-items:center;grid-template-columns:76px minmax(0,1fr)}
.activity-dialog .activity-scene-person img{height:128px;width:83px;filter:drop-shadow(0 4px 4px #142c4266)}
.activity-dialog .activity-scene-person span{color:#fff6e3;background:#1b3848dc;border:1px solid #ffffff50;padding:5px;border-radius:12px;font-size:11px}
.activity-dialog .activity-bubble{background:#fff5dedf;border:2px solid #fffaf0;border-radius:24px;padding:16px;box-shadow:0 4px 0 #243a4d40;color:#173e48}
.activity-dialog .activity-bubble>p[lang=zh]{font-size:28px;font-weight:800;line-height:1.8}
.activity-dialog .comic-frame{border:3px solid #503851;box-shadow:5px 5px 0 #30263b8a;transform:rotate(-.6deg)}
.activity-dialog .activity-bubble .activity-pinyin{font-size:13px!important;line-height:1.8;color:#4a5b68}
.activity-dialog .activity-blocks{gap:8px}.activity-dialog .activity-blocks button{min-width:48px;padding:8px 10px;background:#c9e8db;font-size:22px}
.activity-dialog .activity-recording{margin-top:16px}.activity-dialog .activity-recording>p{color:#fff;padding:12px;border-radius:16px;background:#15364bda;font-size:13px;line-height:1.6}
.activity-dialog .activity-rule,.activity-dialog .activity-exercise-cn{background:#fff0dbea;border:2px solid #fff4e8;box-shadow:0 5px 0 #15374745;border-radius:24px}
:root[data-system=traditional] .activity-dialog .activity-rule,:root[data-system=traditional] .activity-dialog .activity-exercise-cn{background:#dcf4f8ed}
.activity-dialog .activity-stroke{border:2px solid #fff6e2;background:#fff3dc;box-shadow:0 7px 0 #553f5694,0 12px 25px #19364550;border-radius:27px;margin:26px auto}
.activity-dialog .activity-main .activity-character-grid button{background:#fff0c4;border:2px solid #fff9e3;border-radius:18px;min-width:56px;font-size:27px;padding:10px}
.activity-dialog .activity-main textarea{border:2px solid #fff9dd;box-shadow:0 5px 0 #1b354e55;border-radius:24px;background:#fff0dae8;padding:17px;font-size:22px;min-height:130px}
.activity-dialog .activity-couple-hero{padding:24px 100px 24px 18px;background:#f5ddc8ec;border:2px solid #fff1df;border-radius:25px;min-height:170px;box-shadow:0 5px 0 #29414c66}
.activity-dialog .activity-couple-hero h1{font-size:27px;line-height:1.2}.activity-dialog .activity-couple-hero p{font-size:12px}.activity-dialog .activity-couple-hero img{right:5px;top:25px;width:95px;height:130px;object-fit:contain}
.activity-dialog .activity-contribution{background:#c6eadde8;border:2px solid #eefdef;border-radius:25px;box-shadow:0 5px 0 #19433b7c;color:#254644}
.activity-dialog .activity-celebration{background:#254356e8;border:2px solid #fff2d391;color:white;box-shadow:0 7px 0 #162e4566;padding:25px}.activity-dialog .activity-celebration h1{color:#ffe8ab}.activity-dialog .activity-celebration img{filter:drop-shadow(0 7px 10px #101f3a70)}
.activity-dialog .activity-main progress{height:15px;appearance:none;border:2px solid #fff0d0;border-radius:20px;background:#354c60;width:100%;box-shadow:0 3px 0 #132e4140;overflow:hidden}
.activity-dialog progress::-webkit-progress-bar{background:#3c4b65}.activity-dialog progress::-webkit-progress-value{background:linear-gradient(90deg,#f77a64,#ffd259);border-radius:20px}
:root[data-system=traditional] .activity-dialog progress::-webkit-progress-value{background:linear-gradient(90deg,#3a99cf,#8fe9d1)}
.activity-dialog .activity-video-caption{background:#fff1dbec;border:2px solid #fff7e3;border-radius:25px;box-shadow:0 5px 0 #1b354c4f}.activity-dialog .activity-video-caption>p[lang=zh]{font-size:29px;font-weight:800}
.activity-dialog .activity-main>a{display:inline-block;background:#213e51ed;padding:12px 15px;border-radius:15px;color:#ffe49f;font-weight:700;line-height:1.7;margin:12px 0;font-size:14px}
.activity-home-link{position:relative;background:linear-gradient(90deg,#21364ce8,#23344888),url('./art/atelier-hsk-v2.webp');background-size:cover;background-position:center 22%;border:2px solid #ffffff9c;box-shadow:0 5px 0 #38526b66;min-height:170px;padding:25px}
:root[data-system=traditional] .activity-home-link{background-image:linear-gradient(90deg,#173950ed,#15344866),url('./art/atelier-tocfl-v2.webp')}
.activity-home-link h2{max-width:75%;font-size:25px;line-height:1.2;color:#fff3d7}.activity-home-link p{max-width:80%;font-size:14px;line-height:1.6}.activity-home-link button{box-shadow:0 4px 0 #956049}
.mobile-gift-summary{border:1px solid #ffffff69;box-shadow:0 5px 0 #31426066,0 9px 25px #17374820}.mobile-gift-summary img{filter:drop-shadow(0 5px 7px #0b182b50)}
.pocket-nav button{transition:background .15s,color .15s,transform .15s}.pocket-nav button:active{transform:scale(.95)}
@keyframes atelier-welcome{from{opacity:0;transform:translateY(12px) rotate(-4deg)}to{opacity:1;transform:none}}
@media(max-width:350px){.activity-dialog .activity-main{padding-top:24px!important}.activity-dialog .activity-hero{padding:20px 14px;min-height:255px}.activity-dialog .activity-hero h1{font-size:27px}.activity-dialog .activity-hero p{font-size:12px}.activity-dialog .activity-grid{gap:12px}.activity-dialog .activity-grid button{padding:13px 10px 16px;min-height:178px}.activity-dialog .activity-grid b{font-size:16px}.activity-dialog .activity-grid span{font-size:11px}.activity-dialog .activity-scene{grid-template-columns:54px minmax(0,1fr);padding:20px 10px;gap:9px}.activity-dialog .activity-scene-person img{width:61px;height:105px}.activity-dialog .activity-bubble{padding:10px}.activity-dialog .activity-bubble>p[lang=zh]{font-size:24px}.activity-dialog .activity-main>h1{font-size:27px}.activity-dialog .activity-tone-options button{padding:12px;min-height:122px}}
@media(prefers-reduced-motion:reduce){.activity-dialog .activity-hero img,.activity-dialog .activity-main button,.pocket-nav button{animation:none;transition:none}.activity-dialog .activity-main button:active,.pocket-nav button:active{transform:none}}

:root[data-view=home]{--studio-scene:url('./art/atelier-hsk-v2.webp');--studio-wash:transparent}
:root[data-system=traditional][data-view=home]{--studio-scene:url('./art/atelier-tocfl-v2.webp')}
:root[data-view=home] body::before{background-image:linear-gradient(180deg,#14304712,#19364a38),var(--studio-scene)}
:root[data-view=home] .pocket-stats span{background:#204657ef;border:1px solid #ffffff84;box-shadow:0 5px 0 #18394570;color:#edf9f7;font-size:12px}
:root[data-view=home] .pocket-stats span:first-child b{color:#a2edd3}
:root[data-view=home] .pocket-stats span:last-child{background:#743e5eeb;color:#fff3ed}
:root[data-view=home] .pocket-stats span:last-child b{color:#ffda84}
:root[data-view=home] .pocket-panel.story-daily-home{background:#213c52ed;border:1px solid #fff4d9a6;box-shadow:0 6px 0 #213c5180;color:#fff5e4;padding:20px}
:root[data-view=home] .story-daily-home h2{color:#ffe8aa;font-size:24px}
:root[data-view=home] .story-daily-home p{color:#edf5f7;font-size:13px;line-height:1.7}
:root[data-view=home] .story-daily-home>button{background:#ffe0a5;border:2px solid #fff0cc;box-shadow:0 5px 0 #976051;padding:17px;color:#572d3b}
:root[data-system=traditional][data-view=home] .story-daily-home>button{background:#baeee4;border-color:#e5fff9;box-shadow:0 5px 0 #347280;color:#164554}
:root[data-view=home] .pocket-section-kicker{background:#213b4ee8;color:#ffe2a5;border-radius:15px;padding:12px;font-size:13px;font-weight:800;letter-spacing:.8px}
:root[data-view=home] .pocket-install{background:#ddf1e9ed!important;border:1px solid #fff;box-shadow:0 5px 0 #24444b66}
:root:is([data-view=home],[data-view=cards],[data-view=quiz],[data-view=vocabulary]) .pocket-header a{padding:7px 10px 7px 7px;border-radius:18px;background:#22394aeb;border:1px solid #ffffff6e;box-shadow:0 3px 0 #142e4140}
:root:is([data-view=home],[data-view=cards],[data-view=quiz],[data-view=vocabulary]) .pocket-header strong{color:#fff4d8;font-size:21px}
:root:is([data-view=home],[data-view=cards],[data-view=quiz],[data-view=vocabulary]) .pocket-header small{color:#edcfb2}
:root:is([data-view=home],[data-view=cards],[data-view=quiz],[data-view=vocabulary]) .pocket-toolbar label{padding:6px 8px;border-radius:13px;background:#22394ad9;color:#fff8e9;font-size:11px;display:flex;align-items:center;gap:8px}
:root:is([data-view=home],[data-view=cards],[data-view=quiz],[data-view=vocabulary]) .pocket-sync{background:#22394ae8;color:#f3f7fa;border:1px solid #ffffff50;box-shadow:0 3px 0 #152e4040}
:root[data-view=cards] .pocket-flash{background:linear-gradient(155deg,#ffefc8,#ffe5b7);border:2px solid #fff4dd;box-shadow:0 7px 0 #ac665e,0 15px 24px #21354a30}
:root[data-system=traditional][data-view=cards] .pocket-flash{background:linear-gradient(155deg,#e1f9f6,#bce8f3);border-color:#f3fffc;box-shadow:0 7px 0 #41799a,0 15px 24px #21354a30}
:root[data-view=cards] .pocket-flash>span{background:#ffffff80;border:1px solid #fff8dc;box-shadow:0 3px 0 #76523f17;color:#594354;font-size:13px}
:root[data-view=quiz] .pocket-choices button{border:2px solid #fff2d4;background:#fff1c5;color:#473342;box-shadow:0 5px 0 #9a665d;min-height:54px;padding:16px;font-size:16px}
:root[data-system=traditional][data-view=quiz] .pocket-choices button{border-color:#eafff9;background:#ceeee9;color:#214959;box-shadow:0 5px 0 #437b8a}
@media(max-width:350px){:root:is([data-view=home],[data-view=cards],[data-view=quiz],[data-view=vocabulary]) .pocket-toolbar label{gap:5px;padding:5px;font-size:10px}.activity-dialog .activity-top span{font-size:11px}:root[data-view=home] .story-daily-home h2{font-size:21px}}

.activity-dialog .activity-main>.activity-feedback.review{background:#ffdd98ed;border-color:#fff3d3;color:#644221;box-shadow:0 5px 0 #886037}.activity-dialog .activity-main>.activity-feedback.success{background:#17695e;color:#fff;border-color:#bcf6d2}