:root{color:#111827;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#f4f5f7;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}html,body,#root{height:100%;overflow:hidden}*{box-sizing:border-box}body{margin:0}button,textarea{font:inherit}@media (width<=760px){html,body,#root{height:auto;overflow:auto}}.app-shell{color:#000;background:linear-gradient(#fafafa 0 0) padding-box padding-box,repeating-linear-gradient(90deg,#00000009 0 1px,#0000 1px 80px);flex-direction:column;height:100vh;display:flex;overflow:hidden}.topbar{z-index:10;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#ffffffe6;border-bottom:1px solid #eaeaea;flex:none;justify-content:space-between;align-items:center;gap:24px;min-height:72px;padding:14px 24px;display:flex}.brand-lockup,.topbar-actions{align-items:center;gap:12px;display:flex}.brand-mark{color:#fff;letter-spacing:0;background:#000;border:1px solid #000;border-radius:8px;justify-content:center;align-items:center;width:40px;height:40px;font-size:11px;font-weight:700;display:inline-flex}.topbar h1{color:#000;letter-spacing:0;margin:0;font-size:20px;font-weight:650;line-height:1.2}.status-pill{color:#666;white-space:nowrap;background:#fff;border:1px solid #eaeaea;border-radius:999px;align-items:center;min-height:28px;padding:0 10px;font-size:12px;display:inline-flex}.copy-button{color:#fff;min-height:36px;font:inherit;cursor:pointer;background:#000;border:1px solid #000;border-radius:6px;padding:0 14px;font-size:13px;font-weight:600;transition:background .18s,border-color .18s,transform .18s}.copy-button:hover{background:#333;border-color:#333}.copy-button:active{transform:translateY(1px)}.copy-button:focus-visible,.theme-card:focus-visible,textarea:focus-visible{outline-offset:2px;outline:2px solid #000}.workspace{flex:auto;grid-template-columns:288px minmax(360px,1fr) minmax(380px,480px);gap:12px;width:100%;max-width:1600px;min-height:0;margin:0 auto;padding:12px;display:grid;overflow:hidden}.theme-panel,.editor-panel,.preview-panel{background:#fff;border:1px solid #eaeaea;border-radius:8px;flex-direction:column;min-height:0;display:flex;overflow:hidden}.panel-heading{background:#fff;border-bottom:1px solid #eaeaea;flex:none;padding:16px}.panel-heading h2{color:#000;letter-spacing:0;margin:0 0 5px;font-size:14px;font-weight:650;line-height:1.3}.panel-heading p{color:#666;margin:0;font-size:12px;line-height:1.5}.theme-list{flex-direction:column;gap:6px;padding:8px;display:flex;overflow:auto}.theme-card{color:#000;text-align:left;cursor:pointer;background:0 0;border:1px solid #0000;border-radius:6px;grid-template-columns:38px 1fr;align-items:center;gap:10px;width:100%;padding:9px;transition:background .18s,border-color .18s;display:grid}.theme-card:hover{background:#fafafa;border-color:#eaeaea}.theme-card.is-active{background:#fff;border-color:#000}.theme-card strong,.theme-card small{display:block}.theme-card strong{margin-bottom:2px;font-size:13px;font-weight:650}.theme-card small{color:#666;font-size:12px;line-height:1.35}.theme-swatch{border:1px solid;border-radius:6px;justify-content:flex-end;align-items:flex-end;width:36px;height:36px;display:flex;overflow:hidden}.theme-swatch span{border-radius:999px 0 0;width:15px;height:15px}textarea{resize:none;color:#000;background:#fff;border:0;flex:1;width:100%;min-height:0;padding:16px;font:13px/1.7 ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;overflow:auto}.phone-frame{background:linear-gradient(#fafafa,#fafafa),repeating-linear-gradient(0deg,#0000 0 23px,#eee 24px);flex:auto;justify-content:center;align-items:flex-start;min-height:0;padding:16px;display:flex;overflow:auto}.wechat-preview{background:#fff;border:1px solid #eaeaea;border-radius:8px;flex:none;width:375px;min-height:640px;overflow:hidden;box-shadow:0 24px 60px #00000014}@media (width<=1180px){.workspace{grid-template-columns:280px 1fr}.preview-panel{grid-column:1/-1}}@media (width<=760px){.app-shell{height:auto;min-height:100vh;overflow:visible}.topbar{flex-direction:column;align-items:flex-start}.brand-lockup{align-items:flex-start}.topbar-actions{flex-wrap:wrap}.workspace{grid-template-columns:1fr;overflow:visible}.theme-panel,.editor-panel,.preview-panel{min-height:auto;overflow:visible}textarea{min-height:420px}.phone-frame{min-height:520px}}
