/* ═══════════════════════════════════════════════════════════════════
   UFVAI — site v7 · CSS REAL do aplicativo (escopado sob #appmock)
   Extraído mecanicamente de /tmp/pesquisai-wrapper/index.html
   (UFVAI v0.7.8 em execução) em 29/10/2026.
   NÃO é uma aproximação: são as mesmas regras do app real, reescopadas
   para viver dentro da demonstração do site.
   ═══════════════════════════════════════════════════════════════════ */
#appmock{ background: #141c24; color: #e8e6e0; }
#appmock{
      --ink:        #e8e6e0;
      --ink-muted:  #9a9790;
      --surface:    #141c24;
      --rail:       #1f2831;
      --line:       rgba(255,255,255,.07);
      --accent:     #b29149;
      --accent-dim: rgba(var(--accent-rgb),.12);
      --accent-glow:rgba(var(--accent-rgb),.22);
      --accent-rgb: 178,145,73;
      --green:      #5dba7e;
      --green-dim:  rgba(93,186,126,.12);
      --amber:      #D1A705;
      --amber-dim:  rgba(209,167,5,.14);
      --red:        #e07070;
      --red-dim:    rgba(224,112,112,.12);
      --ov-dim:     rgba(4,7,11,.8);      
      --radius:     5px;
      --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, "Helvetica Neue", Arial, sans-serif;
      --font-mono: "DM Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
    }
#appmock, #appmock{
      height: 100%; width: 100%;
      background: var(--surface);
      color: var(--ink);
      font-family: var(--font-sans);
      overflow: hidden;
      -webkit-tap-highlight-color: transparent;
    }
#appmock.theme-light{
    --ink:        #1f262a;
    --ink-muted:  #4a5a62;
    --surface:    #f5f6f7;
    --rail:       #ffffff;
    --line:       rgba(0,0,0,.1);
    --accent:     #8a6d33;
    --accent-dim: rgba(138,109,51,.10);
    --accent-glow:rgba(138,109,51,.18);
    --accent-rgb: 138,109,51;
    --green:      #2e7d32;
    --green-dim:  rgba(46,125,50,.1);
    --amber:      #a67c00;
    --amber-dim:  rgba(166,124,0,.12);
    --red:        #c62828;
    --red-dim:    rgba(198,40,40,.1);
    --ov-dim:     rgba(30,42,52,.38);   
    background:   #f5f6f7;
    color:        #1f262a;
    --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, "Helvetica Neue", Arial, sans-serif;
    --font-mono: "DM Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  }
#appmock.theme-light .markdown-body{
    color: var(--ink) !important;
    background-color: transparent !important;
  }
#appmock.theme-light .markdown-body h1, #appmock.theme-light .markdown-body h2, #appmock.theme-light .markdown-body h3, #appmock.theme-light .markdown-body h4, #appmock.theme-light .markdown-body h5, #appmock.theme-light .markdown-body h6{
    color: var(--ink) !important;
    border-bottom-color: var(--line) !important;
  }
#appmock.theme-light .markdown-body p, #appmock.theme-light .markdown-body li, #appmock.theme-light .markdown-body dl, #appmock.theme-light .markdown-body dd, #appmock.theme-light .markdown-body td, #appmock.theme-light .markdown-body th, #appmock.theme-light .markdown-body strong, #appmock.theme-light .markdown-body b, #appmock.theme-light .markdown-body summary, #appmock.theme-light .markdown-body label{
    color: var(--ink) !important;
  }
#appmock.theme-light .markdown-body th{
    background-color: var(--surface) !important;
  }
#appmock.theme-light .markdown-body a, #appmock.theme-light .markdown-body a:visited{
    color: var(--accent) !important;
  }
#appmock.theme-light .markdown-body a:hover{
    color: var(--ink) !important;
  }
#appmock.theme-light .markdown-body blockquote{
    color: var(--ink-muted) !important;
    border-left-color: var(--accent) !important;
    background-color: var(--accent-dim) !important;
  }
#appmock.theme-light .markdown-body code, #appmock.theme-light .markdown-body tt{
    color: #7a3b1d !important;
    background-color: #f1efe9 !important;
    border-color: rgba(0,0,0,.08) !important;
  }
#appmock.theme-light .markdown-body pre{
    color: var(--ink) !important;
    background-color: #f1efe9 !important;
    border-color: rgba(0,0,0,.08) !important;
  }
#appmock.theme-light .markdown-body pre code, #appmock.theme-light .markdown-body pre tt{
    color: #7a3b1d !important;
    background-color: transparent !important;
  }
#appmock.theme-light .markdown-body hr{
    background-color: var(--line) !important;
    border-color: var(--line) !important;
  }
#appmock.theme-light .markdown-body table th, #appmock.theme-light .markdown-body table td{
    border-color: var(--line) !important;
  }
#appmock.theme-light .markdown-body table tr{
    background-color: transparent !important;
    border-top-color: var(--line) !important;
  }
#appmock.theme-light .markdown-body table tr:nth-child(2n){
    background-color: var(--surface) !important;
  }
#appmock.theme-light .markdown-body img{
    background-color: transparent !important;
    border-color: var(--line) !important;
  }
#appmock.theme-light .markdown-body kbd{
    color: var(--ink) !important;
    background-color: #f1efe9 !important;
    border-color: rgba(0,0,0,.12) !important;
    box-shadow: inset 0 -1px 0 rgba(0,0,0,.08) !important;
  }
#appmock.theme-light .markdown-body .highlight, #appmock.theme-light .markdown-body .highlight pre{
    background-color: #f1efe9 !important;
  }
/* Reset universal do app — escopado aos componentes REAIS do aplicativo
   (topbar, rodapé, Termos). Sem isto, a regra zeraria o padding/margin
   dos elementos do mock que involvesc a demo (que têm layout próprio). */
