:root{
      --ink:#17213b;
      --muted:#6f7891;
      --line:rgba(98,112,156,.16);
      --glass:rgba(255,255,255,.62);
      --glass-strong:rgba(255,255,255,.82);
      --white:#fff;
      --blue:#5578ff;
      --blue-2:#7ba9ff;
      --purple:#8e70ff;
      --pink:#ff8db2;
      --mint:#64d8c3;
      --yellow:#ffc928;
      --shadow:0 28px 90px rgba(72,91,145,.22);
      --soft-shadow:0 12px 34px rgba(63,82,134,.12);
      --radius-xl:30px;
      --radius-lg:22px;
      --radius-md:16px;
    }
    *{box-sizing:border-box}
    html,body{height:100%;margin:0}
    body{
      font-family:Tahoma,"Segoe UI",Arial,sans-serif;
      color:var(--ink);
      overflow:hidden;
      background:
        radial-gradient(circle at 12% 16%, rgba(126,173,255,.45), transparent 28%),
        radial-gradient(circle at 89% 13%, rgba(255,203,83,.42), transparent 26%),
        radial-gradient(circle at 77% 84%, rgba(150,113,255,.28), transparent 29%),
        radial-gradient(circle at 18% 82%, rgba(98,222,199,.28), transparent 28%),
        linear-gradient(135deg,#f8fbff 0%,#eef5ff 50%,#fff8f2 100%);
    }
    button,input,textarea{font:inherit}
    button{cursor:pointer}
    .ambient{position:fixed;inset:0;pointer-events:none;overflow:hidden}
    .orb{position:absolute;border-radius:50%;filter:blur(2px);opacity:.55;animation:float 10s ease-in-out infinite}
    .orb.one{width:170px;height:170px;background:linear-gradient(135deg,#a9c9ff,#d7e8ff);top:7%;left:8%}
    .orb.two{width:120px;height:120px;background:linear-gradient(135deg,#ffe079,#fff0b8);top:12%;right:10%;animation-delay:-2s}
    .orb.three{width:230px;height:230px;background:linear-gradient(135deg,#d6c7ff,#f1eaff);bottom:4%;right:14%;animation-delay:-5s}
    @keyframes float{50%{transform:translateY(-18px) translateX(10px)}}

    .stage{height:100%;padding:26px;display:grid;place-items:center}
    .window{
      width:min(1580px,96vw);
      height:min(920px,94vh);
      border:1px solid rgba(255,255,255,.82);
      border-radius:34px;
      background:rgba(245,249,255,.44);
      backdrop-filter:blur(28px) saturate(145%);
      -webkit-backdrop-filter:blur(28px) saturate(145%);
      box-shadow:var(--shadow), inset 0 1px 0 rgba(255,255,255,.95);
      overflow:hidden;
      position:relative;
    }
    .titlebar{
      height:54px;
      display:grid;
      grid-template-columns:140px 1fr 140px;
      align-items:center;
      border-bottom:1px solid rgba(90,110,160,.10);
      background:rgba(255,255,255,.46);
      padding:0 18px;
      direction:ltr;
    }
    .traffic{display:flex;gap:9px;align-items:center}
    .dot{width:13px;height:13px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
    .dot.red{background:#ff5f57}.dot.yellow{background:#febc2e}.dot.green{background:#28c840}
    .address{
      justify-self:center;
      min-width:340px;
      height:34px;
      border-radius:12px;
      display:flex;
      align-items:center;
      justify-content:center;
      gap:8px;
      color:#66708a;
      background:rgba(255,255,255,.67);
      border:1px solid rgba(91,110,159,.1);
      box-shadow:inset 0 1px 0 rgba(255,255,255,.9);
      font-size:13px;
    }
    .secure{width:8px;height:10px;border:1.8px solid #7f89a1;border-radius:2px;position:relative}
    .secure:before{content:"";position:absolute;width:6px;height:5px;border:1.8px solid #7f89a1;border-bottom:0;border-radius:6px 6px 0 0;left:-1px;top:-6px}
    .top-actions{justify-self:end;display:flex;gap:7px}
    .mini-btn{width:30px;height:30px;border:0;border-radius:10px;background:rgba(255,255,255,.62);color:#7c86a0}

    .app{
      height:calc(100% - 54px);
      display:grid;
      grid-template-columns:286px minmax(0,1fr) 330px;
      direction:ltr;
    }
    .sidebar,.proposal{direction:rtl;background:rgba(255,255,255,.42);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
    .sidebar{border-right:1px solid var(--line);padding:20px 16px;display:flex;flex-direction:column;gap:16px}
    .brand{display:flex;align-items:center;gap:11px;padding:2px 6px 8px}
    .brand-mark{width:44px;height:44px;border-radius:14px;background:linear-gradient(135deg,#1f2a48,#0e162d);display:grid;place-items:center;box-shadow:0 10px 25px rgba(22,31,61,.18)}
    .brand-mark img{width:38px;height:38px;object-fit:contain}
    .brand-copy strong{display:block;font-size:15px}.brand-copy span{font-size:11px;color:var(--muted)}
    .new-chat{border:0;border-radius:16px;padding:13px 14px;background:linear-gradient(135deg,#5f7eff,#8d74ff);color:white;display:flex;align-items:center;justify-content:center;gap:9px;box-shadow:0 12px 24px rgba(102,119,255,.26);transition:.2s}
    .new-chat:hover{transform:translateY(-1px);box-shadow:0 16px 28px rgba(102,119,255,.34)}
    .side-label{font-size:11px;color:#8b94a9;padding:0 8px;margin-top:2px}
    .history{display:grid;gap:6px;overflow:auto;padding-inline:2px}
    .history-item{border:0;background:transparent;text-align:right;padding:11px 12px;border-radius:14px;color:#4e5871;display:grid;gap:4px;transition:.18s}
    .history-item:hover,.history-item.active{background:rgba(255,255,255,.72);box-shadow:0 7px 16px rgba(70,88,133,.07)}
    .history-item b{font-size:12px;font-weight:600}.history-item small{font-size:10px;color:#969eb0}
    .side-spacer{flex:1}
    .help-card{border:1px solid rgba(255,255,255,.9);border-radius:18px;padding:13px;background:linear-gradient(145deg,rgba(255,255,255,.72),rgba(243,247,255,.55));box-shadow:var(--soft-shadow)}
    .help-card b{font-size:12px}.help-card p{font-size:10.5px;line-height:1.8;color:var(--muted);margin:6px 0 10px}
    .help-card button{width:100%;border:0;border-radius:11px;padding:9px;background:#fff;color:#50617e;box-shadow:0 5px 15px rgba(70,88,133,.08)}
    .profile{display:flex;align-items:center;gap:10px;padding:10px 8px;border-radius:15px;background:rgba(255,255,255,.55)}
    .avatar{width:35px;height:35px;border-radius:12px;background:linear-gradient(135deg,#ffd665,#ff9f78);display:grid;place-items:center;font-weight:700;color:#fff;box-shadow:0 8px 18px rgba(255,166,88,.25)}
    .profile b{font-size:11px;display:block}.profile small{font-size:9px;color:var(--muted)}

    .chat{direction:rtl;display:grid;grid-template-rows:72px minmax(0,1fr) auto;background:rgba(250,252,255,.34);min-width:0}
    .chat-head{display:flex;align-items:center;justify-content:space-between;padding:0 24px;border-bottom:1px solid var(--line);background:rgba(255,255,255,.32);backdrop-filter:blur(16px);z-index:2}
    .agent{display:flex;align-items:center;gap:11px}
    .agent-avatar{width:42px;height:42px;border-radius:15px;display:grid;place-items:center;background:linear-gradient(145deg,#e8edff,#fff);border:1px solid rgba(255,255,255,.9);box-shadow:0 8px 20px rgba(75,92,135,.11);font-size:19px;position:relative}
    .agent-avatar:after{content:"";position:absolute;width:9px;height:9px;border-radius:50%;background:#4bd29f;border:2px solid white;bottom:-1px;left:-1px}
    .agent strong{display:block;font-size:13px}.agent small{font-size:10px;color:#6f7891}
    .head-actions{display:flex;gap:8px}
    .glass-btn{height:38px;border:1px solid rgba(255,255,255,.9);background:rgba(255,255,255,.56);border-radius:13px;color:#59657e;padding:0 13px;box-shadow:0 6px 16px rgba(73,90,133,.07);transition:.18s}
    .glass-btn:hover{background:#fff;transform:translateY(-1px)}
    .icon-only{width:38px;padding:0;display:grid;place-items:center}

    .messages{overflow:auto;padding:26px 8% 18px;scroll-behavior:smooth}
    .day{text-align:center;color:#9ba3b6;font-size:10px;margin:0 0 20px}
    .msg-row{display:flex;align-items:flex-end;gap:9px;margin-bottom:14px;direction:rtl}
    .msg-row.user{justify-content:flex-start;direction:ltr}
    .msg-avatar{width:29px;height:29px;border-radius:10px;background:#fff;display:grid;place-items:center;box-shadow:0 5px 12px rgba(68,85,129,.09);font-size:13px;flex:0 0 auto}
    .bubble{max-width:min(720px,82%);padding:14px 16px;border-radius:19px;line-height:1.9;font-size:12.5px;box-shadow:0 8px 21px rgba(58,75,119,.08);border:1px solid rgba(255,255,255,.72)}
    .assistant .bubble{background:rgba(255,255,255,.73);border-bottom-right-radius:6px}
    .user .bubble{background:linear-gradient(135deg,#607fff,#846fff);color:white;border-bottom-left-radius:6px;box-shadow:0 12px 26px rgba(103,116,255,.22)}
    .bubble strong{font-size:13px}
    .bubble p{margin:5px 0}
    .quick-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;margin-top:13px}
    .quick{border:1px solid rgba(95,113,164,.12);background:rgba(248,250,255,.75);border-radius:14px;padding:11px 8px;text-align:center;color:#4d5a78;transition:.18s}
    .quick:hover{transform:translateY(-2px);background:white;box-shadow:0 8px 18px rgba(74,89,132,.09)}
    .quick span{display:block;font-size:20px;margin-bottom:6px}.quick b{font-size:10.5px}
    .brief{margin-top:13px;border-radius:16px;padding:12px;background:linear-gradient(135deg,rgba(239,244,255,.9),rgba(255,255,255,.88));border:1px solid rgba(102,123,183,.11)}
    .brief-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
    .brief-head b{font-size:11px}.tag{font-size:9px;padding:5px 8px;border-radius:999px;background:rgba(94,214,184,.18);color:#269477}
    .brief-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
    .brief-item{background:rgba(255,255,255,.74);border-radius:11px;padding:8px}.brief-item small{display:block;color:#8b94a9;font-size:8px;margin-bottom:3px}.brief-item b{font-size:10px}
    .section-title{display:flex;align-items:center;justify-content:space-between;margin:12px 0 8px}.section-title b{font-size:11px}.section-title small{font-size:9px;color:#8b94a9}
    .service-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
    .service-card{border-radius:16px;overflow:hidden;background:rgba(255,255,255,.82);border:1px solid rgba(255,255,255,.95);box-shadow:0 10px 24px rgba(68,84,128,.08)}
    .service-visual{height:86px;display:flex;align-items:center;justify-content:center;font-size:37px;position:relative;overflow:hidden}
    .service-visual:before{content:"";position:absolute;width:75px;height:75px;border-radius:50%;background:rgba(255,255,255,.52);filter:blur(.5px)}
    .service-visual span{position:relative;filter:drop-shadow(0 8px 12px rgba(60,70,100,.15))}
    .v1{background:linear-gradient(135deg,#d8e5ff,#f5f8ff)}.v2{background:linear-gradient(135deg,#fff1bd,#fff9e7)}.v3{background:linear-gradient(135deg,#d5f8ef,#f1fffb)}
    .service-body{padding:10px}.service-body b{display:block;font-size:10.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.service-body small{font-size:8.5px;color:#8f98aa;display:block;margin:4px 0 9px}
    .service-foot{display:flex;align-items:center;justify-content:space-between}.price{font-size:10px;font-weight:700;color:#52607b}.add{width:29px;height:29px;border:0;border-radius:10px;background:#eef2ff;color:#5f75e8;font-size:17px;transition:.18s}.add.active{background:#5f7cff;color:white;transform:rotate(45deg)}
    .typing{display:none;align-items:center;gap:4px;height:10px}.typing.show{display:flex}.typing i{width:5px;height:5px;border-radius:50%;background:#9aa4b7;animation:bounce 1s infinite}.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}@keyframes bounce{50%{transform:translateY(-4px)}}

    .composer-wrap{padding:13px 6% 18px;background:linear-gradient(180deg,transparent,rgba(245,249,255,.82) 34%)}
    .composer{min-height:58px;border-radius:19px;background:rgba(255,255,255,.78);border:1px solid rgba(255,255,255,.95);box-shadow:0 13px 34px rgba(65,84,130,.13),inset 0 1px 0 white;display:grid;grid-template-columns:auto 1fr auto;align-items:end;gap:8px;padding:9px 10px;backdrop-filter:blur(20px)}
    .composer textarea{resize:none;border:0;background:transparent;outline:0;min-height:38px;max-height:120px;padding:10px 6px;line-height:1.7;color:#35405d;font-size:12px}
    .composer textarea::placeholder{color:#a1a9ba}
    .attach,.send{width:39px;height:39px;border:0;border-radius:13px;display:grid;place-items:center}
    .attach{background:#f2f5fb;color:#7d879f}.send{background:linear-gradient(135deg,#5578ff,#9272ff);color:white;box-shadow:0 9px 18px rgba(100,116,255,.25);font-size:17px}
    .composer-note{text-align:center;color:#a2a9b7;font-size:8.5px;margin-top:7px}

    .proposal{border-left:1px solid var(--line);padding:20px 17px;overflow:auto}
    .proposal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:15px}
    .proposal-head b{font-size:13px}.proposal-head span{font-size:9px;color:#65718d;background:rgba(255,255,255,.72);padding:6px 9px;border-radius:10px}
    .event-card{border-radius:19px;padding:14px;background:linear-gradient(145deg,rgba(255,255,255,.84),rgba(245,248,255,.65));border:1px solid rgba(255,255,255,.92);box-shadow:var(--soft-shadow)}
    .event-top{display:flex;align-items:center;gap:10px}.event-icon{width:39px;height:39px;border-radius:13px;background:linear-gradient(135deg,#ffda69,#ffb875);display:grid;place-items:center;font-size:19px}.event-top b{font-size:11px;display:block}.event-top small{font-size:8.5px;color:#8d96aa}
    .progress{height:7px;background:#edf0f7;border-radius:99px;margin:14px 0 8px;overflow:hidden}.progress span{display:block;width:68%;height:100%;border-radius:inherit;background:linear-gradient(90deg,#65d7c1,#6f89ff)}
    .progress-copy{display:flex;justify-content:space-between;font-size:8.5px;color:#8b94a6}
    .panel-title{display:flex;justify-content:space-between;align-items:center;margin:18px 2px 10px}.panel-title b{font-size:11px}.panel-title button{border:0;background:transparent;color:#6579da;font-size:9px}
    .selected{display:grid;gap:8px}
    .selected-item{display:grid;grid-template-columns:38px 1fr auto;align-items:center;gap:8px;padding:8px;border-radius:14px;background:rgba(255,255,255,.67);border:1px solid rgba(255,255,255,.82)}
    .selected-thumb{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:#eef3ff}.selected-item b{font-size:9.5px;display:block}.selected-item small{font-size:8px;color:#9099ab}.remove{border:0;background:#f8eef1;color:#d76c80;width:25px;height:25px;border-radius:8px}
    .empty{text-align:center;padding:18px 8px;border:1px dashed rgba(91,112,160,.2);border-radius:15px;color:#8b94a8;font-size:9.5px;background:rgba(255,255,255,.35)}
    .summary{margin-top:16px;padding:14px;border-radius:17px;background:rgba(255,255,255,.67);border:1px solid rgba(255,255,255,.9)}
    .sum-row{display:flex;align-items:center;justify-content:space-between;font-size:9.5px;color:#6f7890;margin-bottom:9px}.sum-row.total{border-top:1px dashed rgba(95,112,155,.17);padding-top:11px;margin:10px 0 0;color:#26324e;font-weight:700;font-size:11px}
    .primary{width:100%;border:0;border-radius:14px;padding:12px;margin-top:12px;color:#fff;background:linear-gradient(135deg,#5b7cff,#8b72ff);box-shadow:0 11px 24px rgba(104,116,255,.25)}
    .secondary{width:100%;border:1px solid rgba(94,113,163,.11);border-radius:14px;padding:11px;margin-top:8px;color:#56637d;background:rgba(255,255,255,.67)}
    .trust{display:flex;align-items:center;justify-content:center;gap:6px;color:#9199aa;font-size:8px;margin-top:12px}

    .mobile-fab{display:none;position:fixed;bottom:22px;left:22px;width:48px;height:48px;border:0;border-radius:15px;color:white;background:linear-gradient(135deg,#5678ff,#8d72ff);z-index:20;box-shadow:0 14px 28px rgba(94,111,255,.35)}
    .toast{position:fixed;left:50%;bottom:34px;transform:translate(-50%,20px);opacity:0;pointer-events:none;background:rgba(24,32,56,.88);color:#fff;padding:10px 14px;border-radius:12px;font-size:11px;backdrop-filter:blur(12px);transition:.25s;z-index:50}.toast.show{opacity:1;transform:translate(-50%,0)}
    .modal-back{position:fixed;inset:0;background:rgba(40,50,80,.2);backdrop-filter:blur(8px);display:none;place-items:center;z-index:40}.modal-back.show{display:grid}.modal{width:min(440px,90vw);border-radius:24px;padding:22px;background:rgba(255,255,255,.88);border:1px solid white;box-shadow:0 30px 90px rgba(45,59,99,.25);text-align:center}.modal .big{font-size:40px}.modal h3{margin:8px 0}.modal p{font-size:11px;color:#717b92;line-height:1.9}.modal button{border:0;border-radius:12px;padding:10px 18px;background:#5d7cff;color:#fff}

    @media(max-width:1180px){
      .app{grid-template-columns:260px minmax(0,1fr)}
      .proposal{position:absolute;right:0;left:auto;top:54px;bottom:0;width:330px;z-index:15;transform:translateX(104%);transition:.25s;box-shadow:-18px 0 50px rgba(55,69,108,.15)}
      .proposal.open{transform:translateX(0)}
      .mobile-fab{display:block}
    }
    @media(max-width:820px){
      .stage{padding:0}.window{width:100vw;height:100vh;border-radius:0;border:0}.titlebar{height:47px;grid-template-columns:80px 1fr 80px;padding:0 12px}.address{min-width:0;width:100%;font-size:11px}.top-actions{display:none}.app{height:calc(100% - 47px);grid-template-columns:1fr}.sidebar{position:absolute;right:0;top:47px;bottom:0;width:275px;z-index:18;transform:translateX(104%);transition:.25s;box-shadow:-18px 0 50px rgba(55,69,108,.15)}.sidebar.open{transform:translateX(0)}
      .chat-head{padding:0 14px}.messages{padding:20px 14px 14px}.quick-grid{grid-template-columns:repeat(2,1fr)}.service-grid{grid-template-columns:1fr}.service-visual{height:72px}.brief-grid{grid-template-columns:1fr 1fr}.head-actions .wide{display:none}.bubble{max-width:92%}.composer-wrap{padding:10px 12px 14px}.mobile-fab{bottom:78px;left:15px}
    }

/* Runtime additions */
.hidden{display:none!important}.auth-overlay{position:fixed;inset:0;background:rgba(25,35,65,.28);backdrop-filter:blur(12px);z-index:120;display:grid;place-items:center;padding:18px}.auth-card{width:min(460px,100%);background:rgba(255,255,255,.93);border:1px solid rgba(255,255,255,.95);box-shadow:0 30px 90px rgba(45,55,95,.25);border-radius:28px;padding:24px}.auth-card h3{margin:0 0 7px}.auth-card p{color:var(--muted);font-size:12px;line-height:1.9}.auth-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.auth-grid input,.auth-grid select{width:100%;border:1px solid var(--line);border-radius:13px;padding:11px;background:#fff;outline:none}.auth-grid .full{grid-column:span 2}.auth-actions{display:flex;gap:8px;margin-top:14px}.auth-actions button{flex:1;border:0;border-radius:13px;padding:11px;font-weight:800}.auth-actions .save-contact{background:linear-gradient(135deg,var(--primary),var(--primary2));color:#fff}.auth-actions .skip-contact{background:#f0f3f8;color:var(--text)}.dynamic-service-image{width:100%;height:100%;object-fit:cover;border-radius:inherit}.bubble .service-grid{margin-top:14px}.system-note{align-self:center;padding:7px 12px;border-radius:99px;background:rgba(255,255,255,.7);border:1px solid var(--line);font-size:10px;color:var(--muted)}.offline-badge{color:#b16c00!important}.proposal-link{display:block;text-decoration:none;text-align:center}.consent{font-size:9px;color:var(--muted);line-height:1.8;margin-top:10px}.contact-mini{font-size:10px;color:var(--muted);padding:8px 10px;background:rgba(255,255,255,.55);border-radius:12px;margin-top:8px}@media(max-width:600px){.auth-grid{grid-template-columns:1fr}.auth-grid .full{grid-column:auto}}

/* v1.2 customer-flow additions */
.form-hint{margin-top:14px;padding:12px;border:1px solid rgba(95,113,164,.13);background:rgba(247,250,255,.78);border-radius:15px;display:flex;align-items:center;justify-content:space-between;gap:12px}.form-hint b{display:block;font-size:11px}.form-hint small{display:block;color:var(--muted);font-size:9px;margin-top:3px}.form-hint button{border:0;border-radius:11px;padding:9px 12px;background:linear-gradient(135deg,#607fff,#8b73ff);color:#fff;font-weight:700;white-space:nowrap}.auth-brand{display:flex;align-items:center;gap:12px;margin-bottom:14px}.auth-brand img{width:54px;height:54px;object-fit:contain;border-radius:17px;background:#16203d;padding:5px}.auth-brand h3,.auth-brand p{margin:0}.auth-grid.single{grid-template-columns:1fr}.auth-primary{width:100%;border:0;border-radius:14px;padding:12px;margin-top:12px;background:linear-gradient(135deg,#607fff,#8b73ff);color:#fff;font-weight:800;box-shadow:0 10px 24px rgba(95,115,255,.2)}.auth-primary:disabled{opacity:.55}.auth-link{width:100%;border:0;background:transparent;color:#6573a2;margin-top:10px}.otp-input{width:100%;border:1px solid var(--line);border-radius:15px;padding:14px;text-align:center;direction:ltr;letter-spacing:8px;font-size:22px;outline:none}.form-card{width:min(720px,100%)}.dynamic-form{display:grid;grid-template-columns:1fr 1fr;gap:10px;max-height:58vh;overflow:auto;padding:2px}.dynamic-field{display:grid;gap:6px;font-size:10px;font-weight:700}.dynamic-field.full{grid-column:1/-1}.dynamic-field input,.dynamic-field select,.dynamic-field textarea{width:100%;border:1px solid var(--line);border-radius:13px;padding:11px;background:#fff;outline:none;font:inherit}.remove-selected{margin-right:auto;width:25px;height:25px;border:0;border-radius:9px;background:#f1f3f8;color:#7b849a}.welcome-message .bubble{max-width:min(760px,88%)}
@media(max-width:700px){.form-hint{align-items:stretch;flex-direction:column}.dynamic-form{grid-template-columns:1fr}.dynamic-field.full{grid-column:auto}}