*{box-sizing:border-box}:root{color:#17211d;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;background:#eef5f1;font-family:Inter,Noto Sans SC,Microsoft YaHei,PingFang SC,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}body{min-width:320px;min-height:100vh;margin:0}button,input,a{font:inherit}.app-shell{min-height:100vh;padding:28px}.workspace{grid-template-columns:minmax(340px,430px) minmax(0,1fr);gap:20px;min-height:calc(100vh - 56px);display:grid}.control-pane,.preview-pane{background:#ffffffeb;border:1px solid #2a44381f;border-radius:8px;box-shadow:0 18px 50px #23342c1f}.control-pane{flex-direction:column;gap:20px;padding:24px;display:flex}.page-header p{color:#16794d;margin:0 0 8px;font-size:13px;font-weight:700}.page-header h1{letter-spacing:0;margin:0;font-size:32px;line-height:1.15}.drop-zone{color:#355247;cursor:pointer;background:#f5fbf8;border:1px dashed #74ad91;border-radius:8px;grid-template-columns:34px minmax(0,1fr);align-items:center;gap:12px;min-height:88px;padding:18px;transition:border-color .16s,background .16s;display:grid}.drop-zone:hover{background:#edf8f2;border-color:#17844f}.drop-zone input{opacity:0;pointer-events:none;width:1px;height:1px;position:absolute}.drop-zone span{overflow-wrap:anywhere;min-width:0;font-weight:700}.text-field{gap:8px;display:grid}.text-field span,.slider-head span{color:#50645b;font-size:13px;font-weight:700}.text-field input{color:#17211d;background:#fff;border:1px solid #cfdbd5;border-radius:8px;outline:none;width:100%;height:46px;padding:0 13px}.text-field input:focus{border-color:#168052;box-shadow:0 0 0 3px #16805224}.slider-stack{gap:18px;display:grid}.slider-row{gap:8px;display:grid}.slider-head{justify-content:space-between;align-items:baseline;gap:12px;display:flex}.slider-head strong{color:#137449;text-align:right;min-width:68px;font-size:14px}input[type=range]{accent-color:#15945a;cursor:pointer;width:100%;height:24px}.spacing-note,.error-box{border-radius:8px;padding:11px 12px;font-size:13px;line-height:1.5}.spacing-note{color:#2e5c47;background:#eef8f2;border:1px solid #c8ead7}.spacing-note.is-adjusted{color:#6b5218;background:#fff7df;border-color:#f3dda0}.error-box{color:#8b1e1e;background:#fff0f0;border:1px solid #f4caca}.action-bar{grid-template-columns:minmax(0,1fr) 44px minmax(0,1fr);gap:10px;margin-top:auto;display:grid}.primary-button,.download-button,.icon-button{cursor:pointer;border:0;border-radius:8px;justify-content:center;align-items:center;height:44px;font-weight:800;text-decoration:none;display:inline-flex}.primary-button{color:#fff;background:#117a4a;gap:8px}.primary-button:disabled{cursor:not-allowed;background:#a9bbb2}.icon-button{color:#1e4d39;background:#e6f3ec}.download-button{color:#0f5f3a;background:#dff4e8;gap:8px}.download-button.is-disabled{color:#899991;pointer-events:none;background:#edf1ef}.spin{animation:.9s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.preview-pane{grid-template-rows:auto minmax(0,1fr);display:grid;overflow:hidden}.preview-toolbar{border-bottom:1px solid #2a44381f;justify-content:space-between;align-items:center;min-height:66px;padding:14px 18px;display:flex}.preview-toolbar div{gap:3px;display:grid}.preview-toolbar span{color:#16794d;font-size:12px;font-weight:800}.preview-toolbar strong{overflow-wrap:anywhere;color:#22352e;min-width:0;font-size:15px}.preview-surface{background-color:#f7faf8;background-image:linear-gradient(45deg,#1374490e 25%,#0000 25%),linear-gradient(-45deg,#1374490e 25%,#0000 25%),none;background-position:0 0,0 0,0 0;background-repeat:repeat,repeat,repeat;background-size:22px 22px;background-attachment:scroll,scroll,scroll;background-origin:padding-box,padding-box,padding-box;background-clip:border-box,border-box,border-box;min-height:520px}.preview-surface iframe{background:#f7faf8;border:0;width:100%;height:100%;min-height:calc(100vh - 124px);display:block}.empty-preview{color:#789086;align-content:center;place-items:center;gap:12px;min-height:calc(100vh - 124px);font-weight:800;display:grid}@media (width<=900px){.app-shell{padding:14px}.workspace{grid-template-columns:1fr;min-height:auto}.control-pane{padding:18px}.page-header h1{font-size:27px}.preview-surface,.preview-surface iframe,.empty-preview{min-height:560px}}@media (width<=520px){.action-bar{grid-template-columns:minmax(0,1fr) 44px}.download-button{grid-column:1/-1}}