:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#171625;background:#f6f6f9;font-synthesis:none;text-rendering:optimizeLegibility;--ink: #171625;--muted: #747287;--line: #e7e6ed;--surface: #ffffff;--violet: #6d5dfc;--violet-deep: #5544e7;--violet-soft: #efedff;--green: #37a879}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}body{min-width:320px}button,input,select,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{color:inherit}.icon{display:block;flex:0 0 auto}.gallery-app{min-height:100vh;background:#fafafd}.gallery-topbar,.editor-topbar{position:relative;z-index:20;display:flex;align-items:center;height:64px;padding:0 28px;border-bottom:1px solid var(--line);background:#fffffff0;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.wordmark{display:flex;align-items:center;gap:10px;color:var(--ink);font-size:15px;font-weight:700;line-height:1;text-decoration:none;letter-spacing:-.02em}.wordmark-mark{display:grid;width:30px;height:30px;place-items:center;border-radius:9px;background:linear-gradient(145deg,#7767ff,#5141df);color:#fff;box-shadow:0 5px 16px #5544e742}.topbar-divider{width:1px;height:20px;margin:0 18px;background:var(--line)}.topbar-project{color:var(--muted);font-size:13px;font-weight:500}.topbar-spacer{flex:1}.demo-pill{display:inline-flex;align-items:center;gap:7px;padding:7px 11px;border:1px solid #dedcea;border-radius:999px;background:#fff;color:#5f5c70;font-size:11px;font-weight:600;letter-spacing:.02em}.demo-pill>span{width:6px;height:6px;border-radius:50%;background:#33b87f;box-shadow:0 0 0 3px #dff6ec}.gallery-main{max-width:1500px;margin:0 auto;padding:64px clamp(24px,5vw,76px) 80px}.gallery-hero{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;padding-bottom:40px}.eyebrow{margin:0 0 7px;color:#8a8799;font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}.gallery-hero h1{max-width:900px;margin:0;font-size:clamp(30px,4vw,50px);font-weight:750;line-height:1.08;letter-spacing:-.045em}.hero-copy{max-width:620px;margin:13px 0 0;color:var(--muted);font-size:15px;line-height:1.6}.hero-stat{display:grid;min-width:118px;padding:18px 22px;border:1px solid var(--line);border-radius:18px;background:var(--surface);box-shadow:0 12px 34px #1f1b400f}.hero-stat strong{font-size:30px;font-weight:750;line-height:1;letter-spacing:-.04em}.hero-stat span{margin-top:5px;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.1em}.gallery-controls{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:28px;padding-top:22px;border-top:1px solid var(--line)}.filter-pills{display:flex;gap:7px;flex-wrap:wrap}.filter-pills button{padding:8px 13px;border:1px solid transparent;border-radius:999px;background:transparent;color:var(--muted);cursor:pointer;font-size:12px;font-weight:600}.filter-pills button:hover{background:#f0eff4;color:var(--ink)}.filter-pills button.active{border-color:#dedbea;background:#fff;color:var(--ink);box-shadow:0 3px 10px #1a16370d}.search-field,.layer-search{display:flex;align-items:center;gap:8px;border:1px solid var(--line);background:#fff;color:#aaa7b5}.search-field{width:min(260px,40vw);height:38px;padding:0 12px;border-radius:10px}.search-field:focus-within{border-color:#b9b3f9;box-shadow:0 0 0 3px #f0eeff}.search-field input,.layer-search input{min-width:0;width:100%;border:0;outline:0;background:transparent;color:var(--ink);font-size:12px}.search-field input::placeholder,.layer-search input::placeholder{color:#aaa7b5}.output-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:26px}.output-card{min-width:0;overflow:hidden;border:1px solid var(--line);border-radius:17px;background:#fff;box-shadow:0 8px 28px #1c183a0b;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}.output-card:hover{transform:translateY(-3px);border-color:#d9d6e5;box-shadow:0 18px 44px #1c183a1a}.output-preview{position:relative;display:grid;width:100%;height:340px;padding:22px;place-items:center;overflow:hidden;border:0;background-color:#efeff3;background-image:linear-gradient(45deg,#e8e8ed 25%,transparent 25%),linear-gradient(-45deg,#e8e8ed 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#e8e8ed 75%),linear-gradient(-45deg,transparent 75%,#e8e8ed 75%);background-position:0 0,0 7px,7px -7px,-7px 0;background-size:14px 14px;cursor:pointer}.output-preview img{position:absolute;inset:22px;display:block;width:calc(100% - 44px);height:calc(100% - 44px);object-fit:contain}.preview-shade{position:absolute;inset:0;background:linear-gradient(to top,rgba(18,15,43,.32),transparent 45%);opacity:0;transition:opacity .2s ease}.output-preview:hover .preview-shade,.output-preview:focus-visible .preview-shade{opacity:1}.edit-cta{position:absolute;bottom:18px;left:50%;display:inline-flex;align-items:center;gap:7px;padding:10px 14px;border-radius:10px;background:#fff;color:#302b50;box-shadow:0 10px 24px #100c2b38;font-size:12px;font-weight:700;opacity:0;transform:translate(-50%,7px);transition:opacity .2s ease,transform .2s ease}.output-preview:hover .edit-cta,.output-preview:focus-visible .edit-cta{opacity:1;transform:translate(-50%)}.edited-badge{position:absolute;top:13px;right:13px;display:inline-flex;align-items:center;gap:5px;padding:6px 9px;border-radius:999px;background:#151c1bd1;color:#fff;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);font-size:10px;font-weight:700}.output-card-body{padding:19px 20px 16px}.output-heading-row{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.output-kicker{margin:0 0 4px;color:var(--violet);font-size:9px;font-weight:700;letter-spacing:.11em;text-transform:uppercase}.output-card h2{margin:0;font-size:17px;font-weight:700;line-height:1.25;letter-spacing:-.025em}.icon-button{display:grid;width:32px;height:32px;padding:0;flex:0 0 auto;place-items:center;border:1px solid var(--line);border-radius:9px;background:#fff;color:#777387;cursor:pointer}.icon-button:hover{border-color:#c8c3ee;background:var(--violet-soft);color:var(--violet)}.output-theme{min-height:20px;margin:8px 0 0;color:var(--muted);font-size:12px}.output-copy{display:-webkit-box;min-height:39px;margin:13px 0 0;overflow:hidden;color:#4f4c5f;font-size:12px;line-height:1.55;-webkit-box-orient:vertical;-webkit-line-clamp:2}.output-card-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:17px;padding-top:13px;border-top:1px solid #efedf2;color:#9a97a7;font-size:9px}.output-card-footer>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.output-card-footer a{display:inline-flex;align-items:center;gap:4px;flex:0 0 auto;color:#6f6a7d;font-size:10px;font-weight:600;text-decoration:none}.output-card-footer a:hover{color:var(--violet)}.no-results,.fatal-error{display:grid;min-height:300px;place-items:center;align-content:center;color:var(--muted);text-align:center}.no-results h2,.fatal-error h1{margin:12px 0 4px;color:var(--ink);font-size:18px;font-weight:700;line-height:1.3}.no-results p,.fatal-error p{margin:0;font-size:13px}.editor-app{height:100vh;overflow:hidden;background:#eeedf2}.editor-topbar{display:grid;grid-template-columns:minmax(220px,1fr) auto minmax(285px,1fr);height:58px;padding:0 13px;background:#fff}.back-button{display:inline-flex;width:fit-content;height:36px;padding:0 11px;align-items:center;gap:7px;border:0;border-radius:9px;background:transparent;color:#615e6f;cursor:pointer;font-size:12px;font-weight:600}.back-button:hover{background:#f3f2f6;color:var(--ink)}.editor-title{display:grid;align-self:center;min-width:0;margin-left:5px;padding-left:13px;border-left:1px solid var(--line)}.editor-title strong,.editor-title span{max-width:210px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.editor-title strong{font-size:12px;font-weight:700;line-height:1.25}.editor-title span{color:#9693a2;font-size:9px}.editor-topbar>.back-button,.editor-topbar>.editor-title{grid-row:1}.editor-topbar>.back-button{grid-column:1}.editor-title{grid-column:1;margin-left:118px}.editor-topbar-center{grid-column:2;display:flex;align-items:center;gap:9px}.tool-group{display:flex;align-items:center;gap:2px;padding:3px;border:1px solid var(--line);border-radius:10px;background:#faf9fc}.tool-button{display:flex;height:29px;padding:0 8px;align-items:center;gap:5px;border:0;border-radius:7px;background:transparent;color:#676476;cursor:pointer;font-size:10px;font-weight:600}.tool-button:hover:not(:disabled),.tool-button.active{background:#fff;color:var(--violet);box-shadow:0 2px 7px #18153214}.tool-button:disabled{opacity:.33;cursor:default}.zoom-tools .tool-button{width:29px;padding:0;justify-content:center}.output-nav-tools .tool-button{padding-inline:7px}.output-position{min-width:38px;color:#777485;font-size:9px;font-variant-numeric:tabular-nums;text-align:center}.zoom-value{min-width:48px;height:29px;padding:0 5px;border:0;background:transparent;color:#5f5c6e;cursor:pointer;font-size:10px;font-variant-numeric:tabular-nums}.editor-actions{grid-column:3;display:flex;align-items:center;justify-content:flex-end;gap:7px}.secondary-button,.primary-button{display:inline-flex;height:34px;padding:0 12px;align-items:center;gap:6px;border-radius:9px;cursor:pointer;font-size:11px;font-weight:700}.secondary-button{border:1px solid var(--line);background:#fff;color:#686576}.secondary-button:hover{background:#f6f5f8}.secondary-button:disabled{opacity:.45;cursor:default}.primary-button{border:1px solid var(--violet);background:var(--violet);color:#fff;box-shadow:0 5px 14px #5d4dea38}.primary-button:hover{background:var(--violet-deep)}.editor-layout{display:grid;grid-template-columns:244px minmax(0,1fr) 278px;height:calc(100vh - 58px)}.editor-sidebar{position:relative;z-index:5;min-height:0;overflow:auto;background:#fff}.layers-sidebar{display:flex;flex-direction:column;border-right:1px solid var(--line)}.inspector-sidebar{border-left:1px solid var(--line)}.sidebar-heading{display:flex;min-height:70px;padding:17px 16px 12px;align-items:center;justify-content:space-between;gap:10px}.sidebar-heading .eyebrow{margin-bottom:3px;font-size:8px}.sidebar-heading h2{margin:0;font-size:15px;font-weight:700;line-height:1.2;letter-spacing:-.02em}.sidebar-heading>span{display:grid;min-width:25px;height:23px;padding:0 6px;place-items:center;border-radius:7px;background:#f1f0f5;color:#777485;font-size:9px;font-weight:700}.layer-search{height:34px;margin:0 12px 10px;padding:0 9px;border-radius:8px;background:#f9f8fb}.layer-list{flex:1;min-height:0;overflow-y:auto;padding:0 7px 12px}.layer-row{display:grid;grid-template-columns:27px minmax(0,1fr) 27px;width:100%;min-height:46px;padding:5px 4px 5px calc(5px + var(--layer-depth) * 8px);align-items:center;gap:5px;border:0;border-radius:8px;background:transparent;text-align:left;cursor:pointer}.layer-row:hover{background:#f7f6f9}.layer-row.active{background:var(--violet-soft)}.layer-kind-icon{display:grid;width:27px;height:27px;place-items:center;border:1px solid #e7e5ec;border-radius:7px;background:#fff;color:#8b8798}.layer-row.active .layer-kind-icon{border-color:#d8d3ff;color:var(--violet)}.layer-label{min-width:0}.layer-label strong,.layer-label small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.layer-label strong{font-size:10px;font-weight:600}.layer-label small{margin-top:1px;color:#a09daa;font-size:8px;text-transform:capitalize}.layer-visibility{display:grid;width:26px;height:26px;place-items:center;border-radius:7px;color:#aaa7b4}.layer-visibility:hover{background:#fff;color:var(--violet)}.layer-panel-controls{padding:11px 12px;border-top:1px solid var(--line);background:#fbfaff}.selected-layer-name{display:flex;margin-bottom:8px;align-items:center;justify-content:space-between;gap:8px}.selected-layer-name span{min-width:0;overflow:hidden;font-size:9px;font-weight:700;text-overflow:ellipsis;white-space:nowrap}.selected-layer-name small{color:#9a97a7;font-size:8px;text-transform:capitalize}.layer-help{display:flex;gap:9px;margin:10px;padding:11px;border:1px solid #e8e4ff;border-radius:10px;background:#f7f5ff;color:#6d6781;font-size:9px;line-height:1.45}.layer-help .icon{color:var(--violet)}.editor-stage{position:relative;min-width:0;min-height:0;overflow:auto;padding:36px;background-color:#dedde3;background-image:linear-gradient(45deg,#d8d7de 25%,transparent 25%),linear-gradient(-45deg,#d8d7de 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#d8d7de 75%),linear-gradient(-45deg,transparent 75%,#d8d7de 75%);background-position:0 0,0 8px,8px -8px,-8px 0;background-size:16px 16px}.page-space{position:relative;margin:auto}.page-shell{position:absolute;inset:0 auto auto 0;transform-origin:top left;background:#fff;box-shadow:0 22px 65px #1d1a2d3d,0 0 0 1px #28253914}.page-shell iframe{display:block;border:0;background:#fff}.editor-loading{position:absolute;z-index:4;inset:0;display:grid;place-items:center;align-content:center;gap:10px;background:#dedde3f0;color:#6f6b79;font-size:11px}.editor-loading p{margin:0}.spinner{width:22px;height:22px;border:2px solid #c5c2cf;border-top-color:var(--violet);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.stage-footer{position:fixed;z-index:8;bottom:16px;left:calc(50% - 17px);display:flex;height:34px;padding:3px;align-items:center;gap:3px;border:1px solid rgba(214,212,222,.9);border-radius:11px;background:#ffffffeb;box-shadow:0 7px 20px #1d19351f;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transform:translate(-50%)}.stage-footer button{display:grid;width:27px;height:27px;padding:0;place-items:center;border:0;border-radius:7px;background:transparent;color:#706d7b;cursor:pointer}.stage-footer button:hover:not(:disabled){background:#f0eff4;color:var(--violet)}.stage-footer button:disabled{opacity:.28}.stage-footer span{min-width:52px;color:#6f6c7b;font-size:9px;text-align:center}.inspector-heading{position:sticky;z-index:3;top:0;border-bottom:1px solid #f0eef3;background:#fff}.inspector-heading .icon-button{width:28px;height:28px}.empty-inspector{display:grid;padding:60px 28px;place-items:center;text-align:center}.empty-inspector>span{display:grid;width:48px;height:48px;place-items:center;border-radius:14px;background:var(--violet-soft);color:var(--violet)}.empty-inspector h3{margin:16px 0 5px;font-size:13px;font-weight:700;line-height:1.3}.empty-inspector p{max-width:190px;margin:0;color:#9693a2;font-size:10px;line-height:1.5}.inspector-content{padding-bottom:42px}.selection-summary{display:flex;padding:13px 15px;align-items:center;gap:9px;border-bottom:1px solid var(--line);background:#fbfaff}.selection-icon{display:grid;width:33px;height:33px;flex:0 0 auto;place-items:center;border:1px solid #dedaff;border-radius:9px;background:#fff;color:var(--violet)}.selection-summary>div{min-width:0}.selection-summary strong,.selection-summary small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.selection-summary strong{font-size:11px}.selection-summary small{margin-top:2px;color:#9895a4;font-size:8px;text-transform:capitalize}.inspector-section{padding:15px;border-bottom:1px solid var(--line)}.inspector-section h3{margin:0 0 10px;color:#625f70;font-size:9px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.geometry-grid,.two-fields{display:grid;grid-template-columns:1fr 1fr;gap:8px}.geometry-grid label,.two-fields label{display:grid;grid-template-columns:31px minmax(0,1fr);height:34px;align-items:center;overflow:hidden;border:1px solid var(--line);border-radius:8px;background:#faf9fb}.geometry-grid label.disabled{opacity:.45}.geometry-grid label>span,.two-fields label>span{padding-left:9px;color:#9d9aa8;font-size:8px;font-weight:700;text-transform:uppercase}.geometry-grid input,.two-fields input,.two-fields select{min-width:0;width:100%;height:100%;padding:0 7px;border:0;outline:0;background:transparent;color:#3e3b4b;font-size:10px}.text-format-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:10px}.text-format-grid label{display:grid;gap:4px;min-width:0;color:#9d9aa8;font-size:8px;font-weight:700;text-transform:uppercase}.text-format-grid label.font-family-field{grid-column:1 / -1}.text-format-grid input:not([type=color]),.text-format-grid select{min-width:0;width:100%;height:34px;padding:0 8px;border:1px solid var(--line);border-radius:8px;outline:0;background:#faf9fb;color:#3e3b4b;font-size:10px;text-transform:none}.text-format-grid input[type=color]{width:100%;height:34px;padding:4px;border:1px solid var(--line);border-radius:8px;background:#faf9fb;cursor:pointer}.inspector-section textarea{width:100%;padding:9px;resize:vertical;border:1px solid var(--line);border-radius:8px;outline:0;background:#faf9fb;color:#3d3a49;font-size:10px;line-height:1.5}.inspector-section textarea:focus,.geometry-grid label:focus-within,.two-fields label:focus-within,.text-format-grid label:focus-within input,.text-format-grid label:focus-within select{border-color:#bbb4fa;box-shadow:0 0 0 2px #f0eeff}.field-hint{margin:6px 0 0;color:#aaa7b2;font-size:8px}.upload-button{display:flex;height:34px;align-items:center;justify-content:center;gap:7px;border:1px dashed #c9c5d4;border-radius:8px;background:#faf9fc;color:#716d80;cursor:pointer;font-size:9px;font-weight:700}.upload-button:hover{border-color:#aaa1f8;background:var(--violet-soft);color:var(--violet)}.upload-button input{display:none}.two-fields{margin-top:8px}.two-fields label{grid-template-columns:42px minmax(0,1fr)}.layer-action-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}.layer-action-grid button{min-height:33px;padding:6px 7px;border:1px solid var(--line);border-radius:8px;background:#fff;color:#686575;cursor:pointer;font-size:9px;font-weight:600}.layer-action-grid button:hover{border-color:#c9c3f6;background:var(--violet-soft);color:var(--violet)}.layer-action-grid button.wide{display:flex;grid-column:1/-1;align-items:center;justify-content:center;gap:6px}.editor-status{position:sticky;bottom:0;display:flex;min-height:34px;padding:8px 13px;align-items:center;gap:7px;border-top:1px solid var(--line);background:#fffffff0;color:#9693a1;font-size:8px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.editor-status>span{width:6px;height:6px;flex:0 0 auto;border-radius:50%;background:#d8a448}.editor-status>span.ready{background:var(--green)}@media(max-width:1050px){.editor-layout{grid-template-columns:210px minmax(0,1fr) 250px}.editor-topbar{grid-template-columns:minmax(175px,1fr) auto minmax(225px,1fr)}.editor-title,.tool-button span{display:none}.tool-button{width:29px;padding:0;justify-content:center}}@media(max-width:760px){.gallery-topbar{padding:0 18px}.topbar-divider,.topbar-project{display:none}.gallery-main{padding-top:38px}.gallery-hero{align-items:flex-start}.hero-stat{display:none}.gallery-controls{align-items:stretch;flex-direction:column}.search-field{width:100%}.output-grid{grid-template-columns:1fr}.output-preview{height:400px}.editor-topbar{grid-template-columns:1fr auto}.editor-topbar-center{display:none}.editor-actions{grid-column:2}.reset-button{display:none}.editor-layout{grid-template-columns:minmax(0,1fr)}.layers-sidebar{display:none}.inspector-sidebar{position:fixed;z-index:15;right:0;bottom:0;width:260px;height:calc(100vh - 58px);box-shadow:-10px 0 30px #19153226}}