#appmock #mock-topbar *, #appmock #mock-topbar *::before, #appmock #mock-topbar *::after,
#appmock #mock-footer *, #appmock #mock-footer *::before, #appmock #mock-footer *::after,
#appmock #mock-terms-overlay *, #appmock #mock-terms-overlay *::before, #appmock #mock-terms-overlay *::after
{ box-sizing: border-box; margin: 0; padding: 0; }
#appmock button, #appmock .tb-btn, #appmock .tb-icon, #appmock .hamburger, #appmock .lang-btn{ min-height: 32px; min-width: 32px; }
#appmock #mock-topbar{
      position: fixed; inset: 0 0 auto 0;
      height: 50px;
      background: var(--rail);
      border-bottom: 1px solid var(--line);
      display: flex; align-items: center;
      padding: 0 18px; gap: 14px;
      z-index: 9999;
    }
#appmock .logo{ display: flex; align-items: baseline; gap: 2px; }
#appmock .logo-p{ font-family:"Montserrat","Syne",sans-serif; font-weight:700; font-size:17px; color:var(--ink); letter-spacing:-0.02em; }
#appmock .logo-ai{ font-family:"Montserrat","Syne",sans-serif; font-weight:600; font-size:17px; color:var(--accent); letter-spacing:-0.02em; margin-left:-0.02em; }
#appmock .logo-tag{
      margin-left:9px; font-size:10px; color:var(--ink-muted);
      letter-spacing:.07em; padding:1px 6px;
      border:1px solid var(--line); border-radius:3px; align-self:center;
    }
#appmock .status{ display:flex; align-items:center; gap:7px; font-size:11px; color:var(--ink-muted); }
#appmock .status-dot{
      width:7px; height:7px; border-radius:50%; background:var(--green);
      animation: pulse 2.4s ease infinite;
    }
#appmock .sep{ flex: 1; }
#appmock .tb-btn{
      display: inline-flex; align-items: center; gap: 7px;
      padding: 0 13px; height: 30px;
      font-family: var(--font-sans); font-size: 11px;
      font-weight: 500; letter-spacing: .04em;
      border-radius: var(--radius); cursor: pointer;
      border: 1px solid; transition: background .15s, transform .1s, border-color .15s;
      text-decoration: none; white-space: nowrap;
    }
#appmock .tb-btn:active{ transform: scale(.96); }
#appmock .tb-btn svg{ width:13px; height:13px; stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0; }
#appmock #mock-footer{
      position: fixed; inset: auto 0 0 0;
      height: 40px;
      background: var(--rail);
      border-top: 1px solid var(--line);
      display: flex; align-items: center;
      padding: 0 18px; gap: 0;
      font-size: 11px; color: var(--ink-muted);
      z-index: 9999;
    }
#appmock .footer-brand{
      font-family: "Syne", sans-serif; font-weight: 700;
      font-size: 11px; color: var(--ink);
      margin-right: 14px;
    }
#appmock .footer-sep{ width:1px; height:16px; background:var(--line); margin:0 12px; flex-shrink:0; }
#appmock .footer-link{
      color: var(--ink-muted); text-decoration: none;
      letter-spacing: .03em;
      transition: color .15s;
    }
#appmock .footer-link:hover{ color: var(--accent); }
#appmock .footer-link svg{ width:11px; height:11px; stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; vertical-align:-.15em; margin-right:4px; }
#appmock .footer-right{ margin-left:auto; display:flex; align-items:center; gap:12px; }
#appmock .footer-oc{ color:var(--ink-muted); letter-spacing:.03em; }
#appmock .footer-oc a{ color:var(--ink-muted); text-decoration:none; }
#appmock .footer-oc a:hover{ color:var(--accent); }
#appmock .autosave-switch{
      display: inline-flex; align-items: center; gap: 7px;
      cursor: pointer; user-select: none;
      font-size: 11px; color: var(--ink-muted);
      letter-spacing: .03em;
    }
#appmock .autosave-switch input{ position:absolute; opacity:0; width:0; height:0; }
#appmock .autosave-track{
      position: relative; display:inline-block;
      width: 30px; height: 16px; flex-shrink:0;
      background: rgba(var(--accent-rgb),.14);
      border: 1px solid rgba(var(--accent-rgb),.28);
      border-radius: 999px;
      transition: background .18s, border-color .18s;
    }
#appmock .autosave-knob{
      position: absolute; top: 1px; left: 1px;
      width: 12px; height: 12px; border-radius: 50%;
      background: rgba(var(--accent-rgb),.55);
      transition: transform .18s, background .18s;
    }
#appmock .autosave-switch input:checked + .autosave-track{
      background: rgba(var(--accent-rgb),.42);
      border-color: rgba(var(--accent-rgb),.6);
    }
#appmock .autosave-switch input:checked + .autosave-track .autosave-knob{
      transform: translateX(14px);
      background: var(--accent);
    }
#appmock .autosave-switch input:focus-visible + .autosave-track{
      box-shadow: 0 0 0 2px rgba(var(--accent-rgb),.25);
    }
#appmock .autosave-switch.on .autosave-label{ color: var(--accent); }
#appmock .autosave-dot{
      width: 6px; height: 6px; border-radius: 50%;
      background: var(--accent); display: inline-block;
      opacity: 0; transition: opacity .2s;
    }
#appmock .autosave-switch.on .autosave-dot{ opacity: 1; }
#appmock .btn-provider{
      display: inline-flex; align-items: center; gap: 5px;
      padding: 0 10px; height: 24px;
      font-family: var(--font-sans); font-size: 11px;
      font-weight: 500; letter-spacing: .03em;
      border-radius: var(--radius); cursor: pointer;
      border: 1px solid rgba(var(--accent-rgb),.18);
      color: rgba(var(--accent-rgb),.55);
      background: transparent;
      transition: background .15s, color .15s, border-color .15s;
      white-space: nowrap;
    }
#appmock .btn-provider:hover{
      background: var(--accent-dim);
      color: var(--accent);
      border-color: rgba(var(--accent-rgb),.4);
    }
