:root{color-scheme:light;--ink:#1f2933;--muted:#6e7781;--muted-strong:#4f5965;--line:rgba(44,62,80,0.1);--panel:rgba(255,255,255,0.88);--panel-soft:rgba(252,249,243,0.86);--panel-deep:rgba(248,244,236,0.94);--accent:#d97745;--accent-soft:rgba(217,119,69,0.14);--shadow:0 18px 48px rgba(44,62,80,0.08);--shadow-strong:0 26px 72px rgba(44,62,80,0.16);--radius-xl:28px;--radius-lg:22px;--radius-md:16px;--radius-sm:12px;font-family:Avenir Next,PingFang SC,Helvetica Neue,sans-serif;color:var(--ink);background:radial-gradient(circle at top left,rgba(238,218,201,.46),transparent 22%),radial-gradient(circle at top right,rgba(229,236,242,.48),transparent 24%),linear-gradient(180deg,#f8f4ec,#edf2f5)}*{box-sizing:border-box}#root,body,html{min-height:100%}html{scrollbar-gutter:stable}body{margin:0;min-width:320px;overflow:hidden}button,input,select,textarea{font:inherit}button{border:0}.app-frame{height:100vh;overflow:hidden}.app-layout{display:flex;height:100%;align-items:stretch}.brand-mark{display:inline-flex;width:34px;height:34px;align-items:center;justify-content:center;border-radius:12px;background:linear-gradient(145deg,#1d2733,#394555);color:white;box-shadow:inset 0 1px 0 rgba(255,255,255,.12);font-size:18px;font-weight:700}.brand-lockup strong{display:block}.brand-lockup{display:flex;align-items:center;gap:12px;min-width:0}.rail-brand{padding:0;border:0;background:transparent;box-shadow:none;flex-direction:row;align-items:center;gap:10px}.brand-copy{display:flex;min-width:0;flex-direction:column;gap:2px}.brand-copy strong{font-size:15px;line-height:1.1;letter-spacing:-.02em}.brand-copy p{margin:0;color:var(--muted);font-size:10px;line-height:1.25;white-space:nowrap}.workspace-shell{min-width:0;flex:1 1 auto;height:100%;display:flex;flex-direction:column}.workspace-toolbar{justify-content:space-between;padding:12px 16px 0}.toolbar-actions,.workspace-toolbar{display:flex;align-items:center;gap:10px}.toolbar-actions{padding:6px;border:1px solid rgba(79,89,101,.08);border-radius:999px;background:linear-gradient(180deg,rgba(255,255,255,.84),rgba(247,242,236,.8));box-shadow:0 12px 22px rgba(44,62,80,.06)}.toolbar-action-button{display:inline-flex;align-items:center;gap:10px;min-height:38px;padding:0 14px 0 10px;border-radius:999px;background:transparent;border:1px solid transparent;color:var(--ink);font-size:13px;font-weight:700;cursor:pointer;transition:background .16s ease,box-shadow .16s ease,border-color .16s ease,color .16s ease}.toolbar-action-button.is-active,.toolbar-action-button:hover{background:linear-gradient(135deg,#d97745,#e59b68);border-color:rgba(217,119,69,.32);color:white;box-shadow:0 14px 24px rgba(217,119,69,.24)}.toolbar-action-icon{display:inline-flex;width:26px;height:26px;align-items:center;justify-content:center;border-radius:999px;background:rgba(31,41,51,.06)}.toolbar-action-button.is-active .toolbar-action-icon,.toolbar-action-button:hover .toolbar-action-icon{background:rgba(255,255,255,.18)}.toolbar-action-icon svg{width:15px;height:15px}.page-shell{flex:1 1 auto;padding:10px 16px 16px;height:auto;overflow:hidden}.compact-top{margin-top:4px}.section-title h2{margin:0;font-size:18px;line-height:1.2;font-weight:700}.hero-actions,.lab-actions,.preview-tools,.saved-theme-actions{display:flex;gap:10px;flex-wrap:wrap}.preview-mode-switch{display:flex;gap:8px;flex-wrap:wrap}.eyebrow{margin:0 0 4px;color:var(--muted);font-size:10px;letter-spacing:.14em;text-transform:uppercase}.editor-content-layout,.theme-lab-layout{display:grid;grid-template-columns:minmax(380px,.98fr) minmax(380px,1.02fr);grid-gap:14px;gap:14px;height:100%}.theme-lab-page{display:flex;flex-direction:column;gap:12px}.theme-lab-header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.theme-lab-header-copy h1{margin:0;font-size:28px;line-height:1.1;letter-spacing:-.03em}.theme-lab-header-copy p:last-child{margin:8px 0 0;color:var(--muted);font-size:14px;line-height:1.6}.studio-card{padding:16px;border:1px solid rgba(79,89,101,.08);border-radius:24px;background:linear-gradient(180deg,rgba(255,255,255,.94),rgba(250,247,242,.88));box-shadow:var(--shadow)}.editor-composer,.editor-preview-panel,.lab-form-card,.lab-preview-card{display:flex;flex-direction:column;gap:18px;min-height:0}.lab-form-card,.lab-preview-card{overflow:hidden}.editor-composer.is-drag-active{border-color:rgba(217,119,69,.2);box-shadow:0 18px 42px rgba(217,119,69,.12)}.section-title{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.section-title-side{display:flex;align-items:center}.editor-hint,.status-chip{display:inline-flex;align-items:center;min-height:30px;padding:0 12px;border-radius:999px;font-size:12px;font-weight:600}.editor-hint{color:var(--muted-strong);background:rgba(255,255,255,.72)}.editor-hint,.status-chip{border:1px solid rgba(79,89,101,.08)}.status-chip{color:#0f172a;background:rgba(255,255,255,.88)}.status-chip.is-uploading{color:#92400e;background:rgba(255,247,235,.96);border-color:rgba(217,119,69,.16)}.status-chip.is-success{color:#166534;background:rgba(240,253,244,.96);border-color:rgba(34,197,94,.16)}.status-chip.is-error{color:#b91c1c;background:rgba(254,242,242,.96);border-color:rgba(239,68,68,.16)}.lab-form-grid{display:grid;grid-gap:10px;gap:10px;grid-template-columns:repeat(2,minmax(0,1fr))}.lab-form-card .lab-form-grid{flex:1 1 auto;min-height:0;overflow:auto;padding-right:4px}.color-field,.field{display:flex;flex-direction:column;gap:8px;color:var(--muted-strong);font-size:14px}.field-span-2{grid-column:1/-1}.action-button,.compact-textarea,.field input,.field select,.markdown-input,.mini-button{border:1px solid rgba(15,23,42,.1)}.compact-textarea,.field input,.field select{width:100%;min-height:42px;padding:10px 12px;border-radius:14px;background:white;color:var(--ink)}.compact-textarea{min-height:96px;resize:vertical}.color-field input{width:100%;height:48px;padding:4px;border-radius:var(--radius-md);background:white}.markdown-input{flex:1 1;width:100%;min-height:640px;padding:16px 18px;border-radius:20px;background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(253,251,247,.98));line-height:1.75;resize:none;box-shadow:inset 0 1px 0 rgba(255,255,255,.8)}.action-button,.menu-close-button,.mini-button{height:44px;padding:0 16px;border-radius:999px;background:rgba(255,255,255,.92);color:var(--ink);cursor:pointer;transition:box-shadow .16s ease,background .16s ease,border-color .16s ease}.action-button:hover,.menu-close-button:hover,.mini-button:hover,.theme-pill-button:hover{box-shadow:0 12px 24px rgba(15,23,42,.08)}.action-button.primary{background:linear-gradient(135deg,#111827,#334155);color:white;box-shadow:0 14px 26px rgba(15,23,42,.18)}.mini-button{height:38px;border-radius:12px}.mini-button.is-active{background:linear-gradient(135deg,#3b82f6,#2563eb);color:white}.mini-button.danger{color:#b91c1c}.preview-surface{flex:1 1;min-height:0;padding:10px;border-radius:24px;box-shadow:0 14px 34px rgba(44,62,80,.08)}.preview-surface.polished{background:linear-gradient(180deg,rgba(251,247,240,.96),rgba(238,243,246,.92))}.preview-surface.is-mobile-preview{overflow:hidden}.preview-device-shell{display:flex;min-height:0;height:100%;justify-content:center;overflow:auto;padding:2px}.preview-device-shell.is-desktop{display:block;overflow:visible;padding:0}.preview-device-frame{display:flex;flex-direction:column;gap:12px;padding:12px;border:1px solid rgba(15,23,42,.08);border-radius:34px;background:linear-gradient(180deg,#141c27,#334155);box-shadow:0 22px 44px rgba(15,23,42,.18),inset 0 1px 0 rgba(255,255,255,.08)}.preview-device-frame.is-desktop{display:block;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none}.preview-device-chrome{display:flex;justify-content:center}.preview-device-notch{width:118px;height:22px;border-radius:0 0 18px 18px;background:rgba(7,10,16,.94);box-shadow:inset 0 -1px 0 rgba(255,255,255,.08)}.wechat-preview{min-height:700px;height:calc(100vh - 140px);overflow:auto;padding:18px 16px;border-radius:20px;background:linear-gradient(180deg,rgba(255,255,255,.99),rgba(252,249,243,.98))}.wechat-preview.is-mobile{min-height:640px;height:min(780px,calc(100vh - 240px));padding:20px 18px 24px;border-radius:26px;background:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.92),0 0 0 1px rgba(15,23,42,.04)}.lab-preview-stage .wechat-preview{height:calc(100vh - 220px)}.lab-preview-stage{flex:1 1 auto;min-height:0}.saved-theme-block{padding:18px;border:1px solid rgba(15,23,42,.08);border-radius:20px;background:var(--panel-soft);flex:0 0 220px;min-height:0;overflow:auto}.saved-theme-list{display:grid;grid-gap:12px;gap:12px}.saved-theme-item{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:14px;border-radius:16px;background:white;border:1px solid rgba(15,23,42,.06)}.saved-theme-item p{margin:6px 0 0;color:var(--muted)}.modal-backdrop{position:fixed;inset:0;z-index:40;display:flex;align-items:center;justify-content:center;padding:32px;background:rgba(15,23,42,.28);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.theme-modal{width:min(1320px,100%);max-height:88vh;overflow:auto;padding:22px;border-radius:28px;background:#f3f4f6;box-shadow:0 40px 100px rgba(15,23,42,.22)}.theme-modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.theme-modal-tabs{display:flex;gap:10px}.theme-modal-tabs button{height:40px;padding:0 14px;border-radius:999px;background:white;color:var(--muted)}.theme-modal-tabs .is-active{color:#2563eb;box-shadow:inset 0 -2px 0 #2563eb}.menu-close-button{width:42px;padding:0;font-size:28px}.theme-picker-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(198px,1fr));grid-gap:18px;gap:18px}.theme-picker-empty{display:grid;grid-gap:8px;gap:8px;align-content:center;min-height:220px;padding:24px;border-radius:22px;border:1px dashed rgba(15,23,42,.14);background:rgba(255,255,255,.7);color:var(--muted-strong)}.theme-picker-empty strong{font-size:18px}.theme-picker-empty p{margin:0;color:var(--muted);font-size:13px;line-height:1.7}.theme-picker-card{display:flex;flex-direction:column;height:100%;padding:12px;border-radius:22px;background:white;border:1px solid rgba(15,23,42,.08);box-shadow:0 8px 20px rgba(15,23,42,.08)}.theme-picker-card.is-active{border-color:rgba(59,130,246,.28);box-shadow:0 16px 30px rgba(59,130,246,.14)}.theme-picker-new{cursor:pointer;align-items:center;justify-content:center;text-align:center;gap:10px;border-style:dashed;background:linear-gradient(160deg,rgba(255,255,255,.7),rgba(255,250,240,.9))}.theme-picker-new:hover{border-color:rgba(59,130,246,.35);box-shadow:0 16px 30px rgba(59,130,246,.12)}.theme-picker-new-icon{width:62px;height:62px;border-radius:20px;display:grid;place-items:center;font-size:32px;font-weight:600;color:#2563eb;background:rgba(59,130,246,.12)}.theme-picker-new-title{font-size:18px;font-weight:600;color:#111827}.theme-picker-new p{margin:0;color:var(--muted);font-size:12px;line-height:1.6}.theme-picker-preview-shell{height:226px;overflow:hidden;border-radius:18px;background:#eef2f7;border:1px solid rgba(15,23,42,.06)}.theme-picker-preview{width:324px;transform:scale(.59);transform-origin:top left}.theme-picker-preview>section{min-height:360px}.theme-picker-meta{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-gap:12px;gap:12px;align-items:end;margin-top:12px}.theme-picker-meta strong{display:block;font-size:18px}.theme-picker-title-row{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}.theme-picker-name-row{display:inline-flex;align-items:center;gap:6px}.theme-picker-name{letter-spacing:.08em;text-transform:uppercase;font-family:JetBrains Mono,SFMono-Regular,Consolas,monospace}.theme-picker-copy-button,.theme-picker-name{color:var(--muted);font-size:11px;line-height:1}.theme-picker-copy-button{border:0;padding:0;background:transparent;cursor:pointer}.theme-picker-copy-button:hover{color:var(--ink)}.theme-picker-meta p{margin:6px 0 0;color:var(--muted);font-size:12px;line-height:1.6;min-height:58px}.drawer-promo-card{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;grid-gap:16px;gap:16px;padding:16px;border-radius:20px;border:1px solid rgba(59,130,246,.14);background:radial-gradient(circle at top right,rgba(59,130,246,.14),transparent 30%),linear-gradient(180deg,rgba(255,255,255,.96),rgba(244,248,252,.94));overflow:visible}.drawer-promo-copy{min-width:0}.drawer-promo-kicker{margin:0 0 6px;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#2563eb}.drawer-promo-copy h3{margin:0;font-size:20px;line-height:1.15}.drawer-promo-copy p:last-of-type{margin:8px 0 0;color:var(--muted-strong);font-size:13px;line-height:1.6}.drawer-promo-link{display:inline-flex;align-items:center;justify-content:center;margin-top:14px;min-height:40px;padding:0 14px;border-radius:999px;background:linear-gradient(135deg,#111827,#334155);color:white;font-size:13px;font-weight:700;text-decoration:none;box-shadow:0 12px 24px rgba(15,23,42,.14)}.drawer-promo-link:hover{text-decoration:none;box-shadow:0 16px 28px rgba(15,23,42,.2)}.drawer-promo-qr{position:relative;display:flex;align-items:center}.drawer-promo-qr-trigger{display:flex;flex-direction:column;align-items:center;gap:8px;padding:0;background:transparent;border:0;cursor:zoom-in}.drawer-promo-qr-trigger img{width:68px;height:68px;border-radius:14px;border:1px solid rgba(15,23,42,.12);background:white;box-shadow:0 12px 24px rgba(15,23,42,.08)}.drawer-promo-qr-trigger span{font-size:11px;color:var(--muted)}.drawer-promo-qr-popover{position:absolute;right:calc(100% + 16px);top:50%;z-index:3;width:220px;padding:14px;border-radius:20px;border:1px solid rgba(15,23,42,.1);background:rgba(255,255,255,.98);box-shadow:0 24px 48px rgba(15,23,42,.16);opacity:0;pointer-events:none;transform:translateY(-50%) scale(.92);transform-origin:right center;transition:opacity .16s ease,transform .16s ease}.drawer-promo-qr-popover img{display:block;width:100%;height:auto;border-radius:14px}.drawer-promo-qr-popover p{margin:10px 0 0;text-align:center;font-size:12px;color:var(--muted-strong)}.drawer-promo-qr:focus-within .drawer-promo-qr-popover,.drawer-promo-qr:hover .drawer-promo-qr-popover{opacity:1;transform:translateY(-50%) scale(1)}@media (max-width:1120px){.editor-content-layout,.theme-lab-layout{grid-template-columns:1fr}.workspace-toolbar{justify-content:space-between}.lab-preview-stage .wechat-preview,.wechat-preview{height:72vh;min-height:560px}.preview-device-frame{padding:10px;border-radius:28px}.wechat-preview.is-mobile{height:70vh;min-height:540px}}@media (max-width:920px){.app-layout{flex-direction:column}.rail-brand{padding:9px 11px}.workspace-toolbar{padding:10px 12px 0}.page-shell{padding:10px 12px 12px;height:auto;overflow:auto}.saved-theme-item,.section-title,.theme-lab-header{flex-direction:column}.preview-mode-switch,.preview-tools,.section-title-side{width:100%}.drawer-promo-card{grid-template-columns:1fr}.drawer-promo-qr{justify-content:flex-start}.drawer-promo-qr-popover{right:auto;left:0;top:calc(100% + 12px);transform:translateY(0) scale(.92);transform-origin:top left}.drawer-promo-qr:focus-within .drawer-promo-qr-popover,.drawer-promo-qr:hover .drawer-promo-qr-popover{transform:translateY(0) scale(1)}.preview-device-shell{padding:0}.preview-device-frame{gap:10px;padding:8px;border-radius:24px}.preview-device-notch{width:96px;height:18px;border-radius:0 0 14px 14px}.wechat-preview.is-mobile{min-height:420px;height:68vh;padding:16px 14px 20px;border-radius:18px}.drawer-form-grid,.lab-form-grid,.theme-picker-grid,.theme-picker-meta{grid-template-columns:1fr}}.settings-drawer-shell{width:0;flex:0 0 auto;overflow:hidden;transition:width .22s ease;border-left:0 solid rgba(79,89,101,.08)}.settings-drawer-shell.is-open{width:392px;border-left-width:1px;padding-top:12px}.settings-drawer{width:392px;height:calc(100% - 12px);overflow:auto;padding:0 18px 22px;background:radial-gradient(circle at top right,rgba(217,119,69,.08),transparent 24%),linear-gradient(180deg,rgba(255,252,248,.96),rgba(244,246,248,.96));box-shadow:inset 1px 0 0 rgba(255,255,255,.5)}.settings-drawer-header{display:flex;align-items:center;justify-content:space-between;position:-webkit-sticky;position:sticky;top:0;z-index:2;min-height:60px;margin:0 -18px 16px;padding:12px 18px;border-bottom:1px solid rgba(79,89,101,.08);background:linear-gradient(180deg,rgba(255,252,248,.98),rgba(247,245,240,.94));-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.settings-drawer-header strong{font-size:24px;letter-spacing:-.03em}.drawer-section+.drawer-section{margin-top:18px}.drawer-section{padding:16px;border-radius:22px;background:linear-gradient(180deg,rgba(255,255,255,.84),rgba(248,245,239,.72));border:1px solid rgba(79,89,101,.08);box-shadow:0 12px 26px rgba(44,62,80,.05)}.drawer-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-gap:12px;gap:12px;margin-top:14px}.drawer-field{display:flex;flex-direction:column;gap:8px;color:var(--muted-strong);font-size:13px;font-weight:600}.drawer-text-input{width:100%;min-height:42px;padding:10px 12px;border:1px solid rgba(79,89,101,.1);border-radius:14px;background:rgba(255,255,255,.94);color:var(--ink)}.drawer-text-input:focus{outline:2px solid rgba(217,119,69,.14);border-color:rgba(217,119,69,.22)}.setting-toggle,.theme-current-card{width:100%;margin-top:14px;border:1px solid rgba(79,89,101,.08);border-radius:18px;background:rgba(255,255,255,.92);cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:16px}.theme-swatch-row{display:flex;align-items:center;gap:8px}.theme-swatch-dot{width:14px;height:14px;border-radius:999px;border:2px solid rgba(255,255,255,.86);box-shadow:0 4px 10px rgba(44,62,80,.12)}.theme-current-meta{display:flex;min-width:0;flex-direction:column;align-items:flex-end;gap:4px}.setting-toggle span:first-child,.theme-current-meta strong{color:#0f172a;font-size:15px;font-weight:600}.theme-current-meta span:last-child{color:#475569;font-size:13px;font-weight:600}.setting-toggle{transition:background .16s ease,border-color .16s ease,box-shadow .16s ease}.setting-toggle.is-active{background:linear-gradient(180deg,rgba(255,247,235,.96),rgba(255,251,241,.96));border-color:rgba(217,119,69,.24);box-shadow:0 14px 28px rgba(217,119,69,.1)}.setting-toggle-track{display:inline-flex;width:52px;height:30px;align-items:center;padding:3px;border-radius:999px;background:#d7dfe6;transition:background .16s ease}.setting-toggle.is-active .setting-toggle-track{background:var(--accent)}.setting-toggle-thumb{width:24px;height:24px;border-radius:999px;background:white;box-shadow:0 6px 14px rgba(15,23,42,.16);transition:transform .16s ease}.setting-toggle.is-active .setting-toggle-thumb{transform:translateX(22px)}.option-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-gap:10px;gap:10px}.size-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.option-chip{min-height:44px;padding:0 12px;border:1px solid rgba(79,89,101,.08);border-radius:14px;background:rgba(255,255,255,.96);color:#0f172a;font-size:14px;font-weight:600;cursor:pointer;transition:background .16s ease,box-shadow .16s ease,border-color .16s ease}.option-chip.is-active,.option-chip:hover{background:linear-gradient(180deg,rgba(255,248,238,.98),rgba(255,252,246,.98));border-color:rgba(217,119,69,.22);box-shadow:0 10px 20px rgba(217,119,69,.08)}@media (max-width:920px){.settings-drawer-shell,.settings-drawer-shell.is-open{width:100%;border-left-width:0;border-top:1px solid rgba(15,23,42,.08);padding-top:0}.settings-drawer{width:100%;height:auto;max-height:40vh;padding:0 14px 18px}.settings-drawer-header{margin:0 -14px 14px;padding:10px 14px}.size-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}