:root{--ink:#15202b;--ink-soft:#3d4f5f;--muted:#6a7d8c;--accent:#e23d2a;--accent-deep:#b82c1d;--teal:#1f8a7a;--bg:#eef3f6;--bg-deep:#dfe8ee;--card:#fbfcfd;--line:#15202b1a;--shadow:0 18px 48px #15202b1a;--radius:16px;--radius-sm:10px;--font-display:"Syne", "Segoe UI", sans-serif;--font-body:"DM Sans", "Segoe UI", sans-serif;color:var(--ink);background:var(--bg);font-family:var(--font-body);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;line-height:1.5}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}a{color:inherit;text-decoration:none}button,input,select{font:inherit}.sr-only{clip:rect(0, 0, 0, 0);border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.app-shell{background:radial-gradient(ellipse 70% 50% at 100% 0%, #1f8a7a1f, transparent 55%), radial-gradient(ellipse 50% 40% at 0% 100%, #e23d2a14, transparent 50%), var(--bg);flex-direction:column;min-height:100vh;display:flex}.site-header{border-bottom:1px solid var(--line);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);z-index:20;background:#fbfcfdd1;align-items:center;gap:1rem;padding:.75rem 1.4rem;display:flex;position:sticky;top:0}.brand{font-family:var(--font-display);letter-spacing:-.03em;align-items:center;gap:.6rem;font-size:1.15rem;font-weight:700;display:inline-flex}.brand-mark{background:conic-gradient(from 45deg, var(--accent), #f4a261, var(--teal), #4cc9f0, var(--accent));border-radius:4px;width:1.15rem;height:1.15rem;box-shadow:inset 0 0 0 1px #ffffff59}.nav-links{gap:.35rem;margin-left:.75rem;display:flex}.nav-links a{color:var(--muted);border-radius:999px;padding:.4rem .75rem;font-size:.92rem;font-weight:600;transition:background .15s,color .15s}.nav-links a:hover{color:var(--ink);background:#15202b0a}.nav-links a.active{color:var(--ink);background:#15202b12}.lang-select{margin-left:auto}.lang-select select{border:1px solid var(--line);background:var(--card);color:var(--ink-soft);border-radius:999px;padding:.4rem .85rem}.btn{border:1px solid var(--line);background:var(--card);color:var(--ink);cursor:pointer;border-radius:999px;padding:.55rem 1rem;font-size:.9rem;font-weight:600;transition:transform .12s,box-shadow .12s,background .12s}.btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 8px 18px #15202b14}.btn:disabled{opacity:.4;cursor:not-allowed}.btn-primary{background:linear-gradient(135deg, var(--accent), var(--accent-deep));color:#fff;border-color:#0000}.btn-lg{padding:.9rem 1.5rem;font-size:1.02rem}.btn-link{color:var(--teal);box-shadow:none;background:0 0;border:0;padding:.2rem 0}.btn-link:hover:not(:disabled){box-shadow:none;text-decoration:underline;transform:none}.landing{flex-direction:column;flex:1;display:flex}.landing .hero{isolation:isolate;align-items:flex-end;min-height:calc(100vh - 58px);padding:clamp(2rem,6vw,4.5rem) clamp(1.25rem,5vw,4.5rem) clamp(2.5rem,7vw,5rem);display:flex;position:relative;overflow:hidden}.hero-mosaic{z-index:0;background:#1a2833;grid-template-columns:repeat(12,1fr);grid-auto-rows:1fr;gap:clamp(3px,.45vw,7px);padding:clamp(6px,.8vw,12px);animation:14s ease-in-out infinite alternate mosaic-breathe;display:grid;position:absolute;inset:0}.hero-mosaic span{border-radius:3px;min-height:0;animation:.7s cubic-bezier(.22,1,.36,1) both bead-pop;box-shadow:inset 0 0 0 1px #ffffff2e}.hero-veil{z-index:1;pointer-events:none;background:linear-gradient(105deg,#121c24e0 0%,#121c24b8 38%,#121c2447 62%,#121c241f 100%),linear-gradient(#0000 58%,#121c248c 100%);position:absolute;inset:0}.hero-copy{z-index:2;color:#f4f7f9;max-width:min(34rem,100%);animation:.85s cubic-bezier(.22,1,.36,1) .12s both copy-rise;position:relative}.hero-brand{font-family:var(--font-display);letter-spacing:-.045em;color:#fff;text-wrap:balance;margin:0 0 .85rem;font-size:clamp(3.2rem,11vw,6.4rem);font-weight:800;line-height:.92}.hero-lead{font-family:var(--font-display);letter-spacing:-.02em;color:#ffffffeb;max-width:22em;margin:0 0 .75rem;font-size:clamp(1.15rem,2.6vw,1.55rem);font-weight:600;line-height:1.25}.hero-sub{color:#dfe8eed1;max-width:28rem;margin:0 0 1.75rem;font-size:clamp(.95rem,1.6vw,1.08rem);line-height:1.55}.hero-cta__btn{border-radius:12px;padding:.95rem 1.55rem;animation:3.2s ease-in-out infinite alternate cta-glow;box-shadow:0 12px 32px #e23d2a59}.hero-cta__btn:hover:not(:disabled){transform:translateY(-2px)}@keyframes mosaic-breathe{0%{transform:scale(1.02)}to{transform:scale(1.06)translate(-.6%,-.4%)}}@keyframes bead-pop{0%{opacity:0;transform:scale(.55)}to{opacity:1;transform:none}}@keyframes copy-rise{0%{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}@keyframes cta-glow{0%{box-shadow:0 12px 28px #e23d2a47}to{box-shadow:0 16px 40px #e23d2a6b}}@media (prefers-reduced-motion:reduce){.hero-mosaic,.hero-mosaic span,.hero-copy,.hero-cta__btn{animation:none!important}}.features{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:linear-gradient(#ffffff8c,#eef3f659);grid-template-columns:repeat(3,minmax(0,1fr));gap:0;width:100%;max-width:1180px;margin:0 auto;padding:0 clamp(1.25rem,5vw,4.5rem);display:grid}.feature{border-right:1px solid var(--line);grid-template-columns:auto 1fr;align-items:start;gap:1rem;padding:2rem 1.35rem 2.15rem;display:grid}.feature:last-child{border-right:0}.feature__index{font-family:var(--font-display);letter-spacing:.08em;color:var(--accent);padding-top:.35rem;font-size:.85rem;font-weight:700}.feature__body h2{font-family:var(--font-display);letter-spacing:-.03em;color:var(--ink);margin:0 0 .45rem;font-size:1.35rem;font-weight:700}.feature__body p{color:var(--muted);margin:0;font-size:.95rem;line-height:1.55}.site-footer,.legal-page .muted,.muted{color:var(--muted)}.site-footer{text-align:center;padding:1.5rem 1.5rem 2.75rem;font-size:.9rem}.legal-page{max-width:720px;margin:0 auto;padding:2.5rem 1.25rem 4rem}.legal-page h1{font-family:var(--font-display);letter-spacing:-.03em;font-size:2.4rem;font-weight:700}.blog-page{width:min(720px,100%);margin:0 auto;padding:2.25rem clamp(1.15rem,4vw,2rem) 3.5rem}.blog-page__hero{margin-bottom:2rem}.blog-page__eyebrow{letter-spacing:.08em;text-transform:uppercase;color:var(--accent);margin:0 0 .45rem;font-size:.78rem;font-weight:700}.blog-page__hero h1{font-family:var(--font-display);letter-spacing:-.04em;margin:0 0 .55rem;font-size:clamp(2rem,5vw,2.8rem);font-weight:800}.blog-page__lead{color:var(--ink-soft);margin:0;font-size:1.05rem}.blog-list{gap:1.25rem;margin:0;padding:0;list-style:none;display:grid}.blog-card{border-top:1px solid var(--line);padding:1.25rem 0}.blog-card time{color:var(--muted);margin-bottom:.35rem;font-size:.82rem;display:block}.blog-card h2{font-family:var(--font-display);letter-spacing:-.03em;margin:0 0 .45rem;font-size:1.35rem;font-weight:700;line-height:1.25}.blog-card h2 a:hover{color:var(--accent-deep)}.blog-card p{color:var(--muted);margin:0 0 .75rem;font-size:.95rem}.blog-card__more{color:var(--teal);font-size:.92rem;font-weight:700}.blog-article__meta{color:var(--muted);flex-wrap:wrap;align-items:center;gap:.45rem;margin:0 0 1.25rem;font-size:.88rem;display:flex}.blog-article__meta a{color:var(--teal);font-weight:700}.blog-article__body h1{font-family:var(--font-display);letter-spacing:-.04em;margin:0 0 1rem;font-size:clamp(1.85rem,4.5vw,2.45rem);font-weight:800;line-height:1.15}.blog-article__body h2{font-family:var(--font-display);letter-spacing:-.03em;margin:1.75rem 0 .65rem;font-size:1.35rem;font-weight:700}.blog-article__body h3{margin:1.25rem 0 .45rem;font-size:1.05rem}.blog-article__body p,.blog-article__body li{color:var(--ink-soft);font-size:1.02rem;line-height:1.7}.blog-article__body p{margin:0 0 .95rem}.blog-article__body ul{margin:0 0 1rem;padding-left:1.2rem}.blog-article__body li{margin:.25rem 0}.blog-article__body a{color:var(--teal);text-underline-offset:2px;font-weight:600;text-decoration:underline}.blog-article__body hr{border:0;border-top:1px solid var(--line);margin:1.75rem 0}.blog-article__cta{border-top:1px solid var(--line);margin-top:2rem;padding-top:1.25rem}.blog-missing{color:var(--muted)}.app-shell:has(.editor-page){height:100vh;overflow:hidden}.app-shell:has(.editor-page) .site-header{flex-shrink:0;padding:.45rem 1rem}.editor-page{grid-template-columns:minmax(280px,340px) minmax(0,1fr) minmax(240px,300px);gap:0;height:calc(100vh - 52px);min-height:0;display:grid;overflow:hidden}.editor-page--bp{background:#faf8fc;grid-template-columns:220px 136px minmax(0,1fr)}.editor-page__error{z-index:20;margin:0;position:absolute;top:56px;left:50%;transform:translate(-50%)}.editor-col{flex-direction:column;min-height:0;display:flex;overflow:hidden}.editor-col__title{color:var(--ink-soft);margin:0 0 .5rem;font-size:.82rem;font-weight:700}.editor-col--source{border-right:1px solid var(--line);background:#fff;gap:.55rem;padding:.65rem}.source-panel{gap:.5rem;display:grid}.source-panel.is-drag{outline:2px dashed var(--teal);outline-offset:-4px;border-radius:12px}.source-panel__frame{border:1px solid var(--line);background-color:#f4f7f9;background-image:linear-gradient(45deg,#e8eef2 25%,#0000 25%),linear-gradient(-45deg,#e8eef2 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#e8eef2 75%),linear-gradient(-45deg,#0000 75%,#e8eef2 75%);background-position:0 0,0 0,0 0,0 0;background-repeat:repeat,repeat,repeat,repeat;background-size:10px 10px;background-attachment:scroll,scroll,scroll,scroll;background-origin:padding-box,padding-box,padding-box,padding-box;background-clip:border-box,border-box,border-box,border-box;border-radius:12px;width:100%;min-height:120px;max-height:160px;position:relative;overflow:hidden}.source-panel__inner{position:absolute;overflow:hidden}.source-panel__img{object-fit:contain;width:100%;height:100%;display:block}.source-panel__empty{cursor:pointer;background:#dfe8ee73;border:1.5px dashed #15202b38;border-radius:12px;place-content:center;gap:.25rem;min-height:180px;display:grid}.btn-block{width:100%}.colors-panel{border-top:1px solid var(--line);flex-direction:column;flex:1;min-height:0;padding-top:.55rem;display:flex}.colors-panel__meta{color:var(--muted);margin:0 0 .45rem;font-size:.72rem}.colors-panel__grid{flex:1;grid-template-columns:repeat(4,minmax(0,1fr));align-content:start;gap:.3rem;min-height:0;max-height:calc(100vh - 280px);display:grid;overflow-y:auto}.color-tile-wrap{position:relative}.color-tile-exclude{color:#fff;cursor:pointer;opacity:0;background:#0000008c;border:none;border-radius:999px;width:16px;height:16px;padding:0;font-size:.62rem;line-height:1;position:absolute;top:2px;right:2px}.color-tile-wrap:hover .color-tile-exclude,.color-tile-exclude.on{opacity:1}.color-tile{border:1px solid var(--line);cursor:pointer;text-align:center;background:#fff;border-radius:6px;gap:.1rem;padding:.28rem .2rem;font-size:.62rem;display:grid}.color-tile.active{outline:2px solid var(--teal);outline-offset:-1px}.color-tile.excluded{opacity:.45}.color-tile__swatch{aspect-ratio:1;border:1px solid #00000014;border-radius:4px;width:100%}.color-tile__code{font-variant-numeric:tabular-nums;font-weight:700}.color-tile__count{color:var(--muted);font-size:.62rem}.editor-col--settings{border-right:1px solid var(--line);background:#ffffffeb;gap:.55rem;padding:.65rem .55rem;overflow-y:auto}.settings-field{color:var(--ink-soft);gap:.25rem;font-size:.72rem;display:grid}.settings-field input[type=number],.settings-field select{border:1px solid var(--line);border-radius:8px;width:100%;padding:.4rem .45rem;font-size:.85rem}.settings-field em{color:var(--muted);font-size:.65rem;font-style:normal}.settings-field--range{grid-template-columns:1fr auto;align-items:center}.settings-field--range input[type=range]{grid-column:1/-1}.settings-link{justify-self:start;padding:0;font-size:.75rem}.settings-more{font-size:.75rem}.settings-more summary{cursor:pointer;color:var(--teal);margin-bottom:.45rem;font-weight:600}.settings-toggles{gap:.35rem;margin-top:.15rem;display:grid}.toggle--sm{font-size:.68rem}.editor-col--workspace{flex-direction:column;min-height:0;padding:.45rem;display:flex}.workspace{border:1px solid var(--line);background:#fff;border-radius:12px;flex:1;gap:.4rem;min-height:0;padding:.4rem;display:flex}.workspace__main{flex:1;min-width:0;min-height:0;display:flex;position:relative}.workspace__canvas{background:#f3f0fa;border-radius:8px;flex:1;min-width:0;min-height:0;overflow:hidden}.edit-drawer{z-index:5;border-left:1px solid var(--line);background:#fffffff7;align-content:start;gap:.45rem;width:min(240px,38%);padding:.55rem;display:grid;position:absolute;top:0;bottom:0;right:0;overflow-y:auto;box-shadow:-8px 0 24px #15202b14}.edit-drawer__head{justify-content:space-between;align-items:center;font-size:.85rem;display:flex}.edit-drawer__close{cursor:pointer;color:var(--muted);background:0 0;border:none;font-size:1.25rem;line-height:1}.edit-drawer__color{align-items:center;gap:.45rem;font-size:.78rem;display:flex}.edit-drawer__swatch{border:1px solid #0000001a;border-radius:6px;width:28px;height:28px}.edit-drawer__hint{margin:0;font-size:.68rem}.tool-row{grid-template-columns:repeat(3,1fr);gap:.3rem;display:grid}.tool-row__btn{border:1px solid var(--line);cursor:pointer;background:#fff;border-radius:8px;padding:.35rem .2rem;font-size:.68rem}.tool-row__btn.active{background:var(--ink);color:#fff;border-color:var(--ink)}.tool-hint--compact{margin:0;font-size:.68rem}.recolor-box--compact{gap:.35rem}.rail-export{gap:.25rem;margin-top:auto;display:grid;position:relative}.rail-btn--more{height:28px;font-size:.65rem}.export-popover{z-index:10;border:1px solid var(--line);box-shadow:var(--shadow);background:#fff;border-radius:10px;gap:.15rem;padding:.25rem;display:grid;position:absolute;bottom:calc(100% + 4px);left:0;right:0}.export-popover button{text-align:left;cursor:pointer;background:0 0;border:none;border-radius:6px;padding:.4rem .45rem;font-size:.72rem}.export-popover button:hover{background:#1f8a7a14}.rail-btn--download{min-height:44px;font-size:.68rem}.canvas-rail{flex-direction:column;flex-shrink:0;gap:.35rem;width:48px;display:flex}.rail-btn{border:1px solid var(--line);cursor:pointer;background:#fff;border-radius:10px;place-items:center;width:40px;height:40px;padding:0;font-size:1.1rem;display:grid}.rail-btn:disabled{opacity:.35;cursor:not-allowed}.rail-btn.active{border-color:var(--teal);background:#1f8a7a1f}.rail-btn--text{height:auto;min-height:44px;padding:.25rem;font-size:.68rem;font-weight:700}.rail-btn--download{background:var(--coral);color:#fff;border-color:#0000;min-height:48px;margin-top:auto;font-size:.72rem;font-weight:700}.rail-divider{background:var(--line);height:1px;margin:.15rem 0}.compare-hint{color:#fff;background:#15202bb8;border-radius:999px;padding:.35rem .75rem;font-size:.72rem;font-weight:600}.compare-hint.is-active{background:#1f8a7aeb}.canvas-hud{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:.35rem;display:flex}.editor-panel--left{border-right:1px solid var(--line);padding-bottom:0;overflow:hidden}.left-scroll{flex-direction:column;flex:1;gap:.55rem;min-height:0;padding-bottom:.65rem;padding-right:.15rem;display:flex;overflow:hidden auto}.panel-block{border:1px solid var(--line);background:#fff;border-radius:14px;gap:.5rem;padding:.65rem;display:grid}.panel-block__title{letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:0;font-size:.72rem;font-weight:700}.panel-block--edit{margin-bottom:.15rem}.source-compact{border:1px solid var(--line);background:#fff;border-radius:14px;flex-shrink:0;justify-items:center;gap:.45rem;padding:.55rem;display:grid}.source-compact.is-drag{outline:2px dashed var(--teal);outline-offset:-4px}.source-compact__matte{background-color:#f4f7f9;background-image:linear-gradient(45deg,#e8eef2 25%,#0000 25%),linear-gradient(-45deg,#e8eef2 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#e8eef2 75%),linear-gradient(-45deg,#0000 75%,#e8eef2 75%);background-position:0 0,0 5px,5px -5px,-5px 0;background-repeat:repeat,repeat,repeat,repeat;background-size:10px 10px;background-attachment:scroll,scroll,scroll,scroll;background-origin:padding-box,padding-box,padding-box,padding-box;background-clip:border-box,border-box,border-box,border-box;border-radius:10px;width:100%;max-width:100%;max-height:120px;position:relative;overflow:hidden}.source-compact__inner{position:absolute;overflow:hidden}.source-compact__img{object-fit:contain;width:100%;height:100%;display:block}.source-compact__empty{cursor:pointer;width:100%;min-height:88px;color:var(--ink-soft);background:#dfe8ee73;border:1.5px dashed #15202b38;border-radius:12px;place-content:center;gap:.2rem;display:grid}.source-compact__empty span{color:var(--muted);font-size:.78rem}.editor-stage{border-radius:16px;height:100%;min-height:0;margin:.65rem .65rem .65rem 0}.seg--wrap{flex-wrap:wrap}.width-custom{color:var(--ink-soft);grid-template-columns:auto 72px 1fr;align-items:center;gap:.4rem .5rem;margin-top:.35rem;font-size:.78rem;display:grid}.width-custom input{border:1px solid var(--line);font-variant-numeric:tabular-nums;border-radius:8px;width:100%;padding:.35rem .45rem;font-size:.85rem}.width-custom em{color:var(--muted);grid-column:2/-1;font-size:.72rem;font-style:normal}.btn-sm{padding:.35rem .75rem;font-size:.78rem}.color-picker--compact{max-height:140px;padding-right:.15rem;overflow-y:auto}.editor-panel{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#fbfcfdf5;flex-direction:column;gap:.5rem;height:100%;max-height:none;padding:.65rem .7rem;display:flex;overflow:hidden}.editor-panel--right{border-left:1px solid var(--line);overflow:hidden}.panel-head--compact{align-items:center;margin-bottom:0}.panel-head--compact h1{margin:0;font-size:1.2rem}.panel-tabs{background:#e8eef2;border-radius:12px;flex-shrink:0;grid-template-columns:1fr 1fr;gap:4px;padding:4px;display:grid}.panel-tabs__btn{color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:9px;padding:.45rem .35rem;font-size:.82rem;font-weight:700}.panel-tabs__btn.active{color:var(--ink);background:#fff;box-shadow:0 1px 4px #15202b1a}.panel-card{border:1px solid var(--line);background:#fff;border-radius:14px;align-content:start;gap:.55rem;margin:0;padding:.7rem .65rem;display:grid}.panel-card--fill{flex:1;min-height:0;overflow:auto}.panel-card--edit{box-shadow:none;flex-direction:column;display:flex;position:static;overflow:hidden}.panel-card--edit .field--grow{flex-direction:column;flex:1;min-height:0;display:flex}.panel-card--edit .color-picker{flex:1;min-height:0;max-height:none}.toggle-list--compact{grid-template-columns:1fr 1fr;gap:.15rem .45rem;display:grid}.toggle-list--compact .toggle{padding:.2rem 0;font-size:.78rem}.toggle-list--compact .toggle__ui{width:28px;height:16px}.toggle-list--compact .toggle__ui:after{width:12px;height:12px}.toggle-list--compact .toggle.on .toggle__ui:after{transform:translate(12px)}.field--tight{gap:.15rem}.editor-workspace{background:linear-gradient(#dfe8eea6,#eef3f659);grid-template-columns:1fr 1.15fr;gap:.65rem;height:100%;min-height:0;padding:.65rem;display:grid;overflow:hidden}.view-pane{border:1px solid var(--line);background:#fbfcfdeb;border-radius:16px;flex-direction:column;height:100%;min-height:0;display:flex;overflow:hidden;box-shadow:0 10px 28px #15202b0f}.view-pane__head{border-bottom:1px solid var(--line);background:#ffffffb8;flex-shrink:0;justify-content:space-between;align-items:center;gap:.75rem;padding:.55rem .85rem;display:flex}.view-pane__body{background:repeating-conic-gradient(#eef3f6 0% 25%,#f7fafb 0% 50%) 0 0/22px 22px;flex:1;place-items:center;min-height:0;padding:.65rem;display:grid;overflow:hidden}.view-pane__body--canvas{place-items:stretch stretch;padding:0}.source-preview{object-fit:contain;width:auto;max-width:100%;height:auto;max-height:100%;box-shadow:var(--shadow);background:#fff;border-radius:10px}.source-frame{grid-template-rows:1fr auto;justify-items:center;gap:.55rem;width:100%;height:100%;min-height:0;display:grid}.source-frame .source-preview{object-fit:contain;width:100%;height:100%;min-height:0;max-height:100%;display:block}.source-matte{width:min(100%,420px);max-width:100%;min-height:0;max-height:100%;box-shadow:var(--shadow);background-color:#f4f7f9;background-image:linear-gradient(45deg,#e8eef2 25%,#0000 25%),linear-gradient(-45deg,#e8eef2 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#e8eef2 75%),linear-gradient(-45deg,#0000 75%,#e8eef2 75%);background-position:0 0,0 6px,6px -6px,-6px 0;background-repeat:repeat,repeat,repeat,repeat;background-size:12px 12px;background-attachment:scroll,scroll,scroll,scroll;background-origin:padding-box,padding-box,padding-box,padding-box;background-clip:border-box,border-box,border-box,border-box;border-radius:10px;position:relative;overflow:hidden}.source-matte__inner{border-radius:4px;position:absolute;overflow:hidden}.source-matte__inner .source-preview{box-shadow:none;background:0 0;border-radius:0}.palette-picker{gap:.4rem;display:grid}.palette-picker__meta{align-items:center;gap:.45rem;font-size:.82rem;display:flex}.palette-picker__chip{border:1px solid #15202b26;border-radius:6px;width:22px;height:22px}.view-pane__actions{align-items:center;gap:.5rem;display:flex}.btn-ghost{border:1px solid var(--line);background:0 0;padding:.28rem .55rem;font-size:.75rem}.btn-ghost.active{border-color:var(--teal);color:var(--teal);background:#1f8a7a1f}.material-row-wrap{grid-template-columns:1fr auto;align-items:stretch;gap:.25rem;display:grid}.material-row.active,.color-chip.active{background:#15202b0f}.color-chip__count{color:var(--muted);font-variant-numeric:tabular-nums;font-size:.68rem}.material-row.active,.color-chip.highlighted,.material-row.highlighted{outline:none}.material-row.excluded{opacity:.45;text-decoration:line-through}.material-exclude{border:1px solid var(--line);cursor:pointer;width:28px;color:var(--muted);background:#fff;border-radius:8px;font-size:.85rem}.material-exclude.on{color:var(--teal);border-color:var(--teal);background:#1f8a7a14}.owned-toolbar{margin-bottom:.65rem}.recolor-box{border:1px solid var(--line);background:#15202b0a;border-radius:12px;gap:.65rem;padding:.7rem;display:grid}.recolor-box__pair{grid-template-columns:1fr 1fr;gap:.55rem;display:grid}.recolor-swatch{justify-items:start;gap:.25rem;display:grid}.recolor-swatch__chip{border:1px solid #15202b26;border-radius:8px;width:28px;height:28px;box-shadow:inset 0 0 0 1px #ffffff59}.recolor-swatch strong{font-size:.82rem}.recolor-box .btn-primary{width:100%}.editor-panel--right .meta-card{flex-shrink:0}.editor-panel--right .panel-section{border:0;flex-direction:column;min-height:0;margin:0;padding:0;display:flex}.editor-panel--right .panel-section:last-child{flex:1;min-height:0}.editor-panel--right .material-list{flex:1;min-height:0;overflow:auto}.editor-panel--right .export-row .btn{padding:.4rem .65rem;font-size:.78rem}.upload-zone{cursor:pointer;background:#dfe8ee73;border:1.5px dashed #15202b38;border-radius:14px;gap:.25rem;padding:1rem .9rem;transition:border-color .15s,background .15s,transform .15s;display:grid}.upload-zone strong{color:var(--ink);font-size:.95rem}.upload-zone span{color:var(--muted);font-size:.8rem;font-weight:500}.upload-zone:hover,.upload-zone.is-drag{border-color:var(--teal);background:#1f8a7a1a;transform:translateY(-1px)}.upload-zone.has-file{border-style:solid;border-color:#1f8a7a59}.form-error{color:var(--accent-deep);margin:.55rem 0 0;font-size:.82rem;font-weight:600}.btn-ghost{color:var(--teal);box-shadow:none;background:0 0;border-color:#0000;padding:.3rem .55rem}.btn-ghost:hover:not(:disabled){box-shadow:none;background:#1f8a7a1a;transform:none}.field,.field-row .field{gap:.35rem;display:grid}.field-row{grid-template-columns:1fr 1fr;gap:.55rem;display:grid}.field-label{letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-size:.72rem;font-weight:700}.field-select{border:1px solid var(--line);background:#f7fafb;border-radius:10px;width:100%;padding:.48rem .6rem}.seg{background:#eef3f6;border-radius:12px;grid-template-columns:repeat(5,1fr);gap:4px;padding:4px;display:grid}.seg__btn{color:var(--ink-soft);cursor:pointer;background:0 0;border:0;border-radius:9px;padding:.42rem 0;font-size:.8rem;font-weight:700}.seg__btn.active{color:var(--ink);background:#fff;box-shadow:0 1px 4px #15202b1a}.toggle-list{gap:.35rem;display:grid}.toggle{color:var(--ink-soft);cursor:pointer;align-items:center;gap:.55rem;padding:.35rem .2rem;font-size:.86rem;font-weight:600;display:flex}.toggle input{opacity:0;pointer-events:none;position:absolute}.toggle__ui{background:#c9d5de;border-radius:999px;flex:none;width:34px;height:20px;transition:background .15s;position:relative}.toggle__ui:after{content:"";background:#fff;border-radius:50%;width:16px;height:16px;transition:transform .15s;position:absolute;top:2px;left:2px}.toggle.on .toggle__ui{background:var(--teal)}.toggle.on .toggle__ui:after{transform:translate(14px)}.active-color{border:1px solid var(--line);background:linear-gradient(135deg,#1f8a7a1a,#e23d2a0f);border-radius:12px;align-items:center;gap:.75rem;padding:.65rem;display:flex}.active-color__swatch{border:1px solid #0000001f;border-radius:12px;width:44px;height:44px;box-shadow:inset 0 0 0 1px #ffffff59}.active-color__meta{gap:.1rem;display:grid}.active-color__meta strong{letter-spacing:-.02em;font-size:1.15rem}.tool-grid{grid-template-columns:repeat(3,1fr);gap:.4rem;display:grid}.tool-btn{border:1px solid var(--line);color:var(--ink-soft);cursor:pointer;background:#f7fafb;border-radius:11px;padding:.55rem .35rem;font-size:.8rem;font-weight:700}.tool-btn.active{background:var(--ink);color:#fff;border-color:#0000}.tool-actions{grid-template-columns:1fr 1fr 1fr;gap:.4rem;display:grid}.tool-hint{color:var(--ink-soft);background:#1f8a7a1a;border-radius:10px;margin:0;padding:.55rem .65rem;font-size:.78rem;line-height:1.4}.color-picker{grid-template-columns:repeat(4,minmax(0,1fr));gap:.35rem;max-height:220px;padding:.25rem;display:grid;overflow:auto}.color-chip{cursor:pointer;background:0 0;border:1px solid #0000;border-radius:10px;justify-items:center;gap:.2rem;padding:.3rem .15rem;display:grid}.color-chip__swatch{aspect-ratio:1;border:1px solid #0000001f;border-radius:8px;width:100%}.color-chip__code{color:var(--muted);font-size:.68rem;font-weight:700;line-height:1}.color-chip.active{background:#15202b0f;border-color:#15202b1f}.color-chip.active .color-chip__code{color:var(--ink)}.color-chip.active .color-chip__swatch{outline:2px solid var(--accent);outline-offset:1px}.source-frame{justify-items:center;gap:.85rem;width:100%;display:grid;position:relative}.btn-replace{min-width:160px;padding:.7rem 1.2rem;font-size:.95rem;box-shadow:0 10px 24px #e23d2a47}.view-pane--source.is-drag{outline:2px dashed var(--teal);outline-offset:-6px}.view-pane__head h2{font-family:var(--font-display);letter-spacing:-.02em;margin:0;font-size:1.15rem;font-weight:400}.view-meta{color:var(--muted);font-variant-numeric:tabular-nums;font-size:.78rem;font-weight:700}.panel-head{flex-shrink:0;justify-content:space-between;align-items:center;gap:.5rem;display:flex}.panel-head h1{font-family:var(--font-display);letter-spacing:-.02em;margin:0;font-size:1.2rem;font-weight:400}.live-pill{letter-spacing:.04em;text-transform:uppercase;color:var(--accent-deep);background:#e23d2a1f;border-radius:999px;flex-shrink:0;align-items:center;gap:.35rem;padding:.28rem .55rem;font-size:.68rem;font-weight:700;display:inline-flex}.live-pill--ok{color:var(--teal);background:#1f8a7a24}.live-pill--ok:before,.live-pill:not(.live-pill--ok):before{content:"";background:currentColor;border-radius:50%;width:6px;height:6px}.panel-section{border-bottom:1px solid var(--line);margin-bottom:1.15rem;padding-bottom:1.05rem}.panel-section:last-child{border-bottom:0}.section-label{letter-spacing:.07em;text-transform:uppercase;color:var(--muted);margin:0 0 .55rem;font-size:.72rem;font-weight:700}.toolbar-row,.export-row,.tools-row,.chip-row,.swatch-row{flex-wrap:wrap;gap:.45rem;display:flex}.control-grid{gap:.85rem;display:grid}.control-grid label{color:var(--ink-soft);gap:.35rem;font-size:.86rem;font-weight:600;display:grid}.control-pair{grid-template-columns:1fr 1fr;gap:.65rem;display:grid}.control-grid select,.control-grid input[type=range]{width:100%}.control-grid select{border:1px solid var(--line);border-radius:var(--radius-sm);background:#fff;padding:.5rem .65rem}.range-label{justify-content:space-between;display:flex}.range-label em{color:var(--muted);font-variant-numeric:tabular-nums;font-style:normal}input[type=range]{accent-color:var(--accent)}.check-grid{grid-template-columns:1fr 1fr;gap:.45rem .75rem;display:grid}.check{align-items:center;gap:.45rem;grid-template-columns:none!important;font-weight:500!important;display:flex!important}.chip{border:1px solid var(--line);cursor:pointer;color:var(--ink-soft);background:#fff;border-radius:999px;padding:.35rem .72rem;font-size:.82rem;font-weight:600;transition:background .12s,color .12s,border-color .12s}.chip:hover:not(:disabled){border-color:#15202b38}.chip.active{background:var(--ink);color:#fff;border-color:#0000}.chip:disabled{opacity:.35;cursor:not-allowed}.swatch{cursor:pointer;border:1px solid #00000024;border-radius:6px;width:22px;height:22px;padding:0}.swatch-lg{cursor:default;width:28px;height:28px}.swatch.active{outline:2px solid var(--accent);outline-offset:1px}.brush-current{align-items:center;gap:.55rem;margin:.65rem 0 .5rem;font-size:.9rem;font-weight:700;display:flex}.brush-palette{border-radius:var(--radius-sm);background:#dfe8ee73;flex-wrap:wrap;gap:5px;max-height:150px;padding:.35rem;display:flex;overflow:auto}.editor-main{background:linear-gradient(#dfe8ee8c,#eef3f633),repeating-conic-gradient(#e7eef2 0% 25%,#f2f6f8 0% 50%) 0 0/28px 28px;min-height:480px;position:relative}.empty-stage{width:100%;height:100%;min-height:280px;color:var(--ink-soft);cursor:pointer;text-align:center;background:0 0;border:0;place-content:center;justify-items:center;gap:.55rem;padding:2rem;display:grid}.empty-stage--pane{border-radius:12px;min-height:320px}.empty-stage.is-static{cursor:default}.empty-stage__icon{width:64px;height:64px;box-shadow:var(--shadow);background:linear-gradient(135deg,#e23d2ae6,#1f8a7ad9);border-radius:18px;margin-bottom:.4rem}.empty-stage strong{font-family:var(--font-display);color:var(--ink);font-size:1.8rem;font-weight:400}.empty-stage p{max-width:280px;color:var(--muted);margin:0}.canvas-stage{place-items:center;width:100%;height:100%;min-height:0;padding:.75rem;display:grid;position:relative;overflow:auto}.canvas-transform{transform-origin:50%;transition:opacity .12s}.canvas-stack{flex-shrink:0;position:relative}.compare-canvas,.pattern-canvas{box-shadow:var(--shadow);border-radius:8px;display:block}.compare-canvas{z-index:2;pointer-events:none;position:absolute;inset:0}.pattern-canvas{z-index:1;touch-action:none;cursor:inherit;background:#fff;position:relative}.compare-badge{color:#fff;background:#1f8a7aeb;border-radius:999px;margin-left:.45rem;padding:.35rem .7rem;font-size:.75rem;font-weight:600}.pattern-canvas.tool-pan{cursor:grab}.canvas-hud{z-index:3;position:absolute;bottom:14px;right:14px}.zoom-badge{color:#fff;letter-spacing:.02em;background:#15202bc7;border-radius:999px;padding:.35rem .7rem;font-size:.75rem;font-weight:600}.meta-card{border-radius:var(--radius);border:1px solid var(--line);background:linear-gradient(160deg,#1f8a7a1a,#e23d2a0f);gap:.2rem;margin-bottom:1rem;padding:1rem;display:grid}.meta-card p{margin:0;font-size:.9rem}.meta-size{font-family:var(--font-display);letter-spacing:-.02em;font-size:2rem;line-height:1}.material-list{gap:.2rem;display:grid}.material-head,.material-row{text-align:left;grid-template-columns:18px 1fr 48px 64px;align-items:center;gap:.35rem;display:grid}.material-head{color:var(--muted);text-transform:uppercase;letter-spacing:.04em;padding:0 .35rem .25rem;font-size:.72rem;font-weight:700}.material-row{cursor:pointer;background:0 0;border:0;border-radius:8px;padding:.42rem .35rem;font-size:.88rem}.material-row:hover{background:#1f8a7a14}.dot{border:1px solid #0000001f;border-radius:4px;width:14px;height:14px;display:inline-block}.side-placeholder{padding:1rem;font-size:.92rem}.modal-backdrop{z-index:50;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#15202b7a;place-items:center;padding:1rem;display:grid;position:fixed;inset:0}.modal{background:var(--card);border:1px solid var(--line);width:100%;max-width:760px;max-height:80vh;box-shadow:var(--shadow);border-radius:20px;padding:1.4rem;overflow:auto}.modal h2{font-family:var(--font-display);margin:0 0 .35rem;font-weight:400}.owned-grid{grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:.35rem;margin:.85rem 0 1.1rem;display:grid}.owned-item{align-items:center;gap:.3rem;font-size:.84rem;display:flex}@media (width<=1100px){.landing .hero{align-items:flex-end;min-height:calc(100svh - 58px);padding-bottom:2.75rem}.hero-veil{background:linear-gradient(#121c2459 0%,#121c248c 35%,#121c24e0 100%)}.hero-mosaic{grid-template-columns:repeat(8,1fr);animation:none}.features{grid-template-columns:1fr}.feature{border-right:0;border-bottom:1px solid var(--line);padding:1.5rem .25rem 1.6rem}.feature:last-child{border-bottom:0}.editor-page{grid-template-columns:1fr;height:auto;min-height:calc(100vh - 52px);overflow:visible}.editor-stage{min-height:55vh;margin:0}.left-scroll{max-height:none;overflow:visible}.app-shell:has(.editor-page){height:auto;overflow:auto}.editor-workspace{grid-template-columns:1fr;height:auto;min-height:60vh}.editor-panel{border:0;border-bottom:1px solid var(--line);height:auto;max-height:none;overflow:visible}.panel-card--fill,.panel-card--edit{max-height:none;overflow:visible}.canvas-stage,.source-preview{min-height:46vh;max-height:62vh}.nav-links{display:none}}.bp-editor{--ink:#15202b;--ink-soft:#3d4f5f;--muted:#6a7d8c;--accent:#e23d2a;--accent-deep:#b82c1d;--teal:#1f8a7a;--bg:#eef3f6;--bg-deep:#dfe8ee;--card:#fbfcfd;--line:#15202b1a;--shadow:0 12px 36px #15202b14;--radius:14px;--radius-sm:10px;--font-display:"Instrument Serif", "Times New Roman", serif;--font-body:"DM Sans", "Segoe UI", sans-serif;background:linear-gradient(165deg, #1f8a7a0f, transparent 42%), linear-gradient(345deg, #e23d2a0d, transparent 38%), var(--bg);min-height:calc(100vh - 64px);color:var(--ink);font-family:var(--font-body);box-sizing:border-box}.app-shell:has(.bp-editor){min-height:100vh;background:var(--bg)!important}.bp-editor__shell{box-sizing:border-box;grid-template-columns:1fr;align-content:start;gap:14px;max-width:1320px;margin:0 auto;padding:16px 20px 24px;display:grid}.bp-editor__main{grid-template-columns:1fr;gap:14px;min-height:0;display:grid}@media (width>=1024px){.bp-editor__shell{grid-template-rows:minmax(420px,1fr) auto;grid-template-columns:minmax(0,1fr) 280px;min-height:calc(100vh - 96px)}.bp-editor__main{display:contents}.bp-workspace{grid-area:1/1;height:100%;min-height:0}.bp-rail{grid-area:1/2;height:100%;min-height:0}.bp-panel--colors{grid-area:2/1/auto/-1}}.bp-workspace{flex-direction:column;gap:10px;min-width:0;min-height:0;display:flex}.bp-workspace-meta{color:var(--muted);flex-shrink:0;justify-content:space-between;align-items:baseline;gap:12px;padding:0 2px;font-size:13px;display:flex}.bp-workspace-meta strong{font-family:var(--font-display);color:var(--ink);letter-spacing:-.02em;font-size:1.35rem;font-weight:400}.bp-rail{flex-direction:column;gap:12px;min-width:0;min-height:0;padding-right:2px;display:flex;overflow:auto}.bp-rail .bp-panel--source{flex-direction:column;flex:auto;min-height:0;display:flex}.bp-rail .bp-panel--source .bp-source__body{flex:auto;min-height:140px}.bp-rail .bp-panel--settings{flex:none}.bp-panel{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);box-sizing:border-box;padding:14px}.bp-panel__title{font-family:var(--font-display);color:var(--ink);letter-spacing:-.02em;margin:0 0 10px;font-size:1.15rem;font-weight:400}.bp-panel__title--sm{font-size:1.05rem}.bp-panel--source{flex-direction:column;gap:8px;display:flex}.bp-source__body{justify-content:center;align-items:center;width:100%;min-height:120px;display:flex}.bp-source__frame{border-radius:var(--radius-sm);border:1px solid var(--line);background-color:#0000;background-image:linear-gradient(45deg,#e8eef2 25%,#0000 25%),linear-gradient(-45deg,#e8eef2 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#e8eef2 75%),linear-gradient(-45deg,#0000 75%,#e8eef2 75%);background-position:0 0,0 5px,5px -5px,-5px 0;background-repeat:repeat,repeat,repeat,repeat;background-size:10px 10px;background-attachment:scroll,scroll,scroll,scroll;background-origin:padding-box,padding-box,padding-box,padding-box;background-clip:border-box,border-box,border-box,border-box;width:100%;max-height:150px;position:relative;overflow:hidden}.bp-source__inner{position:absolute;overflow:hidden}.bp-source__img{object-fit:contain;width:100%;height:100%;display:block}.bp-source__upload{cursor:pointer;color:var(--muted);border-radius:var(--radius-sm);background:#1f8a7a0a;border:1.5px dashed #1f8a7a73;flex-direction:column;justify-content:center;align-items:center;gap:6px;width:100%;min-height:120px;padding:16px 12px;font-family:inherit;transition:border-color .15s,background .15s,color .15s;display:flex}.bp-source__upload:hover,.bp-source__upload.is-dragover{border-color:var(--teal);color:var(--teal);background:#1f8a7a14}.bp-source__upload-icon{border:1.5px dashed;border-radius:6px;width:28px;height:28px;margin-bottom:2px;position:relative}.bp-source__upload-icon:before,.bp-source__upload-icon:after{content:"";background:currentColor;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.bp-source__upload-icon:before{width:12px;height:2px}.bp-source__upload-icon:after{width:2px;height:12px}.bp-source__upload strong{color:var(--ink);font-size:13px;font-weight:600}.bp-source__upload span{color:var(--muted);text-align:center;font-size:11px;line-height:1.35}.bp-source__upload:hover strong,.bp-source__upload.is-dragover strong{color:var(--teal)}.bp-btn--pink{background:linear-gradient(135deg, var(--accent), var(--accent-deep));color:#fff;cursor:pointer;border:none;border-radius:999px;width:100%;margin-top:4px;padding:8px 12px;font-family:inherit;font-size:12px;font-weight:600;transition:transform .12s,filter .12s;box-shadow:0 8px 20px #e23d2a38}.bp-btn--pink:hover{filter:brightness(1.05);transform:translateY(-1px)}.bp-settings-grid{grid-template-columns:1fr 1fr;gap:10px;display:grid}.bp-field label{color:var(--ink-soft);margin-bottom:4px;font-size:11px;font-weight:600;line-height:1.3;display:block}.bp-field input,.bp-field select{box-sizing:border-box;border:1px solid var(--line);width:100%;color:var(--ink);background:#fff;border-radius:8px;outline:none;padding:8px 10px;font-family:inherit;font-size:13px;transition:border-color .12s,box-shadow .12s}.bp-field select{appearance:none}.bp-field input:focus,.bp-field select:focus{border-color:#1f8a7a8c;box-shadow:0 0 0 3px #1f8a7a1f}.bp-field--full{grid-column:span 2}.bp-btn--outline{width:100%;color:var(--ink-soft);border:1px solid var(--line);cursor:pointer;background:#fff;border-radius:8px;padding:8px 10px;font-family:inherit;font-size:12px;font-weight:600;transition:border-color .12s,color .12s}.bp-btn--outline:hover{border-color:var(--teal);color:var(--teal)}.bp-btn--apply{color:#fff;background:linear-gradient(135deg, var(--teal), #176f63);cursor:pointer;border:none;border-radius:999px;width:100%;padding:10px 0;font-family:inherit;font-size:13px;font-weight:700;transition:transform .12s;box-shadow:0 8px 20px #1f8a7a40}.bp-btn--apply:hover{transform:translateY(-1px)}.bp-working{color:var(--teal);grid-column:span 2;font-size:12px;font-weight:600}.bp-panel--colors{flex-direction:column;width:100%;min-height:0;padding-top:12px;padding-bottom:12px;display:flex}.bp-colors__head{flex-wrap:wrap;flex-shrink:0;justify-content:space-between;align-items:center;gap:8px 16px;margin-bottom:8px;display:flex}.bp-colors__head-row{flex-flow:wrap;align-items:baseline;gap:8px 12px;min-width:0;display:flex}.bp-colors__head .bp-panel__title{margin:0}.bp-colors__hint{color:var(--muted);margin:0;font-size:12px;line-height:1.35}.bp-colors__tabs{flex-shrink:0;gap:6px;display:flex}.bp-colors__tabs button{border:1px solid var(--line);min-width:64px;color:var(--ink-soft);cursor:pointer;background:#fff;border-radius:8px;padding:6px 12px;font-family:inherit;font-size:12px;font-weight:600;transition:background .12s,color .12s,border-color .12s}.bp-colors__tabs button:hover{border-color:var(--teal);color:var(--teal)}.bp-colors__tabs button.active{background:var(--ink);color:#fff;border-color:var(--ink)}.bp-colors__scroller{scrollbar-width:thin;scrollbar-color:var(--teal) var(--bg-deep);padding-bottom:4px;overflow:auto hidden}.bp-colors__scroller::-webkit-scrollbar{height:8px}.bp-colors__scroller::-webkit-scrollbar-track{background:var(--bg-deep);border-radius:999px}.bp-colors__scroller::-webkit-scrollbar-thumb{background:var(--teal);border-radius:999px}.bp-colors__grid{grid-template-rows:repeat(2,auto);grid-auto-columns:64px;grid-auto-flow:column;gap:8px;width:max-content;min-height:0;padding:2px;display:grid}.bp-color-cell{cursor:pointer;text-align:center;background:#fff;border:1px dashed #15202b38;border-radius:8px;flex-direction:column;justify-content:flex-start;align-items:center;gap:3px;width:64px;padding:6px 3px;font-family:inherit;transition:border-color .12s,box-shadow .12s;display:flex;position:relative}.bp-color-cell:hover{border-color:var(--teal);border-style:solid;box-shadow:0 0 0 2px #1f8a7a1f}.bp-color-cell.excluded{opacity:.4}.bp-color-cell.excluded .bp-color-cell__label{text-decoration:line-through}.bp-color-cell__swatch{border:1px solid #0000001f;border-radius:4px;flex-shrink:0;width:28px;height:28px}.bp-color-cell__label{width:100%;color:var(--ink);text-overflow:ellipsis;white-space:nowrap;font-size:11px;font-weight:700;line-height:1.15;overflow:hidden}.bp-color-cell__count{color:var(--muted);font-size:10px;font-weight:600;line-height:1.15}.bp-color-cell__x{color:var(--accent);font-size:12px;font-weight:700;position:absolute;top:2px;right:4px}.bp-colors__empty{text-align:center;color:var(--muted);padding:16px 8px;font-size:13px}.bp-canvas-panel{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);flex-direction:column;flex:1;min-height:0;display:flex;position:relative;overflow:hidden}.bp-canvas-viewport{flex-direction:column;flex:1;min-height:320px;display:flex;position:relative;overflow:hidden}@media (width>=1024px){.bp-workspace .bp-canvas-panel{flex:auto;min-height:0}.bp-workspace .bp-canvas-viewport{min-height:0}}.bp-canvas-tools{z-index:5;flex-direction:column;gap:6px;width:auto;display:none;position:absolute;top:12px;left:12px}@media (width>=768px){.bp-canvas-tools{display:flex}}.bp-tool-chip{color:var(--ink-soft);border:1px solid var(--line);cursor:pointer;white-space:nowrap;background:#fbfcfdf2;border-radius:999px;justify-content:center;align-items:center;padding:7px 10px;font-family:inherit;font-size:11px;font-weight:600;transition:transform .12s,border-color .12s,color .12s;display:inline-flex;box-shadow:0 4px 12px #15202b0f}.bp-tool-chip:hover:not(:disabled){border-color:var(--teal);color:var(--teal);transform:translateY(-1px)}.bp-tool-chip:disabled{opacity:.4;cursor:not-allowed}.bp-tool-chip.active{border-color:var(--accent);background:var(--accent);color:#fff}.bp-canvas-body{background:radial-gradient(circle at 1px 1px,#15202b0f 1px,#0000 0) 0 0/18px 18px,#f4f7f9;flex:1;justify-content:center;align-items:center;min-height:0;padding:16px;display:flex;position:relative;overflow:hidden}.bp-canvas-body .canvas-stage{width:100%;height:100%;min-height:160px;cursor:inherit;place-items:center;position:relative;overflow:hidden}.canvas-cell-tip{z-index:8;color:#fff;letter-spacing:.02em;pointer-events:none;white-space:nowrap;background:#0f172ae0;border-radius:6px;align-items:center;gap:6px;padding:5px 8px 5px 5px;font-size:12px;font-weight:700;display:inline-flex;position:absolute;transform:translate(0);box-shadow:0 4px 14px #0f172a47}.canvas-cell-tip__swatch{border:1px solid #ffffff8c;border-radius:2px;flex-shrink:0;width:14px;height:14px}.canvas-cell-tip__swatch.is-empty{background:linear-gradient(45deg,#ccc 25%,#0000 25%) 0 0/6px 6px,linear-gradient(-45deg,#ccc 25%,#0000 25%) 0 0/6px 6px,#fff}.canvas-cell-tip__code{line-height:1}.bp-canvas-body .canvas-transform{will-change:transform}.bp-editor .canvas-hud .zoom-badge{display:none}.bp-action{border:1px solid var(--line);color:var(--ink-soft);cursor:pointer;background:#fff;border-radius:999px;padding:9px 16px;font-family:inherit;font-size:13px;font-weight:600;transition:transform .12s,border-color .12s,color .12s}.bp-action:hover{border-color:var(--teal);color:var(--teal);transform:translateY(-1px)}.bp-action--primary{background:linear-gradient(135deg, var(--accent), var(--accent-deep));color:#fff;border-color:#0000;box-shadow:0 8px 20px #e23d2a38}.bp-action--primary:hover{color:#fff;filter:brightness(1.05);border-color:#0000}.bp-action--primary:disabled{opacity:.45;cursor:not-allowed}.bp-main-actions,.bp-edit-actions{flex-shrink:0;justify-content:flex-end;gap:8px;display:flex}.bp-main-actions--overlay{z-index:6;pointer-events:none;justify-content:flex-start;position:absolute;bottom:12px;left:12px}.bp-main-actions--overlay .bp-action{pointer-events:auto;box-shadow:0 6px 18px #15202b1f}.bp-edit-actions .bp-action:first-child{margin-right:auto}.bp-empty{color:var(--muted);text-align:center;border-radius:var(--radius-sm);background:#ffffffa6;border:1.5px dashed #6a7d8c73;max-width:280px;padding:2rem 1.5rem;font-size:14px;line-height:1.55}.bp-editor .form-error{z-index:100;color:var(--accent);box-shadow:var(--shadow);background:#fff;border:1px solid #e23d2a59;border-radius:10px;padding:10px 16px;font-size:13px;position:fixed;top:72px;left:50%;transform:translate(-50%)}.bp-edit-hint{color:var(--muted);margin:0;font-size:11px}.bp-recolor-check{cursor:pointer;align-items:center;gap:6px;font-size:12px;display:inline-flex}.bp-edit-screen{box-sizing:border-box;grid-template-columns:1fr;gap:16px;width:100%;max-width:1320px;min-height:calc(100vh - 100px);margin:0 auto;padding:16px 20px 24px;display:grid}@media (width>=900px){.bp-edit-screen{grid-template-columns:minmax(0,1fr) 280px}}.bp-edit-main{flex-direction:column;gap:10px;min-width:0;min-height:0;display:flex}.bp-canvas-panel--edit{flex:1;min-height:480px}.bp-edit-palette{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);flex-direction:column;gap:12px;min-height:0;max-height:calc(100vh - 120px);padding:14px;display:flex;overflow:auto}.bp-edit-palette__title{font-family:var(--font-display);color:var(--ink);margin:0;font-size:1.2rem;font-weight:400}.bp-edit-tools-head{justify-content:space-between;align-items:baseline;gap:8px;display:flex}.bp-edit-tools-label{color:var(--ink-soft);font-size:12px;font-weight:700}.bp-edit-current{color:var(--muted);font-size:12px;font-weight:600}.bp-edit-tools{grid-template-columns:1fr 1fr;gap:6px;display:grid}.bp-edit-tool{border:1px solid var(--line);color:var(--ink-soft);cursor:pointer;text-align:left;background:#fff;border-radius:8px;padding:9px 8px;font-family:inherit;font-size:12px;font-weight:600;transition:border-color .12s,background .12s,color .12s}.bp-edit-tool--wide{text-align:center;grid-column:1/-1}.bp-edit-tool:hover{border-color:var(--teal);color:var(--teal)}.bp-edit-tool.active{background:var(--teal);color:#fff;border-color:var(--teal)}.bp-edit-palette__head{color:var(--muted);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:6px;font-size:12px;font-weight:600;display:flex}.bp-edit-expand{color:var(--teal);font:inherit;cursor:pointer;text-underline-offset:2px;background:0 0;border:none;padding:0;font-size:11px;font-weight:700;text-decoration:underline}.bp-edit-swatches{grid-template-columns:repeat(8,1fr);gap:5px;display:grid}.bp-edit-swatch{aspect-ratio:1;cursor:pointer;border:1px solid #15202b1f;border-radius:6px;padding:0}.bp-edit-swatch:hover{transform:scale(1.06)}.bp-edit-swatch.active{outline:2px solid var(--accent);outline-offset:1px}.bp-edit-recolor{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.bp-edit-palette__toggles{flex-wrap:wrap;gap:6px;margin-top:auto;display:flex}.bp-edit-palette__toggles button{border:1px solid var(--line);color:var(--ink-soft);cursor:pointer;background:#fff;border-radius:999px;padding:6px 10px;font-family:inherit;font-size:11px;font-weight:600}.bp-edit-palette__toggles button.active{background:var(--ink);border-color:var(--ink);color:#fff}.canvas-stage--pan{cursor:grab}.canvas-stage--pan:active{cursor:grabbing}@media (width<=1023px){.bp-rail{max-height:none;overflow:visible}.bp-canvas-viewport{min-height:360px}}