#appmock .btn-provider:active{ transform: scale(.96); }
#appmock .btn-provider svg{ width:10px; height:10px; stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0; }
#appmock .tb-icons{ display:flex; align-items:center; gap:4px; margin-left:6px; }
#appmock .tb-icon{
      display:inline-flex; align-items:center; justify-content:center;
      width:30px; height:30px; padding:0;
      background:transparent; border:1px solid var(--line);
      border-radius:var(--radius); cursor:pointer;
      color:var(--ink-muted); transition:background .15s,color .15s,border-color .15s;
    }
#appmock .tb-icon:hover{
      background:var(--accent-dim); color:var(--accent);
      border-color:rgba(var(--accent-rgb),.4);
    }
#appmock .tb-icon:active{ transform: scale(.94); }
#appmock .tb-icon svg{ width:15px; height:15px; stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0; }
#appmock .hamburger{
    display: none;
    width: 36px; height: 36px;
    background: transparent;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    color: var(--ink);
    cursor: pointer;
    align-items: center; justify-content: center;
  }
#appmock .hamburger:active{ transform: scale(.94); }
#appmock .hamburger svg{ width: 20px; height: 20px; stroke: currentColor; fill: none; stroke-width: 2; }
#appmock .mobile-menu{
    position: fixed;
    top: 50px; right: 0;
    width: 280px; max-width: 85vw;
    height: calc(100vh - 50px);
    background: var(--rail);
    border-left: 1px solid var(--line);
    transform: translateX(100%);
    transition: transform .25s ease;
    z-index: 9998;
    padding: 16px;
    overflow-y: auto;
    display: flex; flex-direction: column; gap: 10px;
    box-shadow: -4px 0 24px rgba(0,0,0,.35);
  }
#appmock .mobile-menu.open{ transform: translateX(0); }
#appmock .mobile-menu .tb-btn{ width: 100%; justify-content: flex-start; }
#appmock .mobile-menu-overlay{
    position: fixed; inset: 0;
    background: rgba(0,0,0,.5);
    opacity: 0; pointer-events: none;
    transition: opacity .2s;
    z-index: 9997;
  }
#appmock .mobile-menu-overlay.open{ opacity: 1; pointer-events: all; }
#appmock .tb-btn:focus-visible, #appmock .tb-icon:focus-visible, #appmock .hamburger:focus-visible, #appmock .lang-btn:focus-visible, #appmock .lang-option:focus-visible{
    outline: 2px solid var(--accent);
    outline-offset: 2px;
  }
#appmock .lang-btn{
    display: inline-flex; align-items: center; gap: 4px;
    padding: 0 8px; height: 30px;
    font-family: var(--font-sans); font-size: 11px;
    font-weight: 500; letter-spacing: .03em;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: transparent;
    color: var(--ink-muted);
    cursor: pointer;
    transition: background .15s, color .15s, border-color .15s;
  }
#appmock .lang-btn:hover{
    background: var(--accent-dim);
    color: var(--accent);
    border-color: rgba(var(--accent-rgb),.4);
  }
#appmock .lang-btn:active{ transform: scale(.96); }
#appmock .lang-btn .lang-flag{ font-size: 13px; line-height: 1; }
#appmock .lang-btn .lang-code{ font-weight: 600; }
#appmock .lang-btn .lang-chevron{
    width: 9px; height: 9px;
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    transform: rotate(45deg);
    margin-left: 2px;
    margin-top: -2px;
    transition: transform .2s;
  }
#appmock .lang-btn[aria-expanded="true"] .lang-chevron{ transform: rotate(-135deg); margin-top: 2px; }
#appmock .lang-option .lang-flag{ font-size: 16px; line-height: 1; }
#appmock #mock-boot-splash{
    position: fixed; inset: 0; z-index: 200000;
    display: flex; flex-direction: column;
    align-items: center; justify-content: center; gap: 16px;
    background: var(--surface, #141c24);
    transition: opacity .45s ease;
  }
#appmock #mock-boot-splash.hide{ opacity: 0; pointer-events: none; }
#appmock .boot-logo{ width: 128px; height: auto; border-radius: 14px;
    box-shadow: 0 12px 40px rgba(0,0,0,.35); }
#appmock .boot-spinner{ width: 32px; height: 32px; border-radius: 50%;
    border: 3px solid rgba(var(--accent-rgb), .18);
    border-top-color: var(--accent);
    animation: bootspin .8s linear infinite; }
#appmock .boot-status{ font-size: 13px; color: var(--ink-muted);
    font-family: var(--font-sans); letter-spacing: .02em; }
#appmock .boot-bar{ width: min(320px, 60vw); height: 4px; border-radius: 2px;
    overflow: hidden; background: rgba(var(--accent-rgb), .15);
    position: relative; }
#appmock .boot-bar::after{ content: ""; position: absolute; left: -40%;
    top: 0; bottom: 0; width: 40%; border-radius: 2px;
    background: linear-gradient(90deg, transparent, var(--accent), transparent);
    animation: bootslide 1.4s ease-in-out infinite; }
#appmock .boot-error{ color: var(--red); font-size: 12.5px;
    max-width: 70vw; text-align: center; line-height: 1.5; }
#appmock .boot-retry{ margin-top: 4px; padding: 8px 16px;
    background: var(--accent-dim); color: var(--accent);
    border: 1px solid rgba(var(--accent-rgb), .35);
    border-radius: var(--radius); cursor: pointer;
    font-size: 12px; font-family: var(--font-sans); }
#appmock #mock-terms-overlay{position:fixed;inset:0;z-index:99999;display:none;align-items:center;
    justify-content:center;background:rgba(10,13,17,.93);backdrop-filter:blur(6px);
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;padding:16px;
    overflow-y:auto;-webkit-overflow-scrolling:touch;}
#appmock #mock-terms-overlay .t-card{max-width:660px;width:100%;background:#141c24;border:1px solid #b29149;
    border-radius:14px;padding:24px 26px;color:#e8e6e0;box-shadow:0 20px 60px rgba(0,0,0,.5);
    max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);overflow-y:auto;
    -webkit-overflow-scrolling:touch;margin:auto;}
