:root{--ink: #1a1f2e;--ink-soft: #3d4659;--muted: #6b7385;--line: rgba(26, 31, 46, .1);--surface: rgba(255, 255, 255, .72);--surface-solid: #f7f5f1;--accent: #0d7a6f;--accent-deep: #096159;--accent-soft: rgba(13, 122, 111, .12);--warm: #c45c26;--shadow: 0 24px 64px rgba(26, 31, 46, .14);--radius: 14px;--font-display: "Fraunces", Georgia, serif;--font-body: "DM Sans", system-ui, sans-serif;--chrome-light-bg: #dee1e6;--chrome-light-tab: #fff;--chrome-light-toolbar: #f1f3f4;--chrome-light-address: #fff;--chrome-light-text: #202124;--chrome-light-muted: #5f6368;--chrome-dark-bg: #202124;--chrome-dark-tab: #35363a;--chrome-dark-toolbar: #292a2d;--chrome-dark-address: #202124;--chrome-dark-text: #e8eaed;--chrome-dark-muted: #9aa0a6}*,*:before,*:after{box-sizing:border-box}[hidden]{display:none!important}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;font-family:var(--font-body);color:var(--ink);background:#e8e4dc;line-height:1.5;overflow-x:hidden}.atmosphere{position:fixed;top:0;right:0;bottom:0;left:0;z-index:-1;background:radial-gradient(ellipse 80% 50% at 10% -10%,rgba(13,122,111,.18),transparent 55%),radial-gradient(ellipse 60% 40% at 90% 5%,rgba(196,92,38,.12),transparent 50%),radial-gradient(ellipse 50% 60% at 50% 110%,rgba(61,70,89,.08),transparent 55%),linear-gradient(165deg,#efebe3,#e2ddd3 45%,#d8e0dc);animation:atmosphere-drift 18s ease-in-out infinite alternate}@keyframes atmosphere-drift{0%{filter:hue-rotate(0deg) saturate(1)}to{filter:hue-rotate(8deg) saturate(1.05)}}.site-header{max-width:1440px;margin:0 auto;padding:2rem 1.5rem 1rem;animation:fade-up .7s ease both}.brand{display:flex;align-items:center;gap:.75rem}.brand-mark{width:2rem;height:2rem;border-radius:9px;background:linear-gradient(145deg,var(--accent) 0%,var(--accent-deep) 100%);box-shadow:inset 0 1px #ffffff40,0 8px 20px #0d7a6f47;position:relative}.brand-mark:after{content:"";position:absolute;top:7px;right:5px;bottom:5px;left:5px;border:1.5px solid rgba(255,255,255,.85);border-radius:3px 3px 4px 4px;border-top-width:3px}.brand-name{margin:0;font-family:var(--font-display);font-size:clamp(1.85rem,3.5vw,2.4rem);font-weight:600;letter-spacing:-.03em;line-height:1.1}.brand-tagline{margin:.55rem 0 0 2.75rem;max-width:36rem;color:var(--ink-soft);font-size:1.02rem}.app{display:flex;flex-direction:column;gap:1.15rem;max-width:1440px;margin:0 auto;padding:0 1.5rem 2.5rem;animation:fade-up .8s ease .08s both}@keyframes fade-up{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}.panel{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:0;background:var(--surface);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.55);border-radius:calc(var(--radius) + 4px);box-shadow:var(--shadow);overflow:hidden}.panel-section{padding:1.1rem 1.15rem;border-bottom:1px solid var(--line);border-right:1px solid var(--line)}.panel-section:last-of-type{border-bottom:none}.export-actions{margin-top:.9rem;padding-top:.85rem;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:.5rem}.export-actions .btn-primary{width:100%}.export-hint{margin:0;text-align:center;font-size:.75rem;color:var(--muted)}.panel-title{margin:0 0 .85rem;font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}.upload-zone{display:flex;flex-direction:column;align-items:center;gap:.3rem;padding:1rem .85rem;border:1.5px dashed rgba(13,122,111,.35);border-radius:12px;background:var(--accent-soft);cursor:pointer;transition:border-color .2s,background .2s,transform .2s;text-align:center}.upload-zone:hover,.upload-zone.dragover{border-color:var(--accent);background:#0d7a6f2e;transform:translateY(-1px)}.upload-icon{color:var(--accent);display:grid;place-items:center;margin-bottom:.15rem}.upload-text{font-size:.9rem;font-weight:600;color:var(--ink)}.upload-hint{font-size:.75rem;color:var(--muted)}.sample-row{margin-top:.85rem}.sample-label{display:block;font-size:.75rem;color:var(--muted);margin-bottom:.45rem}.sample-chips{display:flex;flex-wrap:wrap;gap:.4rem}.chip{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid var(--line);background:#ffffffb3;color:var(--ink-soft);font:inherit;font-size:.78rem;font-weight:500;padding:.28rem .65rem;border-radius:999px;cursor:pointer;transition:background .15s,color .15s,border-color .15s}.chip:hover,.chip.active{background:var(--accent);border-color:var(--accent);color:#fff}.field{display:flex;flex-direction:column;gap:.35rem;margin-bottom:.75rem}.field:last-child{margin-bottom:0}.field-label{font-size:.78rem;font-weight:500;color:var(--ink-soft);display:flex;justify-content:space-between;align-items:baseline}.field-label output{font-variant-numeric:tabular-nums;color:var(--muted);font-weight:400}.field-hint{font-size:.72rem;font-weight:400;color:var(--muted);opacity:.85;margin-left:.35rem}.field input[type=text],.field select{width:100%;font:inherit;font-size:.9rem;padding:.55rem .7rem;border:1px solid var(--line);border-radius:9px;background:#ffffffd9;color:var(--ink);outline:none;transition:border-color .15s,box-shadow .15s}.field input[type=text]:focus,.field select:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.field input[type=range]{width:100%;accent-color:var(--accent)}.field-row{display:grid;grid-template-columns:1fr 1fr;gap:.65rem}.size-row{grid-template-columns:1fr auto 1fr;align-items:end}.size-row .field{margin-bottom:0}.size-x{padding-bottom:.65rem;color:var(--muted);font-weight:600}.field input[type=number]{width:100%;font:inherit;font-size:.9rem;padding:.55rem .7rem;border:1px solid var(--line);border-radius:9px;background:#ffffffd9;color:var(--ink);outline:none;transition:border-color .15s,box-shadow .15s;font-variant-numeric:tabular-nums}.field input[type=number]:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.field-note{margin:.55rem 0 0;font-size:.72rem;color:var(--muted)}.favicon-row{display:flex;align-items:center;gap:.75rem}.favicon-preview{width:2.4rem;height:2.4rem;border-radius:10px;border:1px solid var(--line);background:#ffffffd9;display:grid;place-items:center;flex-shrink:0;color:var(--muted);overflow:hidden}.favicon-preview img{width:18px;height:18px;object-fit:contain;border-radius:3px}.favicon-actions{display:flex;flex-wrap:wrap;gap:.4rem}.btn-secondary{background:#ffffffd9;color:var(--ink-soft);border:1px solid var(--line);box-shadow:none}.btn-secondary:hover{background:#fff;border-color:#0d7a6f59;color:var(--accent-deep)}.btn-ghost{background:transparent;color:var(--muted);border:1px solid transparent;box-shadow:none}.btn-ghost:hover{color:var(--ink);background:#1a1f2e0d}.btn-sm{width:auto;padding:.4rem .7rem;font-size:.78rem;font-weight:560;border-radius:8px}label.btn{margin:0;cursor:pointer}.toggle{display:flex;align-items:center;gap:.65rem;font-size:.88rem;color:var(--ink-soft);cursor:pointer;-webkit-user-select:none;user-select:none;margin-top:.35rem}.toggle input{position:absolute;opacity:0;pointer-events:none}.toggle-ui{width:2.1rem;height:1.2rem;border-radius:999px;background:#c5c9d1;position:relative;flex-shrink:0;transition:background .2s}.toggle-ui:after{content:"";position:absolute;top:2px;left:2px;width:calc(1.2rem - 4px);height:calc(1.2rem - 4px);border-radius:50%;background:#fff;box-shadow:0 1px 3px #0003;transition:transform .2s}.toggle input:checked+.toggle-ui{background:var(--accent)}.toggle input:checked+.toggle-ui:after{transform:translate(.9rem)}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:inline-flex;align-items:center;justify-content:center;gap:.45rem;width:100%;font:inherit;font-weight:600;font-size:.95rem;padding:.75rem 1rem;border:none;border-radius:11px;cursor:pointer;transition:transform .15s,box-shadow .15s,background .15s,opacity .15s}.btn.btn-sm{width:auto;padding:.4rem .7rem;font-size:.78rem;font-weight:560;border-radius:8px}.btn:disabled{opacity:.45;cursor:not-allowed;transform:none!important;box-shadow:none!important}.btn-primary{background:linear-gradient(160deg,var(--accent) 0%,var(--accent-deep) 100%);color:#fff;box-shadow:0 10px 24px #0d7a6f4d}.btn-primary:not(:disabled):hover{transform:translateY(-1px);box-shadow:0 14px 28px #0d7a6f5c}.btn-primary:not(:disabled):active{transform:translateY(0)}.preview-area{min-width:0;display:flex;flex-direction:column;gap:.75rem;width:100%}.preview-toolbar{display:flex;align-items:center;justify-content:space-between;padding:0 .25rem}.preview-label{font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}.zoom-controls{display:flex;align-items:center;gap:.35rem;background:var(--surface);border:1px solid rgba(255,255,255,.55);border-radius:999px;padding:.2rem .35rem;box-shadow:0 4px 16px #1a1f2e0f}.zoom-controls span{min-width:3.2rem;text-align:center;font-size:.78rem;font-variant-numeric:tabular-nums;color:var(--ink-soft)}.icon-btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:1.7rem;height:1.7rem;border:none;border-radius:50%;background:transparent;color:var(--ink);font-size:1.1rem;line-height:1;cursor:pointer;transition:background .15s}.icon-btn:hover{background:var(--accent-soft);color:var(--accent-deep)}.preview-stage{background:var(--surface);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.55);border-radius:calc(var(--radius) + 4px);box-shadow:var(--shadow);overflow:auto;min-height:560px;max-height:none;display:grid;place-items:start center;padding:1.75rem 1.5rem}.export-root{transform-origin:top center;transition:transform .2s ease;will-change:transform}.canvas-surface{--pad-x: 48px;--pad-y: 48px;--export-w: 1280px;--export-h: 800px;--decor-ink: rgba(26, 31, 46, .14);--decor-accent: rgba(13, 122, 111, .22);--decor-warm: rgba(196, 92, 38, .18);width:var(--export-w);height:var(--export-h);padding:var(--pad-y) var(--pad-x);display:flex;flex-direction:column;align-items:stretch;gap:1.1rem;box-sizing:border-box;overflow:hidden;position:relative}.canvas-decor{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;pointer-events:none;overflow:hidden}.canvas-decor[hidden]{display:none!important}.canvas-decor svg{width:100%;height:100%;display:block}.canvas-surface>.title-block,.canvas-surface>.browser-window{position:relative;z-index:1}.canvas-surface>.title-block{order:1}.canvas-surface>.browser-window{order:2}.decor-refresh{margin-top:.65rem}.canvas-surface[data-bg=studio]{background:radial-gradient(ellipse 70% 50% at 50% 0%,rgba(255,255,255,.9),transparent 60%),linear-gradient(160deg,#f4f1eb,#e5e9e8);--decor-ink: rgba(26, 31, 46, .13);--decor-accent: rgba(13, 122, 111, .2);--decor-warm: rgba(196, 92, 38, .16)}.canvas-surface[data-bg=gradient-dawn]{background:linear-gradient(135deg,#f6e7d4,#e8d5c4 35%,#c9d6d8);--decor-ink: rgba(61, 40, 28, .14);--decor-accent: rgba(45, 110, 120, .22);--decor-warm: rgba(180, 90, 40, .2)}.canvas-surface[data-bg=gradient-mist]{background:radial-gradient(ellipse 55% 45% at 15% 20%,rgba(180,205,220,.55),transparent 60%),radial-gradient(ellipse 50% 40% at 85% 75%,rgba(200,210,218,.5),transparent 55%),linear-gradient(160deg,#e8eef2,#d5dde4 55%,#c8d2db);--decor-ink: rgba(40, 55, 70, .14);--decor-accent: rgba(60, 120, 140, .22);--decor-warm: rgba(150, 110, 80, .16)}.canvas-surface[data-bg=gradient-sand]{background:radial-gradient(ellipse 60% 50% at 80% 10%,rgba(255,248,235,.8),transparent 55%),linear-gradient(150deg,#f3e6d4,#e8d5bc 45%,#dcc4a8);--decor-ink: rgba(70, 50, 30, .14);--decor-accent: rgba(120, 90, 50, .2);--decor-warm: rgba(180, 100, 50, .18)}.canvas-surface[data-bg=gradient-peach]{background:radial-gradient(ellipse 50% 45% at 20% 80%,rgba(255,210,190,.55),transparent 60%),linear-gradient(140deg,#ffe8dc,#f7d0c4 40%,#e8c4c8);--decor-ink: rgba(80, 45, 45, .14);--decor-accent: rgba(180, 90, 90, .2);--decor-warm: rgba(210, 120, 70, .18)}.canvas-surface[data-bg=gradient-ocean]{background:linear-gradient(145deg,#1b3a4b,#2d5a6b 45%,#3d7a7a);--decor-ink: rgba(244, 241, 235, .16);--decor-accent: rgba(120, 220, 210, .22);--decor-warm: rgba(255, 180, 120, .18)}.canvas-surface[data-bg=gradient-forest]{background:radial-gradient(ellipse 50% 40% at 70% 15%,rgba(90,140,100,.35),transparent 55%),linear-gradient(155deg,#1f3d32,#2f5a45,#3d6b52);--decor-ink: rgba(235, 245, 235, .16);--decor-accent: rgba(140, 220, 160, .22);--decor-warm: rgba(220, 190, 120, .18)}.canvas-surface[data-bg=gradient-sunset]{background:radial-gradient(ellipse 55% 45% at 85% 20%,rgba(255,160,100,.45),transparent 55%),linear-gradient(135deg,#f07850,#e85a6a 45%,#c44d7a);--decor-ink: rgba(255, 245, 240, .2);--decor-accent: rgba(255, 230, 180, .28);--decor-warm: rgba(255, 255, 255, .18)}.canvas-surface[data-bg=gradient-aurora]{background:radial-gradient(ellipse 45% 40% at 20% 30%,rgba(60,200,190,.4),transparent 55%),radial-gradient(ellipse 50% 45% at 80% 70%,rgba(70,130,200,.35),transparent 55%),linear-gradient(160deg,#163a4a,#1f5a6a 40%,#2a6b7a);--decor-ink: rgba(230, 250, 250, .16);--decor-accent: rgba(120, 240, 220, .24);--decor-warm: rgba(180, 220, 255, .18)}.canvas-surface[data-bg=gradient-citrus]{background:radial-gradient(ellipse 50% 45% at 15% 85%,rgba(180,220,120,.4),transparent 55%),linear-gradient(145deg,#f2f6e8,#e4efc8 40%,#cfe8b8);--decor-ink: rgba(50, 70, 30, .14);--decor-accent: rgba(90, 140, 50, .22);--decor-warm: rgba(200, 140, 40, .18)}.canvas-surface[data-bg=gradient-midnight]{background:radial-gradient(ellipse 55% 45% at 75% 15%,rgba(50,80,140,.4),transparent 55%),linear-gradient(150deg,#0f1724,#1a2740,#243552);--decor-ink: rgba(220, 230, 245, .14);--decor-accent: rgba(120, 170, 255, .22);--decor-warm: rgba(255, 190, 120, .16)}.canvas-surface[data-bg=gradient-ember]{background:radial-gradient(ellipse 45% 40% at 20% 80%,rgba(180,70,40,.35),transparent 55%),linear-gradient(155deg,#1c1614,#2a1e1a 40%,#3d2a22);--decor-ink: rgba(245, 230, 220, .14);--decor-accent: rgba(255, 140, 90, .22);--decor-warm: rgba(255, 200, 120, .18)}.canvas-surface[data-bg=gradient-noir]{background:radial-gradient(ellipse 50% 40% at 85% 25%,rgba(80,70,50,.35),transparent 55%),linear-gradient(145deg,#121212,#1c1c1c,#26221c);--decor-ink: rgba(240, 230, 210, .14);--decor-accent: rgba(220, 180, 100, .22);--decor-warm: rgba(255, 220, 160, .16)}.canvas-surface[data-bg=solid-light]{background:#fff;--decor-ink: rgba(26, 31, 46, .1);--decor-accent: rgba(13, 122, 111, .16);--decor-warm: rgba(196, 92, 38, .12)}.canvas-surface[data-bg=solid-dark]{background:#1e2329;--decor-ink: rgba(244, 241, 235, .12);--decor-accent: rgba(100, 200, 190, .18);--decor-warm: rgba(230, 150, 90, .16)}.canvas-surface[data-bg=transparent]{background:transparent;--decor-ink: rgba(26, 31, 46, .12);--decor-accent: rgba(13, 122, 111, .18);--decor-warm: rgba(196, 92, 38, .14)}.canvas-surface[data-bg=gradient-ocean],.canvas-surface[data-bg=gradient-forest],.canvas-surface[data-bg=gradient-sunset],.canvas-surface[data-bg=gradient-aurora],.canvas-surface[data-bg=gradient-midnight],.canvas-surface[data-bg=gradient-ember],.canvas-surface[data-bg=gradient-noir],.canvas-surface[data-bg=solid-dark]{--title-color-auto: #f4f1eb;--title-sub-color-auto: rgba(244, 241, 235, .72)}.canvas-surface[data-bg=studio],.canvas-surface[data-bg=gradient-dawn],.canvas-surface[data-bg=gradient-mist],.canvas-surface[data-bg=gradient-sand],.canvas-surface[data-bg=gradient-peach],.canvas-surface[data-bg=gradient-citrus],.canvas-surface[data-bg=solid-light],.canvas-surface[data-bg=transparent]{--title-color-auto: #1a1f2e;--title-sub-color-auto: #3d4659}.title-block{text-align:center;padding:0 .5rem;flex-shrink:0}.title-block.hidden{display:none}.canvas-surface[data-title-pos=bottom] .title-block{order:2}.canvas-surface[data-title-pos=bottom]>.browser-window{order:1}.render-title{margin:0;font-family:var(--title-font, var(--font-display));font-size:var(--title-size, 1.75rem);font-weight:600;letter-spacing:-.02em;color:var(--title-color, var(--ink));line-height:1.25}.render-subtitle{margin:.4rem 0 0;font-family:var(--title-font, var(--font-body));font-size:max(.8rem,calc(var(--title-size, 1.75rem) * .48));color:var(--title-sub-color, var(--ink-soft))}.color-field .color-row{display:flex;align-items:center;gap:.45rem}.color-field input[type=color]{width:2.4rem;height:2.15rem;padding:.15rem;border:1px solid var(--line);border-radius:9px;background:#ffffffd9;cursor:pointer;flex-shrink:0}.color-field input[type=text]{flex:1;min-width:0;font:inherit;font-size:.88rem;font-variant-numeric:tabular-nums;padding:.55rem .7rem;border:1px solid var(--line);border-radius:9px;background:#ffffffd9;color:var(--ink);outline:none}.color-field input[type=text]:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.render-subtitle:empty{display:none}.browser-window{--bw-radius: 12px;--chrome-bg: var(--chrome-light-bg);--chrome-tab: var(--chrome-light-tab);--chrome-toolbar: var(--chrome-light-toolbar);--chrome-address: var(--chrome-light-address);--chrome-text: var(--chrome-light-text);--chrome-muted: var(--chrome-light-muted);border-radius:var(--bw-radius);overflow:hidden;background:var(--chrome-bg);flex:1 1 auto;min-height:0;display:flex;flex-direction:column;box-shadow:0 1px #fff6 inset,0 20px 50px #1a1f2e38,0 4px 12px #1a1f2e1a}.browser-window.no-shadow{box-shadow:0 0 0 1px #00000014}.browser-window[data-theme=dark]{--chrome-bg: var(--chrome-dark-bg);--chrome-tab: var(--chrome-dark-tab);--chrome-toolbar: var(--chrome-dark-toolbar);--chrome-address: var(--chrome-dark-address);--chrome-text: var(--chrome-dark-text);--chrome-muted: var(--chrome-dark-muted)}.browser-chrome{background:var(--chrome-bg);-webkit-user-select:none;user-select:none;flex-shrink:0}.chrome-top{display:flex;align-items:flex-end;gap:.4rem;padding:.3rem .4rem 0;min-height:1.7rem}.traffic-lights{display:flex;gap:6px;padding:0 .35rem .45rem;flex-shrink:0}.tl{width:9px;height:9px;border-radius:50%;box-shadow:inset 0 0 0 .5px #0000001f}.tl-close{background:#ff5f57}.tl-minimize{background:#febc2e}.tl-maximize{background:#28c840}.win-controls{display:none;margin-left:auto;order:3;gap:0;padding-bottom:.2rem}.win-btn{width:2rem;height:1.35rem;display:grid;place-items:center;color:var(--chrome-muted);position:relative}.win-btn:before{content:"";display:block}.win-min:before{width:9px;height:1px;background:currentColor}.win-max:before{width:8px;height:8px;border:1px solid currentColor}.win-close:before{width:10px;height:10px;background:linear-gradient(45deg,transparent 43%,currentColor 43%,currentColor 57%,transparent 57%),linear-gradient(-45deg,transparent 43%,currentColor 43%,currentColor 57%,transparent 57%)}.browser-window[data-os=windows] .traffic-lights{display:none}.browser-window[data-os=windows] .win-controls{display:flex}.browser-window[data-os=windows] .chrome-top{padding-top:.2rem}.browser-window[data-os=windows] .tab-strip{padding-left:.35rem}.tab-strip{display:flex;align-items:flex-end;flex:1;min-width:0;gap:.25rem;overflow:hidden}.tab{display:flex;align-items:center;gap:.3rem;max-width:12rem;min-width:5.5rem;padding:.28rem .5rem .3rem;background:var(--chrome-tab);border-radius:6px 6px 0 0;color:var(--chrome-text);font-size:.68rem;font-weight:500;position:relative}.tab.active{z-index:1}.tab-favicon{display:grid;place-items:center;flex-shrink:0;color:var(--chrome-muted);width:12px;height:12px;position:relative}.tab-favicon .favicon-fallback,.tab-favicon .favicon-img{grid-area:1 / 1}.tab-favicon img,.tab-favicon .favicon-img{width:12px;height:12px;border-radius:2px;object-fit:contain}.tab-favicon.has-icon .favicon-fallback,.favicon-preview.has-icon .favicon-fallback{display:none}.tab-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.tab-close{color:var(--chrome-muted);font-size:.75rem;line-height:1;opacity:.7;flex-shrink:0}.new-tab{width:1.25rem;height:1.25rem;display:grid;place-items:center;color:var(--chrome-muted);font-size:.85rem;margin-bottom:.15rem;border-radius:50%;flex-shrink:0}.chrome-toolbar{display:flex;align-items:center;gap:.3rem;padding:.25rem .4rem .3rem;background:var(--chrome-toolbar)}.nav-btns{display:flex;gap:0;flex-shrink:0}.nav-btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;background:transparent;width:1.35rem;height:1.35rem;border-radius:50%;display:grid;place-items:center;color:var(--chrome-muted);padding:0;cursor:default}.nav-btn svg{width:11px;height:11px}.address-bar{flex:1;display:flex;align-items:center;gap:.3rem;min-width:0;height:1.35rem;padding:0 .55rem;background:var(--chrome-address);border-radius:999px;color:var(--chrome-text);font-size:.68rem;box-shadow:0 0 0 1px #0000000a}.browser-window[data-theme=dark] .address-bar{box-shadow:0 0 0 1px #ffffff0f}.lock-icon{display:grid;place-items:center;color:var(--chrome-muted);flex-shrink:0}.browser-window.address-empty .lock-icon{display:none}.address-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--chrome-text)}.browser-window.address-empty .address-text:empty{flex:1;min-height:1em}.toolbar-end{display:flex;align-items:center;gap:.4rem;padding-right:.15rem;flex-shrink:0}.ext-dot{width:11px;height:11px;border-radius:2px;border:1.5px solid var(--chrome-muted);opacity:.55}.profile-btn{width:13px;height:13px;border-radius:50%;background:linear-gradient(135deg,#5b8def,#3d6fd8)}.browser-content{background:#fff;position:relative;line-height:0;flex:1 1 auto;min-height:0;overflow:hidden}.empty-state{display:grid;place-items:center;position:absolute;top:0;right:0;bottom:0;left:0;min-height:0;background:repeating-conic-gradient(#f0eeea,#f0eeea 25%,#e8e5df 0%,#e8e5df 50%) 50% / 24px 24px;line-height:1.5;z-index:1}.empty-state[hidden]{display:none!important}.empty-state p{margin:0;padding:.65rem 1rem;background:#ffffffe6;border-radius:8px;font-size:.88rem;color:var(--muted);box-shadow:0 2px 8px #0000000a}.screenshot-img{display:block;width:100%;height:100%;max-width:none;object-fit:contain;object-position:center center;background:#fff}.screenshot-img[hidden]{display:none!important}.focus-controls{margin-top:.9rem;padding-top:.85rem;border-top:1px solid var(--line)}.focus-controls .toggle{margin-top:0}.focus-opacity-field,.focus-radius-field{margin-top:.75rem;margin-bottom:0}.focus-controls .btn{margin-top:.55rem}.focus-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:3;cursor:crosshair;touch-action:none;-webkit-user-select:none;user-select:none}.focus-overlay[hidden]{display:none!important}.focus-overlay.is-moving{cursor:grab}.focus-overlay.is-moving:active,.focus-overlay.is-moving .focus-hole:active{cursor:grabbing}.focus-mask-svg{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block;pointer-events:none;color:#0f1218}.focus-dim-fill{fill:currentColor;opacity:var(--focus-dim, .55)}.focus-overlay:not(.has-selection) .focus-holes{pointer-events:none}.focus-holes{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;pointer-events:none}.focus-hole{position:absolute;box-sizing:border-box;border:1.5px solid rgba(255,255,255,.92);border-radius:var(--focus-radius, 12px);box-shadow:0 0 0 1px #00000038,inset 0 0 0 1px #ffffff1f;background:transparent;pointer-events:auto;cursor:grab}.focus-hole.is-active{border-color:#fff;box-shadow:0 0 0 1px #0d7a6f8c,0 0 0 3px #0d7a6f33,inset 0 0 0 1px #ffffff1f}.focus-hole.is-draft{opacity:.85;border-style:dashed}.focus-hole-remove{-webkit-appearance:none;-moz-appearance:none;appearance:none;position:absolute;top:-10px;right:-10px;width:18px;height:18px;border:none;border-radius:50%;background:#1a1f2e;color:#fff;font-size:12px;line-height:1;cursor:pointer;display:grid;place-items:center;z-index:3;box-shadow:0 2px 6px #00000040;padding:0}.focus-hole-remove:hover{background:#c45c26}.focus-handle{position:absolute;width:10px;height:10px;border-radius:2px;background:#fff;border:1px solid rgba(26,31,46,.35);box-shadow:0 1px 4px #00000040;z-index:2;pointer-events:auto}.focus-handle[data-handle=nw]{left:-5px;top:-5px;cursor:nwse-resize}.focus-handle[data-handle=n]{left:50%;top:-5px;transform:translate(-50%);cursor:ns-resize}.focus-handle[data-handle=ne]{right:-5px;top:-5px;cursor:nesw-resize}.focus-handle[data-handle=e]{right:-5px;top:50%;transform:translateY(-50%);cursor:ew-resize}.focus-handle[data-handle=se]{right:-5px;bottom:-5px;cursor:nwse-resize}.focus-handle[data-handle=s]{left:50%;bottom:-5px;transform:translate(-50%);cursor:ns-resize}.focus-handle[data-handle=sw]{left:-5px;bottom:-5px;cursor:nesw-resize}.focus-handle[data-handle=w]{left:-5px;top:50%;transform:translateY(-50%);cursor:ew-resize}.focus-overlay.is-resizing{cursor:default}.focus-overlay.is-exporting .focus-handle,.focus-overlay.is-exporting .focus-guide,.focus-overlay.is-exporting .focus-hole-remove{display:none!important}.focus-overlay.is-exporting .focus-hole{border-color:transparent;box-shadow:none}.focus-guide{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);margin:0;padding:.55rem .9rem;border-radius:999px;background:#ffffffeb;color:var(--ink-soft);font-family:var(--font-body);font-size:.82rem;font-weight:560;line-height:1.4;pointer-events:none;box-shadow:0 8px 24px #0000002e;white-space:nowrap;z-index:2}.focus-overlay.has-selection .focus-guide,.focus-overlay.is-drawing .focus-guide{display:none}.export-root.is-loading{opacity:.72;transition:opacity .2s ease}.export-root.is-loading .browser-content:after{content:"加载中…";position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;background:#ffffff8c;font-family:var(--font-body);font-size:.9rem;font-weight:600;color:var(--ink-soft);line-height:1.4;z-index:2;pointer-events:none}.toast{position:fixed;bottom:1.5rem;left:50%;transform:translate(-50%) translateY(calc(100% + 2rem));background:var(--ink);color:#fff;padding:.7rem 1.15rem;border-radius:999px;font-size:.88rem;font-weight:500;box-shadow:0 12px 32px #00000040;z-index:100;opacity:0;visibility:hidden;transition:transform .3s ease,opacity .25s ease,visibility .3s;pointer-events:none}.toast.show{transform:translate(-50%) translateY(0);opacity:1;visibility:visible}.btn.loading{pointer-events:none;opacity:.75}@media(max-width:960px){.brand-tagline{margin-left:0}.panel{grid-template-columns:1fr 1fr}.preview-stage{min-height:400px;padding:1rem}}@media(max-width:700px){.panel{grid-template-columns:1fr}.panel-section{border-right:none}}@media(max-width:600px){.site-header{padding:1.5rem 1rem 1rem}.app{padding:0 1rem 2rem}}