:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg:#f8fafc;--surface:#ffffffeb;--surface-strong:#fff;--surface-border:#94a3b859;--text:#0f172a;--muted:#64748b;--accent:#4fd1c5;--accent-strong:#38b2ac;--success:#16a34a;--danger:#dc2626;--shadow:0 18px 32px #0f172a1f;--font:"Segoe UI", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;--transition:.18s ease}*{box-sizing:border-box}body{background:var(--bg);min-height:100vh;color:var(--text);font-family:var(--font);margin:0;padding:16px;position:relative;overflow:hidden auto}body:before,body:after{content:"";pointer-events:none;z-index:0;position:fixed;inset:-30%}body:before{opacity:.68;background-image:radial-gradient(circle at 1px 1px,#4fd1c52e 1px,#0000 1.6px),linear-gradient(120deg,#4fd1c533 0 1px,#0000 1px),linear-gradient(0deg,#4fd1c51f 0 1px,#0000 1px),linear-gradient(90deg,#4fd1c51f 0 1px,#0000 1px);background-size:28px 28px,260px 260px,80px 80px,80px 80px;animation:22s linear infinite grid-drift}body:after{opacity:.85;background-image:radial-gradient(circle at 20% 20%,#4fd1c552,#0000 40%),radial-gradient(circle at 80% 30%,#38b2ac42,#0000 45%),radial-gradient(circle at 50% 80%,#4fd1c538,#0000 50%);animation:18s ease-in-out infinite glow-shift}a{color:var(--accent)}.app{z-index:1;position:relative}.app-shell{background:var(--surface);border:1px solid var(--surface-border);box-shadow:var(--shadow);border-radius:18px;flex-direction:column;gap:12px;padding:16px;animation:.32s shell-in;display:flex;position:relative;overflow:hidden}.app-shell:before{content:"";opacity:.3;pointer-events:none;background:linear-gradient(130deg,#4fd1c529,#0000 55%);position:absolute;inset:0}.header{z-index:1;flex-direction:column;align-items:center;gap:8px;display:flex;position:relative}.brand{justify-content:center;align-items:center;display:flex}.brand-logo{width:88px;height:auto;display:block}.subtitle{color:var(--muted);text-align:center;margin:0;font-size:13px}.demo-banner{color:var(--muted);z-index:1;background:#94a3b81a;border:1px dashed #94a3b899;border-radius:10px;margin:0;padding:8px 12px;font-size:12px;position:relative}.connection{color:var(--muted);background:#ffffffbf;border:1px solid #94a3b866;border-radius:999px;flex-shrink:0;align-items:center;gap:8px;max-width:100%;padding:5px 12px;font-size:12px;font-weight:600;display:inline-flex}.connection-dot{background:#94a3b8;border-radius:999px;flex-shrink:0;width:8px;height:8px}.connection-label{white-space:nowrap}.connection.connected{color:var(--success);background:#16a34a1f;border-color:#16a34a4d}.connection.connected .connection-dot{background:var(--success);box-shadow:0 0 0 3px #16a34a29}.connection.disconnected{color:var(--danger);background:#dc26261f;border-color:#dc262659}.connection.disconnected .connection-dot{background:var(--danger)}.connection.mismatch{color:var(--danger);background:#dc26261f;border-color:#dc262659}.connection.mismatch .connection-dot{background:var(--danger)}.connection-detail{text-overflow:ellipsis;white-space:nowrap;max-width:100%;color:var(--muted);text-align:center;margin:0;font-size:11px;overflow:hidden}.mismatch-banner{color:var(--danger);background:#dc262614;border-color:#dc262673}.connection.connecting{color:var(--muted);background:#94a3b81f;border-color:#94a3b866}.connection.connecting .connection-dot{background:#94a3b8;animation:1.2s ease-in-out infinite connection-pulse}@keyframes connection-pulse{0%,to{opacity:.35}50%{opacity:1}}.connection-retry{color:inherit;font:inherit;white-space:nowrap;cursor:pointer;opacity:.85;transition:opacity var(--transition);background:0 0;border:0;border-left:1px solid #0f172a29;border-radius:0;margin-left:2px;padding:0 0 0 9px;font-weight:600;text-decoration:none}.connection-retry:hover{opacity:1;text-decoration:underline}.card{background:var(--surface-strong);border:1px solid var(--surface-border);z-index:1;border-radius:14px;flex-direction:column;gap:10px;padding:12px;display:flex;position:relative}.summary-card{gap:12px}.summary-title{color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-size:13px}.summary-details{white-space:pre-wrap;flex-direction:column;gap:2px;margin-top:4px;display:flex}.summary-detail{color:var(--text);flex-wrap:wrap;gap:4px;font-size:12px;line-height:1.35;display:flex}.summary-detail-label{font-weight:600}.summary-detail-value{font-weight:400}.summary-detail-date .summary-detail-value{color:var(--muted)}.summary-actions{justify-content:center;display:flex}.summary-button{padding:6px 10px;font-size:12px}.button{cursor:pointer;transition:transform var(--transition), box-shadow var(--transition);border:none;border-radius:12px;padding:10px 14px;font-size:14px}.button:disabled{cursor:not-allowed;opacity:.6}.button.primary{color:#fff;background:linear-gradient(130deg,#4fd1c5,#38b2ac);box-shadow:0 10px 18px #38b2ac40}.button.primary:hover:not(:disabled){transform:translateY(-1px)}.button.ghost{color:#0f766e;background:#4fd1c514;border:1px solid #4fd1c559}.button.ghost:hover:not(:disabled){transform:translateY(-1px)}.panel{z-index:1;background:#f8fafcf2;border:1px solid #94a3b859;border-radius:14px;flex-direction:column;gap:10px;padding:12px;animation:.22s panel-in;display:flex;position:relative}.panel-toggle{background:#4fd1c514;border:1px solid #4fd1c533;border-radius:12px;gap:8px;padding:6px;display:flex}.toggle-button{transition:background var(--transition), color var(--transition), box-shadow var(--transition);border-radius:10px;flex:1;padding:8px 10px;font-size:12px}.toggle-button.is-active{color:#fff;background:linear-gradient(130deg,#4fd1c5,#38b2ac);border-color:#0000;box-shadow:0 10px 16px #38b2ac33}.panel-section{flex-direction:column;gap:10px;display:flex}.panel-title{color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-size:13px}.input-label{color:var(--muted);font-size:12px}.input{width:100%;color:var(--text);background:#f8fafcf2;border:1px solid #94a3b866;border-radius:10px;outline:none;padding:10px 12px;font-size:14px}.input:focus{border-color:#4fd1c5e6}.input-with-action{align-items:flex-start;gap:6px;display:flex}.input-with-action .input{flex:1;min-width:0}.input-with-action .suggest-button{margin-top:4px}.input-multiline{resize:none;font-family:inherit;line-height:1.4;overflow:hidden}.suggest-button{width:32px;height:32px;color:var(--accent-strong);cursor:pointer;transition:transform var(--transition), background var(--transition), border-color var(--transition);background:#4fd1c514;border:1px solid #4fd1c559;border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;font-size:14px;display:flex}.suggest-button:hover:not(:disabled){background:#4fd1c52e;border-color:#4fd1c599;transform:translateY(-1px)}.suggest-button:disabled{cursor:not-allowed;opacity:.5}.panel-actions{gap:10px;display:flex}.panel-actions .button{flex:1}.dropdown{background:#f8fafcf2;border:1px solid #94a3b84d;border-radius:12px;flex-direction:column;gap:4px;height:160px;min-height:160px;max-height:160px;padding:6px;display:flex;overflow-y:auto}.dropdown-item{color:var(--text);text-align:left;cursor:pointer;background:0 0;border:1px solid #0000;border-radius:8px;padding:8px 10px;font-size:13px;line-height:1.35}.dropdown-item:hover,.dropdown-item:focus-visible{background:#4fd1c51f;border-color:#4fd1c573}.dropdown-item.is-selected{background:#4fd1c533;border-color:#38b2ac80}.dropdown-empty{color:var(--muted);padding:8px 10px;font-size:12px}.result{min-height:18px;color:var(--text);z-index:1;font-size:13px;position:relative}.result.error{color:var(--danger)}.result.success{color:var(--success)}.result.info{color:var(--accent)}.panel-hint{color:var(--muted);margin:8px 0 0;font-size:12px}.dropdown-retry,.dropdown-more{padding:4px 8px;font-size:12px}.dropdown-more{width:100%}.summary-analysis{background:#4fd1c514;border:1px solid #4fd1c540;border-radius:8px;margin-top:10px;padding:10px 12px}.summary-analysis-label{letter-spacing:.08em;text-transform:uppercase;color:var(--accent-strong);margin-bottom:4px;font-size:11px;font-weight:600}.summary-analysis-text{color:var(--text);margin:0;font-size:13px;line-height:1.45}.summary-analysis-error{color:var(--danger);margin:6px 0 0;font-size:12px}.suggest-button.is-busy svg{animation:1.2s linear infinite suggest-spin}@keyframes suggest-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes grid-drift{0%{transform:translate(-4%,-4%)}50%{transform:translate(4%,6%)}to{transform:translate(-4%,-4%)}}@keyframes glow-shift{0%{transform:translate(0,0)}50%{transform:translate(3%,-2%)}to{transform:translate(0,0)}}@keyframes shell-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes panel-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
