@import"https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;550;600;650;700&family=Manrope:wght@400;500;600;650;700;750;800&display=swap";:root{font-family:DM Sans,sans-serif;color:#29372f;background:#f7f8f3;font-synthesis:none;font-weight:400;--muted:#7b857c;--line:#e3e7dc;--green:#ddec8f}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer;color:inherit}button{transition:background .18s,box-shadow .18s,transform .18s}button:disabled{opacity:.3;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #849b3d;outline-offset:3px}button:hover:not(:disabled){filter:brightness(.98)}a{color:inherit;text-decoration:none}.topbar{height:82px;display:flex;align-items:center;gap:26px;padding:0 4.5%;border-bottom:1px solid var(--line);background:#fbfcf8}.brand{display:flex;gap:12px;align-items:center;font-family:Manrope,sans-serif;font-size:22px;font-weight:800;letter-spacing:-1px}.brand-mark{display:flex;align-items:center;justify-content:center;width:39px;height:39px;background:#dcec89;border-radius:12px;transform:rotate(-5deg)}.brand-mark svg{transform:rotate(5deg)}.brand-studio{font-size:20px;font-weight:500;color:#8d9689;letter-spacing:-.7px}.prototype-badge{display:flex;align-items:center;gap:6px;font-size:9px;letter-spacing:1.5px;background:#eef1e8;border:1px solid #e1e6d6;padding:6px 9px;border-radius:5px;color:#7c856d}.prototype-badge span{width:4px;height:4px;background:#95a65a;border-radius:50%}.header-actions{margin-left:auto;display:flex;gap:23px;align-items:center}.quiet{border:0;background:transparent;display:flex;align-items:center;gap:7px;font-size:12px;font-weight:500;padding:8px 5px}.save-button{border:1px solid #2d3d32;color:#f9fbf3;background:#2d3d32;border-radius:8px;padding:11px 16px;display:flex;align-items:center;gap:9px;font-size:12px;font-weight:550}.save-button:hover{box-shadow:0 4px 12px #2d3d3220}main{max-width:1510px;margin:0 auto;padding:37px 4.5% 0}.intro{display:flex;align-items:center;justify-content:space-between;margin-bottom:29px}.eyebrow{font-size:9px;font-weight:650;letter-spacing:1.8px;color:#859174;margin-bottom:11px}h1{font-family:Manrope,sans-serif;font-size:35px;line-height:1.2;font-weight:650;letter-spacing:-1.6px;margin:0 0 11px}h1>span{color:#99ad48}.intro p{font-size:13px;color:var(--muted);margin:0}.example-picker{position:relative}.example-button{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid #dce2d4;border-radius:8px;padding:12px 14px;font-size:12px;box-shadow:0 2px 2px #25351c03}.example-button>svg:first-child{color:#829345}.example-menu{position:absolute;right:0;top:50px;background:#fff;z-index:20;padding:8px;width:230px;border:1px solid var(--line);border-radius:10px;box-shadow:0 10px 30px #30402c12}.example-menu button{width:100%;border:0;background:#fff;padding:12px;border-radius:6px;text-align:left;display:flex;justify-content:space-between;font-size:13px}.example-menu button:hover{background:#f2f5eb}.example-menu small{display:block;font-size:10px;line-height:1.5;color:var(--muted);padding:6px 12px}.workspace{display:grid;grid-template-columns:291px minmax(0,1fr);gap:18px}.toolbox{background:#fff;border:1px solid var(--line);border-radius:13px;padding:23px 21px 18px}.panel-heading{display:flex;align-items:center;gap:10px}.step{font-family:Manrope,sans-serif;font-size:10px;color:#84916e;border:1px solid #e2e8d7;background:#f7f9ef;padding:4px 5px;border-radius:4px}h2{font-family:Manrope,sans-serif;font-size:14px;font-weight:750;letter-spacing:-.3px;margin:0}.panel-subtitle{font-size:11px;color:var(--muted);line-height:1.5;margin:10px 0 25px}.tool-group-label{font-size:9px;font-weight:600;letter-spacing:1.4px;color:#8c9587;margin:20px 0 11px}.tool-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:7px}.tool{position:relative;text-align:left;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;background:#f9faf6;border:1px solid #e5e9de;border-radius:8px;height:88px;padding:10px 9px}.tool strong{font-size:10px;font-weight:600;white-space:nowrap;margin-top:9px}.tool small{display:none}.tool-icon{display:flex;align-items:center;justify-content:center;color:#52664b;transform-origin:center}.tool-plus{position:absolute;right:6px;top:6px;color:#b2bda5}.primary-tool{background:#eef4d7;border-color:#d7e5aa}.tool:hover,.tool:focus-visible{box-shadow:0 3px 8px #4d663b15;border-color:#b2c780}.tool:hover .motion-extend,.tool:focus-visible .motion-extend{animation:extend 1.1s ease-in-out infinite}.tool:hover .motion-left,.tool:focus-visible .motion-left{animation:turnLeft 1.3s ease-in-out infinite}.tool:hover .motion-right,.tool:focus-visible .motion-right{animation:turnRight 1.3s ease-in-out infinite}.dynamic-tool{width:100%;border:1px solid #e4e5ef;border-radius:8px;background:#f6f5fa;display:flex;align-items:center;gap:12px;padding:14px 12px;text-align:left}.dynamic-tool>.tool-icon{color:#8b7aaa}.dynamic-tool>span:nth-child(2){display:flex;flex-direction:column;gap:5px}.dynamic-tool strong{font-size:11px;font-weight:550}.dynamic-tool small{font-size:9px;color:#9690a1}.dynamic-tool>svg{margin-left:auto;color:#a8a0b9}.dynamic-tool:hover .motion-spin,.dynamic-tool:focus-visible .motion-spin{animation:spin 2.5s linear infinite}.swatches{display:flex;gap:12px}.swatches button{border:3px solid white;outline:1px solid #e8e9e1;box-shadow:0 2px 4px #35452508;width:35px;height:35px;border-radius:50%;display:flex;align-items:center;justify-content:center}.swatches svg{opacity:0;color:#334234}.swatches button:hover svg,.swatches button:focus-visible svg{opacity:1}.toolbox-tip{margin-top:25px;display:flex;align-items:flex-start;gap:9px;padding-top:16px;border-top:1px solid #edf0e7;color:#93a07f}.toolbox-tip svg{flex-shrink:0;margin-top:2px}.toolbox-tip p{margin:0;font-size:10px;line-height:1.65;color:#929b8a}.toolbox-tip strong{font-weight:550;color:#78876b}.stage{min-height:485px;position:relative;background:#f0f2e9;border:1px solid #dde3d2;border-radius:13px;overflow:hidden}.stage>div:not(.stage-top):not(.stage-bottom):not(.stage-caption):not(.canvas-error):not(.canvas-loading){position:absolute!important;top:0;right:0;bottom:0;left:0}.stage-top{position:absolute;top:16px;left:20px;right:16px;display:flex;align-items:center;justify-content:space-between;z-index:2;pointer-events:none}.stage-top button{pointer-events:auto}.stage-label{display:flex;align-items:center;gap:7px;font-size:9px;letter-spacing:1.6px;color:#7b8b6e}.live-dot,.paused-dot{width:5px;height:5px;background:#92a85e;border-radius:50%}.live-dot{box-shadow:0 0 0 4px #a0b87916}.paused-dot{background:#a6a99e}.icon-button{display:inline-flex;justify-content:center;align-items:center;border:0;background:transparent;border-radius:6px;width:30px;height:30px;color:#7b8872}.icon-button:hover:not(:disabled){background:#e5eadb}.stage-top .icon-button{background:#fafcf280;border:1px solid #e0e5d7}.stage-caption{position:absolute;pointer-events:none;left:25px;top:62px;display:flex;flex-direction:column;gap:5px}.stage-caption>span{font-family:Manrope,sans-serif;font-size:17px;letter-spacing:-.5px;font-weight:600;color:#66745b}.stage-caption small{color:#93a084;font-size:10px}.stage-bottom{position:absolute;bottom:17px;left:22px;right:18px;display:flex;align-items:center;justify-content:space-between;pointer-events:none;gap:10px}.orbit-hint{display:flex;align-items:center;gap:6px;color:#8e9c7e;font-size:10px;white-space:nowrap}.playback{display:flex;align-items:center;background:#ffffffde;border:1px solid #e2e7d8;box-shadow:0 3px 12px #3a4e2110;border-radius:9px;padding:5px;pointer-events:auto}.playback button{border:0;background:transparent;width:30px;height:29px;display:flex;align-items:center;justify-content:center;border-radius:5px}.playback button:first-child{background:#edf3d9;color:#657c38}.playback select{border:0;background:transparent;color:#70815b;font-size:10px;padding:0 5px;cursor:pointer;outline-offset:0}.playback-divider{height:16px;width:1px;background:#e1e6d7;margin:0 6px}.sequence-panel{margin-top:18px;background:#fff;border:1px solid var(--line);border-radius:13px;overflow:hidden}.sequence-heading{display:flex;align-items:center;justify-content:space-between;padding:19px 22px 14px}.action-count{font-size:10px;color:#9aa18f;margin-left:3px;font-weight:400}.sequence-controls{display:flex;align-items:center;gap:5px}.sequence-controls>span:first-child{font-size:10px;color:#a0a795;margin-right:18px}.vertical-divider{height:18px;width:1px;background:#e5e8df;margin:0 7px}.clear-button{font-size:11px;color:#8b9582}.sequence-scroll{overflow-x:auto;scrollbar-width:thin;scrollbar-color:#dce4cc transparent;padding:10px 14px 19px}.sequence-track{display:flex;align-items:center;min-height:92px;width:max-content;min-width:100%}.action-tile{flex-shrink:0;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;position:relative;border:1px solid #e2e7d9;border-radius:9px;background:#f7f9f2;min-width:99px;height:90px;padding:12px 12px 10px;gap:5px}.action-tile>svg{color:#788b57}.action-tile strong{font-size:11px;font-weight:550;margin-top:3px}.action-tile small{font-size:9px;color:#9aa18f}.tile-number{position:absolute;top:10px;right:9px;font-size:8px;color:#b0b8a5;font-family:Manrope,sans-serif}.kind-spin{background:#f5f2f9;border-color:#e6dfef}.kind-spin>svg{color:#9b88b5}.kind-color{background:#fffaf2;border-color:#eee6d8}.action-tile.selected{border:1px solid #7b9450;box-shadow:0 0 0 2px #b0c78a40}.action-tile.selected.kind-spin{border-color:#9e88bc;box-shadow:0 0 0 2px #c9b4de40}.color-dot{display:inline-block;border-radius:50%;flex-shrink:0;border:1px solid #00000009}.insertion{flex-shrink:0;position:relative;display:flex;align-items:center;justify-content:center;width:22px;height:90px;border:0;background:transparent;color:#c0c9b4;padding:0}.insertion>span{width:11px;height:1px;background:#dce4d1}.insertion>svg{display:none}.insertion.active{width:27px}.insertion.active>span{height:90px;width:2px;background:#a4bc64;border-radius:4px}.insertion.active>svg{display:block;position:absolute;top:-9px;background:#a4bc64;color:#fff;border-radius:3px;width:16px;height:16px;padding:2px}.insertion:not(.active):hover>span{height:65px;width:2px;background:#b7c68e}.sequence-footer{min-height:49px;border-top:1px solid #eff1e9;background:#fcfdf9;display:flex;align-items:center;justify-content:space-between;padding:9px 22px;gap:10px}.sequence-footer>span:first-child{display:flex;align-items:center;gap:7px;font-size:10px;color:#889779}.footer-muted{color:#a2aa98}.keyboard-hint{font-size:9px;color:#a0aa96;display:flex;gap:5px;align-items:center}kbd{font:10px DM Sans,sans-serif;display:inline-flex;align-items:center;justify-content:center;min-width:17px;height:18px;border:1px solid #e0e6d7;border-bottom-width:2px;border-radius:4px;background:#fff;color:#9aa58c}.inspector{display:flex;align-items:center;gap:16px;width:100%;font-size:11px}.inspector-title{display:flex;align-items:center;gap:7px;font-weight:550;min-width:75px}.inspector label{display:flex;align-items:center;gap:6px;color:#8b967e;font-size:10px}.inspector input,.inspector select{border:1px solid #dfe6d3;border-radius:4px;background:#fff;font-size:11px;color:#5a6c47;padding:4px;width:67px}.inspector select{width:90px}.inspector input[type=color]{padding:1px;height:24px;width:32px}.delete-action{margin-left:auto;color:#9c7b70;font-size:10px}.page-footer{display:flex;justify-content:space-between;padding:21px 1px 23px;color:#a2aa98;font-size:10px}.page-footer>span{display:flex;align-items:center;gap:6px}.tiny-mark{font-size:18px;color:#9eaf77}.footer-dot{margin:0 3px;color:#c7cebc}.empty-sequence{font-size:13px;color:#97a28a;padding:25px}.toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%);border:1px solid #dce5cf;background:#2c3e30;color:#f4f9e8;border-radius:9px;box-shadow:0 8px 24px #1b2b2020;padding:14px 20px;display:flex;align-items:center;gap:9px;font-size:13px;z-index:50}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#25382f60;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);z-index:100;display:flex;align-items:center;justify-content:center;padding:20px}.help-modal{position:relative;max-width:470px;padding:40px;background:#fbfcf7;border:1px solid white;box-shadow:0 20px 80px #24332230;border-radius:18px}.help-modal h2{font-size:28px;letter-spacing:-1px;margin:15px 0 25px}.help-modal p{font-size:13px;line-height:1.75;color:#7b8872}.help-modal strong{color:#4f6243}.help-modal .save-button{margin-top:24px}.modal-close{position:absolute;right:15px;top:15px}.canvas-error,.canvas-loading{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;padding:70px;text-align:center;font-size:14px;color:#7f8e70}.canvas-loading{pointer-events:none}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.draw-tool{background:#f3f8ee;border-color:#dce9d3}.draw-tool>.tool-icon{color:#7a9455}.draw-tool small{color:#8c9d7c}.draw-tool:hover .motion-draw,.draw-tool:focus-visible .motion-draw{animation:inkMotion 1.7s ease-in-out infinite}.kind-draw{background:#edf6e7;border-color:#d8e7cd}.kind-draw>svg{color:#79964f}.draw-explanation{font-size:10px;color:#839473;line-height:1.5}.playback .clear-ink:first-child{background:transparent;color:#7d8e68}.playback .clear-ink+span+button{background:#edf3d9;color:#657c38}.help-modal{max-height:90vh;overflow-y:auto}@keyframes inkMotion{0%,to{transform:translate(-3px,2px) rotate(-8deg)}50%{transform:translate(4px,-2px) rotate(8deg)}}@keyframes extend{0%,to{transform:translateY(2px)}50%{transform:translateY(-5px)}}@keyframes turnLeft{0%,to{transform:rotate(0)}50%{transform:rotate(-40deg)}}@keyframes turnRight{0%,to{transform:rotate(0)}50%{transform:rotate(40deg)}}@keyframes spin{to{transform:rotate(360deg)}}@media(min-width:1500px){main{padding-top:45px}.stage{min-height:550px}.toolbox{padding-top:27px}.tool-grid{gap:9px}.tool{height:100px}.tool-group-label{margin-top:25px}.toolbox-tip{margin-top:30px}}@media(max-width:1050px){.topbar{padding:0 25px}.prototype-badge{display:none}main{padding:30px 25px 0}.workspace{grid-template-columns:255px minmax(0,1fr)}.toolbox{padding:19px 15px}.tool-grid{gap:5px}.tool{padding:8px 6px}.tool strong{font-size:9px}.orbit-hint{display:none}.stage-bottom{justify-content:flex-end}.sequence-controls>span:first-child{display:none}.footer-muted{display:none}.swatches{gap:9px}.stage{min-height:470px}}@media(max-width:720px){.topbar{height:66px;padding:0 18px}.brand{font-size:19px;gap:8px}.brand-studio{font-size:16px}.brand-mark{width:32px;height:32px;border-radius:9px}.header-actions{gap:4px}.help-button{font-size:0;gap:0;padding:8px}.save-button{padding:9px 11px;font-size:11px}.header-actions .save-button svg{display:none}main{padding:25px 16px 0}.intro{align-items:flex-start;margin-bottom:22px;gap:15px}.eyebrow{font-size:7px;letter-spacing:1.1px}h1{font-size:26px;letter-spacing:-1px}.intro p{font-size:11px;line-height:1.6;max-width:250px}.example-button{padding:9px;gap:3px;margin-top:23px}.example-button span{display:none}.workspace{display:flex;flex-direction:column;gap:12px}.stage{order:-1;min-height:360px}.stage-caption{left:20px;top:58px}.toolbox{padding:17px}.panel-subtitle{margin:8px 0 16px}.tool-grid{grid-template-columns:repeat(2,1fr);gap:6px}.tool{height:73px;padding:8px}.tool strong{font-size:9px;margin-top:5px}.tool-icon svg{width:20px}.tool-group-label{margin:15px 0 10px}.dynamic-tool{width:auto;display:inline-flex;min-width:220px;margin-right:15px;padding:10px}.toolbox-tip{display:none}.swatches{gap:15px}.swatches button{width:32px;height:32px}.sequence-panel{margin-top:12px}.sequence-heading{padding:16px 14px 10px}.sequence-heading h2{font-size:13px}.action-count{font-size:9px}.sequence-controls{gap:1px}.clear-button{font-size:0;gap:0}.clear-button svg{width:15px}.sequence-scroll{padding:10px 8px 17px}.sequence-footer{padding:9px 13px;flex-wrap:wrap}.keyboard-hint{display:none}.inspector{gap:8px;flex-wrap:wrap}.inspector-title{min-width:65px}.delete-action{font-size:0;gap:0}.inspector label{font-size:9px}.inspector input{width:50px}.page-footer{font-size:9px;gap:20px;line-height:1.5}.page-footer>span:last-child{font-size:8px;display:block;text-align:right}.help-modal{padding:30px}.toast{width:max-content;max-width:90vw;font-size:11px}.stage-bottom{bottom:13px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;scroll-behavior:auto!important;transition:none!important}}.object-tool{background:#faf5ec;border-color:#ece1cf}.object-tool>.tool-icon{color:#aa8a59}.object-tool small{color:#a59780}.kind-object{background:#fbf6ed;border-color:#e9ddc7}.object-modal{position:relative;max-width:590px;max-height:90vh;overflow-y:auto;background:#fbfcf7;border:1px solid white;border-radius:18px;padding:34px;box-shadow:0 20px 80px #24332230}.object-modal h2{font-size:25px;letter-spacing:-.8px}.object-modal>p{font-size:12px;color:#87927c;line-height:1.6}.object-library{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:23px 0 20px}.object-library button{display:flex;flex-direction:column;align-items:center;gap:9px;background:#fff;border:1px solid #e2e6d9;border-radius:10px;padding:17px 8px 12px;min-width:105px}.object-library button:hover{border-color:#9eaf79;box-shadow:0 3px 10px #40562b12;transform:translateY(-2px)}.object-library strong{font-size:12px;font-weight:600}.object-library span{font-size:8px;color:#929a87;display:flex;align-items:center;gap:4px}.object-library i{width:6px;height:6px;border-radius:50%}.object-modal>small{font-size:10px;line-height:1.7;color:#8a957f;display:block}.object-color-rule{font-size:9px;color:#9c9e8d}.inspector{flex-wrap:wrap}.inspector .model-select{width:80px}.inspector label select[aria-label="Object orientation axis"]{width:40px}@media(max-width:720px){.object-library{grid-template-columns:repeat(3,1fr);gap:7px}.object-library button{min-width:0;padding:12px 5px}.object-modal{padding:27px 20px}.object-library span{font-size:7px}.object-color-rule{display:none}}.inspector label.auto-heading-toggle{display:flex;align-items:center;gap:7px;color:#7d9265;cursor:pointer}.inspector .auto-heading-toggle input{width:15px;height:15px;margin:0;padding:0;accent-color:#7d9265;cursor:pointer}.move-tool,.kind-move{background:#eef5f8;border-color:#d5e4ec}.move-tool .tool-icon,.kind-move>svg{color:#668ca2}.inspector select[aria-label="Extension type"]{width:106px}.sequence-controls .icon-button,.sequence-controls .clear-button{min-width:44px;height:44px;touch-action:manipulation}@media(max-width:720px){.sequence-heading{flex-direction:column;align-items:stretch;gap:9px}.sequence-controls{justify-content:flex-end;gap:2px}.sequence-controls .vertical-divider{margin:0 3px}.sequence-controls .clear-button{justify-content:center;padding:0}.sequence-controls .icon-button{width:44px}}.drawing-mode{display:flex;gap:2px;pointer-events:auto;background:#fafcf2e8;border:1px solid #dce4d1;border-radius:8px;padding:3px}.drawing-mode button{border:0;border-radius:5px;background:transparent;padding:8px 12px;color:#7b8b6e;font-size:11px;min-width:62px}.drawing-mode button[aria-pressed=true]{background:#ddec8f;color:#35483e;font-weight:600;box-shadow:0 1px 3px #35483e12}@media(max-width:720px){.drawing-mode{padding:2px}.drawing-mode button{min-height:40px;min-width:60px;padding:6px 9px}.stage-caption{top:70px}}.motion-library{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:22px 0}.motion-library button{display:flex;align-items:center;gap:13px;background:#f7f5fb;border:1px solid #e5deee;border-radius:9px;padding:18px 15px;text-align:left;min-height:78px}.motion-library button:hover{border-color:#ab92c4;box-shadow:0 3px 10px #51426412}.motion-library strong{font-size:12px;font-weight:550}.motion-library .tool-icon{color:#8c73a5;flex-shrink:0}.motion-type{display:flex;align-items:center;gap:4px;font-size:9px;color:#9b8aaa;margin-left:auto}.motion-modal{width:590px}.continuous-preview.preview-bounce{animation:continuousBounce .9s ease-in-out infinite alternate}.continuous-preview.preview-clockwise{animation:spin 4s linear infinite}.continuous-preview.preview-counterclockwise{animation:spin 4s linear infinite reverse}.continuous-action{border-style:dashed}.continuous-action .tile-number{right:25px}.motion-badge{position:absolute;right:9px;top:11px;color:#9c86b2;display:flex}.inspector label.continuous-toggle{display:flex;align-items:center;gap:7px;cursor:pointer;color:#8c73a5}.inspector .continuous-toggle input{width:15px;height:15px;padding:0;margin:0;accent-color:#8c73a5;cursor:pointer}.motion-explanation{font-size:9px;color:#9b8aaa}@keyframes continuousBounce{0%{transform:translateY(-5px)}to{transform:translateY(5px)}}@media(max-width:720px){.motion-library{gap:7px}.motion-library button{padding:14px 9px;gap:7px;flex-wrap:wrap}.motion-library strong{font-size:11px}.motion-type{font-size:8px}.motion-explanation{flex-basis:100%}}.feedback-button{display:flex;align-items:center;gap:7px;min-height:44px}.feedback-modal{width:500px;max-width:100%}.feedback-modal form{display:flex;flex-direction:column;gap:10px;margin-top:22px}.feedback-modal fieldset{border:0;padding:0;margin:0 0 10px}.feedback-modal legend,.feedback-modal label{font-size:12px;color:#425346;font-weight:600}.feedback-modal legend span,.feedback-modal label span{color:#89927e;font-weight:400}.feedback-ratings{display:flex;gap:9px;margin-top:12px}.feedback-ratings button{display:flex;align-items:center;justify-content:center;gap:9px;min-height:44px;flex:1;border:1px solid #dce3d1;border-radius:8px;background:#fff;color:#65775c;font-size:12px}.feedback-ratings button[aria-pressed=true]{background:#edf4d6;border-color:#98ad65;color:#35483e}.feedback-modal textarea,.feedback-modal input{width:100%;border:1px solid #dce3d1;border-radius:8px;background:#fff;padding:12px;color:#35483e;font:inherit;font-size:13px}.feedback-modal textarea{resize:vertical;min-height:120px}.feedback-note,.feedback-status{font-size:11px;line-height:1.6;color:#7b886d}.feedback-modal .save-button{min-height:44px;align-self:flex-start}.feedback-modal .save-button:disabled{opacity:.5;cursor:not-allowed}@media(max-width:720px){.topbar{flex-wrap:wrap;gap:10px}.header-actions{flex-wrap:wrap;justify-content:flex-end}.feedback-button{font-size:11px}.feedback-modal{padding:27px 20px}.feedback-ratings button{font-size:11px}}.about-modal{width:560px;max-width:calc(100vw - 32px);max-height:calc(100dvh - 40px);margin:auto;color:var(--text,#29372f);padding:38px;overscroll-behavior:contain}.about-modal::backdrop{background:#25382f60;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.about-modal h2{margin:10px 0 14px}.about-modal .eyebrow{padding-right:12px;line-height:1.7}.about-modal .about-intro{margin-bottom:24px}.about-tabs{display:flex;gap:6px;padding-bottom:12px;border-bottom:1px solid var(--line);margin-bottom:24px}.about-tabs button{border:1px solid transparent;border-radius:8px;background:transparent;padding:10px 13px;min-height:44px;font-size:12px;color:#738267;white-space:nowrap}.about-tabs button[aria-selected=true]{background:#edf3d9;border-color:#d7e5aa;color:#425635;font-weight:600}.about-modal h3{font-family:Manrope,sans-serif;font-size:18px;letter-spacing:-.5px;margin:0 0 14px}.about-modal .about-callout{background:#eef4df;border-left:3px solid #a4bc64;border-radius:0 8px 8px 0;padding:16px 18px;margin:22px 0}.about-credits{margin:0 0 24px}.about-credits>div{padding:12px 0;border-bottom:1px solid var(--line)}.about-credits dt{font-size:11px;color:#7b8872;margin-bottom:6px}.about-credits dd{margin:0;font-size:15px;font-weight:600;color:#4f6243}.about-modal .modal-close{width:44px;height:44px;right:8px;top:8px}@media(max-width:720px){.about-modal{padding:30px 22px;max-height:calc(100dvh - 24px)}.about-modal .eyebrow{padding-right:24px}.about-modal h2{font-size:26px}.about-tabs{gap:2px}.about-tabs button{flex:1;padding:10px 7px;font-size:11px}.help-button{min-width:44px;min-height:44px}}.feedback-fields{display:flex;flex-direction:column;gap:10px}.feedback-honeypot{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}.feedback-error{font-size:12px;line-height:1.6;color:#a33d32}.feedback-success{padding-top:24px;color:#607a49}.feedback-success h3{color:#35483e}.feedback-success p{font-size:13px;line-height:1.6;margin:14px 0 22px}.feedback-fields:disabled{opacity:.7}.theme-toggle{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:9px 12px;border:1px solid var(--line);border-radius:8px;background:transparent;font-size:12px;white-space:nowrap}:root[data-theme=light]{color-scheme:light}:root[data-theme=dark]{color-scheme:dark;color:#e7edf4;background:#0c1117;--text:#e7edf4;--muted:#a1b0be;--line:#2b3947;--green:#c6ff00;--panel:#141d26;--raised:#1b2733;--accent:#c6ff00}[data-theme=dark] .topbar{background:#101820}[data-theme=dark] .brand-mark,[data-theme=dark] .save-button{background:var(--accent);border-color:var(--accent);color:#142000}[data-theme=dark] h1>span,[data-theme=dark] .tiny-mark{color:var(--accent)}[data-theme=dark] .brand-studio,[data-theme=dark] .eyebrow,[data-theme=dark] .tool-group-label,[data-theme=dark] .stage-label{color:#a9b9c9}[data-theme=dark] .prototype-badge,[data-theme=dark] .step{background:#1e2b24;border-color:#3b4e34;color:#c2df92}[data-theme=dark] .prototype-badge span,[data-theme=dark] .live-dot{background:var(--accent);box-shadow:0 0 12px #c6ff0060}[data-theme=dark] .toolbox,[data-theme=dark] .sequence-panel,[data-theme=dark] .example-menu,[data-theme=dark] .object-modal,[data-theme=dark] .help-modal{background:var(--panel);border-color:var(--line);box-shadow:0 12px 40px #00000018}[data-theme=dark] .example-button,[data-theme=dark] .example-menu button,[data-theme=dark] .tool,[data-theme=dark] .action-tile,[data-theme=dark] .object-library button,[data-theme=dark] .feedback-ratings button{background:var(--raised);border-color:#344555;color:#e7edf4}[data-theme=dark] .example-button>svg:first-child,[data-theme=dark] .tool-icon,[data-theme=dark] .action-tile>svg{color:#c2db95}[data-theme=dark] .primary-tool,[data-theme=dark] .draw-tool,[data-theme=dark] .kind-draw{background:#202e21;border-color:#405337}[data-theme=dark] .primary-tool .tool-icon,[data-theme=dark] .draw-tool .tool-icon,[data-theme=dark] .kind-draw>svg{color:var(--accent)}[data-theme=dark] .move-tool,[data-theme=dark] .kind-move{background:#172d36;border-color:#315364}[data-theme=dark] .move-tool .tool-icon,[data-theme=dark] .kind-move>svg{color:#56d9ff}[data-theme=dark] .dynamic-tool,[data-theme=dark] .kind-spin,[data-theme=dark] .motion-library button{background:#282137;border-color:#4d3b65}[data-theme=dark] .dynamic-tool>.tool-icon,[data-theme=dark] .kind-spin>svg,[data-theme=dark] .motion-library .tool-icon,[data-theme=dark] .motion-badge{color:#bd9bff}[data-theme=dark] .object-tool,[data-theme=dark] .kind-object,[data-theme=dark] .kind-color{background:#30291f;border-color:#574831}[data-theme=dark] .object-tool>.tool-icon{color:#ffbd70}[data-theme=dark] .dynamic-tool small,[data-theme=dark] .dynamic-tool>svg,[data-theme=dark] .tool-plus,[data-theme=dark] .action-tile small,[data-theme=dark] .tile-number,[data-theme=dark] .action-count,[data-theme=dark] .sequence-controls>span:first-child,[data-theme=dark] .toolbox-tip p,[data-theme=dark] .object-library span,[data-theme=dark] .object-modal>p,[data-theme=dark] .object-modal>small,[data-theme=dark] .object-color-rule,[data-theme=dark] .motion-type,[data-theme=dark] .motion-explanation,[data-theme=dark] .draw-explanation{color:#a8b6c5}[data-theme=dark] .toolbox-tip{border-color:var(--line);color:#9db788}[data-theme=dark] .toolbox-tip strong{color:#cfdfc2}[data-theme=dark] .swatches button{border-color:var(--panel);outline-color:#425565;box-shadow:0 0 15px -5px currentColor}[data-theme=dark] .swatches svg{color:#101820}[data-theme=dark] .swatches button:hover,[data-theme=dark] .swatches button:focus-visible{box-shadow:0 0 20px -3px currentColor;transform:translateY(-2px)}[data-theme=dark] .stage{background:#101820;border-color:#344555}[data-theme=dark] .stage-caption>span{color:#d2dfeb}[data-theme=dark] .stage-caption small,[data-theme=dark] .orbit-hint,[data-theme=dark] .canvas-error,[data-theme=dark] .canvas-loading{color:#a7b8c7}[data-theme=dark] .stage-top .icon-button,[data-theme=dark] .drawing-mode,[data-theme=dark] .playback{background:#192530ed;border-color:#3a4c5c}[data-theme=dark] .icon-button,[data-theme=dark] .clear-button,[data-theme=dark] .drawing-mode button,[data-theme=dark] .playback select,[data-theme=dark] .playback .clear-ink:first-child{color:#b7c7d6}[data-theme=dark] .drawing-mode button[aria-pressed=true],[data-theme=dark] .playback .clear-ink+span+button{background:#c6ff00;color:#142000}[data-theme=dark] .playback-divider,[data-theme=dark] .vertical-divider,[data-theme=dark] .insertion>span{background:#3c4f60}[data-theme=dark] .insertion.active>span,[data-theme=dark] .insertion.active>svg{background:var(--accent);color:#142000}[data-theme=dark] .sequence-footer{background:#111a23;border-color:var(--line)}[data-theme=dark] .sequence-footer>span:first-child,[data-theme=dark] .footer-muted,[data-theme=dark] .keyboard-hint,[data-theme=dark] .inspector label,[data-theme=dark] .page-footer,[data-theme=dark] .empty-sequence{color:#a1b0be}[data-theme=dark] kbd,[data-theme=dark] .inspector input,[data-theme=dark] .inspector select,[data-theme=dark] .feedback-modal textarea,[data-theme=dark] .feedback-modal input{background:#0f1821;border-color:#405364;color:#e7edf4}[data-theme=dark] .inspector input[type=checkbox]{accent-color:var(--accent)}[data-theme=dark] .action-tile.selected{border-color:var(--accent);box-shadow:0 0 0 2px #c6ff0030}[data-theme=dark] .action-tile.selected.kind-spin{border-color:#b388ff;box-shadow:0 0 0 2px #b388ff30}[data-theme=dark] .delete-action{color:#ffad9e}[data-theme=dark] .help-modal p,[data-theme=dark] .about-credits dt,[data-theme=dark] .feedback-note,[data-theme=dark] .feedback-status,[data-theme=dark] .feedback-modal label span,[data-theme=dark] .feedback-modal legend span{color:#adbdcc}[data-theme=dark] .help-modal strong,[data-theme=dark] .about-credits dd,[data-theme=dark] .feedback-modal legend,[data-theme=dark] .feedback-modal label,[data-theme=dark] .feedback-success h3{color:#e0ebd6}[data-theme=dark] .about-tabs button{color:#adbdcc}[data-theme=dark] .about-tabs button[aria-selected=true],[data-theme=dark] .feedback-ratings button[aria-pressed=true]{background:#283b20;border-color:#6e8e44;color:#d5ff9d}[data-theme=dark] .about-modal .about-callout{background:#223020;border-color:var(--accent)}[data-theme=dark] .feedback-error{color:#ffad9e}[data-theme=dark] .feedback-success{color:#bce48d}[data-theme=dark] .modal-backdrop,[data-theme=dark] .about-modal::backdrop{background:#02070caa}[data-theme=dark] .toast{background:#24351d;border-color:#6d8d3b;color:#e3ffc4}[data-theme=dark] .icon-button:hover:not(:disabled),[data-theme=dark] .example-menu button:hover{background:#2b3c4b}[data-theme=dark] button:focus-visible,[data-theme=dark] a:focus-visible,[data-theme=dark] input:focus-visible,[data-theme=dark] select:focus-visible,[data-theme=dark] textarea:focus-visible{outline:3px solid #c6ff00;outline-offset:3px}[data-theme=dark] .tool:hover,[data-theme=dark] .object-library button:hover{border-color:#92ba4a}@media(max-width:1050px){.header-actions{gap:10px}.theme-toggle span{display:none}.theme-toggle{width:44px;padding:8px}}@media(max-width:720px){.topbar{height:auto;min-height:66px;padding-top:10px;padding-bottom:10px}.header-actions{gap:4px}.feedback-button span{display:none}.feedback-button{justify-content:center;width:36px}.theme-toggle{width:36px}.brand-studio{font-size:14px}}.inspector .numeric-field{display:flex;align-items:center;gap:8px;max-width:100%}.inspector .numeric-field>label{font-size:12px}.numeric-stepper{display:flex;align-items:stretch;gap:4px}.inspector .numeric-stepper input{width:76px;min-height:44px;font-size:16px;text-align:center;padding:8px;border-radius:7px}.numeric-stepper button{display:flex;align-items:center;justify-content:center;width:44px;min-height:44px;padding:0;border:1px solid #dfe6d3;border-radius:7px;background:#f1f5e7;color:#5a6c47;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}.numeric-stepper button:active{background:#ddec8f}[data-theme=dark] .numeric-stepper button{background:#192733;border-color:#405364;color:#e7edf4}[data-theme=dark] .numeric-stepper button:active{background:#354b23;color:#c6ff00}@media(max-width:720px){.inspector{gap:12px}.inspector .numeric-field{flex-wrap:wrap}.inspector .numeric-field>label{min-width:64px}}
