:root{--bg: #f7f7f8;--surface: #ffffff;--surface-2: #fafafc;--ink: #101828;--ink-2: #475467;--ink-3: #98a2b3;--line: #eaecf0;--line-2: #f2f4f7;--accent: #4f46e5;--accent-2: #7c3aed;--accent-soft: #eef2ff;--accent-ink: #4338ca;--green: #12b76a;--green-soft: #ecfdf3;--red: #f04438;--red-soft: #fef3f2;--amber: #d97706;--amber-soft: #fffaeb;--blue: #2e90fa;--blue-soft: #eff8ff;--violet: #7a5af8;--violet-soft: #f4f3ff;--radius: 14px;--radius-sm: 10px;--shadow-sm: 0 1px 2px rgba(16, 24, 40, .05);--shadow-md: 0 6px 16px -4px rgba(16, 24, 40, .08);--shadow-lg: 0 20px 48px -12px rgba(16, 24, 40, .18);--font: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif}*{box-sizing:border-box}html,body{margin:0;padding:0}body{font-family:var(--font);background:var(--bg);color:var(--ink);font-size:15px;line-height:1.55;-webkit-font-smoothing:antialiased}#root{min-height:100vh}button{font-family:inherit}h1,h2,h3,h4{margin:0;letter-spacing:-.02em}.app{min-height:100vh;display:flex;flex-direction:column}.app-main{flex:1;width:100%;max-width:1160px;margin:0 auto;padding:28px 24px 64px}.muted{color:var(--ink-2)}.small{font-size:13px}.topbar{position:sticky;top:0;z-index:40;background:#ffffffd9;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}.topbar-inner{max-width:1160px;margin:0 auto;padding:0 24px;height:60px;display:flex;align-items:center;gap:24px}.brand{display:flex;align-items:center;gap:10px;font-weight:700;font-size:16px;letter-spacing:-.02em}.brand-mark{width:28px;height:28px;border-radius:8px;background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:14px;font-weight:800}.topnav{display:flex;gap:4px}.topnav-item{padding:6px 12px;border-radius:8px;font-size:14px;font-weight:500;color:var(--ink-2)}.topnav-item.topnav-active{color:var(--ink);background:#f2f4f7}.topbar-right{margin-left:auto;display:flex;align-items:center;gap:12px}.topbar-count{font-size:13px;color:var(--ink-2);background:#f2f4f7;padding:4px 10px;border-radius:999px;font-weight:600}.avatar{width:30px;height:30px;border-radius:50%;background:var(--accent);color:#fff;font-size:13px;font-weight:700;display:inline-flex;align-items:center;justify-content:center}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid transparent;border-radius:10px;font-size:14px;font-weight:600;padding:9px 16px;cursor:pointer;transition:all .15s ease;text-decoration:none;line-height:1.2;background:none;color:var(--ink)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--accent);color:#fff;box-shadow:0 1px 2px #10182833}.btn-primary:not(:disabled):hover{background:var(--accent-ink)}.btn-accent-grad{background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#fff}.btn-accent-grad:not(:disabled):hover{filter:brightness(1.06)}.btn-outline{border-color:var(--line);background:var(--surface)}.btn-outline:not(:disabled):hover{background:var(--surface-2);border-color:#d0d5dd}.btn-ghost{color:var(--ink-2)}.btn-ghost:not(:disabled):hover{background:#f2f4f7;color:var(--ink)}.btn-success{background:var(--green);color:#fff}.btn-danger-ghost{color:var(--red)}.btn-lg{padding:12px 22px;font-size:15px;border-radius:12px}.btn-sm{padding:6px 12px;font-size:13px;border-radius:8px}.btn-block{width:100%}.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm)}.card-pad{padding:24px}.card-title{font-size:17px;font-weight:700;letter-spacing:-.01em}.section-gap{margin-top:28px}.row{display:flex;align-items:center;gap:12px}.row-between{display:flex;align-items:center;justify-content:space-between;gap:12px}.stack{display:flex;flex-direction:column;gap:12px}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:12px}.divider{height:1px;background:var(--line);margin:20px 0;border:0}.field{display:flex;flex-direction:column;gap:6px}.label{font-size:13px;font-weight:600;color:var(--ink)}.label .req{color:var(--red);margin-left:2px}.input,.textarea,.select{width:100%;border:1px solid #d0d5dd;border-radius:10px;padding:9px 12px;font-size:14px;font-family:inherit;background:var(--surface);color:var(--ink);transition:border .15s,box-shadow .15s}.textarea{min-height:96px;resize:vertical;line-height:1.5}.input:focus,.textarea:focus,.select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px #4f46e51f}.input.invalid,.textarea.invalid{border-color:var(--red)}.input.invalid:focus,.textarea.invalid:focus{box-shadow:0 0 0 3px #f044381a}.hint{font-size:12px;color:var(--ink-3)}.error-text{font-size:12px;color:var(--red);font-weight:500}.input-wrap{position:relative}.input-wrap .input-affix{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--ink-3);font-size:14px}.input-wrap .input{padding-left:34px}.toggle{position:relative;width:40px;height:22px;border-radius:999px;background:#d0d5dd;border:none;cursor:pointer;transition:background .2s;flex:none}.toggle:after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;transition:transform .2s;box-shadow:0 1px 2px #00000040}.toggle.on{background:var(--accent)}.toggle.on:after{transform:translate(18px)}.badge{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;padding:3px 10px;border-radius:999px}.badge .dot{width:6px;height:6px;border-radius:50%;background:currentColor}.badge-draft{background:#f2f4f7;color:var(--ink-2)}.badge-ready_to_publish{background:var(--blue-soft);color:#175cd3}.badge-domain_pending{background:var(--amber-soft);color:var(--amber)}.badge-deploying{background:var(--violet-soft);color:#5925dc}.badge-published{background:var(--green-soft);color:#067647}.badge-deployment_failed{background:var(--red-soft);color:var(--red)}.stepper{display:flex;align-items:flex-start;margin:8px 0 4px}.step{flex:1;display:flex;flex-direction:column;align-items:center;position:relative;text-align:center}.step-dot{width:30px;height:30px;border-radius:50%;background:#fff;border:2px solid #d0d5dd;color:var(--ink-2);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;z-index:1}.step:before{content:"";position:absolute;top:15px;left:-50%;width:100%;height:2px;background:#e4e7ec}.step:first-child:before{display:none}.step.done .step-dot{background:var(--green);border-color:var(--green);color:#fff}.step.done:before{background:var(--green)}.step.current .step-dot{border-color:var(--accent);color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}.step.current:before{background:var(--accent)}.step-label{margin-top:8px;font-size:12px;font-weight:600;color:var(--ink-2)}.step.current .step-label{color:var(--ink)}.step.done .step-label{color:var(--green)}.wizard{max-width:860px;margin:0 auto}.wizard-head{text-align:center;max-width:620px;margin:18px auto 0}.wizard-title{font-size:30px;font-weight:800;letter-spacing:-.03em}.wizard-sub{color:var(--ink-2);margin-top:8px;font-size:15px}.wizard-body{margin-top:28px}.wizard-nav{display:flex;justify-content:space-between;align-items:center;margin-top:32px;gap:12px}.wizard-nav-right{display:flex;gap:10px;margin-left:auto}.tpl-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.tpl-card{border:2px solid var(--line);border-radius:var(--radius);overflow:hidden;background:var(--surface);cursor:pointer;transition:border .15s,box-shadow .15s,transform .15s;text-align:left;padding:0}.tpl-card:hover{border-color:#c7cbf5;box-shadow:var(--shadow-md);transform:translateY(-1px)}.tpl-card.selected{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.tpl-preview{height:150px;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden}.tpl-preview .pv-emoji{font-size:40px;filter:drop-shadow(0 6px 12px rgba(0,0,0,.25))}.tpl-preview .pv-lines{position:absolute;inset:8px 12px;display:flex;flex-direction:column;gap:6px;justify-content:center}.tpl-preview .pv-line{height:7px;border-radius:99px;background:#ffffff8c}.tpl-preview .pv-line.w60{width:60%}.tpl-preview .pv-line.w40{width:40%}.tpl-meta{padding:14px 16px;display:flex;align-items:flex-start;gap:10px}.tpl-meta h3{font-size:15px;font-weight:700}.tpl-meta p{margin:3px 0 0;font-size:13px;color:var(--ink-2)}.editor-split{display:grid;grid-template-columns:minmax(340px,420px) 1fr;gap:20px;align-items:start}.editor-controls{display:flex;flex-direction:column;gap:18px}.preview-sticky{position:sticky;top:84px}.preview-frame{border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:#fff;box-shadow:var(--shadow-md)}.preview-chrome{display:flex;align-items:center;gap:10px;padding:10px 12px;border-bottom:1px solid var(--line);background:var(--surface-2)}.preview-dots{display:flex;gap:5px}.preview-dots span{width:9px;height:9px;border-radius:50%;background:#d0d5dd}.preview-url{flex:1;background:#fff;border:1px solid var(--line);border-radius:8px;font-size:12px;padding:5px 10px;color:var(--ink-2);display:flex;align-items:center;gap:6px}.preview-body{min-height:420px}.site-preview{--p-accent: #4f46e5;--p-bg: #ffffff}.site-hero{background:var(--p-bg);padding:44px 32px 40px;text-align:center}.site-hero h1{font-size:27px;letter-spacing:-.03em;margin:0 0 10px}.site-hero p{font-size:14px;color:var(--ink-2);max-width:420px;margin:0 auto}.site-hero .site-btn{display:inline-block;margin-top:18px;background:var(--p-accent);color:#fff;padding:10px 20px;border-radius:10px;font-size:13px;font-weight:600;text-decoration:none}.site-section{padding:30px 32px;border-top:1px solid var(--line-2)}.site-section h2{font-size:18px;margin-bottom:12px;letter-spacing:-.02em}.site-section p{font-size:14px;color:var(--ink-2);margin:0;white-space:pre-wrap}.site-list{margin:0;padding-left:18px;font-size:14px;color:var(--ink-2);display:flex;flex-direction:column;gap:4px}.site-image{width:100%;border-radius:12px;object-fit:cover;display:block;border:1px solid var(--line)}.site-contact{text-align:center}.site-contact .site-btn{display:inline-block;margin-top:14px;background:var(--p-accent);color:#fff;padding:10px 20px;border-radius:10px;font-size:13px;font-weight:600;text-decoration:none}.comm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}.comm-option{border:1.5px solid var(--line);border-radius:12px;padding:14px;cursor:pointer;background:var(--surface);transition:all .15s;text-align:left}.comm-option:hover{border-color:#c7cbf5}.comm-option.selected{border-color:var(--accent);background:var(--accent-soft);box-shadow:0 0 0 3px #4f46e514}.comm-option .co-icon{width:34px;height:34px;border-radius:9px;background:#f2f4f7;display:flex;align-items:center;justify-content:center;font-size:17px;margin-bottom:8px}.comm-option.selected .co-icon{background:var(--accent)}.comm-option .co-title{font-size:13px;font-weight:700}.comm-option .co-sub{font-size:12px;color:var(--ink-2);margin-top:2px}.domain-cards{display:grid;grid-template-columns:1fr 1fr;gap:12px}.domain-card{border:1.5px solid var(--line);border-radius:12px;padding:16px;cursor:pointer;background:var(--surface)}.domain-card.selected{border-color:var(--accent);background:var(--accent-soft);box-shadow:0 0 0 3px #4f46e514}.domain-card .dc-title{font-weight:700;font-size:14px;display:flex;align-items:center;gap:8px}.dns-box{background:#0b1220;color:#d6e2ff;border-radius:12px;padding:16px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12.5px;line-height:1.7;overflow-x:auto}.dns-box .dns-key{color:#7dd3fc}.dns-box .dns-val{color:#fde68a}.check-list{display:flex;flex-direction:column;gap:10px}.check-item{display:flex;align-items:center;gap:10px;font-size:14px}.check-item.ok{color:#067647}.check-item.bad{color:var(--red)}.deploy-box{border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);padding:20px}.deploy-log{background:#0b1220;color:#b9c6e2;border-radius:12px;padding:16px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;line-height:1.8;max-height:220px;overflow:auto;white-space:pre-wrap}.site-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px}.site-card{padding:20px;display:flex;flex-direction:column;gap:12px}.site-card .site-thumb{height:110px;border-radius:10px;position:relative;overflow:hidden}.site-card h3{font-size:16px;font-weight:700}.site-card .site-actions{display:flex;gap:8px;margin-top:4px}.empty{text-align:center;padding:70px 24px;border:1.5px dashed #d0d5dd;border-radius:var(--radius);background:var(--surface)}.empty h2{font-size:22px;font-weight:800;letter-spacing:-.02em}.empty p{color:var(--ink-2);max-width:460px;margin:10px auto 22px}.kbd{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;background:#f2f4f7;border:1px solid var(--line);padding:2px 6px;border-radius:6px;font-size:12px}.toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%);background:#101828;color:#fff;padding:11px 18px;border-radius:12px;font-size:14px;font-weight:600;box-shadow:var(--shadow-lg);z-index:100;animation:toast-in .25s ease}@keyframes toast-in{0%{opacity:0;transform:translate(-50%,8px)}to{opacity:1;transform:translate(-50%)}}@media(max-width:900px){.editor-split{grid-template-columns:1fr}.preview-sticky{position:static}.tpl-grid,.domain-cards{grid-template-columns:1fr}.step-label{font-size:11px}}