:root{--bg: #edf3fb;--bg-deep: #e8f0fa;--text: #1c2738;--muted: #5a6d84;--muted-2: #70829a;--panel: #fefefe;--panel-2: #f2f7fc;--panel-3: #e8f1fb;--outline: #9cb0c8;--outline-soft: #bfd0e3;--accent: #0f766e;--accent-deep: #0a5c56;--accent-soft: #14b8a6;--warn: #c2410c;--danger: #b42318;--success: #0f766e;--radius-sm: 10px;--radius-md: 14px;--radius-lg: 18px;--radius-xl: 22px;--radius-2xl: 28px;--display-font: Inter, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--ui-font: Inter, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--app-page-zoom: .8;--floating-pane-clearance: 112px}*{box-sizing:border-box}html,body,#root{min-height:100dvh;height:100dvh}body{margin:0;color:var(--text);font-family:var(--ui-font);background:radial-gradient(circle at 10% -10%,rgba(20,184,166,.16),transparent 36%),radial-gradient(circle at 92% 2%,rgba(234,88,12,.12),transparent 28%),linear-gradient(155deg,#f4f7fc,#eaf2fb 52%,#fdf3e9);background-attachment:fixed;overflow:hidden}input,select,textarea,button{font:inherit;color:inherit}.app-shell{width:min(calc(1380px / var(--app-page-zoom)),calc((100% - 32px) / var(--app-page-zoom)));margin:0 auto;padding:14px 0 96px;height:calc(100dvh / var(--app-page-zoom));max-height:calc(100dvh / var(--app-page-zoom));display:grid;grid-template-columns:620px minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);column-gap:20px;row-gap:18px;overflow:hidden;zoom:var(--app-page-zoom)}.shared-page-shell{width:min(calc(1120px / var(--app-page-zoom)),calc((100% - 32px) / var(--app-page-zoom)));margin:0 auto;padding:14px 0 18px;height:calc(100dvh / var(--app-page-zoom));max-height:calc(100dvh / var(--app-page-zoom));display:grid;grid-template-rows:auto minmax(0,1fr);gap:18px;overflow:hidden;zoom:var(--app-page-zoom)}.shared-page{min-height:0;display:grid;align-content:start;justify-items:center;overflow:auto;padding:6px 4px 28px}.shared-page-header{position:sticky}.shared-page-card{width:min(700px,100%);display:grid;gap:16px;padding:24px;border:1px solid rgba(148,168,192,.62);border-bottom:3px solid rgba(132,154,181,.82);border-radius:28px;background:radial-gradient(circle at 16% 12%,rgba(20,184,166,.1),transparent 34%),radial-gradient(circle at 84% 6%,rgba(245,158,11,.12),transparent 28%),linear-gradient(180deg,#fffffffa,#f0f8fff5);box-shadow:0 28px 70px #28446024}.shared-page-copy,.shared-page-state{display:grid;gap:12px;justify-items:center;text-align:center}.shared-page-eyebrow{margin:0;color:var(--accent);font-size:12px;font-weight:800;letter-spacing:.18em;text-transform:uppercase}.shared-page-copy h1,.shared-page-state h1{margin:0;font-family:var(--display-font);font-size:clamp(28px,4vw,42px);line-height:1;letter-spacing:-.04em;color:#102033;text-wrap:balance}.shared-page-copy .helper,.shared-page-state .helper{max-width:44ch;font-size:15px}.shared-page-preview-panel{min-height:340px;display:grid;place-items:center;border:1px solid rgba(156,176,200,.44);border-bottom:2px solid rgba(142,164,190,.64);border-radius:28px;background:radial-gradient(circle at 50% 45%,rgba(20,184,166,.08),transparent 42%),linear-gradient(180deg,#f9fcfffa,#e9f3fdf0);padding:20px}.shared-page-preview-panel .shared-page-preview-icon{filter:drop-shadow(0 22px 34px rgba(38,60,84,.18))}.shared-page-scale{max-width:460px;width:100%;justify-self:center}.shared-page-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}.shared-page-actions>*{text-decoration:none;display:inline-flex;align-items:center;justify-content:center;min-width:180px}.pane-column{min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr);gap:8px}.pane-display-head{padding:0 6px;overflow:hidden}.pane-mode-title-switch{position:relative;width:min(100%,168px);height:28px;margin:0;opacity:0;transform:translateY(115%);transition:transform .52s cubic-bezier(.22,1,.36,1),opacity .32s ease}.pane-mode-title{position:absolute;top:0;left:0;height:28px;display:inline-flex;align-items:baseline;padding:0;border:0;background:transparent;color:var(--text);font-family:var(--display-font);font-size:20px;font-weight:800;line-height:1;letter-spacing:0;white-space:nowrap;cursor:pointer;opacity:1;transform-origin:left top;transition:transform .38s cubic-bezier(.22,1,.36,1),color .18s ease,opacity .18s ease}.pane-mode-title[aria-pressed=false]{color:var(--muted);opacity:.78}.pane-mode-title:hover,.pane-mode-title:focus-visible{color:var(--accent);opacity:1}.pane-mode-title:focus-visible{outline:none;text-decoration:underline;text-underline-offset:4px}.pane-mode-title-switch[data-active-mode=wizard] .pane-mode-title-wizard{transform:translate(0) scale(1)}.pane-mode-title-switch[data-active-mode=wizard] .pane-mode-title-editor{transform:translate(78px) scale(.62)}.pane-mode-title-switch[data-active-mode=editor] .pane-mode-title-editor{transform:translate(0) scale(1)}.pane-mode-title-switch[data-active-mode=editor] .pane-mode-title-wizard{transform:translate(70px) scale(.62)}.app-shell[data-ui-phase=transitioning] .pane-mode-title-switch,.app-shell[data-ui-phase=builder] .pane-mode-title-switch{opacity:1;transform:translateY(0)}.pane-display-title{margin:0;font-size:20px;font-family:var(--display-font);font-weight:800;letter-spacing:0;opacity:0;transform:translateY(115%);transition:transform .52s cubic-bezier(.22,1,.36,1),opacity .32s ease}.app-shell[data-ui-phase=transitioning] .pane-display-title,.app-shell[data-ui-phase=builder] .pane-display-title{opacity:1;transform:translateY(0)}.app-header{grid-column:1 / -1;position:sticky;top:10px;z-index:32;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:12px;padding:12px 16px;border-radius:var(--radius-xl);border:1px solid rgba(156,176,200,.58);border-bottom:2px solid rgba(138,161,188,.74);background:linear-gradient(170deg,#0f766e17,#fff0 36%),linear-gradient(350deg,#c2410c14,#fff0 34%),#f6fbffc7;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.app-header-side{display:flex;align-items:center;gap:8px;min-width:0}.app-header-side-end{justify-content:flex-end}.app-header-chip{border:1px solid rgba(156,176,200,.62);border-bottom:2px solid rgba(156,176,200,.82);border-radius:999px;background:linear-gradient(180deg,#fffffff5,#e8f1fbe6);color:var(--muted);font-size:12px;line-height:1;font-weight:700;letter-spacing:.03em;text-transform:uppercase;white-space:nowrap;padding:8px 11px;transition:color .15s ease,border-color .15s ease,transform .15s ease}.app-header:hover .app-header-chip{border-color:#0f766e70;color:#30465e}.app-header-title{justify-self:center;display:inline-flex;align-items:center;justify-content:center;gap:0;padding:4px 12px;font-family:var(--display-font);font-size:clamp(25px,3vw,34px);font-weight:800;line-height:1;letter-spacing:-.02em;color:var(--text);text-align:center}.app-header-brand{display:inline-block}.app-header-title-link{border:0;background:transparent;color:var(--text);text-decoration:none;cursor:pointer}.app-header-title-link:hover,.app-header-title-link:focus-visible{border-color:transparent;background:transparent;color:var(--accent);filter:none;transform:translateY(-1px);outline:none}.app-header-title-link:active{border-bottom-width:0;transform:translateY(0)}.app-header-info{width:34px;height:34px;border-radius:999px;border:1px solid rgba(156,176,200,.72);border-bottom:2px solid rgba(142,164,190,.88);background:linear-gradient(180deg,#fff,#edf6ff);color:#36506d;font-size:18px;font-weight:800;line-height:1;display:grid;place-items:center;padding:0;transition:transform .15s ease,border-color .15s ease,color .15s ease,background .15s ease}.app-header-info:hover{transform:translateY(-1px);border-color:#0f766e9e;color:var(--accent);background:linear-gradient(180deg,#fff,#e9f9f6)}.app-header-info:focus-visible{outline:none;box-shadow:0 0 0 3px #0f766e40}.app-header-why{width:auto;min-width:0;padding:0 13px;font-size:12px;font-weight:900;letter-spacing:.03em;text-transform:uppercase;white-space:nowrap}.app-header-spec{position:relative;isolation:isolate;overflow:hidden;min-height:34px;padding:8px 13px;border-radius:999px;border:1px solid rgba(156,176,200,.72);border-bottom:2px solid rgba(142,164,190,.88);background:linear-gradient(180deg,#fff,#edf6ff);color:#36506d;font-size:12px;font-weight:800;line-height:1;white-space:nowrap;transition:transform .15s ease,border-color .15s ease,color .15s ease,background .15s ease}.app-header-spec-needs-attention:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;border-radius:999px;padding:2px;background:conic-gradient(from 0deg,#14b8a600,#14b8a6f5,#f59e0be6,#14b8a600);pointer-events:none;opacity:0;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;animation:specButtonOutline 7s ease-in-out infinite}.app-header-spec:hover{transform:translateY(-1px);border-color:#0f766e9e;color:var(--accent);background:linear-gradient(180deg,#fff,#e9f9f6);filter:none}.app-header-spec:focus-visible{outline:none;box-shadow:0 0 0 3px #0f766e40}.app-header-action{width:34px;height:34px;border-radius:999px;border:1px solid rgba(156,176,200,.72);border-bottom:2px solid rgba(142,164,190,.88);background:linear-gradient(180deg,#fff,#edf6ff);color:#36506d;display:grid;place-items:center;padding:0;transition:transform .15s ease,border-color .15s ease,color .15s ease,background .15s ease}.app-header-action:hover:enabled{transform:translateY(-1px);border-color:#0f766e9e;color:var(--accent);background:linear-gradient(180deg,#fff,#e9f9f6)}.app-header-action:focus-visible{outline:none;box-shadow:0 0 0 3px #0f766e40}.app-header-action:disabled{opacity:.52;cursor:not-allowed}.controls,.preview{border:1px solid rgba(148,168,192,.62);border-bottom:3px solid rgba(132,154,181,.82);border-radius:var(--radius-2xl);background:linear-gradient(180deg,#fffffff7,#f0f8fff0);min-height:0}.controls{padding:24px 24px calc(24px + var(--floating-pane-clearance));display:grid;align-content:start;gap:14px;min-height:0;height:100%;max-height:none;position:relative;overflow-y:auto;overflow-x:hidden;scroll-padding-bottom:var(--floating-pane-clearance);scrollbar-width:thin;scrollbar-color:rgba(15,118,110,.7) rgba(210,224,240,.8);transition:background .18s ease,border-color .18s ease,box-shadow .18s ease}.app-shell[data-editing-target=particle] .controls{border-color:#14b8a6b8;background:linear-gradient(165deg,#14b8a618,#fff0 42%),linear-gradient(180deg,#fafffdfa,#e4f6f4f5);box-shadow:inset 0 0 0 1px #14b8a61f}.app-shell[data-ui-phase=landing] .controls{overflow-y:auto;overflow-x:hidden}.controls-content{display:grid;align-content:start;gap:14px;position:relative;z-index:1;transition:opacity .42s ease,transform .56s cubic-bezier(.22,1,.36,1),filter .42s ease}.app-shell[data-ui-phase=landing] .controls-content{opacity:.02;transform:translateY(24px);filter:blur(14px);pointer-events:none}.controls-hero{position:absolute;top:0;right:0;bottom:0;left:0;z-index:3;display:flex;align-items:flex-start;padding:32px 30px;background:radial-gradient(circle at 16% 18%,rgba(20,184,166,.14),transparent 36%),radial-gradient(circle at 84% 12%,rgba(245,158,11,.12),transparent 32%),linear-gradient(180deg,#fffffffa,#f2f8fff7);transition:opacity .36s ease,transform .62s cubic-bezier(.22,1,.36,1),visibility 0s linear .62s}.controls-hero-content{max-width:470px;display:grid;gap:12px;padding-bottom:28px}.controls-hero-eyebrow{margin:0;color:var(--accent);font-size:13px;font-weight:800;letter-spacing:.16em;text-transform:uppercase}.controls-hero h1{margin:0;font-family:var(--display-font);font-size:clamp(40px,5.4vw,58px);line-height:.96;letter-spacing:-.05em;color:#102033;text-wrap:balance}.controls-hero-copy{margin:0;max-width:36ch;color:#4f6177;font-size:17px;line-height:1.55}.controls-hero-story{margin:0;max-width:43ch;color:#31485f;font-size:14px;font-weight:750;line-height:1.55}.controls-hero-demo-path{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:0;padding:0;counter-reset:demo-step;list-style:none}.controls-hero-demo-path li{counter-increment:demo-step;min-height:42px;display:grid;grid-template-columns:24px minmax(0,1fr);align-items:center;gap:8px;padding:9px 10px;border:1px solid rgba(156,176,200,.52);border-bottom:2px solid rgba(142,164,190,.7);border-radius:14px;background:#ffffffbd;color:#31485f;font-size:12px;font-weight:850;line-height:1.2}.controls-hero-demo-path li:before{content:counter(demo-step);width:24px;height:24px;display:grid;place-items:center;border-radius:999px;background:#0f766e1f;color:var(--accent);font-size:11px;font-weight:950}.controls-hero-story strong{color:#0f766e;font-weight:900;background:linear-gradient(180deg,transparent 58%,rgba(20,184,166,.2) 58%)}.controls-hero-walkthrough{position:relative;width:max-content;max-width:100%;display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:10px 14px 10px 12px;border:1px solid rgba(156,176,200,.66);border-bottom:2px solid rgba(142,164,190,.78);border-radius:16px;background:linear-gradient(180deg,#ffffffe0,#eff7ffd6);color:#36506d;font-size:14px;font-weight:900;line-height:1;box-shadow:0 8px 18px #344c6814;cursor:pointer;animation:walkthroughPulse 5s ease-in-out infinite}.controls-hero-walkthrough input{position:absolute;opacity:0;pointer-events:none}.controls-hero-walkthrough-box{position:relative;width:24px;height:24px;flex:0 0 auto;border-radius:8px;border:2px solid rgba(15,118,110,.72);background:#fff;box-shadow:inset 0 -2px #0f766e14}.controls-hero-walkthrough-box:after{content:"";position:absolute;left:6px;top:3px;width:7px;height:12px;border:solid #ffffff;border-width:0 3px 3px 0;opacity:0;transform:rotate(45deg) scale(.7);transition:opacity .14s ease,transform .14s ease}.controls-hero-walkthrough input:checked+.controls-hero-walkthrough-box{border-color:var(--accent-deep);background:linear-gradient(180deg,#18a194 0%,var(--accent) 100%)}.controls-hero-walkthrough input:checked+.controls-hero-walkthrough-box:after{opacity:1;transform:rotate(45deg) scale(1)}.controls-hero-walkthrough input:focus-visible+.controls-hero-walkthrough-box{outline:3px solid rgba(15,118,110,.28);outline-offset:3px}.controls-hero-actions{display:grid;gap:10px;justify-items:start}.controls-hero-cta{min-width:164px;justify-content:center}.controls-hero-alternates{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;width:min(100%,470px)}.controls-hero-alt-button{min-height:42px;justify-content:center;padding:10px 12px;border-radius:14px;color:#36506d;font-size:13px;font-weight:800;line-height:1.15;text-align:center;box-shadow:0 5px 12px #344c6814}.controls-hero-alt-button:hover{box-shadow:0 7px 14px #0f766e1f}.starter-template-label{margin:2px 0 -4px;color:#36506d;font-size:13px;font-weight:900;letter-spacing:.04em}.landing-template-section{display:grid;gap:8px}.starter-template-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.starter-template-card{display:grid;grid-template-columns:58px minmax(0,1fr);align-items:center;gap:10px;min-height:94px;border-radius:14px;border:1px solid rgba(156,176,200,.62);border-bottom:3px solid rgba(142,164,190,.82);background:linear-gradient(180deg,#ffffff 0%,var(--panel-3) 100%);color:#33495f;padding:10px;text-align:left}.starter-template-card:hover,.starter-template-card:focus-visible{border-color:#0f766edb;border-bottom-color:var(--accent-deep);background:radial-gradient(circle at 20% 10%,rgba(255,255,255,.2),transparent 34%),linear-gradient(180deg,#18a194 0%,var(--accent) 100%);color:#fff;transform:translateY(-1px)}.starter-template-preview{pointer-events:none}.starter-template-copy{min-width:0;display:grid;gap:4px;pointer-events:none}.starter-template-copy strong{color:inherit;font-size:13px;font-weight:950;line-height:1.05}.starter-template-copy span{color:currentColor;opacity:.8;font-size:11px;font-weight:750;line-height:1.25}.app-shell[data-ui-phase=transitioning] .controls-hero,.app-shell[data-ui-phase=builder] .controls-hero{opacity:0;transform:translateY(-26px);visibility:hidden;pointer-events:none}.controls::-webkit-scrollbar{width:12px}.controls::-webkit-scrollbar-track{background:linear-gradient(180deg,#e1ecf8e6,#d0dff0e0);border-radius:999px}.controls::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#0f766ee0,#14b8a6cc);border-radius:999px;border:2px solid rgba(228,238,249,.95)}.controls::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,#0a5c56eb,#0f766ee0)}.editor-target-banner{display:grid;position:sticky;top:0;z-index:8;padding:6px 8px 8px;margin:-6px -8px 2px;border-radius:14px;background:#f5fbff9e;backdrop-filter:blur(10px) saturate(125%);-webkit-backdrop-filter:blur(10px) saturate(125%)}.editor-target-head{display:flex;justify-content:space-between;align-items:center;gap:12px;border-radius:var(--radius-lg);border-left:4px solid rgba(15,118,110,.72);background:linear-gradient(90deg,#0f766e1f,#0f766e05,#fff0);padding:8px 0 8px 14px}.editor-target-title{margin:0;color:#304861;font-size:16px;font-weight:800;line-height:1.2;letter-spacing:.01em;text-transform:uppercase}.editor-target-actions .btn-ghost{padding:7px 12px;font-size:12px}.editor-target-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:8px}.wizard-panel{display:grid;gap:18px;min-width:0}.wizard-sticky{display:grid;gap:12px;position:sticky;top:0;z-index:8;margin:-6px -8px 0;padding:6px 8px 12px;border-radius:14px;background:#f5fbffad;backdrop-filter:blur(10px) saturate(125%);-webkit-backdrop-filter:blur(10px) saturate(125%)}.app-shell[data-editing-target=particle] .wizard-sticky,.app-shell[data-editing-target=particle] .editor-target-banner{background:#ebfcf9b8}.wizard-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.wizard-kicker{margin:0 0 4px;color:var(--accent);font-size:11px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.wizard-head h2{margin:0;color:#243b56;font-size:24px;line-height:1;font-weight:850;letter-spacing:0}.wizard-nav-button,.wizard-finish-actions .btn-secondary,.wizard-particle-button{gap:7px}.wizard-step-tabs{display:grid;grid-template-columns:34px repeat(5,minmax(34px,1fr)) 34px;gap:8px;align-items:center}.wizard-step-tab,.wizard-step-arrow{min-width:0;height:34px;border-radius:999px;padding:0}.wizard-step-tab{border:1px solid rgba(156,176,200,.74);border-bottom:2px solid rgba(142,164,190,.84);background:linear-gradient(180deg,#ffffff 0%,var(--panel-3) 100%);color:#405873}.wizard-step-tab span{width:22px;height:22px;display:inline-grid;place-items:center;border-radius:999px;background:#9cb0c82e;font-size:12px;font-weight:900;line-height:1}.wizard-step-tab.active{border-color:var(--accent);border-bottom-color:var(--accent-deep);background:linear-gradient(180deg,#1ba597 0%,var(--accent) 100%);color:#fff}.wizard-step-tab.active span{background:#fff3}.wizard-step-arrow{border:1px solid var(--accent);border-bottom:2px solid var(--accent-deep);background:linear-gradient(180deg,#1ba597 0%,var(--accent) 100%);color:#fff}.wizard-step-arrow:disabled{border-color:#9cb0c8bd;border-bottom-color:#8ea4bed6;background:linear-gradient(180deg,#ffffff 0%,var(--panel-3) 100%);color:#405873;opacity:.72}.wizard-card{display:grid;gap:20px;padding:22px;border:1px solid rgba(156,176,200,.4);border-bottom:2px solid rgba(156,176,200,.62);border-radius:var(--radius-lg);background:linear-gradient(180deg,#fffffffa,#ecf5fdf5);animation:sectionFade .22s ease}.wizard-card-head{display:flex;align-items:center;gap:10px;min-width:0}.wizard-card-head h3{flex:1;margin:0;color:#364b65;font-size:12px;letter-spacing:.1em;text-transform:uppercase;font-weight:850}.wizard-inline-switch{margin-left:auto}.wizard-reset-back{align-self:end;min-height:42px}.wizard-summary-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.wizard-particle-label{margin:0 0 8px;color:#36506d;font-size:11px;font-weight:850;letter-spacing:.04em;text-transform:uppercase}.wizard-particle-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.wizard-particle-button{justify-content:flex-start;min-height:40px;border:1px solid rgba(156,176,200,.74);border-bottom:2px solid rgba(142,164,190,.84);border-radius:13px;background:linear-gradient(180deg,#ffffff 0%,var(--panel-3) 100%);color:#33495f;font-size:12px;padding:9px 10px}.wizard-particle-button.active{border-color:var(--accent);border-bottom-color:var(--accent-deep);background:linear-gradient(180deg,#1ba597 0%,var(--accent) 100%);color:#fff}.wizard-finish-actions,.wizard-nav{display:flex;flex-wrap:wrap;gap:10px}.wizard-finish-actions>*,.wizard-nav>*{flex:1 1 160px}.wizard-finish-icon{flex:0 0 auto}.wizard-share-card{gap:24px;background:radial-gradient(circle at 12% 0%,rgba(20,184,166,.12),transparent 32%),radial-gradient(circle at 92% 0%,rgba(245,158,11,.12),transparent 30%),linear-gradient(180deg,#fffffffa,#ecf5fdf5)}.wizard-share-card .wizard-summary-grid{grid-template-columns:1fr;gap:14px}.wizard-share-head{align-items:flex-start;gap:16px}.wizard-share-head>div{display:grid;gap:9px;min-width:0}.wizard-share-subtitle{margin:0;max-width:44ch;color:#52677f;font-size:15px;line-height:1.5;font-weight:600}.wizard-share-setting{border:1px solid rgba(156,176,200,.48);border-bottom:2px solid rgba(142,164,190,.64);border-radius:var(--radius-md);background:linear-gradient(180deg,#ffffffe0,#eff7ffcc);padding:14px}.wizard-share-actions,.wizard-share-secondary{display:grid;gap:12px}.wizard-share-actions{grid-template-columns:repeat(2,minmax(0,1fr))}.wizard-share-actions button,.wizard-share-secondary button{gap:8px}.wizard-share-primary{grid-column:1 / -1;box-shadow:0 10px 22px #0f766e2e}.wizard-share-secondary{grid-template-columns:repeat(2,minmax(0,1fr));padding-top:2px}.wizard-integration-callout{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;align-items:center;padding:16px;border:1px solid rgba(15,118,110,.24);border-bottom:2px solid rgba(15,118,110,.34);border-radius:var(--radius-lg);background:linear-gradient(180deg,#ecfdf5db,#f0f9ffeb)}.wizard-integration-callout h4{margin:0 0 6px;color:#1f3a35;font-size:15px;font-weight:850;letter-spacing:0}.wizard-integration-callout p{margin:0;max-width:46ch;color:#52677f;font-size:13px;line-height:1.5;font-weight:600}.wizard-integration-callout button{min-width:124px}.wizard-nav{margin:0;padding:0;border-radius:14px;background:transparent}.walkthrough-layer{position:fixed;top:0;right:0;bottom:0;left:0;z-index:88;pointer-events:none}.walkthrough-card{position:fixed;width:min(340px,calc(100vw - 32px));display:grid;gap:10px;padding:16px;border:1px solid rgba(15,118,110,.36);border-bottom:3px solid rgba(15,118,110,.54);border-radius:var(--radius-lg);background:radial-gradient(circle at 14% 0%,rgba(20,184,166,.14),transparent 38%),linear-gradient(180deg,#fffffffc,#eff8fffa);box-shadow:0 18px 42px #10213547;pointer-events:auto;animation:modalSheetIn .18s ease}.walkthrough-kicker{margin:0;color:var(--accent);font-size:11px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.walkthrough-card h3{margin:0;color:#213a56;font-size:19px;font-weight:850;letter-spacing:0;line-height:1.16}.walkthrough-card p:not(.walkthrough-kicker){margin:0;color:#435a74;font-size:14px;font-weight:650;line-height:1.45}.walkthrough-actions{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1fr);gap:8px;padding-top:4px}.walkthrough-actions button{min-height:40px;justify-content:center}.section-panel{margin:0;display:grid;gap:14px;padding:16px;border:1px solid rgba(156,176,200,.4);border-bottom:2px solid rgba(156,176,200,.62);border-radius:var(--radius-lg);background:linear-gradient(180deg,#fffffffa,#ecf5fdf5);animation:sectionFade .22s ease}.section-panel h2{margin:0}.section-panel-head{display:flex;align-items:center;gap:12px}.section-panel-toggle{flex:1;width:auto;padding:0;display:inline-flex;align-items:center;justify-content:flex-start;gap:6px;border:0;background:transparent;color:#364b65;cursor:pointer;text-align:left}.section-panel-toggle:hover{background:transparent;border-color:transparent;filter:none}.section-panel-toggle:active{border-bottom-width:0}.section-panel-toggle:hover .section-panel-title,.section-panel-toggle:focus-visible .section-panel-title{color:var(--accent)}.section-panel-toggle:focus-visible{outline:none}.section-panel-title{color:#364b65;font-size:11px;letter-spacing:.1em;text-transform:uppercase;font-weight:800;transition:color .15s ease}.section-header-preview{position:relative;min-width:38px;height:28px;padding:0 6px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;border-radius:999px;border:1px solid rgba(156,176,200,.5);background:linear-gradient(180deg,#fffffff0,#ecf4fcf5);overflow:hidden}.section-header-preview-content,.section-header-preview-shape{min-width:44px}.section-header-preview-text{max-width:30px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:18px;line-height:1}.section-header-preview-icon{display:inline-flex;align-items:center;justify-content:center}.section-header-preview-image{width:22px;height:22px;object-fit:cover;display:block;border-radius:7px}.section-header-preview-none{color:#70859d;font-size:16px;font-weight:800;line-height:1}.section-header-preview-shape-surface{position:relative;display:block;overflow:hidden}.section-header-preview-shape-image{width:100%;height:100%;object-fit:cover;display:block}.section-header-preview-folder{display:block;overflow:visible}.section-header-preview-colors{gap:4px;padding:0 7px}.section-header-preview-swatch{width:8px;height:8px;border-radius:999px;border:1px solid rgba(255,255,255,.85);box-shadow:0 0 0 1px #8ea4be47}.section-header-preview-back-layer{min-width:46px}.section-header-preview-back-shadow{position:absolute;width:20px;height:20px;border-radius:8px}.section-header-preview-back-front{min-width:0;width:auto;height:auto;padding:0;border:0;background:transparent}.section-panel-switch{position:relative;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;cursor:pointer}.section-panel-switch input{position:absolute;opacity:0;pointer-events:none}.section-panel-switch-track{width:34px;height:20px;border-radius:999px;border:1px solid rgba(150,170,196,.82);background:linear-gradient(180deg,#e5eef7f5,#d2deedf0);display:inline-flex;align-items:center;padding:2px;transition:background .16s ease,border-color .16s ease,box-shadow .16s ease}.section-panel-switch-thumb{width:14px;height:14px;border-radius:999px;background:#fff;box-shadow:0 1px 3px #1c273833;transition:transform .16s ease}.section-panel-switch input:checked+.section-panel-switch-track{border-color:#0f766ee6;background:linear-gradient(180deg,#14b8a6fa,#0f766ef0)}.section-panel-switch input:checked+.section-panel-switch-track .section-panel-switch-thumb{transform:translate(14px)}.section-panel-switch input:focus-visible+.section-panel-switch-track{box-shadow:0 0 0 3px #0f766e33}.section-panel-body-shell{position:relative}.section-panel-body{margin:0;padding:0;min-width:0;border:0;display:grid;gap:14px}.section-panel-disabled .section-panel-body{opacity:.32}.section-panel-disabled-mask{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;border-radius:calc(var(--radius-lg) - 4px);background:linear-gradient(180deg,#f8fbfeb8,#e8f0f8d1);-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);pointer-events:all}.section-panel-disabled-mask span{padding:8px 12px;border-radius:999px;border:1px solid rgba(132,149,171,.4);background:#ffffffd1;color:#52677f;font-size:11px;font-weight:900;letter-spacing:.18em}label{display:grid;gap:7px;font-size:13px;font-weight:600;color:#344a63}.label-head{display:inline-flex;align-items:center;gap:6px}.help-hint{width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;border:1px solid rgba(156,176,200,.78);border-bottom:2px solid rgba(142,164,190,.88);background:linear-gradient(180deg,#ffffff 0%,var(--panel-3) 100%);color:#4a5f79;font-size:11px;font-weight:800;line-height:1;cursor:help;transition:color .15s ease,border-color .15s ease,background .15s ease,transform .15s ease}.help-hint:hover,.help-hint:focus-visible{border-color:#0f766e94;color:var(--accent);background:linear-gradient(180deg,#fff,#ecf9f6);transform:scale(1.06);outline:none}input[type=text],input[type=number],select,textarea{width:100%;border:1px solid rgba(156,176,200,.66);border-bottom:2px solid rgba(156,176,200,.84);border-radius:var(--radius-sm);background:linear-gradient(180deg,#ffffff 0%,var(--panel-2) 100%);color:var(--text);outline:none;padding:11px 12px;transition:border-color .15s ease,background .15s ease,color .15s ease,transform .15s ease,box-shadow .15s ease}input[type=text]::placeholder,input[type=number]::placeholder,textarea::placeholder{color:var(--muted-2)}input[type=text]:hover,input[type=number]:hover,select:hover,textarea:hover{border-color:#0f766e75;background:linear-gradient(180deg,#fff,#f4fbff)}input[type=text]:focus,input[type=number]:focus,select:focus,textarea:focus{border-color:var(--accent);border-bottom-color:var(--accent-deep);background:#fff;box-shadow:0 0 0 3px #0f766e2e}input[type=range]{width:100%;accent-color:var(--accent)}input[type=range]:hover{accent-color:var(--accent-soft)}input[type=color]{width:36px;height:36px;padding:0;border-radius:999px;border:1px solid rgba(156,176,200,.66);border-bottom:2px solid rgba(156,176,200,.84);background:#fff;cursor:pointer;overflow:hidden;transition:border-color .15s ease,transform .15s ease}input[type=color]:hover{border-color:#0f766e75;transform:scale(1.04)}input[type=color]::-webkit-color-swatch-wrapper{padding:0}input[type=color]::-webkit-color-swatch,input[type=color]::-moz-color-swatch{border:none;border-radius:999px}textarea{min-height:88px;resize:vertical;line-height:1.45;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px}small{color:var(--muted);font-size:12px;font-weight:500}.content-rotation-readout{display:inline-flex;align-items:center;gap:8px;min-height:30px}.content-rotation-reset{width:28px;height:28px;padding:0;border-radius:999px}.helper{margin:0;color:var(--muted);font-size:13px;line-height:1.5}.status{font-size:12px;font-weight:600}.status.ok{color:var(--success)}.status.warn{color:var(--danger)}.field-actions,.size-quick-row,.button-row{display:flex;flex-wrap:wrap;align-items:center;gap:10px}.field-action-icon{width:34px;height:34px;display:inline-grid;place-items:center;padding:0;border-radius:999px}.image-editor-card{display:grid;gap:8px;border:1px solid rgba(156,176,200,.48);border-bottom:2px solid rgba(142,164,190,.68);border-radius:var(--radius-md);background:linear-gradient(180deg,#fffffff0,#ebf5ffe0);padding:10px}.image-editor-actions{display:flex;flex-wrap:wrap;gap:8px}.image-editor-actions .btn-ghost{padding:8px 11px;font-size:12px}.image-editor-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.compact-field{border:1px solid rgba(156,176,200,.48);border-radius:var(--radius-md);background:linear-gradient(180deg,#ffffffe6,#eff7ffd1);padding:9px;gap:5px}.compact-field>span{font-size:11px;font-weight:800;letter-spacing:.02em;text-transform:uppercase;color:#4a6180}.compact-field small{font-size:11px}.visually-hidden-input{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;clip:rect(0,0,0,0);overflow:hidden}.button-row{margin-top:2px}.toggle-group{display:flex;flex-wrap:wrap;gap:10px}.advanced-content{display:grid;gap:14px}.particle-position-panel{gap:12px}.particle-nudge-pad{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.particle-nudge-button{width:100%;justify-content:center;padding:9px 10px;font-size:12px}.particle-nudge-button.nudge-up{grid-column:2}.particle-nudge-button.nudge-left{grid-column:1}.particle-nudge-button.nudge-reset{grid-column:2}.particle-nudge-button.nudge-right{grid-column:3}.particle-nudge-button.nudge-down{grid-column:2}.advanced-check,.lock-toggle{display:inline-flex;align-items:center;gap:8px;width:fit-content;font-size:12px;font-weight:700;color:#415a77}.advanced-check input[type=checkbox],.lock-toggle input[type=checkbox]{width:16px;height:16px;margin:0;accent-color:var(--accent)}.grid-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.color-controls-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:start}.color-dot-control{display:grid;justify-items:start;gap:8px;color:#42597a;font-size:12px;min-width:0;border:1px solid rgba(156,176,200,.48);border-radius:var(--radius-md);background:linear-gradient(180deg,#ffffffe0,#eff7ffcc);padding:10px}.color-dot-control span{font-weight:800;letter-spacing:.02em;white-space:nowrap;text-transform:uppercase;font-size:11px;color:#4a6180}.gradient-color-control{display:grid;gap:10px;min-width:0;border:1px solid rgba(156,176,200,.48);border-radius:var(--radius-md);background:linear-gradient(180deg,#ffffffe6,#eff7ffd1);padding:10px}.gradient-control-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:start}.gradient-color-head{display:flex;justify-content:space-between;align-items:center;gap:8px}.gradient-color-head span:first-child{font-size:11px;font-weight:800;letter-spacing:.02em;text-transform:uppercase;color:#4a6180}.gradient-swatch-row{display:flex;align-items:center;gap:10px;min-height:44px}.gradient-swatch{position:relative;width:44px;height:44px;border-radius:11px;border:1px solid rgba(143,163,188,.84);border-bottom:2px solid rgba(123,146,174,.9);box-shadow:inset 0 0 0 1px #ffffff6b;overflow:hidden}.gradient-swatch-input{position:absolute;top:0;right:0;bottom:0;left:0;width:100%!important;height:100%!important;opacity:0;border:none!important;border-radius:0!important;padding:0!important;margin:0;cursor:pointer}.gradient-swatch-remove{position:absolute;top:2px;right:2px;width:18px;height:18px;border:1px solid rgba(71,85,105,.45);border-radius:999px;background:#ffffffeb;color:#334155;display:grid;place-items:center;line-height:1;font-size:13px;font-weight:800;padding:0}.gradient-swatch-remove:hover{border-color:#b91c1cb3;color:#b91c1c;background:#fff;transform:none;filter:none}.gradient-swatch-add{width:44px;height:44px;border:2px dashed rgba(15,118,110,.52);border-bottom-width:2px;border-radius:11px;background:transparent;color:#0a5c56;font-size:22px;font-weight:600;line-height:1;padding:0}.gradient-swatch-add:hover{border-color:#0f766ec7;background:#0f766e14;transform:none;filter:none}.gradient-editor{display:grid;gap:10px;padding-top:8px;border-top:1px solid rgba(156,176,200,.34)}.gradient-preview{width:100%;height:10px;border-radius:999px;border:1px solid rgba(143,163,188,.66)}.gradient-mode-toggle{display:flex;gap:8px}.gradient-mode-button{flex:1;border:1px solid rgba(156,176,200,.74);border-bottom:2px solid rgba(142,164,190,.84);border-radius:999px;background:linear-gradient(180deg,#ffffff 0%,var(--panel-3) 100%);color:#33495f;font-size:11px;font-weight:700;padding:7px 10px}.gradient-mode-button:hover{border-color:#0f766e99;color:#1e3d39;background:linear-gradient(180deg,#fff,#ecf9f6);transform:none;filter:none}.gradient-mode-button.active{border-color:var(--accent);border-bottom-color:var(--accent-deep);background:linear-gradient(180deg,#1ba597 0%,var(--accent) 100%);color:#fff}.gradient-swatch-remove:active,.gradient-swatch-add:active,.gradient-mode-button:active{transform:none}.gradient-angle-layout{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:10px}.gradient-angle-layout label{display:grid;gap:6px;font-size:12px;color:#4a6180;font-weight:700}.gradient-wheel{width:138px;height:138px;touch-action:none;-webkit-user-select:none;user-select:none;cursor:crosshair}.gradient-wheel:focus-visible{outline:3px solid rgba(15,118,110,.42);outline-offset:4px;border-radius:12px}.gradient-wheel svg{display:block}.gradient-wheel-ring{fill:#ffffffeb;stroke:#596f8894;stroke-width:1.5}.gradient-wheel-line{stroke:var(--accent);stroke-width:2}.gradient-wheel-knob{fill:var(--accent);stroke:#fff;stroke-width:2}.gradient-wheel-center{fill:#415b77}.gradient-wheel-center-handle{fill:var(--accent);stroke:#fff;stroke-width:2}.gradient-center-readout{font-size:12px;font-weight:700;color:#4a6180}.content-zone-control{display:grid;gap:8px}.content-zone-control>span{color:#4a6180;font-size:12px;font-weight:700}.zone-layout{display:grid;grid-template-columns:186px minmax(112px,1fr);align-items:center;gap:14px;width:100%;min-width:0}.zone{width:186px;height:186px;touch-action:none;-webkit-user-select:none;user-select:none;cursor:crosshair;transition:transform .15s ease}.zone:hover{transform:scale(1.02)}.zone:focus-visible{outline:3px solid rgba(15,118,110,.42);outline-offset:4px;border-radius:14px}.zone svg{display:block}.zone-shape{fill:#fffffff0;stroke:#596f88c7;stroke-width:2;stroke-linejoin:round}.zone-axis{stroke:#596f8852;stroke-width:1;stroke-dasharray:3 4}.zone-line{stroke:var(--accent);stroke-width:2}.zone-knob{fill:var(--accent);stroke:#fff;stroke-width:2}.zone-center{fill:#415b77}.zone-values{display:grid;gap:8px;min-width:0}.zone-reset{min-height:36px;padding:8px 10px;border-radius:12px;font-size:12px}button,a.btn-primary,a.btn-secondary,a.btn-ghost{border:1px solid var(--accent);border-bottom:3px solid var(--accent-deep);border-radius:var(--radius-xl);background:linear-gradient(180deg,#18a194 0%,var(--accent) 100%);color:#fff;font-weight:700;line-height:1;padding:11px 18px;cursor:pointer;transition:transform .15s ease,border-color .15s ease,background .15s ease,color .15s ease,filter .15s ease}button,a.btn-primary,a.btn-secondary,a.btn-ghost{display:inline-flex;align-items:center;justify-content:center;text-decoration:none}button:hover,a.btn-primary:hover,a.btn-secondary:hover,a.btn-ghost:hover{transform:translateY(-1px);border-color:#0d6e67;background:linear-gradient(180deg,#1bb0a2,#0f766e);filter:brightness(1.01)}button:active,a.btn-primary:active,a.btn-secondary:active,a.btn-ghost:active{transform:translateY(1px);border-bottom-width:2px}button:focus-visible,a.btn-primary:focus-visible,a.btn-secondary:focus-visible,a.btn-ghost:focus-visible{outline:3px solid rgba(15,118,110,.32);outline-offset:2px}button:disabled{opacity:.56;cursor:not-allowed;transform:none}.btn-primary{border-color:var(--accent);border-bottom-color:var(--accent-deep);background:linear-gradient(180deg,#18a194 0%,var(--accent) 100%)}.btn-secondary,.btn-ghost,.toggle,.size-chip{border:1px solid rgba(156,176,200,.74);border-bottom:3px solid rgba(142,164,190,.86);border-radius:var(--radius-xl);background:linear-gradient(180deg,#ffffff 0%,var(--panel-3) 100%);color:#33495f}.btn-secondary:hover,.btn-ghost:hover,.toggle:hover,.size-chip:hover{border-color:#0f766e99;color:#1e3d39;background:linear-gradient(180deg,#fff,#ecf9f6)}.btn-secondary,.btn-ghost,.toggle,.size-chip,.section-advanced-toggle{font-weight:700}.toggle{text-transform:capitalize;padding:10px 16px}.size-chip{border-radius:999px;min-width:42px;font-size:12px;padding:7px 12px}button.app-header-title-link:hover,button.app-header-title-link:focus-visible{border-color:transparent;background:transparent;color:var(--accent);filter:none;transform:translateY(-1px)}button.app-header-title-link:active{border-bottom-width:0;transform:translateY(0)}.shape-preset-row .size-chip{min-width:0;font-size:11px;padding:5px 10px}.toggle.active,.size-chip.active,.section-advanced-toggle.active{border-color:var(--accent);border-bottom-color:var(--accent-deep);background:linear-gradient(180deg,#1ba597 0%,var(--accent) 100%);color:#fff}.toggle.active:hover,.toggle.active:focus-visible,.size-chip.active:hover,.size-chip.active:focus-visible,.section-advanced-toggle.active:hover,.section-advanced-toggle.active:focus-visible{color:#fff;background:linear-gradient(180deg,#1ba597 0%,var(--accent) 100%)}.section-advanced-toggle{width:fit-content;display:inline-flex;align-items:center;gap:8px}.section-advanced-chevron{display:inline-flex;align-items:center;justify-content:center;transition:transform .14s ease}.section-advanced-chevron.open{transform:rotate(90deg)}.preview{min-height:0;height:100%;padding:14px;position:relative;overflow:hidden}.preview-body{min-height:0;height:100%;display:grid;grid-template-rows:auto auto auto;align-content:start;gap:12px;transition:opacity .36s ease .14s,transform .68s cubic-bezier(.22,1,.36,1) .12s,filter .36s ease .12s}.app-shell[data-ui-phase=landing] .preview-body{opacity:.02;transform:translateY(18px);filter:blur(12px);pointer-events:none}.preview-header{display:flex;justify-content:flex-start;align-items:center;gap:12px;padding:2px 4px 0}.preview-header span{color:var(--muted);font-size:13px;font-weight:600}.preview-metrics{display:flex;flex-wrap:wrap;gap:8px;padding:0 4px}.preview-metrics span{border:1px solid rgba(156,176,200,.68);border-bottom:2px solid rgba(142,164,190,.84);border-radius:999px;background:linear-gradient(180deg,#ffffff 0%,var(--panel-3) 100%);color:#4c5f78;font-size:12px;font-weight:700;letter-spacing:.01em;padding:6px 10px}.preview-contexts{border:1px solid rgba(156,176,200,.44);border-bottom:2px solid rgba(142,164,190,.64);border-radius:var(--radius-lg);padding:12px;background:linear-gradient(180deg,#ffffffeb,#f0f8ffe0);display:grid;gap:10px}.preview-contexts-head{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;flex-wrap:wrap}.preview-contexts-title{display:grid;gap:4px}.preview-contexts-head h3{margin:0;color:#2f4762;font-size:14px;font-weight:800;letter-spacing:.02em}.preview-contexts-head span{color:var(--muted);font-size:12px;font-weight:600}.preview-context-mode-toggle{display:flex;gap:8px;flex-wrap:wrap}.preview-context-mode-button{border:1px solid rgba(156,176,200,.74);border-bottom:2px solid rgba(142,164,190,.84);border-radius:999px;background:linear-gradient(180deg,#ffffff 0%,var(--panel-3) 100%);color:#33495f;font-size:12px;font-weight:700;line-height:1;padding:8px 12px}.preview-context-mode-button:hover{border-color:#0f766e99;color:#1e3d39;background:linear-gradient(180deg,#fff,#ecf9f6)}.preview-context-mode-button.active{border-color:var(--accent);border-bottom-color:var(--accent-deep);background:linear-gradient(180deg,#1ba597 0%,var(--accent) 100%);color:#fff}.quick-preview-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.quick-preview-tile{position:relative;min-height:142px;border-radius:var(--radius-md);border:1px solid rgba(156,176,200,.62);border-bottom:2px solid rgba(142,164,190,.82);padding:12px;display:grid;place-items:center;overflow:hidden}.quick-preview-label{position:absolute;top:8px;left:10px;margin:0;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#1f2937c7}.quick-preview-icon{width:72px;height:72px;position:relative;display:inline-block}.quick-preview-white{background:#fff}.quick-preview-slate{background:#323338;border-color:#606673e6;border-bottom-color:#4f545ef2}.quick-preview-black{background:#000;border-color:#424242f0;border-bottom-color:#363636f5}.quick-preview-slate .quick-preview-label,.quick-preview-black .quick-preview-label{color:#f1f5f9e6}.message-preview-shell{border-radius:12px;background:#313338;border:1px solid rgba(61,63,68,.96);padding:12px 14px;color:#f2f3f5;font-family:gg sans,Noto Sans,Helvetica Neue,Helvetica,Arial,sans-serif}.message-preview-row{display:flex;align-items:flex-start;gap:12px}.message-preview-avatar{width:48px;height:48px;display:grid;place-items:center;border-radius:999px;background:radial-gradient(circle at 30% 28%,#686d77,#2f333a 72%);border:1px solid rgba(111,116,125,.76);overflow:hidden;flex-shrink:0}.message-preview-avatar-initial{width:24px;height:24px;border-radius:999px;background:#ffffff2e;color:#f2f3f5;font-size:13px;font-weight:800;line-height:1;display:grid;place-items:center}.message-preview-content{flex:1;min-width:0;display:grid;gap:5px}.message-preview-meta{display:flex;align-items:baseline;gap:8px}.message-preview-badge{border-radius:5px;background:#404249;color:#dcdee2;font-size:11px;font-weight:800;letter-spacing:.06em;line-height:1;padding:4px 6px}.message-preview-author{font-size:18px;font-weight:700;line-height:1.15}.message-preview-time{font-size:15px;font-weight:700;color:#a7adb6}.message-preview-line{margin:0;color:#f2f3f5;font-size:15px;line-height:1.34}.message-preview-line-inline-demo{font-size:16px}.message-preview-inline-icon{width:22px;height:22px;margin-left:6px;vertical-align:-.28em;display:inline-block;position:relative}.message-preview-large-icon{width:72px;height:72px;margin-top:2px;position:relative}.message-preview-line-spaced{margin-top:6px}.message-preview-reactions{display:flex;align-items:center;gap:10px;margin-top:3px}.message-preview-reaction{display:inline-flex;align-items:center;gap:9px;min-height:38px;padding:4px 11px 4px 7px;border-radius:11px;border:1px solid rgba(88,101,242,.64);background:#5865f22b}.message-preview-reaction-active{box-shadow:inset 0 0 0 1px #5865f26b}.message-preview-reaction-icon{width:20px;height:20px;position:relative;display:inline-block}.message-preview-reaction-count{font-size:15px;line-height:1.1;font-weight:700;color:#f2f3f5}.message-preview-reaction-add{width:38px;height:38px;border-radius:11px;border:1px solid #4f545c;background:#2b2d31;color:#b5bac1;display:grid;place-items:center}.message-preview-reaction-add svg{display:block}.context-icon-scale{position:absolute;top:50%;left:50%;transform-origin:center}.context-icon-stack{pointer-events:none}.context-icon-frame{position:relative;display:block}.context-icon-offset{position:absolute}.preview-stage{position:relative;border:1px solid rgba(156,176,200,.46);border-bottom:2px solid rgba(142,164,190,.62);border-radius:var(--radius-xl);background:linear-gradient(45deg,rgba(231,240,250,.94) 25%,transparent 25%,transparent 75%,rgba(231,240,250,.94) 75%,rgba(231,240,250,.94)),linear-gradient(45deg,rgba(231,240,250,.94) 25%,transparent 25%,transparent 75%,rgba(231,240,250,.94) 75%,rgba(231,240,250,.94)),#f8fbff;background-size:24px 24px;background-position:0 0,12px 12px;display:grid;place-items:center;min-height:360px;padding:16px;overflow:hidden}.inspect-selector{position:absolute;top:12px;left:12px;right:12px;z-index:42;display:grid;gap:7px;justify-items:start}.inspect-selector-row{max-width:min(100%,620px);display:flex;align-items:center;gap:10px}.inspect-selector-button{flex:0 0 auto;min-height:34px;padding:8px 12px;border:1px solid rgba(137,159,185,.84);border-bottom:2px solid rgba(118,142,170,.92);border-radius:12px;background:linear-gradient(180deg,#fffffffa,#edf7fff5);color:#29425e;font-size:12px;font-weight:850;line-height:1;box-shadow:0 8px 18px #1422351f;transition:transform .15s ease,border-color .15s ease,color .15s ease,background .15s ease}.inspect-selector-hint{max-width:min(46vw,430px);color:#506982;font-size:12px;font-weight:800;line-height:1.25;text-shadow:0 1px 0 rgba(255,255,255,.86);pointer-events:none}.inspect-selector-button:hover,.inspect-selector-button.active{transform:translateY(-1px);border-color:#0f766ea3;color:var(--accent);background:linear-gradient(180deg,#fff,#e8f8f5)}.inspect-selector-button:focus-visible{outline:none;box-shadow:0 0 0 3px #0f766e38,0 8px 18px #1422351f}.inspect-selector-menu{width:min(250px,calc(100vw - 54px));max-height:min(300px,calc(100dvh - 210px));overflow:auto;display:grid;gap:3px;padding:7px;border:1px solid rgba(137,159,185,.86);border-bottom:2px solid rgba(118,142,170,.94);border-radius:14px;background:linear-gradient(180deg,#fffffffa,#eef7fff7);box-shadow:0 16px 34px #1422352e;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.inspect-selector-item{width:100%;min-height:32px;display:flex;align-items:center;justify-content:flex-start;padding:8px 9px;border:1px solid transparent;border-radius:9px;background:transparent;color:#31485f;font-size:12px;font-weight:800;line-height:1.15;text-align:left}.inspect-selector-item:hover,.inspect-selector-item.highlighted,.inspect-selector-item:focus-visible{outline:none;border-color:#0f766e57;background:#14b8a61a;color:#0a5c56}.inspect-selector-empty{padding:8px 9px;color:var(--muted);font-size:12px;font-weight:750}.preview-message-mode{gap:8px}.preview-message-mode .preview-stage{min-height:300px}.preview-message-mode .preview-contexts{padding:10px;gap:8px}.preview-message-mode .preview-contexts-head{align-items:center}.preview-message-mode .preview-contexts-title{gap:2px}.preview-message-mode .message-preview-shell{padding:10px 12px}.preview-message-mode .message-preview-row{gap:10px}.preview-message-mode .message-preview-avatar{width:40px;height:40px}.preview-message-mode .message-preview-avatar-initial{width:20px;height:20px;font-size:12px}.preview-message-mode .message-preview-content{gap:4px}.preview-message-mode .message-preview-meta{gap:7px}.preview-message-mode .message-preview-author{font-size:16px}.preview-message-mode .message-preview-time,.preview-message-mode .message-preview-line{font-size:13px}.preview-message-mode .message-preview-line{line-height:1.25}.preview-message-mode .message-preview-line-inline-demo{font-size:13px}.preview-message-mode .message-preview-inline-icon{width:20px;height:20px}.preview-message-mode .message-preview-large-icon{width:54px;height:54px;margin-top:0}.preview-message-mode .message-preview-line-spaced{margin-top:2px}.preview-message-mode .message-preview-reactions{gap:8px;margin-top:2px}.preview-message-mode .message-preview-reaction{min-height:32px;gap:7px;padding:3px 9px 3px 6px}.preview-message-mode .message-preview-reaction-icon{width:16px;height:16px}.preview-message-mode .message-preview-reaction-count{font-size:13px}.preview-message-mode .message-preview-reaction-add{width:32px;height:32px}.export-share-pane:not(.app-export-share-pane){position:absolute;top:12px;left:12px;z-index:16;width:min(308px,calc(100% - 24px));display:grid;gap:9px;border:1px solid rgba(137,159,185,.84);border-bottom:2px solid rgba(118,142,170,.92);border-radius:14px;background:linear-gradient(180deg,#fffffffa,#edf7fff2);box-shadow:0 8px 20px #14223524;padding:11px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.app-export-share-pane{position:fixed;top:auto;right:auto;left:50%;bottom:12px;z-index:60;width:min(560px,calc(100vw - 24px));display:grid;gap:8px;border:1px solid rgba(137,159,185,.84);border-bottom:2px solid rgba(118,142,170,.92);border-radius:14px;background:linear-gradient(180deg,#fffffffa,#edf7fff2);padding:10px 14px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);grid-column:auto;transform:translate(-50%);grid-template-columns:1fr;align-items:center;overflow:hidden;max-height:58px;transition:max-height .22s ease,width .22s ease,box-shadow .18s ease,border-color .16s ease,opacity .24s ease,transform .42s cubic-bezier(.22,1,.36,1)}.app-export-share-pane[data-hidden=true]{opacity:0;transform:translate(-50%) translateY(18px);pointer-events:none}.app-export-share-pane .export-share-pane-label,.app-export-share-pane .export-pane-primary,.app-export-share-pane .export-pane-secondary-row{display:none}.app-export-share-pane .export-share-pane-head{display:grid;grid-template-columns:1fr;grid-template-areas:"title" "meta";align-items:center;gap:2px;width:100%}.app-export-share-pane .export-share-pane-head span{display:none}.app-export-share-pane .export-share-pane-head h3{grid-area:title;justify-self:center;white-space:nowrap}.app-export-share-pane .export-share-pane-head span{grid-area:meta;justify-self:center}.app-export-share-pane>:not(.export-share-pane-head){pointer-events:none}.app-export-share-pane:hover{width:min(1220px,calc(100vw - 24px));padding:11px;grid-template-columns:minmax(150px,.72fr) minmax(170px,1fr) minmax(150px,.8fr) minmax(140px,auto) minmax(310px,1.4fr);align-items:end;max-height:min(72vh,410px);box-shadow:0 12px 26px #10213533}.app-export-share-pane:hover .export-share-pane-label{display:grid}.app-export-share-pane:hover .export-pane-primary{display:block}.app-export-share-pane:hover .export-pane-secondary-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}.app-export-share-pane:hover .export-share-pane-head span{display:block;justify-self:start}.app-export-share-pane:hover .export-share-pane-head h3{justify-self:start}.app-export-share-pane:hover>:not(.export-share-pane-head){pointer-events:auto}.export-share-pane-head{display:grid;gap:2px}.export-share-pane-head h3{margin:0;color:#233a54;font-size:13px;font-weight:800;letter-spacing:.04em;text-transform:uppercase}.export-share-pane-head span{color:#4b627f;font-size:11px;font-weight:700}.export-share-pane-label{gap:6px}.export-share-pane-label>span{color:#36506d;font-size:11px;font-weight:800;letter-spacing:.04em;text-transform:uppercase}.export-share-pane-label small{color:#4b627f;font-size:11px;font-weight:700}.export-size-switch{display:inline-flex;align-items:center;gap:8px;width:fit-content;cursor:pointer;color:#36506d;font-size:12px;font-weight:700}.export-size-switch input{position:absolute;opacity:0;pointer-events:none}.export-size-switch-track{width:34px;height:20px;border-radius:999px;border:1px solid rgba(150,170,196,.82);background:linear-gradient(180deg,#e5eef7f5,#d2deedf0);display:inline-flex;align-items:center;padding:2px;transition:background .16s ease,border-color .16s ease,box-shadow .16s ease}.export-size-switch-thumb{width:14px;height:14px;border-radius:999px;background:#fff;box-shadow:0 1px 3px #1c273833;transition:transform .16s ease}.export-size-switch input:checked+.export-size-switch-track{border-color:#0f766ee6;background:linear-gradient(180deg,#14b8a6fa,#0f766ef0)}.export-size-switch input:checked+.export-size-switch-track .export-size-switch-thumb{transform:translate(14px)}.export-size-switch input:focus-visible+.export-size-switch-track{box-shadow:0 0 0 3px #0f766e33}.export-size-switch.disabled{cursor:not-allowed;color:#7b8fa7}.export-size-switch.disabled .export-size-switch-track{border-color:#b5c1cfc7;background:linear-gradient(180deg,#eef3f8f0,#e1e9f2e6)}.export-size-switch.disabled .export-size-switch-thumb{background:#ffffffe6}.export-share-pane .size-quick-row{gap:7px}.export-pane-primary{width:100%;border-radius:14px;font-size:16px;font-weight:800;padding:13px 14px;letter-spacing:.01em}.export-pane-secondary-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.export-pane-secondary-row button{border-radius:12px;border-bottom-width:2px;font-size:12px;font-weight:700;padding:8px 9px}.export-pane-secondary-row .btn-ghost,.export-pane-secondary-row .btn-secondary{color:#3f5670}.preview-main-shell{width:100%;min-height:0;height:100%;display:grid;place-items:center;overflow:auto;padding:8px;scrollbar-width:none;-ms-overflow-style:none}.preview-hero{position:absolute;top:14px;right:14px;bottom:14px;left:14px;border-radius:calc(var(--radius-xl) - 2px);overflow:hidden;background:linear-gradient(45deg,rgba(231,240,250,.86) 25%,transparent 25%,transparent 75%,rgba(231,240,250,.86) 75%,rgba(231,240,250,.86)),linear-gradient(45deg,rgba(231,240,250,.86) 25%,transparent 25%,transparent 75%,rgba(231,240,250,.86) 75%,rgba(231,240,250,.86)),linear-gradient(180deg,#fffffff0,#f1f7fffa);background-size:28px 28px,28px 28px,100% 100%;background-position:0 0,14px 14px,0 0;box-shadow:inset 0 0 0 1px #9cb0c86b;transition:transform .88s cubic-bezier(.22,1,.36,1),opacity .32s ease,visibility 0s linear .88s;z-index:4}.preview-hero-grid{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg,transparent 0,transparent 18%,rgba(159,184,210,.22) 18%,rgba(159,184,210,.22) 19%,transparent 19%,transparent 48%,rgba(159,184,210,.22) 48%,rgba(159,184,210,.22) 49%,transparent 49%,transparent 74%,rgba(159,184,210,.22) 74%,rgba(159,184,210,.22) 75%,transparent 75%,transparent 100%);pointer-events:none}.preview-hero-samples,.preview-hero-center{position:absolute;top:0;right:0;bottom:0;left:0}.preview-hero-center{display:grid;place-items:center;z-index:2}.hero-primary-icon{filter:drop-shadow(0 26px 34px rgba(30,64,92,.24))}.hero-sample{position:absolute;transform:translate(-50%,-50%);z-index:1}.hero-sample-card{--hero-rotation: 0deg;--hero-delay: 0ms;opacity:.92;transform:rotate(var(--hero-rotation));padding:12px;border-radius:28px;background:radial-gradient(circle at 50% 50%,#ffffffb8,#fff0);animation:heroSampleAppear .46s cubic-bezier(.18,.89,.32,1.28) both;animation-delay:var(--hero-delay);transition:transform .26s ease,opacity .22s ease}.hero-sample-icon{filter:drop-shadow(0 18px 24px rgba(33,52,78,.16))}.app-shell[data-ui-phase=transitioning] .hero-sample-card,.app-shell[data-ui-phase=builder] .hero-sample-card{opacity:0;transform:scale(.34) rotate(var(--hero-rotation))}.app-shell[data-ui-phase=transitioning] .preview-hero,.app-shell[data-ui-phase=builder] .preview-hero{transform:translateY(108%);opacity:.98;visibility:hidden;pointer-events:none}.static-composition-preview{position:relative}.static-composition-preview-scale{position:absolute;top:50%;left:50%;transform-origin:center}.static-composition-preview-frame{position:relative;display:block}.static-composition-preview-offset{position:absolute;inset:0 auto auto 0}.preview-main-shell::-webkit-scrollbar{width:0;height:0;display:none}.preview-canvas{position:relative;width:500px;height:500px;border:none;border-radius:0;background:transparent;overflow:hidden;flex-shrink:0}.preview-zoom-layer{position:absolute;inset:0 auto auto 0;transform-origin:top left;transition:transform .18s ease}.export-target{position:relative;display:block;overflow:visible}.export-target-inner{position:absolute;inset:0 auto auto 0;transform-origin:top left}.export-capture-buffer{position:fixed;left:0;top:0;pointer-events:none;opacity:1;width:auto;height:auto;overflow:visible;transform:translate(-10000px,-10000px)}.icon-stack{position:relative;display:grid;place-items:center}.composite-icon-stack{isolation:isolate}.interactive-stack{cursor:pointer}.icon-layer{position:absolute;top:0;right:0;bottom:0;left:0}.icon-main{position:relative;display:grid;place-items:center}.icon-base-surface{position:absolute;top:0;right:0;bottom:0;left:0}.folder-base{overflow:visible}.folder-surface{position:absolute;top:0;right:0;bottom:0;left:0;display:block;overflow:visible;pointer-events:none;z-index:0}.icon-main.shape-image{overflow:hidden}.content-clip-layer{position:absolute;inset:0 auto auto 0;overflow:hidden;z-index:2;pointer-events:none}.content-clip-inner{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.particle-layer{position:absolute;z-index:20}.particle-layer.interactive{cursor:pointer}.particle-layer.interactive:focus-visible{outline:3px solid rgba(15,118,110,.48);outline-offset:2px;border-radius:12px}.particle-stack{pointer-events:none}.particle-focus-ring{position:absolute;pointer-events:none}.particle-focus-ring svg{display:block;width:100%;height:100%;overflow:visible}.particle-focus-ring-path{fill:none;stroke:#111;stroke-width:2;stroke-linecap:round;stroke-dasharray:6 6;stroke-dashoffset:0;vector-effect:non-scaling-stroke;opacity:.88;animation:particleFocusMarch .9s linear infinite}.corner-hotspot{position:absolute;z-index:30;width:30px;height:30px;transform:translate(-50%,-50%) translate(var(--float-x, 0px),var(--float-y, 0px));border:1px solid rgba(15,118,110,.68);border-bottom:2px solid rgba(10,92,86,.78);border-radius:999px;background:linear-gradient(180deg,#fff,#e7f9f6);color:#0a5c56;font-size:16px;font-weight:800;line-height:1;display:grid;place-items:center;padding:0;transition:transform .16s ease,border-color .15s ease,background .15s ease,color .15s ease}.corner-hotspot:hover{transform:translate(-50%,-50%) translate(var(--float-hover-x, 0px),var(--float-hover-y, 0px)) scale(1.05)}.inspect-hit-target{position:absolute;display:block;padding:0;border:2px solid rgba(15,118,110,0);background:#0f766e00;box-shadow:none;pointer-events:auto;cursor:pointer;color:#063f3b;touch-action:none;transition:background .12s ease,border-color .12s ease,box-shadow .12s ease}.inspect-hit-target.draggable{cursor:move}.inspect-hit-target:hover,.inspect-hit-target.highlighted,.inspect-hit-target.interacting,.inspect-hit-target:focus-visible{outline:none;border-color:#0f766ef2;background:#14b8a61f;box-shadow:0 0 0 1px #ffffffeb,0 0 0 5px #14b8a629,0 8px 18px #0f323e1f}.inspect-hit-label{position:absolute;left:-2px;top:-30px;max-width:190px;padding:5px 7px;border:1px solid rgba(6,63,59,.28);border-radius:8px;background:#fafffefa;box-shadow:0 8px 16px #14223529;color:#063f3b;font-size:10px;font-weight:850;line-height:1;white-space:nowrap;opacity:0;transform:translateY(3px);transition:opacity .12s ease,transform .12s ease;pointer-events:none}.inspect-hit-target:hover .inspect-hit-label,.inspect-hit-target.highlighted .inspect-hit-label,.inspect-hit-target.interacting .inspect-hit-label,.inspect-hit-target:focus-visible .inspect-hit-label{opacity:1;transform:translateY(0)}.inspect-drag-handle{position:absolute;width:17px;height:17px;border:2px solid rgba(6,63,59,.68);border-radius:999px;background:#fff;box-shadow:0 3px 8px #14223542;pointer-events:none;touch-action:none;cursor:nwse-resize;opacity:0;transform:scale(.82);transition:opacity .12s ease,transform .12s ease}.inspect-hit-target:hover .inspect-drag-handle,.inspect-hit-target.highlighted .inspect-drag-handle,.inspect-hit-target.interacting .inspect-drag-handle,.inspect-hit-target:focus-visible .inspect-drag-handle{opacity:1;pointer-events:auto;transform:scale(1)}.inspect-drag-handle.handle-nw{top:-10px;left:-10px}.inspect-drag-handle.handle-ne{top:-10px;right:-10px;cursor:nesw-resize}.inspect-drag-handle.handle-se{right:-10px;bottom:-10px}.inspect-drag-handle.handle-sw{bottom:-10px;left:-10px;cursor:nesw-resize}.text-content{position:absolute;top:50%;left:50%;display:inline-flex;align-items:center;justify-content:center;transform:translate(-50%,-50%);line-height:1;white-space:pre;text-align:center;z-index:2;pointer-events:none}.lucide-content{position:absolute;top:50%;left:50%;display:flex;align-items:center;justify-content:center;transform:translate(-50%,-50%);line-height:0;z-index:2;pointer-events:none}.lucide-content svg{display:block}.image-content{width:100%;height:100%;display:flex;align-items:center;justify-content:center;position:relative;z-index:2}.image-content img{width:100%;height:100%;object-fit:contain;-webkit-user-select:none;user-select:none;pointer-events:none}.image-content.empty{border-radius:12px;border:1px dashed rgba(97,123,151,.62);background:linear-gradient(180deg,#f7fcffe6,#ebf5ffe0);color:#5a6d84;font-size:12px;font-weight:700;letter-spacing:.02em;text-transform:uppercase}.shape-image-fill{position:absolute;display:flex;align-items:center;justify-content:center;overflow:hidden;background:linear-gradient(45deg,rgba(231,240,250,.88) 25%,transparent 25%,transparent 75%,rgba(231,240,250,.88) 75%,rgba(231,240,250,.88)),linear-gradient(45deg,rgba(231,240,250,.88) 25%,transparent 25%,transparent 75%,rgba(231,240,250,.88) 75%,rgba(231,240,250,.88)),#f8fbff;background-size:14px 14px;background-position:0 0,7px 7px;z-index:0}.shape-image-fill img{width:100%;height:100%;object-fit:cover;-webkit-user-select:none;user-select:none;pointer-events:none}.shape-image-fill.empty{border:1px dashed rgba(97,123,151,.62)}.shape-image-fill.empty span{color:#5a6d84;font-size:10px;font-weight:800;letter-spacing:.04em;text-transform:uppercase}.uploaded-image-preview{border:1px solid rgba(156,176,200,.56);border-bottom:2px solid rgba(142,164,190,.72);border-radius:var(--radius-md);background:linear-gradient(180deg,#fffffff0,#ebf5ffe0);padding:10px;display:grid;grid-template-columns:62px minmax(0,1fr);gap:10px;align-items:center}.uploaded-image-preview img{width:62px;height:62px;border-radius:10px;border:1px solid rgba(130,151,175,.72);object-fit:contain;background:linear-gradient(45deg,rgba(231,240,250,.88) 25%,transparent 25%,transparent 75%,rgba(231,240,250,.88) 75%,rgba(231,240,250,.88)),linear-gradient(45deg,rgba(231,240,250,.88) 25%,transparent 25%,transparent 75%,rgba(231,240,250,.88) 75%,rgba(231,240,250,.88)),#f8fbff;background-size:14px 14px;background-position:0 0,7px 7px}.uploaded-image-meta{min-width:0;display:grid;gap:2px}.uploaded-image-meta strong{color:#2f4762;font-size:13px;font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.uploaded-image-meta span{color:#536983;font-size:11px;font-weight:600}.compact-color-control{padding:9px}.lucide-fallback,.icon-glyph-fallback{width:100%;height:100%;border-radius:var(--radius-sm);background:#9cb0c83d}.wheel-layout{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:14px}.wheel{width:186px;height:186px;touch-action:none;-webkit-user-select:none;user-select:none;transition:transform .15s ease}.wheel:focus-visible{outline:3px solid rgba(15,118,110,.42);outline-offset:4px;border-radius:14px}.wheel:hover{transform:scale(1.02)}.wheel svg{display:block}.wheel-ring{fill:#fffffff0;stroke:#596f88cc;stroke-width:2}.wheel-ring-muted{fill:none;stroke:#596f884d;stroke-width:1}.wheel-axis{stroke:#596f8866;stroke-width:1}.wheel-line{stroke:var(--accent);stroke-width:2}.wheel-knob{fill:var(--accent);stroke:#fff;stroke-width:2}.wheel-center{fill:#415b77}.wheel-values,.wheel-locks{display:grid;gap:8px}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:92;display:grid;place-items:center;padding:20px;background:#131e2d57;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);animation:modalBackdropIn .17s ease}.modal-sheet{width:min(980px,100%);max-height:min(90vh,860px);display:grid;grid-template-rows:auto minmax(0,1fr) auto;border:1px solid rgba(150,172,198,.62);border-bottom:3px solid rgba(136,159,186,.84);border-radius:var(--radius-2xl);background:linear-gradient(170deg,#0f766e1a,#fff0 28%),linear-gradient(350deg,#c2410c14,#fff0 34%),linear-gradient(180deg,#fffffffc,#f0f8fff7);overflow:hidden;animation:modalSheetIn .21s ease}.modal-header{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:18px 20px;border-bottom:1px solid rgba(156,176,200,.44)}.modal-header h3{margin:0;font-size:18px;font-family:var(--display-font);font-weight:800}.modal-close-button{border:none;border-radius:10px;background:transparent;color:#39526d;font-size:22px;font-weight:700;line-height:1;padding:4px 8px;cursor:pointer}.modal-close-button:hover{border:none;background:#9cb0c833;color:#1f344a;transform:none;filter:none}.modal-close-button:active{transform:none}.modal-close-button:focus-visible{outline:none;box-shadow:0 0 0 3px #0f766e47}.modal-body{padding:18px 20px;display:grid;gap:12px;overflow:auto}.modal-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px;padding:14px 20px 18px;border-top:1px solid rgba(156,176,200,.4);background:linear-gradient(180deg,#ffffffa8,#ebf5fccc)}.visually-hidden-file{position:fixed;width:1px;height:1px;opacity:0;pointer-events:none}.about-modal-content{display:grid;gap:18px}.about-modal-copy{margin:0;color:#31485f;font-size:clamp(18px,2.2vw,22px);line-height:1.55;font-weight:600}.import-export-modal-copy{font-size:clamp(18px,2.2vw,22px);line-height:1.55;font-weight:600}.why-iquan-content{gap:20px}.why-iquan-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.why-iquan-grid section{display:grid;gap:8px;padding:16px;border:1px solid rgba(156,176,200,.58);border-bottom:3px solid rgba(142,164,190,.78);border-radius:18px;background:radial-gradient(circle at 14% 10%,rgba(20,184,166,.1),transparent 34%),linear-gradient(180deg,#fffffff0,#ebf5fceb)}.why-iquan-grid h4{margin:0;color:#102033;font-size:15px;font-weight:950}.why-iquan-grid p{margin:0;color:#52677f;font-size:13px;font-weight:700;line-height:1.45}.why-iquan-built{margin:0;width:fit-content;max-width:100%;padding:10px 13px;border-radius:999px;background:#0f766e1a;color:var(--accent-deep);font-size:13px;font-weight:900;line-height:1.35}.import-export-workspace{display:grid;gap:14px}.import-export-code-field{gap:8px}.import-export-code-field>span{color:#36506d;font-size:12px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.import-export-code-field textarea{min-height:132px}.import-export-group-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.import-export-group{display:grid;gap:12px;align-content:space-between;min-height:150px;padding:16px;border:1px solid rgba(156,176,200,.58);border-bottom:3px solid rgba(142,164,190,.78);border-radius:22px;background:radial-gradient(circle at 15% 10%,rgba(20,184,166,.12),transparent 34%),linear-gradient(180deg,#fffffff0,#ebf5fceb)}.import-export-group h4{margin:0;color:#102033;font-size:16px;font-weight:900}.import-export-group p{margin:5px 0 0;color:#52677f;font-size:13px;font-weight:700;line-height:1.4}.import-export-group-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.import-export-group-actions button{justify-content:center}.import-export-paste{justify-self:start}.iquan-spec-modal-content{gap:18px}.iquan-spec-modal-content code{font-size:.88em;font-weight:800}.iquan-spec-action-link{min-height:42px;padding:10px 16px;font-size:14px}.iquan-spec-repo-action{margin-right:auto}.iquan-spec-code-field{display:grid;gap:8px}.iquan-spec-code-field>span{color:#36506d;font-size:12px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.iquan-spec-code-field textarea{min-height:min(48vh,420px);white-space:pre}.modal-actions button{gap:8px}.about-modal-links{display:flex;flex-wrap:wrap;gap:12px}.about-modal-link{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 20px;border-radius:var(--radius-xl);border:1px solid rgba(156,176,200,.74);border-bottom:3px solid rgba(142,164,190,.86);text-decoration:none;font-size:16px;font-weight:800;line-height:1;transition:transform .15s ease,border-color .15s ease,background .15s ease,color .15s ease,filter .15s ease}.about-modal-link:hover{transform:translateY(-1px)}.about-modal-link:active{transform:translateY(1px);border-bottom-width:2px}.about-modal-link:focus-visible{outline:3px solid rgba(15,118,110,.32);outline-offset:2px}.about-modal-link-primary{border-color:var(--accent);border-bottom-color:var(--accent-deep);background:linear-gradient(180deg,#18a194 0%,var(--accent) 100%);color:#fff}.about-modal-link-primary:hover{border-color:#0d6e67;background:linear-gradient(180deg,#1bb0a2,#0f766e);color:#fff;filter:brightness(1.01)}.about-modal-link-secondary{background:linear-gradient(180deg,#ffffff 0%,var(--panel-3) 100%);color:#33495f}.about-modal-link-secondary:hover{border-color:#0f766e99;color:#1e3d39;background:linear-gradient(180deg,#fff,#ecf9f6)}.icon-picker-toolbar{display:grid;gap:8px}.icon-picker-stats{display:flex;justify-content:space-between;gap:10px;color:var(--muted);font-size:12px;font-weight:600}.icon-picker-grid{border:1px solid rgba(156,176,200,.62);border-bottom:2px solid rgba(142,164,190,.82);border-radius:var(--radius-lg);background:linear-gradient(180deg,#fffffff5,#edf7ffeb);max-height:540px;overflow:auto;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;padding:12px}.icon-option{border:1px solid rgba(156,176,200,.66);border-bottom:3px solid rgba(142,164,190,.84);border-radius:var(--radius-md);background:linear-gradient(180deg,#ffffff 0%,var(--panel-3) 100%);color:#324a64;min-height:96px;padding:10px;display:grid;place-items:center;gap:8px;transition:transform .15s ease,border-color .15s ease,background .15s ease,color .15s ease}.icon-option:hover{transform:translateY(-2px) scale(1.02);border-color:#0f766e8f;background:linear-gradient(180deg,#fff,#ecf9f6);color:#1c3f39}.icon-option span{width:100%;text-align:center;font-size:11px;font-weight:600;line-height:1.2;overflow-wrap:anywhere}.icon-option.active{border-color:var(--accent);border-bottom-color:var(--accent-deep);background:linear-gradient(180deg,#1ba597 0%,var(--accent) 100%);color:#fff}.font-picker-trigger{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;border-radius:var(--radius-sm);text-align:left}.font-picker-trigger-title{font-size:13px;font-weight:700}.font-picker-trigger-preview{font-size:15px;font-weight:700;color:#3c536d;white-space:nowrap}.font-picker-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.image-crop-modal-layout{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;align-items:start}.image-crop-preview-wrap{border:1px solid rgba(156,176,200,.56);border-bottom:2px solid rgba(142,164,190,.72);border-radius:var(--radius-md);background:linear-gradient(45deg,rgba(231,240,250,.88) 25%,transparent 25%,transparent 75%,rgba(231,240,250,.88) 75%,rgba(231,240,250,.88)),linear-gradient(45deg,rgba(231,240,250,.88) 25%,transparent 25%,transparent 75%,rgba(231,240,250,.88) 75%,rgba(231,240,250,.88)),#f8fbff;background-size:20px 20px;background-position:0 0,10px 10px;min-height:260px;display:grid;place-items:center;padding:14px}.image-crop-preview{position:relative;touch-action:none}.image-crop-preview img{width:100%;height:100%;display:block;border-radius:10px;object-fit:contain}.image-crop-scrim{position:absolute;z-index:1;background:#09111e3d;pointer-events:none}.image-crop-overlay{position:absolute;z-index:2;border:2px solid rgba(15,118,110,.92);box-shadow:inset 0 0 0 1px #ffffffa3;border-radius:8px;pointer-events:auto;cursor:grab;touch-action:none}.image-crop-overlay:active{cursor:grabbing}.image-crop-handle{--handle-transform: none;position:absolute;width:16px;height:16px;padding:0;border:2px solid rgba(15,118,110,.92);border-bottom-width:2px;border-radius:999px;background:#fff;box-shadow:0 1px 6px #0c203738;color:transparent;transform:var(--handle-transform);touch-action:none}.image-crop-handle:hover,.image-crop-handle:active{transform:var(--handle-transform);border-color:#0f766e;border-bottom-width:2px;background:#fff;filter:none}.image-crop-handle:focus-visible{outline:2px solid rgba(15,118,110,.35);outline-offset:2px}.image-crop-handle-nw{left:-8px;top:-8px;cursor:nwse-resize}.image-crop-handle-n{left:50%;top:-8px;--handle-transform: translateX(-50%);cursor:ns-resize}.image-crop-handle-ne{right:-8px;top:-8px;cursor:nesw-resize}.image-crop-handle-e{right:-8px;top:50%;--handle-transform: translateY(-50%);cursor:ew-resize}.image-crop-handle-se{right:-8px;bottom:-8px;cursor:nwse-resize}.image-crop-handle-s{left:50%;bottom:-8px;--handle-transform: translateX(-50%);cursor:ns-resize}.image-crop-handle-sw{left:-8px;bottom:-8px;cursor:nesw-resize}.image-crop-handle-w{left:-8px;top:50%;--handle-transform: translateY(-50%);cursor:ew-resize}.image-crop-hint{margin-top:6px}.font-option{border:1px solid rgba(156,176,200,.66);border-bottom:3px solid rgba(142,164,190,.84);border-radius:var(--radius-md);background:linear-gradient(180deg,#ffffff 0%,var(--panel-3) 100%);color:#324a64;padding:12px;display:grid;gap:8px;justify-items:start;text-align:left}.font-option:hover{border-color:#0f766e8f;background:linear-gradient(180deg,#fff,#ecf9f6);color:#1c3f39}.font-option-name{font-size:12px;font-weight:800;letter-spacing:.04em;text-transform:uppercase}.font-option-preview{font-size:22px;line-height:1.1}.font-option.active{border-color:var(--accent);border-bottom-color:var(--accent-deep);background:linear-gradient(180deg,#1ba597 0%,var(--accent) 100%);color:#fff}.toast{position:fixed;right:16px;bottom:16px;z-index:110;border:1px solid rgba(255,255,255,.28);border-radius:var(--radius-sm);background:#1f2d41;color:#f7fbff;font-size:12px;font-weight:700;padding:9px 12px;animation:toastIn .17s ease}.cursor-tooltip{position:fixed;z-index:140;max-width:260px;padding:8px 10px;border-radius:var(--radius-sm);border:1px solid rgba(117,137,162,.84);border-bottom:2px solid rgba(108,127,152,.9);background:linear-gradient(180deg,#fafdfffa,#edf6fff5);color:#263b54;font-size:12px;font-weight:600;line-height:1.35;pointer-events:none;box-shadow:0 4px 14px #17243524}@keyframes toastIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes modalBackdropIn{0%{opacity:0}to{opacity:1}}@keyframes modalSheetIn{0%{opacity:0;transform:translateY(9px) scale(.99)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes walkthroughPulse{0%,78%,to{transform:translateY(0) scale(1);border-color:#9cb0c8a8;box-shadow:0 8px 18px #344c6814}84%{transform:translateY(-1px) scale(1.035);border-color:#0f766ec7;box-shadow:0 10px 22px #0f766e29,0 0 0 5px #14b8a61a}90%{transform:translateY(0) scale(1);border-color:#0f766eb3;box-shadow:0 8px 18px #344c6814}}@keyframes specButtonOutline{0%,58%,to{opacity:0;transform:rotate(0) scale(.98)}64%{opacity:.82}78%{opacity:.82;transform:rotate(1turn) scale(1)}86%{opacity:0;transform:rotate(1turn) scale(1.02)}}@keyframes sectionFade{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes particleFocusMarch{0%{stroke-dashoffset:0}to{stroke-dashoffset:-12}}@keyframes heroSampleAppear{0%{opacity:0;transform:scale(.4) rotate(var(--hero-rotation, 0deg))}70%{opacity:1;transform:scale(1.08) rotate(var(--hero-rotation, 0deg))}to{opacity:.92;transform:scale(1) rotate(var(--hero-rotation, 0deg))}}@media (prefers-reduced-motion: reduce){*{animation:none!important;transition:none!important}}@media (max-width: 1160px){:root{--floating-pane-clearance: 24px}body{overflow:auto}.app-shell{grid-template-columns:1fr;width:min(980px,calc(100% - 24px));height:auto;max-height:none;gap:14px;overflow:visible;zoom:1}.controls,.preview{min-height:auto;max-height:none}.pane-column{grid-template-rows:auto auto}.controls{overflow:visible}.app-header{top:8px}.app-export-share-pane:hover{grid-template-columns:repeat(4,minmax(0,1fr))}.app-export-share-pane:hover .export-pane-secondary-row{grid-column:1 / -1;grid-template-columns:repeat(3,minmax(0,1fr))}.shared-page-shell{width:min(900px,calc(100% - 24px));height:auto;max-height:none;overflow:visible;zoom:1}.shared-page{overflow:visible;padding-bottom:8px}}@media (max-width: 820px){.app-shell{width:calc(100% - 14px);padding-top:10px;padding-bottom:116px;gap:10px}.app-header{grid-template-columns:auto 1fr auto;padding:10px 12px;border-radius:var(--radius-lg)}.app-header-side{gap:6px}.app-header-chip{font-size:10px;padding:7px 9px}.app-header-title{font-size:22px}.controls,.preview{border-radius:var(--radius-xl)}.pane-display-head{padding:0 4px}.controls{padding:16px;gap:12px}.controls-hero{padding:24px 22px}.controls-hero h1{font-size:clamp(36px,11vw,52px)}.controls-hero-copy{font-size:16px}.starter-template-grid{grid-template-columns:1fr}.section-panel{padding:14px;border-radius:var(--radius-md)}.preview{padding:10px}.preview-hero{top:10px;right:10px;bottom:10px;left:10px}.preview-stage{place-items:start stretch;min-height:460px;border-radius:var(--radius-lg);padding:12px}.app-export-share-pane{width:min(560px,calc(100vw - 16px));bottom:8px;grid-template-columns:1fr;align-items:stretch}.app-export-share-pane:hover{width:calc(100vw - 16px);grid-template-columns:1fr;align-items:stretch}.app-export-share-pane:hover .export-pane-secondary-row{grid-template-columns:repeat(2,minmax(0,1fr))}.preview-main-shell{min-height:420px}.quick-preview-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.message-preview-author{font-size:16px}.message-preview-line{font-size:13px}.grid-two,.wheel-layout,.color-controls-grid,.gradient-control-pair,.wizard-summary-grid,.wizard-particle-grid,.wizard-share-actions,.wizard-share-secondary,.wizard-integration-callout,.image-editor-grid,.gradient-angle-layout{grid-template-columns:1fr}.zone-layout{grid-template-columns:1fr;justify-items:start}.icon-picker-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.font-picker-grid,.image-crop-modal-layout,.import-export-group-grid,.import-export-group-actions{grid-template-columns:1fr}.modal-sheet{border-radius:var(--radius-xl)}.shared-page-shell{width:calc(100% - 16px);padding-top:10px;gap:12px}.shared-page-card{padding:22px 18px;border-radius:24px}.shared-page-preview-panel{min-height:320px;padding:18px}.shared-page-actions>*{min-width:160px}}@media (hover: none){.app-shell{padding-bottom:350px}}@media (prefers-reduced-motion: reduce){.app-header-spec-needs-attention:before{animation:none;opacity:.6}.controls-hero-walkthrough{animation:none}.pane-mode-title-switch,.pane-mode-title{transition:none}}@media (max-width: 620px){.inspect-selector-row{display:grid;gap:7px;justify-items:start}.inspect-selector-hint{max-width:min(76vw,330px)}.app-header{grid-template-columns:1fr;justify-items:center;gap:8px;text-align:center}.app-header-side,.app-header-side-end{justify-content:center;width:100%;flex-wrap:wrap}.app-header-title{order:-1}.shared-page-header{grid-template-columns:1fr;justify-items:center;text-align:center}.controls-hero{padding:20px 18px}.controls-hero-content{max-width:none}.controls-hero h1{font-size:34px}.controls-hero-demo-path,.why-iquan-grid,.controls-hero-alternates{grid-template-columns:1fr}.hero-sample:nth-child(3n){display:none}.section-panel h2{font-size:10px}.button-row button,.modal-actions button{width:100%;justify-content:center}.editor-target-head{grid-template-columns:1fr;justify-items:stretch;display:grid;padding:10px 0 10px 12px}.editor-target-actions{display:grid;gap:8px}.editor-target-actions .btn-ghost{width:100%;justify-content:center}.wizard-head{display:grid;justify-items:stretch}.wizard-card{padding:14px}.button-row{display:grid;gap:8px}.export-pane-secondary-row{grid-template-columns:1fr}.icon-picker-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.quick-preview-grid{grid-template-columns:1fr}.message-preview-shell{padding:12px 10px 10px}.message-preview-row{gap:10px}.message-preview-avatar{width:42px;height:42px}.message-preview-author{font-size:15px}.message-preview-time,.message-preview-line{font-size:12px}.modal-backdrop{padding:10px}.modal-header,.modal-body,.modal-actions{padding-left:14px;padding-right:14px}.modal-actions{display:grid;justify-content:stretch}.shared-page-copy h1,.shared-page-state h1{font-size:32px}.shared-page-actions{display:grid}.shared-page-actions>*{width:100%;min-width:0}}