:root{color-scheme:light;font-family:Inter,Segoe UI,Microsoft YaHei,PingFang SC,Arial,sans-serif;background:#f6f7f9;color:#17202a;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:linear-gradient(135deg,rgba(33,113,145,.08),transparent 30%),linear-gradient(315deg,rgba(204,86,71,.09),transparent 34%),#f6f7f9}button,input,select{font:inherit}button{border:0}.app-shell{width:min(1440px,calc(100% - 32px));margin:0 auto;padding:28px 0}.topbar{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:20px}.brand,.topbar__actions,.panel__title,.stats{display:flex;align-items:center}.brand{gap:14px}.brand__mark,.file-drop__icon{display:grid;width:48px;height:48px;place-items:center;border-radius:8px;background:#113946;color:#fff}.brand h1,.panel__title h2,.file-drop h2,.empty-state h2{margin:0;letter-spacing:0}.brand h1{font-size:28px;line-height:1.15}.brand p,.preview-panel__header p,.file-drop p,.empty-state p{margin:6px 0 0;color:#66727f}.topbar__actions{gap:10px;flex-wrap:wrap;justify-content:flex-end}.primary-button,.ghost-button{display:inline-flex;min-height:42px;align-items:center;justify-content:center;gap:8px;border-radius:8px;padding:0 16px;font-size:14px;font-weight:700;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease,background .15s ease}.primary-button{background:#c7523f;color:#fff;box-shadow:0 12px 26px #c7523f3d}.primary-button:disabled{cursor:not-allowed;background:#aeb7bf;box-shadow:none}.ghost-button{border:1px solid #d8dde3;background:#fff;color:#17202a}.primary-button:not(:disabled):hover,.ghost-button:hover{transform:translateY(-1px)}.workspace{display:grid;grid-template-columns:minmax(320px,420px) minmax(0,1fr);gap:20px;align-items:start}.left-rail{display:grid;gap:14px}.file-drop,.panel,.preview-panel{border:1px solid #dfe4e8;border-radius:8px;background:#ffffffeb;box-shadow:0 18px 50px #2c3b4914}.file-drop{position:relative;display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;min-height:112px;padding:18px}.file-drop input[type=file]{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.file-drop h2{font-size:17px;line-height:1.2}.file-drop p{max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}.panel{display:grid;gap:15px;padding:18px}.panel__title{gap:8px;color:#113946}.panel__title h2{font-size:18px;line-height:1.2}.field{display:grid;gap:8px}.field span,.segmented legend{color:#4c5965;font-size:13px;font-weight:700}.field input[type=text],.field select{width:100%;min-height:40px;border:1px solid #d5dce2;border-radius:8px;background:#fff;color:#17202a;padding:0 12px;outline:none}.field input[type=range]{width:100%;accent-color:#217191}.field input:focus,.field select:focus{border-color:#217191;box-shadow:0 0 0 3px #21719124}.field input:disabled,.field select:disabled,.segmented:disabled{opacity:.58;cursor:not-allowed}.segmented{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0;padding:0;border:0}.segmented legend{grid-column:1 / -1;margin-bottom:8px}.segmented label{display:flex;min-height:38px;align-items:center;justify-content:center;gap:8px;border:1px solid #d5dce2;border-radius:8px;background:#f9fafb;font-size:14px;font-weight:700}.preview-panel{min-height:calc(100vh - 104px);overflow:hidden}.preview-panel__header{display:grid;grid-template-columns:1fr auto;gap:18px;align-items:start;padding:20px;border-bottom:1px solid #dfe4e8}.stats{gap:10px;flex-wrap:wrap;justify-content:flex-end}.stat{display:grid;min-width:88px;gap:3px;border:1px solid #dde4e9;border-radius:8px;background:#fff;padding:9px 10px}.stat span{color:#687583;font-size:12px}.stat strong{font-size:18px;line-height:1}.preview-box{height:calc(100vh - 220px);min-height:520px;overflow:auto;background:#101820;color:#e8eef4}.preview-box ol{margin:0;padding:18px 22px 18px 64px}.preview-box li{min-height:24px;padding-left:10px;color:#8292a2;font-family:Cascadia Code,Consolas,Courier New,monospace;font-size:13px;line-height:1.7}.preview-box code{color:#f6f8fb;white-space:pre-wrap;word-break:break-word}.empty-state{display:grid;min-height:520px;place-items:center;align-content:center;gap:10px;padding:32px;text-align:center;color:#e8eef4}.empty-state p{color:#aeb9c4}@media(max-width:980px){.topbar,.preview-panel__header{align-items:stretch;grid-template-columns:1fr}.topbar{flex-direction:column}.topbar__actions{justify-content:flex-start}.workspace{grid-template-columns:1fr}.preview-panel{min-height:auto}.preview-box{height:auto;min-height:460px}}@media(max-width:640px){.app-shell{width:min(100% - 20px,1440px);padding:16px 0}.brand{align-items:flex-start}.brand h1{font-size:24px}.file-drop{grid-template-columns:auto 1fr}.file-drop .ghost-button{grid-column:1 / -1}.primary-button,.ghost-button{width:100%}.stats{justify-content:stretch}.stat{flex:1 1 130px}.preview-box ol{padding-left:48px}}