#appmock #mock-terms-overlay .t-brand{font-family:"Montserrat","Syne",sans-serif;font-size:26px;
    letter-spacing:-0.02em;margin-bottom:2px;}
#appmock #mock-terms-overlay .t-brand b{font-weight:700}
#appmock #mock-terms-overlay .t-brand em{font-style:normal;font-weight:600;color:#b29149}
#appmock #mock-terms-overlay .t-sub{font-size:11px;color:#9a9790;margin-bottom:14px;}
#appmock #mock-terms-overlay .t-scroll{max-height:38vh;overflow:auto;border:1px solid rgba(178,145,73,.25);
    border-radius:8px;padding:12px 14px;font-size:12px;line-height:1.55;color:#cfcabf;margin-bottom:14px;}
#appmock #mock-terms-overlay .t-scroll h4{margin:10px 0 4px;color:#b29149;font-size:12px;}
#appmock #mock-terms-overlay .t-scroll p{margin:4px 0;}
#appmock #mock-terms-overlay .t-links{font-size:11px;margin-bottom:14px;display:flex;gap:14px;flex-wrap:wrap;}
#appmock #mock-terms-overlay .t-links a{color:#D1A705;text-decoration:none;border-bottom:1px dotted #D1A705;}
#appmock #mock-terms-overlay label.t-check{display:flex;gap:9px;align-items:flex-start;font-size:12px;
    margin-bottom:8px;cursor:pointer;line-height:1.45;}
#appmock #mock-terms-overlay input[type=checkbox]{accent-color:#b29149;width:15px;height:15px;margin-top:1px;flex:0 0 auto;}
#appmock #mock-terms-overlay .t-actions{display:flex;gap:10px;margin-top:14px;}
#appmock #mock-terms-overlay button{flex:1;padding:11px 14px;border-radius:9px;font-size:13px;font-weight:600;
    cursor:pointer;border:1px solid transparent;transition:.15s;}
#appmock #mock-terms-overlay .t-ok{background:linear-gradient(135deg,#D1A705,#b29149);color:#141c24;border:none;}
#appmock #mock-terms-overlay .t-ok:disabled{opacity:.35;cursor:not-allowed;}
#appmock #mock-terms-overlay .t-no{background:transparent;color:#9a9790;border-color:rgba(154,151,144,.35);}
#appmock #exit-overlay{position:fixed;inset:0;z-index:100000;display:none;align-items:center;
    justify-content:center;background:rgba(10,13,17,.96);backdrop-filter:blur(6px);
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;padding:16px;}
#appmock #exit-overlay .t-card{max-width:520px;width:100%;background:#141c24;border:1px solid #b29149;
    border-radius:14px;padding:28px 26px;color:#e8e6e0;box-shadow:0 20px 60px rgba(0,0,0,.5);
    text-align:center;}
#appmock #exit-overlay .t-brand{font-family:"Montserrat","Syne",sans-serif;font-size:26px;
    letter-spacing:-0.02em;margin-bottom:12px;}
#appmock #exit-overlay .t-brand b{font-weight:700}
#appmock #exit-overlay .t-brand em{font-style:normal;font-weight:600;color:#b29149}
#appmock #exit-overlay .e-msg{font-size:13px;line-height:1.6;}
#appmock #welcome-overlay{position:fixed;inset:0;z-index:99998;display:none;align-items:center;
    justify-content:center;background:rgba(10,13,17,.93);backdrop-filter:blur(6px);
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;padding:16px;
    overflow-y:auto;-webkit-overflow-scrolling:touch;}
#appmock #welcome-overlay .w-card{max-width:440px;width:100%;background:#141c24;border:1px solid #b29149;
    border-radius:14px;padding:28px 30px;color:#e8e6e0;box-shadow:0 20px 60px rgba(0,0,0,.5);
    text-align:center;max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);overflow-y:auto;
    -webkit-overflow-scrolling:touch;margin:auto;}
#appmock #welcome-overlay .w-logo{width:96px;height:96px;border-radius:50%;border:2px solid rgba(178,145,73,.55);
    box-shadow:0 4px 18px rgba(0,0,0,.45);background:#fff;object-fit:cover;margin:0 auto 12px;display:block;}
#appmock #welcome-overlay .w-brand{font-family:"Montserrat","Syne",sans-serif;font-size:26px;letter-spacing:-0.02em;}
#appmock #welcome-overlay .w-brand b{font-weight:700}
#appmock #welcome-overlay .w-brand em{font-style:normal;font-weight:600;color:#b29149}
#appmock #welcome-overlay .w-title{font-size:18px;font-weight:600;margin:10px 0 4px;color:#e8e6e0;}
#appmock #welcome-overlay .w-sub{font-size:12px;color:#9a9790;line-height:1.5;margin-bottom:16px;}
#appmock #welcome-overlay .w-email{display:inline-block;background:rgba(178,145,73,.12);border:1px solid rgba(178,145,73,.4);
    border-radius:8px;padding:10px 18px;font-size:15px;font-weight:600;color:#F0E4C3;margin:4px 0 6px;word-break:break-all;}
#appmock #welcome-overlay .w-note{font-size:10.5px;color:#7d7a72;line-height:1.45;margin:6px 0 18px;}
#appmock #welcome-overlay .w-actions{display:flex;flex-direction:column;gap:9px;}
#appmock #welcome-overlay button{padding:12px 14px;border-radius:9px;font-size:13px;font-weight:600;cursor:pointer;
    border:1px solid transparent;transition:.15s;width:100%;-webkit-tap-highlight-color:transparent;touch-action:manipulation;}
#appmock #welcome-overlay .w-ok{background:linear-gradient(135deg,#D1A705,#b29149);color:#141c24;border:none;min-height:46px;}
#appmock #welcome-overlay .w-switch{background:transparent;color:#9a9790;border-color:rgba(154,151,144,.35);font-weight:500;min-height:44px;}

