:root{--bg:#f7f6f3;--card:#fff;--ink:#1d1d1b;--muted:#6b6a65;--line:#e4e2dc;--accent:#c2410c;--accent-ink:#fff;--ok:#15803d;--bad:#b91c1c;--radius:10px}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--bg);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Microsoft YaHei,sans-serif;font-size:15px;line-height:1.6}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}h1{margin:0 0 8px;font-size:28px}h2{margin:28px 0 12px;font-size:20px}code,pre{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px}pre{color:#f3f2ee;background:#1d1d1b;border-radius:8px;padding:14px;overflow-x:auto}.topbar{background:var(--card);border-bottom:1px solid var(--line);z-index:10;justify-content:space-between;align-items:center;padding:12px 24px;display:flex;position:sticky;top:0}.brand{color:var(--ink);letter-spacing:.5px;font-size:18px;font-weight:800}.brand span{color:var(--accent)}.topbar nav{align-items:center;gap:18px;display:flex}.topbar nav a{color:var(--ink)}.topbar form{margin:0}.page{max-width:1000px;margin:0 auto;padding:32px 24px 64px}.muted{color:var(--muted)}.small{font-size:13px}.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:20px}.grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;display:grid}.stat .label{color:var(--muted);font-size:13px}.stat .value{font-size:28px;font-weight:700}.btn{background:var(--accent);color:var(--accent-ink);cursor:pointer;border:none;border-radius:8px;padding:10px 18px;font-size:15px;font-weight:600;display:inline-block}.btn:hover{filter:brightness(1.05);text-decoration:none}.btn:disabled{opacity:.5;cursor:not-allowed}.btn.small{padding:6px 12px;font-size:14px}.btn.ghost{color:var(--ink);border:1px solid var(--line);background:0 0}.btn.danger{color:var(--bad);background:0 0;border:1px solid #f1c6c6}.linkbtn{color:var(--muted);cursor:pointer;background:0 0;border:none;padding:0;font-size:15px}input,select,textarea{font:inherit;border:1px solid var(--line);color:var(--ink);background:#fff;border-radius:8px;width:100%;padding:9px 12px}.pw{position:relative}.pw input{padding-right:44px}.pw-eye{color:var(--muted);cursor:pointer;background:0 0;border:none;padding:6px;display:flex;position:absolute;top:50%;right:6px;transform:translateY(-50%)}.pw-eye:hover{color:var(--ink)}label{color:var(--muted);margin:12px 0 4px;font-size:13px;display:block}.row{flex-wrap:wrap;align-items:center;gap:10px;display:flex}table{border-collapse:collapse;background:var(--card);border-radius:var(--radius);width:100%;overflow:hidden}th,td{text-align:left;border-bottom:1px solid var(--line);padding:10px 12px;font-size:14px}th{color:var(--muted);background:#f0eee9;font-weight:600}td.num,th.num{text-align:right;font-variant-numeric:tabular-nums}.notice{background:#fff7ed;border:1px solid #fed7aa;border-radius:8px;margin:12px 0;padding:12px 14px}.notice.ok{background:#f0fdf4;border-color:#bbf7d0}.notice.bad{background:#fef2f2;border-color:#fecaca}.keybox{word-break:break-all;background:#f0eee9;border-radius:8px;padding:10px;font-family:ui-monospace,monospace}.subnav{border-bottom:1px solid var(--line);gap:6px;margin-bottom:24px;display:flex}.subnav a{color:var(--muted);border-bottom:2px solid #0000;padding:8px 14px}.subnav a.active{color:var(--ink);border-bottom-color:var(--accent)}.hero{text-align:center;padding:72px 24px 40px}.hero h1{font-size:40px}.hero p{color:var(--muted);max-width:640px;margin:12px auto 28px;font-size:18px}.chat{grid-template-columns:240px 1fr;height:calc(100vh - 57px);display:grid}.chat.with-preview{grid-template-columns:240px minmax(360px,1fr) minmax(400px,1.2fr)}.chat aside{border-right:1px solid var(--line);background:var(--card);padding:12px;overflow-y:auto}.chat aside .conv{color:var(--ink);white-space:nowrap;text-overflow:ellipsis;cursor:pointer;border-radius:6px;padding:8px 10px;font-size:14px;display:block;overflow:hidden}.chat aside .conv.active,.chat aside .conv:hover{background:#f0eee9;text-decoration:none}.chat main{flex-direction:column;min-width:0;display:flex}.chat .msgs{flex:1;padding:24px;overflow-y:auto}.msg{max-width:760px;margin:0 auto 18px}.msg .who{color:var(--muted);margin-bottom:4px;font-size:12px}.msg .body{white-space:pre-wrap;word-wrap:break-word}.msg.user .body{background:#efe9df;border-radius:10px;padding:10px 14px;display:inline-block}.msg .cost{color:var(--muted);margin-top:4px;font-size:12px}.artifact-card{border:1px solid var(--line);background:var(--card);white-space:normal;border-radius:8px;justify-content:space-between;align-items:center;gap:12px;margin:8px 0;padding:12px 14px;display:flex}.composer{border-top:1px solid var(--line);background:var(--card);padding:12px 24px 16px}.composer textarea{resize:none;min-height:60px}.preview{border-left:1px solid var(--line);background:#fff;flex-direction:column;min-width:0;display:flex}.preview .bar{border-bottom:1px solid var(--line);align-items:center;gap:8px;padding:8px 12px;display:flex}.preview .stage{background:#f0eee9;flex:1;justify-content:center;display:flex;overflow:auto}.preview iframe{background:#fff;border:none;width:100%;height:100%}.preview iframe.mobile{border-left:1px solid var(--line);border-right:1px solid var(--line);width:390px;max-width:100%}@media (max-width:800px){.chat,.chat.with-preview{grid-template-columns:1fr}.chat aside{display:none}.preview{z-index:20;position:fixed;inset:57px 0 0}}