:root{font-family:PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif;color:#20201d;background:#f5f7f8;font-synthesis:none;text-rendering:optimizeLegibility;--paper: #ffffff;--paper-deep: #eef3f6;--ink: #20201d;--red: #e94a32;--yellow: #ffd84f;--blue: #4b93dc;--muted: #716b60;--thin: rgba(32, 32, 29, .24);--hand: "Kaiti SC", "STKaiti", "KaiTi", serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-width:320px;min-height:100vh;background:radial-gradient(circle at 90% 18%,rgba(255,216,79,.12),transparent 22%),linear-gradient(rgba(75,147,220,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(75,147,220,.055) 1px,transparent 1px),#f8fafb;background-size:auto,34px 34px,34px 34px,auto}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;opacity:.2;background-image:radial-gradient(#4b93dc .7px,transparent .8px);background-size:9px 9px;mix-blend-mode:multiply}button,input,textarea{font:inherit}button{color:inherit}.app-shell{min-height:100vh}.topbar{min-height:78px;padding:10px clamp(18px,3vw,42px);display:flex;align-items:center;justify-content:space-between;border-bottom:3px solid var(--ink);background:#fffffff0;position:sticky;top:0;z-index:10;box-shadow:0 5px #20201d12;animation:whiteboard-header-in .52s cubic-bezier(.2,.8,.2,1) both}.topbar:after{content:"";position:absolute;left:4%;right:3%;bottom:-7px;height:2px;background:var(--red);transform:rotate(-.15deg)}.brand{display:flex;align-items:center;gap:13px;color:inherit;text-decoration:none}.brand-button{padding:0;border:0;background:transparent;text-align:left;cursor:pointer}.brand-mark{width:50px;height:48px;display:grid;place-items:center;border:3px solid var(--ink);border-radius:47% 53% 44% 56%/55% 43% 57% 45%;color:#fff9e8;background:var(--red);box-shadow:4px 4px 0 var(--ink);font:900 28px var(--hand);transform:rotate(-4deg)}.brand strong{display:block;font:900 23px var(--hand);letter-spacing:.08em}.brand small{display:block;margin-top:1px;font:700 9px/1.2 var(--hand);letter-spacing:.13em}.topbar-note{display:flex;gap:9px;align-items:center;padding:9px 13px;border:2px solid var(--ink);border-radius:14px 10px 15px 9px;background:var(--yellow);font:700 12px var(--hand);transform:rotate(1deg)}.live-dot{width:9px;height:9px;border:2px solid var(--ink);border-radius:50%;background:#49aa67}.live-dot.offline{background:#e5a238}.landing{width:min(1500px,100%);min-height:calc(100vh - 78px);margin:0 auto;padding:clamp(38px,6vw,90px) clamp(22px,5.5vw,88px);display:grid;grid-template-columns:minmax(420px,.9fr) minmax(510px,1.1fr);align-items:center;gap:clamp(50px,8vw,130px);overflow:hidden}.landing-copy{position:relative;z-index:2}.landing-kicker{width:fit-content;display:flex;align-items:center;gap:8px;padding:8px 12px;border:1.5px solid var(--ink);border-radius:999px;background:#ffffffd1;font:800 12px var(--hand)}.landing-kicker svg{color:var(--red)}.landing-title{margin:25px 0 18px;max-width:760px;font:900 clamp(54px,6.2vw,96px)/.98 var(--hand);letter-spacing:-.075em;animation:title-write-in .72s cubic-bezier(.16,.84,.32,1) .12s both}.landing-title em{position:relative;width:auto;height:auto;display:inline;color:var(--red);border:0;border-radius:0;background:none;box-shadow:none;transform:none}.landing-title em:after{content:"";position:absolute;left:2%;right:-2%;bottom:-8px;height:10px;border-top:4px solid var(--red);border-radius:50%;transform:rotate(-1deg);transform-origin:left center;animation:marker-draw-in .68s cubic-bezier(.2,.75,.3,1) .72s both}.landing-intro{max-width:580px;margin:0 0 28px;color:#58616a;font:600 16px/1.8 var(--hand);animation:whiteboard-rise-in .56s ease .34s both}.landing-composer{position:relative;max-width:650px;padding:12px;border:2px solid var(--ink);border-radius:20px 15px 22px 16px;background:#fffffff2;box-shadow:7px 8px 0 var(--ink);animation:whiteboard-rise-in .62s cubic-bezier(.2,.8,.2,1) .47s both}.landing-composer textarea{display:block;width:100%;min-height:112px;padding:14px 15px;resize:vertical;border:0;border-bottom:1.5px dashed rgba(32,32,29,.4);outline:0;background:transparent;color:var(--ink);font:650 15px/1.75 var(--hand)}.landing-composer textarea::placeholder{color:#aaa292}.typing-indicator{position:absolute;z-index:2;top:97px;right:18px;display:flex;align-items:center;gap:6px;padding:4px 7px;border-radius:6px;color:#687681;background:#eef6faeb;font:700 9px var(--hand);pointer-events:none}.typing-indicator i{width:2px;height:13px;display:block;background:var(--red);animation:typing-caret .62s steps(1) infinite}.example-shelf{border-bottom:1.5px dashed rgba(32,32,29,.4)}.example-shelf-head{min-height:34px;display:flex;align-items:center;justify-content:space-between;gap:10px;color:#635d53;font:800 10px var(--hand)}.example-shelf-head>span,.example-shelf-head button{display:flex;align-items:center;gap:5px}.example-shelf-head>span svg{color:var(--red)}.example-shelf-head button{padding:4px 6px;border:0;background:transparent;color:var(--muted);font:800 9px var(--hand);cursor:pointer}.example-shelf-head button:hover{color:var(--red)}.example-card-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.example-card-row>button{min-width:0;min-height:54px;padding:7px 8px;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:6px;border:1.5px solid rgba(32,32,29,.35);border-radius:9px 12px 8px 11px/12px 8px 11px 9px;background:#fffdf8;text-align:left;cursor:pointer;transition:transform .14s ease,box-shadow .14s ease,border-color .14s ease}.example-card-row>button:nth-child(2){transform:rotate(.45deg)}.example-card-row>button:hover{border-color:var(--ink);transform:translateY(-2px) rotate(-.4deg);box-shadow:2px 3px 0 var(--ink)}.example-card-row>button.active{border-color:var(--ink);background:#fff2ad;box-shadow:2px 3px 0 var(--ink)}.example-card-row>button>span:nth-child(2){min-width:0}.example-card-row small,.example-card-row strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.example-card-row small{margin-bottom:3px;color:var(--red);font:800 8px var(--hand)}.example-card-row strong{font:900 10px var(--hand)}.example-card-row svg{color:#948c7d}.example-icon{width:27px;height:27px;display:grid;place-items:center;border-radius:50%;background:#eef3f6;font-size:15px}.example-page-dots{height:23px;display:flex;align-items:center;gap:4px;color:#8a8378;font:700 8px var(--hand)}.example-page-dots i{width:4px;height:4px;border-radius:50%;background:#c8c2b8}.example-page-dots i.active{width:13px;border-radius:5px;background:var(--red)}.example-page-dots span{margin-left:auto}.landing-platforms{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;padding:11px 0}.landing-platforms button{min-width:0;padding:8px 5px;border:1.5px solid transparent;border-radius:10px;background:transparent;font:800 11px var(--hand);cursor:pointer}.landing-platforms button small{display:block;margin-top:2px;color:#8b8376;font-size:9px}.landing-platforms button.active{border-color:var(--ink);background:var(--yellow);box-shadow:2px 2px 0 var(--ink);transform:translate(-1px,-1px)}.landing-generate{width:100%;min-height:56px;padding:0 17px;display:flex;align-items:center;justify-content:space-between;border:2px solid var(--ink);border-radius:13px;background:var(--ink);color:#fffaf0;font:900 14px var(--hand);cursor:pointer;transition:transform .14s ease,background .14s ease}.landing-generate:hover{background:var(--red);transform:translateY(-2px)}.landing-footnote{margin:17px 3px 0;color:#69747d;font:700 10px/1.6 var(--hand);letter-spacing:.03em;animation:whiteboard-rise-in .5s ease .68s both}.landing-showcase{position:relative;min-height:650px;display:grid;place-items:center}.landing-showcase:before{content:"";position:absolute;width:min(600px,88%);aspect-ratio:1;border-radius:50%;background:var(--yellow);opacity:.62;filter:blur(.2px)}.poster-peek{position:absolute;width:min(370px,52%);aspect-ratio:3 / 4;padding:34px 30px;overflow:hidden;border:3px solid var(--ink);background:#fffaf0;box-shadow:11px 13px #20201df2}.poster-peek:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(rgba(55,115,180,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(55,115,180,.08) 1px,transparent 1px);background-size:28px 28px}.poster-peek>*{position:relative;z-index:1}.poster-peek small{font:800 10px var(--hand);letter-spacing:.08em}.poster-peek strong{display:block;margin-top:22%;font:900 clamp(38px,4.2vw,65px)/.98 var(--hand);letter-spacing:-.08em}.poster-peek strong i{color:var(--red);font-style:normal;text-decoration:underline wavy #f0a829 4px;text-underline-offset:7px}.poster-peek>span{position:absolute;left:30px;right:30px;bottom:27px;font:700 10px/1.5 var(--hand)}.poster-peek b{position:absolute;right:25px;top:27px;font-size:34px;transform:rotate(8deg)}.peek-front{z-index:2;left:16%;top:8%;transform:rotate(-2.2deg);animation:poster-front-in .82s cubic-bezier(.17,.84,.25,1.08) .47s both}.peek-back{right:4%;bottom:5%;background:#e7effe;transform:rotate(6deg) scale(.9);animation:poster-back-in .82s cubic-bezier(.17,.84,.25,1.08) .65s both}.peek-back strong{margin-top:28%}.peek-back>span{color:#36567a}.showcase-orbit{position:absolute;z-index:4;padding:9px 12px;border:2px solid var(--ink);background:#fffaf0;box-shadow:3px 3px 0 var(--ink);font:800 11px var(--hand)}.orbit-one{left:2%;top:19%;transform:rotate(-6deg);animation:note-pop-in .46s cubic-bezier(.2,.9,.3,1.2) 1s both}.orbit-two{right:0;top:11%;color:#fff;background:var(--red);transform:rotate(5deg);animation:note-pop-in .46s cubic-bezier(.2,.9,.3,1.2) 1.12s both}.showcase-tabs{position:absolute;z-index:4;left:9%;right:2%;bottom:0;display:flex;align-items:center;gap:7px;padding:11px;border:2px solid var(--ink);border-radius:14px;background:#fffffff5;box-shadow:5px 6px 0 var(--ink);transform:rotate(-1deg);animation:whiteboard-rise-in .52s ease 1.08s both}.showcase-tabs span{flex:1;padding:8px 5px;border-radius:8px;background:#eee4d1;text-align:center;font:800 9px var(--hand)}.showcase-tabs span:first-child{color:#fff;background:var(--ink)}.workspace{min-height:calc(100vh - 78px);max-width:1760px;margin:0 auto;padding:20px;display:grid;grid-template-columns:minmax(310px,.88fr) minmax(470px,1.55fr) minmax(290px,.78fr);align-items:start;gap:18px;animation:studio-in .42s ease both}.control-panel,.style-panel,.preview-stage{position:relative;border:3px solid var(--ink);background:var(--paper);box-shadow:7px 8px 0 var(--ink);overflow:hidden}.panel-toggle{position:absolute;z-index:6;top:18px;width:32px;height:32px;padding:0;display:grid;place-items:center;border:2px solid var(--ink);border-radius:10px 7px 11px 8px;background:var(--yellow);box-shadow:2px 3px 0 var(--ink);cursor:pointer}.panel-toggle-left{right:18px}.panel-toggle-right{left:18px}.collapsed-label{writing-mode:vertical-rl;margin:68px auto 0;font:900 13px var(--hand);letter-spacing:.18em}.control-panel.collapsed,.style-panel.collapsed{padding:12px;overflow:visible;transform:none}.control-panel.collapsed:before,.style-panel.collapsed:before{display:none}.control-panel.collapsed>:not(.panel-toggle):not(.collapsed-label),.style-panel.collapsed>:not(.panel-toggle):not(.collapsed-label){display:none}.control-panel.collapsed .panel-toggle,.style-panel.collapsed .panel-toggle{left:50%;right:auto;transform:translate(-50%)}.workspace.left-collapsed{grid-template-columns:66px minmax(470px,1fr) minmax(290px,.78fr)}.workspace.right-collapsed{grid-template-columns:minmax(310px,.88fr) minmax(470px,1fr) 66px}.workspace.left-collapsed.right-collapsed{grid-template-columns:66px minmax(620px,1fr) 66px}.control-panel{padding:30px 28px;border-radius:18px 11px 24px 12px/12px 23px 14px 20px;transform:rotate(-.08deg)}.style-panel{padding:30px 26px;border-radius:12px 22px 13px 19px/19px 11px 23px 14px;overflow-y:auto;transform:rotate(.08deg)}.preview-stage{border-radius:25px 12px 22px 15px/16px 25px 13px 22px}.control-panel:before,.style-panel:before{content:"";position:absolute;width:84px;height:24px;top:8px;left:50%;background:#ffd84f8c;transform:translate(-50%) rotate(-2deg);border-left:1px solid rgba(32,32,29,.12);border-right:1px solid rgba(32,32,29,.12)}.panel-index{color:var(--red);font:800 12px var(--hand);letter-spacing:.08em}h1{margin:25px 0 12px;font:900 clamp(38px,3vw,58px)/1.05 var(--hand);letter-spacing:-.055em}h1 em{display:inline-grid;place-items:center;width:1.12em;height:1.05em;color:#fff;background:var(--red);border:3px solid var(--ink);border-radius:45% 55% 48% 52%;box-shadow:3px 3px 0 var(--ink);font-style:normal;transform:rotate(-5deg)}.intro{margin:0 0 25px;max-width:34em;color:var(--muted);font:600 13px/1.75 var(--hand)}.field-label{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;font:800 12px var(--hand)}.field-label span{color:var(--muted);font-weight:600}#source-copy{width:100%;min-height:155px;resize:vertical;padding:16px;border:2px solid var(--ink);border-radius:12px 18px 11px 16px/16px 11px 19px 10px;outline:none;background:repeating-linear-gradient(0deg,transparent 0 28px,rgba(75,147,220,.15) 29px 30px),#ffffffa6;font:600 14px/2 var(--hand);box-shadow:3px 4px #20201d24;transition:transform .15s ease,box-shadow .15s ease}#source-copy:focus{transform:translate(-2px,-2px);box-shadow:6px 7px 0 var(--yellow)}.sample-link{margin:10px 2px 0 auto;padding:0;border:0;background:none;display:flex;align-items:center;gap:5px;color:var(--muted);font:700 11px var(--hand);cursor:pointer;text-decoration:underline wavy var(--red) 1px;text-underline-offset:4px}.studio-example-drawer{margin-top:10px;border-bottom:2px dashed rgba(32,32,29,.5)}.studio-example-drawer summary{min-height:36px;display:flex;align-items:center;justify-content:space-between;color:var(--muted);font:800 11px var(--hand);cursor:pointer;list-style:none}.studio-example-drawer summary::-webkit-details-marker{display:none}.studio-example-drawer summary span{display:flex;align-items:center;gap:6px}.studio-example-drawer summary span svg{color:var(--red)}.studio-example-drawer summary>svg{transition:transform .16s ease}.studio-example-drawer[open] summary>svg{transform:rotate(180deg)}.studio-example-drawer .example-shelf{padding:0 0 11px;border:0}.studio-example-row{grid-template-columns:1fr}.studio-example-row>button{min-height:49px}.field-group{margin-top:23px}.segment-grid{display:grid;gap:8px}.platform-grid{grid-template-columns:repeat(2,1fr)}.segment-grid button,.segment-row button{border:2px solid var(--ink);border-radius:12px 8px 13px 9px/8px 13px 9px 12px;background:#fffdf7;cursor:pointer;transition:transform .14s ease,box-shadow .14s ease,background .14s ease}.segment-grid button:nth-child(2n),.segment-row button:nth-child(2n){transform:rotate(.6deg)}.segment-grid button{min-height:57px;padding:8px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:6px;text-align:left}.segment-grid button span{font:800 12px var(--hand)}.segment-grid button small{color:var(--muted);font:700 10px var(--hand)}.segment-grid button.active{color:#fff;background:var(--ink);box-shadow:4px 4px 0 var(--yellow);transform:translate(-2px,-2px) rotate(-1deg)}.segment-grid button.active small{color:#ddd6c8}.segment-row{display:flex;flex-wrap:wrap;gap:7px}.segment-row button{display:flex;align-items:center;gap:4px;padding:8px 11px;font:800 11px var(--hand)}.segment-row button.active{background:var(--yellow);box-shadow:3px 3px 0 var(--ink);transform:translate(-1px,-1px) rotate(-1deg)}.compose-button{width:100%;min-height:58px;margin-top:26px;padding:0 17px;display:flex;justify-content:space-between;align-items:center;border:3px solid var(--ink);border-radius:15px 10px 17px 9px/10px 17px 9px 15px;background:var(--red);color:#fff;box-shadow:6px 7px 0 var(--ink);font:900 14px var(--hand);cursor:pointer;transform:rotate(-.5deg);transition:transform .14s ease,box-shadow .14s ease}.compose-button:hover:not(:disabled){transform:translate(3px,3px) rotate(.2deg);box-shadow:3px 4px 0 var(--ink)}.compose-button:disabled{cursor:wait;opacity:.75}.status-line{display:flex;align-items:flex-start;gap:7px;margin:15px 0 0;color:var(--muted);font:700 11px/1.55 var(--hand)}.status-line svg{flex:0 0 auto;margin-top:1px;color:var(--red)}.spin{animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.preview-stage{min-width:0;padding:28px clamp(24px,3.3vw,58px);display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;background:#fff}.preview-stage:before{content:"纯白板";position:absolute;top:7px;right:24px;padding:5px 14px;background:#fff;border:1.5px solid var(--ink);border-radius:3px 6px 4px 5px;box-shadow:2px 2px 0 var(--yellow);font:700 12px var(--hand);transform:rotate(1deg)}.preview-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px;color:#615b50;font:700 11px var(--hand)}.preview-head>div{display:flex;align-items:center;gap:10px}.focus-button{display:flex;align-items:center;gap:5px;padding:6px 8px;border:1.5px solid var(--ink);border-radius:8px;background:#fff;font:800 10px var(--hand);cursor:pointer}.canvas-frame{display:flex;align-items:center;justify-content:center;min-height:0;flex:1;max-height:calc(100vh - 196px);filter:drop-shadow(12px 14px 0 rgba(32,32,29,.24))}.canvas-frame canvas{display:block;max-width:100%;max-height:calc(100vh - 250px);width:auto;height:auto;background:#fff;border:2px solid var(--ink)}.canvas-xiaohongshu canvas{aspect-ratio:3 / 4}.canvas-story canvas{aspect-ratio:9 / 16}.canvas-wechat canvas{aspect-ratio:2.35 / 1}.canvas-square canvas{aspect-ratio:1 / 1}.preview-actions{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:17px}.preview-actions>button{display:flex;gap:8px;align-items:center;border:2px solid var(--ink);border-radius:12px 8px 14px 9px;background:var(--yellow);box-shadow:3px 4px 0 var(--ink);padding:11px 15px;cursor:pointer;font:800 12px var(--hand);transform:rotate(-.5deg)}.preview-options{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.emoji-toggle{display:flex;align-items:center;gap:8px;color:#514c43;font:800 11px var(--hand);cursor:pointer}.emoji-toggle input{position:absolute;opacity:0;pointer-events:none}.emoji-toggle span{width:35px;height:19px;border:2px solid var(--ink);border-radius:50%;position:relative;background:#bcb4a4;transform:rotate(-2deg)}.emoji-toggle span:after{content:"";position:absolute;top:2px;left:2px;width:11px;height:11px;border:1px solid var(--ink);border-radius:50%;background:#fff;transition:.15s ease}.emoji-toggle input:checked+span{background:var(--blue)}.emoji-toggle input:checked+span:after{transform:translate(16px);background:var(--yellow)}.quality-switch{display:flex;border:2px solid var(--ink);border-radius:10px 7px 11px 8px;overflow:hidden;background:#fffdf7;transform:rotate(.4deg)}.quality-switch button{padding:6px 8px;border:0;border-right:1px solid var(--ink);background:transparent;font:800 10px var(--hand);cursor:pointer}.quality-switch button:last-child{border-right:0}.quality-switch button.active{color:#fff;background:var(--ink)}.mini-field{margin-top:17px}.mini-field label{display:flex;justify-content:space-between;margin-bottom:6px;color:var(--muted);font:800 11px var(--hand)}.mini-field label span{color:var(--red);font-size:9px}.mini-field input,.mini-field textarea{width:100%;padding:8px 10px;border:2px solid var(--ink);border-radius:8px 12px 7px 11px/12px 7px 11px 8px;outline:none;background:#ffffffb3;font:800 14px/1.5 var(--hand);resize:none}.mini-field textarea{min-height:58px}.mini-field input:focus,.mini-field textarea:focus{background:#fff7cc;box-shadow:3px 3px 0 var(--ink);transform:translate(-1px,-1px)}.highlight-field input{color:var(--red);background:#fff2a8;text-decoration:underline wavy var(--red) 2px;text-underline-offset:4px}.emoji-field input{font-family:"Apple Color Emoji","Segoe UI Emoji",sans-serif;font-size:25px}.footer-settings{margin-top:22px;padding-top:2px;border-top:2px dashed rgba(32,32,29,.55)}.footer-settings .template-heading{margin-top:0;padding-top:17px;border-top:0}.template-heading{display:flex;justify-content:space-between;margin-top:24px;padding-top:19px;border-top:2px dashed var(--ink);font:800 12px var(--hand)}.template-heading small{color:var(--muted)}.template-list{display:grid;gap:8px;margin-top:11px;max-height:520px;padding:2px 7px 8px 2px;overflow-y:auto}.template-list::-webkit-scrollbar{width:7px}.template-list::-webkit-scrollbar-thumb{border:1px solid var(--ink);border-radius:6px;background:var(--yellow)}.template-list button{width:100%;min-height:58px;padding:8px 10px;border:2px solid var(--ink);border-radius:11px 7px 13px 8px/8px 13px 7px 12px;background:#fffdf7;display:grid;grid-template-columns:50px 1fr auto;align-items:center;text-align:left;cursor:pointer;transition:.14s ease}.template-list button:nth-child(2n){transform:rotate(.45deg)}.template-list button.active{background:#fff3ac;box-shadow:4px 4px 0 var(--ink);transform:translate(-2px,-2px) rotate(-.7deg)}.swatches{display:flex;width:40px;height:37px;overflow:hidden;border:2px solid var(--ink);border-radius:46% 54% 43% 57%;transform:rotate(-3deg)}.swatches i{flex:1;display:block}.template-list strong{display:block;font:900 13px var(--hand)}.template-list small{display:block;margin-top:3px;color:var(--muted);font:700 10px var(--hand)}.why-card{margin-top:21px;padding:15px;border:2px solid var(--ink);border-radius:12px 8px 15px 9px;color:var(--ink);background:var(--yellow);box-shadow:4px 4px 0 var(--ink);transform:rotate(.35deg)}.why-card strong{display:flex;align-items:center;gap:6px;font:900 12px var(--hand)}.why-card p{margin:8px 0 0;font:700 11px/1.65 var(--hand)}@keyframes whiteboard-header-in{0%{opacity:0;transform:translateY(-18px)}to{opacity:1;transform:translateY(0)}}@keyframes title-write-in{0%{opacity:0;transform:translate(-34px);clip-path:inset(0 100% 0 0)}to{opacity:1;transform:translate(0);clip-path:inset(0 0 0 0)}}@keyframes marker-draw-in{0%{transform:rotate(-1deg) scaleX(0)}to{transform:rotate(-1deg) scaleX(1)}}@keyframes whiteboard-rise-in{0%{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}@keyframes poster-front-in{0%{opacity:0;transform:translate(80px,85px) rotate(8deg) scale(.78)}to{opacity:1;transform:translate(0) rotate(-2.2deg) scale(1)}}@keyframes poster-back-in{0%{opacity:0;transform:translate(110px,35px) rotate(14deg) scale(.7)}to{opacity:1;transform:translate(0) rotate(6deg) scale(.9)}}@keyframes note-pop-in{0%{opacity:0;scale:.6}to{opacity:1;scale:1}}@keyframes studio-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes typing-caret{0%,48%{opacity:1}49%,to{opacity:0}}@media(max-width:1220px){.landing{grid-template-columns:minmax(390px,.9fr) minmax(430px,1fr);gap:35px;padding-inline:38px}.landing-showcase{min-height:580px}.workspace{grid-template-columns:360px 1fr}.style-panel{grid-column:1 / -1;display:grid;grid-template-columns:repeat(5,1fr);gap:14px;overflow:visible}.style-panel>.panel-index,.template-heading,.template-list,.why-card{grid-column:1 / -1}.template-list{grid-template-columns:repeat(5,1fr)}.template-list button{grid-template-columns:1fr;gap:7px}.template-list button>svg{display:none}}@media(max-width:760px){.topbar{min-height:68px;padding:8px 16px}.topbar-note{display:none}.landing{display:block;min-height:auto;padding:42px 18px 70px;overflow:hidden}.landing-title{font-size:clamp(48px,14vw,68px)}.landing-intro{font-size:14px}.landing-platforms{grid-template-columns:repeat(2,1fr)}.example-card-row{display:flex;padding-bottom:5px;overflow-x:auto;scroll-snap-type:x mandatory}.example-card-row>button{flex:0 0 76%;scroll-snap-align:start}.landing-showcase{min-height:500px;margin-top:56px}.poster-peek{width:55%;min-width:220px;padding:25px 20px}.poster-peek strong{font-size:38px}.peek-front{left:4%}.peek-back{right:-3%}.showcase-tabs{left:0;right:0;overflow-x:auto}.showcase-tabs span{min-width:72px}.workspace{display:flex;flex-direction:column;padding:12px;gap:18px}.control-panel,.style-panel,.preview-stage{padding:25px 19px;transform:none;box-shadow:5px 6px 0 var(--ink)}.preview-stage{min-height:650px;order:2}.style-panel{order:3;display:block}.canvas-frame{max-height:535px}.platform-grid{grid-template-columns:repeat(2,1fr)}.template-list{grid-template-columns:1fr}.template-list button{grid-template-columns:50px 1fr auto}.template-list button>svg{display:block}.preview-actions{align-items:stretch;flex-direction:column}.preview-options{justify-content:space-between}.preview-actions>button{justify-content:center}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}