:root{--color-primary: #0e5f8e;--color-primary-ui: #2f6ea5;--color-primary-soft: rgba(14, 95, 142, .1);--color-dark-primary: #69b7d8;--color-surface: #fbfcfe;--color-page: #f4f7fa;--color-surface-lowest: #ffffff;--color-surface-low: #f6f9fc;--color-surface-mid: #f1f5f9;--color-surface-high: #eaf0f6;--color-surface-highest: #e2eaf2;--color-outline: #738293;--color-outline-variant: #d8e1ea;--color-text: #111820;--color-text-muted: #51606f;--color-shadow: #0a1c33;--color-success: #258a45;--color-warning: #e09a2a;--color-danger: #c7332f;--color-teal: #0f9d8a;--color-gold: #ffc857;--color-mint: #84e6d8;--color-coral: #ffa089;--radius-ui: 8px;--radius-icon: 7px;--radius-preview: 6px;--radius-glass: 30px;--shadow-card: 0 14px 24px rgba(10, 28, 51, .07);--shadow-panel: 0 24px 38px rgba(7, 17, 31, .14);--shadow-blue: 0 12px 54px rgba(14, 95, 142, .1);--content-width: 1180px}*{box-sizing:border-box}html{overflow-x:clip;scroll-behavior:smooth;scrollbar-color:rgba(14,95,142,.62) rgba(226,234,242,.52);scrollbar-width:thin}body{overflow-x:clip;min-width:320px;margin:0;color:var(--color-text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:#fbfdff;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}body.preview-lightbox-open app-site-header{visibility:hidden;opacity:0;pointer-events:none}a{color:inherit}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit}img{display:block;max-width:100%}::-webkit-scrollbar{width:13px;height:13px}::-webkit-scrollbar-track{background:linear-gradient(180deg,#fbfdfff5,#eaf0f6bd);border-left:1px solid rgba(216,225,234,.72)}::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#69b7d8f5,#0e5f8ef5 58%,#0f9d8aeb);border:3px solid rgba(251,253,255,.96);border-radius:999px;box-shadow:0 2px 8px #0e5f8e2e,inset 0 0 0 1px #ffffff3d}::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,#69b7d8,#0b527b 58%,#0f9d8a)}::-webkit-scrollbar-corner{background:transparent}.material-symbols-rounded{direction:ltr;display:inline-flex;width:1em;height:1em;align-items:center;justify-content:center;font-family:Material Symbols Rounded;font-size:1.2em;font-style:normal;font-weight:500;letter-spacing:0;line-height:1;text-transform:none;white-space:nowrap;word-wrap:normal;font-feature-settings:"liga";-webkit-font-smoothing:antialiased}.page-section{position:relative;z-index:1;width:min(var(--content-width),calc(100% - 48px));margin:0 auto;padding:78px 0}.section-kicker{display:inline-flex;width:fit-content;align-items:center;gap:6px;margin:0 0 16px;padding:7px 10px;color:var(--color-primary);background:#0e5f8e17;border:1px solid rgba(14,95,142,.15);border-radius:var(--radius-ui);font-size:12px;font-weight:800}.section-heading{max-width:760px;margin:0;color:var(--color-text);font-size:clamp(32px,5vw,56px);font-weight:900;letter-spacing:0;line-height:.98}.section-copy{max-width:660px;margin:16px 0 0;color:var(--color-text-muted);font-size:16px;line-height:1.7}.surface-card{background:#fffffff0;border:1px solid #e2eaf1;border-radius:var(--radius-ui);box-shadow:var(--shadow-card)}.button-primary,.button-secondary{display:inline-flex;min-height:44px;align-items:center;justify-content:center;gap:8px;padding:0 18px;border-radius:var(--radius-ui);font-size:14px;font-weight:800;letter-spacing:0;text-decoration:none;transition:transform .18s ease,box-shadow .18s ease,background .18s ease,border-color .18s ease}.button-primary{color:#fff;background:var(--color-primary);border:1px solid var(--color-primary);box-shadow:0 12px 24px #0e5f8e2e}.button-secondary{color:var(--color-primary);background:#ffffffb3;border:1px solid var(--color-outline-variant)}.button-primary:hover,.button-secondary:hover{transform:translateY(-2px)}.button-primary:hover{background:#0b527b}.button-secondary:hover{border-color:#0e5f8e59;box-shadow:var(--shadow-card)}.button-primary:focus-visible,.button-secondary:focus-visible,.icon-button:focus-visible{outline:3px solid rgba(105,183,216,.46);outline-offset:3px}.toolbar-group{display:inline-flex;height:40px;align-items:center;gap:2px;padding:0 4px;background:#e2eaf26b;border:1px solid var(--color-outline-variant);border-radius:var(--radius-ui)}.icon-button{display:inline-flex;width:34px;height:34px;align-items:center;justify-content:center;color:var(--color-text-muted);background:transparent;border:0;border-radius:var(--radius-icon);cursor:pointer;transition:background .18s ease,color .18s ease}.icon-button:hover{color:var(--color-primary);background:#0e5f8e1a}.status-pill{display:inline-flex;align-items:center;gap:6px;padding:7px 10px;border-radius:var(--radius-ui);font-size:12px;font-weight:800;letter-spacing:0}.status-pill.synced{color:var(--color-success);background:#258a451f;border:1px solid rgba(37,138,69,.28)}.status-pill.pending{color:#946014;background:#e09a2a24;border:1px solid rgba(224,154,42,.32)}.status-pill.offline{color:var(--color-primary);background:#0e5f8e17;border:1px solid rgba(14,95,142,.22)}@media(max-width:760px){.page-section{width:min(100% - 36px,var(--content-width));padding:48px 0}.section-heading{font-size:clamp(31px,10vw,44px);line-height:1.02}.section-copy{font-size:15px}}@media(max-width:420px){.page-section{width:min(100% - 28px,var(--content-width));padding:42px 0}.button-primary,.button-secondary{width:100%;min-width:0;padding-inline:14px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}app-hero-workspace .feature-toolbar{height:auto;overflow:visible;padding:4px}app-hero-workspace .feature-tool{position:relative;width:42px;height:42px;color:var(--color-text-muted);cursor:pointer}app-hero-workspace .feature-tool.is-active{color:#fff;background:linear-gradient(135deg,var(--color-primary),var(--color-teal));box-shadow:0 12px 24px #0e5f8e38;transform:translateY(-1px)}app-hero-workspace .feature-tool.is-active:after{position:absolute;inset:-4px;border:1px solid rgba(105,183,216,.56);border-radius:inherit;animation:toolPulse 1.6s ease-in-out infinite;content:""}app-hero-workspace .pen-preview,app-hero-workspace .export-badges,app-hero-workspace .export-flow{position:absolute;z-index:3;opacity:0;pointer-events:none}app-hero-workspace .pen-preview{top:50%;left:50%;width:min(56%,340px);color:var(--color-teal);overflow:visible;transform:translate(-50%,-50%)}app-hero-workspace .pen-preview path{fill:#84e6d82e;stroke:currentColor;stroke-width:4;stroke-dasharray:620;stroke-dashoffset:620}app-hero-workspace .pen-preview circle{fill:#fff;stroke:var(--color-primary);stroke-width:3;transform-box:fill-box;transform-origin:center}app-hero-workspace .export-badges{display:none}app-hero-workspace .export-badges span{padding:7px 9px;color:#fff;background:var(--color-text);border-radius:var(--radius-icon);box-shadow:0 14px 24px #0a1c3329;font-size:11px;font-weight:900}app-hero-workspace .export-flow{top:50%;left:50%;display:grid;grid-template-columns:58px 34px 58px;align-items:center;justify-content:center;gap:12px;transform:translate(-50%,-50%)}app-hero-workspace .export-file,app-hero-workspace .export-cloud{display:grid;width:58px;height:58px;place-items:center;color:#fff;background:linear-gradient(135deg,var(--color-primary),var(--color-teal));border-radius:16px;box-shadow:0 22px 42px #0e5f8e3d}app-hero-workspace .export-file .material-symbols-rounded,app-hero-workspace .export-cloud .material-symbols-rounded{font-size:30px}app-hero-workspace .export-arrow{color:var(--color-primary);font-size:30px;opacity:.72}app-hero-workspace .transform-handles,app-hero-workspace .text-caret{display:none;pointer-events:none}app-hero-workspace .transform-handles{position:absolute;inset:-9px}app-hero-workspace .transform-handles span{position:absolute;width:9px;height:9px;background:#fff;border:2px solid var(--color-primary);border-radius:3px;box-shadow:0 4px 10px #0a1c3324}app-hero-workspace .transform-handles span:nth-child(1){top:0;left:0}app-hero-workspace .transform-handles span:nth-child(2){top:0;right:0}app-hero-workspace .transform-handles span:nth-child(3){right:0;bottom:0}app-hero-workspace .transform-handles span:nth-child(4){bottom:0;left:0}app-hero-workspace .text-caret{width:3px;height:32px;margin-left:8px;background:var(--color-primary);border-radius:999px}app-hero-workspace .typed-text{display:inline-block;white-space:nowrap}app-hero-workspace .feature-move .slot-a{animation:transformDemo 2.8s ease-in-out infinite}app-hero-workspace .feature-move .transform-handles{display:block}app-hero-workspace .feature-effects .slot{border-color:#0e5f8ef5;box-shadow:0 24px 42px #0e5f8e2e,0 0 0 8px #84e6d829,inset 0 0 0 1px #ffffff94;animation:effectsDemo 2.4s ease-in-out infinite}app-hero-workspace .feature-pen .slot{opacity:.35}app-hero-workspace .feature-pen .pen-preview{opacity:1}app-hero-workspace .feature-pen .pen-preview path{animation:penDraw 2.4s ease-in-out infinite}app-hero-workspace .feature-pen .pen-preview circle{animation:nodePulse 1.7s ease-in-out infinite}app-hero-workspace .feature-text .slot-d{display:flex;align-items:center;justify-content:center;color:#fff;background:linear-gradient(135deg,var(--color-primary),var(--color-teal));border-color:#84e6d8c7;box-shadow:0 18px 36px #0e5f8e38;animation:textDemo 1.9s ease-in-out infinite}app-hero-workspace .feature-text .typed-text{width:0;overflow:hidden;animation:typeText 3.2s steps(11,end) infinite}app-hero-workspace .feature-text .text-caret{display:inline-block;animation:caretBlink .8s steps(2,end) infinite}app-hero-workspace .feature-export .export-badges{opacity:0}app-hero-workspace .feature-export .export-flow{opacity:1}app-hero-workspace .feature-export .slot{opacity:.42}app-hero-workspace .feature-export .export-file{animation:exportFile 2.2s ease-in-out infinite}app-hero-workspace .feature-export .export-cloud{animation:exportCloud 2.2s ease-in-out infinite}app-hero-workspace .feature-export .export-arrow{animation:exportArrow 2.2s ease-in-out infinite}app-hero-workspace .control-track.gold span{background:var(--color-warning)}app-hero-workspace .panel-list-row{animation:panelRowIn .26s ease both}app-hero-workspace .property-panel .panel-list.export-formats{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;align-self:stretch;margin-top:0}app-hero-workspace .property-panel .export-formats .panel-list-row{grid-template-columns:1fr;justify-items:center;gap:4px;min-height:58px;padding:8px 4px;text-align:center}app-hero-workspace .property-panel .export-formats .panel-list-row .material-symbols-rounded{font-size:18px}app-hero-workspace .property-panel .export-formats .panel-list-row span:nth-child(2){color:var(--color-text);font-size:13px;font-weight:900}app-hero-workspace .property-panel .export-formats .panel-list-row strong{display:none}@media(max-width:720px){app-hero-workspace .feature-toolbar{width:100%;justify-content:space-between}app-hero-workspace .feature-tool{flex:0 0 40px;width:40px;height:40px}app-hero-workspace .feature-text .slot-d{display:flex;right:28px;bottom:34px;width:136px;height:46px}app-hero-workspace .pen-preview{width:60%}}@media(max-width:420px){app-hero-workspace .feature-text .slot-d{right:22px;bottom:28px;width:124px;height:42px}app-hero-workspace .export-flow{grid-template-columns:46px 24px 46px;gap:8px}app-hero-workspace .export-file,app-hero-workspace .export-cloud{width:46px;height:46px;border-radius:13px}app-hero-workspace .property-panel .panel-list.export-formats{grid-template-columns:1fr}}@keyframes toolPulse{0%,to{opacity:.45;transform:scale(1)}50%{opacity:1;transform:scale(1.08)}}@keyframes transformDemo{0%,to{transform:translate(0) scale(1) rotate(0)}50%{transform:translate(18px,10px) scale(1.08) rotate(-6deg)}}@keyframes effectsDemo{0%,to{filter:drop-shadow(0 0 0 rgba(14,95,142,0))}50%{filter:drop-shadow(0 18px 22px rgba(14,95,142,.24))}}@keyframes penDraw{0%{stroke-dashoffset:620}50%,to{stroke-dashoffset:0}}@keyframes nodePulse{0%,to{transform:scale(.82)}50%{transform:scale(1.22)}}@keyframes textDemo{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}@keyframes typeText{0%,14%{width:0}58%,82%{width:11ch}to{width:0}}@keyframes caretBlink{50%{opacity:0}}@keyframes exportFile{0%,to{transform:translate(0) scale(1)}45%{transform:translate(18px) scale(.92)}}@keyframes exportCloud{0%,to{transform:scale(1);box-shadow:0 22px 42px #0e5f8e3d}55%{transform:scale(1.08);box-shadow:0 24px 50px #0f9d8a52}}@keyframes exportArrow{0%,to{opacity:.34;transform:translate(-6px)}50%{opacity:1;transform:translate(6px)}}@keyframes panelRowIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}