.appearance-controls{flex-wrap:wrap;align-items:center;gap:14px;display:flex}.theme-picker{color:inherit;flex-shrink:0;align-items:center;gap:4px;font:13px Arial,sans-serif;display:inline-flex;margin:0!important}.theme-picker>span{font-size:19px}.theme-picker select{width:auto;max-width:155px;min-height:44px;font:inherit;color:inherit;cursor:pointer;background:0 0;border:1px solid #92998970;border-radius:7px;padding:8px}.theme-picker option{color:#22271e;background:#fff}.theme-picker select:focus-visible{outline-offset:2px;outline:3px solid #789a36}.auth-preferences{margin-bottom:34px}.auth-mobile-logo{display:none}body[data-page=not-found] .appearance-controls{margin-top:28px}.site-header{gap:20px}html[data-theme=dark]{--surface:#171c18;--panel:#202720;--raised:#2b342b;--ink:#eef2e9;--muted:#afb9a7;--line:#3d483b;--dark:#c8f65d;color:var(--ink);background:var(--surface);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}html[data-theme=light]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}html[data-theme=dark] body{background:var(--surface);color:var(--ink)}html[data-theme=dark] :is(.frameflow-logo,.frameflow-logo .studio-label){color:var(--ink)}html[data-theme=dark] .frameflow-logo .studio-label{background:var(--raised)}html[data-theme=dark] .frameflow-logo .brand-icon{background:#293425;box-shadow:inset 0 0 0 1px #47533c}html[data-theme=dark] :is(.language-picker,.theme-picker) option{background:var(--panel);color:var(--ink)}html[data-theme=dark] :is(.language-picker,.theme-picker) select{color:var(--ink);background:0 0;border-color:#64715b}html[data-theme=dark] :is(button,a,select,input,textarea,summary):focus-visible{outline-offset:3px;outline:3px solid #c8f65d}html[data-theme=dark] .button{background:var(--raised);color:var(--ink);border-color:#64715b}html[data-theme=dark] .button:hover{background:#3a4636;border-color:#a0b38a}html[data-theme=dark] :is(.button.primary,.button.accent,.button.dark){color:#20271b;background:#c8f65d;border-color:#c8f65d}html[data-theme=dark] :is(.button.primary,.button.accent,.button.dark):hover{background:#d7ff7b}html[data-theme=dark] :is(.hero-art,.feature-wide,.workflow,.closing){background:var(--panel);border-color:var(--line)}html[data-theme=dark] .hero h1>span:after{background:#506b28}html[data-theme=dark] :is(.art-toolbar,.art-footer,.site-footer small,.steps li>span,.history-demo>span:last-child){color:var(--muted)}html[data-theme=dark] :is(.floating-note,.history-demo>span){background:var(--raised);border-color:var(--line)}html[data-theme=dark] .floating-note>span{color:#c8f65d;background:#3a4a2a}html[data-theme=dark] :is(.sample-one,.sample-two,.swatches,.mini-series span:not(:last-child)){color:#253427}html[data-theme=dark] .export-card{color:#eef2e9;background:#263323}html[data-theme=dark] .demo-selection em{color:#c8f65d}html[data-theme=dark] .closing-asterisk{color:#3b4c2b}html[data-theme=dark] .steps li{border-color:var(--line)}html[data-theme=dark] :is(.site-header nav a:hover){color:#c8f65d}html[data-theme=dark] .skip{color:#20271b;background:#c8f65d}html[data-theme=dark] body[data-page=not-found] p{color:var(--muted)}html[data-theme=dark] :is(.welcome,.dashboard,.loading-screen,.app-shell){background:var(--surface)}html[data-theme=dark] :is(.welcome-copy,.project-card,.drawer,.drawer-head){background:var(--panel)}html[data-theme=dark] :is(.welcome-copy p,.auth-card p,.auth-divider,.dashboard-intro p,.project-card-bottom small,.local-card p,.muted,.drawer p,.history-item small){color:var(--muted)}html[data-theme=dark] :is(.auth-links button,.project-card-bottom button){color:#c8f65d}html[data-theme=dark] .project-filters button{background:var(--raised);color:var(--ink)}html[data-theme=dark] .project-filters .selected{color:#20271b;background:#c8f65d}html[data-theme=dark] .drawer-head button{color:var(--ink)}html[data-theme=dark] .asset-tile{background:var(--raised)}html[data-theme=dark] .error-message{color:#ffb3a7!important}html[data-theme=dark] .error-banner{color:#ffceba;background:#442a23}html[data-theme=dark] .error-banner button{color:#ffe5da;background:#59392e;border-color:#996451}html[data-theme=dark] :is(.topbar,.left-panel,.right-panel,.inspector-head,.mobile-editor-nav,.left-panel .inspector-tabs){background:var(--panel)}html[data-theme=dark] :is(.field,.range-head,.eyebrow,.slide-row,.section-head span,.dimension-chip small,.slide-index,.quick-add small,.canvas-label small,.canvas-number,.add-canvas small,.workspace-topline span,.mobile-screen-switcher span,.workspace-footer span,.range-head em,.back-to-design,.language-switch>span){color:var(--muted)}html[data-theme=dark] :is(.subhead,.project-name,.quick-add>button,.layer-main>span:last-child){color:var(--ink)}html[data-theme=dark] :is(select,input:not([type=range]):not([type=color]):not([type=checkbox]),textarea){background:var(--surface);color:var(--ink);border-color:#56634f}html[data-theme=dark] :is(input,textarea)::placeholder{color:#a4af9a;opacity:1}html[data-theme=dark] .project-name-input:focus{background:var(--surface)!important}html[data-theme=dark] :is(.segmented,.dimension-chip){background:var(--surface)}html[data-theme=dark] :is(.segmented button,.layer-row>button,.inspector-head button){color:var(--muted)}html[data-theme=dark] :is(.segmented button.active,.slide-row.active,.layer-row.active){color:var(--ink);background:#394632;border-color:#647956}html[data-theme=dark] :is(.slide-row:hover,.quick-add>button:hover,.layer-row:hover,.layer-row>button:hover:not(:disabled)){background:var(--raised);color:var(--ink)}html[data-theme=dark] :is(.quick-add>button>span,.layer-type,.range-head label,.range-control button,.color-input,.zoom-tools button,.zoom-tools select,.workspace-tools>button:not(.button),.workspace-footer kbd,.compact-actions button,.inspector-tabs button,.mobile-editor-nav button,.mobile-screen-switcher button,.history-item button){background:var(--raised);color:var(--ink);border-color:#56634f}html[data-theme=dark] :is(.mobile-editor-nav button[aria-pressed=true],.inspector-tabs button.selected,.zoom-tools button[aria-pressed=true]){color:#20271b;background:#c8f65d;border-color:#c8f65d}html[data-theme=dark] .workspace{background-color:#131813;background-image:radial-gradient(#394333 .8px,#0000 .8px)}html[data-theme=dark] :is(.workspace-topline,.workspace-footer){border-color:var(--line);background:#202720ed}html[data-theme=dark] .canvas-card:hover{background:#2b342b99}html[data-theme=dark] .canvas-card.active{background:var(--raised);border-color:#759355;box-shadow:0 15px 38px #0004}html[data-theme=dark] .canvas-scroll{scrollbar-color:#56634f transparent}html[data-theme=dark] .add-canvas{color:var(--muted);background:#202720b3;border-color:#56634f}html[data-theme=dark] .add-canvas:hover,html[data-theme=dark] .add-canvas span{background:var(--raised)}html[data-theme=dark] input[type=range]{accent-color:#c8f65d}html[data-theme=dark] input[type=checkbox]{background:#64715b}html[data-theme=dark] input[type=checkbox]:checked{background:#c8f65d}html[data-theme=dark] input[type=checkbox]:after{background:#171c18}html[data-theme=dark] .tip{color:#d0dfba;background:#303e23}html[data-theme=dark] .back-to-design:hover{color:#c8f65d}html[data-theme=dark] .toast{background:#2b342b;border:1px solid #64715b}html[data-theme=dark] .drawer-backdrop{background:#050b0799}html[data-theme=dark] :is(.analytics-settings,.analytics-choice){background:var(--panel);color:var(--ink);border-color:#56634f;box-shadow:0 8px 40px #0004}html[data-theme=dark] .analytics-choice h2{color:var(--ink)}html[data-theme=dark] .analytics-choice p{color:var(--muted)}html[data-theme=dark] .analytics-choice a{color:#c8f65d}html[data-theme=dark] .analytics-actions button{background:var(--raised);color:var(--ink);border-color:#64715b}html[data-theme=dark] #analytics-preferences :is(button,a):focus-visible{outline-color:#c8f65d}@media (width<=900px){.auth-mobile-logo{margin-bottom:28px;display:block}.auth-preferences{gap:12px}.theme-picker select{font-size:16px}.project-actions .theme-picker select{flex:1;max-width:none}}@media (width<=600px){.site-header .appearance-controls{order:3;gap:14px;width:100%}.site-header .appearance-controls .language-picker{margin-inline-start:0!important}.site-header>.button{order:2}.site-header nav{order:4}.dashboard-header{flex-wrap:wrap}.dashboard-header>div{width:100%}}@media (width<=1100px){html .site-header.wrap{flex-wrap:wrap;height:auto;min-height:104px;padding-block:18px}}@media (width<=600px){html .site-header>.button{order:2}html .site-header>.appearance-controls{order:3}}@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-border-style:solid;--tw-font-weight:initial}}}@layer theme{:root,:host{--spacing:.25rem;--font-weight-semibold:600;--radius-lg:.5rem;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1)}}@layer base,components;@layer utilities{.visible{visibility:visible}.fixed{position:fixed}.static{position:static}.container{width:100%}@media (width>=40rem){.container{max-width:40rem}}@media (width>=48rem){.container{max-width:48rem}}@media (width>=64rem){.container{max-width:64rem}}@media (width>=80rem){.container{max-width:80rem}}@media (width>=96rem){.container{max-width:96rem}}.block{display:block}.contents{display:contents}.hidden{display:none}.inline{display:inline}.shrink{flex-shrink:1}.transform{transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}.resize{resize:both}.rounded{border-radius:.25rem}.shadow{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.ring{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.blur{--tw-blur:blur(8px);filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}}:root{--ui-surface:#fff;--ui-soft:#f0f2ea;--ui-hover:#e9eedf;--ui-text:#283225;--ui-muted:#697460;--ui-border:#d8ded0;--ui-selected:#e9f2d9;--ui-focus:#73913d;--ui-primary:#273b31;--ui-primary-text:#fff;--ui-shadow:0 1px 2px #24301e0a, inset 0 1px 0 #fff5}html[data-theme=dark]{--ui-surface:#252e25;--ui-soft:#1b231c;--ui-hover:#34422f;--ui-text:#eef2e9;--ui-muted:#afbea3;--ui-border:#46533f;--ui-selected:#34472a;--ui-focus:#c8f65d;--ui-primary:#c8f65d;--ui-primary-text:#20271b;--ui-shadow:0 1px 2px #0002, inset 0 1px 0 #ffffff08}.ui-icon{vertical-align:middle;flex-shrink:0;display:inline-block}html[data-theme] .button{justify-content:center;align-items:center;gap:calc(var(--spacing) * 2);border-radius:var(--radius-lg);border-style:var(--tw-border-style);--tw-border-style:solid;border-style:solid;border-width:1px;border-color:var(--ui-border);background-color:var(--ui-surface);--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold);color:var(--ui-text);transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration));letter-spacing:-.01em;height:auto;min-height:38px;box-shadow:var(--ui-shadow);padding:9px 13px;font-size:12px;line-height:1.25;text-decoration:none;display:inline-flex;transform:none}html[data-theme] .button:hover:not(:disabled){background-color:var(--ui-hover);border-color:var(--ui-focus);transform:none}html[data-theme] .button:is(.primary,.dark){background:var(--ui-primary);color:var(--ui-primary-text);border-color:var(--ui-primary)}html[data-theme] .button:is(.primary,.dark):hover:not(:disabled){background:var(--ui-primary)}@supports (color:color-mix(in lab, red, red)){html[data-theme] .button:is(.primary,.dark):hover:not(:disabled){background:color-mix(in srgb, var(--ui-primary), var(--ui-text) 12%)}}html[data-theme] .button:is(.primary,.dark):hover:not(:disabled){border-color:var(--ui-primary)}html[data-theme] .button.accent{color:#26321c;background:#c8f65d;border-color:#b7df61}html[data-theme] .button.accent:hover:not(:disabled){background:#d4fb7d}html[data-theme] :is(button,a.button,select,input,textarea,summary):focus-visible{outline:2px solid var(--ui-focus);outline-offset:3px}html[data-theme] button:disabled{opacity:.4;cursor:not-allowed;box-shadow:none}html[data-theme] .button.full{width:100%}html[data-theme] .site-header .button{min-height:42px;padding:11px 16px;font-size:12px}html[data-theme] :is(.hero-actions,.closing) .button{min-height:50px;padding:15px 22px;font-size:14px}html[data-theme] .text-link{align-items:center;gap:9px;display:inline-flex}html[data-theme] :is(.theme-picker,.language-picker){font:inherit;align-items:center;gap:0;display:inline-flex;position:relative}html[data-theme] :is(.theme-picker,.language-picker)>.ui-icon{pointer-events:none;color:var(--ui-muted);position:absolute;inset-inline-start:11px}html[data-theme] :is(.theme-picker,.language-picker) select{border:1px solid var(--ui-border);background:var(--ui-surface);min-height:38px;color:var(--ui-text);border-radius:8px;max-width:155px;padding:8px 22px 8px 34px;padding-inline:34px 22px;font-size:12px}html[data-theme] .appearance-controls{gap:8px}html[data-theme] .project-toolbar{background:#253327;gap:10px;padding:7px 14px}html[data-theme] .project-toolbar button{color:#e1e8d7;border-color:#0000;border-radius:7px;justify-content:center;align-items:center;gap:6px;min-height:32px;padding:6px 9px;font-weight:550;transition:background-color .15s,border-color .15s}html[data-theme] .project-toolbar button:not(.project-menu-toggle):not(.mobile-only){display:inline-flex}html[data-theme] .project-toolbar button:hover:not(:disabled){background:#ffffff12;border-color:#ffffff20}html[data-theme] .history-buttons{border-inline-start:1px solid #ffffff24;gap:2px;padding-inline-start:8px}html[data-theme] .project-toolbar .save-state{font-size:10px}html[data-theme] .project-toolbar :is(.theme-picker,.language-picker) select{color:#e1e8d7;background:#ffffff08;border-color:#ffffff25;max-width:135px;min-height:32px;font-size:11px}html[data-theme] .project-toolbar :is(.theme-picker,.language-picker)>.ui-icon{color:#bdd0ac;width:14px}html[data-theme] .project-actions{align-items:center;gap:3px}html[data-theme] .topbar{min-height:70px}html[data-theme] .project-name-input{border-radius:8px}html[data-theme] :is(.field,.auth-card,.drawer,.new-project) :where(input:not([type=checkbox]):not([type=range]):not([type=color]):not([type=file]),select,textarea){border:1px solid var(--ui-border);background:var(--ui-surface);color:var(--ui-text);border-radius:8px;min-height:36px;padding:9px 11px;box-shadow:0 1px 2px #24301e05}html[data-theme] :is(.field,.auth-card,.drawer,.new-project) :is(input,select,textarea):focus{border-color:var(--ui-focus)}html[data-theme] .field{color:var(--ui-muted);gap:7px;font-size:11px}html[data-theme] .eyebrow{letter-spacing:.09em;font-size:10px}html[data-theme] .inspector-head{height:66px}html[data-theme] .inspector-head h2{font-size:16px}html[data-theme] .inspector-tabs{gap:3px;padding:10px 12px}html[data-theme] .inspector-tabs button{color:var(--ui-muted);background:0 0;border:1px solid #0000;border-radius:7px;justify-content:center;align-items:center;gap:5px;padding:8px;font-size:11px;display:inline-flex}html[data-theme] .inspector-tabs button:hover{background:var(--ui-hover);color:var(--ui-text)}html[data-theme] .inspector-tabs button:is(.selected,[aria-pressed=true]){background:var(--ui-selected);border-color:var(--ui-border);color:var(--ui-text);box-shadow:var(--ui-shadow)}html[data-theme] .segmented{border:1px solid var(--ui-border);background:var(--ui-soft);border-radius:9px;gap:3px;padding:3px}html[data-theme] .segmented button{color:var(--ui-muted);border-radius:6px;justify-content:center;align-items:center;gap:6px;min-height:29px;display:inline-flex}html[data-theme] .segmented button.active{background:var(--ui-surface);color:var(--ui-text);box-shadow:0 1px 3px #14221118}html[data-theme] .dimension-chip{border:1px dashed var(--ui-border);background:0 0;border-radius:8px;padding:9px}html[data-theme] .compact-actions button,html[data-theme] .back-to-design{color:var(--ui-muted);border-color:var(--ui-border);background:var(--ui-surface);border-radius:7px;justify-content:center;align-items:center;gap:5px;display:inline-flex}html[data-theme] .quick-add>button{border-radius:9px;padding:9px 5px}html[data-theme] .quick-add>button>span{background:var(--ui-soft);color:var(--ui-text);border-color:var(--ui-border);border-radius:9px}html[data-theme] .slide-row.active,html[data-theme] .layer-row.active{border-color:var(--ui-focus)}@supports (color:color-mix(in lab, red, red)){html[data-theme] .slide-row.active,html[data-theme] .layer-row.active{border-color:color-mix(in srgb, var(--ui-focus), transparent 45%)}}html[data-theme] .slide-row.active,html[data-theme] .layer-row.active{background:var(--ui-selected)}html[data-theme] .slide-row-main{min-height:44px}html[data-theme] .slide-row-delete{opacity:.65;transform:none}html[data-theme] .slide-row-delete:disabled{opacity:.2}html[data-theme] .layer-row{grid-template-columns:minmax(0,1fr) repeat(4,25px)}html[data-theme] .layer-main{grid-template-columns:24px minmax(0,1fr);padding-inline:6px!important}html[data-theme] .layer-main>.ui-icon{display:none}html[data-theme] .layer-main>span:last-child{max-width:none}html[data-theme] .layer-row>button{height:32px}html[data-theme] .layer-row>button[aria-pressed=true]{color:var(--ui-text)}html[data-theme] .layer-row>button:hover:not(:disabled){background:var(--ui-surface)}html[data-theme] .range-head label{border-color:var(--ui-border);background:var(--ui-surface);border-radius:7px}html[data-theme] .range-control button{border-color:var(--ui-border);background:var(--ui-surface);color:var(--ui-muted)}html[data-theme] .zoom-tools button,html[data-theme] .workspace-tools>button:not(.button),html[data-theme] .mobile-screen-switcher button{border:1px solid var(--ui-border);background:var(--ui-surface);color:var(--ui-muted);border-radius:7px;justify-content:center;align-items:center;gap:6px;min-height:32px;display:inline-flex}html[data-theme] .zoom-tools select{border-color:var(--ui-border);border-radius:7px;min-height:32px}html[data-theme] .zoom-tools button:hover,html[data-theme] .workspace-tools>button:hover{background:var(--ui-hover);color:var(--ui-text)}html[data-theme] .workspace-topline{gap:10px;padding:9px 14px}html[data-theme] .workspace{grid-template-rows:auto minmax(0,1fr) 34px}html[data-theme] .drawer-head button{color:var(--ui-muted);border-radius:9px;justify-content:center;align-items:center;display:inline-flex}html[data-theme] .drawer-head button:hover{background:var(--ui-hover)}html[data-theme] .drawer{border-inline-start:1px solid var(--ui-border)}html[data-theme] .drawer h2{font-size:21px}html[data-theme] .auth-card .button{min-height:46px;font-size:13px}html[data-theme] .auth-divider{align-items:center;gap:14px;display:flex}html[data-theme] .auth-divider:before,html[data-theme] .auth-divider:after{content:"";background:var(--ui-border);flex:1;height:1px}html[data-theme] .project-card{border-radius:16px;transition:border-color .15s,box-shadow .15s;box-shadow:0 3px 12px #26321c05}html[data-theme] .project-card:hover{border-color:var(--ui-focus);box-shadow:0 7px 22px #26321c0d}html[data-theme] .project-card-bottom button{border:1px solid var(--ui-border);color:var(--ui-muted);border-radius:7px;align-items:center;gap:6px;padding:7px 9px;display:inline-flex}html[data-theme] .project-filters{border:1px solid var(--ui-border);background:var(--ui-soft);border-radius:10px;gap:3px;padding:4px;display:inline-flex}html[data-theme] .project-filters button{color:var(--ui-muted);background:0 0;border-radius:7px;align-items:center;gap:7px;display:inline-flex}html[data-theme] .project-filters button.selected{background:var(--ui-surface);color:var(--ui-text);box-shadow:0 1px 3px #14221118}html[data-theme] .phone-header .ui-icon{width:1.3em;height:1.3em}html[data-theme] .phone-bottom{justify-content:space-around;align-items:center;display:flex}html[data-theme] .phone-bottom .ui-icon,html[data-theme] .habit .ui-icon{width:1.2em;height:1.2em}html[data-theme] .streak>.ui-icon{width:1.25em;height:1.25em}html[data-theme] .export-demo>span>.ui-icon{width:40px;height:40px}html[data-theme] .closing-asterisk>.ui-icon{stroke-width:1px;width:1em;height:1em}html[data-theme] .format-strip i .ui-icon{width:16px;height:16px}html[data-theme] .faq summary:after{content:none}html[data-theme] .faq summary>.ui-icon{color:var(--ui-muted);transition:transform .15s}html[data-theme] .faq details[open] summary>.ui-icon{transform:rotate(45deg)}@media (width>=901px){html[data-theme] .project-toolbar .project-menu-toggle,html[data-theme] .project-toolbar .mobile-only{display:none}html[data-theme] .app-shell{grid-template-columns:260px minmax(200px,1fr) 280px}html[data-theme] .app-shell.hide-left{grid-template-columns:minmax(200px,1fr) 280px}html[data-theme] .app-shell.hide-right{grid-template-columns:260px minmax(200px,1fr)}html[data-theme] .app-shell.hide-left.hide-right{grid-template-columns:minmax(200px,1fr)}}@media (width<=900px){html[data-theme] .project-toolbar{gap:2px 5px;padding:5px 8px}html[data-theme] .project-toolbar>button,html[data-theme] .history-buttons button{min-height:40px;padding:6px 8px}html[data-theme] .project-toolbar .project-menu-toggle{display:inline-flex}html[data-theme] .history-buttons{border:0;padding:0}html[data-theme] .project-actions{align-items:stretch;padding:9px}html[data-theme] .project-actions button{justify-content:start;gap:10px;min-height:44px}html[data-theme] .project-actions :is(.theme-picker,.language-picker){margin:4px 0!important}html[data-theme] .project-actions :is(.theme-picker,.language-picker) select{width:100%;max-width:none;min-height:44px;font-size:16px}html[data-theme] .workspace{grid-template-rows:auto minmax(0,1fr)}html[data-theme] .workspace-topline{gap:4px;padding:4px 8px 6px}html[data-theme] .zoom-tools button{gap:4px;font-size:11px}html[data-theme] .zoom-tools button .ui-icon{width:14px}html[data-theme] .zoom-tools button,html[data-theme] .zoom-tools select,html[data-theme] .mobile-screen-switcher button{min-height:40px}html[data-theme] .mobile-editor-nav button{min-height:53px;color:var(--ui-muted);background:0 0;border:1px solid #0000;flex-direction:column;justify-content:center;align-items:center;gap:5px;font-size:11px;display:flex}html[data-theme] .mobile-editor-nav button[aria-pressed=true]{background:var(--ui-selected);border-color:var(--ui-border);color:var(--ui-text)}html[data-theme] .mobile-editor-nav{padding-top:5px;padding-bottom:calc(5px + env(safe-area-inset-bottom))}html[data-theme] .layer-row{grid-template-columns:minmax(0,1fr) repeat(4,40px)}html[data-theme] .layer-row>button{min-height:44px}html[data-theme] .inspector-tabs button,html[data-theme] .compact-actions button{min-height:44px;font-size:12px}html[data-theme] .segmented button{min-height:38px}html[data-theme] .button{min-height:44px}html[data-theme] .field{font-size:13px}html[data-theme] .topbar{min-height:74px}html[data-theme] .range-head input{min-height:0!important}html[data-theme] .dashboard-header .button{padding:10px}}@media (width<=600px){html[data-theme] :is(.language-picker,.theme-picker) select{min-height:44px;font-size:14px}html[data-theme] .site-header .appearance-controls{flex-wrap:nowrap}html[data-theme] .site-header .appearance-controls>label{flex:1;min-width:0}html[data-theme] .site-header .appearance-controls select{width:100%;max-width:none}}@media (width<=380px){html[data-theme] .zoom-tools button{padding-inline:4px;font-size:10px}html[data-theme] .zoom-tools button .ui-icon{display:none}html[data-theme] .layer-row{grid-template-columns:minmax(0,1fr) repeat(4,38px)}}@media (prefers-reduced-motion:reduce){html[data-theme] .button,html[data-theme] .project-toolbar button,html[data-theme] .project-card,html[data-theme] .faq summary>.ui-icon{transition:none}}html[data-theme] .left-panel>.inspector-tabs{grid-template-columns:repeat(3,minmax(0,1fr));padding:10px 8px;display:grid}html[data-theme] .left-panel>.inspector-tabs button{gap:4px;min-width:0;padding-inline:3px;font-size:10px}@media (width>=901px){html[data-theme] .compact-actions .mobile-only{display:none}}@media (width<=900px){html[data-theme] .left-panel>.inspector-tabs button{font-size:12px}html[data-theme] .workspace-tools>button:not(.button){display:none}}html[data-theme] .language-picker{direction:ltr}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-font-weight{syntax:"*";inherits:false}html[data-theme] .preference-picker{color:var(--ui-text);flex:none;font:13px Arial,sans-serif;display:block;position:relative;margin:0!important}html[data-theme] .preference-picker[open]{z-index:60}html[data-theme] .preference-picker .preference-trigger{width:36px;height:36px;min-height:36px;color:inherit;cursor:pointer;background:0 0;border:0;border-radius:8px;justify-content:center;align-items:center;padding:0;list-style:none;display:flex}html[data-theme] .preference-trigger::-webkit-details-marker{display:none}html[data-theme] .preference-trigger:hover,html[data-theme] .preference-picker[open] .preference-trigger{background:var(--ui-hover)}html[data-theme] .preference-trigger>span:not([hidden]){display:flex}html[data-theme] .preference-trigger [hidden]{display:none}html[data-theme] .preference-picker img{object-fit:cover;border-radius:2px;width:22px;height:16px;display:block;box-shadow:0 0 0 1px #80808026}html[data-theme] .preference-picker .preference-menu{inset-inline-end:0;transform:translateX(var(--preference-shift,0px));border:1px solid var(--ui-border);background:var(--ui-surface);width:210px;max-width:calc(100vw - 24px);color:var(--ui-text);border-radius:10px;padding:6px;position:absolute;top:calc(100% + 6px);box-shadow:0 10px 30px #15241826}html[data-theme] .preference-picker .language-options{direction:ltr;grid-template-columns:repeat(5,minmax(0,1fr));gap:2px;display:grid}html[data-theme] .preference-picker .theme-options{width:190px;display:grid}html[data-theme] .preference-picker .preference-menu :is(button,a){width:100%;min-width:0;min-height:38px;color:var(--ui-text);text-align:start;cursor:pointer;background:0 0;border:0;border-radius:6px;justify-content:flex-start;align-items:center;gap:10px;margin:0;padding:8px 10px;font:13px Arial,sans-serif;text-decoration:none;display:flex;position:relative}html[data-theme] .preference-picker .language-options :is(button,a){justify-content:center;padding:8px 0}html[data-theme] .preference-picker .preference-menu :is(button,a):hover{background:var(--ui-hover)}html[data-theme] .preference-picker .preference-menu [data-selected=true]{background:var(--ui-selected)}html[data-theme] .preference-picker .preference-check{visibility:hidden;margin-inline-start:auto;display:flex}html[data-theme] .preference-picker [data-selected=true] .preference-check{visibility:visible}html[data-theme] .preference-picker .preference-check .ui-icon{width:12px;height:12px}html[data-theme] .preference-picker .language-options .preference-check{background:var(--ui-surface);border-radius:50%;padding:1px;position:absolute;bottom:2px;right:2px}html[data-theme] .preference-picker :is(summary,button,a):focus-visible{outline:2px solid var(--ui-focus);outline-offset:2px}html[data-theme] .appearance-controls{flex-wrap:nowrap;gap:2px}html[data-theme] .project-toolbar{z-index:20;position:relative}html[data-theme] .studio-preferences{margin-inline-start:auto}html[data-theme] .studio-preferences .preference-trigger{color:#e1e8d7}html[data-theme] .studio-preferences .preference-trigger:hover,html[data-theme] .studio-preferences .preference-picker[open] .preference-trigger{background:#ffffff12}@media (width<=900px){html[data-theme] .project-toolbar .save-state{grid-column:1/3}html[data-theme] .studio-preferences{grid-area:2/3;justify-self:end}}.frameflow-logo{letter-spacing:-1.5px;color:#22271e;white-space:nowrap;direction:ltr;flex-shrink:0;align-items:center;gap:9px;font:750 25px Arial,Helvetica,sans-serif;text-decoration:none;display:inline-flex}.frameflow-logo .studio-label{letter-spacing:1px;color:#22271e;background:#e7ebde;border-radius:4px;padding:5px 6px;font:700 8px Arial,Helvetica,sans-serif}.frameflow-logo .brand-icon{background:#22271e;border-radius:8px;flex-shrink:0;justify-content:center;align-items:flex-end;gap:3px;width:29px;height:29px;padding:7px 6px;display:flex;transform:rotate(-4deg)}.frameflow-logo .brand-icon i{background:#c8f65d;border-radius:2px;width:4px;height:8px}.frameflow-logo .brand-icon i:nth-child(2){height:16px}.frameflow-logo .brand-icon i:nth-child(3){height:12px}.language-picker{color:inherit;flex-shrink:0;align-items:center;gap:4px;font:13px Arial,sans-serif;display:inline-flex;margin:0!important}.language-picker select{width:auto;max-width:145px;min-height:44px;font:inherit;color:inherit;cursor:pointer;background:0 0;border:1px solid #92998970;border-radius:7px;padding:8px 24px 8px 8px}.language-picker option{color:#22271e;background:#fff}.language-picker select:focus-visible{outline-offset:2px;outline:3px solid #789a36}.project-toolbar .language-picker select{max-width:125px}.welcome-copy>.language-picker{width:max-content;display:flex;margin-block:24px!important}.topbar .frameflow-logo{font-size:23px}.topbar .frameflow-logo .studio-label{font-size:7px}[dir=rtl] .drawer{margin-left:0;margin-right:auto;left:0;right:auto}[dir=rtl] .project-name-input,[dir=rtl] .drawer input,[dir=rtl] textarea{text-align:start}.canvas-scroll,.dimension-chip,.range-control,.sample-screen,.design-demo{direction:ltr}[dir=rtl] .sample-screen{direction:rtl}[dir=rtl] .phone-header,[dir=rtl] .habit{text-align:start}[dir=rtl] .hero h1,[dir=rtl] .section-heading h2,[dir=rtl] .faq h2,[lang=zh-Hans] h1,[lang=ja] h1,[lang=hi] h1{letter-spacing:normal}@media (width<=1100px){.site-header{flex-wrap:wrap;gap:14px;height:auto;min-height:104px;padding-block:18px}.site-header nav{order:4;justify-content:center;width:100%}.project-toolbar .language-picker select{max-width:115px}}@media (width<=600px){.site-header .frameflow-logo{font-size:22px}.site-header .language-picker{margin-inline-start:auto!important}.site-header>.button{margin-inline-start:auto}.site-header nav{order:3;gap:18px;width:auto}.site-header>.button{order:4}.dashboard-header{align-items:flex-start}.dashboard-header>div{overflow-wrap:anywhere;flex-wrap:wrap;min-width:0}.topbar .frameflow-logo{gap:5px;font-size:18px}.topbar .frameflow-logo .studio-label{display:none}.topbar .frameflow-logo .brand-icon{width:25px;height:25px}.hero h1{overflow-wrap:break-word;font-size:clamp(40px,10vw,58px)}.language-picker select{max-width:135px;font-size:16px}.project-toolbar .language-picker select{max-width:100%}}.language-links{flex-wrap:wrap;grid-column:1/-1;gap:12px 20px;padding-top:14px;font-size:12px;display:flex}.language-links a[aria-current]{font-weight:700;text-decoration:underline}@media (width<=900px){.app-shell .topbar{grid-template-rows:auto auto;grid-template-columns:minmax(0,1fr) auto;gap:0 8px}.app-shell .topbar>.frameflow-logo{grid-area:1/1;gap:5px;font-size:18px}.app-shell .topbar>.frameflow-logo .studio-label{padding:3px;font-size:6px}.app-shell .topbar>.project-name-input{grid-area:2/1}.app-shell .topbar>.top-actions{grid-area:1/2/3}[dir=rtl] .project-actions{left:8px;right:auto}[dir=rtl] .project-actions button{text-align:right}}#analytics-preferences{color:#20231e;font:14px/1.55 system-ui,sans-serif}.analytics-settings{z-index:1100;color:#343a2b;font:inherit;cursor:pointer;background:#fff;border:1px solid #d0d4c7;border-radius:8px;padding:6px 10px;font-size:11px;position:fixed;bottom:8px;left:8px}.analytics-choice{z-index:1101;box-sizing:border-box;background:#fff;border:1px solid #d0d4c7;border-radius:16px;width:min(430px,100vw - 32px);max-height:calc(100dvh - 70px);padding:24px;position:fixed;bottom:44px;left:16px;overflow:auto;box-shadow:0 8px 40px #18241026}.analytics-choice[hidden]{display:none}.analytics-choice h2{letter-spacing:-.4px;color:#20231e;margin:0 0 12px;font:600 20px/1.3 system-ui,sans-serif}.analytics-choice p{font:inherit;color:#505649;margin:0 0 12px}.analytics-choice a{color:#354a25;font-size:13px;text-decoration:underline}.analytics-actions{flex-wrap:wrap;gap:8px;margin-top:20px;display:flex}.analytics-actions button{color:#28351e;font:inherit;cursor:pointer;background:#f4f6ef;border:1px solid #6a755e;border-radius:8px;flex:150px;padding:10px;font-weight:600}#analytics-preferences button:focus-visible,#analytics-preferences a:focus-visible{outline-offset:3px;outline:3px solid #627b45}