/* ─────────────────────────────────────────────────────────────────────
   Painel de boot do Colab (.ufl-*) e card 'ABRIR O UFVAI' (.ufb-*)
   Extraídos de UFVAI-v0.7.8/pesquisai/launch_app.py (fonte real).
   ───────────────────────────────────────────────────────────────────── */
.ufl-panel{max-width:560px;margin:10px auto;padding:26px 30px 22px;background:#f6f5f0;border:1px solid rgba(43,45,58,.14);border-radius:18px;box-shadow:0 14px 34px rgba(43,45,58,.12);font-family:'DM Mono',monospace}
.ufl-head{text-align:center;margin-bottom:16px}
.ufl-wordmark{font-family:'Montserrat','Syne',system-ui,sans-serif;font-size:34px;font-weight:800;letter-spacing:.04em;line-height:1;color:#2b2d3a}
.ufl-wordmark .ufl-ai{color:#b8912f}
.ufl-rule{height:1px;background:rgba(43,45,58,.22);margin:10px auto 7px;width:78%}
.ufl-tagline{font-family:'Montserrat',system-ui,sans-serif;font-size:11px;font-weight:600;color:#8f8d86;letter-spacing:.42em;text-indent:.42em}
.ufl-barwrap{position:relative;height:12px;background:#e9e6df;border:1px solid rgba(43,45,58,.15);border-radius:999px;overflow:hidden}
.ufl-fill{position:absolute;top:0;left:0;bottom:0;width:0%;background:linear-gradient(90deg,#caa53f,#b8912f 45%,#8f7536);border-radius:999px;transition:width .45s ease;overflow:hidden}
.ufl-fill::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.5),transparent);animation:ufl-shim 1.4s linear infinite}
@keyframes ufl-shim{from{transform:translateX(-100%)}to{transform:translateX(100%)}}
.ufl-pct{text-align:right;font-size:11px;color:#8f7536;margin-top:6px;letter-spacing:.08em}
/* Mensagens SEMPRE abaixo da barra — ordem garantida em _html() */
.ufl-list{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-direction:column;gap:8px}
.ufl-row{display:flex;align-items:center;gap:9px;font-size:13px;color:#3c3f4e;text-align:left}
.ufl-mark{color:#b8912f;font-weight:700;flex:0 0 auto}
.ufl-row.bad .ufl-mark,.ufl-row.bad{color:#a94442}
.ufl-spin{width:12px;height:12px;border:2px solid rgba(184,145,47,.30);border-top-color:#b8912f;border-radius:50%;animation:ufl-rot .8s linear infinite;flex:0 0 12px}
@keyframes ufl-rot{to{transform:rotate(360deg)}}
.ufl-ready{margin-top:16px;font-family:'Montserrat','Syne',sans-serif;font-weight:700;color:#2b2d3a;font-size:15px;text-align:center;letter-spacing:.04em}
@media (prefers-reduced-motion: reduce){.ufl-fill::after,.ufl-spin{animation:none}}

.ufb-card {
    max-width: 560px;
    margin: 12px auto;
    padding: 28px 24px 26px;
    background: #f6f5f0;
    border: 1px solid rgba(43,45,58,.14);
    border-radius: 18px;
    box-shadow: 0 14px 34px rgba(43,45,58,.12);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 18px;
  }

  .ufb-logo {
    width: 210px;
    height: auto;
    border-radius: 10px;
  }

  /* Fallback sem asset: wordmark CSS no tema da marca */
  .ufb-logo-fallback {
    font-family: 'Montserrat', 'Syne', system-ui, sans-serif;
    text-align: center;
    color: #2b2d3a;
    padding: 8px 0 2px;
  }

  .ufb-wm {
    font-size: 40px;
    font-weight: 800;
    letter-spacing: .04em;
    line-height: 1;
  }

  .ufb-wm .ufl-ai { color: #b8912f; }

  .ufb-rule {
    height: 1px;
    background: rgba(43,45,58,.22);
    margin: 10px auto 7px;
    width: 220px;
  }

  .ufb-tag {
    font-size: 11px;
    font-weight: 600;
    color: #8f8d86;
    letter-spacing: .38em;
    text-indent: .38em;
  }

  .ufb-btn, .pesquisai-launch {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    padding: 17px 46px;
    font-family: 'Montserrat', 'Syne', sans-serif;
    font-size: 20px;
    font-weight: 800;
    letter-spacing: .08em;
    color: #2b2d3a;
    background: linear-gradient(135deg, #d3b054 0%, #b8912f 45%, #8f7536 100%);
    border: none;
    border-radius: 999px;
    cursor: pointer;
    text-decoration: none;
    box-shadow: 0 6px 18px rgba(143,117,54,.35);
    transition: transform 0.2s ease, filter 0.2s ease, box-shadow 0.2s ease;
    animation: ufb-pulse 2.5s ease-in-out infinite;
    position: relative;
    overflow: hidden;
  }

  .ufb-btn::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.35), transparent);
    transition: left 0.5s;
  }

  .ufb-btn:hover::before { left: 100%; }

  .ufb-btn:hover {
    transform: translateY(-4px) scale(1.02);
    filter: brightness(1.08);
    box-shadow: 0 12px 40px rgba(184,145,47,.5), 0 8px 24px rgba(43,45,58,.18);
  }

  .ufb-btn:active { transform: translateY(-1px) scale(0.99); }

  .ufb-btn:focus-visible {
    outline: 3px solid rgba(43,45,58,.45);
    outline-offset: 3px;
  }

  .ufb-text {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 3px;
  }

  .ufb-main { line-height: 1; }

  .ufb-sub {
    font-family: 'DM Mono', monospace;
    font-size: 10px;
    font-weight: 500;
    opacity: 0.75;
    letter-spacing: 0.14em;
    text-transform: uppercase;
  }

  .ufb-arrow {
    font-size: 26px;
    font-weight: 500;
    transition: transform 0.2s ease;
  }

  .ufb-btn:hover .ufb-arrow { transform: translateX(8px); }

    .ufb-btn { animation: none; transition: none; }

/* ═══════════════════════════════════════════════════════════════════
   TEMA CLARO DA DEMONSTRAÇÃO (app mock)
   A animação deve seguir o tema do site: quando data-theme != "dark"
   no <html>, a demonstração muda para tema claro.
   ═══════════════════════════════════════════════════════════════════ */

/* Variáveis base do modo claro (já definidas no #appmock.theme-light) */
html:not([data-theme="dark"]) #appmock {
  --ink:        #1f262a;
  --ink-muted:  #4a5a62;
  --surface:    #f5f6f7;
  --rail:       #ffffff;
  --line:       rgba(0,0,0,.1);
  --accent:     #8a6d33;
  --accent-dim: rgba(138,109,51,.10);
  --accent-glow:rgba(138,109,51,.18);
  --accent-rgb: 138,109,51;
  --green:      #2e7d32;
  --green-dim:  rgba(46,125,50,.1);
  --amber:      #a67c00;
  --amber-dim:  rgba(166,124,0,.12);
  --red:        #c62828;
  --red-dim:    rgba(198,40,40,.1);
  --ov-dim:     rgba(30,42,52,.38);
  background:   #f5f6f7;
  color:        #1f262a;
}

/* ── Mock app frame ────────────────────────────────────────────────── */
html:not([data-theme="dark"]) #appmock .mock-appframe {
  background: var(--surface);
  color: var(--ink);
}

/* ── Topbar ────────────────────────────────────────────────────────── */
html:not([data-theme="dark"]) #appmock #mock-topbar {
  background: var(--rail);
  border-bottom-color: var(--line);
}
html:not([data-theme="dark"]) #appmock .logo-p { color: var(--ink); }
html:not([data-theme="dark"]) #appmock .logo-ai { color: var(--accent); }
html:not([data-theme="dark"]) #appmock .logo-tag {
  color: var(--ink-muted);
  border-color: var(--line);
}
html:not([data-theme="dark"]) #appmock .status { color: var(--ink-muted); }
html:not([data-theme="dark"]) #appmock .status-dot { background: var(--green); }
html:not([data-theme="dark"]) #appmock .sep { background: var(--line); }
html:not([data-theme="dark"]) #appmock .tb-btn {
  border-color: var(--line);
  color: var(--ink);
}
html:not([data-theme="dark"]) #appmock .tb-btn:hover {
  background: var(--accent-dim);
  color: var(--accent);
  border-color: rgba(var(--accent-rgb),.4);
}
html:not([data-theme="dark"]) #appmock .tb-btn svg { stroke: currentColor; }
html:not([data-theme="dark"]) #appmock .tb-icon {
  background: transparent;
  border-color: var(--line);
  color: var(--ink-muted);
}
html:not([data-theme="dark"]) #appmock .tb-icon:hover {
  background: var(--accent-dim);
  color: var(--accent);
  border-color: rgba(var(--accent-rgb),.4);
}
html:not([data-theme="dark"]) #appmock .tb-icon svg { stroke: currentColor; }
html:not([data-theme="dark"]) #appmock .lang-btn {
  border-color: var(--line);
  color: var(--ink-muted);
  background: transparent;
}
html:not([data-theme="dark"]) #appmock .lang-btn:hover {
  background: var(--accent-dim);
  color: var(--accent);
  border-color: rgba(var(--accent-rgb),.4);
}
html:not([data-theme="dark"]) #appmock .hamburger {
  border-color: var(--line);
  color: var(--ink);
  background: transparent;
}
html:not([data-theme="dark"]) #appmock .mobile-menu {
  background: var(--rail);
  border-left-color: var(--line);
  box-shadow: -4px 0 24px rgba(0,0,0,.15);
}
html:not([data-theme="dark"]) #appmock .mobile-menu-overlay {
  background: rgba(0,0,0,.3);
}

