: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: "Avenir Next", "Segoe UI", "Helvetica Neue", system-ui, sans-serif;--ui-font: Inter, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif}*{box-sizing:border-box}html,body,#root{min-height:100%;height:100%}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(1380px,calc(100% - 32px));margin:0 auto;padding:20px 0 116px;height:100%;max-height:100%;display:grid;grid-template-columns:620px minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);gap:20px;overflow:hidden}.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;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-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-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;display:grid;align-content:start;gap:14px;min-height:0;height:100%;max-height:none;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:rgba(15,118,110,.7) rgba(210,224,240,.8)}.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}.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;color:#364b65;font-size:11px;letter-spacing:.1em;text-transform:uppercase;font-weight:800}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}.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}.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-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}button{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:hover{transform:translateY(-1px);border-color:#0d6e67;background:linear-gradient(180deg,#1bb0a2,#0f766e);filter:brightness(1.01)}button:active{transform:translateY(1px);border-bottom-width:2px}button: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}.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}.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;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:12px}.preview-header{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:6px 4px 0}.preview-header h2{margin:0;font-size:20px;font-family:var(--display-font);font-weight:800;letter-spacing:-.01em}.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}.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}.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 .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-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:-10000px;top:-10000px;pointer-events:none;opacity:0;width:1px;height:1px;overflow:hidden}.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}.icon-main.shape-image{overflow:hidden}.particle-layer{position:absolute;z-index:4}.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:12;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)}.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;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)}.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}.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-overlay{position:absolute;border:2px solid rgba(15,118,110,.92);box-shadow:0 0 0 9999px #09111e5c,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 sectionFade{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes particleFocusMarch{0%{stroke-dashoffset:0}to{stroke-dashoffset:-12}}@media (prefers-reduced-motion: reduce){*{animation:none!important;transition:none!important}}@media (max-width: 1160px){body{overflow:auto}.app-shell{grid-template-columns:1fr;width:min(980px,calc(100% - 24px));height:auto;max-height:none;gap:14px;overflow:visible}.controls,.preview{min-height:auto;max-height:none}.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))}}@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)}.controls{padding:16px;gap:12px}.section-panel{padding:14px;border-radius:var(--radius-md)}.preview{padding: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,.image-editor-grid,.gradient-angle-layout{grid-template-columns:1fr}.icon-picker-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.font-picker-grid,.image-crop-modal-layout{grid-template-columns:1fr}.modal-sheet{border-radius:var(--radius-xl)}}@media (hover: none){.app-shell{padding-bottom:350px}}@media (max-width: 620px){.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}.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}.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}}