:root{color:#d8e4eb;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--panel:#081921c7;--panel-strong:#051218eb;--line:#77adc02e;--line-strong:#77adc057;--accent:#59d0e3;--accent-2:#ff9b54;--text-dim:#8fa9b4;--danger:#ff7373;--ok:#7ce3a5;--shadow:0 26px 80px #00000057;background:radial-gradient(circle at 0 0,#17556d47,#0000 34%),radial-gradient(circle at 100% 0,#bc5b202e,#0000 30%),linear-gradient(#08141b 0%,#0d2029 46%,#071218 100%);font-family:Segoe UI,PingFang SC,Microsoft YaHei,sans-serif;font-weight:400;line-height:1.5}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0}button,input,select{font:inherit}button{cursor:pointer}input,select{border:1px solid var(--line);color:#eff8fb;background:#0b1e27e0;border-radius:14px;outline:none;width:100%;padding:.86rem .95rem;transition:border-color .2s,transform .2s}input:focus,select:focus{border-color:var(--accent);transform:translateY(-1px)}pre{white-space:pre-wrap;word-break:break-all;margin:0}#app{min-height:100vh}.shell{width:min(1440px,100% - 32px);margin:0 auto;padding:28px 0 40px}.hero-panel,.panel,.protocol-switch{border:1px solid var(--line);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);box-shadow:var(--shadow)}.hero-panel{background:linear-gradient(135deg, #59d0e31f, transparent 44%), linear-gradient(120deg, #ff9b541f, transparent 50%), var(--panel-strong);border-radius:28px;justify-content:space-between;gap:24px;padding:28px;display:flex}.eyebrow,.panel-kicker{text-transform:uppercase;letter-spacing:.2em;color:var(--accent);margin:0 0 6px;font-size:.75rem}h1,h2,p{margin:0}h1{letter-spacing:-.04em;font-size:clamp(2rem,4vw,4rem);line-height:.95}h2{font-size:1.28rem}.lead{max-width:64ch;color:var(--text-dim);margin-top:14px}.hero-badges{flex-wrap:wrap;justify-content:flex-end;align-items:flex-start;gap:10px;display:flex}.hero-badges span,.tag{border:1px solid var(--line-strong);color:#f3f8fb;background:#ffffff0a;border-radius:999px;padding:.45rem .8rem;font-size:.85rem}.protocol-switch{background:#061016b8;border-radius:22px;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:18px;padding:10px;display:grid}.protocol-chip{color:var(--text-dim);text-align:left;background:0 0;border:0;border-radius:16px;padding:1rem 1.2rem;transition:background .2s,color .2s,transform .2s}.protocol-chip.active{color:#031217;background:linear-gradient(135deg, var(--accent), #9ee7f1)}.protocol-chip:hover{transform:translateY(-1px)}.workspace{grid-template-columns:1.15fr 1.3fr;gap:18px;margin-top:18px;display:grid}.panel{background:var(--panel);border-radius:24px;padding:24px}.stack{flex-direction:column;gap:18px;display:flex}.panel-head{justify-content:space-between;align-items:flex-start;gap:14px;display:flex}.tag.ok{color:#07160e;background:var(--ok)}.tag.idle{color:var(--text-dim)}.template-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;display:grid}.template-card{text-align:left;border:1px solid var(--line);color:#e9f5f9;background:linear-gradient(#59d0e30f,#0000),#08181fe6;border-radius:18px;flex-direction:column;gap:8px;padding:16px;display:flex}.template-card span{color:var(--text-dim);font-size:.92rem}.template-card:hover{border-color:var(--accent)}.form-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;display:grid}.form-grid.compact{grid-template-columns:repeat(4,minmax(0,1fr))}label{flex-direction:column;gap:8px;display:flex}label span{color:var(--text-dim);font-size:.9rem}.wide{grid-column:1/-1}.metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.metric{border:1px solid var(--line);background:#051319c7;border-radius:18px;padding:14px}.metric span{color:var(--text-dim);margin-bottom:8px;font-size:.82rem;display:block}.metric strong{color:#f0fbff;word-break:break-word;font-size:.98rem;display:block}.code-blocks{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;display:grid}.code-card{background:#031018;border:1px solid #62bed72e;border-radius:20px;overflow:hidden}.code-head{border-bottom:1px solid #62bed729;justify-content:space-between;align-items:center;gap:12px;padding:14px 16px;display:flex}.code-head button,.action{color:#e8fbff;background:#59d0e324;border:0;border-radius:12px;padding:.72rem 1rem}.code-head button:hover,.action:hover{background:#59d0e338}.code-card pre{color:#8de8f7;min-height:118px;padding:16px;font-family:Consolas,SFMono-Regular,monospace}.breakdown{gap:10px;display:grid}.breakdown-row{border-bottom:1px dashed var(--line);justify-content:space-between;gap:16px;padding-bottom:10px;display:flex}.breakdown-row span{color:var(--text-dim);flex:0 0 120px}.breakdown-row strong{text-align:right;word-break:break-word}.support-note{color:#dff8e7;background:#7ce3a514;border-radius:16px;padding:12px 14px}.support-note.unsupported{color:#ffd9d9;background:#ff73731f}.toolbar{flex-wrap:wrap;gap:10px;display:flex}.action.primary{background:linear-gradient(135deg, var(--accent-2), #ffcd77);color:#251408}.action.muted{color:var(--text-dim);background:#ffffff0f}.action:disabled{opacity:.45;cursor:not-allowed}.log-list{gap:10px;display:grid}.log-item,.empty-state,.error-banner{border-radius:16px;padding:14px}.log-item{border:1px solid var(--line);background:#051419c7}.log-item.success{border-color:#7ce3a559}.log-item.error,.error-banner{background:#55131370;border:1px solid #ff737359}.log-meta{color:var(--text-dim);flex-wrap:wrap;gap:10px;margin-bottom:4px;display:flex}.empty-state{color:var(--text-dim);background:#ffffff0a}@media (width<=1100px){.workspace{grid-template-columns:1fr}.form-grid.compact,.code-blocks,.metrics{grid-template-columns:1fr 1fr}}@media (width<=760px){.shell{width:min(100% - 20px,1440px);padding-top:12px}.hero-panel,.panel{border-radius:20px;padding:18px}.hero-panel,.panel-head,.breakdown-row{flex-direction:column}.protocol-switch,.form-grid,.form-grid.compact,.template-grid,.code-blocks,.metrics{grid-template-columns:1fr}.toolbar{flex-direction:column}}