:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg:#f4fbfd;--surface:#ffffffe6;--surface-solid:#fff;--line:#d9eaef;--line-strong:#b9dce5;--text:#132f38;--muted:#687f88;--primary:#12a594;--primary-dark:#0c8276;--blue:#3399e6;--danger:#df5363;--shadow:0 16px 46px #1f66771a;--radius:18px}*{box-sizing:border-box}html{min-height:100%}body{min-width:320px;min-height:100vh;color:var(--text);background:radial-gradient(circle at 0 0,#2dd4bf2e,#0000 34rem),radial-gradient(circle at 100% 0,#38bdf824,#0000 36rem),linear-gradient(135deg,#f8fcff 0%,#eefbf4 100%);margin:0;font-family:Inter,Microsoft YaHei,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}button,input,textarea,select{font:inherit}button{color:#fff;background:var(--primary);cursor:pointer;border:0;border-radius:12px;padding:10px 16px;font-weight:800;transition:transform .14s,background .14s,border-color .14s,box-shadow .14s;box-shadow:0 10px 24px #12a59433}button:hover{background:var(--primary-dark);transform:translateY(-1px)}button:disabled{cursor:not-allowed;opacity:.55;transform:none}input,textarea,select{border:1px solid var(--line);width:100%;color:var(--text);background:#fffffff2;border-radius:14px;outline:none;padding:11px 13px}input:focus,textarea:focus,select:focus{border-color:#62c7d2;box-shadow:0 0 0 4px #4dbecb29}textarea{resize:vertical;font-family:Cascadia Mono,Consolas,SFMono-Regular,monospace;font-size:13px;line-height:1.55}h1,h2,p{margin-top:0}h1{letter-spacing:-.04em;margin-bottom:0;font-size:34px}h2{letter-spacing:-.02em;margin-bottom:6px;font-size:18px}p{color:var(--muted);line-height:1.55}.login-shell{place-items:center;min-height:100vh;padding:28px;display:grid}.login-card{width:min(460px,100%);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#ffffffd6;border:1px solid #81d0d87a;border-radius:28px;padding:34px}.login-card input{margin:16px 0 14px}.brand-mark{color:#067a86;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;align-items:center;gap:9px;font-size:13px;font-weight:950;display:inline-flex}.brand-mark:before{content:"";background:linear-gradient(135deg,#29c7b5,#4fb4f6);border-radius:4px;width:12px;height:12px;box-shadow:0 0 0 6px #29c7b51f}.app-shell{width:100%;margin:0;padding:0 22px 22px}.topbar{z-index:10;border-bottom:1px solid var(--line);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#ffffffdb;align-items:center;gap:18px;min-height:66px;margin:0 -22px 18px;padding:0 28px;display:flex;position:sticky;top:0;box-shadow:0 8px 26px #266f7d12}.brand-tab{color:var(--text);box-shadow:none;letter-spacing:-.03em;background:0 0;align-items:center;gap:10px;padding:0;font-size:22px;font-weight:950;display:inline-flex}.brand-tab:before{content:"C";color:#fff;background:linear-gradient(135deg,#37cdbd,#4aa8f4);border-radius:10px;place-items:center;width:34px;height:34px;font-weight:950;display:grid}.brand-tab:hover{color:#0c7781;background:0 0;transform:none}.nav-tabs{align-items:center;gap:8px;min-width:0;display:flex;overflow-x:auto}.nav-tabs button{color:#6c7d8c;box-shadow:none;background:0 0;border-radius:10px;flex:none;padding:10px 14px}.nav-tabs button:hover{color:#0d7480;background:#ecf8fb;transform:none}.nav-tabs button.active{color:#fff;background:linear-gradient(135deg,#18a999,#3a9dee);box-shadow:0 10px 24px #2199ca2e}.toast{color:#0c666c;background:#dff8f2e6;border:1px solid #bbe8df;border-radius:14px;margin:0 0 16px;padding:12px 14px}.workspace{grid-template-columns:minmax(620px,45%) minmax(0,1fr);align-items:start;gap:18px;display:grid}.input-pane{gap:14px;display:grid}.step-card,.action-card,.preview-pane,.template-page,.converter-page{border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1px solid #81d0d87a}.step-card{padding:16px}.accent-card{background:linear-gradient(#fffffff2,#f0fcf9e6)}.step-head{align-items:flex-start;gap:13px;margin-bottom:12px;display:flex}.step-head>span{color:#087b6d;background:#dff8f2;border-radius:15px;flex:none;place-items:center;width:42px;height:42px;font-size:18px;font-weight:950;display:grid}.step-head p{margin-bottom:0;font-size:13px}.segmented{background:#e9f6f8;border-radius:15px;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:12px;padding:5px;display:grid}.segmented button{color:#2a6870;box-shadow:none;background:0 0;padding:10px}.segmented button.active{color:#fff;background:var(--primary);box-shadow:0 8px 22px #0e9f8a33}.template-input{height:32vh;min-height:250px;margin-top:10px}.node-input{height:26vh;min-height:220px}.subs-list{gap:10px;display:grid}.sub-card{background:#ffffffb3;border:1px solid #e0f0f2;border-radius:16px;grid-template-columns:minmax(150px,.45fr) minmax(260px,1fr) auto;gap:9px;padding:9px;display:grid}.action-card{grid-template-columns:1fr 1fr;gap:12px;padding:14px;display:grid}.primary{background:linear-gradient(135deg,#0e9f8a,#16b6a3)}.secondary{background:linear-gradient(135deg,#248fd3,#57b9e8);box-shadow:0 12px 28px #248fd333}.soft,.file-button{color:#0f7079;box-shadow:none;background:#e8f7fa;border:1px solid #cfe9ee}.soft:hover,.file-button:hover{background:#daf0f4}.full{width:100%;margin-top:12px}.icon-danger,.danger{color:var(--danger);box-shadow:none;background:#fff0f2;border:1px solid #ffd0d6}.icon-danger:hover,.danger:hover{background:#ffe3e7}.file-button{cursor:pointer;border-radius:12px;justify-content:center;align-items:center;width:auto;padding:10px 16px;font-weight:800;display:inline-flex}.file-button input{display:none}.mini-actions,.modal-actions{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.preview-pane{min-height:calc(100vh - 106px);padding:16px;position:sticky;top:84px}.preview-head{justify-content:space-between;align-items:start;gap:16px;margin-bottom:12px;display:flex}.preview-head p{margin-bottom:0;font-size:13px}.preview-head span{color:#2e747b;background:#e9f7fa;border-radius:999px;flex:none;padding:7px 10px;font-size:12px;font-weight:800}.preview-pane textarea{resize:none;background:#fbfeff;border-radius:16px;height:calc(100vh - 205px);min-height:calc(100vh - 205px)}.template-page,.converter-page{padding:20px}.page-intro{justify-content:space-between;align-items:start;gap:18px;margin-bottom:18px;display:flex}.template-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px;display:grid}.template-tile{min-height:104px;color:var(--text);text-align:left;background:var(--surface-solid);border:1px solid var(--line);box-shadow:none;flex-direction:column;justify-content:space-between;align-items:flex-start;padding:18px;display:flex}.template-tile:hover{border-color:var(--line-strong);background:#f7fcfd}.template-tile span{font-size:17px;font-weight:900}.template-tile small{color:var(--muted);font-weight:800}.converter-grid{grid-template-columns:1fr 1fr;gap:18px;display:grid}.converter-card{border:1px solid var(--line);background:#ffffffc7;border-radius:18px;min-height:calc(100vh - 170px);padding:16px}.converter-card textarea{resize:none;background:#fbfeff;height:calc(100vh - 300px);min-height:calc(100vh - 300px)}.check-pill{color:#0f7079;cursor:pointer;background:#e8f7fa;border:1px solid #cfe9ee;border-radius:999px;align-items:center;gap:8px;width:auto;margin:0;padding:10px 14px;font-weight:800;display:inline-flex}.check-pill input{width:auto;box-shadow:none;margin:0}.modal-backdrop{z-index:20;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#081f2573;place-items:center;padding:24px;display:grid;position:fixed;inset:0}.template-modal{background:#f8fdff;border:1px solid #ffffff80;border-radius:24px;grid-template-rows:auto auto minmax(0,1fr) auto;gap:14px;width:min(1320px,92vw);height:88vh;padding:20px;display:grid;box-shadow:0 40px 100px #0000003d}.modal-head{justify-content:space-between;align-items:start;gap:16px;display:flex}.modal-head p{margin-bottom:0}.modal-name{max-width:520px}.modal-editor{resize:none;background:#fff;border-radius:18px;height:100%;min-height:0}.modal-actions{justify-content:flex-end}@media (width<=1180px){.workspace{grid-template-columns:1fr}.preview-pane{min-height:auto;position:static}.preview-pane textarea{height:520px;min-height:520px}}@media (width<=760px){.app-shell{padding:0 12px 14px}.topbar{flex-direction:column;align-items:stretch;gap:10px;margin:0 -12px 14px;padding:10px 12px}.nav-tabs{padding-bottom:2px}.brand-tab{font-size:20px}.page-intro,.modal-head{flex-direction:column;align-items:stretch}.step-card{padding:14px}.sub-card,.action-card,.converter-grid{grid-template-columns:1fr}.converter-card{min-height:auto}.converter-card textarea{height:420px;min-height:420px}.template-modal{width:96vw;height:92vh;padding:14px}}