:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--font-sans:"Inter Variable", "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono:"JetBrains Mono Variable", "JetBrains Mono", "SFMono-Regular", Consolas, monospace;--bg-950:#040710;--bg-900:#070b14;--bg-850:#0a0f1b;--bg-800:#0d1321;--bg-750:#101827;--bg-700:#141d2d;--surface:#0a101c;--surface-raised:#0e1624;--surface-strong:#121c2d;--surface-soft:#10192ac2;--surface-hover:#172136;--control-bg:#0b1320;--control-hover:#141f32;--canvas:#07101c;--canvas-surface:#08111f;--canvas-grid:#94a3b814;--code-surface:#030712;--text-strong:#f7f8fc;--text:#dbe1ee;--text-muted:#98a4b9;--text-faint:#667289;--border:#94a3b829;--border-strong:#8b5cf685;--border-soft:#94a3b817;--primary:#7c3aed;--primary-strong:#6d28d9;--primary-bright:#9b7cff;--primary-soft:#7c3aed2b;--primary-softer:#7c3aed1a;--blue:#3b82f6;--teal:#14b8a6;--cyan:#22d3ee;--amber:#f59e0b;--rose:#f43f5e;--green:#22c55e;--danger:#fb4f72;--shadow-sm:0 8px 24px #00000038;--shadow-md:0 16px 42px #00000052;--shadow-lg:0 28px 90px #00000085;--focus:0 0 0 3px #7c3aed42;--radius-xs:6px;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:22px;--ease:.18s cubic-bezier(.2,.8,.2,1)}:root[data-theme=light]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg-950:#f1f4f9;--bg-900:#f6f8fc;--bg-850:#f8fafe;--bg-800:#fff;--bg-750:#eef2f8;--bg-700:#e3e9f2;--surface:#fff;--surface-raised:#f8fafe;--surface-strong:#eef2f8;--surface-soft:#ffffffe6;--surface-hover:#f1edff;--control-bg:#f5f7fb;--control-hover:#ede9fe;--canvas:#f8fafc;--canvas-surface:#f8fafc;--canvas-grid:#4755691a;--code-surface:#f8fafc;--text-strong:#101828;--text:#263348;--text-muted:#667085;--text-faint:#8d99aa;--border:#4755692b;--border-strong:#7c3aed7a;--border-soft:#47556917;--primary-soft:#7c3aed1f;--primary-softer:#7c3aed12;--shadow-sm:0 7px 22px #2b364c12;--shadow-md:0 16px 40px #2b364c1c;--shadow-lg:0 26px 72px #2b364c2e}*,:before,:after{box-sizing:border-box}html{background:var(--bg-950);scrollbar-color:var(--primary) transparent;min-height:100%;font-size:16px}body{min-width:320px;min-height:100vh;font-family:var(--font-sans);color:var(--text);background:var(--bg-950);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;margin:0;font-size:15px;font-weight:450;line-height:1.5;overflow-x:hidden}body,button,input,select,textarea{font-family:var(--font-sans)}button,input,select,textarea{color:inherit}button{cursor:pointer;border:0}button:disabled{cursor:not-allowed}button,a{-webkit-tap-highlight-color:transparent}img,svg{display:block}input,select,textarea{outline:none}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible{box-shadow:var(--focus);outline:none}::selection{background:#7c3aed4d}#app{min-height:100vh}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}.app-shell{background:var(--bg-950);min-height:100vh}.app-content{min-height:100vh;margin-left:64px}.panel-surface,.content-card{border:1px solid var(--border);background:var(--surface);box-shadow:var(--shadow-sm)}.brand{align-items:center;gap:9px;min-width:0;display:inline-flex}.brand__mark{filter:drop-shadow(0 5px 12px #7c3aed47);flex:none;width:27px;height:27px}.brand strong{color:var(--text-strong);letter-spacing:-.035em;font-size:15px;font-weight:750}.brand--compact .brand__mark{width:29px;height:29px}.icon-button{border:1px solid var(--border);border-radius:var(--radius-sm);width:34px;height:34px;color:var(--text-muted);background:var(--surface-raised);transition:color var(--ease), border-color var(--ease), background var(--ease), transform var(--ease);place-items:center;padding:0;display:inline-grid;position:relative}.icon-button:hover,.icon-button.is-active{color:var(--text-strong);border-color:var(--border-strong);background:var(--primary-soft)}.icon-button:active{transform:translateY(1px)}.icon-button:disabled{opacity:.35}.primary-action,.secondary-button,.danger-button,.toolbar-button{border-radius:var(--radius-sm);min-height:38px;transition:transform var(--ease), filter var(--ease), border-color var(--ease), background var(--ease);justify-content:center;align-items:center;gap:8px;padding:0 15px;font-size:12px;font-weight:700;display:inline-flex}.primary-action,.toolbar-button--primary{color:#fff;background:linear-gradient(135deg,#7c3aed,#5b2ee8 58%,#7047f6);box-shadow:0 8px 24px #5b2ee847,inset 0 1px #ffffff2e}.primary-action:hover,.toolbar-button--primary:hover{filter:brightness(1.08);transform:translateY(-1px)}.primary-action--small{min-height:33px;padding:0 12px;font-size:11px}.secondary-button,.toolbar-button--quiet{border:1px solid var(--border);color:var(--text);background:var(--surface-raised)}.secondary-button:hover,.toolbar-button--quiet:hover{border-color:var(--border-strong);background:var(--primary-softer)}.secondary-button--full{width:100%}.danger-button{color:#fff;background:linear-gradient(135deg,#ef476f,#d92e56);box-shadow:0 8px 20px #ef476f33}.eyebrow{color:var(--primary-bright);letter-spacing:.14em;text-transform:uppercase;margin-bottom:8px;font-size:10px;font-weight:750;display:block}.eyebrow-tag{color:#bca9ff;background:var(--primary-soft);border:1px solid #7c3aed4d;border-radius:5px;align-items:center;min-height:20px;padding:0 7px;font-size:9px;font-weight:700;display:inline-flex}.status-pill,.featured-badge,.selection-chip{border-radius:999px;align-items:center;min-height:20px;padding:0 7px;font-size:9px;font-weight:700;display:inline-flex}.status-pill{color:var(--text-muted);border:1px solid var(--border);background:var(--surface-raised)}.tone--violet{--tone:#8b5cf6;--tone-bg:#8b5cf621}.tone--blue{--tone:#3b82f6;--tone-bg:#3b82f621}.tone--teal{--tone:#14b8a6;--tone-bg:#14b8a621}.tone--amber{--tone:#f59e0b;--tone-bg:#f59e0b21}.tone--rose{--tone:#f43f5e;--tone-bg:#f43f5e21}.nav-rail{z-index:50;border-right:1px solid var(--border);background:color-mix(in srgb, var(--surface) 94%, transparent);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);flex-direction:column;align-items:stretch;width:64px;padding:10px 7px;display:flex;position:fixed;inset:0 auto 0 0}.nav-rail__brand{width:48px;height:45px;color:inherit;background:0 0;border-radius:11px;place-items:center;margin:0 auto 13px;display:grid}.nav-rail__main{flex-direction:column;gap:5px;display:flex}.nav-rail__item{min-height:49px;color:var(--text-faint);transition:color var(--ease), background var(--ease);background:0 0;border-radius:9px;flex-direction:column;justify-content:center;align-items:center;gap:4px;padding:5px 2px;display:flex;position:relative}.nav-rail__item span{text-overflow:ellipsis;max-width:52px;font-size:8px;font-weight:650;overflow:hidden}.nav-rail__item:hover{color:var(--text);background:var(--surface-hover)}.nav-rail__item.is-active{color:#bda8ff;background:linear-gradient(135deg,#7c3aed33,#7c3aed14)}.nav-rail__item.is-active:before{content:"";background:var(--primary-bright);width:2px;height:27px;box-shadow:0 0 14px var(--primary);border-radius:0 3px 3px 0;position:absolute;left:-7px}.nav-rail__bottom{flex-direction:column;gap:6px;margin-top:auto;display:flex}.top-toolbar{z-index:40;border-bottom:1px solid var(--border);background:color-mix(in srgb, var(--surface) 95%, transparent);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);grid-template-columns:minmax(200px,1fr) auto minmax(360px,1fr);align-items:center;min-height:52px;padding:7px 12px;display:grid;position:sticky;top:0}.top-toolbar__mobile-brand{display:none}.project-crumb{min-width:0;color:var(--text-muted);align-items:center;gap:7px;display:flex}.project-crumb input{width:min(230px,26vw);min-height:30px;color:var(--text-strong);background:0 0;border:0;padding:0 4px;font-size:12px;font-weight:650}.project-crumb input:hover,.project-crumb input:focus{background:var(--surface-raised);border-radius:5px}.device-switch{border:1px solid var(--border);background:var(--bg-850);border-radius:8px;align-items:center;gap:2px;padding:3px;display:flex}.device-switch button{width:29px;height:26px;color:var(--text-faint);background:0 0;border-radius:5px;place-items:center;display:grid}.device-switch button.is-active{color:#fff;background:var(--primary)}.device-switch select{border:0;border-left:1px solid var(--border);height:25px;color:var(--text-muted);background:0 0;margin-left:3px;padding:0 22px 0 8px;font-size:10px}.top-toolbar__actions{justify-content:flex-end;align-items:center;gap:6px;display:flex}.toolbar-button{min-height:34px;padding:0 11px}.editor-workspace{background:var(--bg-950);grid-template-columns:218px minmax(480px,1fr) 280px;gap:0;min-height:calc(100vh - 52px);display:grid}.library-panel{min-width:0;box-shadow:none;border-width:0 1px 0 0;flex-direction:column;display:flex}.inspector{min-width:0;box-shadow:none;border-width:0 0 0 1px;flex-direction:column;display:flex}.editor-workspace__main{flex-direction:column;min-width:0;min-height:0;display:flex;overflow:hidden}.panel-tabs{border-bottom:1px solid var(--border);grid-template-columns:repeat(2,1fr);gap:3px;padding:8px;display:grid}.panel-tabs--three{grid-template-columns:repeat(3,1fr);padding:7px}.panel-tabs button{min-height:30px;color:var(--text-faint);background:0 0;border-radius:6px;padding:0 8px;font-size:10px;font-weight:650}.panel-tabs button:hover{color:var(--text)}.panel-tabs button.is-active{color:#c5b5ff;background:var(--primary-soft);box-shadow:inset 0 0 0 1px #7c3aed2e}.panel-section,.control-section{border-bottom:1px solid var(--border-soft);padding:13px 12px}.panel-section--grow{flex:1}.section-heading{justify-content:space-between;align-items:center;min-height:22px;margin-bottom:9px;display:flex}.section-heading>span:first-child{color:var(--text-muted);letter-spacing:.04em;text-transform:uppercase;font-size:9px;font-weight:750}.section-heading button{color:var(--primary-bright);background:0 0;font-size:9px;font-weight:650}.segmented-control{border:1px solid var(--border);background:var(--bg-850);border-radius:7px;gap:3px;padding:3px;display:grid}.segmented-control--wide{grid-template-columns:repeat(2,1fr)}.segmented-control button{min-height:28px;color:var(--text-muted);background:0 0;border-radius:5px;justify-content:center;align-items:center;gap:6px;font-size:10px;font-weight:650;display:inline-flex}.segmented-control button.is-active{color:#fff;background:var(--primary);box-shadow:0 4px 13px #7c3aed3d}.quick-template-grid{grid-template-columns:repeat(2,1fr);gap:7px;display:grid}.quick-template-grid>button{border:1px solid var(--border);color:var(--text-muted);background:var(--bg-850);border-radius:8px;flex-direction:column;gap:6px;padding:8px;display:flex}.quick-template-grid>button:hover{border-color:var(--border-strong);color:var(--text);background:var(--primary-softer)}.quick-template-grid small{font-size:9px;font-weight:650}.quick-template-grid__diagram{grid-template-rows:repeat(2,13px);grid-template-columns:repeat(3,1fr);gap:3px;width:100%;display:grid}.quick-template-grid__diagram i{background:#7c3aed21;border:1px solid #8b5cf659;border-radius:2px;display:block}.quick-template-grid__diagram i:last-child{grid-column:1/-1}.diagram--sidebar{grid-template-columns:1fr 2fr}.diagram--sidebar i:first-child{grid-row:1/3}.diagram--sidebar i:last-child{grid-column:2}.diagram--gallery{grid-template-columns:repeat(4,1fr)}.diagram--gallery i:last-child{grid-column:auto}.diagram--stats{grid-template-rows:29px;grid-template-columns:repeat(4,1fr)}.diagram--stats i:last-child{grid-column:auto}.preset-card{border:1px solid var(--border);text-align:left;width:100%;color:var(--text);background:var(--bg-850);border-radius:8px;grid-template-columns:58px 1fr;gap:8px;margin-bottom:8px;padding:7px;display:grid}.preset-card:hover{border-color:var(--border-strong)}.preset-card>span{flex-direction:column;justify-content:center;min-width:0;display:flex}.preset-card strong{font-size:9px}.preset-card small{color:var(--text-faint);margin-top:3px;font-size:8px}.library-panel__tip{color:#bda9ff;background:linear-gradient(135deg,#7c3aed26,#3b82f60f);border:1px solid #7c3aed3b;border-radius:9px;gap:9px;margin:10px;padding:11px;display:flex}.library-panel__tip div{flex-direction:column;gap:3px;display:flex}.library-panel__tip strong{font-size:9px}.library-panel__tip span{color:var(--text-faint);font-size:8px;line-height:1.45}.layer-tree{flex-direction:column;gap:3px;display:flex}.layer-row{text-align:left;min-height:32px;color:var(--text-muted);background:0 0;border-radius:6px;grid-template-columns:16px 17px minmax(0,1fr) auto;align-items:center;padding:0 7px;font-size:9px;display:grid}.layer-row--container{color:var(--text);background:var(--bg-850);grid-template-columns:16px 17px 1fr}.layer-row.is-active{color:#c5b5ff;background:var(--primary-soft)}.layer-row small{color:var(--text-faint)}.layer-indent{border-left:1px solid var(--border);width:10px;height:100%;margin-left:5px}.canvas-workspace{background:var(--bg-900);flex-direction:column;flex:auto;min-height:430px;display:flex;position:relative;overflow:hidden}.canvas-toolbar{min-height:45px;box-shadow:none;border-width:0 0 1px;justify-content:space-between;align-items:center;padding:6px 10px;display:flex}.canvas-toolbar__left{align-items:center;gap:8px;min-width:0;display:flex}.canvas-toolbar__left strong{color:var(--text-strong);font-size:10px}.canvas-toolbar__left small{color:var(--cyan);margin-left:3px;font-size:8px}.canvas-toolbar__actions{gap:4px;display:flex}.canvas-toolbar .icon-button{width:29px;height:29px}.canvas-stage{background-image:radial-gradient(circle at 1px 1px, color-mix(in srgb, var(--text-faint) 18%, transparent) 1px, transparent 0);background-size:18px 18px;flex:1;place-items:center;min-height:315px;padding:38px 42px 30px;display:grid;position:relative;overflow:auto}.canvas-stage:before{content:"";pointer-events:none;background:radial-gradient(circle,#7c3aed0b,#0000 56%);position:absolute;inset:0}.ruler{z-index:2;color:var(--text-faint);font-family:var(--font-mono);pointer-events:none;font-size:7px;display:flex;position:absolute}.ruler--top{border-bottom:1px solid var(--border-soft);justify-content:space-around;align-items:center;height:22px;top:0;left:28px;right:0}.ruler--left{border-right:1px solid var(--border-soft);flex-direction:column;justify-content:space-around;align-items:center;width:28px;top:22px;bottom:0;left:0}.canvas-device{grid-template-columns:repeat(var(--canvas-columns), minmax(0, 1fr));grid-template-rows:repeat(var(--canvas-rows), minmax(92px, auto));gap:var(--canvas-row-gap) var(--canvas-col-gap);align-items:var(--canvas-align);justify-content:var(--canvas-justify);width:min(760px,100% - 20px);min-height:280px;padding:var(--canvas-padding);background:var(--canvas-bg);transform:scale(var(--canvas-scale));transform-origin:50%;transition:width var(--ease), min-height var(--ease), transform var(--ease);border:1px solid #7c3aed61;border-radius:8px;display:grid;position:relative;box-shadow:0 18px 70px #00000042,inset 0 0 0 1px #ffffff05}.canvas-device.layout--flex{flex-flow:wrap;align-content:center;display:flex}.canvas-device.device--tablet{width:min(560px,100% - 20px)}.canvas-device.device--mobile{width:min(300px,100% - 20px);min-height:390px}.canvas-device.show-grid{background-image:linear-gradient(#7c3aed14 1px,#0000 1px),linear-gradient(90deg,#7c3aed14 1px,#0000 1px);background-size:24px 24px}.canvas-label{z-index:5;color:#fff;background:var(--primary);border-radius:4px 4px 4px 0;padding:3px 7px;font-size:7px;font-weight:700;position:absolute;top:-10px;left:-1px}.canvas-item{border:1px solid color-mix(in srgb, var(--tone) 42%, transparent);min-width:0;min-height:86px;color:color-mix(in srgb, var(--tone) 75%, white);background:linear-gradient(145deg, color-mix(in srgb, var(--tone-bg) 88%, transparent), #080f1cb3);transition:transform var(--ease), border-color var(--ease), box-shadow var(--ease);flex-direction:column;justify-content:center;align-items:center;padding:12px;display:flex;position:relative;box-shadow:inset 0 1px #ffffff06}:root[data-theme=light] .canvas-item{background:linear-gradient(145deg, color-mix(in srgb, var(--tone-bg) 65%, white), #ffffffd1)}.canvas-item:hover{border-color:color-mix(in srgb, var(--tone) 72%, transparent);transform:translateY(-1px)}.canvas-item.is-selected{z-index:3;border-color:var(--primary-bright);box-shadow:0 0 0 1px var(--primary-bright), 0 0 0 5px #7c3aed1f, inset 0 1px #ffffff0a}.canvas-item.is-dragging{opacity:.45;transform:scale(.96)}.canvas-item__icon{background:color-mix(in srgb, var(--tone) 14%, transparent);border-radius:7px;place-items:center;width:28px;height:28px;margin-bottom:5px;display:grid}.canvas-item strong{color:color-mix(in srgb, var(--tone) 66%, white);letter-spacing:-.04em;font-size:18px}.canvas-item small{color:var(--text-muted);margin-top:2px;font-size:8px}.selection-handle{background:var(--primary-bright);width:7px;height:7px;box-shadow:0 0 0 1px var(--primary);border:1px solid #fff;border-radius:50%;position:absolute}.handle--nw{top:-4px;left:-4px}.handle--ne{top:-4px;right:-4px}.handle--sw{bottom:-4px;left:-4px}.handle--se{bottom:-4px;right:-4px}.item-floating-actions{border:1px solid var(--border);color:var(--text);background:var(--surface-raised);box-shadow:var(--shadow-sm);border-radius:6px;gap:2px;padding:3px;display:flex;position:absolute;top:-31px;left:50%;transform:translate(-50%)}.item-floating-actions i{border-radius:4px;place-items:center;width:21px;height:21px;font-style:normal;display:grid}.item-floating-actions i:hover{background:var(--primary-soft)}.canvas-primary-action{padding:8px 10px 0;display:none}.canvas-primary-action .primary-action{justify-content:space-between;width:100%}.canvas-action-row{border-radius:8px;grid-template-columns:repeat(4,1fr);margin:7px 10px 0;padding:5px;display:none}.canvas-action-row button{color:var(--text-muted);background:0 0;flex-direction:column;align-items:center;gap:4px;padding:6px;font-size:8px;display:flex}.canvas-action-row button.danger{color:var(--danger)}.canvas-footer{min-height:26px;color:var(--cyan);justify-content:center;align-items:center;gap:5px;font-size:8px;display:flex}.inspector__header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;min-height:51px;padding:8px 11px;display:flex}.inspector__header>div{flex-direction:column;gap:2px;display:flex}.inspector__header span{color:var(--text-faint);text-transform:uppercase;font-size:8px}.inspector__header strong{color:var(--text-strong);font-size:11px}.inspector__scroll{flex:1;min-height:0;overflow:auto}.field-label{min-height:34px;color:var(--text-muted);justify-content:space-between;align-items:center;gap:10px;font-size:9px;display:flex}.field-label--stack{flex-direction:column;align-items:stretch;gap:5px;margin-bottom:9px}.field-label>small{color:var(--text-faint);margin-left:auto;font-size:8px}.text-input,.select-input,.unit-input,.stepper{border:1px solid var(--border);width:100%;min-height:30px;color:var(--text);background:var(--bg-850);border-radius:6px;font-size:9px}.code-input{font-family:var(--font-mono);font-size:8px}.select-input{padding:0 26px 0 9px}.stepper{grid-template-columns:28px 1fr 28px;width:112px;display:grid;overflow:hidden}.stepper button{color:var(--text-muted);background:0 0;place-items:center;display:grid}.stepper input{text-align:center;width:100%;color:var(--text);background:0 0;border:0;font-size:9px}.two-column-fields{grid-template-columns:repeat(2,1fr);gap:8px;display:grid}.two-column-fields>label{color:var(--text-muted);flex-direction:column;gap:5px;font-size:8px;display:flex}.unit-input{align-items:center;display:flex}.unit-input input{background:0 0;border:0;width:100%;min-width:0;height:28px;padding:0 7px;font-size:9px}.unit-input small{color:var(--text-faint);padding-right:7px;font-size:8px}.range-field{color:var(--text-muted);align-items:center;gap:8px;font-size:8px;display:flex}.range-field input[type=range]{accent-color:var(--primary);flex:1}.range-field__label{min-width:38px}.range-field>span:last-child{min-width:32px;color:var(--text);font-family:var(--font-mono)}.toggle{background:var(--bg-700);width:32px;height:18px;transition:background var(--ease);border-radius:999px;flex:none;padding:2px;position:relative}.toggle span{width:14px;height:14px;transition:transform var(--ease);background:#fff;border-radius:50%;display:block;box-shadow:0 2px 5px #00000047}.toggle--on{background:var(--primary)}.toggle--on span{transform:translate(14px)}.selection-chip{color:#c0adff;background:var(--primary-soft)}.tone-picker{gap:7px;margin-top:9px;display:flex}.tone-picker button{border:3px solid var(--surface);background:var(--tone);width:25px;height:25px;box-shadow:0 0 0 1px var(--border);border-radius:50%}.tone-picker button.is-active{box-shadow:0 0 0 2px var(--tone)}.item-action-grid{grid-template-columns:repeat(2,1fr);gap:7px;display:grid}.item-action-grid button{border:1px solid var(--border);min-height:31px;color:var(--text-muted);background:var(--bg-850);border-radius:6px;justify-content:center;align-items:center;gap:6px;font-size:9px;display:inline-flex}.item-action-grid button.danger{color:var(--danger);border-color:#f43f5e33}.color-field{border:1px solid var(--border);background:var(--bg-850);border-radius:7px;align-items:center;gap:8px;min-height:34px;padding:4px;display:flex}.color-field input{background:0 0;border:0;width:28px;height:24px;padding:0}.color-field span{font-family:var(--font-mono);font-size:9px}.audit-card{color:var(--green);background:#22c55e12;border:1px solid #22c55e2e;border-radius:8px;gap:9px;padding:10px;display:flex}.audit-card div{flex-direction:column;gap:3px;display:flex}.audit-card span{color:var(--text-muted);font-size:8px;line-height:1.45}.code-panel{min-height:166px;box-shadow:none;border-width:1px 0 0;flex:none}.code-panel.is-collapsed{min-height:42px}.code-panel__header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;min-height:41px;padding:5px 8px;display:flex}.code-tabs{gap:3px;display:flex}.code-tabs button,.code-panel__actions>button:not(.icon-button){min-height:27px;color:var(--text-faint);background:0 0;border-radius:5px;align-items:center;gap:5px;padding:0 9px;font-size:8px;font-weight:650;display:inline-flex}.code-tabs button.is-active{color:#c3b1ff;background:var(--primary-soft)}.code-panel__actions{gap:3px;display:flex}.code-panel__actions>button:not(.icon-button):hover{color:var(--text);background:var(--surface-hover)}.code-panel pre{color:#b5c8e9;background:color-mix(in srgb, var(--bg-950) 80%, black);height:125px;font:8.5px/1.65 var(--font-mono);white-space:pre;tab-size:2;margin:0;padding:11px 15px;overflow:auto}:root[data-theme=light] .code-panel pre{color:#3d4a63;background:#f7f8fc}.mini-preview{border:1px solid var(--border);background:linear-gradient(145deg, var(--bg-850), var(--surface-raised));border-radius:8px;min-height:105px;padding:10px;display:grid;position:relative;overflow:hidden}.mini-preview--compact{border-radius:5px;min-height:42px;padding:4px}.mini-preview__hero{flex-direction:column;gap:4px;width:42%;padding-top:8px;display:flex}.mini-preview__hero i{background:var(--primary);border-radius:2px;width:24px;height:5px}.mini-preview__hero b{background:var(--text-faint);opacity:.5;border-radius:2px;width:100%;height:4px}.mini-preview__hero b.short{width:65%}.mini-preview__visual{background:linear-gradient(145deg,#14265a,#5a3ca9 55%,#16a2a0);border-radius:5px;width:43%;height:52%;position:absolute;top:12px;right:10px;box-shadow:inset 0 0 22px #ffffff1f}.mini-preview__tiles{grid-template-columns:repeat(4,1fr);gap:4px;display:grid;position:absolute;bottom:9px;left:9px;right:9px}.mini-preview__tiles i,.mini-preview__stats i{background:var(--primary-softer);border:1px solid #7c3aed3d;border-radius:3px;height:19px}.mini-preview__stats{grid-template-columns:repeat(4,1fr);gap:5px;display:grid}.mini-preview__chart{border:1px solid var(--border);border-radius:4px;align-items:end;gap:5px;margin-top:9px;padding:6px;display:flex}.mini-preview__chart b{background:linear-gradient(var(--primary), #7c3aed29);border-radius:2px 2px 0 0;flex:1;height:25px}.mini-preview__chart b:nth-child(2){height:38px}.mini-preview__chart b:nth-child(3){height:22px}.mini-preview__chart b:nth-child(4){height:48px}.mini-preview__chart b:nth-child(5){height:32px}.mini-preview__pricing{grid-template-columns:repeat(3,1fr);align-items:center;gap:6px;display:grid}.mini-preview__pricing i{border:1px solid var(--border);background:var(--surface-raised);border-radius:5px;height:74px}.mini-preview__pricing i.featured{border-color:var(--primary);background:var(--primary-soft);height:88px}.mini-preview__product{background:linear-gradient(145deg,#1d2d4d,#6240ac);border-radius:5px;width:48%}.mini-preview__copy{flex-direction:column;gap:6px;width:42%;display:flex;position:absolute;top:18px;right:10px}.mini-preview__copy b{background:var(--text-faint);opacity:.6;border-radius:3px;height:5px}.mini-preview__copy b.short{width:60%}.mini-preview__copy i{background:var(--primary);border-radius:3px;width:50%;height:15px}.mini-preview__quotes,.mini-preview__feature{grid-template-columns:repeat(2,1fr);gap:6px;display:grid}.mini-preview__quotes i,.mini-preview__feature i{border:1px solid var(--border);background:var(--primary-softer);border-radius:5px;min-height:38px}.mini-preview__feature{grid-template-columns:repeat(3,1fr)}.mini-preview__blank{opacity:.7;place-items:center;height:100%;display:grid}.mini-preview--compact .mini-preview__hero{padding-top:1px}.mini-preview--compact .mini-preview__visual{height:50%;top:5px;right:4px}.mini-preview--compact .mini-preview__tiles{gap:2px;bottom:4px;left:4px;right:4px}.mini-preview--compact .mini-preview__tiles i{height:7px}.mini-preview--compact .mini-preview__stats{gap:2px}.mini-preview--compact .mini-preview__stats i{height:10px}.mini-preview--compact .mini-preview__chart{gap:2px;margin-top:3px;padding:2px}.mini-preview--compact .mini-preview__chart b{height:8px!important}.mini-preview--compact .mini-preview__pricing i{height:30px}.mini-preview--compact .mini-preview__pricing i.featured{height:36px}.mobile-page-bar{display:none}.page-view{background:radial-gradient(circle at 82% -10%, #7c3aed14, transparent 30%), var(--bg-950);min-height:100vh;padding:30px clamp(20px,3vw,46px) 56px}.page-heading{justify-content:space-between;align-items:flex-end;gap:24px;max-width:1320px;margin:0 auto 24px;display:flex}.page-heading h1{color:var(--text-strong);letter-spacing:-.045em;margin:0;font-size:clamp(26px,3vw,38px);line-height:1.12}.page-heading p{max-width:580px;color:var(--text-muted);margin:8px 0 0;font-size:12px}.page-heading__action{flex:none}.setting-row__icon,.modal-icon{color:var(--tone);background:var(--tone-bg);border-radius:9px;flex:none;place-items:center;display:grid}.project-browser,.settings-layout,.template-grid,.component-grid,.template-hero,.browser-toolbar--templates{max-width:1320px;margin-left:auto;margin-right:auto}.project-browser{border-radius:var(--radius-md);overflow:hidden}.browser-toolbar{border-bottom:1px solid var(--border);align-items:center;gap:9px;min-height:56px;padding:9px 11px;display:flex}.browser-toolbar--templates{border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface);margin-bottom:15px}.search-field{border:1px solid var(--border);min-width:200px;max-width:320px;min-height:34px;color:var(--text-faint);background:var(--bg-850);border-radius:7px;flex:1;align-items:center;gap:7px;padding:0 10px;display:flex}.search-field input{width:100%;min-width:0;color:var(--text);background:0 0;border:0;font-size:10px}.filter-group{align-items:center;gap:4px;display:flex}.filter-button{min-height:31px;color:var(--text-faint);background:0 0;border:1px solid #0000;border-radius:6px;align-items:center;gap:5px;padding:0 10px;font-size:9px;font-weight:650;display:inline-flex}.filter-button:hover{color:var(--text);background:var(--surface-hover)}.filter-button.is-active{color:#c3b1ff;background:var(--primary-soft);border-color:#7c3aed33}.browser-toolbar__right{align-items:center;gap:6px;margin-left:auto;display:flex}.view-switch{border:1px solid var(--border);background:var(--bg-850);border-radius:7px;padding:3px;display:flex}.view-switch button{width:27px;height:25px;color:var(--text-faint);background:0 0;border-radius:4px;place-items:center;display:grid}.view-switch button.is-active{color:#fff;background:var(--primary)}.project-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:13px;display:grid}.project-card{border:1px solid var(--border);background:var(--bg-850);transition:transform var(--ease), border-color var(--ease), box-shadow var(--ease);border-radius:10px;overflow:hidden}.project-card:hover{border-color:var(--border-strong);box-shadow:var(--shadow-md);transform:translateY(-2px)}.project-card__preview{background:linear-gradient(145deg, var(--bg-900), var(--surface-raised));width:100%;padding:10px}.project-card__preview .mini-preview{min-height:130px}.project-card__body{border-top:1px solid var(--border);justify-content:space-between;align-items:flex-end;gap:10px;padding:11px;display:flex}.project-card__body h3{color:var(--text-strong);margin:7px 0 4px;font-size:11px}.project-card__body p{color:var(--text-faint);margin:0;font-size:8px}.project-card__actions{align-items:center;gap:4px;display:flex}.project-card__actions button{border:1px solid var(--border);min-width:28px;height:28px;color:var(--text-muted);background:var(--surface-raised);border-radius:5px;place-items:center;padding:0 8px;font-size:8px;display:grid}.project-table{padding:0 12px 12px}.project-table__head,.project-table article{border-bottom:1px solid var(--border-soft);grid-template-columns:minmax(240px,2fr) .7fr .8fr 120px;align-items:center;gap:10px;min-height:48px;padding:0 10px;font-size:9px;display:grid}.project-table__head{min-height:36px;color:var(--text-faint);text-transform:uppercase;font-size:8px}.project-table__name{grid-template-columns:54px 1fr;align-items:center;gap:9px;min-width:0;display:grid}.project-table__name .mini-preview{min-height:34px}.project-table__name strong{color:var(--text-strong);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.project-table article>span{color:var(--text-muted)}.project-table__actions{gap:4px;display:flex}.project-table__actions button{border:1px solid var(--border);min-height:27px;color:var(--text-muted);background:var(--surface-raised);border-radius:5px;padding:0 8px;font-size:8px}.empty-state{text-align:center;flex-direction:column;justify-content:center;align-items:center;min-height:450px;padding:40px;display:flex}.empty-state__art{color:#a98eff;background:radial-gradient(circle,#7c3aed33,#7c3aed0a);border:1px solid #7c3aed3d;border-radius:25px;place-items:center;width:96px;height:78px;margin-bottom:15px;display:grid;box-shadow:0 0 42px #7c3aed1f}.empty-state h2{color:var(--text-strong);margin:0;font-size:16px}.empty-state p{color:var(--text-muted);margin:7px 0 17px;font-size:10px}.template-hero{border-radius:var(--radius-lg);background:linear-gradient(135deg, #7c3aed26, #0b111fd6 47%, #14b8a60f), var(--surface);grid-template-columns:1fr 1.2fr;align-items:center;gap:24px;min-height:255px;margin-bottom:18px;padding:30px;display:grid}:root[data-theme=light] .template-hero{background:linear-gradient(135deg,#7c3aed1a,#ffffffeb 47%,#14b8a60f)}.template-hero h2{color:var(--text-strong);letter-spacing:-.055em;margin:12px 0 8px;font-size:34px;line-height:1.05}.template-hero p{max-width:390px;color:var(--text-muted);margin:0 0 18px;font-size:11px;line-height:1.6}.template-hero__art .mini-preview{min-height:190px;box-shadow:var(--shadow-md)}.template-grid,.component-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;display:grid}.template-card,.component-card{border-radius:var(--radius-md);overflow:hidden}.template-card__preview,.component-card__preview{background:var(--bg-900);padding:10px;position:relative}.template-card__preview .mini-preview,.component-card__preview .mini-preview{min-height:155px}.featured-badge{color:#c7b7ff;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#7c3aed4d;gap:4px;position:absolute;top:18px;left:18px}.template-card__body,.component-card__body{justify-content:space-between;align-items:flex-end;gap:10px;padding:12px;display:flex}.template-card__body h3,.component-card__body h3{color:var(--text-strong);margin:5px 0;font-size:12px}.template-card__body p,.component-card__body p{color:var(--text-muted);margin:0 0 5px;font-size:9px;line-height:1.45}.template-card__body small{color:var(--text-faint);font-size:8px}.template-category{color:var(--primary-bright);text-transform:uppercase;font-size:8px;font-weight:750}.component-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.component-card__body{flex-direction:column;align-items:stretch}.component-card__body .primary-action{align-self:flex-end}.component-card__preview .mini-preview{min-height:120px}.settings-layout{grid-template-columns:190px minmax(0,760px);align-items:start;gap:15px;display:grid}.settings-nav{border-radius:var(--radius-md);flex-direction:column;gap:4px;padding:8px;display:flex;position:sticky;top:22px}.settings-nav button{text-align:left;min-height:36px;color:var(--text-muted);background:0 0;border-radius:6px;align-items:center;gap:9px;padding:0 10px;font-size:9px;font-weight:650;display:flex}.settings-nav button.is-active{color:#c3b1ff;background:var(--primary-soft)}.settings-content{flex-direction:column;gap:12px;display:flex}.setting-group{border-radius:var(--radius-md);overflow:hidden}.setting-group>header{border-bottom:1px solid var(--border);padding:14px}.setting-group h2{color:var(--text-strong);margin:0;font-size:13px}.setting-group p{color:var(--text-faint);margin:4px 0 0;font-size:9px}.theme-options{grid-template-columns:repeat(3,1fr);gap:9px;padding:13px;display:grid}.theme-options button{border:1px solid var(--border);text-align:left;color:var(--text);background:var(--bg-850);border-radius:8px;flex-direction:column;gap:5px;padding:8px;display:flex}.theme-options button.is-active{border-color:var(--primary);box-shadow:0 0 0 2px var(--primary-soft)}.theme-options strong{font-size:9px}.theme-options small{color:var(--text-faint);font-size:8px;line-height:1.4}.theme-swatch{border-radius:5px;place-items:center;width:100%;height:62px;display:grid}.theme-swatch--dark{color:#bda8ff;background:#08101d}.theme-swatch--light{color:#6d28d9;background:#f5f6fb}.theme-swatch--system{color:var(--text);background:linear-gradient(90deg,#08101d 50%,#f5f6fb 50%)}.setting-row{border-bottom:1px solid var(--border-soft);grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:10px;min-height:61px;padding:10px 14px;display:grid}.setting-row:last-child{border-bottom:0}.setting-row__icon{width:31px;height:31px}.setting-row>div{flex-direction:column;gap:3px;display:flex}.setting-row strong{color:var(--text);font-size:9px}.setting-row small{color:var(--text-faint);font-size:8px}.setting-select-row{border-bottom:1px solid var(--border-soft);grid-template-columns:repeat(2,1fr);gap:10px;padding:13px;display:grid}.setting-select-row label{color:var(--text-muted);flex-direction:column;gap:6px;font-size:8px;display:flex}.overlay-backdrop{z-index:200;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#02040ab8;place-items:center;padding:18px;display:grid;position:fixed;inset:0}.modal{border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--surface);width:min(680px,100%);max-height:calc(100vh - 36px);box-shadow:var(--shadow-lg);overflow:auto}.modal--new-project{width:min(610px,100%)}.modal--danger{width:min(470px,100%)}.modal--preview{width:min(1100px,100%)}.modal__header{z-index:2;border-bottom:1px solid var(--border);background:color-mix(in srgb, var(--surface) 94%, transparent);-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);justify-content:space-between;align-items:center;gap:14px;min-height:68px;padding:12px 15px;display:flex;position:sticky;top:0}.modal__header>div{align-items:center;gap:11px;display:flex}.modal__header h2{color:var(--text-strong);letter-spacing:-.02em;margin:0;font-size:14px}.modal__header p{color:var(--text-faint);margin:4px 0 0;font-size:9px}.modal-icon{width:35px;height:35px}.modal-icon--danger{color:var(--danger);background:#f43f5e21}.modal__body{padding:15px}.modal__footer{z-index:2;border-top:1px solid var(--border);background:color-mix(in srgb, var(--surface) 94%, transparent);-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);justify-content:flex-end;align-items:center;gap:7px;min-height:58px;padding:10px 15px;display:flex;position:sticky;bottom:0}.field-title{color:var(--text-muted);text-transform:uppercase;letter-spacing:.04em;margin:1px 0 8px;font-size:9px;font-weight:700;display:block}.export-formats{grid-template-columns:repeat(4,1fr);gap:7px;margin-bottom:14px;display:grid}.export-formats button{border:1px solid var(--border);min-height:86px;color:var(--text-muted);background:var(--bg-850);border-radius:8px;flex-direction:column;justify-content:center;align-items:center;gap:5px;display:flex;position:relative}.export-formats button:hover,.export-formats button.is-active{border-color:var(--primary);color:#c4b2ff;background:var(--primary-soft)}.export-formats strong{font-size:9px}.export-formats small{color:var(--text-faint);font-size:7px}.export-formats button>span{color:#fff;background:var(--primary);border-radius:50%;place-items:center;width:17px;height:17px;display:grid;position:absolute;top:6px;right:6px}.export-options{grid-template-columns:repeat(2,1fr);gap:7px;margin-bottom:14px;display:grid}.export-options label{border:1px solid var(--border);background:var(--bg-850);border-radius:7px;grid-template-columns:1fr auto;align-items:center;gap:8px;min-height:50px;padding:8px 10px;display:grid}.export-options label>div{flex-direction:column;gap:3px;display:flex}.export-options strong{font-size:8px}.export-options small{color:var(--text-faint);font-size:7px}.export-preview{border:1px solid var(--border);background:var(--bg-850);border-radius:8px;grid-template-columns:180px 1fr;display:grid;overflow:hidden}.file-tree{border-right:1px solid var(--border);flex-direction:column;gap:7px;padding:11px;font-size:8px;display:flex}.file-tree strong{color:var(--text-muted);text-transform:uppercase;margin-bottom:3px;font-size:8px}.file-tree span{color:var(--text-muted);align-items:center;gap:5px;display:flex}.file-tree .indent{padding-left:17px}.export-preview pre{color:#a7bce3;background:var(--bg-950);font:8px/1.7 var(--font-mono);margin:0;padding:12px;overflow:auto}.layout-type-grid{grid-template-columns:repeat(2,1fr);gap:7px;margin:12px 0;display:grid}.layout-type-grid button{border:1px solid var(--border);text-align:left;min-height:55px;color:var(--text-muted);background:var(--bg-850);border-radius:7px;grid-template-columns:25px 1fr;align-items:center;gap:1px 8px;padding:9px;display:grid}.layout-type-grid button.is-active{border-color:var(--primary);background:var(--primary-soft)}.layout-type-grid button svg{color:var(--primary-bright);grid-row:1/3}.layout-type-grid strong{font-size:8px}.layout-type-grid small{color:var(--text-faint);font-size:7px;line-height:1.35}.layout-choice{margin-top:0}.starter-choice{grid-template-columns:repeat(4,1fr);gap:7px;margin-bottom:13px;display:grid}.starter-choice button{border:1px solid var(--border);color:var(--text-muted);background:var(--bg-850);border-radius:7px;flex-direction:column;gap:6px;padding:7px;display:flex}.starter-choice button.is-active{border-color:var(--primary);background:var(--primary-soft)}.starter-choice small{font-size:7px}.theme-mini-choice{gap:8px;display:flex}.theme-mini-choice button{border:1px solid var(--border);min-height:34px;color:var(--text-muted);background:var(--bg-850);border-radius:7px;align-items:center;gap:7px;padding:0 12px;font-size:8px;display:flex}.theme-mini-choice button.is-active{border-color:var(--primary);color:var(--text)}.theme-mini-choice i{border:1px solid var(--border);border-radius:4px;width:16px;height:16px}.theme-mini-choice i.dark{background:#08101d}.theme-mini-choice i.light{background:#f7f8fc}.delete-preview{border:1px solid var(--border);background:var(--bg-850);border-radius:8px;grid-template-columns:80px 1fr;align-items:center;gap:11px;padding:9px;display:grid}.delete-preview .mini-preview{min-height:48px}.delete-preview>div{flex-direction:column;gap:4px;display:flex}.delete-preview strong{font-size:9px}.delete-preview span{color:var(--text-faint);font-size:8px}.danger-copy{color:#ee9bad;background:#f43f5e0f;border:1px solid #f43f5e2b;border-radius:7px;margin:12px 0 0;padding:10px;font-size:8px;line-height:1.55}.bottom-sheet{border-radius:18px 18px 0 0;align-self:end;width:min(500px,100%)}.sheet-handle{background:var(--text-faint);border-radius:999px;width:42px;height:4px;margin:8px auto 0}.reset-options{flex-direction:column;gap:7px;display:flex}.reset-options>button{border:1px solid var(--border);text-align:left;min-height:66px;color:var(--text-muted);background:var(--bg-850);border-radius:8px;grid-template-columns:38px 1fr auto;align-items:center;gap:10px;padding:9px;display:grid}.reset-options>button>div{flex-direction:column;gap:4px;display:flex}.reset-options strong{color:var(--text);font-size:9px}.reset-options small{color:var(--text-faint);font-size:8px;line-height:1.4}.command-palette{border:1px solid var(--border);background:var(--surface);width:min(560px,100%);box-shadow:var(--shadow-lg);border-radius:12px;align-self:start;margin-top:min(16vh,130px);overflow:hidden}.command-search{border-bottom:1px solid var(--border);min-height:48px;color:var(--text-faint);grid-template-columns:auto 1fr auto;align-items:center;gap:9px;padding:0 12px;display:grid}.command-search input{color:var(--text);background:0 0;border:0;font-size:10px}.command-palette kbd{border:1px solid var(--border);color:var(--text-faint);background:var(--bg-850);font:7px var(--font-mono);border-radius:4px;padding:3px 5px}.command-list{max-height:390px;padding:7px;overflow:auto}.command-list>span{color:var(--text-faint);letter-spacing:.1em;padding:7px;font-size:7px;font-weight:700;display:block}.command-list button{text-align:left;width:100%;min-height:40px;color:var(--text-muted);background:0 0;border-radius:6px;grid-template-columns:27px 1fr auto;align-items:center;gap:8px;padding:0 8px;display:grid}.command-list button:hover{color:var(--text);background:var(--primary-soft)}.command-palette footer{border-top:1px solid var(--border);color:var(--text-faint);align-items:center;gap:15px;padding:8px 12px;font-size:7px;display:flex}.command-palette footer span{align-items:center;gap:4px;display:flex}.responsive-preview{grid-template-columns:1.6fr 1fr .58fr;gap:12px;padding:16px;display:grid}.responsive-preview article{flex-direction:column;gap:7px;display:flex}.responsive-preview article>header{color:var(--text);align-items:center;gap:6px;font-size:9px;font-weight:650;display:flex}.responsive-preview article>header span{color:var(--teal);margin-left:auto;font-size:8px}.preview-frame{border:1px solid var(--border);background:var(--bg-900);border-radius:8px;place-items:center;min-height:330px;padding:10px;display:grid}.preview-frame .mini-preview{width:100%;min-height:220px}.preview-frame--tablet .mini-preview{width:82%;min-height:250px}.preview-frame--mobile .mini-preview{width:88%;min-height:280px}.preview-frame--mobile .mini-preview__hero{width:100%}.preview-frame--mobile .mini-preview__visual{width:100%;height:100px;margin-top:12px;position:relative;top:auto;right:auto}.preview-frame--mobile .mini-preview__tiles{grid-template-columns:1fr;margin-top:10px;position:relative;bottom:auto;left:auto;right:auto}.app-toast{z-index:300;border:1px solid var(--border);background:var(--surface-raised);width:min(360px,100% - 36px);box-shadow:var(--shadow-lg);border-radius:10px;grid-template-columns:36px 1fr auto;align-items:center;gap:10px;padding:10px;display:grid;position:fixed;bottom:18px;right:18px}.app-toast>span{width:34px;height:34px;color:var(--green);background:#22c55e1f;border-radius:8px;place-items:center;display:grid}.app-toast--warning>span{color:var(--amber);background:#f59e0b1f}.app-toast>div{flex-direction:column;gap:3px;display:flex}.app-toast p{color:var(--text-muted);margin:0;font-size:8px}.app-toast>button{color:var(--text-faint);background:0 0}.overlay-fade-enter-active,.overlay-fade-leave-active{transition:opacity var(--ease)}.overlay-fade-enter-active .modal,.overlay-fade-enter-active .command-palette{transition:transform var(--ease), opacity var(--ease)}.overlay-fade-enter-from,.overlay-fade-leave-to{opacity:0}.overlay-fade-enter-from .modal,.overlay-fade-enter-from .command-palette{opacity:0;transform:translateY(10px)scale(.985)}.toast-slide-enter-active,.toast-slide-leave-active{transition:transform var(--ease), opacity var(--ease)}.toast-slide-enter-from,.toast-slide-leave-to{opacity:0;transform:translate(24px)}.mobile-bottom-nav{display:none}@media (width<=1240px){.editor-workspace{grid-template-columns:190px minmax(430px,1fr) 255px}.top-toolbar{grid-template-columns:minmax(180px,1fr) auto minmax(300px,1fr)}.component-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (width<=1023px){.nav-rail{width:56px;padding-left:5px;padding-right:5px}.nav-rail__item span{display:none}.nav-rail__item{min-height:44px}.nav-rail__item.is-active:before{left:-5px}.app-content{margin-left:56px}.top-toolbar{grid-template-columns:1fr auto;gap:7px}.device-switch{grid-area:2/1/auto/-1;justify-self:center;margin-bottom:2px}.top-toolbar__actions{grid-area:1/2}.top-toolbar{min-height:86px}.editor-workspace{grid-template-columns:minmax(0,1fr);min-height:calc(100vh - 86px)}.editor-workspace__library{display:none}.editor-workspace__inspector{border-width:1px 0 0}.inspector{max-height:none}.inspector__scroll{grid-template-columns:repeat(2,minmax(0,1fr));display:grid;overflow:visible}.inspector__scroll .control-section{border-right:1px solid var(--border-soft)}.project-grid,.template-grid,.component-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.settings-layout{grid-template-columns:150px minmax(0,1fr)}.responsive-preview{grid-template-columns:1.25fr .8fr .5fr}}@media (width<=767px){.app-shell{padding-bottom:calc(64px + env(safe-area-inset-bottom))}.app-content{min-height:auto;margin-left:0}.nav-rail{display:none}.top-toolbar{min-height:104px;padding:max(8px, env(safe-area-inset-top)) 10px 7px;grid-template-columns:1fr auto;display:grid;position:sticky}.top-toolbar__mobile-brand{grid-area:1/1;display:block}.project-crumb{border:1px solid var(--border);background:var(--bg-850);border-radius:7px;grid-area:2/1/auto/-1;min-height:35px;padding:0 8px}.project-crumb input{width:100%}.top-toolbar__actions{grid-area:1/2}.top-toolbar__actions .toolbar-button{display:none}.top-toolbar__actions .top-toolbar__more{display:grid}.device-switch{grid-area:3/1/auto/-1;justify-content:center;width:100%;margin:0}.device-switch button,.device-switch select{flex:1}.hide-small,.hide-medium{display:none!important}.editor-workspace{min-height:0;display:block}.editor-workspace__library{display:none}.editor-workspace__main{display:block;overflow:visible}.canvas-workspace{min-height:calc(100dvh - 168px - env(safe-area-inset-bottom))}.mobile-tab--properties .canvas-workspace,.mobile-tab--code .canvas-workspace,.mobile-tab--properties .code-panel,.mobile-tab--canvas .code-panel,.mobile-tab--canvas .inspector,.mobile-tab--code .inspector{display:none}.mobile-tab--properties .inspector{border-width:0;min-height:calc(100dvh - 168px);display:flex}.mobile-tab--code .code-panel{border-width:0;min-height:calc(100dvh - 168px);display:block}.mobile-tab--code .code-panel pre{height:calc(100dvh - 215px);padding:15px 13px;font-size:10px}.inspector__scroll{display:block}.inspector__scroll .control-section{border-right:0}.canvas-toolbar{border:1px solid var(--border);border-radius:8px;margin:8px 9px 0}.canvas-toolbar__left{grid-template-columns:auto 1fr;gap:3px 7px;display:grid}.canvas-toolbar__left strong{grid-area:1/2}.canvas-toolbar__left small{grid-column:1/-1;margin-left:0}.canvas-toolbar__actions .icon-button:first-child{display:none}.canvas-stage{background-size:16px 16px;min-height:330px;padding:32px 22px 23px}.ruler{display:none}.canvas-device,.canvas-device.device--tablet,.canvas-device.device--desktop{width:min(100%,410px);min-height:290px;transform:none}.canvas-device.device--mobile{width:min(100%,340px);min-height:360px}.canvas-device.layout--grid{gap:min(var(--canvas-row-gap), 14px) min(var(--canvas-col-gap), 14px);padding:min(var(--canvas-padding), 16px)}.canvas-item{min-height:72px;padding:8px}.canvas-item strong{font-size:15px}.item-floating-actions{display:none}.canvas-primary-action,.canvas-action-row{display:grid}.canvas-footer{min-height:30px}.code-panel__header,.inspector__header{z-index:3;background:var(--surface);position:sticky;top:104px}.panel-tabs{z-index:3;background:var(--surface);position:sticky;top:155px}.control-section,.panel-section{padding:15px 13px}.field-label{min-height:42px;font-size:10px}.text-input,.select-input,.unit-input,.stepper{min-height:37px;font-size:10px}.stepper{width:134px}.toggle{width:38px;height:22px;padding:2px}.toggle span{width:18px;height:18px}.toggle--on span{transform:translate(16px)}.mobile-bottom-nav{z-index:120;min-height:calc(58px + env(safe-area-inset-bottom));padding:5px 6px env(safe-area-inset-bottom);border-top:1px solid var(--border);background:color-mix(in srgb, var(--surface) 96%, transparent);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);grid-template-columns:repeat(4,1fr);display:grid;position:fixed;bottom:0;left:0;right:0}.mobile-bottom-nav button{color:var(--text-faint);background:0 0;border-radius:7px;flex-direction:column;justify-content:center;align-items:center;gap:3px;display:flex;position:relative}.mobile-bottom-nav button span{font-size:8px;font-weight:650}.mobile-bottom-nav button.is-active{color:#a98cff;background:var(--primary-softer)}.mobile-bottom-nav button.is-active:before{content:"";background:var(--primary-bright);width:30px;height:2px;box-shadow:0 0 10px var(--primary);border-radius:0 0 3px 3px;position:absolute;top:-6px}.mobile-page-bar{z-index:40;min-height:calc(54px + env(safe-area-inset-top));padding:env(safe-area-inset-top) 10px 0;border-bottom:1px solid var(--border);background:color-mix(in srgb, var(--surface) 96%, transparent);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);grid-template-columns:35px 1fr auto;align-items:center;display:grid;position:sticky;top:0}.mobile-page-bar__back{width:32px;height:32px;color:var(--text-muted);background:0 0;place-items:center;display:grid}.mobile-page-bar>div:last-child{gap:4px;display:flex}.mobile-page-bar .icon-button{width:31px;height:31px}.page-view{min-height:calc(100dvh - 112px);padding:18px 12px 28px}.page-heading{align-items:flex-start;margin-bottom:17px}.page-heading h1{font-size:24px}.page-heading p{font-size:10px;line-height:1.5}.page-heading__action{width:36px;min-width:36px;padding:0}.page-heading__action span,.page-heading__action:not(.primary-action){font-size:0}.project-browser{box-shadow:none;background:0 0;border:0}.browser-toolbar{z-index:10;top:calc(54px + env(safe-area-inset-top));background:var(--bg-950);border:0;flex-wrap:wrap;min-height:auto;padding:0 0 10px;position:sticky}.browser-toolbar--templates{background:0 0;border:0;padding:0;position:static}.search-field{flex-basis:100%;max-width:none;min-height:38px}.filter-group--scroll,.filter-group{scrollbar-width:none;width:100%;padding-bottom:2px;overflow-x:auto}.filter-group::-webkit-scrollbar{display:none}.browser-toolbar__right{display:none}.project-grid,.template-grid,.component-grid{grid-template-columns:1fr;gap:9px;padding:0}.project-card{grid-template-columns:106px 1fr;min-height:93px;display:grid}.project-card__preview{padding:7px}.project-card__preview .mini-preview{height:100%;min-height:76px}.project-card__body{border-top:0;border-left:1px solid var(--border);align-items:center;padding:9px}.project-table{display:none}.template-hero{grid-template-columns:1fr;min-height:auto;padding:18px}.template-hero h2{font-size:29px}.template-hero__art{display:none}.template-card,.component-card{grid-template-columns:113px 1fr;display:grid}.template-card__preview,.component-card__preview{padding:7px}.template-card__preview .mini-preview,.component-card__preview .mini-preview{height:100%;min-height:100px}.template-card__body,.component-card__body{align-items:stretch;padding:9px}.template-card__body .primary-action,.component-card__body .primary-action{align-self:flex-end;min-height:29px}.settings-layout{display:block}.settings-nav{display:none}.settings-content{gap:9px}.theme-options{grid-template-columns:repeat(3,1fr);padding:9px}.theme-swatch{height:45px}.theme-options small{display:none}.setting-row{min-height:66px}.overlay-backdrop{align-items:end;padding:0}.modal{border-bottom:0;border-left:0;border-right:0;border-radius:18px 18px 0 0;width:100%;max-height:min(92dvh,850px)}.modal--export,.modal--new-project,.modal--preview{height:92dvh}.modal__header{min-height:65px}.modal__body{padding:13px}.modal__footer{padding-bottom:calc(10px + env(safe-area-inset-bottom))}.export-formats{grid-template-columns:repeat(2,1fr)}.export-options,.export-preview{grid-template-columns:1fr}.file-tree{display:none}.layout-type-grid{grid-template-columns:1fr 1fr}.starter-choice{grid-template-columns:repeat(2,1fr)}.responsive-preview{grid-template-columns:1fr;overflow:auto}.responsive-preview article:not(:last-child){display:none}.preview-frame--mobile .mini-preview{width:min(270px,100%)}.modal--preview .modal__body{padding:0}.command-palette{width:calc(100% - 20px);margin:calc(env(safe-area-inset-top) + 70px) 10px 0;align-self:start}.app-toast{right:10px;bottom:calc(68px + env(safe-area-inset-bottom));width:calc(100% - 20px)}}@media (width<=420px){.canvas-device.layout--grid{--canvas-columns:3!important}.canvas-device.device--mobile.layout--grid{grid-template-columns:repeat(3,minmax(0,1fr))}.canvas-item{min-height:65px}.canvas-item__icon{width:24px;height:24px}.canvas-item strong{font-size:14px}.theme-options{gap:5px}.theme-options button{padding:5px}.setting-select-row{grid-template-columns:1fr}}.status-pill{min-height:24px;color:var(--green);background:color-mix(in srgb, var(--green) 8%, var(--surface-raised));gap:5px;padding:0 9px;font-size:11px}.nav-rail__item span{font-size:10px}.project-crumb input{font-size:13px}.device-switch select,.panel-tabs button,.segmented-control button{font-size:11px}.section-heading>span:first-child,.section-heading button,.quick-template-grid small,.preset-card strong,.library-panel__tip strong,.layer-row{font-size:10px}.preset-card small,.library-panel__tip span,.layer-row small{font-size:9px}.canvas-toolbar__left strong{font-size:12px}.canvas-toolbar__left small,.canvas-footer,.canvas-action-row button{font-size:10px}.ruler{font-size:8px}.canvas-label{padding:4px 8px;font-size:9px}.canvas-item small{font-size:10px}.field-label{font-size:11px}.field-label>small,.two-column-fields>label,.unit-input small,.range-field{font-size:10px}.text-input,.select-input,.unit-input,.stepper,.stepper input,.unit-input input{font-size:11px}.code-input,.item-action-grid button,.color-field span,.audit-card strong{font-size:10px}.code-panel pre{background:var(--code-surface);font-size:10px}.page-view{padding-top:38px}.page-heading{margin-bottom:28px}.page-heading h1{letter-spacing:-.045em;font-size:clamp(34px,3.4vw,48px);font-weight:760;line-height:1.05}.page-heading p{margin-top:10px;font-size:14px;line-height:1.6}.eyebrow{font-size:11px}.project-browser{border-radius:14px}.browser-toolbar{min-height:66px;padding:12px 14px}.search-field{max-width:420px;min-height:40px}.search-field input{font-size:12px}.local-storage-note{border:1px solid var(--border);color:var(--text-muted);background:var(--surface-raised);border-radius:7px;align-items:center;gap:7px;padding:7px 10px;font-size:11px;font-weight:600;display:inline-flex}.local-storage-note svg{color:var(--teal)}.sort-control{color:var(--text-faint);align-items:center;gap:7px;font-size:10px;display:flex}.sort-control select{border:1px solid var(--border);min-height:32px;color:var(--text);background:var(--control-bg);border-radius:7px;padding:0 28px 0 10px;font-size:11px}.project-grid{gap:16px;padding:16px}.project-card{background:var(--surface-raised)}.project-card__preview{background:linear-gradient(145deg, var(--bg-900), var(--surface-strong));padding:12px}.project-card__body{align-items:center;padding:14px}.project-card__body h3{margin:7px 0 5px;font-size:14px;font-weight:700}.project-card__body p{font-size:11px}.project-type-label{color:var(--primary-bright);letter-spacing:.04em;text-transform:uppercase;font-size:10px;font-weight:750}.project-card__actions button{min-width:34px;height:34px;font-size:11px}.project-card__actions .project-open-button{min-width:58px}.project-card__actions .project-delete-button{color:var(--text-faint)}.project-card__actions .project-delete-button:hover{color:var(--danger);border-color:color-mix(in srgb, var(--danger) 42%, var(--border));background:color-mix(in srgb, var(--danger) 8%, var(--surface-raised))}.project-table__head,.project-table article{min-height:56px;font-size:11px}.project-table__head{font-size:9px}.project-table__actions button{min-height:31px;font-size:10px}.empty-state h2{font-size:19px}.empty-state p{font-size:12px}.template-card__body h3,.component-card__body h3{font-size:14px}.template-card__body p,.component-card__body p,.template-hero p{font-size:11px}.template-card__body small,.template-category{font-size:9px}.settings-layout{grid-template-columns:210px minmax(0,820px)}.settings-nav button{min-height:42px;font-size:11px}.setting-group>header{padding:17px}.setting-group h2{font-size:16px}.setting-group p{font-size:11px;line-height:1.55}.theme-options strong,.setting-row strong{font-size:11px}.theme-options small,.setting-row small,.setting-select-row label{font-size:10px}.setting-row{min-height:68px;padding:12px 16px}.local-data-card{grid-template-columns:38px 1fr;align-items:start;gap:12px;padding:17px;display:grid}.local-data-card .setting-row__icon{width:36px;height:36px}.local-data-card strong{color:var(--text-strong);margin-bottom:4px;font-size:12px;display:block}.local-data-card p{color:var(--text-muted);margin:0;font-size:11px}.modal__header h2{font-size:17px}.modal__header p,.field-title,.export-formats strong,.export-options strong,.layout-type-grid strong,.delete-preview strong,.reset-options strong{font-size:11px}.export-formats small,.export-options small,.layout-type-grid small,.starter-choice small,.delete-preview span,.danger-copy,.reset-options small,.theme-mini-choice button,.file-tree,.file-tree strong,.export-preview pre{font-size:10px}.command-search input{font-size:12px}.command-palette kbd,.command-list>span,.command-palette footer{font-size:9px}.command-list strong,.responsive-preview article>header{font-size:11px}.responsive-preview article>header span{font-size:10px}.app-toast strong{font-size:11px}.app-toast p{font-size:10px}.canvas-stage{background-color:var(--canvas);background-image:radial-gradient(circle at 1px 1px, var(--canvas-grid) 1px, transparent 0)}.canvas-device{box-shadow:0 18px 70px #0000002e,inset 0 0 0 1px #ffffff08}:root[data-theme=light] .panel-surface,:root[data-theme=light] .content-card{border-color:var(--border);background:var(--surface);box-shadow:var(--shadow-sm)}:root[data-theme=light] .nav-rail,:root[data-theme=light] .top-toolbar,:root[data-theme=light] .mobile-page-bar,:root[data-theme=light] .mobile-bottom-nav{background:#fffffff0}:root[data-theme=light] .library-panel,:root[data-theme=light] .inspector,:root[data-theme=light] .canvas-toolbar,:root[data-theme=light] .code-panel__header{background:var(--surface)}:root[data-theme=light] .canvas-workspace{background:var(--bg-900)}:root[data-theme=light] .canvas-device{border-color:#7c3aed6b;box-shadow:0 18px 55px #323d5229,inset 0 0 0 1px #fffc}:root[data-theme=light] .canvas-device.show-grid{background-image:linear-gradient(#7c3aed17 1px,#0000 1px),linear-gradient(90deg,#7c3aed17 1px,#0000 1px)}:root[data-theme=light] .canvas-item{color:color-mix(in srgb, var(--tone) 76%, #172033);background:linear-gradient(145deg, color-mix(in srgb, var(--tone-bg) 45%, white), #fff);box-shadow:inset 0 1px #ffffffe6,0 5px 14px #3e485e0f}:root[data-theme=light] .canvas-item strong{color:color-mix(in srgb, var(--tone) 75%, #172033)}:root[data-theme=light] .canvas-item small{color:#64748b}:root[data-theme=light] .segmented-control,:root[data-theme=light] .device-switch,:root[data-theme=light] .view-switch,:root[data-theme=light] .text-input,:root[data-theme=light] .select-input,:root[data-theme=light] .unit-input,:root[data-theme=light] .stepper,:root[data-theme=light] .search-field,:root[data-theme=light] .theme-options button,:root[data-theme=light] .layout-type-grid button,:root[data-theme=light] .starter-choice button,:root[data-theme=light] .reset-options>button,:root[data-theme=light] .delete-preview,:root[data-theme=light] .export-formats button,:root[data-theme=light] .export-options label,:root[data-theme=light] .export-preview{background:var(--control-bg)}:root[data-theme=light] .project-card,:root[data-theme=light] .template-card,:root[data-theme=light] .component-card{background:var(--surface)}:root[data-theme=light] .project-card__preview,:root[data-theme=light] .template-card__preview,:root[data-theme=light] .component-card__preview{background:linear-gradient(145deg,#eef2f8,#f8fafe)}:root[data-theme=light] .mini-preview{background:#f8fafc}:root[data-theme=light] .mini-preview__pricing i,:root[data-theme=light] .mini-preview__quotes i,:root[data-theme=light] .mini-preview__feature i{background:#fff}:root[data-theme=light] .code-panel pre,:root[data-theme=light] .export-preview pre{color:#334155}@media (width<=767px){.page-heading h1{font-size:30px}.page-heading p{font-size:12px}.local-storage-note{display:none}.browser-toolbar{gap:8px}.search-field{min-height:42px}.sort-control{display:none}.project-card__body h3{font-size:13px}.project-card__body p{font-size:10px}.project-type-label{font-size:9px}.mobile-bottom-nav button span{font-size:10px}.field-label,.text-input,.select-input,.unit-input,.stepper{font-size:11px}.theme-options strong{font-size:10px}}.preset-preview{--preview-columns:3;--preview-rows:2;--preview-column-gap:4px;--preview-row-gap:4px;--preview-padding:6px;--preview-justify:center;--preview-align:stretch;width:100%;min-height:112px;padding:var(--preview-padding);border:1px solid color-mix(in srgb, var(--border) 88%, var(--primary) 12%);background-color:var(--canvas-surface);background-image:linear-gradient(var(--canvas-grid) 1px, transparent 1px), linear-gradient(90deg, var(--canvas-grid) 1px, transparent 1px);background-size:12px 12px;border-radius:8px;position:relative;overflow:hidden}.preset-preview--grid{grid-template-columns:repeat(var(--preview-columns), minmax(0, 1fr));grid-template-rows:repeat(var(--preview-rows), minmax(0, 1fr));column-gap:var(--preview-column-gap);row-gap:var(--preview-row-gap);place-content:var(--preview-align) var(--preview-justify);grid-auto-rows:minmax(0,1fr);grid-auto-flow:row;display:grid}.preset-preview--flex{align-items:var(--preview-align);justify-content:var(--preview-justify);column-gap:var(--preview-column-gap);row-gap:var(--preview-row-gap);flex-flow:wrap;display:flex}.preset-preview__item{border:1px solid color-mix(in srgb, var(--tone) 34%, var(--border));min-width:0;min-height:11px;color:var(--tone);background:linear-gradient(145deg, color-mix(in srgb, var(--tone-bg) 88%, transparent), color-mix(in srgb, var(--surface-raised) 84%, transparent));flex-direction:column;justify-content:center;align-items:center;display:flex;overflow:hidden;box-shadow:inset 0 1px #ffffff0d}.preset-preview__item b{font-size:10px;line-height:1}.preset-preview__item small{max-width:92%;color:var(--text-muted);text-overflow:ellipsis;white-space:nowrap;margin-top:3px;font-size:7px;line-height:1;overflow:hidden}.preset-preview--compact{height:47px;min-height:47px;padding:var(--preview-padding);background-size:8px 8px;border-radius:5px}.preset-preview--compact .preset-preview__item{min-height:5px}.quick-template-grid>button .preset-preview{flex:none}.preset-card .preset-preview{width:58px;height:43px;min-height:43px}.template-card__preview .preset-preview{min-height:155px}.template-hero__art .preset-preview{min-height:190px}:root[data-theme=light] .preset-preview{background-color:#f8fafc;border-color:#47556929}:root[data-theme=light] .preset-preview__item{background:linear-gradient(145deg, color-mix(in srgb, var(--tone-bg) 42%, white), #fff);box-shadow:0 4px 12px #2b364c0d,inset 0 1px #fff}.code-panel{z-index:8;flex:0 0 var(--code-panel-height,270px);height:var(--code-panel-height,270px);background:var(--surface);min-height:180px;max-height:72vh;box-shadow:none;transition:height var(--ease), flex-basis var(--ease);border-width:1px 0 0;flex-direction:column;display:flex;position:relative;overflow:hidden}.code-panel.is-resizing{-webkit-user-select:none;user-select:none;transition:none}.code-panel--collapsed{flex-basis:43px;height:43px;min-height:43px;max-height:43px}.code-panel--expanded{flex-basis:min(var(--code-panel-height,58vh), 68vh);height:min(var(--code-panel-height,58vh), 68vh);min-height:380px}.code-panel--fullscreen{z-index:500;background:var(--code-surface);width:100vw;height:100dvh;min-height:100dvh;max-height:none;box-shadow:var(--shadow-lg);border:0;position:fixed;inset:0}.code-resize-handle{z-index:5;cursor:ns-resize;background:0 0;border-radius:999px;place-items:center;width:72px;height:14px;padding:0;display:grid;position:absolute;top:-7px;left:50%;transform:translate(-50%)}.code-resize-handle span{background:var(--text-faint);opacity:.72;width:36px;height:4px;transition:width var(--ease), background var(--ease);border-radius:999px}.code-resize-handle:hover span{background:var(--primary-bright);width:48px}.code-panel__header{background:color-mix(in srgb, var(--surface) 96%, transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);flex:none;gap:10px;min-height:46px;padding:6px 9px}.code-panel--fullscreen .code-panel__header{min-height:58px;padding:8px 14px}.code-tabs{align-items:center;min-width:0}.code-tabs button,.code-panel__actions>button:not(.icon-button){min-height:32px;padding:0 10px;font-size:11px}.code-tabs button.is-active,.code-panel__actions>button.is-active{color:#cbbdff;background:var(--primary-soft)}.code-file-name{min-width:0;color:var(--text-faint);font:10px var(--font-mono);text-overflow:ellipsis;white-space:nowrap;margin-left:6px;overflow:hidden}.code-panel__actions{align-items:center}.code-panel__actions>button:not(.icon-button) span{display:inline}.code-panel__actions .icon-button{width:32px;height:32px}.font-size-label{border:1px solid var(--border);min-width:21px;height:21px;color:var(--text);font:9px var(--font-mono);background:var(--control-bg);border-radius:5px;place-items:center;display:inline-grid}.code-search-bar{border-bottom:1px solid var(--border);min-height:42px;color:var(--text-faint);background:var(--surface-raised);flex:none;grid-template-columns:auto minmax(160px,1fr) auto auto;align-items:center;gap:9px;padding:6px 12px;display:grid}.code-search-bar input{border:1px solid var(--border);width:100%;min-height:29px;color:var(--text);background:var(--control-bg);border-radius:6px;padding:0 9px;font-size:11px}.code-search-bar>span{white-space:nowrap;font-size:10px}.code-search-bar>button{width:28px;height:28px;color:var(--text-muted);background:0 0;border-radius:6px;place-items:center;display:grid}.code-search-bar>button:hover{background:var(--surface-hover)}.code-viewer{color:#c4d3ee;background:var(--code-surface);min-height:0;font:var(--code-font-size,13px)/1.72 var(--font-mono);tab-size:2;scrollbar-gutter:stable;flex:auto;padding:10px 0 18px;overflow:auto}.code-line{border-left:2px solid #0000;grid-template-columns:52px minmax(0,1fr);align-items:start;width:max-content;min-width:100%;display:grid}.code-line:hover{background:color-mix(in srgb, var(--primary) 5%, transparent)}.code-line.is-match{border-left-color:var(--amber);background:color-mix(in srgb, var(--amber) 9%, transparent)}.code-line__number{z-index:1;color:var(--text-faint);text-align:right;-webkit-user-select:none;user-select:none;background:var(--code-surface);padding:0 12px 0 8px;display:block;position:sticky;left:0}.code-line__content{white-space:pre;min-width:max-content;padding-right:24px;display:block}.code-viewer.is-wrapped .code-line{width:100%}.code-viewer.is-wrapped .code-line__content{white-space:pre-wrap;overflow-wrap:anywhere;min-width:0}.token-tag{color:#c4a7ff}.token-attribute{color:#7dd3fc}.token-string{color:#86efac}.token-selector{color:#c4a7ff}.token-property{color:#7dd3fc}.token-number{color:#fbbf7a}.token-punctuation{color:#91a0b8}.code-panel__footer{border-top:1px solid var(--border);min-height:36px;color:var(--text-faint);background:var(--surface);flex:none;justify-content:space-between;align-items:center;gap:16px;padding:6px 14px;font-size:10px;display:flex}.code-panel__footer kbd{border:1px solid var(--border);color:var(--text-muted);background:var(--control-bg);font:9px var(--font-mono);border-radius:4px;padding:3px 6px}.editor-workspace__main:has(.code-panel--expanded) .canvas-workspace{min-height:270px}:root[data-theme=light] .code-viewer,:root[data-theme=light] .code-line__number,:root[data-theme=light] .code-panel--fullscreen{color:#334155;background:#f8fafc}:root[data-theme=light] .token-tag,:root[data-theme=light] .token-selector{color:#7c3aed}:root[data-theme=light] .token-attribute,:root[data-theme=light] .token-property{color:#0369a1}:root[data-theme=light] .token-string{color:#15803d}:root[data-theme=light] .token-number{color:#b45309}:root[data-theme=light] .token-punctuation{color:#64748b}@media (width<=1180px){.code-panel__actions>button:not(.icon-button) span:not(.font-size-label),.code-file-name{display:none}}@media (width<=767px){.mobile-tab--code .code-panel{height:calc(100dvh - 168px - env(safe-area-inset-bottom));min-height:calc(100dvh - 168px - env(safe-area-inset-bottom));border-width:0;max-height:none;display:flex}.mobile-tab--code .code-panel--collapsed{height:43px;min-height:43px}.mobile-tab--code .code-panel__header{min-height:48px;padding:6px;position:sticky;top:104px}.mobile-tab--code .code-viewer{height:auto;font-size:max(12px, var(--code-font-size,13px));padding-bottom:36px}.code-panel--fullscreen{height:100dvh!important;min-height:100dvh!important}.code-panel--fullscreen .code-panel__header{flex-wrap:wrap;min-height:96px;position:static}.code-panel--fullscreen .code-tabs{width:100%}.code-panel--fullscreen .code-panel__actions{justify-content:flex-end;width:100%}.code-tabs button{flex:1;padding:0 7px}.code-line{grid-template-columns:42px minmax(0,1fr)}.code-line__number{padding-right:9px}.code-search-bar{grid-template-columns:auto minmax(0,1fr) auto}.code-search-bar>span{display:none}.code-panel__footer{flex-wrap:wrap;justify-content:flex-start}.template-card__preview .preset-preview{min-height:110px}.template-hero__art .preset-preview{min-height:150px}}.canvas-device.layout--flex{flex-direction:var(--canvas-flex-direction,row);flex-wrap:var(--canvas-flex-wrap,wrap);align-content:stretch}.preset-preview--flex{flex-direction:var(--preview-flex-direction,row);flex-wrap:var(--preview-flex-wrap,wrap)}.preset-preview__item.kind--divider{opacity:.55;align-self:center;min-height:2px}.preset-preview__item.kind--spacer{opacity:.35;background:0 0;border-style:dashed;min-height:4px}.preset-preview__item.kind--button{min-height:16px;box-shadow:0 4px 12px color-mix(in srgb, var(--tone) 16%, transparent)}.preset-preview__item.kind--image{background-image:linear-gradient(135deg, color-mix(in srgb, var(--tone-bg) 82%, transparent), color-mix(in srgb, var(--tone) 18%, var(--surface-raised)))}.toolbar-button--accent{color:var(--text-strong);border-color:color-mix(in srgb, var(--primary) 46%, var(--border));background:var(--primary-soft)}.toolbar-button--accent:hover{border-color:var(--primary-bright);background:color-mix(in srgb, var(--primary-soft) 80%, var(--surface-hover))}.add-item-menu{min-width:0;display:inline-flex;position:relative}.add-item-menu--canvas{width:100%;display:block}.add-item-menu--canvas .add-item-menu__trigger{justify-content:center;width:100%}.add-item-menu__trigger{white-space:nowrap}.add-item-popover{z-index:180;border:1px solid var(--border-strong);background:var(--surface-raised);width:280px;max-height:min(430px,70vh);box-shadow:var(--shadow-lg);border-radius:11px;padding:7px;display:grid;position:absolute;top:calc(100% + 8px);right:0;overflow:auto}.add-item-menu--canvas .add-item-popover{left:0;right:auto}.add-item-popover header{border-bottom:1px solid var(--border);flex-direction:column;gap:3px;padding:7px 8px 9px;display:flex}.add-item-popover header strong{color:var(--text-strong);font-size:11px}.add-item-popover header span{color:var(--text-faint);font-size:9px}.add-item-popover>button{text-align:left;min-height:48px;color:var(--text-muted);background:0 0;border-radius:7px;grid-template-columns:34px minmax(0,1fr);align-items:center;gap:9px;padding:6px 8px;display:grid}.add-item-popover>button:hover{color:var(--text);background:var(--primary-soft)}.add-item-popover>button>span{border:1px solid var(--border);width:32px;height:32px;color:var(--primary-bright);background:var(--control-bg);border-radius:8px;place-items:center;display:grid}.add-item-popover>button>div{flex-direction:column;gap:3px;min-width:0;display:flex}.add-item-popover>button strong{color:var(--text);font-size:10px}.add-item-popover>button small{color:var(--text-faint);font-size:9px}.library-add-control{margin-top:9px}.canvas-inline-add{z-index:7;position:absolute;bottom:8px;right:8px}.canvas-inline-add .add-item-menu__trigger{color:#fff;border-color:color-mix(in srgb, var(--primary) 70%, white 10%);background:var(--primary);width:30px;height:30px;box-shadow:0 8px 22px #3c1c9652}.canvas-inline-add .add-item-popover{inset:auto 0 calc(100% + 8px) auto}.canvas-item.kind--divider{opacity:.65;align-self:center;min-height:3px;padding:0}.canvas-item.kind--spacer{opacity:.55;background:0 0;border-style:dashed;min-height:34px}.canvas-item.kind--image{background-image:linear-gradient(135deg, color-mix(in srgb, var(--tone-bg) 88%, transparent), color-mix(in srgb, var(--tone) 14%, var(--bg-900)))}.item-floating-actions button{width:23px;height:23px;color:var(--text-muted);background:0 0;border-radius:4px;place-items:center;display:grid}.item-floating-actions button:hover{color:var(--text);background:var(--primary-soft)}.item-floating-actions button:disabled{opacity:.35}.three-column-fields{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;display:grid}.item-action-grid--four{grid-template-columns:repeat(2,minmax(0,1fr))}.add-after-template-card{border:1px solid color-mix(in srgb, var(--primary) 30%, var(--border));background:var(--primary-softer);border-radius:9px;grid-template-columns:28px minmax(0,1fr) auto;align-items:center;gap:9px;margin:10px;padding:10px;display:grid}.add-after-template-card>svg{color:var(--primary-bright)}.add-after-template-card>div{flex-direction:column;gap:3px;min-width:0;display:flex}.add-after-template-card strong{color:var(--text);font-size:10px}.add-after-template-card span{color:var(--text-faint);font-size:9px;line-height:1.35}.template-result-count{color:var(--text-faint);white-space:nowrap;margin-left:auto;font-size:10px}.template-card__meta{justify-content:space-between;align-items:center;gap:8px;display:flex}.template-card__meta>span:last-child{color:var(--text-faint);font-size:8px}.template-tags{flex-wrap:wrap;gap:4px;margin:7px 0;display:flex}.template-tags span{border:1px solid var(--border);color:var(--text-faint);background:var(--control-bg);border-radius:999px;padding:3px 6px;font-size:7px}.template-empty{text-align:center;align-content:center;place-items:center;gap:9px;max-width:620px;min-height:300px;margin:30px auto;padding:30px;display:grid}.template-empty h2{color:var(--text-strong);margin:3px 0 0;font-size:20px}.template-empty p{color:var(--text-muted);margin:0 0 8px;font-size:11px}.code-edit-badge{color:var(--green);text-transform:uppercase;letter-spacing:.06em;background:#22c55e14;border:1px solid #22c55e3d;border-radius:999px;padding:4px 7px;font-size:8px;font-weight:700}.code-action-apply{color:#d8ffe5!important;background:#22c55e24!important}.code-edit-notice{border-bottom:1px solid var(--border);min-height:39px;color:var(--text-muted);background:color-mix(in srgb, var(--primary-soft) 55%, var(--surface));flex:none;align-items:center;gap:8px;padding:6px 13px;font-size:10px;display:flex}.code-edit-notice svg{color:var(--primary-bright);flex:none}.code-edit-notice kbd{border:1px solid var(--border);color:var(--text);background:var(--control-bg);font:9px var(--font-mono);border-radius:4px;padding:2px 5px}.code-editor-textarea{resize:none;color:#cbd8f0;background:var(--code-surface);width:100%;min-height:0;font:var(--code-font-size,13px)/1.7 var(--font-mono);tab-size:2;white-space:pre;border:0;outline:0;flex:auto;padding:16px 18px 26px}:root[data-theme=light] .code-editor-textarea{color:#24324b}.code-panel.is-editing .code-panel__header{border-bottom-color:color-mix(in srgb, var(--primary) 35%, var(--border))}@media (width<=1180px){.top-toolbar__actions .add-item-menu__trigger span,.top-toolbar__actions .add-item-menu__trigger svg:last-child{display:none}.top-toolbar__actions .add-item-menu__trigger{justify-content:center;width:34px;padding:0}.template-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=767px){.add-item-popover{z-index:260;right:10px;bottom:calc(68px + env(safe-area-inset-bottom));width:auto;max-height:58vh;position:fixed;top:auto;left:10px}.canvas-inline-add .add-item-popover{right:10px;bottom:calc(68px + env(safe-area-inset-bottom));position:fixed;top:auto;left:10px}.template-result-count{display:none}.three-column-fields{grid-template-columns:repeat(3,minmax(0,1fr))}.code-edit-notice{align-items:flex-start;font-size:9px;line-height:1.4}.code-editor-textarea{font-size:max(13px, var(--code-font-size));padding:14px 12px 90px}}.current-layout-preview{grid-template-columns:repeat(var(--live-columns), minmax(0, 1fr));grid-template-rows:repeat(var(--live-rows), minmax(24px, auto));column-gap:var(--live-column-gap);row-gap:var(--live-row-gap);align-items:var(--live-align);justify-content:var(--live-justify);width:100%;min-height:220px;padding:var(--live-padding);border:1px solid var(--border);background-color:var(--live-background);background-image:linear-gradient(var(--canvas-grid) 1px, transparent 1px), linear-gradient(90deg, var(--canvas-grid) 1px, transparent 1px);background-size:12px 12px;border-radius:8px;display:grid;position:relative;overflow:hidden}.current-layout-preview--flex{flex-direction:var(--live-direction);flex-wrap:var(--live-wrap);display:flex}.current-layout-preview__item{border:1px solid color-mix(in srgb, var(--tone) 34%, var(--border));min-width:0;min-height:24px;color:var(--tone);background:linear-gradient(145deg, color-mix(in srgb, var(--tone-bg) 88%, transparent), color-mix(in srgb, var(--surface-raised) 84%, transparent));flex-direction:column;justify-content:center;align-items:center;display:flex;overflow:hidden}.current-layout-preview__item b{font-size:9px}.current-layout-preview__item small{max-width:90%;color:var(--text-muted);text-overflow:ellipsis;white-space:nowrap;font-size:7px;overflow:hidden}.current-layout-preview__item.kind--divider{opacity:.55;align-self:center;min-height:2px}.current-layout-preview__item.kind--spacer{opacity:.35;background:0 0;border-style:dashed;min-height:8px}:root{--ui-copy-size:12px;--ui-label-size:12px}.panel-tabs button{font-size:12px}.section-heading>span:first-child,.section-heading button{font-size:11px}.segmented-control button{min-height:34px;font-size:12px}.inspector__header{min-height:58px;padding:10px 14px}.inspector__header span{font-size:10px}.inspector__header strong{font-size:14px}.inspector__header .icon-button{width:34px;height:34px}.field-label{min-height:40px;font-size:12px}.field-label--stack{gap:7px;margin-bottom:12px}.field-label>small,.field-label span small{font-size:10px}.text-input,.select-input,.unit-input,.stepper{border-radius:8px;min-height:38px;font-size:12px}.text-input{padding:0 11px}.text-area-input{resize:vertical;min-height:64px;padding:9px 11px;line-height:1.45}.code-input{font-size:11px}.select-input{padding-left:11px}.stepper{grid-template-columns:34px 1fr 34px;width:126px}.stepper input,.unit-input input{height:36px;font-size:12px}.unit-input small{font-size:10px}.two-column-fields>label,.three-column-fields>label,.range-field{font-size:11px}.item-action-grid button{min-height:38px;font-size:11px}.audit-card strong{font-size:12px}.audit-card span{font-size:11px}.selection-chip{min-height:23px;font-size:10px}.add-item-popover{border-radius:14px;width:342px;max-height:min(620px,76vh);padding:9px}.add-item-popover header{gap:4px;padding:10px 11px 12px}.add-item-popover header strong{font-size:14px}.add-item-popover header span{font-size:11px;line-height:1.4}.add-item-popover__group-label{color:var(--text-faint);letter-spacing:.08em;text-transform:uppercase;padding:11px 10px 5px;font-size:10px;font-weight:800}.add-item-popover>button{border-radius:10px;grid-template-columns:42px minmax(0,1fr);gap:12px;min-height:60px;padding:8px 10px}.add-item-popover>button:hover,.add-item-popover>button:focus-visible{color:var(--text);background:var(--primary-soft);box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--primary) 34%, transparent);outline:0}.add-item-popover>button>span{border-radius:10px;width:40px;height:40px}.add-item-popover>button>div{gap:4px}.add-item-popover>button strong{font-size:13px}.add-item-popover>button small{color:var(--text-muted);font-size:11px;line-height:1.35}.add-item-popover footer{border-top:1px solid var(--border);color:var(--text-faint);align-items:center;gap:5px;margin-top:7px;padding:9px 10px 3px;font-size:9px;display:flex}.add-item-popover footer kbd{border:1px solid var(--border);color:var(--text-muted);background:var(--control-bg);font:9px var(--font-mono);border-radius:4px;padding:2px 5px}.add-item-popover footer span{margin-right:6px}.add-item-menu__trigger{font-size:13px}.canvas-inline-add .add-item-menu__trigger{width:34px;height:34px}.canvas-item{min-height:94px;padding:14px}.canvas-item__icon{border-radius:9px;width:32px;height:32px;margin-bottom:7px}.canvas-item strong{font-size:18px}.canvas-item small{font-size:10px;line-height:1.35}.canvas-item em{color:var(--text-faint);margin-top:4px;font-size:9px;font-style:normal}.canvas-item__description{max-width:28ch;color:var(--text-faint);margin:6px 0 0;font-size:10px;line-height:1.45}.canvas-item__heading{letter-spacing:-.02em!important;font-size:17px!important}.canvas-item__copy{max-width:38ch;color:var(--text-muted);text-align:center;margin:5px 0 0;font-size:11px;line-height:1.5}.canvas-button-preview{color:#fff;background:var(--tone);min-height:38px;box-shadow:0 8px 20px color-mix(in srgb, var(--tone) 25%, transparent);border-radius:8px;justify-content:center;align-items:center;gap:7px;padding:0 17px;font-size:12px;font-weight:750;display:inline-flex}.canvas-image-placeholder{border:1px dashed color-mix(in srgb, var(--tone) 54%, var(--border));background:color-mix(in srgb, var(--tone-bg) 55%, transparent);border-radius:8px;place-items:center;width:min(100%,120px);min-height:42px;margin-bottom:7px;display:grid}.canvas-divider-line{opacity:.5;background:currentColor;width:100%;height:1px}.canvas-item.kind--divider{min-height:32px;padding:8px 12px}.canvas-item.kind--button{min-height:70px}.canvas-item.kind--text{text-align:left;align-items:flex-start}.canvas-item.kind--text .canvas-item__copy{text-align:left}.canvas-item.kind--image{min-height:116px}.item-floating-actions button{width:27px;height:27px}.canvas-item.is-container{justify-content:flex-start;align-items:stretch;min-height:150px;padding:8px;overflow:visible}.canvas-item__container-header{align-items:center;gap:8px;min-height:36px;padding:5px 7px 8px;display:flex}.canvas-item__container-header .canvas-item__icon{width:28px;height:28px;margin:0}.canvas-item__container-header>div{flex-direction:column;flex:1;align-items:flex-start;min-width:0;display:flex}.canvas-item__container-header strong{letter-spacing:-.01em;font-size:12px}.canvas-item__container-header small{font-size:9px}.container-type-chip{border:1px solid var(--border);color:var(--text-faint);background:var(--control-bg);text-transform:uppercase;border-radius:999px;padding:3px 6px;font-size:8px;font-weight:750}.canvas-item__children{grid-template-columns:repeat(var(--nested-columns), minmax(0, 1fr));grid-template-rows:repeat(var(--nested-rows), minmax(54px, auto));column-gap:var(--nested-column-gap);row-gap:var(--nested-row-gap);align-items:var(--nested-align);justify-content:var(--nested-justify);min-height:92px;padding:var(--nested-padding);border:1px dashed color-mix(in srgb, var(--tone) 35%, var(--border));background:color-mix(in srgb, var(--canvas-surface) 88%, transparent);border-radius:8px;flex:1;display:grid;position:relative}.canvas-item__children.layout--flex{flex-direction:var(--nested-direction);flex-wrap:var(--nested-wrap);display:flex}.canvas-item__children>.canvas-item{min-height:62px;padding:8px}.canvas-item__children>.canvas-item strong{font-size:13px}.canvas-item__children>.canvas-item small{font-size:8px}.canvas-item__children .canvas-item__children{min-height:70px}.nested-empty-add{border:1px dashed var(--border-strong);min-height:52px;color:var(--text-muted);background:var(--primary-softer);border-radius:7px;justify-content:center;align-items:center;gap:7px;font-size:11px;display:inline-flex}.nested-empty-add:hover{color:var(--text);background:var(--primary-soft)}.icon-select-field{grid-template-columns:42px minmax(0,1fr);gap:7px;display:grid}.icon-select-field__preview{border:1px solid var(--border);min-height:38px;color:var(--primary-bright);background:var(--control-bg);border-radius:8px;place-items:center;display:grid}.content-help{border:1px solid color-mix(in srgb, var(--primary) 23%, var(--border));color:var(--text-muted);background:var(--primary-softer);border-radius:8px;align-items:flex-start;gap:8px;padding:10px;font-size:10px;line-height:1.45;display:flex}.content-help svg{color:var(--primary-bright);flex:none}.nested-container-controls .primary-action{width:100%}.item-action-grid--production{grid-template-columns:repeat(2,minmax(0,1fr))}.layer-row{padding-left:calc(8px + var(--layer-depth,0) * 14px)}.layer-row.is-container{color:var(--text);background:color-mix(in srgb, var(--primary-soft) 42%, transparent)}.layer-row small{text-transform:capitalize;font-size:8px}.current-layout-preview{background-color:var(--live-background);background-image:linear-gradient(var(--canvas-grid) 1px, transparent 1px), linear-gradient(90deg, var(--canvas-grid) 1px, transparent 1px);background-size:12px 12px;border:0;min-height:220px;padding:0;display:block}.current-layout-preview>.preset-preview{min-height:inherit;border:1px solid var(--border);background-color:var(--live-background)}.current-layout-preview--tablet{width:82%;min-height:250px;margin:auto}.current-layout-preview--mobile{width:88%;min-height:280px;margin:auto}.preview-container-header{align-items:center;gap:3px;padding:2px;display:flex}.preview-container-children{grid-template-columns:repeat(var(--preview-columns), minmax(0, 1fr));grid-template-rows:repeat(var(--preview-rows), minmax(8px, auto));column-gap:var(--preview-column-gap);row-gap:var(--preview-row-gap);align-items:var(--preview-align);justify-content:var(--preview-justify);min-height:65%;padding:var(--preview-padding);border:1px dashed color-mix(in srgb, var(--tone) 28%, var(--border));border-radius:4px;flex:1;display:grid}.preview-container-children.preset-preview--flex{flex-direction:var(--preview-flex-direction);flex-wrap:var(--preview-flex-wrap);display:flex}.preset-preview__item.is-container{flex-direction:column;justify-content:flex-start;align-items:stretch;padding:3px;display:flex}.preset-preview--labels .preset-preview__item>svg{flex:none}.project-card__preview .preset-preview{min-height:150px}.project-table__name .preset-preview{width:72px;min-height:42px}.code-validation-chip{border:1px solid var(--border);white-space:nowrap;border-radius:999px;align-items:center;gap:4px;min-height:22px;margin-left:5px;padding:0 7px;font-size:9px;font-weight:700;display:inline-flex}.code-validation-chip.is-success{color:var(--green);border-color:color-mix(in srgb, var(--green) 28%, var(--border));background:color-mix(in srgb, var(--green) 8%, transparent)}.code-validation-chip.is-warning{color:var(--amber);border-color:color-mix(in srgb, var(--amber) 28%, var(--border));background:color-mix(in srgb, var(--amber) 8%, transparent)}.code-validation-chip.is-error{color:var(--danger);border-color:color-mix(in srgb, var(--danger) 28%, var(--border));background:color-mix(in srgb, var(--danger) 8%, transparent)}.code-tabs button,.code-panel__actions>button:not(.icon-button),.code-file-name{font-size:10px}.code-edit-notice{font-size:11px}.export-validation{border:1px solid color-mix(in srgb, var(--green) 28%, var(--border));color:var(--green);background:color-mix(in srgb, var(--green) 7%, var(--surface));border-radius:9px;align-items:flex-start;gap:9px;margin-bottom:12px;padding:10px 12px;display:flex}.export-validation.has-warnings{color:var(--amber);border-color:color-mix(in srgb, var(--amber) 30%, var(--border));background:color-mix(in srgb, var(--amber) 7%, var(--surface))}.export-validation.has-errors{color:var(--danger);border-color:color-mix(in srgb, var(--danger) 30%, var(--border));background:color-mix(in srgb, var(--danger) 7%, var(--surface))}.export-validation div{flex-direction:column;gap:3px;min-width:0;display:flex}.export-validation strong{font-size:11px}.export-validation span{color:var(--text-muted);font-size:10px;line-height:1.4}.starter-choice--live button{padding:7px}.starter-choice--live .preset-preview{min-height:70px}.starter-choice--live small{font-size:10px}:root[data-theme=light] .add-item-popover{background:#fff;box-shadow:0 28px 80px #2b364c33}:root[data-theme=light] .canvas-item__children{background:#f8fafce0}:root[data-theme=light] .content-help{background:#7c3aed0e}:root[data-theme=light] .icon-select-field__preview{background:#f7f8fc}:root[data-theme=light] .export-validation{background:#f7fff9}:root[data-theme=light] .export-validation.has-warnings{background:#fffbeb}:root[data-theme=light] .export-validation.has-errors{background:#fff5f7}@media (width<=1180px){.add-item-popover{width:320px}.code-validation-chip{display:none}}@media (width<=767px){.add-item-popover{border-radius:16px 16px 0 0;padding:10px}.add-item-popover>button{min-height:62px}.add-item-popover footer{padding-bottom:10px}.canvas-item{min-height:78px}.canvas-item.is-container{min-height:138px}.canvas-item__children{padding:8px}.item-action-grid--production{grid-template-columns:repeat(2,minmax(0,1fr))}.project-card__preview .preset-preview{min-height:88px}.starter-choice--live .preset-preview{min-height:58px}}.nav-rail__item--support{color:color-mix(in srgb, var(--text-faint) 82%, var(--rose))}.nav-rail__item--support:hover{color:#ff8aa4;background:color-mix(in srgb, var(--rose) 9%, var(--surface-hover))}.nav-rail__item--support.is-active{color:#ff9ab0;background:color-mix(in srgb, var(--rose) 13%, var(--surface))}.nav-rail__item--support.is-active:before{background:var(--rose);box-shadow:0 0 14px color-mix(in srgb, var(--rose) 72%, transparent)}.support-menu{flex:none;position:relative}.support-menu__trigger{color:color-mix(in srgb, var(--text-muted) 84%, var(--rose))}.support-menu__trigger:hover,.support-menu__trigger.is-active{color:#ff91aa;border-color:color-mix(in srgb, var(--rose) 34%, var(--border));background:color-mix(in srgb, var(--rose) 10%, var(--surface-raised))}.support-popover{z-index:95;border:1px solid var(--border);width:min(320px,100vw - 24px);color:var(--text);background:color-mix(in srgb, var(--surface) 97%, transparent);box-shadow:var(--shadow-lg);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);transform-origin:100% 0;border-radius:14px;position:absolute;top:calc(100% + 10px);right:0;overflow:hidden}.support-popover:before{content:"";border-top:1px solid var(--border);border-left:1px solid var(--border);background:var(--surface);width:11px;height:11px;position:absolute;top:-6px;right:12px;transform:rotate(45deg)}.support-popover__header{border-bottom:1px solid var(--border-soft);grid-template-columns:38px minmax(0,1fr);align-items:start;gap:11px;padding:15px 15px 13px;display:grid}.support-popover__icon{border:1px solid color-mix(in srgb, var(--rose) 28%, var(--border));color:#ff7898;background:color-mix(in srgb, var(--rose) 11%, var(--surface-raised));border-radius:11px;place-items:center;width:38px;height:38px;display:grid}.support-popover__header strong{color:var(--text-strong);letter-spacing:-.015em;font-size:14px;display:block}.support-popover__header p{color:var(--text-muted);margin:4px 0 0;font-size:11px;line-height:1.45}.support-popover__links{gap:5px;padding:8px;display:grid}.support-popover__links a,.support-link-grid a,.support-modal__links a{min-width:0;color:var(--text);transition:border-color var(--ease), background var(--ease), transform var(--ease);border:1px solid #0000;border-radius:10px;grid-template-columns:40px minmax(0,1fr) 18px;align-items:center;gap:11px;text-decoration:none;display:grid}.support-popover__links a{min-height:64px;padding:8px}.support-popover__links a:hover,.support-link-grid a:hover,.support-modal__links a:hover{border-color:var(--border-strong);background:var(--primary-softer);transform:translateY(-1px)}.support-popover__links a>div,.support-link-grid a>div,.support-modal__links a>div{flex-direction:column;gap:3px;min-width:0;display:flex}.support-popover__links strong,.support-link-grid strong,.support-modal__links strong{color:var(--text-strong);font-size:12px}.support-popover__links small,.support-link-grid small,.support-modal__links small{color:var(--text-muted);font-size:10px;line-height:1.4}.support-popover__links a>svg,.support-link-grid a>svg,.support-modal__links a>svg{color:var(--text-faint)}.support-popover footer{border-top:1px solid var(--border-soft);color:var(--text-faint);padding:9px 14px 11px;font-size:9px}.support-popover-enter-active,.support-popover-leave-active{transition:opacity var(--ease), transform var(--ease)}.support-popover-enter-from,.support-popover-leave-to{opacity:0;transform:translateY(-5px)scale(.98)}.support-service-icon{border:1px solid var(--border);border-radius:10px;place-items:center;width:40px;height:40px;display:grid}.support-service-icon--kofi{color:#ff6584;background:color-mix(in srgb, #ff6584 10%, var(--surface-raised))}.support-service-icon--buy-me-a-coffee{color:#f6b94d;background:color-mix(in srgb, #f6b94d 11%, var(--surface-raised))}.support-settings-card>header{justify-content:space-between;align-items:flex-start;gap:14px;display:flex}.support-settings-card__badge{border:1px solid color-mix(in srgb, var(--rose) 25%, var(--border));color:#ff8ca5;background:color-mix(in srgb, var(--rose) 8%, var(--surface));white-space:nowrap;border-radius:999px;align-items:center;gap:5px;min-height:26px;padding:0 9px;font-size:10px;font-weight:750;display:inline-flex}.support-settings-card__body{gap:14px;padding:16px;display:grid}.support-settings-card__intro{grid-template-columns:46px minmax(0,1fr);align-items:start;gap:13px;display:grid}.support-settings-card__mark{border:1px solid color-mix(in srgb, var(--rose) 28%, var(--border));color:#ff7898;background:linear-gradient(145deg, color-mix(in srgb, var(--rose) 13%, var(--surface-raised)), var(--surface-raised));width:46px;height:46px;box-shadow:0 10px 28px color-mix(in srgb, var(--rose) 10%, transparent);border-radius:13px;place-items:center;display:grid}.support-settings-card__intro strong{color:var(--text-strong);font-size:13px;display:block}.support-settings-card__intro p{color:var(--text-muted);margin:5px 0 0;font-size:11px;line-height:1.55}.support-link-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;display:grid}.support-link-grid a{border-color:var(--border);background:var(--control-bg);min-height:78px;padding:10px}.about-flexforge-card__body{grid-template-columns:40px minmax(0,1fr);align-items:start;gap:13px;padding:16px;display:grid}.about-flexforge-card__body>div>strong{color:var(--text-strong);font-size:12px;display:block}.about-flexforge-card__body>div>p{color:var(--text-muted);margin:5px 0 0;font-size:11px;line-height:1.55}.about-flexforge-card__links{flex-wrap:wrap;gap:7px;margin-top:11px;display:flex}.about-flexforge-card__links a{border:1px solid var(--border);min-height:30px;color:var(--primary-bright);background:var(--control-bg);border-radius:7px;align-items:center;gap:5px;padding:0 10px;font-size:10px;font-weight:700;text-decoration:none;display:inline-flex}.about-flexforge-card__links a:hover{border-color:var(--border-strong);background:var(--primary-softer)}.modal--support{width:min(530px,100%)}.support-modal__body{gap:13px;display:grid}.support-modal__message{border:1px solid color-mix(in srgb, var(--teal) 26%, var(--border));color:var(--teal);background:color-mix(in srgb, var(--teal) 7%, var(--surface));border-radius:10px;align-items:flex-start;gap:10px;padding:11px 12px;display:flex}.support-modal__message svg{flex:none;margin-top:1px}.support-modal__message p{color:var(--text-muted);margin:0;font-size:11px;line-height:1.5}.support-modal__links{gap:8px;display:grid}.support-modal__links a{border-color:var(--border);background:var(--control-bg);min-height:78px;padding:10px 12px}.support-modal__thanks{color:var(--text-faint);text-align:center;margin:0;padding:2px 2px 0;font-size:10px}:root[data-theme=light] .support-popover{background:#fffffffa;box-shadow:0 24px 70px #2b364c2e}:root[data-theme=light] .support-popover:before{background:#fff}:root[data-theme=light] .support-link-grid a,:root[data-theme=light] .support-modal__links a{background:#f8fafe}:root[data-theme=light] .support-modal__message{background:#f2fffb}@media (width<=1023px){.support-popover{right:-42px}.support-popover:before{right:54px}}@media (width<=767px){.top-toolbar .support-menu{display:none}.support-settings-card>header{align-items:flex-start}.support-settings-card__badge{display:none}.support-settings-card__body{padding:13px}.support-link-grid{grid-template-columns:1fr}.support-link-grid a,.support-modal__links a{min-height:74px}.about-flexforge-card__body{padding:13px}.modal--support{max-height:min(88dvh,720px)}}