/* ── Footer ────────────────────────────────────────────────────────── */
html:not([data-theme="dark"]) #appmock #mock-footer {
  background: var(--rail);
  border-top-color: var(--line);
  color: var(--ink-muted);
}
html:not([data-theme="dark"]) #appmock .footer-brand { color: var(--ink); }
html:not([data-theme="dark"]) #appmock .footer-sep { background: var(--line); }
html:not([data-theme="dark"]) #appmock .footer-link { color: var(--ink-muted); }
html:not([data-theme="dark"]) #appmock .footer-link:hover { color: var(--accent); }
html:not([data-theme="dark"]) #appmock .footer-link svg { stroke: currentColor; }
html:not([data-theme="dark"]) #appmock .footer-oc { color: var(--ink-muted); }
html:not([data-theme="dark"]) #appmock .footer-oc a { color: var(--ink-muted); }
html:not([data-theme="dark"]) #appmock .footer-oc a:hover { color: var(--accent); }
html:not([data-theme="dark"]) #appmock .autosave-switch { color: var(--ink-muted); }
html:not([data-theme="dark"]) #appmock .autosave-track {
  background: rgba(var(--accent-rgb),.14);
  border-color: rgba(var(--accent-rgb),.28);
}
html:not([data-theme="dark"]) #appmock .autosave-knob {
  background: rgba(var(--accent-rgb),.55);
}
html:not([data-theme="dark"]) #appmock .autosave-switch input:checked + .autosave-track {
  background: rgba(var(--accent-rgb),.42);
  border-color: rgba(var(--accent-rgb),.6);
}
html:not([data-theme="dark"]) #appmock .autosave-switch input:checked + .autosave-track .autosave-knob {
  background: var(--accent);
}
html:not([data-theme="dark"]) #appmock .autosave-dot { background: var(--accent); }
html:not([data-theme="dark"]) #appmock .btn-provider {
  border-color: rgba(var(--accent-rgb),.18);
  color: rgba(var(--accent-rgb),.55);
  background: transparent;
}
html:not([data-theme="dark"]) #appmock .btn-provider:hover {
  background: var(--accent-dim);
  color: var(--accent);
  border-color: rgba(var(--accent-rgb),.4);
}
html:not([data-theme="dark"]) #appmock .btn-provider svg { stroke: currentColor; }

