@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{--bg:#101110;--panel:#191a18;--line:#30312e;--muted:#90928b;--orange:#fc7e36;--spring:cubic-bezier(.22,1.45,.36,1)}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:var(--bg);color:#f0f0e9;font-family:'DM Sans',-apple-system,BlinkMacSystemFont,'PingFang SC',sans-serif;font-size:14px}button,a,input{-webkit-tap-highlight-color:transparent}button,a{color:inherit}button{font:inherit;cursor:pointer}a{text-decoration:none}header{height:88px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 5%}.brand{display:flex;align-items:center;font:700 36px 'Space Grotesk',sans-serif;letter-spacing:-5px}.brand span{color:var(--orange);font-size:30px;margin:0 22px 0 4px}.brand b{font-size:15px;letter-spacing:2px}nav{display:flex;gap:32px;align-items:center;color:#a2a49d}nav a.active{color:#f0f0e9}nav button{border:0;background:none;color:inherit}.edition{font-size:10px;letter-spacing:1px;color:var(--muted)}i{display:inline-block;width:5px;height:5px;background:var(--orange);border-radius:50%;margin:0 8px}main{max-width:1440px;margin:auto;padding:0 5%}.hero{padding-top:57px;position:relative;overflow:hidden}.eyebrow{font:11px 'Space Grotesk',sans-serif;letter-spacing:1.7px;color:#a5a79f}.eyebrow>span{display:inline-block;background:var(--orange);width:6px;height:6px;margin-right:10px;border-radius:50%}h1{font-size:clamp(52px,6.1vw,86px);line-height:1.2;letter-spacing:-3px;margin:29px 0 22px;font-weight:600;position:relative;z-index:1}.orange{color:var(--orange)}h1 em{display:block;font:400 20px 'Space Grotesk',sans-serif;color:#a2a59b;letter-spacing:-.5px;margin-top:16px}.hero-bottom{display:flex;gap:36px;align-items:center;position:relative;z-index:1}p{line-height:1.9;color:var(--muted)}.primary{background:var(--orange);color:#171713;padding:17px 21px;border-radius:5px;font-weight:600}.primary span{margin-left:25px}.hero-art{position:absolute;right:0;top:20px;width:44%;height:350px;background:radial-gradient(ellipse at center,#50321e44,transparent 65%);perspective:700px}.orbit{position:absolute;width:330px;height:330px;border:1px solid #444238;border-radius:50%;top:30px;left:45px;transform:rotateX(61deg) rotateZ(-30deg)}.o2{transform:rotateX(61deg) rotateZ(40deg);width:440px;height:440px;top:-25px;left:-10px;border-color:#2b2c27}.art-capsule{position:absolute;top:107px;left:54px;width:315px;height:120px;background:linear-gradient(135deg,#ffbd79,#ff8e45 50%,#c64a14);border-radius:80px;transform:rotate(-26deg);box-shadow:0 15px 0 #8c390e,0 28px 40px #0009,inset 0 3px 5px #ffd1a9;display:flex;align-items:center;justify-content:space-around;animation:float 6s ease-in-out infinite}.art-capsule span{font:500 13px 'Space Grotesk';letter-spacing:2px;color:#78350e}.art-capsule div{width:83px;height:83px;border-radius:50%;background:linear-gradient(145deg,#ffb974,#f98738);box-shadow:inset 0 1px 3px #ffddb0,0 5px 8px #b84817;font-size:52px;text-align:center;color:#79360e}.art-label{position:absolute;bottom:15px;left:85px;color:#777b70;font:10px monospace;letter-spacing:2px}.coord{position:absolute;right:10px;top:60px;color:#76796e;font:10px/1.8 monospace}.hero-stats{display:flex;gap:36px;align-items:center;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-top:42px;padding:23px 0;font-size:12px;color:var(--muted)}.hero-stats b{font:500 20px 'Space Grotesk';color:#dfdfd7;margin-right:9px}.hero-stats a{margin-left:auto}#explore{padding:54px 0 65px}.section-top{display:flex;justify-content:space-between;align-items:end;margin-bottom:28px}h2{font-size:29px;letter-spacing:-1px;margin:14px 0 8px;font-weight:500}h2 span{color:var(--orange)}.section-top p{margin:0;font-size:12px}.filters{display:flex;gap:5px}.filters button{background:transparent;border:1px solid transparent;border-radius:5px;color:#96998f;padding:10px 13px;font-size:12px}.filters button.selected{background:#292b26;color:#f0f0e9;border-color:#42453b}.filters small{margin-left:8px;color:var(--orange)}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.card{min-width:0;background:#171815;border:1px solid var(--line);border-radius:10px;overflow:hidden;transition:border-color .3s}.card:hover{border-color:#6b614f}.stage{height:224px;background:radial-gradient(ellipse at 50% 80%,#30312966,transparent 70%),#1d1e1a;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden}.stage:before{content:'';position:absolute;inset:0;background-image:radial-gradient(#85877535 .7px,transparent .7px);background-size:15px 15px;mask-image:linear-gradient(black,transparent)}.stage>*{z-index:1}.num{position:absolute;left:16px;top:14px;font:10px monospace;color:#9b9f8f}.live{position:absolute;right:15px;top:14px;font:9px monospace;color:#9b9f8f}.live:before{content:'●';color:#b1bd87;margin-right:5px}.hint{position:absolute;bottom:12px;font-size:10px;letter-spacing:.5px;color:#898d7d}.card-copy{padding:21px}.card-head{display:flex;align-items:center;gap:8px}.card h3{font-size:17px;font-weight:500;margin:0}.tag{font-size:9px;color:#b9bcad;background:#2a2d24;border:1px solid #3a3e31;padding:3px 6px;border-radius:3px;margin-left:auto;white-space:nowrap}.english{font:10px 'Space Grotesk';letter-spacing:1px;color:#787d6f;margin-top:8px}.desc{font-size:12px;line-height:1.8;margin:14px 0 19px;min-height:43px}.card-foot{display:flex;border-top:1px solid #2d3027;padding-top:15px;align-items:center}.tech{font:10px monospace;color:#8d9480}.detail-btn{margin-left:auto;border:0;background:none;font-size:11px;color:#d5d7cb;padding:3px 0}.detail-btn span{color:var(--orange);margin-left:6px}.board{width:220px;height:120px;background:linear-gradient(125deg,#f0f0e7,#c8cbbe);border:0;border-radius:10px;color:#252820;padding:17px;text-align:left;box-shadow:0 20px 30px #0006;transition:transform .5s var(--spring);position:relative;overflow:hidden;transform-style:preserve-3d}.board:after{content:'';position:absolute;inset:-100%;background:linear-gradient(100deg,transparent 42%,#fff8 50%,transparent 58%);transform:translateX(var(--shine,-35%));pointer-events:none}.board b{font-size:23px;line-height:1}.board small{display:block;font-size:8px;margin-top:24px}.skate{position:absolute;width:122px;height:33px;background:repeating-linear-gradient(90deg,#30332b 0 21px,#a1a48f 22px 23px);border:2px solid #484d3e;border-radius:25px;transform:rotate(-32deg);right:10px;top:47px}.capsule{border:1px solid #5b573c;background:#ff9a44;width:176px;height:55px;border-radius:40px;display:flex;justify-content:space-between;align-items:center;padding:7px 9px 7px 21px;color:#4e2c0a;transition:all .65s var(--spring);box-shadow:0 10px 30px #ff86231a}.capsule b{font:600 12px 'Space Grotesk'}.capsule span{background:#27291f;color:#ffd4a7;border-radius:50%;width:38px;height:38px;display:grid;place-items:center;font-size:22px}.capsule.expanded{height:142px;width:230px;border-radius:23px;align-items:start;padding-top:20px}.capsule.expanded b:after{content:'Your next idea starts here.\A 点一下，收起灵感';white-space:pre;display:block;font-size:10px;line-height:2;margin-top:12px}.shared{width:185px;height:100px;cursor:pointer;background:linear-gradient(145deg,#63766f,#a3b4a1 44%,#263d35 45%,#66847a 65%,#28392e);border:1px solid #7a8874;border-radius:10px;transition:all .7s var(--spring);position:relative;padding:14px;color:#fff;text-align:left}.shared b{position:absolute;bottom:14px;font-size:14px;text-shadow:0 1px 5px #000}.shared.open{height:170px;width:235px}.shared.open b:after{content:'探索山野，感受自由 ↗';display:block;font-size:10px;margin-top:9px}.graph{width:235px;cursor:crosshair}.graph strong{font:500 39px 'Space Grotesk'}.graph small{font-size:10px;color:#aaa}.graph svg{width:100%;height:85px;overflow:visible}.graph .cursor{transition:transform .25s}.phone{height:177px;width:116px;border:4px solid #11140f;box-shadow:0 0 0 1px #535947;border-radius:21px;background:#d8ddcc;position:relative;overflow:hidden;color:#1c2318;padding:18px 9px;font-size:9px}.phone>b{font-size:14px}.phone .drawer{position:absolute;bottom:0;left:0;width:100%;height:66px;background:#fafaf2;border-radius:16px 16px 0 0;padding:8px;cursor:grab;touch-action:none;transition:height .7s var(--spring)}.drawer:before{content:'';display:block;width:22px;height:3px;background:#b7beab;margin:0 auto 8px;border-radius:3px}.drawer.open{height:136px}.drawer button{border:0;border-radius:10px;background:#ed8a35;font-size:8px;margin-top:7px;padding:5px 15px}.glow{width:222px;height:124px;border-radius:13px;position:relative;padding:2px;background:#34382b;overflow:hidden;cursor:pointer}.glow:before{content:'';position:absolute;inset:-65%;background:conic-gradient(transparent 50%,#ffb45d,#f98025,transparent 85%);animation:spin 4s linear infinite}.glow>div{position:relative;background:#20231c;border-radius:11px;height:100%;padding:19px;background-image:radial-gradient(at 90% 90%,#8d50103d,transparent 65%)}.glow small{color:#d4a96f;font:9px monospace}.glow b{display:block;font:30px 'Space Grotesk';margin-top:17px}.glow b small{font-size:10px;color:#afb59e}.tiles{display:grid;grid-template-columns:repeat(3,50px);gap:7px;cursor:pointer}.tiles div{height:51px;background:linear-gradient(145deg,var(--c),#313c2c);border-radius:6px;display:grid;place-items:center;font-size:24px;animation:enter .8s var(--spring) both;animation-delay:calc(var(--i)*.09s)}.press{border-radius:45px;background:#e7ebdd;color:#242c1d;padding:18px 23px;border:0;box-shadow:0 6px 0 #a2aa94,0 15px 25px #0005;transition:transform .4s var(--spring),box-shadow .4s}.press:active,.press.pressed{transform:translateY(5px) scale(.94);box-shadow:0 0 0 #a2aa94,inset 0 2px 7px #4446}.press span{background:#2b3322;color:#dce6cd;padding:6px 9px;border-radius:50%;margin-left:15px}.method{border-top:1px solid var(--line);padding:55px 0 64px;display:grid;grid-template-columns:1fr 1.3fr;gap:80px}.method h2{font-size:40px;line-height:1.4;margin:20px 0}.method p{font-size:13px}.steps article{display:flex;gap:25px;padding:19px 0;border-bottom:1px solid var(--line)}.steps article>span{font:12px monospace;color:var(--orange);padding-top:4px}.steps h3{font-size:16px;font-weight:500;margin:0}.steps p{margin:7px 0 0;font-size:12px}footer{border-top:1px solid var(--line);padding:27px 0;display:flex;align-items:center;justify-content:space-between}footer .brand{font-size:26px}footer .brand b{font-size:11px}footer p{font-size:11px}footer p span{margin-left:20px;color:#63695b}footer>a:last-child{font-size:11px;color:#a4ab98}dialog{color:#f0f0e9;background:#1c1f19;border:1px solid #4d5342;border-radius:16px;max-width:680px;width:90%;padding:35px}dialog::backdrop{background:#000b;backdrop-filter:blur(8px)}.close{position:absolute;top:10px;right:14px;border:0;background:none;color:#abb49b;font-size:27px}dialog h2{font-size:26px}dialog p{font-size:13px}dialog pre{white-space:pre-wrap;background:#12150f;padding:20px;border:1px solid #353c2b;border-radius:8px;font:12px/1.9 monospace;color:#c7d1b7}dialog .primary{border:0;margin-top:12px}dialog label{font-size:12px;display:flex;align-items:center;gap:15px;margin:20px 0}input{accent-color:var(--orange)}#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:#e5ebdb;color:#202718;padding:12px 22px;border-radius:30px;opacity:0;pointer-events:none;transition:opacity .2s;z-index:10}#toast.show{opacity:1}button:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--orange);outline-offset:5px}@keyframes float{50%{transform:translateY(-15px) rotate(-22deg)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes enter{from{opacity:0;transform:translateY(30px) scale(.8)}to{opacity:1;transform:none}}@media(min-width:1500px){header{padding:0 calc((100% - 1296px)/2)}}@media(max-width:1050px){.edition{display:none}.hero-art{opacity:.65;right:-70px}.hero-bottom{gap:20px}.grid{grid-template-columns:repeat(2,1fr)}.section-top{display:block}.filters{margin-top:20px}.hero-bottom p{font-size:12px}}@media(max-width:650px){header{height:74px}.brand b{font-size:11px}.brand span{margin-right:12px}nav{gap:13px;font-size:11px}nav a:nth-child(2){display:none}.hero{padding-top:35px}.hero .eyebrow{font-size:8px}h1{font-size:53px}.hero-art{right:-170px;top:55px;opacity:.28}.hero-bottom{align-items:start;flex-direction:column}.hero-stats{gap:15px;flex-wrap:wrap}.hero-stats b{font-size:16px}.hero-stats a{display:none}.grid{grid-template-columns:1fr}h2{font-size:25px}.filters{flex-wrap:wrap}.filters button{padding:9px}.method{grid-template-columns:1fr;gap:10px}.method h2{font-size:32px}footer p{display:none}.stage{height:240px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
.glow.paused:before{animation-play-state:paused}
.footer-identity{display:flex;align-items:center;gap:16px}.footer-credit{font-size:11px;color:#9ba38e;white-space:nowrap}.footer-credit strong{font-family:'Space Grotesk',sans-serif;font-weight:500;letter-spacing:1.5px;color:#c3cbb6}.footer-legal{display:flex;gap:20px;align-items:center;font-size:11px;color:#939d82}.footer-legal a,.footer-credit{transition:color .2s}.footer-legal a:hover,.footer-credit:hover,.footer-credit:hover strong{color:var(--orange)}@media(max-width:850px){#site-footer{flex-wrap:wrap;gap:20px}.footer-legal{order:3;flex-basis:100%;justify-content:center;flex-wrap:wrap;gap:10px 20px}}@media(max-width:450px){.footer-identity{gap:10px}.footer-credit{font-size:10px}.footer-legal{font-size:10px}}
/* Bright playground theme */
:root{--bg:#faf9f5;--panel:#fff;--line:#deded9;--muted:#70716f;--orange:#f45f30}body{color:#24262a;background-image:radial-gradient(ellipse at 95% 0%,#eae5ff66,transparent 36%)}header{height:90px;background:#faf9f5e6;position:relative;z-index:2;border-color:#d9d9d4}.brand{color:#26282b}nav{color:#747675}nav a.active{color:#27292b;position:relative}nav a.active:after{content:'';position:absolute;bottom:-12px;left:0;right:0;height:2px;background:var(--orange)}nav a:hover{color:var(--orange)}.edition{color:#747675}.hero{padding-top:58px;overflow:visible}.eyebrow{color:#777976;font-size:10px;letter-spacing:1.7px}h1{font-size:clamp(60px,6.7vw,95px);line-height:1.18;font-weight:650;letter-spacing:-4px;margin-top:30px;margin-bottom:28px}.orange{position:relative;display:inline-block}.orange:after{content:'';position:absolute;left:0;right:-3px;bottom:0;height:9px;background:#ffc7a7;z-index:-1;transform:rotate(-2deg)}h1 em{font-size:20px;letter-spacing:-.6px;color:#35393f;margin-top:20px}h1 em span{color:#8b8e91}.hero-bottom{gap:26px}.hero-bottom p{font-size:12px;color:#737570;line-height:2}.primary{color:white;background:#f45f30;border-radius:40px;padding:18px 23px;box-shadow:0 7px 18px #ef682b26;transition:transform .3s,box-shadow .3s}.primary:hover{transform:translateY(-3px);box-shadow:0 10px 25px #ef682b40}.primary span{margin-left:20px}.hero-art{width:47%;height:385px;top:32px;right:-4px;opacity:1;background:radial-gradient(ellipse at 60% 56%,#d9d4ffbb,transparent 61%),radial-gradient(ellipse at 45% 70%,#ffdbc699,transparent 69%);border-radius:50%}.hero-art:after{content:'MAKE IT MOVE.';font:600 9px 'Space Grotesk',sans-serif;letter-spacing:2px;position:absolute;right:24px;bottom:55px;color:#89879a;transform:rotate(-90deg);transform-origin:right}.orbit{top:90px;left:30px;width:380px;height:280px;border-color:#c7bfe8;transform:rotateX(57deg) rotateZ(-24deg)}.o2{top:20px;left:12px;width:400px;height:360px;border-color:#d7cdea;transform:rotateX(54deg) rotateZ(37deg)}.art-capsule{top:145px;left:36px;width:335px;height:123px;background:linear-gradient(145deg,#ffca91 0%,#ff985d 38%,#ff783f 70%,#ed4e27 100%);box-shadow:0 12px 0 #d94d25,0 28px 30px #b34e2430,inset 0 3px 5px #fff5d5;border:1px solid #ffdcac;z-index:2}.art-capsule span{color:#8a3b15;font-size:12px}.art-capsule div{background:linear-gradient(145deg,#ffda9a,#ff9f59);box-shadow:inset 0 2px 3px #fff5cc,0 6px 8px #c65025;color:#b04e1d}.art-sphere{width:132px;height:132px;position:absolute;top:28px;right:71px;border-radius:50%;background:radial-gradient(circle at 28% 25%,#d2d6ff,#8c8bff 35%,#595be5 65%,#3d39ae 90%);box-shadow:inset -7px -9px 15px #302e9e33,0 20px 30px #7360c62b;animation:bob 7s ease-in-out infinite}.art-sphere:after{content:'';position:absolute;inset:18px 4px;border:1px solid #d4d1ff70;border-radius:50%;transform:rotate(-28deg)}.art-star{position:absolute;left:8px;top:50px;font-size:83px;line-height:1;color:#b3c768;filter:drop-shadow(0 6px 0 #718d35);transform:rotate(12deg);animation:star-turn 18s linear infinite}.art-ticket{position:absolute;bottom:15px;left:45px;z-index:3;display:flex;gap:10px;align-items:center;background:#eff4b9;border:1px solid #c4d06c;border-radius:30px;padding:13px 18px;transform:rotate(-8deg);font-size:22px;color:#4c602e;box-shadow:0 4px 0 #b4c26d}.art-ticket span{font:600 10px 'Space Grotesk';letter-spacing:1px}.art-dot{position:absolute;width:34px;height:34px;border-radius:50%;right:6px;top:195px;background:radial-gradient(circle at 30% 25%,#ffdbf1,#ef95c1 65%,#bc6090);box-shadow:0 10px 17px #d895b334}.art-label{bottom:-10px;left:auto;right:55px;color:#858397;font-size:9px;letter-spacing:1.2px}.coord{right:0;top:20px;color:#878393}.hero-stats{margin-top:54px;padding:24px 0;color:#7c7f79;border-top-color:#d9d9d4;border-bottom-color:#d9d9d4}.hero-stats b{color:#303538;font-weight:600}.hero-stats span:nth-child(2) b{color:#778742}.hero-stats span:nth-child(3) b{color:#8274c3}.hero-stats a{color:#5e625a}#explore{padding-top:62px;padding-bottom:70px}h2{font-size:32px;font-weight:600}.section-top{margin-bottom:32px}.section-top p{color:#7a7c75}.filters{padding:5px;background:#eeede8;border-radius:30px;gap:2px}.filters button{border-radius:22px;color:#70746a;padding:10px 14px}.filters button.selected{background:#fff;color:#282f26;border-color:#e4e3db;box-shadow:0 2px 6px #423f2d0a}.filters small{color:#e9683b}.grid{gap:24px}.card{background:white;border:1px solid #e6e5de;border-radius:18px;box-shadow:0 4px 16px #2c302504;transition:transform .35s,box-shadow .35s,border-color .35s}.card:hover{transform:translateY(-6px);border-color:#c7c4b8;box-shadow:0 15px 35px #3d392311}.stage{height:246px;background:#edf0e5;isolation:isolate}.stage:before{background-image:radial-gradient(#72796930 .7px,transparent .7px);mask-image:linear-gradient(black,transparent);opacity:.6}.card[data-index="0"] .stage{background:radial-gradient(ellipse at center,#ecf0d4,#e4e9d9)}.card[data-index="1"] .stage{background:radial-gradient(ellipse at center,#fce8dc,#f8e4d9)}.card[data-index="2"] .stage{background:radial-gradient(ellipse at center,#e9e5f8,#e3dff0)}.card[data-index="3"] .stage{background:#e2ecea}.card[data-index="4"] .stage{background:linear-gradient(140deg,#e3e9ff,#eae7f8)}.card[data-index="5"] .stage{background:radial-gradient(ellipse,#f8e3c8,#f5eadc)}.card[data-index="6"] .stage{background:#e8ede0}.card[data-index="7"] .stage{background:#f8e2e8}.num,.live{color:#70776a;font-size:9px;top:17px}.live:before{color:#789f4a}.hint{color:#6f7669;font-size:10px;bottom:14px}.card-copy{padding:23px}.card h3{font-size:17px;font-weight:600;color:#30352c}.tag{background:#f5f5ef;border-color:#e8e9df;color:#727b61;font-size:9px;padding:3px 7px}.english{color:#8a907f;font-size:9px;letter-spacing:1.1px}.desc{font-size:12px;color:#797e71;line-height:1.95;margin-bottom:20px}.card-foot{border-color:#eeeee5}.tech{color:#929985;font-size:9px}.detail-btn{color:#4c5541;font-size:11px}.detail-btn:hover{color:var(--orange)}.board{background:linear-gradient(130deg,#fff,#f5f6ec);box-shadow:0 20px 30px #4e654b25,0 3px 7px #60754715;border:1px solid #fff}.skate{background:repeating-linear-gradient(90deg,#485043 0 21px,#c0cab3 22px 23px);border-color:#69795b}.capsule{border-color:#ffba7d;background:linear-gradient(135deg,#ffb875,#ff944d);box-shadow:0 15px 25px #e68c4f30;color:#6a3a13}.capsule span{background:#fff4de;color:#bd5d1d}.shared{box-shadow:0 15px 22px #6c618b26;border-color:#c9cde3;background:linear-gradient(145deg,#a6c8d7,#e0e7e3 44%,#617c89 45%,#96b0b7 65%,#456775)}.graph{color:#385e56}.graph small{color:#7a9b8e}.graph svg>path{stroke:#709c8d}.graph .cursor path{stroke:#ef8d4b}.phone{background:#f2f3fa;border-color:#5c5c78;box-shadow:0 0 0 1px #a6a6c6,0 14px 25px #76759a25;color:#51536a}.phone .drawer{background:white;box-shadow:0 -4px 20px #b2b1cd30}.phone p{color:#8b8ca4}.drawer button{background:#aaa4e9;color:#fff}.glow{background:#e2d4b6;box-shadow:0 15px 25px #b6976020;border-radius:14px}.glow:before{background:conic-gradient(transparent 40%,#ff7228,#ffca6b,#e8931d,transparent 85%)}.glow>div{background:#fffaf0;background-image:radial-gradient(at 95% 100%,#ffc87b66,transparent 80%);color:#8b5b25}.glow small{color:#9a7f52}.glow b small{color:#a78e66}.tiles{gap:9px}.tiles div{height:53px;background:linear-gradient(145deg,#fff9,var(--c));color:#fff;box-shadow:0 6px 12px #65854b22;border:1px solid #fff8;border-radius:10px}.press{background:#fff8f5;color:#885e69;box-shadow:0 6px 0 #d9a8b3,0 15px 25px #b77e8a25;border:1px solid white}.press span{background:#eac5cf;color:#996875}.press:active,.press.pressed{box-shadow:0 0 0 #d9a8b3,inset 0 2px 7px #b58c9766}.method{margin:5px 0 50px;border:1px solid #e2e1d5;background:#f0f0e5;border-radius:22px;padding:45px;gap:60px}.method h2{color:#4d5843;font-size:39px;letter-spacing:-1.5px}.method p{color:#7c8473}.steps article{border-color:#d9ddcd}.steps article>span{color:#8b986a}.steps h3{color:#4c5741;font-weight:600}.steps p{color:#7d8770}.footer-credit{color:#888e7c}.footer-credit strong{color:#59634a}.footer-legal,footer>a:last-child{color:#8a927e}dialog{background:#fffcf6;color:#343b2c;border-color:#e5dfd1;box-shadow:0 25px 100px #362d2733;border-radius:20px}dialog::backdrop{background:#443f393b;backdrop-filter:blur(9px)}dialog p{color:#79816f}dialog pre{background:#f1f2e9;border-color:#dfe3d4;color:#5c6b4d;font-size:12px}.close{color:#8f9983}dialog input{accent-color:var(--orange)}#toast{background:#45553b;color:white;box-shadow:0 5px 20px #33452720}@keyframes bob{50%{transform:translateY(13px) rotate(8deg)}}@keyframes star-turn{to{transform:rotate(372deg)}}
@media(max-width:1100px){.hero-art{right:-10px;width:45%;transform:scale(.88);transform-origin:right center}.hero-bottom{gap:18px}.primary{padding:16px 19px}.hero-bottom p{font-size:11px}.method{gap:30px;padding:35px}.card-copy{padding:20px}}@media(max-width:850px){h1{font-size:68px}.hero-art{right:-12px;top:5px;transform:scale(.7);width:46%}.hero-bottom{align-items:start;flex-direction:column}.hero-bottom p{font-size:12px}.hero-stats{gap:24px}.hero-stats a{display:none}.method{grid-template-columns:1fr;gap:15px}.method h2 br{display:none}.hero-art .art-sphere{right:15px}.art-capsule{left:-40px}.art-star{left:-60px}}@media(max-width:650px){header{height:75px}nav a:nth-child(2){display:inline}.hero{padding-top:34px}.hero>.eyebrow{font-size:8px;letter-spacing:1px}h1{font-size:57px;letter-spacing:-3px;line-height:1.2;margin-bottom:24px}h1 em{font-size:17px}.hero-art{position:relative;width:100%;height:275px;top:auto;right:auto;margin:0 auto 18px;transform:none;opacity:1;max-width:380px}.art-capsule{width:260px;height:94px;left:29px;top:112px}.art-capsule span{font-size:10px}.art-capsule div{width:64px;height:64px;font-size:42px}.art-sphere{width:94px;height:94px;top:12px;right:39px!important}.art-star{left:14px;top:33px;font-size:64px}.art-ticket{left:26px;bottom:0;font-size:17px;padding:9px 12px}.art-ticket span{font-size:8px}.orbit{left:0;top:30px;width:300px;height:240px}.o2{left:12px;top:0;width:295px;height:260px}.art-label{bottom:-18px;right:18px;font-size:8px}.coord{font-size:8px;right:10px;top:15px}.art-dot{right:10px;top:178px;width:25px;height:25px}.hero-art:after{right:4px;bottom:45px;font-size:7px}.hero-bottom{margin-bottom:18px;gap:14px}.hero-bottom p{font-size:12px}.hero-bottom .primary{font-size:12px;padding:15px 21px}.hero-stats{margin-top:40px;gap:19px;padding:20px 0;font-size:10px}.hero-stats b{font-size:18px;margin-right:5px}#explore{padding-top:40px}.section-top h2{font-size:26px}.filters{display:inline-flex;flex-wrap:wrap;border-radius:16px;padding:4px;gap:0}.filters button{font-size:11px;padding:9px 10px}.grid{gap:22px}.stage{height:260px}.card-copy{padding:22px}.card h3{font-size:18px}.desc{font-size:13px}.method{padding:26px 22px;margin-bottom:30px;border-radius:18px}.method h2{font-size:29px}.method h2 br{display:block}.steps article{gap:16px;padding:18px 0}.steps h3{font-size:15px}footer{padding-top:24px;padding-bottom:24px}.footer-legal{font-size:10px}.card:hover{transform:none}}
/* Keep secondary labels readable on the light surfaces. */
.english,.tech{font-size:10px;color:#79826d}.num,.live{font-size:10px}.primary{background:#df4c22}dialog .primary{color:#fff}@media(prefers-reduced-motion:reduce){.art-sphere,.art-star{animation:none}}
/* Learning library */
#library{padding:62px 0 70px;border-top:1px solid var(--line);scroll-margin-top:28px}.library-kicker{font:10px 'Space Grotesk',sans-serif;letter-spacing:1.6px;color:#898d82;white-space:nowrap}.library-kicker>span{color:var(--orange);font-size:30px;margin-left:10px}.library-overview{display:flex;align-items:center;gap:40px;border:1px solid #e4e2d8;background:linear-gradient(115deg,#f2f1e4,#f4f0fb);padding:24px 28px;border-radius:18px;margin:26px 0}.library-overview>div:not(.sync-status){display:flex;align-items:baseline;gap:10px}.library-overview b{font:600 34px 'Space Grotesk',sans-serif;color:#474e3c}.library-overview>div:nth-child(2) b{color:#a17142}.library-overview>div:nth-child(3) b{color:#8b77ba}.library-overview span{font-size:12px;color:#787c70}.sync-status{display:flex;align-items:start;gap:5px;margin-left:auto}.sync-status i{margin-top:6px;background:#8da45a}.sync-status small{display:block;font-size:10px;color:#8e9186;margin-top:7px}.library-tools{display:flex;align-items:center;gap:18px;scroll-margin-top:25px}.library-search{flex:1;display:flex;gap:12px;align-items:center;background:#fff;border:1px solid #dddcd1;border-radius:12px;padding:13px 18px;box-shadow:0 4px 8px #3e3a2303}.library-search:focus-within{outline:2px solid #ed8e60;outline-offset:2px}.library-search>span{color:#d36b42;font-size:24px}.library-search input{width:100%;border:0;outline:none;background:transparent;color:#3d4335;font:13px 'DM Sans',sans-serif}.library-search input::placeholder{color:#969c8b}.select-wrap{font-size:11px;color:#818775;white-space:nowrap}.select-wrap select{margin-left:7px;border:1px solid #e2e1d8;background:#fff;color:#646e54;border-radius:9px;padding:12px 10px;font-size:11px}.library-topics{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}.library-topics button{border:1px solid #e0e2d5;background:#fff;color:#747e65;padding:9px 12px;border-radius:22px;font-size:11px;transition:background .2s,color .2s}.library-topics button small{margin-left:8px;font-size:9px;opacity:.7}.library-topics button.selected{background:#ec7845;border-color:#ec7845;color:white;box-shadow:0 4px 9px #ec784520}.library-topics button:hover{border-color:#d7a783}.library-caption{display:flex;justify-content:space-between;align-items:center;margin:24px 0 15px;font-size:11px;color:#868d79}.library-caption button{border:0;background:transparent;color:#929b83;font-size:11px}.library-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.learning-card{background:#fff;border:1px solid #e5e5db;border-radius:16px;padding:24px;display:flex;flex-direction:column;transition:transform .3s,box-shadow .3s,border-color .3s;--tone:#eee9fa;--ink:#8c78b4}.learning-card:hover{transform:translateY(-4px);box-shadow:0 12px 28px #47462b0c;border-color:#cfcdbd}.learning-card[data-tone="App / 小程序"]{--tone:#fbe6dc;--ink:#c58260}.learning-card[data-tone="Dashboard"]{--tone:#e8eddd;--ink:#8a9d63}.learning-card[data-tone="Web"]{--tone:#e1edee;--ink:#719b9f}.learning-card[data-tone="交互动效"]{--tone:#f9e3ec;--ink:#c886a4}.learning-card[data-tone="AI 工作流"]{--tone:#e6eafa;--ink:#7c89ba}.learning-card[data-tone="AI 创作"]{--tone:#fbecd2;--ink:#c39b60}.learning-card-top{display:flex;gap:12px;align-items:center}.topic-icon{display:grid;place-items:center;width:45px;height:45px;border-radius:13px;color:var(--ink);background:var(--tone);font-size:26px}.learning-card-top>div{font-size:11px;color:#777d70}.learning-card-top small{display:block;font-size:9px;margin-top:5px;color:#9b9f91}.card-arrow{margin-left:auto;color:#b8bfa9;font-size:20px}.learning-card h3{font-size:18px;font-weight:550;line-height:1.6;margin:22px 0 9px;color:#414a35;letter-spacing:-.3px}.learning-card>p{font-size:12px;line-height:1.95;color:#838b77;margin:0 0 20px}.learning-tags{display:flex;flex-wrap:wrap;gap:5px;margin-top:auto}.learning-tags span{font-size:9px;color:#8e967f;background:#f7f8f2;padding:4px 7px;border-radius:5px}.learning-actions{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #edeee5;margin-top:20px;padding-top:16px;font-size:11px}.learning-actions button{border:0;background:none;padding:0;color:#66744e;font-size:11px}.learning-actions button>span{color:var(--orange);margin-left:5px}.learning-actions a{color:#9b957e}.learning-actions a:hover,.learning-actions button:hover{color:var(--orange)}.library-pages{display:flex;justify-content:center;align-items:center;gap:24px;margin-top:28px;font-size:12px;color:#8c957b}.library-pages button{border:1px solid #dfe3d3;border-radius:8px;background:#fff;color:#77835f;padding:11px 16px;font-size:12px}.library-pages button:disabled{opacity:.35;cursor:default}.library-disclosure{font-size:11px;color:#979d8a;line-height:1.9;margin:28px auto 0;max-width:870px;text-align:center}.library-empty{grid-column:1/-1;text-align:center;padding:42px 15px;color:#8b967b;border:1px dashed #dce0cf;border-radius:16px}.library-empty>span{font-size:36px}.library-empty h3{font-size:17px;font-weight:500}.library-empty p{font-size:12px}.note-evidence{font-size:11px;color:#969a8a;padding:12px 0;border-bottom:1px solid #e7e9dc;margin-bottom:20px}#libraryDetail{max-height:85vh;overflow-y:auto}#libraryDetail h3{font-size:15px;font-weight:550;margin-top:23px}#libraryDetail h3 small{font-size:9px;font-weight:400;color:#a2a690;margin-left:8px}#libraryDetail details{font-size:12px;color:#899577;margin:23px 0}#libraryDetail summary{cursor:pointer}#libraryDetail blockquote{background:#f1f3e9;border-left:2px solid #c5d0a5;margin:15px 0;padding:14px 17px;line-height:1.9;font-size:12px;color:#879570}#libraryDetail .note-limit{font-size:11px;color:#9a9d8d}#libraryDetail .primary{display:inline-block;font-size:12px;margin-top:12px}.method{margin-top:0}
@media(max-width:1050px){.library-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.library-overview{gap:26px}.library-kicker{display:none}}@media(max-width:750px){.library-overview{flex-wrap:wrap;gap:17px 23px;padding:22px}.sync-status{flex-basis:100%;margin-left:0;padding-top:4px}.library-tools{flex-wrap:wrap;gap:12px}.library-search{flex-basis:100%}.library-search input{font-size:12px}.select-wrap{flex:1}.select-wrap select{max-width:calc(100% - 35px);padding:10px}.library-overview b{font-size:28px}.library-overview span{font-size:11px}}@media(max-width:650px){#library{padding:40px 0 45px}.library-grid{grid-template-columns:1fr;gap:16px}.library-topics{gap:6px}.library-topics button{padding:8px 10px;font-size:10px}.library-overview{margin:23px 0}.learning-card{padding:22px}.library-disclosure{text-align:left;font-size:10px}.library-kicker{display:none}.learning-card:hover{transform:none}header nav{gap:15px}header nav a{font-size:10px}header .brand span{margin-right:10px}header .brand b{font-size:10px;letter-spacing:1px}.library-overview>div:not(.sync-status){gap:8px}}@media(max-width:380px){header nav{gap:9px}header .brand b{font-size:9px;letter-spacing:.5px}header .brand{font-size:31px}header .brand span{font-size:26px}}
/* Interactive study scenes */
.demo-unit i{display:block;width:auto;height:auto;margin:0;background:transparent;border-radius:0}.demo-unit label{margin:0}

.demo-unit{width:100%;--demo-accent:#eb915d;--demo-ease:cubic-bezier(.2,1.35,.35,1);--ruler:50%;--done:0;color:#45513a}.demo-content{position:relative;width:100%;min-height:280px;display:flex;align-items:center;justify-content:center;perspective:800px;overflow:hidden;padding:15px}.demo-content button{font:inherit}.demo-controls{display:flex;align-items:center;gap:15px;justify-content:center;flex-wrap:wrap;padding:12px 8px 0}.demo-controls>button{border:1px solid #decab1;border-radius:22px;background:white;color:#9b7047;padding:10px 18px;font-size:12px}.demo-controls>span{font-size:11px;color:#9a967f;text-align:center;line-height:1.7;max-width:350px}.demo-preview{height:190px;position:relative;overflow:hidden;display:grid;place-items:center;background:var(--tone,#f1eadb);border-radius:12px;margin:0 0 22px}.demo-preview .demo-unit{width:340px;min-width:340px;transform:scale(.7);pointer-events:none}.demo-preview .demo-content{height:270px}.demo-preview:after{content:'点击放大体验 ↗';position:absolute;right:10px;bottom:9px;color:#8b8d7b;font-size:9px;letter-spacing:.4px}.demo-controls button:hover{border-color:#e88e56;color:#ca7139}.demo-success{width:260px;height:180px;position:relative;display:grid;place-items:center}.success-button{background:#fff9f0;color:#9b6b3d;border:1px solid #edd1ad;border-radius:30px;padding:17px 35px;box-shadow:0 5px 0 #d8b88e,0 16px 25px #ac82441c;position:relative;z-index:2;transition:all .6s var(--demo-ease);min-width:190px}.success-button .after{display:none}.demo-active .success-button{background:#e7efce;border-color:#c9d69d;color:#778c49;transform:scale(1.06);box-shadow:0 4px 0 #a6b87a,0 15px 25px #7a9a491f}.demo-active .success-button .before{display:none}.demo-active .success-button .after{display:block}.success-spark{position:absolute;top:20px;right:22px;color:#edc470;font-size:40px;transform:scale(0) rotate(-30deg);transition:transform .7s var(--demo-ease)}.demo-active .success-spark{transform:scale(1) rotate(20deg)}.success-ring{position:absolute;width:140px;height:140px;border:1px solid #d9c59e;border-radius:50%;transform:scale(.4);opacity:0}.demo-active .success-ring{animation:success-bloom .9s ease-out}.demo-checklist{background:#fffdf7;border:1px solid #e4dfcb;border-radius:18px;padding:18px 20px;width:290px;box-shadow:0 15px 25px #766b3010}.demo-checklist header{height:auto;background:none;border:0;padding:0 0 13px;position:static;font-size:13px;color:#7d845f}.demo-checklist header b{font:11px monospace}.demo-checklist label{display:flex;align-items:center;gap:10px;font-size:13px;padding:12px 0;border-top:1px solid #eff0e5;cursor:pointer}.demo-checklist label input{accent-color:#a5b96d}.demo-checklist label i{font-style:normal;color:#a0b16f;margin-left:auto;opacity:0;transform:scale(.5);transition:.4s}.demo-checklist label:has(input:checked) i{opacity:1;transform:scale(1)}.demo-checklist label:has(input:checked) span{text-decoration:line-through;color:#a2ac8b}.check-track{height:4px;background:#eef0e2;border-radius:4px;overflow:hidden;margin-top:12px}.check-track span{display:block;background:#adbf7e;width:calc(var(--done)*100%);height:100%;transition:width .5s}.demo-deck{position:relative;width:290px;height:200px}.deck-card{position:absolute;left:70px;top:15px;width:150px;height:170px;padding:20px;border-radius:16px;background:#f5d6be;box-shadow:0 12px 20px #826a3c18;border:1px solid #fff9;transform:translate(calc(var(--i)*6px),calc(var(--i)*6px)) rotate(calc((var(--i) - 1)*7deg));transition:transform .8s var(--demo-ease);z-index:calc(3 - var(--i));display:flex;flex-direction:column}.deck-card:nth-child(2){background:#dce7bf}.deck-card:nth-child(3){background:#dcd5ed}.deck-card>span{font:10px monospace;color:#928575}.deck-card b{font-size:20px;margin-top:10px;font-weight:500}.deck-card i{font-style:normal;font-size:60px;margin-top:auto;text-align:right;color:#fff9}.demo-active .deck-card{transform:translate(calc((var(--i) - 1)*85px),calc(var(--i)*5px)) rotate(calc((var(--i) - 1)*13deg))}.demo-mobile{height:260px;width:150px;background:#e5e9f4;border:5px solid #66657d;border-radius:26px;padding:30px 13px;color:#79788f;position:relative;overflow:hidden;box-shadow:0 12px 25px #6b629920}.mobile-island{position:absolute;width:46px;height:10px;border-radius:8px;background:#66657d;left:calc(50% - 23px);top:5px}.demo-mobile>b{font:500 18px/1.2 'Space Grotesk';position:relative;z-index:1}.mobile-orb{width:100px;height:100px;border-radius:50%;background:radial-gradient(at 25% 20%,#f4dfd3,#dba9c2 60%,#ad84b4);position:absolute;top:85px;left:22px}.demo-bottom-sheet{position:absolute;bottom:0;left:0;width:100%;height:95px;background:#fffdf7;border-radius:19px 19px 0 0;padding:8px 11px;transition:height .75s var(--demo-ease);touch-action:none;cursor:grab;box-shadow:0 -5px 20px #67638220}.demo-active .demo-bottom-sheet{height:192px}.sheet-grip{display:block;width:25px;height:3px;background:#cececa;border-radius:3px;margin:0 auto 13px}.demo-bottom-sheet>b{font-size:11px}.demo-bottom-sheet p{font-size:9px;color:#a1a292;line-height:1.7}.sheet-chips{display:flex;gap:5px;margin-top:15px}.sheet-chips span{font-size:8px;background:#e9e3f4;border-radius:12px;padding:6px}.demo-fluid{width:205px;height:62px;background:linear-gradient(135deg,#ffc998,#f6a265);border:1px solid #ffd8b5;border-radius:40px;padding:10px 16px;text-align:left;color:#9a582e;box-shadow:0 10px 25px #ce945a26;transition:width .7s var(--demo-ease),height .7s var(--demo-ease),border-radius .7s}.demo-fluid>span{display:flex;align-items:center;justify-content:space-between;font-size:13px;white-space:nowrap}.demo-fluid i{font-style:normal;font-size:23px;border-radius:50%;background:#fff5de;padding:4px 10px;margin-left:10px}.demo-fluid>div{opacity:0;transform:translateY(12px);transition:opacity .3s .2s,transform .5s .2s;visibility:hidden;height:0;overflow:hidden}.demo-fluid b{font:500 24px 'Space Grotesk'}.demo-fluid p{font-size:11px;color:#a7734b}.demo-fluid em{font:10px 'Space Grotesk'}.demo-active .demo-fluid{width:290px;height:205px;border-radius:24px;padding:20px}.demo-active .demo-fluid>div{opacity:1;transform:none;visibility:visible;height:125px;padding-top:15px}.demo-search{position:relative;background:white;border:1px solid #e9d8c4;width:64px;height:64px;border-radius:40px;box-shadow:0 15px 25px #977d4320;display:flex;align-items:center;transition:width .7s var(--demo-ease)}.demo-search>button{flex:none;width:62px;height:62px;border:0;background:none;color:#ca9463;font-size:33px}.demo-search input{width:0;min-width:0;opacity:0;border:0;outline:none;background:none;color:#92754e;font-size:13px;transition:opacity .3s .2s}.demo-active .demo-search{width:290px}.demo-active .demo-search input{width:205px;opacity:1}.search-suggestion{position:absolute;top:78px;left:10px;right:10px;opacity:0;background:#fffaf0;padding:13px;border-radius:12px;font-size:11px;color:#aca080;transition:opacity .4s .2s;white-space:nowrap;overflow:hidden}.demo-active .search-suggestion{opacity:1}.demo-ruler{width:290px;text-align:center;padding:20px;background:#fffaf4;border-radius:20px;border:1px solid #ecddcb}.demo-ruler>small{font:9px 'Space Grotesk';letter-spacing:2px;color:#b59d7a}.demo-ruler output{font:500 54px 'Space Grotesk';color:#a17d50}.demo-ruler>div:first-of-type{margin-top:15px}.demo-ruler>div>span{color:#b3a48e;font-size:13px}.ruler-line{height:36px;position:relative;margin:15px 0;background:repeating-linear-gradient(90deg,#c6b493 0 1px,transparent 1px 12px);mask-image:linear-gradient(90deg,transparent,black 20%,black 80%,transparent)}.ruler-line i{position:absolute;left:var(--ruler);height:45px;width:2px;background:#df9459;top:0;transition:left .3s var(--demo-ease)}.demo-ruler input{width:100%;accent-color:#d7aa72;height:4px}.demo-ruler p{font-size:10px;color:#b4a48b;margin:15px 0 0}.demo-chart{width:300px;border:1px solid #d1e2d6;border-radius:18px;background:#f8fff9;padding:20px;color:#738e76;box-shadow:0 15px 25px #68826812}.demo-chart>small{font:9px 'Space Grotesk';letter-spacing:1px;color:#a1b6a0}.demo-chart output{font:500 40px 'Space Grotesk'}.demo-chart>div>span{font-size:10px;color:#a0b69f}.demo-chart svg{width:100%;height:100px;overflow:visible;margin-top:15px;cursor:crosshair}.chart-stroke{fill:none;stroke:#8bab8c;stroke-width:1.7}.chart-area{fill:#b7d4ab20}.chart-marker{transition:transform .4s var(--demo-ease)}.chart-marker path{stroke:#e4ad78;stroke-dasharray:3 4}.chart-marker circle{fill:#efbd7830}.chart-marker circle:last-child{fill:#e3a468}.chart-labels{display:flex;justify-content:space-between;font:8px monospace;color:#acbca6}.demo-tabs{width:300px;text-align:center}.tabs-rail{background:#e2e6d9;border:1px solid #d4dcc5;border-radius:30px;padding:5px;display:flex;position:relative}.tabs-rail button{width:33.333%;padding:10px 0;border:0;background:none;color:#869071;font-size:12px;position:relative;z-index:1}.tabs-rail>i{position:absolute;left:5px;top:5px;height:calc(100% - 10px);width:calc((100% - 10px)/3);background:white;border-radius:25px;box-shadow:0 3px 7px #8c987621;transition:transform .6s var(--demo-ease)}[data-phase="1"] .tabs-rail>i{transform:translateX(100%)}[data-phase="2"] .tabs-rail>i{transform:translateX(200%)}.tab-content{padding:20px 0 0}.tab-content>span{display:block;font-size:45px;color:#b7c779;transition:transform .7s var(--demo-ease)}.demo-active .tab-content>span{transform:rotate(80deg)}.tab-content b{font-size:13px;font-weight:500;color:#829164}.tab-content p{font-size:10px;color:#9fa88d}.demo-fan{position:relative;width:290px;height:220px}.fan-card{position:absolute;left:65px;top:30px;width:160px;height:170px;border:5px solid #fff8;border-radius:13px;box-shadow:0 12px 15px #645e8120;transform:rotate(calc((var(--i) - 1)*16deg)) translateX(calc((var(--i) - 1)*38px));transition:transform .8s var(--demo-ease);transform-origin:center 140%;display:flex;align-items:end;padding:15px;z-index:calc(3 - var(--i))}.fan-card span{font:12px 'Space Grotesk';color:#fff;text-shadow:0 1px 4px #3e5658}.landscape-0{background:linear-gradient(145deg,#c9dcdd 40%,#a9bab7 41%,#809b97 70%)}.landscape-1{background:linear-gradient(160deg,#d9e4ec 35%,#9ec2d0 36%,#77a7ba)}.landscape-2{background:linear-gradient(150deg,#f0e3d8 30%,#d5b69a 31%,#b28a78)}.demo-active .fan-card{transform:rotate(calc((1 - var(--i))*18deg)) translateX(calc((1 - var(--i))*40px));z-index:calc(var(--i) + 1)}.demo-ripple{width:290px;height:210px;border:1px solid #cfdaca;background:#eaf0e2;border-radius:19px;overflow:hidden;position:relative;text-align:left;color:#7d8e68}.ripple-disc{position:absolute;width:450px;height:450px;background:#e8dff4;border-radius:50%;top:calc(50% - 225px);left:calc(50% - 225px);clip-path:circle(0 at 50% 50%);transition:clip-path .9s cubic-bezier(.2,.8,.2,1)}.demo-active .ripple-disc{clip-path:circle(75% at 50% 50%)}.demo-ripple>div{position:relative;padding:25px}.demo-ripple small{font:9px 'Space Grotesk';letter-spacing:1px}.demo-ripple b{display:block;font:500 29px/1.15 'Space Grotesk';margin-top:14px}.demo-ripple i{position:absolute;right:22px;bottom:8px;font-size:35px;font-style:normal}.demo-modal-scene{width:295px;height:215px;position:relative;perspective:700px}.mock-window{position:absolute;inset:0;background:#fffaf4;border:1px solid #dccfbf;border-radius:14px;padding:15px;transition:transform .7s var(--demo-ease),filter .7s}.mock-window>span{display:inline-block;width:5px;height:5px;border-radius:50%;background:#e1c9a7;margin-right:4px}.mock-blocks{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:22px}.mock-blocks i{height:60px;background:#e8ddcc;border-radius:7px}.mock-blocks i:last-child{grid-column:1/-1;height:40px;background:#eee7dd}.mini-overlay{position:absolute;inset:0;background:#9c8b8620;border-radius:14px;opacity:0;transition:opacity .5s}.demo-dialog-card{position:absolute;inset:30px 26px;background:#fffdf9;border:1px solid #efdfce;border-radius:20px;box-shadow:0 18px 30px #89775b20;text-align:center;padding:20px;transform:translateY(80px) scale(.75);opacity:0;transition:transform .7s var(--demo-ease),opacity .4s}.demo-dialog-card>span{font-size:28px;color:#e5bd82}.demo-dialog-card b{display:block;font:500 18px 'Space Grotesk';color:#9a886b;margin:12px 0}.demo-dialog-card p{font-size:10px;color:#b2a48b}.demo-active .mock-window{transform:rotateX(8deg) scale(.94);filter:blur(1px)}.demo-active .mini-overlay{opacity:1}.demo-active .demo-dialog-card{transform:none;opacity:1}.demo-dashboard{width:320px;background:#fffdf7;border:1px solid #dce2cd;border-radius:16px;padding:18px;box-shadow:0 10px 20px #71864f12}.dash-header{display:flex;align-items:center;justify-content:space-between}.dash-header>b{font:500 12px 'Space Grotesk';color:#829269}.dash-header button{font-size:8px;border:1px solid #e2e7d4;border-radius:12px;background:#f6f8ef;color:#94a27d;padding:5px 7px}.dash-metrics{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}.dash-metrics>div{padding:12px;background:#f0f3e7;border-radius:10px;position:relative}.dash-metrics>div+div{background:#f4edde}.dash-metrics small{font:8px monospace;color:#a7b195;display:block}.dash-metrics b{font:500 37px 'Space Grotesk';color:#8d9b70}.dash-metrics b span{font-size:12px}.dash-metrics>div>span{display:block;font-size:8px;color:#a0b487}.mini-bars{display:flex;height:25px;align-items:end;gap:4px}.mini-bars i{background:#d4bb8a;display:block;height:var(--h);flex:1;border-radius:3px 3px 0 0;transition:height .8s var(--demo-ease)}.demo-active .mini-bars i{height:calc(110% - var(--h))}.dash-footer{display:flex;align-items:center;gap:20px;margin-top:17px}.dash-footer>span{font-size:8px;color:#a6b18f}.dash-footer>div{height:4px;flex:1;background:linear-gradient(90deg,#bbc990 65%,#edf0e2 65%);border-radius:5px}.demo-layout{width:300px}.layout-title b{font:500 23px 'Space Grotesk';display:block;color:#859473}.layout-title small{font:8px 'Space Grotesk';letter-spacing:2px;color:#a4ae98}.layout-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:9px;margin-top:20px;height:140px}.layout-grid>div{display:flex;flex-direction:column;justify-content:space-between;padding:12px;background:#dce8ca;border-radius:10px;transition:transform .7s var(--demo-ease),background .7s}.layout-grid>div:nth-child(2){background:#e5def0}.layout-grid>div:nth-child(3){background:#f4d8c3}.layout-grid span{font-size:45px;color:#fff9}.layout-grid small{font-size:8px;color:#a1a388}.demo-active .layout-grid{grid-template-columns:1.6fr 1fr}.demo-active .layout-grid>div:first-child{grid-row:span 2}.demo-active .layout-grid>div:not(:first-child){height:65px;flex-direction:row;align-items:center}.demo-active .layout-grid span{font-size:33px}.demo-sidebar{display:flex;width:300px;height:200px;border:1px solid #d8dfcd;background:#fffdf5;border-radius:13px;overflow:hidden}.demo-sidebar aside{width:100px;flex:none;background:#e5ecd8;padding:14px;transition:width .7s var(--demo-ease)}.demo-sidebar aside b{font:600 20px 'Space Grotesk';color:#91a373}.demo-sidebar aside span{display:block;font-size:9px;white-space:nowrap;color:#9cab88;margin-top:15px;overflow:hidden}.demo-sidebar>div{padding:20px;flex:1}.demo-sidebar>div>small{font:7px monospace;color:#b4baa6}.demo-sidebar>div>b{font:500 18px 'Space Grotesk';display:block;color:#8e9d74;margin-top:10px}.sidebar-content{margin-top:20px;display:grid;grid-template-columns:1fr 1fr;gap:8px}.sidebar-content i{height:36px;border-radius:5px;background:#e7e9dc}.sidebar-content i:last-child{grid-column:1/-1;background:#f1e7d7}.demo-active .demo-sidebar aside{width:48px}.demo-workflow{width:310px}.flow-track{display:flex;justify-content:space-between;position:relative}.flow-track:before{content:'';position:absolute;top:22px;left:35px;right:35px;height:1px;background:#d5dbca}.flow-track>div{z-index:1;position:relative;text-align:center}.flow-track span{display:grid;place-items:center;width:46px;height:46px;background:#f8faf2;border:1px solid #dce3d0;border-radius:50%;color:#a2ae8d;font-size:22px;transition:background .4s,transform .5s var(--demo-ease)}.flow-track small{display:block;font-size:10px;color:#98a386;margin-top:9px}[data-phase="1"] .flow-track>div:nth-child(-n+2) span,[data-phase="2"] .flow-track>div:nth-child(-n+3) span,[data-phase="3"] .flow-track>div span{background:#dce8bf;color:#8b9e66;transform:scale(1.08)}.flow-result{border:1px solid #e0e5d2;background:#fffdf5;border-radius:13px;margin-top:25px;padding:17px}.flow-status{font-size:9px;color:#a9b68e}.flow-result>b{font:500 17px 'Space Grotesk';display:block;color:#91a176;margin:8px 0 13px}.flow-result>div{height:4px;background:#eef2e3;position:relative;overflow:hidden;border-radius:5px}.flow-result>div:before{content:'';display:block;height:100%;width:20%;background:#bfd393;transition:width .7s var(--demo-ease)}[data-phase="1"] .flow-result>div:before{width:45%}[data-phase="2"] .flow-result>div:before{width:72%}[data-phase="3"] .flow-result>div:before{width:100%}.demo-brand{width:290px;background:#f9f4e6;border:1px solid #e2d8bf;border-radius:13px;padding:22px;transition:background .7s,color .7s;color:#948257}.brand-eyebrow{font:8px 'Space Grotesk';letter-spacing:2px}.demo-brand>b{font:500 32px/1.12 'Space Grotesk';display:block;margin-top:15px;transition:letter-spacing .7s}.brand-palette{display:flex;margin-top:20px;gap:7px}.brand-palette i{height:19px;width:19px;background:#ccaa80;border-radius:50%;transition:background .7s}.brand-palette i:nth-child(2){background:#c4cf9f}.brand-palette i:nth-child(3){background:#f7e6cb}.brand-call{display:block;margin-top:17px;font-size:9px}.demo-active .demo-brand{background:#e6e3f2;border-color:#d5cce5;color:#9485b4}.demo-active .demo-brand>b{font-family:Georgia,serif;letter-spacing:-1px}.demo-active .brand-palette i{background:#b4a5cf}.demo-active .brand-palette i:nth-child(2){background:#bdcedd}.demo-active .brand-palette i:nth-child(3){background:#f4d9e6}.demo-type{width:310px}.demo-type>small{font:8px 'Space Grotesk';letter-spacing:1.8px;color:#b1a68e}.demo-type>div{margin-top:18px}.demo-type b{display:block;font:500 34px/1.2 'Space Grotesk';letter-spacing:-1px;color:#948668;clip-path:inset(0);transform:translateY(0)}.demo-type b:nth-child(2){color:#d5a479}.demo-type b:nth-child(3){color:#acb68b}.replaying .demo-type b{animation:type-reveal .9s var(--demo-ease) both;animation-delay:calc(var(--i)*.13s)}.demo-icons{display:flex;align-items:center;gap:25px}.demo-icons>button{width:85px;height:85px;background:#fff7ee;border:1px solid #e7d3b8;box-shadow:0 6px 0 #d7c1a2;border-radius:24px;position:relative}.demo-icons i{display:block;width:31px;height:2px;background:#c49e70;position:absolute;left:26px;top:40px;transition:transform .6s var(--demo-ease),opacity .3s}.demo-icons i:first-child{transform:translateY(-9px)}.demo-icons i:last-child{transform:translateY(9px)}.demo-active .demo-icons i:first-child{transform:rotate(45deg)}.demo-active .demo-icons i:nth-child(2){opacity:0}.demo-active .demo-icons i:last-child{transform:rotate(-45deg)}.demo-icons b{font:500 23px/1.2 'Space Grotesk';color:#aa956f}.demo-icons>div>span{display:block;font-size:9px;color:#b7ab94;margin-top:10px}.demo-tilt{width:290px;height:190px;background:radial-gradient(at var(--light,30%) 15%,#fffde8,#d5dfb7);border:1px solid #fff;border-radius:19px;padding:25px;position:relative;box-shadow:0 20px 25px #7f8d4e20;transform-style:preserve-3d;transition:transform .65s var(--demo-ease)}.demo-tilt small{font:8px 'Space Grotesk';letter-spacing:1.3px;color:#9ca681}.demo-tilt>b{font:500 31px/1.1 'Space Grotesk';display:block;margin-top:15px;color:#7a8a5b}.demo-tilt>span{font-size:84px;position:absolute;right:25px;top:44px;color:#c1cd91}.demo-tilt>i{font:8px 'Space Grotesk';color:#abb58d;position:absolute;bottom:20px}.demo-active .demo-tilt{transform:perspective(700px) rotateY(12deg) rotateX(8deg)}.demo-glow{width:290px;height:195px;padding:2px;border:0;border-radius:20px;position:relative;overflow:hidden;background:#e3d0ac;box-shadow:0 20px 25px #b28c4520}.demo-glow:before{content:'';position:absolute;inset:-80%;background:conic-gradient(transparent 50%,#ef8d32,#ffe8a8,transparent 85%);animation:spin 4s linear infinite}.demo-glow>div{background:#fff9e9;position:relative;height:100%;border-radius:18px;text-align:left;padding:22px;background-image:radial-gradient(at 100% 100%,#ffd18388,transparent 65%)}.demo-glow small{font:8px 'Space Grotesk';letter-spacing:1.7px;color:#b19b73}.demo-glow b{font:500 34px/1.1 'Space Grotesk';display:block;color:#b28e55;margin-top:13px}.demo-glow span{display:block;color:#b7a27d;font-size:9px;margin-top:13px}.demo-paused .demo-glow:before{animation-play-state:paused}.demo-memory{width:320px;height:190px;position:relative}.memory-core{position:absolute;left:130px;top:64px;width:60px;height:60px;display:grid;place-items:center;font-size:33px;color:#a9b68b;background:#f9fbea;border:1px solid #d6e1c0;border-radius:20px;z-index:2;transition:transform .7s var(--demo-ease)}.demo-memory>span{position:absolute;width:70px;padding:12px;background:#fcfff5;border:1px solid #dbe4c9;border-radius:12px;z-index:2;text-align:center;font-size:11px;color:#a1ae89;transition:transform .8s var(--demo-ease);left:10px;top:13px}.demo-memory>span:nth-of-type(2){left:auto;right:10px}.demo-memory>span:nth-of-type(3){top:auto;bottom:13px}.demo-memory>span:nth-of-type(4){left:auto;right:10px;top:auto;bottom:13px}.demo-memory svg{position:absolute;inset:0;width:100%;height:100%}.demo-memory path{stroke:#cbd7b6;fill:none;stroke-dasharray:4 4;transition:stroke .5s}.demo-active .memory-core{transform:rotate(90deg) scale(1.1)}.demo-active .demo-memory>span{transform:translateX(12px) translateY(7px)}.demo-active .demo-memory>span:nth-of-type(even){transform:translateX(-12px) translateY(-7px)}.demo-version{width:300px}.version-track{display:flex;gap:55px;position:relative;padding:0 20px 20px;justify-content:space-between}.version-track:before{content:'';position:absolute;left:30px;right:30px;top:12px;background:#d3d8c3;height:1px}.version-track>span{font:10px monospace;background:#f3f6e9;border:1px solid #d4ddc0;border-radius:20px;padding:6px 9px;z-index:1;color:#9dab83}.version-track>i{position:absolute;left:20px;top:-3px;width:35px;height:32px;border:1px solid #c4b18b;border-radius:20px;z-index:2;transition:transform .6s var(--demo-ease)}.demo-active .version-track>i{transform:translateX(114px)}.version-page{border:1px solid #dce1ce;background:#fffdf6;padding:20px;border-radius:13px}.version-heading{font:500 25px/1.15 'Space Grotesk';color:#8f9a76;transition:font-size .7s,color .7s}.version-blocks{display:flex;gap:8px;margin:20px 0 15px}.version-blocks>i{height:40px;flex:1;background:#e0e7ce;border-radius:6px;transition:background .7s,transform .7s var(--demo-ease)}.version-blocks>i:nth-child(2){background:#efddc4}.version-page>small{font-size:9px;color:#a9b297}.demo-active .version-heading{font-size:30px;color:#b29771}.demo-active .version-blocks>i:nth-child(2){transform:scale(1.13);background:#dfd4ee}.demo-film{width:310px}.film-frame{height:190px;border:1px solid #decbe6;background:#eee7f5;border-radius:17px;position:relative;overflow:hidden;padding:25px;transition:background .8s}.film-orb{position:absolute;right:-10px;bottom:-35px;width:150px;height:150px;border-radius:50%;background:radial-gradient(at 25% 25%,#edd8eb,#c5a2d0 60%,#9583b8);transition:transform 1s var(--demo-ease)}.film-frame b{font:500 29px/1.1 'Space Grotesk';color:#a293b6;position:relative}.film-frame small{position:absolute;bottom:18px;left:25px;font:8px monospace;color:#b19fc0}.demo-active .film-frame{background:#f3e4d5}.demo-active .film-orb{transform:translate(-140px,-55px) scale(.7)}.film-timeline{display:flex;gap:5px;margin-top:10px}.film-timeline i{height:5px;flex:1;background:#d8c8e3;border-radius:3px}.film-timeline i:nth-child(2){background:#e9d4b9}.film-timeline i:nth-child(3){background:#dce3c9}.demo-slides{width:315px;height:200px;border:1px solid #e1d7c6;border-radius:12px;background:#fffaf0;padding:25px;position:relative;overflow:hidden;display:flex;align-items:center;gap:18px;transition:background .7s}.slide-art{font-size:100px;color:#e2c59d;transition:transform .8s var(--demo-ease),color .7s}.demo-slides small{font:6px 'Space Grotesk';letter-spacing:.7px;color:#ad9e82}.demo-slides b{font:500 26px/1.1 'Space Grotesk';display:block;color:#a8926d;margin-top:10px}.demo-slides p{font-size:8px;color:#b9aa90}.slide-number{position:absolute;right:20px;bottom:12px;font:7px monospace;color:#b6a888}.demo-active .demo-slides{background:#ece8f4}.demo-active .slide-art{transform:rotate(75deg);color:#c2b1dd}.demo-cube-space{width:300px;height:220px;perspective:650px;display:grid;place-items:center}.demo-cube{width:120px;height:120px;transform-style:preserve-3d;transform:rotateX(-22deg) rotateY(-27deg);transition:transform 1.2s var(--demo-ease)}.demo-cube>div{position:absolute;width:120px;height:120px;border:1px solid #fff7;background:#e7c39f;display:grid;place-items:center;font-size:60px;color:#fff8;transform:translateZ(60px)}.demo-cube>div:nth-child(2){background:#c6d6a4;transform:rotateY(90deg) translateZ(60px)}.demo-cube>div:nth-child(3){background:#cbb9e2;transform:rotateX(90deg) translateZ(60px)}.demo-active .demo-cube{transform:rotateX(-32deg) rotateY(-117deg)}
/* Miniatures replay their own visible interaction, with no background JavaScript loops. */
.is-preview .demo-fluid{animation:preview-fluid 5s var(--demo-ease) infinite}.is-preview .demo-fluid>div{animation:preview-opacity 5s ease infinite;visibility:visible;height:125px;padding-top:15px}.is-preview .deck-card{animation:preview-deck 5s var(--demo-ease) infinite}.is-preview .fan-card{animation:preview-fan 5s var(--demo-ease) infinite}.is-preview .demo-tilt{animation:preview-tilt 5s ease-in-out infinite}.is-preview .demo-dialog-card{animation:preview-dialog 5s var(--demo-ease) infinite}.is-preview .demo-bottom-sheet{animation:preview-sheet 5s var(--demo-ease) infinite}.is-preview .mini-bars i{animation:preview-bar 3s ease-in-out infinite;animation-delay:calc(var(--i)*.11s)}.is-preview .demo-cube{animation:preview-cube 6s ease-in-out infinite}.is-preview .flow-track>div>span{animation:preview-node 4s ease-in-out infinite;animation-delay:calc(var(--i)*.4s)}.is-preview .demo-brand{animation:preview-brand 5s ease-in-out infinite}.is-preview .demo-type b{animation:type-reveal 4s var(--demo-ease) infinite;animation-delay:calc(var(--i)*.15s)}.is-preview .success-button{animation:preview-success 4s ease-in-out infinite}.is-preview .success-spark{animation:preview-spark 4s var(--demo-ease) infinite}.is-preview .ruler-line i{animation:preview-ruler 4s ease-in-out infinite}.is-preview .chart-marker{animation:preview-chart 5s var(--demo-ease) infinite}.is-preview .tabs-rail>i{animation:preview-tabs 5s var(--demo-ease) infinite}.is-preview .ripple-disc{animation:preview-ripple 5s ease-in-out infinite}.is-preview .demo-search{animation:preview-search 5s var(--demo-ease) infinite}.is-preview .demo-search input{width:180px;opacity:1}.is-preview .demo-icons i:first-child{animation:preview-icon-top 4s var(--demo-ease) infinite}.is-preview .demo-icons i:nth-child(2){animation:preview-opacity 4s ease infinite}.is-preview .demo-icons i:last-child{animation:preview-icon-bottom 4s var(--demo-ease) infinite}.is-preview .layout-grid>div{animation:preview-layout 4s var(--demo-ease) infinite;animation-delay:calc(var(--i)*.12s)}.is-preview .demo-sidebar aside{animation:preview-sidebar 5s var(--demo-ease) infinite}.is-preview .memory-core{animation:preview-rotate 5s ease-in-out infinite}.is-preview .version-blocks>i:nth-child(2){animation:preview-layout 4s ease-in-out infinite}.is-preview .film-orb{animation:preview-orb 5s ease-in-out infinite}.is-preview .slide-art{animation:preview-rotate 5s ease-in-out infinite}.is-preview .check-track>span{width:66%;animation:preview-progress 4s ease-in-out infinite}.is-preview .demo-checklist label:nth-of-type(-n+2) i{opacity:1;transform:scale(1)}
@keyframes success-bloom{from{opacity:1;transform:scale(.6)}to{opacity:0;transform:scale(1.5)}}@keyframes type-reveal{0%,15%{opacity:0;transform:translateY(25px);clip-path:inset(0 0 100% 0)}40%,100%{opacity:1;transform:none;clip-path:inset(0)}}@keyframes preview-fluid{0%,15%,95%,100%{width:205px;height:62px;border-radius:40px;padding:10px 16px}40%,75%{width:290px;height:205px;border-radius:24px;padding:20px}}@keyframes preview-opacity{0%,20%,95%,100%{opacity:0}40%,75%{opacity:1}}@keyframes preview-deck{0%,15%,100%{transform:translate(calc(var(--i)*6px),calc(var(--i)*6px)) rotate(calc((var(--i) - 1)*7deg))}45%,70%{transform:translate(calc((var(--i) - 1)*85px),calc(var(--i)*5px)) rotate(calc((var(--i) - 1)*13deg))}}@keyframes preview-fan{50%{transform:rotate(calc((1 - var(--i))*18deg)) translateX(calc((1 - var(--i))*40px))}}@keyframes preview-tilt{30%{transform:rotateY(17deg) rotateX(8deg)}70%{transform:rotateY(-15deg) rotateX(-8deg)}}@keyframes preview-dialog{0%,15%,100%{transform:translateY(80px) scale(.75);opacity:0}45%,80%{transform:none;opacity:1}}@keyframes preview-sheet{0%,15%,100%{height:95px}45%,80%{height:192px}}@keyframes preview-bar{50%{height:calc(110% - var(--h))}}@keyframes preview-cube{50%{transform:rotateX(-32deg) rotateY(-117deg)}}@keyframes preview-node{40%,60%{background:#dce8bf;transform:scale(1.12)}}@keyframes preview-brand{50%{background:#e6e3f2;color:#9485b4}}@keyframes preview-success{50%{transform:scale(1.07);background:#e7efce;border-color:#c9d69d}}@keyframes preview-spark{45%,65%{transform:scale(1) rotate(20deg)}}@keyframes preview-ruler{50%{left:80%}}@keyframes preview-chart{50%{transform:translate(230px,12px)}}@keyframes preview-tabs{40%,65%{transform:translateX(100%)}}@keyframes preview-ripple{0%,15%,100%{clip-path:circle(0)}40%,75%{clip-path:circle(75%)}}@keyframes preview-search{0%,15%,100%{width:64px}40%,75%{width:290px}}@keyframes preview-icon-top{40%,70%{transform:rotate(45deg)}}@keyframes preview-icon-bottom{40%,70%{transform:rotate(-45deg)}}@keyframes preview-layout{50%{transform:translateY(-8px) scale(1.05)}}@keyframes preview-sidebar{40%,75%{width:48px}}@keyframes preview-rotate{50%{transform:rotate(90deg)}}@keyframes preview-orb{50%{transform:translate(-140px,-55px) scale(.7)}}@keyframes preview-progress{50%{width:100%}}
@media(max-width:650px){.demo-content{min-height:260px;padding:10px}.demo-controls{gap:8px}.demo-controls>span{font-size:10px}.demo-controls>button{font-size:11px}.demo-preview .demo-unit{transform:scale(.72)}.demo-dashboard{width:290px}.demo-unit:not(.is-preview) .demo-content{min-height:290px}}
/* Enlarged, centered demonstrations */
.learning-card{cursor:pointer;position:relative}.learning-card:focus-visible{outline:2px solid #e7a36d;outline-offset:5px}.learning-card .learning-card-top{margin-top:0}.learning-card h3{margin-top:15px}.learning-actions>span{color:#8e966f;font-size:11px}.learning-actions>span>span{color:var(--orange)}.learning-actions>small{font-size:9px;color:#a9ad9e}.featured-rank{display:flex;justify-content:space-between;font:10px 'Space Grotesk';letter-spacing:.5px;margin-bottom:13px;color:#b59b72}.featured-rank>span:first-child{color:#dc956b}.featured-study .demo-preview{height:205px}.featured-study .demo-preview .demo-unit{transform:scale(.75)}.featured-study .learning-card-top>div>small{display:none}.featured-study .learning-tags{display:none}#detail{width:min(940px,94vw);max-width:940px;max-height:90vh;overflow-y:auto;padding:35px 40px;overscroll-behavior:contain}#detail h2{font-size:27px;line-height:1.4;margin-top:13px;padding-right:20px}.study-intro{font-size:12px;color:#9c9f8d;margin-bottom:18px}.study-demo-toolbar{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:13px}.study-demo-toolbar>label{display:flex;align-items:center;font-size:11px;color:#939d7e;gap:12px;margin:0}.study-demo-toolbar select{background:#fffdf6;color:#8e987c;border:1px solid #e1e5d2;border-radius:9px;padding:10px;font-size:12px}.study-demo-toolbar>span{font-size:10px;color:#b1ac96}.study-large-demo{background:radial-gradient(ellipse at 50% 20%,#fffaf0,#f1f2e8);border:1px solid #e8e7d7;border-radius:17px;padding:18px 25px 22px;min-height:350px}.study-large-demo .demo-content{min-height:310px}.study-large-demo .demo-content>*{transform-origin:center}.study-copy>h3{font-size:14px;font-weight:550;color:#7d8967;margin:24px 0 8px}.study-copy>p{font-size:12px;line-height:1.9;color:#929a82}.study-copy>p.study-basis{font-size:10px;color:#adb29d}.study-copy>details{border-top:1px solid #e3e6d5;margin-top:20px;padding-top:18px}.study-copy summary{font-size:13px;color:#9aa174;cursor:pointer}.prompt-duration{font-size:11px!important;color:#9aa183}.duration-note{font-size:10px!important;color:#afb49f}#detail pre{font-size:11px}#detail .primary{font-size:12px;padding:13px 20px}#detail .close{position:absolute;z-index:5;top:10px;right:15px}.rank-note{font-size:11px;color:#a8ad98;line-height:1.9;margin:0 0 25px;max-width:880px}#grid{grid-template-columns:repeat(3,minmax(0,1fr))}@media(max-width:1050px){#grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:650px){#grid{grid-template-columns:1fr}#detail{padding:28px 18px 25px;width:95vw;max-height:92vh}#detail h2{font-size:22px}.study-demo-toolbar{align-items:start;flex-direction:column;gap:7px}.study-demo-toolbar>span{font-size:9px}.study-large-demo{padding:12px 0 16px;min-height:320px}.study-large-demo .demo-content{min-height:285px;padding:7px}.demo-controls>span{padding:0 12px}.featured-study .demo-preview{height:200px}.featured-study .demo-preview .demo-unit{transform:scale(.72)}.learning-card{padding:20px}.library-overview{gap:15px 20px}}
@media(prefers-reduced-motion:reduce){.demo-unit *{animation:none!important;transition:none!important}.is-preview .demo-dialog-card{transform:none;opacity:1}.is-preview .demo-fluid{height:180px;width:280px}.is-preview .demo-fluid>div{opacity:1}}
.demo-shared{width:210px;height:145px;border:1px solid #c7d9d3;border-radius:15px;background:#ecf3ef;box-shadow:0 15px 22px #667b6c20;position:relative;overflow:hidden;text-align:left;padding:20px;color:#738d7c;transition:width .75s var(--demo-ease),height .75s var(--demo-ease),border-radius .75s}.shared-mountain{position:absolute;width:240px;height:180px;right:-80px;bottom:-90px;background:linear-gradient(135deg,#d6e6e4,#acc5ba);transform:rotate(45deg);transition:transform .75s var(--demo-ease)}.demo-shared small{font:7px 'Space Grotesk';letter-spacing:1px;position:relative}.demo-shared b{font:500 22px/1.1 'Space Grotesk';display:block;margin-top:15px;position:relative}.demo-shared>div{font-size:10px;position:relative;opacity:0;margin-top:17px;transition:opacity .4s .2s}.demo-active .demo-shared{width:300px;height:230px;border-radius:22px}.demo-active .shared-mountain{transform:rotate(45deg) scale(1.5)}.demo-active .demo-shared>div{opacity:1}.demo-stagger{display:grid;grid-template-columns:repeat(3,75px);gap:10px}.demo-stagger>div{height:75px;background:#dce6c9;border:1px solid #fafff0;border-radius:13px;display:grid;place-items:center;font-size:34px;color:#fff9;box-shadow:0 10px 15px #8a9c6815}.demo-stagger>div:nth-child(3n+2){background:#eadac8}.demo-stagger>div:nth-child(3n){background:#d9d2e9}.replaying .demo-stagger>div{animation:stagger-pop 1s var(--demo-ease) both;animation-delay:calc(var(--i)*.09s)}.is-preview .demo-shared{animation:preview-shared 5s var(--demo-ease) infinite}.is-preview .demo-stagger>div{animation:stagger-pop 4s var(--demo-ease) infinite;animation-delay:calc(var(--i)*.1s)}@keyframes stagger-pop{0%,12%{opacity:0;transform:translateY(35px) scale(.7)}40%,100%{opacity:1;transform:none}}@keyframes preview-shared{0%,15%,100%{width:210px;height:145px}40%,75%{width:300px;height:230px}}

@media(min-width:651px){.study-large-demo .demo-content{min-height:330px}.study-large-demo .demo-content>div,.study-large-demo .demo-content>button{scale:1.2}}
/* Brand, language control and a dedicated complete collection. */
.brand{display:inline-flex;align-items:center;gap:10px;letter-spacing:normal;white-space:nowrap}.brand img{display:block;width:38px;height:38px;border-radius:11px;filter:drop-shadow(0 3px 4px #35271c12);transition:transform .35s var(--spring)}.brand:hover img{transform:translateY(-2px) rotate(-4deg)}.brand b{font:650 21px 'Space Grotesk',sans-serif;letter-spacing:-.8px}.header-tools{display:flex;align-items:center;gap:20px}.header-tools .edition{font-size:9px;letter-spacing:1.4px}.language-switch{display:flex;gap:2px;padding:3px;background:#f0eee7;border:1px solid #e3dfd2;border-radius:22px}.language-switch button{border:0;border-radius:18px;background:transparent;color:#979d8a;font-size:11px;min-width:35px;padding:7px 9px}.language-switch button[aria-pressed=true]{background:#fffdf7;box-shadow:0 2px 5px #62562b0c;color:#6f7d56}.all-nav{display:flex;align-items:center;gap:6px}.all-nav small{font:9px 'Space Grotesk';background:#f1e6d6;border-radius:10px;padding:3px 5px;color:#b49064}header nav{gap:25px;font-size:12px}footer .brand img{width:29px;height:29px;border-radius:8px}footer .brand b{font:600 16px 'Space Grotesk',sans-serif;letter-spacing:-.5px}footer .brand{gap:8px}.all-page-heading{display:none;padding:12px 0 25px}.all-page-heading>a{display:inline-block;font-size:12px;color:#99a47f;margin-bottom:35px}.all-page-heading .eyebrow{font-size:10px;letter-spacing:2px}.all-page-heading h1{font-size:52px;line-height:1.25;letter-spacing:-2px;margin:20px 0 14px}.all-page-heading h1 span{color:#e29261}.all-page-heading p{font-size:13px;color:#9da58e}.all-view .hero,.all-view #explore,.all-view #method{display:none}.all-view #library>.section-top{display:none}.all-view .all-page-heading{display:block}.all-view #library{border-top:0;padding-top:38px}.all-view .library-overview{margin-top:5px}.all-view footer{margin-top:15px}.library-tools{flex-wrap:wrap;gap:12px 16px}.library-search{min-width:250px}.per-page{display:flex;align-items:center;gap:6px}.per-page input{width:61px;padding:11px 9px;border:1px solid #e2e1d8;background:#fff;color:#77845e;border-radius:9px;font:12px 'Space Grotesk';appearance:textfield;-moz-appearance:textfield}.per-page input::-webkit-inner-spin-button,.per-page input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
/* Give every select its own consistent, inset chevron. */
select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='m2 2 4 4 4-4' fill='none' stroke='%23959d87' stroke-width='1.35' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")!important;background-repeat:no-repeat!important;background-size:11px 8px!important;background-position:right 14px center!important;padding-right:38px!important;line-height:1.4}.select-wrap select{margin-left:8px;padding-left:12px;min-height:40px}.study-demo-toolbar select{padding-left:12px;min-height:40px}html[lang=en] h1{font-size:clamp(52px,5.6vw,78px);letter-spacing:-3px}html[lang=en] .all-page-heading h1{font-size:50px}html[lang=en] .hero h1{max-width:650px}html[lang=en] .section-top h2{font-size:29px}html[lang=en] .card h3,html[lang=en] .learning-card h3{font-family:'Space Grotesk',sans-serif;font-size:18px;line-height:1.45}html[lang=en] .study-demo-toolbar{gap:12px}html[lang=en] .library-topics button{font-size:10px}html[lang=en] .demo-controls>span{font-size:10px}.library-overview{justify-content:space-between}.library-overview>div:last-child b{color:#d5a36c}
@media(max-width:1100px){.header-tools .edition{display:none}.header-tools{gap:10px}.library-search{min-width:300px}.all-page-heading h1{font-size:45px}}@media(max-width:850px){header{height:auto;min-height:96px;flex-wrap:wrap;padding:18px 5% 10px;gap:15px}.brand img{width:34px;height:34px}.brand b{font-size:20px}.header-tools{margin-left:auto}header nav{order:3;flex-basis:100%;justify-content:space-between;gap:15px;border-top:1px solid #e8e7dd;padding-top:14px;padding-bottom:8px;font-size:12px}nav a.active:after{bottom:-8px}.all-view #library{padding-top:25px}.all-page-heading>a{margin-bottom:25px}.all-page-heading h1,html[lang=en] .all-page-heading h1{font-size:40px}}@media(max-width:650px){header{padding-top:15px}.brand{gap:9px}header .brand b{font-size:19px;letter-spacing:-.7px}header nav{gap:10px}header nav a{font-size:11px}header nav a:nth-child(2){display:inline-flex}.all-nav small{font-size:8px}.header-tools .language-switch button{font-size:10px;min-width:33px;padding:7px 9px}.library-search{min-width:0;flex-basis:100%}.library-tools .select-wrap{flex:1;display:flex;align-items:center;font-size:10px}.select-wrap select{max-width:100%;width:100%;min-width:0;margin-left:6px;font-size:10px;padding-left:9px;padding-right:32px!important;background-position:right 11px center!important}.library-tools .per-page{flex:0 0 100%;justify-content:flex-end}.per-page input{width:65px;padding:9px}.library-overview{gap:18px 23px;justify-content:start}.library-overview>div{min-width:calc(50% - 24px)}.all-page-heading h1 span{display:block}.all-page-heading h1,html[lang=en] .all-page-heading h1{font-size:35px;letter-spacing:-1px}.all-page-heading p{font-size:12px}html[lang=en] .hero h1{font-size:58px;letter-spacing:-2px}html[lang=en] .section-top h2{font-size:26px}html[lang=en] header nav{gap:9px}html[lang=en] header nav a{font-size:11px}html[lang=en] .method h2{font-size:28px}html[lang=en] .hero-stats{gap:13px;font-size:9px}html[lang=en] .hero-stats b{font-size:16px}footer .brand b{font-size:14px}footer .brand img{width:26px;height:26px}}

.library-grid>*{min-width:0}.learning-card{overflow-wrap:anywhere}@media(max-width:650px){.library-grid{grid-template-columns:minmax(0,1fr)}.learning-card{width:100%;max-width:100%}.learning-card .mini-demo{min-width:0}}
/* Independent Y2K, neo-brutalist and editorial interaction studies. */
.lab-holo{--rx:0deg;--ry:0deg;--shine:50%;width:270px;height:210px;border-radius:20px;padding:24px;position:relative;overflow:hidden;color:#34304c;background:linear-gradient(135deg,#d8dfff,#efffd7 30%,#f9d5ef 58%,#bcecf5 80%,#e9e0ff);box-shadow:0 20px 35px #63559b28,inset 0 0 0 1px #fff;transform:perspective(650px) rotateX(var(--rx)) rotateY(var(--ry));transition:transform .25s ease;touch-action:none;cursor:grab}.lab-holo:after{content:'';position:absolute;inset:-50%;pointer-events:none;background:linear-gradient(110deg,transparent 30%,#ffffffbb 48%,transparent 58%);background-position:var(--shine);transform:translateX(calc(var(--shine) - 50%))}.lab-holo small,.lab-chrome small,.lab-chrome span{font-size:9px;letter-spacing:2px}.lab-holo b{display:block;font-size:36px;line-height:1.05;margin-top:18px}.lab-holo>span{position:absolute;right:25px;top:70px;font-size:65px}.lab-holo em{display:block;font-style:normal;font-size:8px;letter-spacing:2px;margin-top:20px}.lab-chrome{border:0;border-radius:18px;width:290px;height:210px;background:#eef0f8;color:#514f6f;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:20px;cursor:pointer}.lab-chrome b{font:900 66px/1 Arial,sans-serif;letter-spacing:-4px;color:transparent;background:linear-gradient(170deg,#fefefe 3%,#b7c1d5 20%,#fff 28%,#5d6477 32%,#eef3ff 45%,#7b8398 60%,#fff 65%,#b4bfd5 85%);background-clip:text;-webkit-background-clip:text;position:relative}.lab-chrome b:after{content:'FLOW';position:absolute;inset:0;background:linear-gradient(110deg,transparent 35%,#fff 48%,transparent 60%);background-size:300% 100%;background-clip:text;-webkit-background-clip:text;color:transparent}.replaying .lab-chrome b:after{animation:lab-sweep 1.4s ease both}.lab-sticker{width:280px;height:225px;position:relative;padding:16px;background:#fff9e9;border:2px solid #2f302c;box-shadow:6px 6px 0 #333;border-radius:8px}.lab-sticker>small{font-size:9px;font-weight:800}.sticker-slots{display:flex;gap:16px;margin-top:18px}.sticker-slots>span{display:block;width:120px;height:120px;border:2px dashed #c7bea7;border-radius:8px;padding:8px;font-size:11px;color:#9a917e}.sticker-piece{--x:0px;position:absolute;left:16px;top:48px;width:112px;height:112px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#e6ff79;border:2px solid #292c26;border-radius:6px;font-size:38px;box-shadow:4px 4px 0 #292c26;transform:translateX(var(--x));transition:transform .45s cubic-bezier(.2,.8,.2,1.2),box-shadow .2s;touch-action:none;cursor:grab}.sticker-piece b{font-size:14px}.sticker-piece.dragging{transition:none;transform:translateX(var(--x)) rotate(-7deg) scale(1.06);box-shadow:10px 14px 0 #292c2666;cursor:grabbing}.lab-sticker>p{position:absolute;bottom:10px;font-size:8px;letter-spacing:1px}.lab-linked{width:285px;padding:20px;background:#fff7ed;border:2px solid #333;box-shadow:5px 5px 0 #333;border-radius:9px}.lab-linked>small{font-size:9px;letter-spacing:1px}.lab-linked>output{display:block;font-size:23px;font-weight:800;margin:12px 0}.linked-bars{display:flex;align-items:end;gap:10px;height:120px}.linked-bars button{flex:1;min-width:0;background:none;border:0;padding:0;cursor:pointer}.linked-bars i{display:block;height:var(--bar);background:#d5d0c6;border:2px solid #333;border-radius:4px 4px 0 0;transition:background .25s,transform .25s}.linked-bars button.selected i{background:#ddff70;transform:translateY(-5px)}.linked-bars span{display:block;font:8px monospace;margin-top:8px}.linked-dots{display:flex;justify-content:space-around;border-top:1px solid #3333;margin-top:13px;padding-top:13px}.linked-dots span{color:#d5d0c6;transition:color .25s,transform .25s}.linked-dots span.selected{color:#f2643a;transform:scale(1.4)}.lab-stamp{width:285px;height:220px;position:relative;padding:22px;background:#fffaef;border:2px solid #333;box-shadow:6px 6px 0 #333;border-radius:8px;overflow:hidden}.lab-stamp>small{font-size:9px;letter-spacing:1px}.lab-stamp h3{font-size:23px;margin:18px 0 9px}.stamp-status{font-size:11px}.stamp-buttons{display:flex;gap:9px;position:absolute;bottom:18px}.stamp-buttons button{border:2px solid #333;border-radius:4px;padding:7px 20px;background:#dfff8d;cursor:pointer;font-size:11px}.stamp-buttons button+button{background:#ffd9ce}.stamp-mark{position:absolute;top:78px;right:16px;color:#227653;border:3px double currentColor;padding:6px;font:bold 16px monospace;opacity:0;transform:rotate(-12deg) scale(2);pointer-events:none}.lab-stamp[data-status=rejected] .stamp-mark{color:#c84c3b}.stamp-mark.landed{animation:lab-stamp .55s cubic-bezier(.2,.8,.3,1) both}.lab-magazine{width:270px;height:225px;position:relative;perspective:900px;background:#fff8e8;border:0;padding:0;box-shadow:0 15px 24px #583c2522;cursor:pointer;text-align:left}.mag-page,.mag-next{position:absolute;inset:0;padding:20px;display:flex;flex-direction:column;backface-visibility:hidden;transform-origin:left center;border:1px solid #dbcdb6;background:#fff9ed;color:#282a28;transition:transform 1s cubic-bezier(.3,.1,.2,1),opacity .7s;overflow:hidden}.mag-page{z-index:2}.mag-next{background:#f1e9dc;transform:translateX(8px) rotate(2deg)}.lab-magazine small{font:8px monospace;letter-spacing:1px;border-bottom:1px solid #222;padding-bottom:9px}.lab-magazine b{font:italic 30px/1.05 Georgia,serif;letter-spacing:-1px;margin-top:12px}.lab-magazine i{position:absolute;right:25px;bottom:38px;color:#ec543a;font-size:64px;font-style:normal}.lab-magazine em{font:7px monospace;letter-spacing:1px;margin-top:auto}.demo-active .mag-page{transform:rotateY(-110deg);opacity:0}.demo-active .mag-next{transform:none}.is-preview .lab-holo{animation:lab-holo 5s ease-in-out infinite}.is-preview .lab-chrome b:after{animation:lab-sweep 4s ease infinite}.is-preview .sticker-piece{animation:lab-drag 5s ease infinite}.is-preview .linked-bars button:nth-child(3) i{background:#ddff70}.is-preview .linked-dots span:nth-child(3){color:#f2643a}.is-preview .stamp-mark{animation:lab-stamp 4s ease infinite}.is-preview .mag-page{animation:lab-flip 6s ease infinite}@keyframes lab-sweep{from{background-position:100% 0}to{background-position:0 0}}@keyframes lab-holo{0%,100%{transform:perspective(650px) rotateY(-12deg) rotateX(5deg)}50%{transform:perspective(650px) rotateY(12deg) rotateX(-5deg)}}@keyframes lab-drag{0%,10%,100%{transform:translateX(0)}35%,65%{transform:translateX(136px) rotate(-5deg)}}@keyframes lab-stamp{0%{opacity:0;transform:rotate(-12deg) scale(2.5)}60%{opacity:1;transform:rotate(-12deg) scale(.94)}80%,100%{opacity:1;transform:rotate(-12deg) scale(1)}}@keyframes lab-flip{0%,15%,100%{transform:none;opacity:1}45%,70%{transform:rotateY(-110deg);opacity:0}}@media(prefers-reduced-motion:reduce){.lab-holo,.sticker-piece,.mag-page,.mag-next,.linked-bars i,.linked-dots span{transition:none!important;animation:none!important}.lab-chrome b:after,.stamp-mark{animation:none!important}.stamp-mark.landed{opacity:1;transform:rotate(-12deg)}.is-preview .mag-page{animation:none!important}}
/* Loading and feedback studies: local-only, reversible examples. */
.nx-hold,.nx-jelly,.nx-load,.nx-stream,.nx-notice,.nx-form,.nx-sand{width:280px;min-height:210px;padding:22px;border-radius:20px;background:#fffaf1;box-shadow:0 16px 30px #6c553017;position:relative;box-sizing:border-box;color:#3b4038}.demo-content [class^=nx-]>small{display:block;font:8px monospace;letter-spacing:1.2px;margin-bottom:20px}.nx-hold>p,.nx-jelly>p,.nx-load p,.nx-stream p,.nx-form p{font-size:11px;line-height:1.6}.nx-hold-button{--progress:0%;width:100%;height:55px;border:1px solid #323a2c;border-radius:30px;background:#f0efd9;position:relative;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none;cursor:pointer}.nx-hold-button i{position:absolute;inset:0;width:var(--progress);background:#d6f57d}.nx-hold-button span{position:relative;z-index:1;font-size:13px}.nx-hold-button.holding i{animation:nx-fill 1s linear both}.nx-jelly button{width:110px;height:58px;border:0;border-radius:40px;background:#deded5;cursor:pointer;padding:5px;transition:background .4s;display:block;margin:28px auto}.nx-jelly button i{display:block;width:48px;height:48px;border-radius:50%;background:#fff;box-shadow:0 3px 8px #4442;transform:translateX(0);transition:transform .5s cubic-bezier(.2,1.4,.4,1)}.nx-jelly button[aria-checked=true]{background:#b4d686}.nx-jelly button[aria-checked=true] i{transform:translateX(52px)}.nx-jelly button.squish i{animation:nx-squish .55s both}.nx-jelly p{text-align:center}.nx-load{min-height:250px}.nx-placeholder{height:95px;position:relative}.nx-placeholder i,.nx-placeholder span{display:block;border-radius:7px;background:linear-gradient(100deg,#e8e6dc 20%,#faf9f2 45%,#e8e6dc 65%);background-size:250% 100%}.nx-placeholder i{width:60px;height:60px;float:left;margin-right:12px}.nx-placeholder span{height:13px;margin-bottom:13px}.nx-load[data-state=loading] .nx-placeholder :is(i,span){animation:nx-shimmer 1.2s linear infinite}.nx-load[data-state=success] .nx-placeholder{visibility:hidden}.nx-loaded{position:absolute;top:53px;left:22px;right:22px;height:80px;opacity:0;transform:translateY(6px);transition:opacity .4s,transform .4s;pointer-events:none}.nx-loaded b{font-size:21px}.nx-load[data-state=success] .nx-loaded{opacity:1;transform:none}.nx-load[data-state=error] .nx-load-status{color:#b74935}.nx-load button,.nx-stream button,.nx-notice button,.nx-form button,.nx-sand>button{border:1px solid #b9bda8;background:#fffdf6;border-radius:20px;padding:8px 12px;font-size:11px;cursor:pointer}.nx-load button+button{margin-left:4px}.nx-stream-text{min-height:112px;border-left:2px solid #f27c4b;padding-left:12px}.nx-stream button+button{margin-left:4px}.nx-stream-status{color:#7c836d}.nx-notice-item{padding:22px 12px;background:#edf1dc;border-radius:10px;transition:opacity .3s,transform .3s}.nx-notice-item b{display:block;font-size:17px;margin-bottom:14px}.nx-notice.removed .nx-notice-item{opacity:0;transform:translateX(-25px);pointer-events:none;visibility:hidden}.nx-undo{display:flex;justify-content:space-between;align-items:center;gap:6px;padding:9px 12px;background:#333e2e;color:#fff;border-radius:12px;opacity:0;transform:translateY(12px);transition:opacity .3s,transform .3s;pointer-events:none;margin-top:12px;font-size:11px;visibility:hidden}.nx-notice.removed .nx-undo{opacity:1;transform:none;pointer-events:auto;visibility:visible}.nx-undo button{background:transparent;color:#e4ff9a;border:0}.nx-form label{display:block;position:relative;margin-top:32px}.nx-form input{width:100%;height:50px;box-sizing:border-box;border:1px solid #b8c0a7;border-radius:9px;background:#fffdf7;padding:18px 12px 5px;font-size:13px;color:#333}.nx-form label span{position:absolute;left:12px;top:16px;font-size:12px;color:#818774;pointer-events:none;transition:transform .2s,font-size .2s}.nx-form input:focus+span,.nx-form input:not(:placeholder-shown)+span{transform:translateY(-12px);font-size:9px}.nx-form input[aria-invalid=true]{border-color:#c35d46}.nx-form[data-valid=false] p{color:#b94730}.nx-form[data-valid=true] p{color:#46703d}.nx-form.shake label{animation:nx-shake .35s both}.nx-sand{height:250px;overflow:hidden}.nx-sand-card{height:110px;background:#f5c6ae;border-radius:12px;padding:20px;box-sizing:border-box;transition:opacity .3s}.nx-sand-card b{font-size:28px;display:block}.nx-sand-card span{font:7px monospace;letter-spacing:2px;display:block;margin-top:10px}.nx-sand>button{margin-top:18px;position:relative;z-index:2}.nx-grains{position:absolute;left:22px;top:53px;width:236px;height:110px;pointer-events:none;opacity:0}.nx-grains i{position:absolute;left:var(--gx);top:var(--gy);width:12px;height:10px;border-radius:2px;background:#eaa37c}.nx-sand.gone .nx-sand-card{opacity:0}.nx-sand.gone .nx-grains{opacity:1}.nx-sand.gone .nx-grains i{animation:nx-grain .9s ease-in both;animation-delay:var(--delay)}.is-preview .nx-jelly button i{animation:nx-preview-toggle 4s ease infinite}.is-preview .nx-placeholder :is(i,span){animation:nx-shimmer 2s linear infinite}.is-preview .nx-hold-button i{animation:nx-fill 4s linear infinite}.is-preview .nx-stream-text:before{content:'Good ideas deserve thoughtful feedback.'}.is-preview .nx-undo{opacity:1;transform:none;visibility:visible}.is-preview .nx-sand .nx-grains{opacity:1}.is-preview .nx-grains i{animation:nx-grain 4s ease infinite;animation-delay:var(--delay)}@keyframes nx-fill{from{width:0}to{width:100%}}@keyframes nx-squish{0%,100%{scale:1}35%{scale:1.25 .8}70%{scale:.92 1.08}}@keyframes nx-shimmer{from{background-position:100% 0}to{background-position:0 0}}@keyframes nx-shake{0%,100%{translate:0}25%,75%{translate:-5px}50%{translate:5px}}@keyframes nx-grain{0%{opacity:0;transform:none}15%{opacity:1}100%{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(90deg) scale(.2)}}@keyframes nx-preview-toggle{0%,15%,100%{transform:translateX(0)}45%,70%{transform:translateX(52px)}}@media(prefers-reduced-motion:reduce){[class^=nx-],[class^=nx-] *{animation:none!important;transition:none!important}.nx-hold-button.holding i{width:50%}.nx-sand.gone .nx-grains{opacity:0}}@media(max-width:400px){.nx-hold,.nx-jelly,.nx-load,.nx-stream,.nx-notice,.nx-form,.nx-sand{max-width:100%}}
.nx-brushed{background:repeating-linear-gradient(0deg,#ffffff1a 0 1px,#72798513 1px 2px),linear-gradient(115deg,#eff2f5,#a9afb6 25%,#f8fafb 45%,#bec5ca 60%,#e5e7ea);border-radius:16px;color:#3f464e;text-shadow:0 1px #fff8}.nx-brushed b{font-size:30px;letter-spacing:-1px}.nx-brushed:after{background:linear-gradient(110deg,transparent 25%,#fff9 48%,transparent 65%)}.nx-brushed em{margin-top:14px}.nx-glass{position:relative;width:290px;height:240px;padding:12px;box-sizing:border-box;isolation:isolate}.glass-bg{position:absolute;inset:0 0 45px;overflow:hidden;border-radius:20px;background:#f1eee9;z-index:-1}.glass-bg i{position:absolute;left:-25px;top:20px;width:190px;height:100px;border-radius:50%;background:#b7d0fb;transform:rotate(-25deg)}.glass-bg i+i{left:130px;top:65px;background:#f7bea3}.glass-panel{position:relative;border-radius:15px;padding:20px;height:155px;box-sizing:border-box;color:#343f46;background:#ffffff08;border:1px solid transparent;transition:background .4s,border-color .4s,box-shadow .4s,backdrop-filter .4s}.glass-panel small{display:block;font:7px monospace;letter-spacing:1px}.glass-panel b{font-size:27px;line-height:1.05;display:block;margin-top:15px}.glass-panel>span{display:block;font-size:9px;margin-top:12px}.nx-glass:not([data-layer="0"]) .glass-panel{backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}.nx-glass:is([data-layer="2"],[data-layer="3"],[data-layer="4"],[data-layer="5"]) .glass-panel{backdrop-filter:blur(14px) saturate(140%);-webkit-backdrop-filter:blur(14px) saturate(140%)}.nx-glass:is([data-layer="3"],[data-layer="4"],[data-layer="5"]) .glass-panel{background:#ffffff70}.nx-glass:is([data-layer="4"],[data-layer="5"]) .glass-panel{border-color:#ffffffe0}.nx-glass[data-layer="5"] .glass-panel{box-shadow:inset 0 2px 4px #fff,inset 0 -2px 10px #8fb6cf26,0 10px 25px #31547120;background:linear-gradient(135deg,#ffffffb0,#ffffff45)}.nx-glass>label{display:flex;align-items:center;gap:8px;font-size:9px;margin-top:32px;white-space:nowrap}.nx-glass input{width:100px;accent-color:#e97647}.nx-heat{--hx:50%;--hy:50%;width:285px;height:225px;border:0;border-radius:18px;padding:22px;background:#f0e8fa;color:#62557c;cursor:pointer;touch-action:none;position:relative;overflow:hidden}.nx-heat small,.nx-heat span{display:block;font:8px monospace;letter-spacing:1px}.nx-heat b{display:block;font:900 42px/1 Arial,sans-serif;letter-spacing:-2px;margin:23px 0;color:transparent;background:radial-gradient(ellipse at var(--hx) var(--hy),#fff08a 0%,#ff8248 22%,#da3b93 43%,#4b4fbd 64%,#292246 85%);background-clip:text;-webkit-background-clip:text;transition:filter .6s}.demo-active .nx-heat b{filter:hue-rotate(85deg)}.nx-heat:after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 3px,#ffffff20 3px 4px);pointer-events:none}.is-preview .nx-brushed{animation:lab-holo 5s ease infinite}.is-preview .nx-glass .glass-panel{backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);background:#ffffff70;border-color:white}.is-preview .nx-heat b{animation:nx-thermal 6s ease infinite}@keyframes nx-thermal{50%{filter:hue-rotate(85deg)}}@supports not (backdrop-filter:blur(1px)){.glass-panel{background:#f9f7f1!important}}@media(prefers-reduced-motion:reduce){.nx-brushed,.glass-panel,.nx-heat b{animation:none!important;transition:none!important}}

/* Independent component studies */
.nx-chips,.nx-command{width:min(420px,92%);padding:26px;background:#fffaf3;border:1px solid #e8dace;border-radius:24px;color:#352e26;box-shadow:0 16px 45px #82532d13}.nx-chips small,.nx-command small{display:block;font-size:9px;letter-spacing:2px;color:#9c765b;margin-bottom:15px}.nx-chips h4{font-size:22px;margin:0 0 20px}.nx-chip-options,.nx-chip-selected{display:flex;gap:8px;flex-wrap:wrap}.nx-chip-options button,.nx-chip-selected button{border:1px solid #dfd5c8;border-radius:24px;padding:9px 13px;color:#665746;background:white;cursor:pointer;transition:background .18s,border-color .18s,transform .18s}.nx-chip-options button[aria-pressed=true]{background:#ff6d33;border-color:#ff6d33;color:white;transform:translateY(-2px)}.nx-chip-options i{font-style:normal;margin-left:8px}.nx-chip-selected{min-height:46px;margin-top:18px;align-content:center}.nx-chip-selected button{background:#f0e5d7;font-size:11px}.nx-chips p,.nx-command-status{font-size:12px;min-height:18px;color:#826b58}.nx-chips [data-chip-reset],.nx-command [data-command-open],.nx-command [data-command-close]{border:0;border-radius:12px;background:#2e302c;color:#fff;padding:11px 15px;cursor:pointer}.nx-command-panel{margin-top:16px;border:1px solid #e6d8cb;border-radius:16px;background:white;padding:12px;animation:nx-command-in .2s ease-out}.nx-command-panel[hidden],.nx-command-empty[hidden]{display:none}.nx-command input{width:100%;border:1px solid #e6d8cb;border-radius:10px;padding:11px;font:inherit;font-size:13px;background:#fffcf9}.nx-command-results{display:grid;gap:4px;margin:8px 0}.nx-command-results button{border:0;border-radius:8px;padding:9px 11px;background:#faf5ee;text-align:left;color:#4e4134;cursor:pointer}.nx-command-results button:hover,.nx-command-results button:focus-visible{background:#ffdfcb;outline:2px solid #e96b32}.nx-command [data-command-close]{font-size:10px;padding:7px 10px}.nx-command-empty{font-size:12px;color:#826b58}.nx-chips button:focus-visible,.nx-command button:focus-visible{outline:2px solid #e96b32;outline-offset:3px}@keyframes nx-command-in{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}@media(prefers-reduced-motion:reduce){.nx-command-panel{animation:none}.nx-chip-options button,.nx-chip-selected button{transition:none}}

/* Local-only UI feedback studies */
.ui-upload,.ui-zoom,.ui-empty{width:min(400px,92%);padding:24px;background:#fffaf2;border:1px solid #e4d5c7;border-radius:22px;color:#3a322b;box-shadow:0 18px 45px #8a523414}.ui-upload small,.ui-zoom small,.ui-empty small{display:block;font-size:9px;letter-spacing:1.6px;color:#98765b;margin-bottom:17px}.ui-upload h4{font-size:20px;margin:0 0 8px}.ui-upload p,.ui-empty p{font-size:12px;line-height:1.7;color:#8a705c}.ui-upload-track{height:8px;border-radius:8px;background:#eee1d2;overflow:hidden;margin-top:22px}.ui-upload-track i{display:block;width:var(--upload-progress,0%);height:100%;background:#ff743e;transition:width .08s linear}.ui-upload[data-state=error] .ui-upload-track i{background:#c64a42}.ui-upload[data-state=success] .ui-upload-track i{background:#699160}.ui-upload output{display:block;font-size:28px;font-weight:700;margin-top:10px}.ui-upload-actions{display:flex;gap:6px;flex-wrap:wrap}.ui-upload button,.ui-zoom button,.ui-empty button{border:1px solid #dfd1c2;border-radius:10px;padding:9px 12px;background:white;color:#524332;font-size:11px;cursor:pointer}.ui-upload [data-upload-start],.ui-empty [data-empty-reset]{background:#ff733c;color:white;border-color:#ff733c}.ui-zoom-window{height:165px;overflow:hidden;border-radius:13px;background:#f6dfc4}.ui-zoom-art{height:100%;position:relative;background:linear-gradient(#d3e7e6,#f6e4c5);transform-origin:center;transition:transform .2s ease}.ui-zoom-art i{position:absolute;width:48px;height:48px;background:#ff9e5a;border-radius:50%;right:22%;top:16%}.ui-zoom-art span{position:absolute;inset:35% -20% -65%;border-radius:45%;background:#739285;transform:rotate(-15deg)}.ui-zoom-art b{position:absolute;bottom:15px;left:15px;font-size:15px;line-height:1.2;color:#fff}.ui-zoom label{display:flex;gap:9px;align-items:center;font-size:11px;margin:18px 0}.ui-zoom input{width:100%;min-width:0;accent-color:#ff733c}.ui-zoom output{white-space:nowrap}.ui-empty-filters{display:flex;gap:8px}.ui-empty-filters [aria-pressed=true]{background:#403b33;color:#fff;border-color:#403b33}.ui-empty-cards{display:flex;gap:10px;min-height:180px;align-items:center}.ui-empty-cards article{flex:1;min-width:0;border-radius:14px;background:#f2e4d3;padding:18px 12px}.ui-empty-cards span{display:block;font-size:30px;color:#ff733c;margin-bottom:10px}.ui-empty-cards b{font-size:12px}.ui-empty-message{min-height:180px;text-align:center;padding:18px 0 0}.ui-empty-message>span{font-size:35px;color:#c59366}.ui-empty-message h4{margin:7px 0;font-size:17px}.ui-empty-message p{margin:4px 0 12px}.ui-empty [hidden]{display:none}.ui-upload button:focus-visible,.ui-zoom button:focus-visible,.ui-empty button:focus-visible{outline:2px solid #f4763e;outline-offset:3px}@media(prefers-reduced-motion:reduce){.ui-upload-track i,.ui-zoom-art{transition:none}}

/* All-studies local preview: persistent category rail */
.library-workspace,.library-content{display:contents}.library-sidebar{display:none}.all-view .library-workspace{display:grid;grid-template-columns:214px minmax(0,1fr);align-items:start;gap:30px;margin-top:30px}.all-view .library-content{display:block;min-width:0}.all-view .library-sidebar{display:block;position:sticky;top:24px;align-self:start;max-height:calc(100dvh - 48px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:23px 15px 15px;background:#fffdf8;border:1px solid #e7dfd2;border-radius:20px;box-shadow:0 8px 28px #8b603208}.library-sidebar-heading{padding:0 10px 17px;border-bottom:1px solid #ece4d8}.library-sidebar-heading>span{display:block;font:9px monospace;letter-spacing:2px;color:#b48a65}.library-sidebar-heading b{display:block;font-size:19px;letter-spacing:-.5px;margin-top:10px;color:#3d3a30}.library-sidebar-heading p{font-size:11px;line-height:1.6;color:#95836c;margin:7px 0 0}.all-view .library-sidebar .library-topics{display:flex;flex-direction:column;gap:6px;margin-top:16px}.all-view .library-sidebar .library-topics button{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;min-height:43px;text-align:left;padding:11px 12px;border:1px solid transparent;border-radius:11px;background:transparent;color:#746d5e;font-size:12px;line-height:1.4}.all-view .library-sidebar .library-topics button small{margin:0;padding:3px 6px;min-width:25px;text-align:center;border-radius:6px;background:#eee8dc;color:#8b7a63;font:10px monospace;opacity:1}.all-view .library-sidebar .library-topics button:hover{background:#f5eee3;border-color:#eadac4}.all-view .library-sidebar .library-topics button.selected{background:#fc7138;color:white;border-color:#fc7138;box-shadow:0 4px 12px #ed7b4520}.all-view .library-sidebar .library-topics button.selected small{background:#ffffff26;color:white}.all-view .library-sidebar button:focus-visible{outline:2px solid #d8602e;outline-offset:2px}.all-view .library-content .library-tools{margin-top:0}.all-view .library-content .library-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.all-view .library-content .library-caption{margin-top:19px}.all-view .library-content .library-tools .library-search{flex:1 1 100%}.all-view .library-content .library-tools .per-page{margin-left:auto}.all-view .library-content .library-grid .learning-card h3{line-height:1.5}@media(min-width:1440px){.all-view .library-workspace{grid-template-columns:220px minmax(0,1fr);gap:36px}.all-view main{max-width:1600px}.all-view .library-content .library-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:760px){.all-view .library-workspace{grid-template-columns:160px minmax(0,1fr);gap:17px}.all-view .library-sidebar{padding:18px 9px 10px;top:16px;max-height:calc(100dvh - 32px);border-radius:15px}.library-sidebar-heading{padding:0 8px 14px}.library-sidebar-heading b{font-size:16px}.library-sidebar-heading p{font-size:10px}.all-view .library-sidebar .library-topics button{padding:10px 8px;font-size:11px}.all-view .library-content .library-grid{grid-template-columns:minmax(0,1fr)}}@media(max-width:560px){.all-view .library-workspace{grid-template-columns:116px minmax(0,1fr);gap:12px}.all-view main{padding-left:12px;padding-right:12px}.all-view .library-sidebar{padding:15px 6px 8px;top:10px;max-height:calc(100dvh - 20px)}.library-sidebar-heading{padding:0 6px 12px}.library-sidebar-heading>span{font-size:7px;letter-spacing:1px}.library-sidebar-heading b{font-size:13px}.library-sidebar-heading p{display:none}.all-view .library-sidebar .library-topics{gap:5px;margin-top:11px}.all-view .library-sidebar .library-topics button{font-size:10px;gap:4px;padding:9px 6px;min-height:40px;flex-wrap:wrap}.all-view .library-sidebar .library-topics button small{font-size:9px;min-width:21px;padding:2px 4px}.all-view .library-content .library-tools{gap:10px}.all-view .library-content .library-tools .select-wrap{flex:1 1 100%;justify-content:space-between}.all-view .library-content .library-tools .per-page{flex:1 1 100%;justify-content:flex-start}.all-view .library-content .library-caption{align-items:flex-start;gap:9px;flex-direction:column}.all-view .library-content .learning-card .learning-card-top{flex-wrap:wrap}.all-view .library-content .learning-card h3{font-size:16px}.all-view .library-content .learning-card p{font-size:11px}.all-view .library-content .learning-tags{gap:4px;flex-wrap:wrap}.all-view .library-content .learning-actions{flex-wrap:wrap;gap:8px}.all-view .library-content .demo-preview{height:150px}.all-view .library-content .library-pages{gap:8px;flex-wrap:wrap}.all-view .library-content .library-pages button{font-size:10px;padding:9px}.all-view .library-content .library-disclosure{font-size:10px}}
@media(max-width:560px){.all-view .library-content .demo-preview .demo-unit{transform:scale(.48)}}@media(max-width:380px){.all-view .library-content .demo-preview .demo-unit{transform:scale(.36)}}

/* Global navigation search, local preview */
.header-search{display:flex;align-items:center;width:220px;min-width:0;height:39px;border:1px solid #e4ddcf;border-radius:24px;background:#fffdf8;transition:border-color .2s,box-shadow .2s;overflow:hidden}.header-search:focus-within{border-color:#ef9a70;box-shadow:0 0 0 3px #fa7e3e12}.header-search input{min-width:0;width:100%;border:0;outline:0;background:transparent;padding:10px 0 10px 15px;font:11px inherit;color:#544b3d;font-size:11px}.header-search input::placeholder{color:#a79a87}.header-search button{border:0;background:transparent;color:#dc7a47;width:37px;min-width:37px;height:37px;font-size:24px;line-height:1;cursor:pointer}.header-search button:hover{background:#f7eade}.header-search button:focus-visible{outline:2px solid #dd7b46;outline-offset:-4px;border-radius:50%}.header-tools>.edition{display:none}@media(max-width:1200px){.header-search{width:180px}header nav{gap:16px}}@media(max-width:1000px){header{flex-wrap:wrap;height:auto;min-height:88px;gap:14px;padding-top:16px;padding-bottom:10px}header nav{order:3;flex-basis:100%;justify-content:space-between;border-top:1px solid #e8e7dd;padding-top:12px;padding-bottom:4px}.header-tools{margin-left:auto}.header-search{width:220px}}@media(max-width:560px){header{gap:12px;padding-left:16px;padding-right:16px}.header-tools{flex-wrap:wrap;flex:1 1 100%;gap:10px}.header-search{flex:1;width:auto}.header-tools .language-switch{margin-left:auto}header nav{order:3;gap:9px}.header-search input{font-size:12px}}

/* Per-study stars: stored by the local preview API */
.learning-card-top>div{min-width:0}.study-star{margin-left:auto;display:inline-flex;align-items:center;justify-content:center;gap:6px;flex-shrink:0;align-self:flex-start;min-width:56px;min-height:37px;padding:8px 10px;border:1px solid #e8dfd0;border-radius:22px;background:#fffdf7;color:#a99b84;cursor:pointer;transition:color .18s,background .18s,border-color .18s,transform .18s}.study-star svg{width:17px;height:17px;fill:transparent;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round;transition:fill .18s,transform .18s}.study-star [data-star-count]{font-size:11px;font-variant-numeric:tabular-nums;line-height:1}.study-star:hover,.study-star.has-stars{background:#fff0d6;border-color:#edc480;color:#ce8c2a}.study-star.has-stars svg{fill:#f4c364;stroke:#d69c3f}.study-star:hover svg{transform:rotate(-10deg) scale(1.1)}.study-star:active{transform:scale(.92)}.study-star:focus-visible{outline:2px solid #e8863c;outline-offset:3px}.study-star[aria-busy=true]{border-style:dashed}@media(prefers-reduced-motion:reduce){.study-star,.study-star svg{transition:none;transform:none!important}}
/* Independently designed vocabulary studies. */
.fx-scramble{width:340px;padding:32px 25px;background:#e9efda;border-radius:24px;box-shadow:0 15px 35px #73795118}.fx-scramble small,.fx-marquee>small{font:9px monospace;letter-spacing:2px;color:#7c846b}.fx-scramble strong{display:block;font:700 28px monospace;letter-spacing:-1px;color:#39492c;margin:30px 0 17px;white-space:nowrap}.fx-scramble p{font-size:11px;color:#7c846b}.fx-scramble button,.fx-marquee button{margin-top:16px;border:1px solid #c7d3b7;background:#ffffff99;border-radius:20px;padding:9px 16px;color:#596b45;font-size:10px}.fx-aurora{position:relative;isolation:isolate;overflow:hidden;width:350px;height:260px;border-radius:26px;background:#f0f5ed;box-shadow:0 20px 35px #7eaa9c20}.fx-aurora>i{position:absolute;width:250px;height:210px;border-radius:50%;filter:blur(28px);background:radial-gradient(ellipse,#91c8aa 0,transparent 70%);left:-40px;top:-30px;animation:fx-aurora-drift 6s ease-in-out infinite alternate}.fx-aurora>i:nth-child(2){left:130px;top:80px;background:radial-gradient(ellipse,#cfb3ec 0,transparent 70%);animation-delay:-2s}.fx-aurora>i:nth-child(3){left:90px;top:-50px;background:radial-gradient(ellipse,#f2d199 0,transparent 70%);animation-delay:-4s}.fx-aurora>div{position:relative;z-index:1;padding:30px}.fx-aurora small{font:8px monospace;letter-spacing:2px;color:#616d62}.fx-aurora h4{font:italic 42px Georgia,serif;line-height:1.02;letter-spacing:-2px;margin:25px 0 17px;color:#334e43}.fx-aurora p{font-size:10px;color:#53675b}.demo-active .fx-aurora>i{filter:blur(28px) hue-rotate(65deg);animation-direction:alternate-reverse}.fx-marquee{width:365px;text-align:center}.fx-marquee-window{overflow:hidden;margin-top:20px;border-radius:16px;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}.fx-marquee-track{display:flex;width:max-content;animation:fx-marquee-travel 16s linear infinite}.fx-marquee-group{display:flex;gap:12px;padding-right:12px}.fx-marquee-group span{display:flex;flex-direction:column;justify-content:space-between;text-align:left;width:125px;height:155px;padding:17px;border-radius:15px;background:linear-gradient(140deg,#e6b793,#fbdfb8);color:#694f39;position:relative;overflow:hidden}.fx-marquee-group span:before{content:"";position:absolute;width:85px;height:85px;background:#ffffff55;border-radius:50%;top:30px;left:48px;box-shadow:-30px 35px #ffffff33}.fx-marquee-group span:nth-child(2){background:linear-gradient(140deg,#b3b5db,#e3d7f4);color:#5e577d}.fx-marquee-group span:nth-child(3){background:linear-gradient(140deg,#b6c9a6,#e1e9c9);color:#536342}.fx-marquee-group i{font:9px monospace}.fx-marquee-group b{font:600 19px 'Space Grotesk',sans-serif;z-index:1}.demo-paused .fx-marquee-track,.fx-marquee-window:hover .fx-marquee-track,.fx-marquee-window:focus-within .fx-marquee-track{animation-play-state:paused}.demo-active .fx-marquee-group span{border-radius:40px 12px}.fx-editorial{width:355px;display:grid;grid-template-columns:100px 1fr;gap:12px;align-items:center}.fx-editorial-input label{display:block;font-size:9px;color:#8a7c69;margin-bottom:12px}.fx-editorial-input input{width:100%;min-width:0;border:1px solid #ddd6c8;border-radius:6px;padding:8px 6px;margin-top:5px;font-size:9px;background:#fffdfa;color:#655b4f}.fx-editorial-page{height:265px;background:#f5ecd9;padding:19px;position:relative;overflow:hidden;border-radius:3px;box-shadow:0 14px 25px #6e593a18;transition:background .4s,border-radius .4s}.fx-editorial-page small{font:7px monospace;letter-spacing:1px;color:#8b7965}.fx-editorial-art{height:90px;margin:16px 0;background:radial-gradient(circle at 70% 35%,#f1d1a3 0 22%,transparent 23%),linear-gradient(140deg,#c98c65 45%,#e0b795 46% 75%,#f0d9ae 76%);border-radius:70px 70px 0 0}.fx-editorial-page h4{font:italic 25px Georgia,serif;line-height:1.05;letter-spacing:-1px;margin:12px 0 9px;color:#634832;overflow-wrap:anywhere}.fx-editorial-page p{font-size:9px;line-height:1.6;color:#8b7965;overflow-wrap:anywhere}.demo-unit[data-phase="1"] .fx-editorial-page{background:#ede7f7;border-radius:16px}.demo-unit[data-phase="1"] .fx-editorial-page h4{font-family:'DM Sans',sans-serif;font-style:normal;color:#65517a}.demo-unit[data-phase="1"] .fx-editorial-art{filter:hue-rotate(210deg);border-radius:50%}.demo-unit[data-phase="2"] .fx-editorial-page{background:#f5b178;border:3px solid #6e432c;box-shadow:5px 5px #6e432c}.demo-unit[data-phase="2"] .fx-editorial-page h4{font:800 24px 'DM Sans',sans-serif;text-transform:uppercase}.demo-unit[data-phase="2"] .fx-editorial-art{border-radius:0;transform:rotate(-3deg)}.fx-editorial-input input:focus-visible,.fx-scramble button:focus-visible,.fx-marquee button:focus-visible{outline:2px solid #df753a;outline-offset:3px}@keyframes fx-aurora-drift{to{transform:translate(30px,35px) scale(1.12)}}@keyframes fx-marquee-travel{to{transform:translateX(-50%)}}@media(prefers-reduced-motion:reduce){.fx-aurora>i,.fx-marquee-track{animation:none!important}.fx-editorial-page{transition:none}}