:root{--bg: #0b0d10;--bg-deep: #07080a;--panel: #121419;--panel-2: #181b21;--line: #23272f;--line-bright: #2f3540;--ink: #edf0e8;--ink-dim: #9aa194;--ink-faint: #7e8676;--acid: #d6f64b;--acid-soft: rgba(214, 246, 75, .14);--acid-glow: rgba(214, 246, 75, .35);--coral: #ff5e63;--coral-soft: rgba(255, 94, 99, .14);--danger: #ff5e63;--coffee: #e3a857;--coffee-bright: #f0bd78;--coffee-ink: #1f1305;--coffee-soft: rgba(227, 168, 87, .14);--radius: 10px;--mono: "Spline Sans Mono", ui-monospace, "SF Mono", Menlo, monospace;--display: "Bricolage Grotesque", "Avenir Next", system-ui, sans-serif}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:radial-gradient(1200px 700px at 75% -10%,rgba(214,246,75,.05),transparent 60%),radial-gradient(900px 600px at -10% 110%,rgba(214,246,75,.03),transparent 55%),var(--bg);color:var(--ink);font-family:var(--display);font-weight:400;-webkit-font-smoothing:antialiased;overflow:hidden}body:after{content:"";position:fixed;inset:0;pointer-events:none;z-index:999;opacity:.05;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E")}.app{display:flex;flex-direction:column;height:100vh}.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 20px;height:60px;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--panel) 80%,transparent);backdrop-filter:blur(10px)}.brand{display:flex;align-items:baseline;gap:8px}.brand-mark{color:var(--acid);font-size:22px;line-height:1;align-self:center;filter:drop-shadow(0 0 8px var(--acid-glow));animation:mark-spin 14s linear infinite}@keyframes mark-spin{to{transform:rotate(360deg)}}.brand-name{font-weight:750;font-size:19px;letter-spacing:-.4px}.brand-sub{font-weight:300;font-size:19px;letter-spacing:-.4px;color:var(--ink-dim)}.brand-env{font-family:var(--mono);font-size:10px;color:var(--acid);border:1px solid color-mix(in srgb,var(--acid) 40%,transparent);border-radius:99px;padding:2px 8px;text-transform:uppercase;letter-spacing:1px;align-self:center}.tabs{display:flex;gap:4px;background:var(--bg-deep);border:1px solid var(--line);border-radius:99px;padding:4px}.tab{font-family:var(--display);font-weight:550;font-size:13.5px;color:var(--ink-dim);background:transparent;border:0;border-radius:99px;padding:7px 18px;cursor:pointer;transition:color .15s,background .15s}.tab:hover{color:var(--ink)}.tab-active{color:#10130a;background:var(--acid);box-shadow:0 0 16px var(--acid-glow)}.body{flex:1;display:flex;min-height:0}.rail{width:264px;flex-shrink:0;background:var(--panel);border-right:1px solid var(--line);padding:20px 16px;display:flex;flex-direction:column;gap:24px;overflow-y:auto}.rail-title{font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:var(--ink-faint);margin:0 0 10px}.rail-group{display:flex;flex-direction:column;gap:8px}.rail-help{font-size:12.5px;line-height:1.55;color:var(--ink-dim);border-top:1px solid var(--line);padding-top:14px}.rail-help p{margin:0}.rail-help code{font-family:var(--mono);font-size:11px;color:var(--acid)}kbd{font-family:var(--mono);font-size:10px;color:var(--ink-dim);border:1px solid var(--line-bright);border-bottom-width:2px;border-radius:4px;padding:1px 4px;margin-left:2px}.tool{display:flex;align-items:center;gap:10px;width:100%;text-align:left;background:var(--panel-2);color:var(--ink);border:1px solid var(--line);border-radius:var(--radius);padding:10px 12px;font-family:var(--display);font-weight:500;font-size:14px;cursor:pointer;transition:border-color .12s,background .12s,transform .08s}.tool:hover:not(:disabled){border-color:var(--line-bright);transform:translate(2px)}.tool:active:not(:disabled){transform:translate(2px) scale(.985)}.tool-active{border-color:var(--acid);background:var(--acid-soft);box-shadow:inset 0 0 18px #d6f64b0f,0 0 12px #d6f64b1a}.tool:disabled{opacity:.35;cursor:not-allowed}.tool-key{font-family:var(--mono);font-size:10.5px;font-weight:600;color:var(--acid);border:1px solid color-mix(in srgb,var(--acid) 45%,transparent);border-radius:5px;width:19px;height:19px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.slider{margin-top:4px;font-size:12.5px;color:var(--ink-dim);display:flex;flex-direction:column;gap:6px;transition:opacity .2s}.slider label{display:flex;align-items:center;gap:4px}.slider input[type=range]{width:100%;accent-color:var(--acid)}.slider-off{opacity:.35;pointer-events:none}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;background:var(--panel-2);color:var(--ink);border:1px solid var(--line);border-radius:var(--radius);padding:9px 12px;font-size:13.5px;font-family:var(--display);font-weight:500;cursor:pointer;transition:border-color .12s,background .12s,transform .08s,box-shadow .15s}.btn:hover:not(:disabled):not(.btn-disabled){border-color:var(--line-bright)}.btn:active:not(:disabled):not(.btn-disabled){transform:scale(.98)}.btn-primary{background:var(--acid);color:#10130a;border-color:var(--acid);font-weight:650;box-shadow:0 0 #d6f64b00}.btn-primary:hover:not(:disabled){background:color-mix(in srgb,var(--acid) 85%,white);box-shadow:0 0 20px var(--acid-glow)}.btn-ai,.btn-auto{justify-content:flex-start;text-align:left;gap:10px;white-space:nowrap}.btn-ai{border-color:var(--acid);background:linear-gradient(135deg,#d6f64b38,#d6f64b0d 70%);font-weight:650}.btn-ai:hover:not(:disabled){box-shadow:0 0 22px var(--acid-glow)}.btn-auto{border-color:color-mix(in srgb,var(--acid) 50%,var(--line));background:linear-gradient(135deg,var(--acid-soft),transparent 70%);font-weight:600}.btn-auto:hover:not(:disabled){box-shadow:0 0 16px #d6f64b26;border-color:var(--acid)}.btn-small{padding:7px 10px;font-size:12.5px}.btn:disabled,.btn-disabled{opacity:.35;cursor:not-allowed}.row-2{display:flex;gap:8px}.row-2 .btn{flex:1}.topbar-actions{display:flex;align-items:center;gap:12px}.topbar-icons{display:flex;align-items:center;gap:4px;padding-left:12px;border-left:1px solid var(--line)}.lang-select{font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:1px;color:var(--ink-dim);background:var(--bg-deep);border:1px solid var(--line);border-radius:99px;padding:6px 10px;cursor:pointer;appearance:none;-webkit-appearance:none;transition:color .12s,border-color .12s}.lang-select:hover{color:var(--acid);border-color:var(--acid)}.lang-select option{background:var(--panel);color:var(--ink)}.btn-icon{width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;background:transparent;border:1px solid var(--line);border-radius:50%;color:var(--ink-dim);font-size:15px;cursor:pointer;transition:color .12s,border-color .12s}.btn-icon:hover{color:var(--acid);border-color:var(--acid)}.format-row{display:flex;gap:6px}.chip{flex:1;font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.5px;color:var(--ink-dim);background:var(--bg-deep);border:1px solid var(--line);border-radius:99px;padding:5px 10px;cursor:pointer;transition:all .12s}.chip:hover{color:var(--ink)}.chip-on{color:#10130a;background:var(--acid);border-color:var(--acid)}.color-export{display:flex;align-items:center;gap:8px}.color-export input[type=color],.row input[type=color]{width:36px;height:36px;padding:2px;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel-2);cursor:pointer}.color-export .btn{flex:1}.export-panel .field{margin:4px 0}.export-panel .export-download{margin-top:4px}.workspace{flex:1;min-width:0;position:relative;display:flex;flex-direction:column;overflow:auto}.canvas-wrap{flex:1;display:flex;align-items:center;justify-content:center;padding:24px;position:relative;overflow:hidden}.canvas-empty{max-width:420px;text-align:center;color:var(--ink-dim);font-size:14.5px;line-height:1.65;border:1.5px dashed var(--line-bright);border-radius:18px;padding:48px 36px;animation:empty-in .5s cubic-bezier(.2,.9,.3,1) both}.canvas-empty h2{font-family:var(--display);font-weight:750;font-size:26px;letter-spacing:-.6px;color:var(--ink);margin:14px 0 8px}.canvas-empty p{margin:0}.empty-glyph{font-size:44px;color:var(--acid);filter:drop-shadow(0 0 14px var(--acid-glow));animation:glyph-pulse 3s ease-in-out infinite}@keyframes glyph-pulse{50%{filter:drop-shadow(0 0 26px var(--acid-glow));transform:scale(1.06)}}@keyframes empty-in{0%{opacity:0;transform:translateY(10px) scale(.98)}}.canvas-stage{position:relative;box-shadow:0 24px 80px #0009,0 0 0 1px var(--line);border-radius:6px;overflow:hidden;animation:stage-in .45s cubic-bezier(.2,.9,.3,1) both}@keyframes stage-in{0%{opacity:0;transform:scale(.97)}}.checker{position:absolute;inset:0;background-image:linear-gradient(45deg,#1d2127 25%,transparent 25%),linear-gradient(-45deg,#1d2127 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#1d2127 75%),linear-gradient(-45deg,transparent 75%,#1d2127 75%);background-size:18px 18px;background-position:0 0,0 9px,9px -9px,-9px 0;background-color:#15181d}.layer{position:absolute;top:0;left:0;width:100%;height:100%;display:block}.canvas-stage .base{transition:opacity .35s ease}.canvas-stage.has-result .base{opacity:.13}.canvas-stage .result{filter:drop-shadow(0 0 0 transparent)}.canvas-hud{position:absolute;top:14px;right:14px;display:flex;gap:8px;z-index:30}.hud-btn{font-family:var(--mono);font-size:11.5px;font-weight:600;color:var(--ink-dim);background:#07080abf;backdrop-filter:blur(6px);border:1px solid var(--line-bright);border-radius:99px;padding:7px 12px;cursor:pointer;transition:color .12s,border-color .12s}.hud-btn:hover:not(:disabled){color:var(--acid);border-color:var(--acid)}.hud-btn:disabled{opacity:.5;cursor:default}.hud-btn-on{color:#10130a;background:var(--acid);border-color:var(--acid)}.canvas-stage.comparing .base{opacity:1}.compare-divider{position:absolute;top:0;bottom:0;width:0;border-left:2px solid var(--acid);box-shadow:0 0 12px var(--acid-glow);cursor:ew-resize;z-index:20;touch-action:none}.compare-divider:before{content:"";position:absolute;top:0;bottom:0;left:-14px;width:28px}.compare-handle{position:absolute;top:50%;left:0;transform:translate(-50%,-50%);background:var(--acid);color:#10130a;font-size:12px;font-weight:700;border-radius:99px;padding:6px 8px;letter-spacing:-1px;box-shadow:0 4px 16px #00000080;pointer-events:none;white-space:nowrap}.compare-tag{position:absolute;top:10px;font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:1px;text-transform:uppercase;color:var(--ink);background:#07080ab3;border-radius:99px;padding:4px 10px;z-index:15;pointer-events:none}.compare-tag-left{left:10px}.compare-tag-right{right:10px}.canvas-busy{position:absolute;bottom:14px;left:14px;display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:11.5px;color:var(--acid);background:#07080abf;backdrop-filter:blur(6px);padding:7px 12px;border-radius:99px;border:1px solid color-mix(in srgb,var(--acid) 30%,transparent)}.busy-dot{width:7px;height:7px;border-radius:50%;background:var(--acid);animation:busy-blink .9s ease-in-out infinite;box-shadow:0 0 8px var(--acid-glow)}@keyframes busy-blink{50%{opacity:.25}}.brush-ghost{position:fixed;top:0;left:0;pointer-events:none;z-index:50;border:1.5px solid var(--acid);border-radius:50%;box-shadow:0 0 12px var(--acid-glow),inset 0 0 8px #d6f64b26}.brush-ghost-bg{border-color:var(--coral);box-shadow:0 0 12px #ff5e6366,inset 0 0 8px var(--coral-soft)}.drop-veil{position:fixed;inset:0;z-index:200;background:#07080acc;backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;animation:veil-in .15s ease both}.drop-veil-inner{font-family:var(--display);font-weight:800;font-size:clamp(36px,7vw,72px);letter-spacing:-2px;color:var(--acid);text-shadow:0 0 40px var(--acid-glow);border:2px dashed var(--acid);border-radius:24px;padding:40px 80px;animation:veil-pulse 1.2s ease-in-out infinite}@keyframes veil-in{0%{opacity:0}}@keyframes veil-pulse{50%{transform:scale(1.02);box-shadow:0 0 60px #d6f64b1f}}.onboarding-card{width:min(480px,calc(100vw - 32px));background:var(--panel);border:1px solid var(--line-bright);border-radius:18px;padding:32px;box-shadow:0 24px 80px #000000a6,0 0 60px #d6f64b0f;animation:panel-in .35s cubic-bezier(.2,.9,.3,1) both}.onboarding-card .brand{margin-bottom:16px}.onboarding-card h2{font-family:var(--display);font-weight:800;font-size:27px;letter-spacing:-.7px;margin:0 0 6px}.onboarding-privacy{font-size:13.5px;color:var(--acid);margin:0 0 22px}.onboarding-steps{list-style:none;margin:0 0 24px;padding:0;display:flex;flex-direction:column;gap:14px}.onboarding-steps li{display:flex;gap:14px;align-items:flex-start}.step-n{font-family:var(--mono);font-weight:600;font-size:13px;color:var(--acid);border:1px solid color-mix(in srgb,var(--acid) 45%,transparent);border-radius:8px;width:28px;height:28px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.onboarding-steps strong{display:block;font-size:15px;margin-bottom:2px}.onboarding-steps p{font-size:13px;line-height:1.5;color:var(--ink-dim);margin:0}.onboarding-go{width:100%;padding:12px;font-size:15px}.modal-help{text-align:left}.shortcut-list{list-style:none;margin:0 0 18px;padding:0;display:flex;flex-direction:column;gap:6px}.shortcut-list li{display:flex;align-items:center;gap:14px;font-size:13.5px;padding:6px 0;border-bottom:1px solid var(--line)}.shortcut-keys{min-width:110px;flex-shrink:0}.shortcut-keys kbd{display:inline-block;font-size:11px;padding:2px 6px}.shortcut-label{color:var(--ink-dim)}.modal-download{text-align:left}.dl-list{display:flex;flex-direction:column;gap:8px;margin-bottom:14px}.dl-item{display:flex;justify-content:space-between;align-items:center;gap:12px;text-decoration:none}.dl-mine{font-style:normal;font-size:11.5px;opacity:.85}.dl-size{font-family:var(--mono);font-size:10.5px;opacity:.7;flex-shrink:0}.dl-status{font-family:var(--mono);font-size:12px;color:var(--ink-dim)}.dl-all{display:inline-block;font-size:12.5px;color:var(--acid);text-decoration:none;margin-bottom:16px}.dl-all:hover{text-decoration:underline}.crash-screen{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:var(--bg);z-index:400;padding:24px}.crash-card{max-width:440px;text-align:center;background:var(--panel);border:1px solid var(--line-bright);border-radius:16px;padding:36px 32px 28px;box-shadow:0 24px 80px #0009;animation:panel-in .3s cubic-bezier(.2,.9,.3,1) both}.crash-card .brand-mark{font-size:36px;animation:none}.crash-card h2{font-family:var(--display);font-weight:750;font-size:24px;letter-spacing:-.5px;margin:12px 0 8px}.crash-card p{font-size:14px;line-height:1.6;color:var(--ink-dim);margin:0 0 20px}.crash-detail{margin-top:18px;text-align:left}.crash-detail summary{font-family:var(--mono);font-size:11px;color:var(--ink-faint);cursor:pointer}.crash-detail pre{font-family:var(--mono);font-size:10.5px;line-height:1.5;color:var(--ink-dim);background:var(--bg-deep);border:1px solid var(--line);border-radius:8px;padding:10px;max-height:160px;overflow:auto;white-space:pre-wrap;word-break:break-word}.modal-veil{position:fixed;inset:0;z-index:250;background:#07080ab3;backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;animation:veil-in .15s ease both}.modal{width:min(420px,calc(100vw - 40px));background:var(--panel);border:1px solid var(--line-bright);border-radius:14px;padding:24px;box-shadow:0 24px 80px #0009,0 0 50px #d6f64b0d;animation:panel-in .25s cubic-bezier(.2,.9,.3,1) both}.modal h3{font-family:var(--display);font-weight:750;font-size:20px;letter-spacing:-.4px;margin:0 0 10px}.modal p{font-size:14px;line-height:1.55;color:var(--ink-dim);margin:0 0 18px}.modal-actions{display:flex;gap:10px}.modal-actions .btn{flex:1}.modal-about{max-height:min(80vh,640px);overflow-y:auto;text-align:left}.about-light{font-weight:300;color:var(--ink-dim)}.about-version{font-family:var(--mono);font-size:11px;color:var(--acid);margin-left:6px}.about-subtitle{font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:var(--ink-faint);margin:0 0 8px}.license-list{list-style:none;margin:0 0 18px;padding:0;display:flex;flex-direction:column;gap:4px}.license-list li{display:flex;justify-content:space-between;gap:12px;font-size:12.5px;padding:6px 9px;background:var(--bg-deep);border:1px solid var(--line);border-radius:7px}.license-name{font-weight:600}.license-meta{font-family:var(--mono);font-size:10.5px;color:var(--ink-faint);white-space:nowrap}.preview-panel{position:fixed;top:76px;right:20px;z-index:60;width:220px;height:240px;display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:0 18px 60px #0000008c,0 0 0 1px var(--line);animation:panel-in .3s cubic-bezier(.2,.9,.3,1) both}.preview-resize{position:absolute;left:0;bottom:0;width:22px;height:22px;cursor:nesw-resize;touch-action:none;z-index:5;background:linear-gradient(45deg,transparent 50%,var(--ink-faint) 50%,var(--ink-faint) 58%,transparent 58%),linear-gradient(45deg,transparent 66%,var(--ink-faint) 66%,var(--ink-faint) 74%,transparent 74%);background-size:12px 12px;background-position:4px calc(100% - 4px);background-repeat:no-repeat;opacity:.7;transition:opacity .12s}.preview-resize:hover{opacity:1}@keyframes panel-in{0%{opacity:0;transform:translateY(-8px) scale(.97)}}.preview-panel-head{display:flex;align-items:center;gap:8px;padding:8px 8px 8px 11px;border-bottom:1px solid var(--line)}.preview-panel-title{font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;color:var(--ink-faint);flex:1}.preview-bg-switch{display:flex;gap:5px}.bg-chip{width:18px;height:18px;padding:0;border:1px solid var(--line-bright);border-radius:5px;cursor:pointer;transition:box-shadow .12s,transform .08s}.bg-chip:hover{transform:scale(1.08)}.bg-chip-on{box-shadow:0 0 0 2px var(--panel),0 0 0 3px var(--acid)}.bg-chip-checker{background-image:linear-gradient(45deg,#1d2127 25%,transparent 25%),linear-gradient(-45deg,#1d2127 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#1d2127 75%),linear-gradient(-45deg,transparent 75%,#1d2127 75%);background-size:8px 8px;background-position:0 0,0 4px,4px -4px,-4px 0;background-color:#15181d}.bg-chip-white{background:#fff}.bg-chip-black{background:#07080a}.bg-chip-color{background:none}.preview-close{width:20px;height:20px;flex-shrink:0;display:flex;align-items:center;justify-content:center;background:var(--panel-2);border:1px solid var(--line);border-radius:50%;color:var(--ink-dim);font-size:14px;line-height:1;cursor:pointer;transition:color .12s,border-color .12s}.preview-close:hover{color:var(--ink);border-color:var(--line-bright)}.preview-body{position:relative;flex:1;min-height:0;display:flex;align-items:center;justify-content:center;overflow:hidden}.preview-body .checker{background-size:14px 14px;background-position:0 0,0 7px,7px -7px,-7px 0}.preview-bg-white{background:#fff}.preview-bg-black{background:#07080a}.preview-body img{position:relative;z-index:1;max-width:100%;max-height:100%;object-fit:contain}.toasts{position:fixed;bottom:20px;right:20px;z-index:300;display:flex;flex-direction:column;gap:8px}.toast{font-family:var(--mono);font-size:12px;padding:10px 16px;border-radius:99px;background:#07080ae6;backdrop-filter:blur(8px);border:1px solid var(--line-bright);color:var(--ink);animation:toast-in .3s cubic-bezier(.2,.9,.3,1.4) both;box-shadow:0 8px 30px #00000080}.toast-ok{border-color:color-mix(in srgb,var(--acid) 45%,transparent);color:var(--acid)}.toast-error{border-color:color-mix(in srgb,var(--coral) 55%,transparent);color:var(--coral)}@keyframes toast-in{0%{opacity:0;transform:translateY(14px) scale(.95)}}.icon-studio{flex:1;display:flex;min-height:0;min-width:0}.icon-preview{flex:1;min-width:0;display:flex;align-items:center;justify-content:center;padding:24px;overflow:auto}.icon-grid{display:flex;flex-direction:column;align-items:center;gap:28px;animation:stage-in .45s cubic-bezier(.2,.9,.3,1) both}.icon-hero{position:relative;width:256px;height:256px;border-radius:56px;overflow:hidden;box-shadow:0 24px 80px #0009,0 0 0 1px var(--line),0 0 50px #d6f64b0f}.icon-hero canvas{position:relative;display:block}.icon-row{display:flex;align-items:flex-end;gap:22px}.size-preview{margin:0;display:flex;flex-direction:column;align-items:center;gap:8px}.size-box{position:relative;border-radius:6px;overflow:hidden;box-shadow:0 0 0 1px var(--line)}.size-box .checker{background-size:10px 10px;background-position:0 0,0 5px,5px -5px,-5px 0}.size-box canvas{position:relative;display:block;image-rendering:auto}.size-preview figcaption{font-family:var(--mono);font-size:10.5px;color:var(--ink-faint)}.icon-note{font-size:13px;color:var(--ink-dim);margin:0;text-align:center}.source-tag{font-family:var(--mono);font-size:11px;color:var(--acid);background:var(--acid-soft);border-radius:6px;padding:5px 9px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.platform{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:9px;align-items:center;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--radius);padding:9px 11px;cursor:pointer;transition:border-color .12s,background .12s}.platform:hover{border-color:var(--line-bright)}.platform-on{border-color:color-mix(in srgb,var(--acid) 55%,var(--line));background:linear-gradient(135deg,var(--acid-soft),transparent 60%)}.platform input{accent-color:var(--acid);grid-row:span 2}.platform-name{font-size:13.5px;font-weight:600}.platform-detail{grid-column:2;font-family:var(--mono);font-size:10px;color:var(--ink-faint)}.row{display:flex;align-items:center;gap:10px}.check{display:flex;align-items:center;gap:7px;font-size:13.5px;cursor:pointer}.check input{accent-color:var(--acid)}.field{display:flex;flex-direction:column;gap:5px;font-size:12.5px;color:var(--ink-dim)}.field input[type=text]{background:var(--bg-deep);border:1px solid var(--line);border-radius:var(--radius);color:var(--ink);font-family:var(--display);font-size:13.5px;padding:8px 10px;transition:border-color .12s}.field input[type=text]:focus{outline:none;border-color:var(--acid)}.dd{position:relative;width:100%}.dd-trigger{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;background:var(--panel-2);color:var(--ink);border:1px solid var(--line);border-radius:var(--radius);padding:9px 12px;font-family:var(--display);font-weight:500;font-size:13.5px;text-align:left;cursor:pointer;transition:border-color .12s,background .12s}.dd-trigger:hover{border-color:var(--line-bright)}.dd-trigger.dd-open{border-color:var(--acid);background:var(--acid-soft)}.dd-value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dd-caret{flex-shrink:0;font-size:10px;color:var(--ink-dim);transition:transform .15s,color .12s}.dd-trigger.dd-open .dd-caret{transform:rotate(180deg);color:var(--acid)}.dd-menu{position:absolute;top:calc(100% + 4px);left:0;right:0;z-index:70;margin:0;padding:4px;list-style:none;max-height:264px;overflow-y:auto;background:var(--panel);border:1px solid var(--line-bright);border-radius:var(--radius);box-shadow:0 12px 32px #00000080,0 0 0 1px #0003;animation:dd-in .12s ease}@keyframes dd-in{0%{opacity:0;transform:translateY(-4px)}}.dd-option{padding:8px 10px;border-radius:7px;font-size:13px;color:var(--ink-dim);cursor:pointer;display:flex;align-items:center;gap:8px}.dd-option.dd-active{background:var(--panel-2);color:var(--ink)}.dd-option.dd-selected{color:var(--acid)}.dd-option.dd-selected:before{content:"▸";font-size:9px}.dd-option:not(.dd-selected):before{content:"";width:0}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:var(--line-bright);border-radius:99px;border:2px solid var(--bg)}::-webkit-scrollbar-track{background:transparent}:focus-visible{outline:2px solid var(--acid);outline-offset:2px}::selection{background:var(--acid);color:#10130a}@media (max-width: 760px){.topbar{padding:0 12px;gap:8px;height:54px}.brand-sub,.brand-env,.brand-name{display:none}.tabs{padding:3px}.tab{padding:6px 10px;font-size:12px}.topbar-actions{gap:8px}.topbar-actions .btn{padding:8px 10px;font-size:12.5px;white-space:nowrap}.topbar-icons{padding-left:8px;gap:2px}.lang-select{padding:5px 8px}.btn-icon{width:28px;height:28px;font-size:13px;flex-shrink:0}.btn-icon-guides{width:auto;padding:0 8px;font-size:11.5px}.body{flex-direction:column-reverse}.rail{width:100%;max-height:46vh;flex-direction:column;align-items:stretch;gap:22px;overflow-y:auto;overflow-x:hidden;border-right:0;border-top:1px solid var(--line);padding:14px 16px calc(14px + env(safe-area-inset-bottom))}.rail-group{width:100%;max-width:430px;margin:0 auto;flex-shrink:0}.rail-title{text-align:center}.tool,.rail .btn{justify-content:flex-start}.rail .btn:not(.btn-ai):not(.btn-auto){justify-content:center}.tool:hover:not(:disabled){transform:none}.slider,.color-export,.row,.field{width:100%}.rail-help,.rail kbd{display:none}.canvas-wrap{padding:12px}.canvas-empty{padding:32px 20px}.canvas-empty h2{font-size:21px}.preview-panel{top:64px;right:10px;width:168px}.preview-body{height:148px}.icon-studio{flex-direction:column-reverse}.icon-preview{padding:14px}.icon-hero{width:180px;height:180px;border-radius:40px}.icon-hero canvas{width:180px;height:180px}.icon-row{flex-wrap:wrap;justify-content:center;gap:14px}.toasts{bottom:calc(12px + env(safe-area-inset-bottom));right:12px;left:12px}.toast{text-align:center}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation:none!important;transition:none!important}}.ad-slot{margin-top:auto;flex-shrink:0;display:flex;flex-direction:column;gap:8px;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel-2);padding:10px 12px 12px;min-height:96px}.ad-label{font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint)}.house-body{margin:0;font-size:12.5px;line-height:1.5;color:var(--ink-dim)}.btn-donate{background:var(--coffee);border-color:var(--coffee);color:var(--coffee-ink);font-weight:650;text-align:center;text-decoration:none;box-shadow:0 1px 3px #00000040;transition:background .12s,transform .08s}.btn-donate:hover:not(:disabled){background:var(--coffee-bright);border-color:var(--coffee-bright)}.btn-donate:active:not(:disabled){transform:translateY(1px)}.btn-icon-donate{color:var(--coffee);text-decoration:none;display:inline-flex;align-items:center;justify-content:center}.btn-icon-donate:hover{color:var(--coffee-bright);border-color:color-mix(in srgb,var(--coffee) 45%,transparent)}.btn-icon-guides{width:auto;padding:0 12px;color:var(--ink-dim);font-family:var(--display);font-size:12.5px;font-weight:600;text-decoration:none;white-space:nowrap}.btn-icon-guides:hover{color:var(--acid);border-color:var(--acid)}.about-donate{align-self:flex-start;margin:4px 0 2px}.about-links{display:flex;flex-wrap:wrap;gap:4px 14px;margin:6px 0 2px;font-size:12.5px}.about-links a{color:var(--ink-dim);text-decoration:underline;text-underline-offset:3px}.about-links a:hover{color:var(--acid)}.preview-panel{cursor:grab}.preview-panel:active{cursor:grabbing}.preview-panel-head{user-select:none}.preview-panel-head button,.preview-panel-head input{cursor:pointer}.preview-bgimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.preview-cutout{position:relative;cursor:grab}.cut-ghost{position:fixed;z-index:90;max-width:150px;max-height:150px;transform:translate(-50%,-50%);opacity:.75;pointer-events:none;filter:drop-shadow(0 4px 14px rgba(0,0,0,.5))}.color-export-hex{font-family:var(--mono);font-size:11.5px;color:var(--ink-dim)}.ad-slot .btn{width:100%}.ad-slot-house{gap:6px;min-height:120px}.ad-slot-house .house-body{margin:0 0 4px}.ad-slot-house .btn-donate{margin-top:auto}.btn-icon-donate{font-size:15px;line-height:1}.about-donate{margin:10px 0 4px;align-self:stretch}.icon-hero-sticker{border-radius:18px}.icon-hero-sticker canvas{width:256px;height:256px}.consent-banner{position:fixed;left:16px;right:16px;bottom:16px;z-index:200;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;max-width:720px;margin:0 auto;padding:14px 16px;background:var(--panel);border:1px solid var(--line-bright);border-radius:var(--radius);box-shadow:0 16px 48px #0000008c}.consent-text{margin:0;flex:1 1 280px;font-size:12.5px;line-height:1.5;color:var(--ink-dim)}.consent-text a{color:var(--acid);text-underline-offset:3px}.consent-actions{display:flex;gap:8px;flex-shrink:0}