/* ── Painel Colab (Estágio 1) ─────────────────────────────────────── */
html:not([data-theme="dark"]) #appmock .panel--colab { background: #e8e6e0; }
html:not([data-theme="dark"]) #appmock .mock-colab { background: #f1efe9; }
html:not([data-theme="dark"]) #appmock .mock-cell {
  background: #fff;
  border-color: #d6d3cb;
  box-shadow: 0 8px 26px rgba(43,45,58,.1);
}
html:not([data-theme="dark"]) #appmock .mock-cell__bar {
  background: #f7f6f2;
  border-bottom-color: #e4e2db;
  color: #8f8d86;
}
html:not([data-theme="dark"]) #appmock .mock-cell__done { color: #5dba7e; }
html:not([data-theme="dark"]) #appmock .mock-cell__out { background: #fff; }
html:not([data-theme="dark"]) #appmock .ufl-panel {
  background: #f6f5f0;
  border-color: rgba(43,45,58,.14);
  box-shadow: 0 14px 34px rgba(43,45,58,.12);
}
html:not([data-theme="dark"]) #appmock .ufl-wordmark { color: #2b2d3a; }
html:not([data-theme="dark"]) #appmock .ufl-wordmark .ufl-ai { color: #b8912f; }
html:not([data-theme="dark"]) #appmock .ufl-rule { background: rgba(43,45,58,.22); }
html:not([data-theme="dark"]) #appmock .ufl-tagline { color: #8f8d86; }
html:not([data-theme="dark"]) #appmock .ufl-barwrap {
  background: #e9e6df;
  border-color: rgba(43,45,58,.15);
}
html:not([data-theme="dark"]) #appmock .ufl-fill {
  background: linear-gradient(90deg,#caa53f,#b8912f 45%,#8f7536);
}
html:not([data-theme="dark"]) #appmock .ufl-pct { color: #8f7536; }
html:not([data-theme="dark"]) #appmock .ufl-row { color: #3c3f4e; }
html:not([data-theme="dark"]) #appmock .ufl-mark { color: #b8912f; }
html:not([data-theme="dark"]) #appmock .ufl-row.bad .ufl-mark,
html:not([data-theme="dark"]) #appmock .ufl-row.bad { color: #a94442; }
html:not([data-theme="dark"]) #appmock .ufl-spin {
  border-color: rgba(184,145,47,.30);
  border-top-color: #b8912f;
}
html:not([data-theme="dark"]) #appmock .ufl-ready {
  font-family: 'Montserrat','Syne',sans-serif;
  font-weight: 700; color: #2b2d3a; font-size: 15px;
}
html:not([data-theme="dark"]) #appmock .ufb-card {
  background: #f6f5f0;
  border-color: rgba(43,45,58,.14);
  box-shadow: 0 14px 34px rgba(43,45,58,.12);
}
html:not([data-theme="dark"]) #appmock .ufb-logo-fallback { color: #2b2d3a; }
html:not([data-theme="dark"]) #appmock .ufb-wm { color: #2b2d3a; }
html:not([data-theme="dark"]) #appmock .ufb-wm .ufl-ai { color: #b8912f; }
html:not([data-theme="dark"]) #appmock .ufb-rule { background: rgba(43,45,58,.22); }
html:not([data-theme="dark"]) #appmock .ufb-tag { color: #8f8d86; }
html:not([data-theme="dark"]) #appmock .ufb-btn {
  color: #2b2d3a;
  background: linear-gradient(135deg, #d3b054 0%, #b8912f 45%, #8f7536 100%);
  box-shadow: 0 6px 18px rgba(143,117,54,.35);
}
html:not([data-theme="dark"]) #appmock .ufb-btn:hover {
  box-shadow: 0 12px 40px rgba(184,145,47,.5), 0 8px 24px rgba(43,45,58,.18);
}
html:not([data-theme="dark"]) #appmock .mock-ports {
  border-color: #d6d3cb;
  background: #f7f6f2;
  color: #3c3f4e;
}
html:not([data-theme="dark"]) #appmock .mock-ports__title { color: #8f8d86; }
html:not([data-theme="dark"]) #appmock .mock-ports__k { color: #2b2d3a; }
html:not([data-theme="dark"]) #appmock .mock-ports__url { color: #6b675e; }
html:not([data-theme="dark"]) #appmock .mock-ports__port {
  background: #2b2d3a;
  color: #f6f5f0;
}
html:not([data-theme="dark"]) #appmock .mock-ports__note { color: #8f8d86; }

/* ── Painel Termos (Estágio 2) ────────────────────────────────────── */
html:not([data-theme="dark"]) #appmock .panel--terms {
  background: rgba(10, 13, 17, .93);
}
html:not([data-theme="dark"]) #appmock #mock-terms-overlay {
  background: rgba(10, 13, 17, .93);
}
html:not([data-theme="dark"]) #appmock #mock-terms-overlay .t-card {
  background: #f5f6f7;
  border-color: #b29149;
  color: #1f262a;
  box-shadow: 0 20px 60px rgba(0,0,0,.25);
}
html:not([data-theme="dark"]) #appmock #mock-terms-overlay .t-brand { color: #1f262a; }
html:not([data-theme="dark"]) #appmock #mock-terms-overlay .t-brand em { color: #b29149; }
html:not([data-theme="dark"]) #appmock #mock-terms-overlay .t-sub { color: #4a5a62; }
html:not([data-theme="dark"]) #appmock #mock-terms-overlay .t-scroll {
  border-color: rgba(178,145,73,.25);
  background: #f1efe9;
  color: #3c3f4e;
}
html:not([data-theme="dark"]) #appmock #mock-terms-overlay .t-scroll h4 { color: #b29149; }
html:not([data-theme="dark"]) #appmock #mock-terms-overlay .t-links a { color: #b29149; }
html:not([data-theme="dark"]) #appmock #mock-terms-overlay label.t-check { color: #3c3f4e; }
html:not([data-theme="dark"]) #appmock #mock-terms-overlay input[type=checkbox] { accent-color: #b29149; }
html:not([data-theme="dark"]) #appmock #mock-terms-overlay .t-ok {
  background: linear-gradient(135deg,#D1A705,#b29149);
  color: #141c24;
  border: none;
}
html:not([data-theme="dark"]) #appmock #mock-terms-overlay .t-no {
  background: transparent;
  color: #9a9790;
  border-color: rgba(154,151,144,.35);
}
html:not([data-theme="dark"]) #appmock #mock-terms-overlay input[type="text"],
html:not([data-theme="dark"]) #appmock #mock-terms-overlay input[type="email"] {
  background: #e8e6e0;
  border-color: rgba(178,145,73,.35);
  color: #1f262a;
}
html:not([data-theme="dark"]) #appmock #mock-terms-overlay input[type="text"]::placeholder,
html:not([data-theme="dark"]) #appmock #mock-terms-overlay input[type="email"]::placeholder {
  color: #8f8d86;
}

