@import"https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&family=Fraunces:opsz,wght@9..144,700;9..144,800&display=swap";:root{font-family:DM Sans,sans-serif;color:#292721;background:#f5f1e7;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-width:320px}button,input,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed}button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #e57242;outline-offset:3px}::selection{background:#f7c969;color:#292721}.app-shell{min-height:100vh;background-color:#f5f1e7;background-image:radial-gradient(#6b634b13 .55px,transparent .55px);background-size:5px 5px}.topbar{height:82px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(24px,3.4vw,58px);border-bottom:2px solid #292721;background:#fffdf7}.brand{display:flex;align-items:center;gap:12px;font-family:Fraunces,serif;font-size:23px;letter-spacing:-.035em;font-weight:800;white-space:nowrap}.brand strong{font-weight:800;color:#dd6b45}.brand-icon{width:39px;height:39px;display:grid;place-items:center;border:2px solid #292721;border-radius:12px;background:#f5bd58;transform:rotate(-8deg)}.top-nav{display:flex;align-items:center;gap:20px;margin-left:auto;margin-right:44px;font-size:12px;font-weight:800}.nav-current{display:flex;align-items:center;gap:8px;background:#fce4ba;border:1.5px solid #292721;border-radius:50px;padding:9px 14px}.nav-divider{width:1px;height:23px;background:#b5ae9c}.progress-text{color:#786f5b}.help-button{display:flex;gap:8px;align-items:center;border:0;background:transparent;color:#292721;font-size:12px;font-weight:800;padding:10px}.help-button:hover{color:#bd5634}.workspace{display:grid;grid-template-columns:minmax(0,1.53fr) minmax(360px,.7fr);min-height:calc(100vh - 82px)}.canvas-side{padding:39px clamp(30px,4.1vw,69px) 42px;min-width:0}.section-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin:0 0 28px 24px}.section-head h1{font:800 clamp(32px,3vw,42px)/1.1 "Fraunces",serif;letter-spacing:-.04em;margin:0 0 7px;position:relative;display:inline-block}.hand-drawn-underline{position:absolute;left:49%;right:-5px;bottom:-7px;height:8px;border-bottom:4px solid #f3b64e;border-radius:50%;transform:rotate(-3deg)}.section-head p{margin:0;color:#685f52;font-size:13px;font-weight:600}.canvas-actions{display:flex;gap:6px}.canvas-actions button{display:flex;align-items:center;gap:7px;border:1.5px solid #292721;border-radius:9px;background:#fffdf7;padding:10px 12px;font-size:12px;font-weight:800;box-shadow:0 2px #292721}.canvas-actions button:hover:not(:disabled){background:#ffe7b8}.canvas-actions button:disabled{opacity:.42}.notebook{position:relative;padding:0 0 0 28px;border:2.5px solid #292721;border-radius:10px;background:#fffdf7;box-shadow:0 14px 25px #29272118,0 4px #d9d0bb;min-width:0}.notebook:before{content:"";position:absolute;left:28px;top:0;bottom:0;border-left:2px solid #292721}.paper-holes{position:absolute;left:-13px;top:26px;bottom:25px;display:flex;flex-direction:column;justify-content:space-around;z-index:3}.paper-holes span{display:block;width:31px;height:15px;border:3px solid #292721;border-radius:10px;background:#f5f1e7;box-shadow:inset -9px 0 #fffdf7}.notebook-top,.notebook-bottom{display:flex;justify-content:space-between;align-items:center;padding:13px 20px;font-size:10px;font-weight:800;letter-spacing:.07em}.notebook-top{border-bottom:2px solid #292721}.page-label,.preview-label,.notebook-bottom span{display:flex;align-items:center;gap:7px}.page-dot{width:8px;height:8px;background:#ec814f;border:1.5px solid #292721;border-radius:50%}.preview-label{color:#4d7c5a}.notebook-bottom{border-top:2px solid #292721;color:#5e554a;letter-spacing:0;text-transform:none;font-size:11px;padding:15px 20px}.page-frame{height:clamp(440px,57vh,650px);overflow:hidden;background:#fffdf8}.page-frame iframe{display:block;width:100%;height:100%;border:0;background:#fffdf8}.canvas-tip{display:flex;align-items:center;gap:10px;margin:23px 0 0 28px;color:#5b5348;font-size:12px;line-height:1.5}.canvas-tip svg{color:#d76d46;flex:none}.canvas-tip strong{color:#292721}.editor-side{display:flex;flex-direction:column;min-width:0;border-left:2px solid #292721;background:#fffdf8}.editor-top{padding:35px 30px 24px;border-bottom:2px solid #292721}.editor-heading{display:flex;align-items:center;gap:13px}.editor-icon{width:43px;height:43px;display:grid;place-items:center;border:2px solid #292721;border-radius:12px;background:#c6dfd1;transform:rotate(5deg)}.editor-heading h2{font:800 25px/1.1 Fraunces,serif;letter-spacing:-.03em;margin:0 0 4px}.editor-heading p{font-size:12px;color:#70685c;margin:0}.mobile-close{display:none}.selection-block{padding:21px 30px;border-bottom:1.5px solid #ded7c8}.tiny-label,.lesson-overline{font-size:10px;letter-spacing:.12em;font-weight:800;color:#746d5d}.selection-title{display:flex;align-items:center;gap:9px;font:800 22px/1.2 Fraunces,serif;margin-top:10px}.selection-bullet{width:11px;height:11px;border:2px solid #292721;border-radius:50%;background:#ec8053}.selection-tag{font:800 9px/1 DM Sans,sans-serif;letter-spacing:.07em;border:1px solid #c8bdab;border-radius:50px;padding:5px 7px;margin-left:auto;color:#786d5c}.breadcrumbs{display:flex;align-items:center;gap:2px;margin:11px 0 0 18px;color:#8a8172;min-width:0;overflow-x:auto;scrollbar-width:thin}.breadcrumbs button{background:none;border:0;padding:2px 3px;color:inherit;font-size:10px;white-space:nowrap}.breadcrumbs button:hover,.breadcrumbs button[aria-current=true]{color:#b45737;text-decoration:underline;text-underline-offset:3px}.code-area{padding:0 30px 16px;flex:1;min-height:350px}.tab-bar{display:flex;gap:26px;border-bottom:1.5px solid #ded7c8}.tab-bar button{position:relative;border:0;background:none;padding:19px 0 13px;color:#867d70;font-size:13px;font-weight:800}.tab-bar button span{font-size:10px;font-weight:600;margin-left:4px}.tab-bar button.active{color:#292721}.tab-bar button.active:after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:3px;background:#e8774d;border-radius:3px}.code-hint{display:flex;gap:8px;align-items:start;color:#605a4d;font-size:11px;line-height:1.45;padding:16px 0}.hint-mark{color:#db8a33;flex:none}.code-editor{background:#282722;color:#f8f1df;border-radius:11px;border:2px solid #292721;box-shadow:0 5px #d1c9b8;padding:16px 0;min-height:226px;overflow:auto;font:500 12px/1.65 ui-monospace,SFMono-Regular,Menlo,monospace}.code-line,.code-input{display:flex;gap:14px;padding:0 14px}.code-line>span,.code-input>span{color:#928e83;min-width:14px;text-align:right;user-select:none}.code-line code{font:inherit;color:#c9e0c1;white-space:nowrap}.code-input textarea{display:block;flex:1;min-height:155px;resize:vertical;background:none;border:0;outline:none;color:#f9d898;white-space:pre-wrap;overflow-wrap:anywhere;font:inherit;line-height:inherit;padding:0;caret-color:#f7b75b}.code-input textarea::placeholder{color:#a49b82}.html-editor{padding:13px 14px}.html-editor textarea{width:100%;min-height:220px;resize:vertical;background:none;border:0;outline:none;color:#f7d898;font:500 12px/1.7 ui-monospace,SFMono-Regular,Menlo,monospace;white-space:pre-wrap;overflow-wrap:anywhere;caret-color:#f7b75b}.editor-feedback{font-size:11px;line-height:1.45;color:#587662;margin:13px 0 0;min-height:18px}.editor-feedback.is-error,.lesson-error{color:#b64b38}.lesson-card{margin:0 30px 20px;border:2px solid #292721;border-radius:12px;background:#fce9c7;padding:20px 19px 18px;box-shadow:0 5px #d3c9b7}.lesson-card.completed{background:#d9ecda}.lesson-heading{display:flex;align-items:center;gap:11px}.lesson-icon{width:34px;height:34px;display:grid;place-items:center;border:2px solid #292721;border-radius:8px;background:#f4b854}.completed .lesson-icon{background:#98caa4}.lesson-heading h3{font:800 19px/1.2 Fraunces,serif;margin:2px 0 0;letter-spacing:-.02em}.lesson-card>p{font-size:12px;line-height:1.5;margin:14px 0 13px;color:#554a3c}.lesson-code{display:flex;align-items:center;gap:4px;padding:10px 12px;border:1.5px solid #292721;background:#fffdf8;border-radius:6px;font:600 12px ui-monospace,SFMono-Regular,Menlo,monospace}.lesson-code input{min-width:0;flex:1;width:70px;border:0;outline:0;background:transparent;color:#b95130;font:inherit}.lesson-code input::placeholder{color:#a68167}.lesson-error{font-size:11px!important;margin:8px 0 0!important}.lesson-button{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin-top:13px;padding:12px;border:2px solid #292721;border-radius:7px;background:#292721;color:#fffdf7;font-size:12px;font-weight:800;box-shadow:0 4px #ad8d61}.lesson-button:hover{background:#4a4032}.editor-footer{display:flex;justify-content:space-between;gap:10px;padding:17px 30px;border-top:1.5px solid #ded7c8;font-size:10px;color:#766c5c;font-weight:700}.autosave-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#7caf7d;margin-right:4px}.marker-flight{position:absolute;pointer-events:none;z-index:9;animation:marker-path 1.7s cubic-bezier(.17,.8,.28,1) forwards}.marker-flight svg{position:absolute;width:56px;height:72px;left:0;top:0;transform:rotate(-37deg);filter:drop-shadow(4px 7px 4px #29272144)}@keyframes marker-path{0%{transform:translate(-18px,10px) rotate(-8deg);opacity:0}10%{opacity:1}35%{transform:translate(35%,27%) rotate(3deg)}68%{transform:translate(75%,55%) rotate(-8deg)}90%{transform:translate(93%,80%) rotate(6deg);opacity:1}to{transform:translate(102%,85%) rotate(9deg);opacity:0}}.modal-backdrop{position:fixed;inset:0;background:#292721b8;z-index:30;display:grid;place-items:center;padding:20px}.help-modal{width:min(440px,100%);position:relative;background:#fffdf7;border:3px solid #292721;border-radius:13px;padding:31px;box-shadow:0 20px 50px #0004}.modal-close{position:absolute;top:14px;right:14px;border:0;background:transparent}.modal-art{width:56px;height:56px;display:grid;place-items:center;border:2px solid #292721;border-radius:14px;background:#f4bd60;transform:rotate(-8deg)}.help-modal h2{font:800 32px/1.05 Fraunces,serif;letter-spacing:-.04em;margin:21px 0 12px}.help-modal p{font-size:13px;line-height:1.6;color:#5d5447;margin:0}.help-modal ol{list-style:none;margin:21px 0;padding:0;display:grid;gap:12px}.help-modal li{display:flex;align-items:center;gap:11px;font-size:13px;font-weight:700}.help-modal li svg{color:#d66d45;flex:none}@media(max-width:1120px){.workspace{grid-template-columns:minmax(0,1.25fr) minmax(335px,.75fr)}.canvas-side{padding:32px 28px}.section-head{margin-left:20px}.notebook{padding-left:24px}.notebook:before{left:24px}.sample-footer{display:none}.code-area,.editor-top,.selection-block{padding-left:22px;padding-right:22px}.lesson-card{margin-left:22px;margin-right:22px}.top-nav{margin-right:20px}.progress-text{display:none}}@media(max-width:920px){.topbar{height:68px}.top-nav{display:none}.workspace{display:block}.canvas-side{padding:27px 20px 32px}.section-head{margin-left:15px}.editor-side{border-left:0;border-top:2px solid #292721}.page-frame{height:530px}.editor-top{padding-top:24px}.code-area{min-height:0;padding-bottom:26px}.notebook-bottom span:last-child{display:none}}@media(max-width:520px){.brand{font-size:18px}.brand-icon{width:34px;height:34px}.help-button span{display:none}.topbar{padding:0 18px}.section-head{align-items:start;margin-left:8px}.section-head h1{font-size:32px}.section-head p{font-size:11px;max-width:210px}.canvas-actions button{padding:9px}.canvas-actions button span{display:none}.notebook{padding-left:20px}.notebook:before{left:20px}.paper-holes{left:-10px}.paper-holes span{width:25px}.notebook-top{padding:11px 12px}.preview-label{font-size:9px}.page-frame{height:470px}.notebook-bottom{padding:12px}.canvas-tip{margin-left:10px}.editor-footer{padding:15px 22px}.editor-footer span:last-child{display:none}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}.code-editor:not(.html-editor){height:226px;min-height:0;overflow:hidden}.code-input{height:155px;align-items:stretch}.code-gutter{flex:none;width:14px;height:155px;display:flex;flex-direction:column;overflow:hidden;color:#928e83;text-align:right;user-select:none;line-height:1.65}.code-gutter span{display:block;height:1.65em;flex:none}.code-input textarea{height:155px;min-height:0;resize:none;white-space:pre;overflow-wrap:normal;overflow:auto;scrollbar-color:#9b927d #282722;scrollbar-width:thin}.tab-bar{gap:18px}.ideas-panel{height:274px;overflow-y:auto;display:grid;gap:9px;padding:2px 3px 9px 0;scrollbar-color:#b9ab95 #fffdf8;scrollbar-width:thin}.idea-card{display:flex;align-items:flex-start;gap:12px;padding:11px;border:1.5px solid #cfc6b6;border-radius:10px;background:#fffdf8}.idea-card.is-previewing{border-color:#d86f48;background:#fff8eb}.idea-sample{width:48px;height:48px;flex:none;display:grid;place-items:center;border:1.5px solid #292721;border-radius:8px;background:#fffdf8;color:#292721}.idea-sample span{font:800 19px/1 Fraunces,serif}.idea-sample.sample-fill{background-color:#ffd166}.idea-sample.sample-ink{color:#d66040}.idea-sample.sample-border{border:3px dashed #e8774d}.idea-sample.sample-move span{position:relative;top:-8px}.idea-sample svg{width:32px;height:32px;fill:#fffdf8;stroke:#292721;stroke-width:2.5}.idea-sample.sample-svg-fill svg{fill:#ffd166}.idea-sample.sample-svg-stroke svg{stroke:#d66040}.idea-sample.sample-svg-bold svg{stroke-width:5}.idea-sample.sample-svg-dash svg{stroke-dasharray:5 4}.idea-details{min-width:0;flex:1}.idea-title-row{display:flex;align-items:baseline;flex-wrap:wrap;gap:3px 8px}.idea-title-row h3{font:800 14px/1.1 Fraunces,serif;margin:0}.idea-title-row span{font-size:10px;color:#655d50;line-height:1.35}.idea-details code{display:block;white-space:pre-wrap;overflow-wrap:anywhere;color:#9f4a32;font:600 10px/1.45 ui-monospace,SFMono-Regular,Menlo,monospace;margin-top:5px}.idea-actions{display:flex;align-items:center;flex-wrap:wrap;gap:5px;margin-top:8px}.idea-actions button{display:inline-flex;align-items:center;gap:3px;border:1px solid #bcb09f;border-radius:5px;background:#fffdf8;padding:5px 6px;color:#292721;font-size:10px;font-weight:800}.idea-actions button:hover,.idea-actions button[aria-pressed=true]{background:#ffe7bb;border-color:#292721}.idea-actions .idea-use{background:#292721;border-color:#292721;color:#fffdf8;margin-left:auto}.idea-actions .idea-use:hover{background:#4a4032;color:#fffdf8}@media(max-width:520px){.tab-bar{gap:15px}.tab-bar button span{display:none}.ideas-panel{height:326px}}.color-picker{margin-top:10px;padding:12px;border:2px solid #292721;border-radius:10px;background:#fffdf8;box-shadow:0 5px #d1c9b8}.color-picker-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}.color-picker-head strong{font:800 15px/1.1 Fraunces,serif}.color-picker-head button{display:grid;place-items:center;border:0;background:transparent;color:#51483c;padding:3px}.color-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.color-option{display:flex;flex-direction:column;align-items:center;gap:4px;min-width:0;padding:5px 3px;border:1px solid #d2c9ba;border-radius:7px;background:#fffdf8;color:#292721;font-size:10px;font-weight:800}.color-option:hover,.color-option:focus-visible{border-color:#292721;background:#fff0d1}.color-swatch{display:block;width:100%;height:22px;border:1px solid #292721;border-radius:4px}.custom-color{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px;padding-top:9px;border-top:1px solid #e2dacd;font-size:11px;font-weight:800}.custom-color input{width:52px;height:28px;padding:2px;border:1px solid #292721;border-radius:5px;background:#fffdf8;cursor:pointer}.lesson-card .color-picker{box-shadow:0 3px #d3c9b7}.color-reference{position:relative;margin:4px 0 10px}.color-reference-toggle{display:inline-flex;align-items:center;gap:6px;border:1.5px solid #292721;border-radius:7px;background:#ffe6b8;color:#292721;padding:7px 10px;font-size:11px;font-weight:800}.color-reference-toggle:hover,.color-reference-toggle[aria-expanded=true]{background:#ffd48e}.color-reference-toggle span{color:#665541;font-size:10px;font-weight:700}.color-reference-popover{position:absolute;z-index:8;top:calc(100% + 5px);left:0;right:0;padding:12px;border:2px solid #292721;border-radius:10px;background:#fff8e9;box-shadow:0 8px 22px #2927212e;max-height:min(190px,40vh);overflow-y:auto}.color-reference-heading{display:flex;align-items:start;justify-content:space-between;gap:8px;margin-bottom:11px}.color-reference-heading h3{margin:0;font:800 15px/1.15 Fraunces,serif}.color-reference-heading p{margin:3px 0 0;color:#675c4a;font-size:10px;line-height:1.35}.color-reference-close{display:grid;place-items:center;flex:none;border:0;background:transparent;color:#51483c;padding:2px}.color-reference-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.color-reference-grid button{display:flex;flex-direction:column;align-items:center;gap:3px;min-width:0;border:1px solid #d2c6b4;border-radius:7px;background:#fffdf8;padding:5px 3px;color:#292721}.color-reference-grid button:hover{border-color:#292721;background:#ffedc9}.color-reference-swatch{display:block;width:100%;height:17px;border:1px solid #292721;border-radius:3px}.color-reference-name{font-size:9px;font-weight:800;line-height:1.15}.color-reference-grid code,.color-reference-custom code{font:700 10px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:-.02em}.color-reference-custom{display:flex;align-items:center;gap:8px;margin-top:11px;padding-top:10px;border-top:1px solid #dfd4c3}.color-reference-custom label{margin-right:auto;font-size:10px;font-weight:800}.color-reference-custom input{width:36px;height:28px;padding:2px;border:1px solid #292721;border-radius:5px;background:#fffdf8;cursor:pointer}.color-reference-custom button{display:inline-flex;align-items:center;gap:4px;border:1.5px solid #292721;border-radius:6px;background:#fffdf8;padding:6px 7px;color:#292721;font-size:10px;font-weight:800;white-space:nowrap}.color-reference-custom button:hover{background:#ffe7b8}@media(max-width:390px){.color-reference-custom{flex-wrap:wrap}.color-reference-custom label{width:100%}}.mode-switch{display:flex;align-items:center;gap:6px;margin-left:auto;margin-right:27px;padding:4px;border:1.5px solid #292721;border-radius:99px;background:#f3ead8}.mode-switch button{display:flex;align-items:center;gap:7px;border:0;border-radius:99px;background:transparent;color:#5a5146;padding:9px 13px;font-size:12px;font-weight:800;white-space:nowrap}.mode-switch button.active{background:#292721;color:#fffdf7}.mode-switch button:not(.active):hover{background:#fce1ae}.scene-palette{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:0 0 19px 28px;padding:10px 13px;border:1.5px solid #292721;border-radius:10px;background:#fffdf7}.scene-palette-label{display:flex;flex-direction:column;gap:2px}.scene-palette-label strong{font:800 15px/1.15 Fraunces,serif}.scene-palette-label span{font-size:10px;color:#70685c;font-weight:700}.scene-palette-items{display:flex;flex-wrap:wrap;gap:6px}.scene-palette-items button{display:flex;align-items:center;gap:5px;border:1.5px solid #292721;border-radius:7px;background:#fffdf7;padding:8px 10px;color:#292721;font-size:11px;font-weight:800;cursor:pointer}.scene-palette-items button:hover{background:#fce1ae}.scene-palette-items button:active{cursor:grabbing}.layout-toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin:0 0 18px 28px;font-size:11px;font-weight:800}.layout-toolbar>span{margin-right:5px;color:#675e50}.layout-toolbar button{display:inline-flex;align-items:center;gap:4px;padding:6px 10px;border:1.5px solid #292721;border-radius:7px;background:#fffdf7;color:#292721;font-size:11px;font-weight:800}.layout-toolbar button:hover{background:#fce1ae}.layout-toolbar button[aria-pressed=true]{background:#292721;color:#fffdf7}@media(max-width:520px){.layout-toolbar{margin-left:20px}}.flex-card{margin:0 30px 20px;border:2px solid #292721;border-radius:12px;background:#dbeadf;padding:20px 19px 18px;box-shadow:0 5px #d3c9b7}.flex-card .lesson-icon{background:#a4d3b0}.flex-card h3{font:800 19px/1.2 Fraunces,serif;margin:2px 0 0;letter-spacing:-.02em}.flex-card>p{font-size:12px;line-height:1.5;margin:14px 0 13px;color:#4b5c4d}.flex-presets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.flex-presets button{min-width:0;text-align:left;border:1.5px solid #292721;border-radius:7px;background:#fffdf8;padding:9px 7px}.flex-presets button:hover{background:#fce1ae}.flex-presets strong{display:block;font:800 14px/1.15 Fraunces,serif;margin-bottom:4px}.flex-presets code{display:block;color:#746047;font:600 9px/1.35 ui-monospace,SFMono-Regular,Menlo,monospace;overflow-wrap:anywhere}.focus-layout{display:flex;align-items:center;justify-content:center;gap:7px;width:100%;margin-top:11px;border:1.5px solid #292721;border-radius:7px;background:#292721;color:#fffdf8;padding:10px;font-size:11px;font-weight:800}.focus-layout:hover{background:#4a4032}@media(max-width:1120px){.mode-switch{margin-right:12px}.mode-switch button{padding:8px 10px}.scene-palette{align-items:flex-start;flex-direction:column;margin-left:20px}.flex-card{margin-left:22px;margin-right:22px}}@media(max-width:920px){.topbar{height:auto;min-height:68px;flex-wrap:wrap;gap:10px;padding-top:12px;padding-bottom:12px}.mode-switch{order:3;width:100%;margin:0;justify-content:center}.mode-switch button{justify-content:center;flex:1}.scene-palette{margin-left:15px}.scene-palette-items{width:100%}.scene-palette-items button{flex:1;justify-content:center}}@media(max-width:520px){.mode-switch button{font-size:11px}.scene-palette{margin-left:8px;padding:9px}.scene-palette-items button{min-width:70px}.flex-card{margin-left:22px;margin-right:22px}}.workspace{grid-template-columns:minmax(0,1.8fr) minmax(355px,.7fr)}.canvas-side{padding:30px clamp(22px,2.7vw,42px) 38px}.section-head,.scene-palette{margin-left:0}.notebook{padding-left:0;border:1.5px solid #8a8172;border-radius:16px;box-shadow:0 13px 30px #29272117;background:#fffdf8;overflow:hidden}.notebook:before,.paper-holes{display:none}.notebook-top,.notebook-bottom{padding-left:20px;padding-right:20px}.notebook-top{border-bottom:1px solid #d7cebd;background:#fffdf8}.notebook-bottom{border-top:1px solid #d7cebd;background:#fffdf8}.page-frame{height:clamp(600px,calc(100vh - 235px),900px)}.page-frame.scene-frame{height:720px}.canvas-tip{margin-left:0}.editor-side{border-left:1.5px solid #bcb09f}.flex-presets{grid-template-columns:repeat(2,minmax(0,1fr))}.flex-presets button.active{background:#fff0c8;border-color:#b35d3d;box-shadow:inset 0 0 0 1px #b35d3d}.scene-text-edit{display:grid;gap:6px;margin:0;padding:15px 30px;border-bottom:1px solid #ded7c8;background:#fff8e9}.scene-text-edit label{font-size:11px;font-weight:800;color:#4e4234}.scene-text-edit input{width:100%;padding:9px 11px;border:1.5px solid #292721;border-radius:7px;background:#fffdf8;color:#292721;font:700 14px DM Sans,sans-serif}.scene-text-edit input:focus-visible{outline:3px solid #e57242;outline-offset:2px}.scene-text-edit span{font-size:10px;color:#6d6255}@media(max-width:1120px){.workspace{grid-template-columns:minmax(0,1.45fr) minmax(335px,.75fr)}.canvas-side{padding:26px 22px}.scene-palette{margin-left:0}}@media(max-width:920px){.workspace{display:block}.canvas-side{padding:22px 20px 30px}.editor-side{border-left:0;border-top:1.5px solid #bcb09f}.page-frame{height:590px}.page-frame.scene-frame{height:660px}}@media(max-width:520px){.canvas-side{padding:18px 16px 26px}.page-frame{height:565px}.page-frame.scene-frame{height:650px}.scene-palette{margin-left:0}.notebook-top,.notebook-bottom{padding-left:14px;padding-right:14px}}@media(max-width:520px){.scene-text-edit{padding-left:22px;padding-right:22px}}.inline-hover{margin-top:14px}.inline-hover-toggle{width:100%;border:1.5px dashed #8b7961;border-radius:8px;background:#fff8e9;color:#584b3b;padding:9px 12px;text-align:left;font-size:11px;font-weight:800}.inline-hover-toggle:hover,.inline-hover-toggle[aria-expanded=true]{background:#ffe7b8;border-color:#b35d3d}.hover-panel{margin-top:12px}.hover-panel{display:grid;gap:13px}.hover-presets{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.hover-presets button{min-width:0;text-align:left;border:1.5px solid #292721;border-radius:8px;background:#fffdf8;padding:8px 10px;color:#292721}.hover-presets button:hover,.hover-presets button[aria-pressed=true]{background:#ffe7b8;border-color:#b35d3d}.hover-presets button strong{display:block;font:800 14px/1.2 Fraunces,serif}.hover-presets button span{display:block;margin-top:2px;color:#6a5c4c;font-size:10px}.hover-presets .hover-clear{font-size:11px;font-weight:800;text-align:center}.hover-presets .hover-clear:disabled{opacity:.45}.hover-editor{height:226px}.hover-editor .code-input textarea{white-space:pre-wrap;overflow-wrap:anywhere}.hover-preview-row{display:flex;align-items:center;gap:10px}.hover-preview-row button{flex:none;border:1.5px solid #292721;border-radius:7px;background:#292721;color:#fffdf8;padding:8px 10px;font-size:11px;font-weight:800}.hover-preview-row button[aria-pressed=true]{background:#b85c3c}.hover-preview-row button:disabled{opacity:.45}.hover-preview-row span{font-size:10px;line-height:1.35;color:#655c50}.plate-card{margin:0 30px 20px;border:2px solid #292721;border-radius:12px;background:#fce9c7;padding:20px 19px 18px;box-shadow:0 5px #d3c9b7}.plate-card .lesson-icon{background:#f5bd58}.plate-card h3{font:800 19px/1.2 Fraunces,serif;margin:2px 0 0;letter-spacing:-.02em}.plate-card p{font-size:12px;line-height:1.5;margin:14px 0 0;color:#554a3c}.plate-card code{font:700 11px ui-monospace,SFMono-Regular,Menlo,monospace;color:#a34a2d}.plate-code{margin-top:12px;padding:10px 12px;border:1.5px solid #292721;border-radius:6px;background:#fffdf8;color:#a34a2d;font:700 12px ui-monospace,SFMono-Regular,Menlo,monospace}@media(max-width:1120px){.plate-card{margin-left:22px;margin-right:22px}}@media(max-width:520px){.mode-switch{flex-wrap:wrap;border-radius:18px}.mode-switch button{flex:1 1 calc(50% - 6px)}.plate-card{margin-left:22px;margin-right:22px}}.book-wrap{min-width:0}.book-stage{position:relative;padding-left:29px;isolation:isolate}.book-spine{position:absolute;top:3px;bottom:5px;left:0;width:34px;border:1px solid #8d624d;border-radius:11px 2px 2px 11px;background:linear-gradient(90deg,#a7684e,#c98e67 45%,#d7a87f 73%,#ad7054);box-shadow:inset -5px 0 7px #4b2c2228,0 12px 22px #29272118;display:flex;flex-direction:column;justify-content:space-around;align-items:center;padding:24px 0}.book-spine span{width:13px;height:3px;border-radius:4px;background:#f8dcad;box-shadow:0 1px #442a20}.book-stack{position:absolute;inset:4px -4px -4px 31px;border:1px solid #d0c4ae;border-radius:2px 5px 7px 2px;background:#fbf7eb;box-shadow:2px 2px #e5dcc9,4px 4px #fbf7eb,5px 5px #c7bba6,0 16px 27px #2927211b}.notebook.book-page{position:relative;z-index:2;overflow:hidden;padding-left:0;border:1px solid #cbbfa8;border-radius:2px 7px 8px 2px;background:#fffaf0;box-shadow:inset 16px 0 18px -17px #594b384d,0 12px 26px #2927211a,0 1px 2px #5b4b361c}.notebook.book-page:before{display:block;content:"";position:absolute;top:0;bottom:0;left:13px;border-left:1.5px dashed #b3a68f;z-index:3;pointer-events:none}.notebook.book-page:after,.tear-face:after{content:"";position:absolute;inset:0;z-index:4;pointer-events:none;opacity:.7;background-image:radial-gradient(#aa967c24 .5px,transparent .8px),radial-gradient(#b19b7c19 .5px,transparent .9px),linear-gradient(100deg,transparent 0 44%,#bba8870b 50%,transparent 56%);background-size:11px 13px,17px 19px,160px 100%;mix-blend-mode:multiply}.page-curl{position:absolute;right:0;bottom:0;z-index:8;width:34px;height:34px;pointer-events:none;background:linear-gradient(135deg,transparent 0 46%,#d3c4aa 48%,#efe5d4 52%,#fffaf0 72%);filter:drop-shadow(-3px -3px 3px #75654e24)}.book-page .notebook-top,.book-page .notebook-bottom{padding-left:31px}.book-page .notebook-top{min-height:47px;background:#fffaf0;border-bottom:1px solid #e3d9c8}.book-page .notebook-bottom{background:#fffaf0;border-top:1px solid #e3d9c8}.page-title{margin-left:7px;padding-left:9px;border-left:1px solid #cbbfad;color:#574e40}.tear-leaf{position:absolute;z-index:5;top:0;right:0;left:29px;height:100%;pointer-events:none;transform-origin:top left;animation:tear-page .88s cubic-bezier(.2,.75,.25,1) forwards}.tear-face{position:absolute;inset:0;display:flex;flex-direction:column;overflow:hidden;border:1px solid #cbbfa8;border-radius:2px 7px 8px 2px;background:#fffaf0}.tear-face:before{content:"";position:absolute;z-index:3;top:0;bottom:0;left:13px;border-left:1.5px dashed #b3a68f}.tear-leaf .notebook-top,.tear-leaf .notebook-bottom{padding-left:31px;background:#fffaf0}.tear-leaf .page-frame{flex:1;min-height:0;height:auto}.tear-leaf iframe{pointer-events:none}@keyframes tear-page{0%{transform:translate(0) rotate(0);opacity:1}28%{transform:translate(8px,-13px) rotate(1.5deg);opacity:1}to{transform:translate(33%,-35%) rotate(8deg);opacity:0}}.book-controls{display:flex;align-items:center;gap:10px;margin:22px 0 0 29px}.book-controls button{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:41px;border:1.5px solid #292721;border-radius:8px;background:#fffdf8;color:#292721;padding:9px 12px;font-size:12px;font-weight:800;white-space:nowrap}.book-controls button:hover:not(:disabled){background:#ffe8ba}.book-controls button:disabled{opacity:.42}.region-name{margin:5px 0 0 25px;color:#6b6255;font-size:12px;font-weight:700;text-transform:capitalize}.part-picker{flex:none;padding:10px 26px 9px;border-bottom:1px solid #d6cabb;background:#fff8eb;min-width:0}.part-picker-label{display:block;color:#796a57;font-size:10px;font-weight:800;letter-spacing:.08em}.part-picker-list{display:flex;gap:6px;overflow-x:auto;scrollbar-width:thin;padding:6px 0 3px}.part-picker-list button{flex:none;border:1px solid #aa9b83;border-radius:6px;background:#fffdf8;color:#3b342b;padding:6px 8px;font-size:10px;font-weight:800;text-transform:capitalize;white-space:nowrap}.part-picker-list button:hover,.part-picker-list button[aria-pressed=true]{border-color:#292721;background:#ffe2aa}.save-control{position:relative;margin-left:auto}.book-controls .tear-button{background:#f3bb62;box-shadow:0 3px #9c704b}.book-controls .tear-button:hover:not(:disabled){background:#ffd38b}.save-menu{position:absolute;right:0;bottom:calc(100% + 12px);z-index:40;width:min(285px,calc(100vw - 35px));padding:8px;border:1.5px solid #292721;border-radius:12px;background:#fffdf8;box-shadow:0 7px #d8cbb5,0 16px 30px #2927212b}.save-menu-title{display:block;padding:8px 10px 9px;color:#6b6255;font-size:10px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.book-controls .save-menu button{display:flex;width:100%;height:auto;min-height:47px;align-items:center;justify-content:space-between;gap:12px;border:0;border-radius:7px;background:transparent;padding:8px 10px;text-align:left;white-space:normal}.save-menu button strong{font-size:13px;color:#292721}.save-menu button span{font-size:10px;font-weight:600;color:#6b6255;text-align:right}.book-controls .save-menu button:hover,.book-controls .save-menu button:focus-visible{background:#ffe8ba}.save-status{min-height:19px;margin:10px 0 0 29px;color:#4e7656;font-size:11px;font-weight:700;line-height:1.4}.book-controls .add-text-button{background:#f3bb62;box-shadow:0 3px #9c704b}.book-controls .add-text-button:hover:not(:disabled){background:#ffd38b}.scene-text-edit .remove-text-button{justify-self:start;border:0;background:transparent;color:#a84635;padding:3px 0;font-size:11px;font-weight:800;text-decoration:underline;text-underline-offset:3px}.scene-text-edit .remove-text-button:hover{color:#6e241c}@media(max-width:1120px){.book-controls{gap:6px}.book-controls button{padding:8px 9px}}@media(max-width:920px){.book-stage{padding-left:25px}.book-spine{width:30px}.book-stack{left:28px}.tear-leaf{left:25px}.book-controls,.save-status{margin-left:25px}}@media(max-width:520px){.book-stage{padding-left:20px}.book-spine{width:25px}.book-spine span{width:9px}.book-stack{left:23px;right:-3px}.tear-leaf{left:20px}.book-page .notebook-top,.book-page .notebook-bottom,.tear-leaf .notebook-top,.tear-leaf .notebook-bottom{padding-left:25px}.notebook.book-page:before,.tear-face:before{left:10px}.page-title{display:none}.book-controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:17px 0 0 20px}.save-control{grid-column:1/-1;margin-left:0}.book-controls .tear-button{width:100%;margin:0}.book-arrow span{display:none}.save-status{margin-left:20px}}@media(prefers-reduced-motion:reduce){.tear-leaf{animation:none!important}}.page-frame iframe{width:calc(100% * var(--fit-inverse,1));height:calc(100% * var(--fit-inverse,1));transform:scale(var(--fit-scale,1));transform-origin:top left}.picture-zoom-toolbar{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:7px;margin:0 0 11px 29px;color:#62594c}.picture-zoom-toolbar>span{margin-right:auto;font-size:11px;font-weight:800;white-space:nowrap}.picture-zoom-toolbar button{display:grid;place-items:center;min-width:36px;min-height:36px;padding:6px;border:1.5px solid #292721;border-radius:8px;background:#fffdf8;color:#292721;cursor:pointer}.picture-zoom-toolbar button:hover:not(:disabled){background:#ffe7b8}.picture-zoom-toolbar button:disabled{opacity:.42;cursor:not-allowed}.picture-zoom-toolbar output{min-width:45px;text-align:center;font-size:12px;font-weight:800;font-variant-numeric:tabular-nums}.picture-zoom-toolbar .picture-zoom-reset{padding-inline:10px;font-size:11px;font-weight:800}.picture-zoom-toolbar small{width:100%;text-align:right;font-size:10px;font-weight:700;color:#786e5e}.picture-viewport{overflow:auto!important;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#a99b85 transparent}.picture-zoom-content{position:relative;width:calc(100% * var(--picture-zoom,1));height:calc(100% * var(--picture-zoom,1));min-height:100%}.picture-zoom-content iframe{width:calc(100% * var(--fit-inverse,1) * var(--picture-zoom-inverse,1));height:calc(100% * var(--fit-inverse,1) * var(--picture-zoom-inverse,1));transform:scale(calc(var(--fit-scale,1) * var(--picture-zoom,1)));transform-origin:top left}@media(pointer:coarse){.picture-zoom-toolbar button{min-width:44px;min-height:44px}}@media(max-width:920px){.picture-zoom-toolbar{margin-left:25px}}@media(max-width:520px){.picture-zoom-toolbar{margin-left:20px}}@media(min-width:921px)and (min-height:680px){.app-shell{height:100dvh;overflow:hidden}.workspace{height:calc(100dvh - 82px);min-height:0;overflow:hidden}.canvas-side{display:flex;flex-direction:column;min-height:0;overflow:hidden;padding-top:20px;padding-bottom:14px}.section-head{flex:none;margin-bottom:16px}.scene-palette{flex:none;margin-bottom:12px}.book-wrap{display:flex;flex-direction:column;flex:1;min-height:0}.book-stage{display:flex;flex:1;min-height:0}.notebook.book-page{display:flex;flex-direction:column;flex:1;min-height:0}.page-frame,.page-frame.scene-frame{flex:1;min-height:0;height:auto}.book-controls{flex:none;margin-top:12px}.save-status{flex:none;margin-top:6px}.canvas-tip{flex:none;margin-top:10px}.editor-side{min-height:0;overflow-y:auto}}@media(max-width:920px){.page-frame{height:clamp(340px,calc(100dvh - 360px),590px)}.page-frame.scene-frame{height:clamp(340px,calc(100dvh - 450px),560px)}}@media(max-width:520px){.page-frame{height:clamp(300px,calc(100dvh - 385px),520px)}.page-frame.scene-frame{height:clamp(300px,calc(100dvh - 480px),470px)}}.workspace{grid-template-columns:minmax(0,1.75fr) minmax(350px,.7fr)}.book-stage{display:grid;grid-template-columns:minmax(0,1fr);padding-left:29px;min-width:0}.book-stage .book-spine{left:0;width:34px;z-index:9}.book-stage .book-stack{left:31px;right:-4px}.spread-right-sheet{position:relative;grid-column:1;grid-row:1;z-index:4;min-width:0;min-height:0}.spread-face{position:absolute;inset:0;display:flex;min-width:0;min-height:0}.spread-face .notebook.book-page{width:100%;height:100%;display:flex;flex-direction:column;min-width:0;min-height:0;padding-left:0;box-shadow:inset 10px 0 15px -12px #594b384d,0 9px 19px #29272124}.spread-face .page-frame,.spread-face .page-frame.scene-frame{flex:1;min-height:0;height:auto}.spread-face .notebook-top,.spread-face .notebook-bottom{overflow:hidden;white-space:nowrap}.book-stage .tear-leaf{left:29px}@media(max-width:920px){.book-stage{height:clamp(340px,56dvh,590px);padding-left:25px;flex:none}.book-stage .book-spine{width:30px}.book-stage .book-stack{left:28px}.book-stage .tear-leaf{left:25px}.spread-face .notebook-top,.spread-face .notebook-bottom{padding:8px}}@media(max-width:520px){.book-stage{height:clamp(310px,52dvh,470px);padding-left:20px}.book-stage .book-spine{width:25px}.book-stage .book-stack{left:23px}.book-stage .tear-leaf{left:20px}.spread-face .notebook-top,.spread-face .notebook-bottom{font-size:8px}}.editor-footer{position:sticky;bottom:0;z-index:4;flex:none;background:#fffdf8}.book-wrap.imported-wrap{justify-content:flex-start}.book-stage.imported-stage{display:block;flex:none;height:auto}.imported-stage .spread-right-sheet{position:relative;display:block}.imported-stage .spread-face{position:relative;display:block;inset:auto}.imported-stage .notebook.book-page{height:auto}.imported-stage .page-frame{width:100%;height:auto;flex:none;aspect-ratio:16/9}@media(min-width:921px){.book-wrap.imported-wrap{width:min(100%,max(540px,calc(177.78dvh - 627px)));align-self:center}}@media(max-width:920px){.book-stage.imported-stage{height:auto}}@media(min-width:921px)and (min-height:680px){.editor-side{overflow:hidden}.code-area{min-height:0;overflow-y:auto;overscroll-behavior:contain}}@media(max-width:920px){.editor-footer{padding-bottom:max(15px,env(safe-area-inset-bottom))}}.code-input{gap:10px}.code-input textarea{min-width:0}.code-gutter{width:42px}.code-line{gap:10px}.code-line>span{min-width:42px}.gutter-row{display:flex!important;align-items:center;justify-content:space-between;gap:4px;height:1.65em!important}.gutter-row>span{min-width:15px;text-align:right}.gutter-row.is-color-active{color:#ffd382}.code-color-swatch{flex:none;width:15px;height:15px;padding:0;border:1.5px solid #eee6d7;border-radius:4px;box-shadow:0 0 0 1px #171612;cursor:pointer}.code-color-swatch:hover,.code-color-swatch:focus-visible{box-shadow:0 0 0 2px #f2b855}.canvas-color-trigger{position:fixed;z-index:18;display:grid;place-items:center;width:28px;height:28px;padding:0;border:2px solid #292721;border-radius:50%;box-shadow:0 2px 8px #29272155;color:#292721;cursor:pointer;transform:translate(-20%)}.canvas-color-trigger svg{padding:1px;border-radius:50%;background:#fffdf8cc}.canvas-color-trigger:hover{transform:translate(-20%) scale(1.12)}.floating-color-picker{position:fixed;z-index:80;width:min(274px,calc(100vw - 24px));max-height:calc(100dvh - 24px);overflow:auto;padding:13px;border:1.5px solid #51483a;border-radius:11px;background:#fffdf8;color:#292721;box-shadow:0 14px 38px #29272140,0 2px #c6bda9;font-family:DM Sans,sans-serif}.floating-picker-head{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;margin-bottom:11px}.floating-picker-head>div{display:flex;flex-direction:column;gap:2px;min-width:0}.floating-picker-head strong{font:800 16px/1.1 Fraunces,serif}.floating-picker-head span{font:700 10px/1.3 ui-monospace,SFMono-Regular,Menlo,monospace;color:#736a5c;overflow:hidden;text-overflow:ellipsis}.floating-picker-head button,.picker-hex-row button{display:grid;place-items:center;flex:none;width:28px;height:28px;border:1px solid #d5cbbc;border-radius:6px;background:#fff;color:#4c4338}.floating-picker-head button:hover,.picker-hex-row button:hover{background:#fff0d2}.picker-saturation{position:relative;height:156px;border:1px solid #9f9585;border-radius:7px;cursor:crosshair;touch-action:none;overflow:hidden}.picker-saturation-white,.picker-saturation-black{position:absolute;inset:0;pointer-events:none}.picker-saturation-white{background:linear-gradient(to right,#fff,transparent)}.picker-saturation-black{background:linear-gradient(to top,#000,transparent)}.picker-saturation-thumb{position:absolute;width:15px;height:15px;border:2px solid white;border-radius:50%;box-shadow:0 0 0 1px #292721,0 1px 4px #0007;transform:translate(-50%,-50%);pointer-events:none}.picker-hue-label{display:block;margin:11px 0 5px;color:#6c6254;font-size:10px;font-weight:800}.picker-hue{display:block;width:100%;height:14px;margin:0;appearance:none;-webkit-appearance:none;border:1px solid #a39887;border-radius:99px;background:linear-gradient(to right,red,#ff0,#0f0,#0ff,#00f,#f0f,red);cursor:pointer}.picker-hue::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:17px;height:17px;border:2px solid #fff;border-radius:50%;box-shadow:0 0 0 1px #292721,0 1px 3px #0006;background:transparent}.picker-hue::-moz-range-thumb{width:14px;height:14px;border:2px solid #fff;border-radius:50%;box-shadow:0 0 0 1px #292721;background:transparent}.picker-hex-row{display:flex;align-items:center;gap:7px;margin-top:16px}.picker-current{flex:none;width:29px;height:29px;border:1px solid #51483a;border-radius:5px}.picker-hex-row label{font-size:10px;font-weight:800;color:#675d50}.picker-hex-row input{min-width:0;flex:1;width:80px;height:29px;padding:4px 6px;border:1px solid #cbbfae;border-radius:5px;background:#fff;color:#292721;font:700 12px ui-monospace,SFMono-Regular,Menlo,monospace;text-transform:uppercase}.picker-recents{margin-top:12px;padding-top:10px;border-top:1px solid #e4dbcc}.picker-recents>span{display:block;margin-bottom:7px;color:#6c6254;font-size:10px;font-weight:800}.picker-recents>div{display:flex;gap:6px;flex-wrap:wrap;min-height:22px}.picker-recents button{width:22px;height:22px;border:1px solid #6d6356;border-radius:5px;cursor:pointer}.picker-recents button:hover{outline:2px solid #d77649;outline-offset:2px}.picker-recents .picker-empty{color:#897e6c;font-size:10px}@media(max-width:520px){.floating-color-picker{width:min(274px,calc(100vw - 24px))}.code-gutter{width:38px}.code-line>span{min-width:38px}}.floating-color-picker:has(.gradient-controls){width:min(310px,calc(100vw - 24px))}.picker-type-label{display:block;margin:2px 0 5px;color:#6c6254;font-size:10px;font-weight:800}.picker-type-select{width:100%;height:34px;padding:5px 9px;border:1px solid #b7aa96;border-radius:6px;background:#fff;color:#292721;font:700 12px DM Sans,sans-serif;cursor:pointer}.picker-type-select:focus-visible,.gradient-controls :focus-visible,.canvas-gradient-handle:focus-visible{outline:2px solid #bc673d;outline-offset:2px}.picker-svg-note{margin:5px 0 0;color:#706654;font-size:10px;line-height:1.35}.gradient-controls{margin:13px 0;padding:12px 2px;border-top:1px solid #e5d9c9;border-bottom:1px solid #e5d9c9}.gradient-bar-heading{display:flex;align-items:center;justify-content:space-between;gap:7px;margin-bottom:12px;font-size:11px}.gradient-bar-heading span,.gradient-tip{color:#756a5b;font-size:10px}.gradient-preview-bar{position:relative;height:25px;margin:0 12px 17px;border:1px solid #776a59;border-radius:5px;cursor:copy;touch-action:none}.gradient-stop-handle{position:absolute;top:50%;width:17px;height:17px;border:2px solid white;border-radius:50%;box-shadow:0 0 0 1px #292721,0 2px 5px #0004;transform:translate(-50%,-50%);cursor:grab;touch-action:none}.gradient-stop-handle.selected{box-shadow:0 0 0 2px #d3653e,0 2px 5px #0004}.gradient-stop-handle:active{cursor:grabbing}.gradient-stop-row,.gradient-setting-row,.gradient-center-row{display:flex;align-items:center;gap:5px;min-height:29px;margin-top:6px;font-size:11px}.gradient-stop-row>label,.gradient-setting-row>label,.gradient-center-row>span:first-child{flex:1;font-weight:700}.gradient-center-row label{font-size:10px;font-weight:700;color:#6c6254}.gradient-controls input[type=number]{width:51px;height:28px;padding:3px 5px;border:1px solid #cbbfae;border-radius:5px;background:#fff;color:#292721;font:700 11px ui-monospace,monospace}.gradient-controls select{max-width:155px;height:28px;padding:3px;border:1px solid #cbbfae;border-radius:5px;background:#fff;color:#292721;font-size:11px}.gradient-delete-stop{display:grid;place-items:center;width:28px;height:28px;margin-left:auto;border:1px solid #cbbfae;border-radius:5px;background:#fff;color:#594d41;cursor:pointer}.gradient-delete-stop:disabled{opacity:.4;cursor:not-allowed}.gradient-tip{display:flex;align-items:center;gap:4px;margin:8px 0 0;line-height:1.35}.gradient-swatch{background-size:cover}.canvas-gradient-guide{position:fixed;z-index:24;pointer-events:none;overflow:visible}.canvas-gradient-handle{position:fixed;z-index:25;width:18px;height:18px;padding:0;border:2px solid white;border-radius:50%;background:#744d9d;box-shadow:0 0 0 1px #372845,0 2px 5px #0005;transform:translate(-50%,-50%);cursor:grab;touch-action:none}.canvas-gradient-handle:active{cursor:grabbing}.recovery-screen{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:18px;min-height:100dvh;max-width:600px;margin:auto;padding:32px;color:#292721}.recovery-screen h1{margin:14px 0 0;font:800 clamp(32px,6vw,52px)/1.1 "Fraunces",serif}.recovery-screen p{margin:0;color:#5b5349;font:500 17px/1.5 DM Sans,sans-serif}.recovery-screen button{padding:13px 20px;border:2px solid #292721;border-radius:9px;background:#f6c85f;color:#292721;font:800 14px DM Sans,sans-serif;cursor:pointer}.recovery-screen button:hover{background:#f4b54a}.multi-selection-list{display:flex;flex-wrap:wrap;gap:5px;margin:12px 0 0 18px}.multi-selection-list span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:5px 8px;border:1px solid #9eafc7;border-radius:5px;background:#eef3fb;color:#324b70;font-size:10px;font-weight:800}.multi-selection-list span.active{border-color:#dd744d;background:#fff0df;color:#8d462f}.multi-selection-help{margin:10px 0 0 18px;color:#6c6254;font-size:10px;line-height:1.45}.detail-entry{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:14px 0 10px}.detail-entry button{border:1px solid #a9987d;border-radius:6px;background:#fff8e9;color:#292721;font-size:11px;font-weight:800;min-height:34px;padding:7px 10px}.detail-entry button:hover{background:#fbe9c6}.detail-entry-main{flex:1;text-align:left}.detail-entry-main span{float:right;font-size:15px}.detail-entry .detail-direct-toggle{white-space:nowrap;background:#eef3fb;border-color:#9eafc7;color:#324b70}.gradient-detail{border:1px solid #b4a793;border-radius:10px;background:#f7f0e4;padding:13px;margin:0 0 17px;box-shadow:0 5px 13px #29272112}.detail-header,.detail-zoom,.detail-zoom>div{display:flex;align-items:center;justify-content:space-between;gap:9px}.detail-header{align-items:flex-start}.detail-header h3{font:800 17px/1.2 Fraunces,serif;margin:0}.detail-header p{font-size:10px;line-height:1.4;color:#62594c;margin:3px 0 0}.detail-header button,.detail-zoom button{display:grid;place-items:center;width:29px;height:29px;border:1px solid #bdaf99;border-radius:6px;background:#fffdf8;color:#292721;padding:0;flex:none}.detail-header button:hover,.detail-zoom button:hover:not(:disabled){background:#ffe7bb}.detail-zoom button:disabled{opacity:.4}.detail-zoom{margin-top:13px;font-size:11px;font-weight:800}.detail-zoom output{min-width:37px;text-align:center;font-variant-numeric:tabular-nums}.detail-zoom-slider{display:block;width:100%;margin:9px 0 12px;accent-color:#744d9d}.detail-viewport{position:relative;height:260px;overflow:hidden;touch-action:none;cursor:grab;border:1px solid #a79a87;border-radius:7px;background-color:#fff;background-image:linear-gradient(45deg,#e7e2d9 25%,transparent 25%),linear-gradient(-45deg,#e7e2d9 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#e7e2d9 75%),linear-gradient(-45deg,transparent 75%,#e7e2d9 75%);background-size:18px 18px;background-position:0 0,0 9px,9px -9px,-9px 0}.detail-viewport:active{cursor:grabbing}.detail-viewport iframe{position:absolute;border:0;pointer-events:none;background:transparent}.detail-guides{position:absolute;inset:0;pointer-events:none;overflow:visible}.detail-handle{position:absolute;z-index:2;display:grid;place-items:center;width:27px;height:27px;padding:0;border:2px solid #fff;border-radius:50%;background:#744d9d;color:#fff;box-shadow:0 0 0 2px #342348,0 3px 7px #0004;font-size:14px;font-weight:900;line-height:1;transform:translate(-50%,-50%);cursor:grab;touch-action:none}.detail-handle:hover{background:#9665bd;box-shadow:0 0 0 3px #342348,0 4px 9px #0005}.detail-handle:active{cursor:grabbing;background:#523272}.detail-handle:focus-visible{outline:3px solid #e57242;outline-offset:5px}.detail-handle-focal{background:#b86137}.detail-handle-radiusX,.detail-handle-radiusY{background:#526f9d}.detail-empty{position:absolute;inset:0;display:grid;place-items:center;color:#62594c;font-size:12px}.detail-pan-hint{display:flex;align-items:center;gap:5px;margin:8px 0 12px;color:#62594c;font-size:10px;line-height:1.35}.detail-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.detail-field,.detail-selects label{display:flex;flex-direction:column;gap:4px;color:#514839;font-size:10px;font-weight:800}.detail-field span{display:flex;align-items:center;border:1px solid #c2b5a1;border-radius:5px;background:#fffdf8;overflow:hidden}.detail-field input{width:100%;min-width:0;height:31px;border:0;background:transparent;padding:4px 8px;color:#292721;font:700 12px ui-monospace,monospace}.detail-field small,.detail-stop-input small{padding:0 7px;color:#746a5c}.detail-selects{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:10px}.detail-selects select{width:100%;min-width:0;height:32px;padding:3px 7px;border:1px solid #c2b5a1;border-radius:5px;background:#fffdf8;color:#292721;font-size:11px}.detail-stops{margin-top:13px;padding-top:12px;border-top:1px solid #d7cbb8}.detail-stops>strong{font-size:11px}.detail-stop-track{height:24px;position:relative;margin:11px 24px 17px;border:1px solid #7a6c5c;border-radius:5px}.detail-stop-track .detail-handle{top:12px!important;width:25px;height:25px;background:#fff;border-color:#744d9d}.detail-stop-input{display:flex;align-items:center;gap:6px;margin-top:7px;font-size:10px;font-weight:800;color:#514839}.detail-stop-input span{flex:1}.detail-stop-input input[type=color]{width:31px;height:27px;padding:2px;border:1px solid #a89986;border-radius:5px;background:#fff}.detail-stop-input input[type=number]{width:60px;height:27px;border:1px solid #c2b5a1;border-radius:5px;background:#fffdf8;padding:3px 5px;color:#292721;font:700 11px ui-monospace,monospace}@media(max-width:920px){.detail-viewport{height:clamp(260px,42dvh,440px)}}.floating-gradient-workbench{position:fixed;z-index:70;width:min(720px,calc(100vw - 16px));max-height:min(640px,72dvh);overflow:auto;padding:12px;border:2px solid #51483a;border-radius:13px;background:#fffaf0;color:#292721;box-shadow:0 20px 55px #29272150,0 3px #c6bda9;font-family:DM Sans,sans-serif;overscroll-behavior:contain}.floating-workbench-head{position:sticky;top:-12px;z-index:5;display:flex;align-items:center;gap:8px;margin:-12px -12px 0;padding:8px 10px;border-bottom:1px solid #d5c8b4;border-radius:11px 11px 0 0;background:#fffaf0}.floating-workbench-grip{display:flex;align-items:center;gap:7px;flex:1;min-width:0;min-height:32px;padding:3px 5px;border:0;background:transparent;color:#292721;text-align:left;cursor:grab;touch-action:none}.floating-workbench-grip:active{cursor:grabbing}.floating-workbench-grip span{font:800 15px/1.2 Fraunces,serif}.floating-workbench-grip small{margin-left:auto;color:#746a5b;font-size:10px;font-weight:700}.floating-workbench-close{display:grid;place-items:center;width:29px;height:29px;padding:0;border:1px solid #bdaf99;border-radius:6px;background:#fffdf8;color:#292721}.floating-workbench-close:hover{background:#ffe7bb}.gradient-workbench-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 1px}.gradient-workbench-head span{color:#62594c;font-size:10px;line-height:1.35}.gradient-workbench-head button,.show-gradient-preview{border:1px solid #a9987d;border-radius:6px;background:#fff8e9;color:#292721;font-size:10px;font-weight:800;min-height:31px;padding:6px 9px;white-space:nowrap}.gradient-workbench-head button:hover,.show-gradient-preview:hover{background:#fbe9c6}.gradient-workbench-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px;align-items:start;min-width:0}.gradient-workbench-adjuster,.gradient-workbench-preview{min-width:0}.floating-gradient-workbench .floating-color-picker.embedded-picker{position:relative;left:auto;top:auto;width:100%!important;max-height:none;overflow:visible;padding:12px;border:1px solid #b4a793;border-radius:10px;box-shadow:0 5px 13px #29272112;background:#fffdf8}.floating-gradient-workbench .gradient-detail{margin:0}.floating-gradient-workbench .gradient-detail .detail-header-actions{display:flex;gap:5px}.floating-gradient-workbench .gradient-detail .detail-loading{position:absolute;inset:0;display:grid;place-items:center;background:#fffaf0e8;color:#62594c;font-size:11px;font-weight:700;z-index:1}.show-gradient-preview{width:100%;height:50px}.gradient-detail.is-expanded{position:fixed;z-index:90;inset:8px;width:auto;max-width:640px;max-height:calc(100dvh - 16px);overflow:auto;margin:0 0 0 auto;box-shadow:0 12px 40px #29272166}.gradient-detail.is-expanded .detail-viewport{height:clamp(320px,50dvh,580px)}@media(max-width:700px){.floating-gradient-workbench{left:8px!important;top:auto!important;bottom:8px;width:calc(100vw - 16px);max-height:min(70dvh,690px)}.floating-workbench-grip{touch-action:auto;cursor:default}.floating-workbench-grip small{display:none}.gradient-workbench-body{grid-template-columns:minmax(0,1fr)}.gradient-workbench-preview{order:-1}.floating-gradient-workbench .gradient-detail .detail-viewport{height:clamp(220px,34dvh,340px)}.gradient-detail.is-expanded{max-width:440px}}.workspace.editor-collapsed{grid-template-columns:minmax(0,1fr)}.workspace.editor-collapsed .canvas-side{width:min(100%,1200px);justify-self:center;margin-inline:auto}.editor-top{display:flex;align-items:center;justify-content:space-between;gap:8px}.editor-heading{min-width:0}.editor-collapse{display:grid;place-items:center;flex:none;width:32px;height:32px;border:1.5px solid #b9ae9d;border-radius:7px;background:#fffdf8;color:#292721;padding:0}.editor-collapse:hover,.editor-expand:hover{background:#ffe7b8}.editor-expand{display:none}.editor-side.is-collapsed{position:fixed;top:94px;right:12px;z-index:35;width:50px;height:auto;overflow:visible;border:0;background:transparent}@media(max-width:699px){.editor-side.is-collapsed>:not(.editor-expand){display:none!important}}.editor-side.is-collapsed .editor-expand{display:flex;align-items:center;gap:12px;align-self:stretch;min-height:164px;height:max-content;margin:15px 6px;padding:12px 5px;border:1.5px solid #292721;border-radius:9px;background:#fff8e9;color:#292721;font-size:11px;font-weight:800;box-shadow:0 3px #b5a896}.editor-expand span{writing-mode:vertical-rl}@media(max-width:920px){.editor-side.is-collapsed{top:auto;right:14px;bottom:max(14px,env(safe-area-inset-bottom));width:auto}.editor-side.is-collapsed .editor-expand{min-height:0;margin:0;padding:10px 13px;flex-direction:row;background:#f3bb62;box-shadow:0 4px 12px #29272133}.editor-expand span{writing-mode:horizontal-tb}}.header-actions{display:flex;align-items:center;gap:9px;margin-left:auto}.share-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:39px;padding:8px 12px;border:1.5px solid #292721;border-radius:8px;background:#f7d793;color:#292721;font-size:12px;font-weight:800;white-space:nowrap;box-shadow:0 2px #292721}.share-button:hover{background:#f3bd5c}.share-modal{position:relative;width:min(410px,100%);max-height:calc(100dvh - 32px);overflow:auto;padding:27px;border:3px solid #292721;border-radius:15px;background:#fffdf7;box-shadow:0 20px 50px #0004;text-align:center}.share-modal .modal-art{margin:0 auto;background:#f7d793}.share-modal h2{margin:18px 0 7px;font:800 29px/1.1 Fraunces,serif;letter-spacing:-.035em}.share-modal p{margin:0;color:#5d5447;font-size:13px;line-height:1.5}.share-qr-frame{display:grid;place-items:center;width:min(260px,100%);margin:18px auto 17px;padding:9px;border:1.5px solid #292721;border-radius:12px;background:#fff;box-shadow:0 4px #ded4bf}.share-qr-frame img{display:block;width:100%;height:auto;image-rendering:pixelated}.share-url-label{display:block;margin:0 0 5px;text-align:left;color:#62594c;font-size:11px;font-weight:800}.share-url{display:block;width:100%;min-height:39px;padding:8px 10px;border:1px solid #baad97;border-radius:6px;background:#fff;color:#3b352d;font-size:11px;text-overflow:ellipsis}.share-copy{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:42px;margin-top:10px;border:2px solid #292721;border-radius:7px;background:#292721;color:#fffdf7;font-size:12px;font-weight:800}.share-copy:hover{background:#4a4032}.share-modal .share-copy-status{min-height:18px;margin-top:5px;color:#4d7c5a;font-size:11px;font-weight:800}.share-modal .share-note{padding-top:12px;border-top:1px solid #e5dac8;color:#746a5b;font-size:11px}@media(max-width:570px){.share-button span{display:none}.share-button{width:39px;padding:7px}.header-actions{gap:3px}.share-modal{padding:23px}}.touch-picker-anchor{position:fixed;width:1px;height:1px;pointer-events:none;z-index:-1}.book-wrap,.book-wrap *{-webkit-tap-highlight-color:transparent}@media(pointer:coarse),(max-width:920px){.canvas-color-trigger{display:none}.code-color-swatch{width:25px;height:25px}.code-gutter,.code-line>span{width:50px;min-width:50px}.gutter-row{height:26px!important}}.touch-workspace .canvas-color-trigger{display:none}.touch-workspace .editor-heading h2{font-size:21px}@media(min-width:921px)and (max-width:1366px){.touch-workspace .workspace:not(.editor-collapsed){grid-template-columns:minmax(0,1fr) 310px}.touch-workspace .canvas-side{padding-left:16px;padding-right:16px}.touch-workspace .book-wrap.imported-wrap{width:min(100%,max(540px,calc(177.78dvh - 470px)))}}@media(max-width:920px){.editor-side:not(.is-collapsed){position:fixed;inset:0 0 0 auto;z-index:60;width:min(360px,92vw);height:100dvh;min-height:0;overflow-y:auto;overscroll-behavior:contain;border-top:0;border-left:1.5px solid #bcb09f;box-shadow:-12px 0 34px #29272130;background:#fffdf8}.editor-side:not(.is-collapsed) .editor-top{position:relative;top:auto;z-index:1;background:#fffdf8}}.docked-color-workspace,.floating-gradient-workbench.is-docked{flex:none}.touch-workspace .docked-color-workspace,.touch-workspace .floating-gradient-workbench.is-docked{max-width:100%}.docked-color-workspace{margin:0 14px 14px;border:1.5px solid #b7aa96;border-radius:11px;background:#fffaf0;box-shadow:0 4px 12px #29272112}.docked-color-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:5px 9px 5px 14px;border-bottom:1px solid #d5c8b4}.docked-color-head strong,.docked-workspace-title{font:800 16px/1.2 Fraunces,serif}.docked-color-head button{display:grid;place-items:center;min-width:44px;min-height:44px;padding:0;border:0;border-radius:7px;background:transparent;color:#292721}.docked-color-head button:hover,.docked-color-head button:focus-visible{background:#fce9c7}.docked-color-workspace .floating-color-picker.embedded-picker{position:relative;left:auto;top:auto;width:100%!important;max-height:none;overflow:visible;padding:12px;border:0;box-shadow:none;background:transparent}.docked-color-workspace .floating-picker-head strong{display:none}.floating-gradient-workbench.is-docked{position:relative!important;inset:auto!important;z-index:0;isolation:isolate;width:auto!important;max-height:none;overflow:visible;margin:0 14px 14px;padding:0 12px 14px;border:1.5px solid #b7aa96;border-radius:11px;background:#fffaf0;box-shadow:0 4px 12px #29272112}.floating-gradient-workbench.is-docked .floating-color-picker.embedded-picker,.docked-color-workspace .floating-color-picker.embedded-picker{z-index:auto}.floating-gradient-workbench.is-docked .floating-workbench-head{position:relative;top:auto;z-index:1;margin:0 -12px;padding:5px 9px 5px 14px}.floating-gradient-workbench.is-docked .floating-workbench-close{min-width:44px;min-height:44px}.floating-gradient-workbench.is-docked .gradient-workbench-body{grid-template-columns:minmax(0,1fr)}.floating-gradient-workbench.is-docked .gradient-workbench-preview{order:0}.floating-gradient-workbench.is-docked .gradient-detail .detail-viewport{height:clamp(210px,30dvh,310px)}@media(min-width:921px)and (min-height:680px){.touch-workspace .editor-side:not(.is-collapsed){overflow-y:auto;overscroll-behavior:contain}.touch-workspace .code-area{flex:none;overflow:visible}}@media(min-width:700px)and (max-width:920px){.touch-workspace.app-shell{height:100dvh;overflow:hidden}.touch-workspace .workspace{height:calc(100dvh - 68px);min-height:0;overflow:hidden;grid-template-rows:minmax(0,1fr)}.touch-workspace .canvas-side{height:100%;max-height:100%;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding-left:12px;padding-right:12px}.workspace.editor-collapsed .book-wrap.imported-wrap{margin-inline:auto}.workspace:not(.editor-collapsed){display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,42%);align-items:start}.workspace:not(.editor-collapsed) .canvas-side{min-width:0}.workspace:not(.editor-collapsed) .editor-side:not(.is-collapsed){position:relative;inset:auto;align-self:stretch;width:auto;height:100%;box-shadow:none}.workspace:not(.editor-collapsed) .section-head{display:block;margin-bottom:18px}.workspace:not(.editor-collapsed) .section-head h1{font-size:clamp(25px,3.8vw,31px);white-space:nowrap}.workspace:not(.editor-collapsed) .canvas-actions{justify-content:flex-end;margin-top:14px}.workspace:not(.editor-collapsed) .book-controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.workspace:not(.editor-collapsed) .book-controls>button{min-width:0;justify-content:center}.workspace:not(.editor-collapsed) .book-controls .save-control{grid-column:1/-1;margin-left:0}.workspace:not(.editor-collapsed) .book-controls .tear-button{width:100%;justify-content:center;margin:0}}@media(min-width:921px)and (min-height:680px)and (max-height:760px){.canvas-side{overflow-y:auto;overscroll-behavior:contain}.picture-zoom-toolbar small{display:none}.book-wrap.imported-wrap{width:min(100%,max(480px,calc(177.78dvh - 674px)))}}@media(min-width:700px)and (max-width:920px)and (max-height:800px){.touch-workspace .canvas-side{padding-top:12px;padding-bottom:10px}.touch-workspace .section-head{margin-bottom:8px}.touch-workspace .picture-zoom-toolbar{margin-bottom:6px}.touch-workspace .picture-zoom-toolbar small{display:none}.touch-workspace .book-wrap.imported-wrap{width:min(100%,max(400px,calc(177.78dvh - 820px)))}}.mobile-sheet-toggle,.mobile-sheet-title{display:none}@media(max-width:699px){.app-shell{--mobile-sheet-top:clamp(260px, calc(225px + 60vw) , calc(100dvh - 160px) );height:100dvh;min-height:0;display:flex;flex-direction:column;overflow:hidden}.topbar{flex:none}.workspace{flex:1;min-height:0;overflow:hidden}.workspace.sheet-open .canvas-side{height:calc(var(--mobile-sheet-top) - var(--mobile-header-height,68px));min-height:0;overflow-y:auto;overscroll-behavior:contain;padding-top:10px;padding-bottom:4px}.workspace.sheet-open .section-head,.workspace.sheet-open .scene-palette,.workspace.sheet-open .layout-toolbar,.workspace.sheet-open .picture-zoom-toolbar{display:none}.workspace.sheet-open .book-stage:not(.imported-stage){height:clamp(230px,35dvh,310px)}.workspace.sheet-open .book-controls{margin-top:8px}.workspace.sheet-open .save-status{margin-top:6px}.editor-side:not(.is-collapsed){inset:var(--mobile-sheet-top) 0 0;width:100%;height:auto;max-height:calc(100dvh - 12px);padding-bottom:env(safe-area-inset-bottom);border:0;border-top:1.5px solid #bcb09f;border-radius:16px 16px 0 0;box-shadow:0 -14px 32px #29272135;animation:mobile-sheet-enter .38s cubic-bezier(.22,1,.36,1) both;transition:top .28s ease}.editor-side.sheet-expanded:not(.is-collapsed){top:max(12px,env(safe-area-inset-top))}.editor-side:not(.is-collapsed) .editor-top{position:sticky;top:0;z-index:20;padding:20px 12px 9px;border-radius:16px 16px 0 0}.editor-side.sheet-color-mode:not(.sheet-expanded) .floating-gradient-workbench.is-docked,.editor-side.sheet-color-mode:not(.sheet-expanded) .docked-color-workspace{animation:mobile-sheet-content .25s ease-out both}.editor-side:not(.is-collapsed) .editor-top:before{content:"";position:absolute;top:7px;left:50%;width:36px;height:4px;transform:translate(-50%);border-radius:99px;background:#c4b8a4}.editor-side .editor-heading{gap:8px}.editor-side .editor-icon{width:32px;height:32px}.editor-side .editor-heading h2{font-size:18px}.editor-side .editor-heading p{display:none}.mobile-sheet-toggle{display:flex;align-items:center;justify-content:center;gap:3px;min-height:40px;margin-left:auto;padding:0 8px;border:0;border-radius:7px;background:transparent;color:#292721;font-size:12px;font-weight:800}.mobile-sheet-toggle:hover{background:#fce9c7}.mobile-sheet-toggle[aria-expanded=false] svg{transform:rotate(180deg)}.editor-side .editor-collapse{width:40px;height:40px}.editor-side .editor-collapse svg{transform:rotate(90deg)}.editor-side .selection-block{padding:9px 16px}.editor-side .selection-title{font-size:18px;margin-top:4px}.editor-side .docked-color-workspace,.editor-side .floating-gradient-workbench.is-docked{margin-inline:10px}.editor-side.sheet-color-mode:not(.sheet-expanded) .selection-block,.editor-side.sheet-color-mode:not(.sheet-expanded) .part-picker,.editor-side.sheet-color-mode:not(.sheet-expanded) .scene-text-edit,.editor-side.sheet-color-mode:not(.sheet-expanded) .code-area,.editor-side.sheet-color-mode:not(.sheet-expanded) .editor-footer{display:none}.editor-side.sheet-color-mode:not(.sheet-expanded) .editor-heading h2{display:none}.editor-side.sheet-color-mode:not(.sheet-expanded) .mobile-sheet-title{display:block;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:800 17px/1.2 Fraunces,serif}.editor-side.sheet-color-mode:not(.sheet-expanded) .docked-color-workspace{margin-top:8px}.editor-side.sheet-color-mode:not(.sheet-expanded) .docked-color-head,.editor-side.sheet-color-mode:not(.sheet-expanded) .floating-picker-head,.editor-side.sheet-color-mode:not(.sheet-expanded) .picker-svg-note,.editor-side.sheet-color-mode:not(.sheet-expanded) .picker-recents{display:none}.editor-side.sheet-color-mode:not(.sheet-expanded) .floating-color-picker.embedded-picker{padding:10px 12px 12px}.editor-side.sheet-color-mode:not(.sheet-expanded) .picker-saturation{height:118px;margin-top:8px}.editor-side.sheet-color-mode:not(.sheet-expanded) .picker-hue-label{margin:8px 0 4px}.editor-side.sheet-color-mode:not(.sheet-expanded) .picker-hex-row{margin-top:10px}}@keyframes mobile-sheet-enter{0%{transform:translateY(100%);opacity:.9}to{transform:translateY(0);opacity:1}}@keyframes mobile-sheet-content{0%{transform:translateY(12px);opacity:0}to{transform:translateY(0);opacity:1}}@media(max-width:360px){.editor-side .editor-icon{display:none}.editor-side .editor-heading h2{white-space:nowrap}}.wide-editor-expand{display:none}@media(min-width:700px){.workspace{display:grid;transition:grid-template-columns .42s cubic-bezier(.22,1,.36,1)}.workspace.editor-collapsed{grid-template-columns:minmax(0,2.45fr) minmax(0px,0fr)}.editor-side{transition:transform .42s cubic-bezier(.22,1,.36,1),opacity .3s ease,visibility .42s}.editor-side.is-collapsed{position:relative;inset:auto;z-index:1;width:auto;height:auto;min-width:0;overflow:hidden;transform:translate(72px);opacity:0;visibility:hidden;pointer-events:none}.editor-side .editor-expand{display:none!important}.wide-editor-expand{position:fixed;top:50%;right:18px;z-index:35;display:flex;align-items:center;gap:12px;min-height:164px;padding:12px 8px;border:1.5px solid #292721;border-radius:9px;background:#fff8e9;color:#292721;font-size:11px;font-weight:800;box-shadow:0 3px #b5a896;transform:translateY(-50%)}.wide-editor-expand span{writing-mode:vertical-rl}.wide-editor-expand:hover{background:#ffe7b8}}@media(min-width:700px)and (max-width:920px){.workspace.editor-collapsed{grid-template-columns:minmax(0,1fr) minmax(0px,0%)}.wide-editor-expand{top:auto;right:14px;bottom:max(14px,env(safe-area-inset-bottom));min-height:0;padding:10px 13px;background:#f3bb62;box-shadow:0 4px 12px #29272133;transform:none}.wide-editor-expand span{writing-mode:horizontal-tb}}@media(prefers-reduced-motion:reduce){.workspace,.editor-side{transition:none}}.help-modal .tour-replay-button{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin-top:15px;padding:12px;border:2px solid #292721;border-radius:7px;background:#f5bd58;color:#292721;font-size:12px;font-weight:800;box-shadow:0 4px #b5a896}.help-modal .tour-replay-button:hover{background:#ffe1a0}
