:root{--bg: #0A0D12;--bg-2: #0E131A;--surface: rgba(18, 24, 32, .78);--surface-2: rgba(28, 36, 48, .62);--glass-border: rgba(255, 255, 255, .06);--glass-border-strong: rgba(255, 255, 255, .12);--ink: #F2F5F8;--ink-dim: rgba(242, 245, 248, .62);--ink-faint: rgba(242, 245, 248, .38);--cyan: #62D0FF;--violet: #8B7CFF;--emerald: #3DD9B4;--amber: #FFB547;--r-card: 20px;--r-node: 22px;--r-pill: 999px;--serif: Georgia, "Times New Roman", serif;--sans: system-ui, "Segoe UI", -apple-system, BlinkMacSystemFont, sans-serif}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased;overflow:hidden}button{font-family:inherit}.tabular{font-variant-numeric:tabular-nums}.serif{font-family:var(--serif);font-weight:400}.app{display:grid;grid-template-columns:56px 1fr 380px;grid-template-rows:56px 1fr;grid-template-areas:"rail topbar topbar" "rail canvas chat";height:100vh;background:radial-gradient(1200px 700px at 20% 0%,rgba(139,124,255,.07),transparent 60%),radial-gradient(900px 600px at 80% 100%,rgba(98,208,255,.05),transparent 60%),var(--bg)}.rail{grid-area:rail;border-right:1px solid var(--glass-border);display:flex;flex-direction:column;align-items:center;padding:16px 0;gap:18px}.rail .logo{width:28px;height:28px;border-radius:8px;background:linear-gradient(135deg,var(--cyan),var(--violet));display:grid;place-items:center;color:#06090d;font-weight:700;font-size:14px}.rail .icon{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;color:var(--ink-dim);cursor:pointer;font-size:13px}.rail .icon:hover{color:var(--ink);background:var(--surface-2)}.topbar{grid-area:topbar;border-bottom:1px solid var(--glass-border);display:flex;align-items:center;justify-content:space-between;padding:0 24px}.topbar .title{font-family:var(--serif);font-size:18px;letter-spacing:.2px}.topbar .crumbs{color:var(--ink-faint);font-size:12px;letter-spacing:.04em;text-transform:uppercase}.topbar .right{display:flex;align-items:center;gap:12px;font-size:12px;color:var(--ink-dim)}.dot{width:6px;height:6px;border-radius:50%;background:var(--emerald)}.canvas-area{grid-area:canvas;position:relative;overflow:hidden;min-height:0}.canvas-area>div:first-of-type{position:absolute;top:0;right:0;bottom:0;left:0}.canvas-area canvas{width:100%!important;height:100%!important;display:block}.chips-rail{position:absolute;left:24px;right:24px;bottom:24px;display:flex;align-items:center;gap:10px;padding:10px 14px;background:var(--surface);border:1px solid var(--glass-border);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:var(--r-pill);overflow-x:auto;z-index:6}.chips-rail .label{font-size:11px;color:var(--ink-faint);letter-spacing:.08em;text-transform:uppercase;padding-right:8px;border-right:1px solid var(--glass-border);margin-right:4px;white-space:nowrap}.chip{display:inline-flex;align-items:center;gap:8px;padding:6px 12px 6px 6px;border-radius:var(--r-pill);background:var(--surface-2);border:1px solid var(--glass-border);color:var(--ink);font-size:12px;cursor:grab;-webkit-user-select:none;user-select:none;white-space:nowrap;transition:transform .18s ease-out,border-color .18s ease-out}.chip:hover{transform:translateY(-1px);border-color:var(--glass-border-strong)}.chip:active{cursor:grabbing}.chip .swatch{width:22px;height:22px;border-radius:50%;border:1px solid rgba(0,0,0,.35);box-shadow:inset 0 0 0 1px #ffffff0a}.chip .price{color:var(--ink-dim);font-size:11px;margin-left:2px}.hint{position:absolute;top:16px;left:50%;transform:translate(-50%);padding:6px 12px;background:var(--surface);border:1px solid var(--glass-border);border-radius:var(--r-pill);color:var(--ink-dim);font-size:11px;letter-spacing:.04em;pointer-events:none;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);z-index:5}.price-card{position:absolute;right:24px;bottom:92px;width:360px;background:var(--surface);border:1px solid var(--glass-border);border-radius:var(--r-card);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);padding:16px 16px 14px;z-index:7;box-shadow:0 24px 60px #00000059}.price-card .head{display:flex;justify-content:space-between;align-items:baseline;font-size:11px;color:var(--ink-faint);letter-spacing:.08em;text-transform:uppercase;margin-bottom:10px}.price-card .head .freshness{color:var(--emerald)}.line{padding:10px 0;border-top:1px solid var(--glass-border)}.line:first-of-type{border-top:0;padding-top:4px}.line .row1{display:flex;justify-content:space-between;gap:12px;font-size:13px}.line .row1 .qty{color:var(--ink-dim);font-size:11px;margin-left:6px}.line .row1 .amt{font-variant-numeric:tabular-nums;color:var(--ink)}.line .row2{margin-top:4px;font-size:11px;color:var(--ink-faint)}.line .row2 .src-dot{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--emerald);margin:0 6px 1px 0;vertical-align:middle}.line.estimated .row2 .src-dot{background:var(--amber)}.total{margin-top:12px;padding-top:12px;border-top:1px solid var(--glass-border-strong);display:flex;justify-content:space-between;align-items:baseline}.total .label{font-size:11px;color:var(--ink-dim);letter-spacing:.08em;text-transform:uppercase}.total .val{font-family:var(--serif);font-size:28px;font-variant-numeric:tabular-nums}.total .delta{font-size:11px;color:var(--emerald);margin-left:6px}.cta{margin-top:12px;width:100%;padding:10px 14px;background:linear-gradient(180deg,#62d0ff2e,#62d0ff0f);border:1px solid rgba(98,208,255,.35);color:var(--ink);border-radius:12px;font-size:13px;cursor:pointer;transition:filter .2s ease-out,transform .2s ease-out}.cta:hover{filter:brightness(1.1)}.cta.pulse{animation:pulse 1.6s ease-in-out infinite}@keyframes pulse{0%,to{box-shadow:0 0 #62d0ff00}50%{box-shadow:0 0 0 8px #62d0ff0f}}.team-comments{position:absolute;top:16px;right:24px;width:320px;background:var(--surface);border:1px solid var(--glass-border);border-radius:14px;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);padding:10px 12px;display:flex;gap:10px;z-index:5;font-size:12px;color:var(--ink-dim)}.team-comments .avatar{width:24px;height:24px;border-radius:50%;background:linear-gradient(135deg,var(--violet),var(--cyan));display:grid;place-items:center;font-size:11px;color:#06090d;font-weight:600;flex-shrink:0}.team-comments .who{color:var(--ink);font-weight:500;font-size:11px}.team-comments .body{color:var(--ink-dim);line-height:1.4;margin-top:1px}.chat{grid-area:chat;border-left:1px solid var(--glass-border);display:flex;flex-direction:column;background:linear-gradient(180deg,rgba(255,255,255,.01),transparent)}.chat .head{padding:14px 18px;border-bottom:1px solid var(--glass-border);display:flex;align-items:center;gap:10px}.chat .head .avatar{width:26px;height:26px;border-radius:8px;background:linear-gradient(135deg,var(--cyan),var(--violet));display:grid;place-items:center;font-size:11px;color:#06090d;font-weight:700}.chat .head .who{font-size:13px}.chat .head .meta{font-size:11px;color:var(--ink-faint)}.chat .stream{flex:1;min-height:0;overflow-y:auto;padding:16px 18px;display:flex;flex-direction:column;gap:14px}.bubble{max-width:90%;padding:10px 12px;border-radius:14px;font-size:13px;line-height:1.5}.bubble.ai{background:var(--surface-2);border:1px solid var(--glass-border);align-self:flex-start;color:var(--ink)}.bubble.user{background:#62d0ff1a;border:1px solid rgba(98,208,255,.18);align-self:flex-end;color:var(--ink)}.bubble .typing-dot{display:inline-block;width:6px;height:6px;background:var(--ink-dim);border-radius:50%;margin-right:4px;animation:bounce 1.2s infinite ease-in-out}.bubble .typing-dot:nth-child(2){animation-delay:.15s}.bubble .typing-dot:nth-child(3){animation-delay:.3s}@keyframes bounce{0%,80%,to{transform:translateY(0);opacity:.4}40%{transform:translateY(-3px);opacity:1}}.composer{border-top:1px solid var(--glass-border);padding:12px;display:flex;gap:8px}.composer input{flex:1;background:var(--surface-2);border:1px solid var(--glass-border);border-radius:10px;padding:10px 12px;color:var(--ink);font-size:13px;outline:none}.composer input:focus{border-color:#62d0ff66}.composer button{background:var(--cyan);border:0;color:#06090d;padding:0 14px;border-radius:10px;font-size:13px;font-weight:600;cursor:pointer}.composer button:disabled{opacity:.4;cursor:not-allowed}.drop-hover{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:radial-gradient(600px 400px at var(--mx, 50%) var(--my, 50%),rgba(98,208,255,.08),transparent 60%);opacity:0;transition:opacity .2s ease-out;z-index:4}.drop-hover.active{opacity:1}