/* ── Painel App (Estágio 3) ───────────────────────────────────────── */
html:not([data-theme="dark"]) #appmock .panel--app { background: #f5f6f7; }
html:not([data-theme="dark"]) #appmock .mock-tui { background: #f5f6f7; }
html:not([data-theme="dark"]) #appmock .mock-appframe .app-tabs {
  background: #f5f6f7;
  border-bottom-color: rgba(0,0,0,.1);
  color: #4a5a62;
}
html:not([data-theme="dark"]) #appmock .mock-appframe .app-main { background: #f5f6f7; }
html:not([data-theme="dark"]) #appmock .mock-appframe .term {
  background: #f5f6f7;
  color: #1f262a;
}
html:not([data-theme="dark"]) #appmock .mock-appframe .ctx {
  background: #e8e6e0;
  border-left-color: rgba(0,0,0,.1);
  color: #4a5a62;
}
html:not([data-theme="dark"]) #appmock .mock-appframe .app-status {
  background: #e8e6e0;
  border-top-color: rgba(0,0,0,.1);
  color: #4a5a62;
}

/* ── Chips e linhas do chat (Estágio 3) ───────────────────────────── */
html:not([data-theme="dark"]) #appmock .mock-appframe .term-chip--ok {
  color: #2e7d32;
  border-color: rgba(46,125,50,.45);
}
html:not([data-theme="dark"]) #appmock .mock-appframe .term-chip--none {
  color: #c62828;
  border-color: rgba(198,40,40,.45);
}
html:not([data-theme="dark"]) #appmock .mock-appframe .term-line--sys { color: #2e7d32; }
html:not([data-theme="dark"]) #appmock .mock-appframe .term-line--thought { color: #4a5a62; }
html:not([data-theme="dark"]) #appmock .mock-appframe .term-line--thought b { color: #8a6d33; }
html:not([data-theme="dark"]) #appmock .mock-appframe .term-src { color: #6b675e; }
html:not([data-theme="dark"]) #appmock .mock-appframe .term-line--user::before { color: #8a6d33; }

/* ── Boot splash / overlays ───────────────────────────────────────── */
html:not([data-theme="dark"]) #appmock #mock-boot-splash {
  background: var(--surface, #f5f6f7);
}
html:not([data-theme="dark"]) #appmock .boot-status { color: var(--ink-muted); }
html:not([data-theme="dark"]) #appmock .boot-bar {
  background: rgba(var(--accent-rgb), .15);
}
html:not([data-theme="dark"]) #appmock .boot-bar::after {
  background: linear-gradient(90deg, transparent, var(--accent), transparent);
}
html:not([data-theme="dark"]) #appmock .boot-error { color: var(--red); }
html:not([data-theme="dark"]) #appmock .boot-retry {
  background: var(--accent-dim);
  color: var(--accent);
  border-color: rgba(var(--accent-rgb), .35);
}
html:not([data-theme="dark"]) #appmock #exit-overlay {
  background: rgba(10,13,17,.96);
}
html:not([data-theme="dark"]) #appmock #exit-overlay .t-card {
  background: #f5f6f7;
  border-color: #b29149;
  color: #1f262a;
}
html:not([data-theme="dark"]) #appmock #exit-overlay .t-brand { color: #1f262a; }
html:not([data-theme="dark"]) #appmock #exit-overlay .t-brand em { color: #b29149; }
html:not([data-theme="dark"]) #appmock #exit-overlay .e-msg { color: #3c3f4e; }
html:not([data-theme="dark"]) #appmock #welcome-overlay {
  background: rgba(10,13,17,.93);
}
html:not([data-theme="dark"]) #appmock #welcome-overlay .w-card {
  background: #f5f6f7;
  border-color: #b29149;
  color: #1f262a;
}
html:not([data-theme="dark"]) #appmock #welcome-overlay .w-brand { color: #1f262a; }
html:not([data-theme="dark"]) #appmock #welcome-overlay .w-brand em { color: #b29149; }
html:not([data-theme="dark"]) #appmock #welcome-overlay .w-title { color: #1f262a; }
html:not([data-theme="dark"]) #appmock #welcome-overlay .w-sub { color: #4a5a62; }
html:not([data-theme="dark"]) #appmock #welcome-overlay .w-email {
  background: rgba(178,145,73,.12);
  border-color: rgba(178,145,73,.4);
  color: #8a6d33;
}
html:not([data-theme="dark"]) #appmock #welcome-overlay .w-note { color: #6b675e; }
html:not([data-theme="dark"]) #appmock #welcome-overlay .w-ok {
  background: linear-gradient(135deg,#D1A705,#b29149);
  color: #141c24;
}
html:not([data-theme="dark"]) #appmock #welcome-overlay .w-switch {
  color: #9a9790;
  border-color: rgba(154,151,144,.35);
}