/* Melissa Precision — shared visual layer for widget + full page */
:root{
  --precision-accent:#7046d8;
  --precision-accent-dark:#5530b2;
  --precision-surface:#ffffff;
  --precision-canvas:#f4f6f9;
  --precision-line:#e3e8ef;
  --precision-ink:#142033;
  --precision-muted:#6f7d91;
}

/* clean, light-gray application shell */
#mf-panel{background:var(--precision-canvas);color:var(--precision-ink);}
.mf-head{background:#fff;color:var(--precision-ink);border-bottom:1px solid var(--precision-line);box-shadow:0 1px 8px rgba(15,23,42,.06);}
.mf-head-info strong,.mf-logo-txt{color:var(--precision-ink);}
.mf-head-info #mf-status{color:var(--precision-muted);}
.mf-head-info #mf-status::before{background:#22c55e;}
.mf-hbtn,.mf-back{background:transparent;color:var(--precision-muted);border:1px solid transparent;}
.mf-hbtn:hover,.mf-back:hover{background:#f1effd;color:var(--precision-accent);border-color:#ddd5f7;}

/* premium compact navigation */
.mf-quick,.mf-quick-chips{background:#fff;border-bottom:1px solid var(--precision-line);}
.mf-qbtn,.mf-chip{background:#faf9ff;color:var(--precision-accent);border-color:#ddd5f7;box-shadow:0 1px 2px rgba(15,23,42,.02);}
.mf-qbtn:hover,.mf-chip:hover{background:#f1effd;border-color:#b9a8ee;color:var(--precision-accent-dark);}

/* slim mathematical graph paper feed */
#mf-msgs,.mf-msgs{
  background-color:#f8f9fc;
  background-image:
    linear-gradient(rgba(112,70,216,.075) 1px,transparent 1px),
    linear-gradient(90deg,rgba(112,70,216,.075) 1px,transparent 1px);
  background-size:22px 22px;
  scrollbar-color:rgba(112,70,216,.22) transparent;
}
#mf-msgs.bg-solid,.mf-msgs.bg-solid{background:#f4f6f9;background-image:none;}
#mf-msgs.bg-light,.mf-msgs.bg-light{background:#fff;background-image:none;}
#mf-msgs.bg-dots,.mf-msgs.bg-dots{background-color:#f8f9fc;background-image:radial-gradient(rgba(112,70,216,.18) 1px,transparent 1px);background-size:18px 18px;}

/* chat cards */
.mf-msg-bot .mf-bubble{background:#fff;color:var(--precision-ink);border:1px solid var(--precision-line);box-shadow:0 2px 7px rgba(15,23,42,.07);}
.mf-msg-user .mf-bubble{background:linear-gradient(135deg,#5530b2,#7046d8);color:#fff;box-shadow:0 3px 10px rgba(85,48,178,.22);}
.mf-ts{color:#8b98a9;}
.mf-msg-user .mf-ts{color:rgba(255,255,255,.58);}
.mf-av-mini{background:linear-gradient(135deg,#5530b2,#8b67e6);}
.mf-msg-reply{background:rgba(112,70,216,.07);border-left-color:#7046d8;color:#5530b2;}
.mf-reaction,.mf-react-btn{background:#fff;border-color:var(--precision-line);}
.mf-reaction:hover,.mf-react-btn:hover{background:#f1effd;}

/* input and action bar */
.mf-input-row,.mf-input-bar{background:#fff;border-top:1px solid var(--precision-line);}
#mf-inp{background:#f8fafc;border-color:#dfe5ec;color:var(--precision-ink);}
#mf-inp:focus{background:#fff;border-color:#ad9be9;box-shadow:0 0 0 3px rgba(112,70,216,.09);}
#mf-inp::placeholder{color:#98a4b4;}
.mf-ibtn,.mf-i-btn,#mel-bg-btn{background:transparent;color:#718096;border:1px solid transparent;}
.mf-ibtn:hover,.mf-i-btn:hover,#mel-bg-btn:hover{background:#f1effd;color:#7046d8;border-color:#ddd5f7;}
.mf-ibtn.mf-send,.mf-i-btn.mf-send{background:#7046d8;color:#fff;border-color:#7046d8;box-shadow:0 3px 9px rgba(112,70,216,.3);}
.mf-ibtn.mf-send:hover,.mf-i-btn.mf-send:hover{background:#5530b2;}

/* modernize legacy emoji buttons without breaking behavior */
#mf-search-btn,#mf-vid-btn,#mf-more-btn,#mf-emoji-btn,#mf-attach-btn,#mf-voice-btn,#mel-bg-btn,#mf-send-btn{font-size:0;}
#mf-search-btn::after{content:'⌕';font-size:25px;font-weight:400;line-height:1;}
#mf-vid-btn::after{content:'▣';font-size:19px;line-height:1;}
#mf-more-btn::after{content:'⋮';font-size:24px;line-height:1;}
#mf-emoji-btn::after{content:'☺';font-size:22px;line-height:1;}
#mf-attach-btn::after{content:none;display:none;}
#mf-voice-btn::after{content:'◖';font-size:22px;line-height:1;}
#mel-bg-btn::after{content:'✦';font-size:18px;line-height:1;}
#mf-send-btn::after{content:'➤';font-size:20px;line-height:1;}

/* menus and overlays */
.mf-more-menu,.mf-attach-menu,.mf-ctx-menu,.mf-emoji-picker,.mf-starred-box,.mf-qr-box{background:#fff;border:1px solid var(--precision-line);box-shadow:0 12px 32px rgba(15,23,42,.13);}
.mf-more-item,.mf-attach-item,.mf-ctx-item{color:#526176;}
.mf-more-item:hover,.mf-attach-item:hover,.mf-ctx-item:hover{background:#f1effd;color:#7046d8;}
.mf-reply-preview,#mf-reply-preview{background:#f6f3ff;border-top-color:#e4dcfb;}
#mf-search-bar{background:#fff;border-top-color:var(--precision-line);}

@media(max-width:480px){
  .mf-msg{max-width:90%;}
  .mf-bubble{font-size:14px;}
  #mf-msgs,.mf-msgs{background-size:20px 20px;}
}
/* Melissa Precision — actual full-page selectors */
body{background:#f1f3f7;color:#142033;}
.shell{background:#f1f3f7;}
.chat{background:#fff;border-left:1px solid #e3e8ef;border-right:1px solid #e3e8ef;}
.hd{background:rgba(255,255,255,.98);border-bottom:1px solid #e3e8ef;box-shadow:0 1px 8px rgba(15,23,42,.05);}
.hd-name{color:#142033;}
.hd-status{color:#22a45a;}
.hd-btn{color:#69788d;}
.hd-btn:hover{background:#f1effd;color:#7046d8;}
.more-menu{background:#fff;border-color:#e3e8ef;box-shadow:0 12px 32px rgba(15,23,42,.13);}
.more-item{color:#526176;}
.more-item:hover{background:#f1effd;color:#7046d8;}

/* full-page conversation canvas: slim graph-paper mathematics grid */
.msgs{
  background-color:#f8f9fc;
  background-image:
    linear-gradient(rgba(112,70,216,.07) 1px,transparent 1px),
    linear-gradient(90deg,rgba(112,70,216,.07) 1px,transparent 1px);
  background-size:22px 22px;
}
.msgs::-webkit-scrollbar-thumb{background:rgba(112,70,216,.22);}
.an-msg-bot .an-bubble,.msg-bot .bubble{background:#fff;color:#142033;border-color:#e3e8ef;box-shadow:0 2px 7px rgba(15,23,42,.07);}
.an-msg-user .an-bubble,.msg-user .bubble{background:linear-gradient(135deg,#5530b2,#7046d8);color:#fff;box-shadow:0 3px 10px rgba(85,48,178,.22);}
.an-ts,.ts{color:#8b98a9;}
.an-msg-av,.msg-av{background:linear-gradient(135deg,#e7e2fb,#f2edff);}

/* welcome state */
.welcome{background:transparent;}
.w-title{color:#142033;}
.w-sub{color:#65748a;}
.chip{background:#fff;border-color:#dfe5ec;color:#56667b;box-shadow:0 1px 4px rgba(15,23,42,.05);}
.chip:hover{background:#7046d8;border-color:#7046d8;color:#fff;}

/* input area */
.inp-wrap{background:rgba(255,255,255,.98);border-top:1px solid #e3e8ef;box-shadow:0 -1px 8px rgba(15,23,42,.04);}
.inp-box{background:#f8fafc;border-color:#dfe5ec;}
.inp-box:focus-within{border-color:#ad9be9;box-shadow:0 0 0 3px rgba(112,70,216,.09);}
#an-inp{color:#142033;}
#an-inp::placeholder{color:#98a4b4;}
.i-btn{color:#718096;}
.i-btn:hover{background:#f1effd;color:#7046d8;}
.send-btn{background:#7046d8;box-shadow:0 3px 10px rgba(112,70,216,.3);}
.send-btn:hover{background:#5530b2;}
.reply-banner{background:#f6f3ff;color:#5530b2;}
.voice-panel{background:rgba(112,70,216,.06);}

/* left/right cards and service controls */
.l-card{background:#fff;border-color:#e3e8ef;box-shadow:0 2px 10px rgba(15,23,42,.06);}
.topic-btn,.l-link{border-color:#e3e8ef;background:#fff;color:#526176;}
.topic-btn:hover,.l-link:hover{background:#f1effd;color:#7046d8;border-color:#c9bdf2;}
.tip-box{background:linear-gradient(135deg,rgba(112,70,216,.06),rgba(59,130,246,.04));border-color:rgba(112,70,216,.16);}

@media(max-width:979px){
  .msgs{background-size:20px 20px;}
}
/* Precision canvas for the initial conversation state */
.chat-inner,.welcome{
  background-color:#f8f9fc;
  background-image:
    linear-gradient(rgba(112,70,216,.055) 1px,transparent 1px),
    linear-gradient(90deg,rgba(112,70,216,.055) 1px,transparent 1px);
  background-size:22px 22px;
}
.welcome{background-color:transparent;}
/* Precision SVG icon language for Melissa side panels */
.prof-av,.hd-av-img,.w-av{font-size:0;}
.prof-av::before,.hd-av-img::before,.w-av::before{
  content:'';display:block;width:42px;height:42px;
  background:linear-gradient(135deg,#7046d8,#a855f7);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l1.9 5.1L19 10l-5.1 1.9L12 17l-1.9-5.1L5 10l5.1-1.9L12 3z'/%3E%3Cpath d='M19 16l.7 1.8L21.5 18.5l-1.8.7L19 21l-.7-1.8-1.8-.7 1.8-.7L19 16z'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l1.9 5.1L19 10l-5.1 1.9L12 17l-1.9-5.1L5 10l5.1-1.9L12 3z'/%3E%3Cpath d='M19 16l.7 1.8L21.5 18.5l-1.8.7L19 21l-.7-1.8-1.8-.7 1.8-.7L19 16z'/%3E%3C/svg%3E") center/contain no-repeat;
}
.prof-av::before{width:34px;height:34px;}
.hd-av-img::before{width:23px;height:23px;}
.topic-ic,.l-link-ic{font-size:0;}
.topic-ic::before,.l-link-ic::before{
  content:'';display:block;width:17px;height:17px;background:currentColor;
  -webkit-mask-position:center;-webkit-mask-repeat:no-repeat;-webkit-mask-size:contain;
  mask-position:center;mask-repeat:no-repeat;mask-size:contain;
}
.topic-btn:nth-of-type(1) .topic-ic::before{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z'/%3E%3Cpolyline points='14 2 14 8 20 8'/%3E%3Cline x1='8' y1='13' x2='16' y2='13'/%3E%3Cline x1='8' y1='17' x2='14' y2='17'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z'/%3E%3Cpolyline points='14 2 14 8 20 8'/%3E%3Cline x1='8' y1='13' x2='16' y2='13'/%3E%3Cline x1='8' y1='17' x2='14' y2='17'/%3E%3C/svg%3E");}
.topic-btn:nth-of-type(2) .topic-ic::before{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 21h18M5 21V5h14v16M8 8h2m4 0h2M8 12h2m4 0h2M8 16h2m4 0h2'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 21h18M5 21V5h14v16M8 8h2m4 0h2M8 12h2m4 0h2M8 16h2m4 0h2'/%3E%3C/svg%3E");}
.topic-btn:nth-of-type(3) .topic-ic::before{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 17h14l1-5-3-1-2-4H9l-2 4-3 1 1 5z'/%3E%3Ccircle cx='8' cy='17' r='2'/%3E%3Ccircle cx='16' cy='17' r='2'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 17h14l1-5-3-1-2-4H9l-2 4-3 1 1 5z'/%3E%3Ccircle cx='8' cy='17' r='2'/%3E%3Ccircle cx='16' cy='17' r='2'/%3E%3C/svg%3E");}
.topic-btn:nth-of-type(4) .topic-ic::before{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='7' width='18' height='13' rx='2'/%3E%3Cpath d='M8 7V5a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2M3 12h18'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='7' width='18' height='13' rx='2'/%3E%3Cpath d='M8 7V5a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2M3 12h18'/%3E%3C/svg%3E");}
.topic-btn:nth-of-type(5) .topic-ic::before{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22V2M5 7h14M4 7l-3 7a4 4 0 0 0 6 0L4 7zm16 0l-3 7a4 4 0 0 0 6 0l-3-7z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22V2M5 7h14M4 7l-3 7a4 4 0 0 0 6 0L4 7zm16 0l-3 7a4 4 0 0 0 6 0l-3-7z'/%3E%3C/svg%3E");}
.topic-btn:nth-of-type(6) .topic-ic::before{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 10.5L12 3l9 7.5'/%3E%3Cpath d='M5 9v11h14V9M9 20v-6h6v6'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 10.5L12 3l9 7.5'/%3E%3Cpath d='M5 9v11h14V9M9 20v-6h6v6'/%3E%3C/svg%3E");}

/* Migrated from melissa-page-refinement-20260908.css */
/* Melissa Anna full-page refinement: consistent identity, readable desktop context and mobile-first layout. */

html,
body {
  width: 100%;
  min-width: 0;
  min-height: 100%;
}

body {
  overflow: hidden;
  background:
    linear-gradient(135deg, rgba(34,45,102,.78), rgba(91,55,145,.60) 48%, rgba(18,114,156,.62)),
    url('/assets/img/homepage-wave-background-20260907.jpg') center / cover fixed no-repeat ;
}

.shell {
  width: min(1500px, 100%);
  max-width: none;
  height: 100dvh;
  gap: 16px;
  padding: 16px;
}

.chat {
  border: 1px solid rgba(255,255,255,.44) ;
  border-radius: 24px;
  background: rgba(255,255,255,.88) ;
  box-shadow: 0 24px 70px rgba(12,18,52,.24);
  overflow: hidden;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.col {
  width: 290px;
  padding: 0;
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,.38) transparent;
}

.l-card {
  border: 1px solid rgba(255,255,255,.24) ;
  background: linear-gradient(145deg, rgba(19,28,76,.88), rgba(71,49,125,.82)) ;
  box-shadow: 0 14px 30px rgba(15,23,72,.20) ;
  color: #fff;
}

.l-card-ttl,
.prof-name,
.prof-role,
.prof-desc,
.l-link,
.stat-l,
.tip-box,
.legal-txt {
  color: #fff ;
}

.l-card-ttl { opacity: .78; }
.prof-role { opacity: .86; }
.prof-desc { opacity: .91; }

.topic-btn,
.l-link {
  border-color: rgba(255,255,255,.25) ;
  background: rgba(255,255,255,.10) ;
  color: #fff ;
}

.topic-btn:hover,
.l-link:hover {
  background: rgba(255,255,255,.22) ;
  border-color: rgba(255,255,255,.58) ;
  color: #fff ;
  transform: translateY(-1px) ;
}

.topic-btn .an-topic-lbl,
.l-link .l-link-ic,
.stat-l,
.legal-txt a {
  color: #fff ;
}

.topic-ic,
.l-link-ic,
.stat-cell,
.tip-box {
  background: rgba(255,255,255,.14) ;
  color: #fff ;
}

.stat-n,
.tip-lbl { color: #fff ; }
.legal-txt { opacity: .82; }

.welcome {
  background:
    linear-gradient(145deg, rgba(28,38,102,.78), rgba(104,61,150,.56)),
    url('/assets/img/homepage-wave-background-20260907.jpg') center / cover no-repeat;
}

.w-title,
.w-sub { color: #fff ; }
.w-sub { opacity: .90; }

.chip {
  border-color: rgba(255,255,255,.42) ;
  background: rgba(255,255,255,.13) ;
  color: #fff ;
  box-shadow: 0 6px 16px rgba(12,18,52,.12);
}

.chip:hover,
.chip:focus-visible {
  border-color: rgba(255,255,255,.82) ;
  background: rgba(255,255,255,.24) ;
  color: #fff ;
}

.msgs {
  background:
    linear-gradient(rgba(248,250,255,.78), rgba(248,250,255,.88)),
    url('/assets/img/homepage-wave-background-20260907.jpg') center / cover no-repeat ;
}

@media (min-width: 980px) {
  .col { display: block; }
}

@media (max-width: 979px) {
  .shell {
    display: block;
    height: 100dvh;
    padding: 0;
  }

  .chat {
    width: 100%;
    height: 100dvh;
    min-height: 100dvh;
    border: 0 ;
    border-radius: 0;
  }
}

@media (max-width: 640px) {
  .hd {
    gap: 8px;
    padding: 8px 10px;
    padding-top: calc(8px + var(--st));
  }

  .hd-acts { gap: 0; }
  .hd-btn { width: 35px; height: 35px; }

  .welcome {
    justify-content: flex-start;
    padding: 28px 14px calc(28px + var(--sb));
    overflow-y: auto;
  }

  .w-av { width: 70px; height: 70px; font-size: 35px; }
  .w-title { font-size: clamp(22px, 7vw, 28px); }
  .w-sub { max-width: 290px; font-size: 13px; }

  .chips {
    display: grid ;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
    max-width: 360px;
    gap: 8px ;
  }

  .chip {
    min-height: 48px;
    padding: 8px 9px ;
    font-size: 11.5px ;
    line-height: 1.25;
  }

  .msgs { padding: 12px 9px calc(8px + var(--sb)); }
  .bubble { font-size: 14.5px; }
  .inp-wrap { padding: 8px; padding-bottom: calc(8px + var(--sb)); }
}

@media (max-width: 360px) {
  .hd-name { font-size: 14px; }
  .hd-btn { width: 33px; height: 33px; }
  .chips { gap: 6px ; }
  .chip { font-size: 10.5px ; }
}