:root {
  --ink:#0e1116; --surface:#151a21; --surface-raised:#1d242d; --surface-hover:#252e38;
  --border:#29323d; --text:#eceff3; --text-muted:#8f9aa9; --text-faint:#626d7d;
  --accent:#e8a33d; --accent-deep:#bd7419; --accent-ink:#171009;
  --danger:#ef8f8f; --success:#7fd29c; --queue:#89b9ff;
  --font-display:"Space Grotesk",sans-serif; --font-body:"Inter",sans-serif; --font-mono:"JetBrains Mono",monospace;
  --radius:11px; --radius-sm:7px; --sidebar-w:286px;
}
body[data-theme="light"]{
  --ink:#f7f8fa; --surface:#ffffff; --surface-raised:#f0f2f5; --surface-hover:#e6e9ee;
  --border:#d9dee6; --text:#161a20; --text-muted:#5e6877; --text-faint:#8993a2;
  --accent:#d88a20; --accent-deep:#b46a12; --accent-ink:#fff8ed; --danger:#b34c52; --success:#2d8a55; --queue:#346fb8;
}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{background:var(--ink);color:var(--text);font:15px/1.6 var(--font-body);-webkit-font-smoothing:antialiased}
button,textarea,select{font:inherit;color:inherit}
button{-webkit-tap-highlight-color:transparent}
#app{display:grid;grid-template-columns:var(--sidebar-w) minmax(0,1fr);height:100dvh;overflow:hidden}
#sidebar{background:var(--surface);border-right:1px solid var(--border);display:flex;flex-direction:column;min-width:0;padding:14px 12px 12px;gap:12px;overflow:hidden}
.sidebar-top,#chat-header{display:flex;align-items:center}
.sidebar-top{justify-content:space-between;padding:2px 3px}
.brand{display:flex;align-items:center;gap:9px}
.brand-button{border:0;background:transparent;padding:0;cursor:pointer}
.brand-mark{width:30px;height:30px;border-radius:9px;background:linear-gradient(145deg,#FFD34E,#E5A900);color:#111;display:grid;place-items:center;font:800 17px var(--font-display);box-shadow:0 0 12px rgba(255,193,7,.16)}
.brand-name{font:600 16px var(--font-display);letter-spacing:.01em}.brand-ia{color:#F2F2F2}.brand-name{color:#FFC107}
.new-chat-btn{width:100%;display:flex;align-items:center;gap:8px;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface-raised);padding:10px 11px;cursor:pointer;text-align:left;transition:.16s ease}
.new-chat-btn:hover{background:var(--surface-hover);border-color:var(--accent-deep)}
.new-chat-btn .plus{color:var(--accent);font-size:18px;line-height:1}
.shortcut{margin-left:auto;color:var(--text-faint);font-size:10px}
.sidebar-section{min-height:0;display:flex;flex-direction:column}
.section-title{padding:2px 8px 7px;color:var(--text-faint);font-size:11px;text-transform:uppercase;letter-spacing:.07em}
.section-title-row{display:flex;align-items:center;justify-content:space-between;gap:6px}
.history-item-title{min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.history-edit-btn{width:24px;height:24px;flex:0 0 auto;border:0;border-radius:6px;background:transparent;color:var(--text-faint);display:grid;place-items:center;cursor:pointer;font-size:13px;line-height:1}
.history-edit-btn:hover{background:var(--surface-hover);color:var(--text)}
.history-edit-btn:focus-visible{outline:1px solid var(--accent-deep);outline-offset:1px}
.history-section-edit-btn{width:22px;height:22px;font-size:12px}
.history-item .history-edit-btn{opacity:0;transition:opacity .12s ease}
.history-item:hover .history-edit-btn,
.history-item:focus-within .history-edit-btn,
.history-item.active .history-edit-btn{opacity:1}
.history-list{overflow-y:auto;display:flex;flex-direction:column;gap:2px;max-height:44vh;padding-right:2px}
.history-group-label{color:var(--text-faint);font-size:11px;padding:11px 8px 4px}
.history-group-label:first-child{padding-top:4px}
.history-item{display:flex;align-items:center;gap:8px;min-height:36px;padding:7px 10px;border:1px solid transparent;border-radius:var(--radius-sm);color:var(--text-muted);cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13.5px}
.history-item::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--text-faint);flex:0 0 auto}
.history-item:hover{background:var(--surface-raised);color:var(--text)}
.history-item.active{background:var(--surface-raised);border-color:var(--border);color:var(--text)}
.history-item.active::before{background:var(--accent)}
.history-empty{color:var(--text-faint);font-size:12px;line-height:1.45;padding:7px 8px}
.sidebar-spacer{flex:1;min-height:8px}
.sidebar-tools{border-top:1px solid var(--border);padding-top:10px;display:grid;gap:2px}
.sidebar-tool{width:100%;border:0;background:transparent;color:var(--text-muted);display:grid;grid-template-columns:24px 1fr auto;align-items:center;gap:5px;padding:7px 8px;border-radius:var(--radius-sm);text-align:left;opacity:.58}
.sidebar-tool small{color:var(--text-faint);font-size:9px}
.sidebar-bottom{border-top:1px solid var(--border);padding-top:10px;display:grid;gap:6px}
.model-label{font-size:11px;color:var(--text-faint);padding-left:2px}
.model-select{width:100%;background:var(--surface-raised);border:1px solid var(--border);border-radius:var(--radius-sm);padding:9px 10px;outline:0;cursor:pointer;font-size:12.5px}
.model-select:focus{border-color:var(--accent-deep)}
.status-row{display:flex;align-items:center;gap:7px;color:var(--text-faint);font-size:11px;padding-left:2px}
.status-dot{width:7px;height:7px;border-radius:50%;background:var(--danger)}
.status-dot.online{background:var(--success)}
#main{position:relative;min-width:0;min-height:0;height:100%;display:flex;flex-direction:column;transition:transform .22s ease}
#chat-header{position:relative;z-index:10;flex:0 0 auto;justify-content:space-between;gap:10px;border-bottom:1px solid var(--border);padding:10px 20px;background:color-mix(in srgb,var(--ink) 92%,transparent);backdrop-filter:blur(14px)}
.header-title-wrap{flex:1;min-width:0}
#current-chat-title{margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:500 15px var(--font-display)}
.chat-title-row{display:flex;align-items:center;gap:4px;min-width:0}
.chat-title-edit-btn{
  width:26px;
  height:26px;
  flex:0 0 auto;
  border:0;
  border-radius:6px;
  background:transparent;
  color:var(--text-faint);
  display:grid;
  place-items:center;
  cursor:pointer;
  font-size:14px;
  line-height:1;
}
.chat-title-edit-btn:hover{
  background:var(--surface-raised);
  color:var(--text);
}
.header-model-select{max-width:min(240px,34vw);min-width:110px;background:var(--surface-raised);border:1px solid var(--border);border-radius:8px;padding:7px 9px;color:var(--text);font-size:11.5px;outline:0;cursor:pointer}
.header-model-select:focus{border-color:var(--accent-deep)}
.current-model-label{display:block;margin-top:1px;color:var(--text-faint);font-size:10.5px}
.icon-btn,.composer-icon{width:34px;height:34px;border:0;border-radius:var(--radius-sm);background:transparent;color:var(--text-muted);display:grid;place-items:center;cursor:pointer}
.icon-btn:hover,.composer-icon:hover:not(:disabled){background:var(--surface-raised);color:var(--text)}
.mobile-only{display:none}
#messages{
  position:relative;
  isolation:isolate;
  flex:1;
  min-height:0;
  overflow-y:auto;
  padding:26px 20px 16px;
  scroll-behavior:smooth;
  background:#000000;
}

#messages::before,
#messages::after{
  content:none;
}

#messages > *{
  position:relative;
  z-index:1;
}
.empty-state{width:min(620px,100%);margin:12vh auto 0;text-align:center}
.empty-mark{width:48px;height:48px;margin:0 auto 14px;border-radius:14px;background:linear-gradient(145deg,var(--accent),var(--accent-deep));color:var(--accent-ink);display:grid;place-items:center;font:700 21px var(--font-display)}
.empty-state h2{margin:0 0 8px;font:600 22px/1.25 var(--font-display)}
.empty-state p{max-width:490px;margin:0 auto;color:var(--text-muted);font-size:13px}
.suggestion-grid{margin-top:24px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.suggestion{padding:11px 12px;text-align:left;border:1px solid var(--border);border-radius:10px;background:var(--surface);color:var(--text-muted);cursor:pointer;font-size:12.5px}
.suggestion:hover{background:var(--surface-raised);color:var(--text)}
.msg-row{width:min(800px,100%);margin:0 auto 24px;display:flex;gap:11px;align-items:flex-start}
.msg-row.user{flex-direction:row-reverse}
.avatar{width:28px;height:28px;border-radius:8px;flex:0 0 28px;display:grid;place-items:center;margin-top:2px;font:600 10px var(--font-display)}
.msg-row.assistant .avatar{background:linear-gradient(145deg,var(--accent),var(--accent-deep));color:var(--accent-ink)}
.msg-row.user .avatar{background:var(--surface-raised);border:1px solid var(--border);color:var(--text-muted)}
.msg-col{min-width:0;max-width:calc(100% - 44px)}
.msg-row.user .msg-col{display:flex;flex-direction:column;align-items:flex-end}
.bubble{font-size:15px;line-height:1.68;overflow-wrap:anywhere}
.msg-row.user .bubble{background:var(--surface-raised);border:1px solid var(--border);padding:9px 13px;border-radius:15px 15px 4px 15px;white-space:pre-wrap}
.msg-row.assistant .bubble{padding-top:1px}
.msg-actions{display:flex;gap:4px;flex-wrap:wrap;margin-top:7px;opacity:.45;transition:opacity .12s}
.msg-row:hover .msg-actions,.msg-actions:focus-within{opacity:1}
.msg-actions button,.code-copy-btn{border:1px solid var(--border);border-radius:6px;background:var(--surface);color:var(--text-muted);padding:4px 8px;cursor:pointer;font-size:11px}
.msg-actions button:hover,.code-copy-btn:hover{background:var(--surface-raised);color:var(--text)}
.streaming::after{content:"";display:inline-block;width:7px;height:1.05em;margin-left:3px;background:var(--accent);vertical-align:-2px;animation:blink .8s step-start infinite}
@keyframes blink{50%{opacity:0}}
.bubble h1,.bubble h2,.bubble h3{font-family:var(--font-display);line-height:1.3;margin:18px 0 8px}
.bubble h1{font-size:20px}.bubble h2{font-size:18px}.bubble h3{font-size:16px}
.bubble p{margin:0 0 10px}.bubble p:last-child{margin-bottom:0}
.bubble ul,.bubble ol{margin:0 0 10px;padding-left:22px}.bubble li{margin-bottom:4px}
.bubble a{color:var(--accent)}


.web-search-banner{
  display:flex;
  align-items:center;
  gap:8px;
  width:min(800px,100%);
  box-sizing:border-box;
  margin:0 auto 8px;
  padding:8px 10px;
  border:1px solid #f5a623;
  border-radius:10px;
  background:rgba(245,166,35,.12);
  color:#f5a623;
  font-size:13px;
  line-height:1.3;
  font-weight:600;
  box-shadow:0 0 14px rgba(245,166,35,.16);
}
.web-search-banner[hidden]{
  display:none !important;
}
.web-search-icon{
  font-size:17px;
  font-weight:700;
  animation:webSearchPulse 1.1s ease-in-out infinite;
}
.web-search-dots{
  animation:webSearchDots 1.1s steps(4,end) infinite;
  overflow:hidden;
  min-width:18px;
}

@keyframes webSearchPulse{
  0%,100%{opacity:.45;transform:scale(.9)}
  50%{opacity:1;transform:scale(1.1)}
}
@keyframes webSearchDots{
  0%{width:0}
  100%{width:18px}
}
.web-sources{
  margin-top:12px;
  padding:10px 12px;
  border:1px solid var(--border);
  border-radius:10px;
  background:var(--surface-raised);
  display:flex;
  flex-direction:column;
  gap:5px;
}
.web-sources-title{
  font-size:12px;
  font-weight:600;
  color:var(--text-muted);
  margin-bottom:2px;
}
.web-source{
  display:flex;
  flex-direction:column;
  gap:2px;
  padding:3px 0;
}
.web-source-title{
  display:inline-flex;
  align-items:center;
  gap:6px;
  width:max-content;
  max-width:100%;
  font-size:12px;
  line-height:1.4;
  color:var(--accent);
  text-decoration:none;
  overflow-wrap:anywhere;
}
.web-source-title:hover{
  text-decoration:underline;
}
.web-source-external{
  font-size:12px;
  opacity:.8;
}
.web-source-url{
  font-size:11px;
  line-height:1.35;
  color:var(--text-muted);
  text-decoration:none;
  overflow-wrap:anywhere;
}
.web-source-url:hover{
  color:var(--accent);
  text-decoration:underline;
}

.bubble blockquote{margin:12px 0;padding:2px 0 2px 12px;border-left:2px solid var(--accent-deep);color:var(--text-muted)}
.bubble code{font-family:var(--font-mono);font-size:.87em;background:var(--surface-raised);padding:1px 5px;border-radius:5px}
.bubble table{width:100%;border-collapse:collapse;margin:12px 0;font-size:13px}
.bubble th,.bubble td{border:1px solid var(--border);padding:7px 9px;text-align:left}
.bubble th{background:var(--surface-raised)}
.code-block{margin:12px 0;overflow:hidden;border:1px solid var(--border);border-radius:var(--radius);background:var(--ink)}
.code-head{display:flex;align-items:center;justify-content:space-between;padding:7px 10px;border-bottom:1px solid var(--border);background:var(--surface-raised)}
.code-lang{color:var(--text-faint);font:11px var(--font-mono)}
.code-block pre{margin:0;padding:12px 14px;overflow-x:auto}
.code-block pre code{background:transparent;padding:0;font:13px/1.55 var(--font-mono)}
.queue-banner{width:min(800px,100%);margin:0 auto 7px;border:1px solid color-mix(in srgb,var(--queue) 35%,var(--border));border-radius:9px;background:color-mix(in srgb,var(--queue) 9%,var(--surface));color:var(--queue);padding:8px 10px;font-size:11.5px}
.error-banner{width:min(800px,100%);margin:0 auto 8px;padding:9px 11px;border:1px solid color-mix(in srgb,var(--danger) 30%,var(--border));border-radius:9px;background:color-mix(in srgb,var(--danger) 7%,var(--surface));color:var(--danger);font-size:12px}
#composer-wrap{position:relative;z-index:10;flex:0 0 auto;padding:9px 20px 14px;background:linear-gradient(to bottom,transparent,var(--ink) 24%,var(--ink) 100%)}
#composer{width:min(800px,100%);margin:0 auto;display:flex;align-items:flex-end;gap:7px;padding:8px;border:1px solid var(--border);border-radius:17px;background:var(--surface-raised)}
#composer:focus-within{border-color:var(--accent-deep)}
#prompt-input{flex:1;min-width:0;max-height:220px;resize:none;overflow-y:auto;border:0;outline:0;background:transparent;padding:6px 2px;font-size:14.5px;line-height:1.5}
#prompt-input::placeholder{color:var(--text-faint)}
.composer-icon:disabled{opacity:.35;cursor:default}
.cancel-edit-btn{border:1px solid var(--border);background:var(--surface);color:var(--text-muted);border-radius:8px;padding:7px 9px;font-size:11px;cursor:pointer}
.cancel-edit-btn:hover{color:var(--text);background:var(--surface-hover)}
#send-btn,.stop-btn{width:36px;height:36px;border:0;border-radius:11px;display:grid;place-items:center;flex:0 0 auto}
#send-btn{background:var(--accent);color:var(--accent-ink);cursor:pointer}
#send-btn:hover{filter:brightness(1.06)}#send-btn:disabled{cursor:default;opacity:.35}
.stop-btn{background:var(--surface);border:1px solid var(--border);cursor:pointer}.stop-btn span{width:11px;height:11px;background:var(--text);border-radius:2px}
.composer-hint{margin:7px 0 0;text-align:center;color:var(--text-faint);font-size:10.5px}
.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,10px);opacity:0;pointer-events:none;z-index:100;background:var(--surface-raised);border:1px solid var(--border);color:var(--text);padding:8px 12px;border-radius:9px;font-size:11px;transition:.18s ease}
.toast.show{opacity:1;transform:translate(-50%,0)}

.plan-status{
  margin-top:7px;
  padding:7px 8px;
  border:1px solid var(--border);
  border-radius:9px;
  background:var(--surface-raised);
  display:grid;
  gap:7px;
}

.plan-status-main{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  font-size:10px;
}

.plan-status-main strong{
  letter-spacing:.08em;
  font-size:10px;
}

.plan-status-main span{
  color:var(--text-muted);
}

.plan-status.free{
  border-color:color-mix(in srgb,var(--accent) 24%,var(--border));
}

.plan-status.premium{
  border-color:color-mix(in srgb,var(--success) 32%,var(--border));
}

.plan-status.premium strong{
  color:var(--success);
}

.plan-upgrade-btn,
.upgrade-inline-btn{
  border:1px solid color-mix(in srgb,var(--accent) 45%,var(--border));
  border-radius:7px;
  background:color-mix(in srgb,var(--accent) 12%,var(--surface));
  color:var(--accent);
  cursor:pointer;
  font-size:10px;
  padding:5px 8px;
}

.plan-upgrade-btn:hover,
.upgrade-inline-btn:hover{
  background:color-mix(in srgb,var(--accent) 19%,var(--surface));
}

.free-upgrade-banner[hidden]{
  display:none !important;
}

.free-upgrade-banner{
  width:min(800px,100%);
  margin:0 auto 7px;
  padding:9px 11px;
  border:1px solid color-mix(in srgb,var(--accent) 30%,var(--border));
  border-radius:9px;
  background:color-mix(in srgb,var(--accent) 7%,var(--surface));
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  color:var(--text);
  font-size:11.5px;
}

.free-upgrade-banner > div{
  min-width:0;
  display:grid;
  gap:1px;
}

.free-upgrade-banner strong{
  font-size:11.5px;
}

.free-upgrade-banner span{
  color:var(--text-muted);
}

.free-upgrade-banner.limit{
  border-color:color-mix(in srgb,var(--danger) 38%,var(--border));
  background:color-mix(in srgb,var(--danger) 8%,var(--surface));
}

.free-upgrade-banner.limit strong{
  color:var(--danger);
}

.free-upgrade-banner.subtle{
  opacity:.82;
}

@media(max-width:700px){
  .free-upgrade-banner{
    align-items:flex-start;
    flex-direction:column;
  }

  .upgrade-inline-btn{
    width:100%;
  }
}

#sidebar-overlay{display:none;position:fixed;inset:0;z-index:40;background:rgba(0,0,0,.55)}
.history-list::-webkit-scrollbar,#messages::-webkit-scrollbar,#prompt-input::-webkit-scrollbar{width:6px}
.history-list::-webkit-scrollbar-thumb,#messages::-webkit-scrollbar-thumb,#prompt-input::-webkit-scrollbar-thumb{background:var(--border);border-radius:5px}

@media (max-width:820px){
  #app{grid-template-columns:1fr}
  #sidebar{position:fixed;inset:0 auto 0 0;width:min(var(--sidebar-w),86vw);z-index:50;transform:translateX(-102%);transition:transform .22s ease;box-shadow:15px 0 40px rgba(0,0,0,.35)}
  #app.sidebar-open #sidebar{transform:translateX(0)}
  #app.sidebar-open #sidebar-overlay{display:block}
  .mobile-only{display:grid}
  #chat-header{position:relative;padding:9px 10px}
  .header-model-select{max-width:42vw;min-width:0;font-size:10.5px;padding:6px 7px}
  #messages{padding:18px 12px 10px}
  #composer-wrap{padding:8px 10px 10px}
  .msg-row{margin-bottom:20px}.msg-col{max-width:calc(100% - 40px)}
  .suggestion-grid{grid-template-columns:1fr}.shortcut{display:none}
  #main.swipe-shift{transform:translateX(-18px)}
}
@media (prefers-reduced-motion:reduce){
  *{scroll-behavior:auto!important;animation:none!important;transition:none!important}
}
button:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:1px}

.auth-screen{
  position:fixed;inset:0;z-index:200;display:grid;place-items:center;
  padding:20px;background:var(--ink);
}
.auth-screen[hidden]{display:none}
.auth-card{
  width:min(420px,100%);padding:26px;border:1px solid var(--border);
  border-radius:18px;background:var(--surface);box-shadow:0 25px 80px rgba(0,0,0,.25)
}
.auth-brand{margin-bottom:24px}
.auth-card h2{margin:0 0 5px;font:600 22px var(--font-display)}
.auth-card p{margin:0 0 20px;color:var(--text-muted);font-size:13px}
.auth-card label{display:block;margin:11px 0 5px;color:var(--text-muted);font-size:12px}
.auth-card input{
  width:100%;padding:10px 11px;border:1px solid var(--border);
  border-radius:9px;background:var(--surface-raised);outline:0
}
.auth-card input:focus{border-color:var(--accent-deep)}
#auth-submit{
  width:100%;margin-top:16px;padding:10px;border:0;border-radius:9px;
  background:var(--accent);color:var(--accent-ink);cursor:pointer;font-weight:600
}
.auth-switch{
  width:100%;margin-top:10px;padding:8px;border:0;background:transparent;
  color:var(--accent);cursor:pointer
}
.auth-error{margin-top:12px;color:var(--danger);font-size:12px}
.account-box{
  display:flex;align-items:center;gap:6px;padding:8px 2px 2px
}
.account-email{
  flex:1;min-width:0;color:var(--text-faint);font-size:10.5px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap
}
.account-action{
  border:1px solid var(--border);background:var(--surface-raised);
  color:var(--text-muted);border-radius:7px;padding:5px 7px;cursor:pointer;font-size:10px
}
.account-action:hover{color:var(--text)}
body:not(.authenticated) #app{visibility:hidden}
@media(max-width:820px){.auth-card{padding:22px}}

.msg-time{
  margin-top:4px;
  color:var(--text-faint);
  font-size:10.5px;
  line-height:1.2;
  opacity:.9;
}

.send-stop-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:13px;
  line-height:1;
}

.scroll-bottom-btn{
  position:absolute;
  right:24px;
  bottom:92px;
  width:34px;
  height:34px;
  border:1px solid var(--border);
  border-radius:50%;
  background:var(--surface-raised);
  color:var(--text);
  box-shadow:0 4px 16px rgba(0,0,0,.18);
  display:grid;
  place-items:center;
  cursor:pointer;
  z-index:20;
  font-size:17px;
  line-height:1;
  transition:opacity .18s ease,transform .18s ease,background .18s ease;
}

.scroll-bottom-btn:hover{
  background:var(--surface);
  transform:translateY(-1px);
}

.scroll-bottom-btn[hidden]{
  display:none;
}

@media (max-width:820px){
  .scroll-bottom-btn{
    right:16px;
    bottom:84px;
    width:32px;
    height:32px;
  }
}


/* ============================================================
   PIECES JOINTES
   ============================================================ */

.attachment-preview{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  padding:8px 10px;
}

.attachment-chip{
  display:flex;
  align-items:center;
  gap:7px;
  max-width:260px;
  padding:7px 10px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:var(--surface);
}

.attachment-chip-name{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.attachment-remove{
  width:24px;
  height:24px;
  border:0;
  border-radius:50%;
  background:transparent;
  color:var(--text-muted);
  cursor:pointer;
  font-size:18px;
  line-height:1;
}

.attachment-remove:hover{
  background:var(--surface-2);
}

.message-attachments{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin-top:8px;
}

.message-attachment{
  display:flex;
  align-items:center;
  gap:6px;
  max-width:280px;
  padding:6px 9px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  font-size:13px;
  color:var(--text-muted);
}

.message-attachment span:last-child{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}


/* ============================================================
   FIX BOUTON PIECES JOINTES
   ============================================================ */

#composer{
  position:relative;
}

#attach-btn{
  position:relative;
  z-index:20;
  flex:0 0 34px;
  pointer-events:auto !important;
  cursor:pointer !important;
  touch-action:manipulation;
  -webkit-user-select:none;
  user-select:none;
}

#attach-btn:disabled{
  opacity:1;
  cursor:pointer !important;
  pointer-events:auto !important;
}




/* =========================================================
   IA.YAMO — LANDING
   ========================================================= */


/* =========================================================
   IA.YAMO — LANDING V5
   ========================================================= */


/* =========================================================
   IA.YAMO — LANDING V6
   ========================================================= */


/* =========================================================
   IA.YAMO — LANDING V7
   ========================================================= */

#auth-screen{
  min-height:100vh;
  overflow:auto;
  background:#05070A;
  color:#F5F7FA;
}

.landing-page{
  position:relative;
  min-height:100vh;
  overflow:hidden;
  background:
    radial-gradient(circle at 50% 0%,rgba(245,158,11,.11),transparent 23%),
    radial-gradient(circle at 5% 35%,rgba(245,158,11,.045),transparent 20%),
    #05070A;
}

.landing-page::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.022) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.022) 1px,transparent 1px);
  background-size:56px 56px;
  mask-image:linear-gradient(to bottom,#000 0%,rgba(0,0,0,.82) 34%,transparent 88%);
}

/* NAV */

.landing-nav-v7{
  position:relative;
  z-index:30;
  width:min(1280px,100%);
  margin:auto;
  padding:20px 34px;
  display:flex;
  justify-content:space-between;
  align-items:center;
}

.landing-brand-v7{
  display:flex;
  align-items:center;
  gap:10px;
  color:#F1F3F5;
  text-decoration:none;
  font-size:16px;
  font-weight:700;
}

.landing-mark-v7{
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border-radius:11px;
  background:linear-gradient(135deg,#FFD16A,#F59E0B);
  color:#171008;
  box-shadow:0 8px 28px rgba(245,158,11,.18);
}

.landing-nav-links-v7{
  display:flex;
  align-items:center;
  gap:23px;
}

.landing-nav-links-v7 a{
  color:#79838D;
  text-decoration:none;
  font-size:10px;
}

.landing-nav-links-v7 button{
  padding:9px 14px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:8px;
  background:rgba(255,255,255,.02);
  color:#B9C0C7;
  font-size:10px;
  cursor:pointer;
}

/* HERO */

.hero-v7{
  position:relative;
  z-index:3;
  width:min(1280px,100%);
  min-height:calc(100vh - 79px);
  margin:auto;
  padding:42px 34px 60px;
}

.hero-bg-number-v7{
  position:absolute;
  z-index:-1;
  top:70px;
  left:50%;
  transform:translateX(-50%);
  color:rgba(255,255,255,.018);
  font-size:clamp(180px,28vw,390px);
  line-height:.8;
  font-weight:800;
  letter-spacing:-15px;
  pointer-events:none;
  user-select:none;
}

.hero-glow-v7{
  position:absolute;
  z-index:-1;
  left:50%;
  top:130px;
  width:680px;
  height:500px;
  transform:translateX(-50%);
  border-radius:50%;
  background:radial-gradient(circle,rgba(245,158,11,.10),transparent 67%);
  filter:blur(25px);
  animation:heroGlowV7 6s ease-in-out infinite alternate;
}

@keyframes heroGlowV7{
  from{opacity:.55;transform:translateX(-50%) scale(.94)}
  to{opacity:1;transform:translateX(-50%) scale(1.06)}
}

.hero-top-v7{
  position:relative;
  z-index:5;
  max-width:900px;
  margin:auto;
  text-align:center;
}

.hero-badge-v7{
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding:8px 12px;
  border:1px solid rgba(255,255,255,.075);
  border-radius:999px;
  background:rgba(255,255,255,.02);
  color:#7D8792;
  font-size:10px;
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}

.hero-badge-v7 span{
  width:6px;
  height:6px;
  border-radius:50%;
  background:#39D79D;
  box-shadow:0 0 13px rgba(57,215,157,.65);
  animation:liveV7 1.8s ease-in-out infinite;
}

@keyframes liveV7{
  0%,100%{opacity:.5;transform:scale(.8)}
  50%{opacity:1;transform:scale(1.18)}
}

.hero-top-v7 h1{
  margin:25px 0 0;
  font-size:clamp(65px,8.2vw,112px);
  line-height:.87;
  letter-spacing:-6px;
  font-weight:700;
}

.hero-top-v7 h1 em{
  font-style:normal;
  background:linear-gradient(100deg,#FFE3A8,#F5A30B 55%,#E77E00);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.hero-top-v7 > p{
  max-width:680px;
  margin:28px auto 0;
  color:#98A1AB;
  font-size:17px;
  line-height:1.65;
}

.hero-cta-v7{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:22px;
  margin-top:29px;
}

.hero-button-v7{
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap:32px;
  min-width:260px;
  padding:15px 15px 15px 19px;
  border:1px solid rgba(255,214,128,.22);
  border-radius:11px;
  background:linear-gradient(135deg,#FFC44C,#F59E0B);
  color:#171006;
  font-size:12px;
  font-weight:700;
  cursor:pointer;
  box-shadow:
    0 16px 42px rgba(245,158,11,.17),
    inset 0 1px 0 rgba(255,255,255,.32);
  transition:.2s ease;
}

.hero-button-v7:hover{
  transform:translateY(-3px);
  box-shadow:
    0 22px 55px rgba(245,158,11,.25),
    inset 0 1px 0 rgba(255,255,255,.35);
}

.hero-button-v7 b{
  width:29px;
  height:29px;
  display:grid;
  place-items:center;
  border-radius:8px;
  background:rgba(0,0,0,.11);
  font-size:16px;
}

.hero-price-v7{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:2px;
}

.hero-price-v7 strong{
  color:#F0F2F4;
  font-size:23px;
}

.hero-price-v7 span{
  color:#6B7580;
  font-size:10px;
}

/* DEMO */

.hero-demo-v7{
  position:relative;
  width:min(1000px,100%);
  min-height:570px;
  margin:53px auto 0;
  display:flex;
  justify-content:center;
  align-items:center;
}

.demo-background-orb-v7{
  position:absolute;
  inset:0;
}

.orbit-v7{
  position:absolute;
  border:1px solid rgba(245,158,11,.085);
  border-radius:50%;
  pointer-events:none;
}

.orbit-a-v7{
  width:760px;
  height:760px;
  animation:orbitA 28s linear infinite;
}

.orbit-b-v7{
  width:555px;
  height:555px;
  border-color:rgba(255,255,255,.045);
  animation:orbitB 24s linear infinite;
}

@keyframes orbitA{
  to{transform:rotate(360deg)}
}

@keyframes orbitB{
  to{transform:rotate(-360deg)}
}

.demo-window-v7{
  position:relative;
  z-index:4;
  width:min(820px,100%);
  overflow:hidden;
  border:1px solid rgba(255,255,255,.105);
  border-radius:19px;
  background:rgba(10,14,19,.92);
  box-shadow:
    0 50px 130px rgba(0,0,0,.55),
    0 0 90px rgba(245,158,11,.06),
    inset 0 1px rgba(255,255,255,.04);
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  animation:windowFloatV7 6s ease-in-out infinite;
}

@keyframes windowFloatV7{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-8px)}
}

.demo-topbar-v7{
  height:44px;
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  padding:0 15px;
  border-bottom:1px solid rgba(255,255,255,.055);
  color:#737D88;
  font-size:9px;
}

.demo-topbar-v7 > strong{
  font-size:9px;
  color:#919AA4;
}

.demo-topbar-v7 > span{
  justify-self:end;
  color:#59636E;
  font-size:8px;
}

.demo-topbar-v7 > span i{
  display:inline-block;
  width:5px;
  height:5px;
  margin-right:4px;
  border-radius:50%;
  background:#39D79D;
}

.demo-dots-v7{
  display:flex;
  gap:5px;
}

.demo-dots-v7 i{
  width:6px;
  height:6px;
  border-radius:50%;
  background:#434D57;
}

.demo-layout-v7{
  display:grid;
  grid-template-columns:155px 1fr;
  min-height:430px;
}

.demo-sidebar-v7{
  padding:16px 11px;
  border-right:1px solid rgba(255,255,255,.055);
  background:rgba(255,255,255,.012);
}

.demo-brand-v7{
  width:31px;
  height:31px;
  display:grid;
  place-items:center;
  margin-bottom:17px;
  border-radius:8px;
  background:#F5A30B;
  color:#160E04;
  font-size:10px;
  font-weight:800;
}

.demo-new-v7{
  display:flex;
  align-items:center;
  gap:7px;
  padding:9px;
  border:1px solid rgba(255,255,255,.065);
  border-radius:8px;
  color:#808B96;
  font-size:8px;
}

.demo-new-v7 b{
  color:#F5A30B;
  font-size:13px;
}

.demo-sidebar-v7 > small{
  display:block;
  margin:21px 5px 9px;
  color:#4D5761;
  font-size:7px;
  letter-spacing:1px;
}

.demo-option-v7{
  width:100%;
  display:flex;
  align-items:center;
  gap:8px;
  padding:8px 6px;
  margin:5px 0;
  border:1px solid transparent;
  border-radius:8px;
  background:transparent;
  color:#67727D;
  text-align:left;
  cursor:pointer;
}

.demo-option-v7 b{
  width:23px;
  height:23px;
  display:grid;
  place-items:center;
  border-radius:7px;
  background:rgba(255,255,255,.025);
  font-size:8px;
}

.demo-option-v7 span{
  font-size:8px;
  font-weight:600;
}

.demo-option-v7.active{
  border-color:rgba(245,158,11,.12);
  background:rgba(245,158,11,.065);
  color:#C0C7CE;
}

.demo-option-v7.active b{
  color:#F5A30B;
  background:rgba(245,158,11,.1);
}

.demo-main-v7{
  position:relative;
  min-width:0;
  padding:22px;
}

.demo-model-v7{
  display:flex;
  align-items:center;
  gap:10px;
}

.demo-model-v7 > div{
  width:32px;
  height:32px;
  display:grid;
  place-items:center;
  border:1px solid rgba(245,158,11,.15);
  border-radius:9px;
  background:rgba(245,158,11,.09);
  color:#F2B438;
  font-size:10px;
  font-weight:700;
}

.demo-model-v7 section small{
  display:block;
  color:#525C66;
  font-size:6px;
  letter-spacing:1px;
}

.demo-model-v7 section strong{
  display:block;
  margin-top:3px;
  color:#D2D8DD;
  font-size:11px;
}

.demo-model-v7 > span{
  margin-left:auto;
  color:#5D6873;
  font-size:8px;
}

.demo-model-v7 > span i{
  display:inline-block;
  width:5px;
  height:5px;
  margin-right:4px;
  border-radius:50%;
  background:#39D79D;
}

.demo-chat-v7{
  margin-top:45px;
}

.demo-user-v7{
  width:max-content;
  max-width:72%;
  margin-left:auto;
  padding:10px 12px;
  border-radius:10px;
  background:#1A2027;
  color:#A0AAB4;
  font-size:9px;
  line-height:1.5;
}

.demo-answer-v7{
  display:flex;
  gap:10px;
  margin-top:21px;
}

.demo-avatar-v7{
  width:29px;
  height:29px;
  flex:0 0 auto;
  display:grid;
  place-items:center;
  border-radius:8px;
  background:rgba(245,158,11,.08);
  border:1px solid rgba(245,158,11,.13);
  color:#F3B53A;
  font-size:9px;
  font-weight:800;
}

.demo-answer-v7 > div:last-child{
  min-width:0;
  flex:1;
}

.demo-answer-v7 small{
  display:block;
  margin-bottom:6px;
  color:#68727D;
  font-size:8px;
}

.demo-answer-v7 small em{
  color:#4E5964;
  font-style:normal;
}

.demo-answer-v7 p{
  margin:0;
  color:#A4ADB6;
  font-size:10px;
  line-height:1.65;
}

.demo-code-v7{
  margin-top:13px;
  padding:12px;
  border:1px solid rgba(255,255,255,.05);
  border-radius:9px;
  background:#090D12;
  color:#707A85;
  font:7px/1.9 "JetBrains Mono",monospace;
}

.demo-code-v7 span{
  display:block;
}

.demo-code-v7 span:nth-child(2){
  color:#A0A9B2;
}

.demo-code-v7 b{
  display:block;
  margin-top:5px;
  color:#39CC96;
}

.demo-code-v7[hidden]{
  display:none;
}

.demo-input-v7{
  position:absolute;
  left:22px;
  right:22px;
  bottom:20px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:10px 11px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:9px;
  background:rgba(255,255,255,.015);
  color:#5C6671;
  font-size:8px;
}

.demo-input-v7 b{
  width:22px;
  height:22px;
  display:grid;
  place-items:center;
  border-radius:6px;
  background:#F5A30B;
  color:#160F05;
}

.demo-caption-v7{
  position:absolute;
  z-index:8;
  left:50%;
  bottom:-5px;
  transform:translateX(-50%);
  display:flex;
  gap:3px;
  padding:4px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:999px;
  background:rgba(8,11,15,.94);
  box-shadow:0 12px 35px rgba(0,0,0,.35);
}

.demo-caption-v7 span{
  padding:7px 10px;
  border-radius:999px;
  color:#58626D;
  font-size:7px;
  cursor:pointer;
}

.demo-caption-v7 span.active{
  background:rgba(245,158,11,.11);
  color:#E6A63A;
}

.demo-v7-swap{
  animation:demoV7Swap .35s ease both;
}

@keyframes demoV7Swap{
  from{opacity:0;transform:translateY(5px)}
  to{opacity:1;transform:translateY(0)}
}

/* FLOATING CHIPS */

.hero-float-v7{
  position:absolute;
  z-index:9;
  display:flex;
  align-items:center;
  gap:8px;
  padding:9px 12px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:10px;
  background:rgba(14,18,23,.84);
  box-shadow:0 15px 40px rgba(0,0,0,.3);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  animation:floatV7 5s ease-in-out infinite;
}

.hero-float-v7 b{
  width:27px;
  height:27px;
  display:grid;
  place-items:center;
  border-radius:8px;
  background:rgba(245,158,11,.08);
  color:#F3B53A;
  font-size:9px;
}

.hero-float-v7 span{
  color:#B6BEC5;
  font-size:9px;
  font-weight:600;
}

.float-one-v7{
  top:86px;
  left:0;
}

.float-two-v7{
  top:15px;
  right:55px;
  animation-delay:-1.4s;
}

.float-three-v7{
  right:-5px;
  bottom:84px;
  animation-delay:-2.7s;
}

.float-four-v7{
  bottom:15px;
  left:70px;
  animation-delay:-4s;
}

@keyframes floatV7{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-9px)}
}

.hero-bottom-v7{
  position:relative;
  z-index:5;
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:18px;
  margin-top:37px;
  color:#69737E;
  font-size:10px;
}

/* SECTIONS */

.usages-v7,
.documents-v7,
.pricing-v7,
.final-v7{
  position:relative;
  z-index:4;
  width:min(1260px,100%);
  margin:auto;
}

.usages-v7{
  padding:125px 34px 130px;
}

.section-label-v7{
  color:#636E79;
  font-size:9px;
  letter-spacing:1.2px;
  font-weight:600;
}

.section-title-v7{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:40px;
  margin-top:13px;
}

.section-title-v7 h2{
  margin:0;
  font-size:clamp(43px,5vw,68px);
  line-height:.95;
  letter-spacing:-3.1px;
}

.section-title-v7 h2 em{
  color:#F5A30B;
  font-style:normal;
}

.section-title-v7 p{
  max-width:280px;
  margin:0 0 3px;
  color:#78838E;
  font-size:12px;
  line-height:1.6;
}

.usage-grid-v7{
  display:grid;
  grid-template-columns:1.22fr 1fr 1fr;
  gap:11px;
  margin-top:42px;
}

.usage-card-v7{
  position:relative;
  min-height:300px;
  padding:23px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.065);
  border-radius:15px;
  background:linear-gradient(145deg,rgba(255,255,255,.025),rgba(255,255,255,.008));
  transition:.25s ease;
}

.usage-card-v7:hover{
  transform:translateY(-5px);
  border-color:rgba(245,158,11,.16);
}

.card-main-v7{
  grid-row:span 2;
  min-height:612px;
}

.usage-wide-v7{
  grid-column:2 / 4;
  min-height:300px;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
}

.card-index-v7{
  position:absolute;
  top:20px;
  right:20px;
  color:#404A54;
  font:8px "JetBrains Mono",monospace;
}

.usage-icon-v7{
  width:33px;
  height:33px;
  display:grid;
  place-items:center;
  margin-bottom:35px;
  border:1px solid rgba(245,158,11,.12);
  border-radius:9px;
  background:rgba(245,158,11,.065);
  color:#F1AE33;
  font-size:10px;
  font-weight:700;
}

.usage-card-v7 > small,
.usage-wide-v7 small{
  color:#6A7580;
  font-size:8px;
  letter-spacing:1.15px;
}

.usage-card-v7 h3,
.usage-wide-v7 h3{
  margin:10px 0 0;
  color:#D7DCE1;
  font-size:27px;
  line-height:1.02;
  letter-spacing:-1.25px;
}

.usage-card-v7 h3 em,
.usage-wide-v7 h3 em{
  color:#F5A30B;
  font-style:normal;
}

.usage-card-v7 p,
.usage-wide-v7 p{
  max-width:420px;
  margin:15px 0 0;
  color:#6E7984;
  font-size:11px;
  line-height:1.6;
}

.code-art-v7{
  position:absolute;
  left:23px;
  right:23px;
  bottom:22px;
  padding:17px;
  border:1px solid rgba(255,255,255,.045);
  border-radius:10px;
  background:#090D12;
  color:#68737E;
  font:8px/1.9 "JetBrains Mono",monospace;
}

.code-art-v7 span{
  color:#E8A72C;
}

.code-art-v7 b{
  color:#A0A9B2;
}

.code-art-v7 i{
  color:#36C895;
  font-style:normal;
}

.thinking-art-v7{
  position:absolute;
  right:23px;
  bottom:23px;
  display:flex;
  align-items:flex-end;
  gap:4px;
}

.thinking-art-v7 i{
  width:5px;
  border-radius:4px 4px 0 0;
  background:rgba(245,158,11,.42);
}

.thinking-art-v7 i:nth-child(1){height:13px}
.thinking-art-v7 i:nth-child(2){height:28px}
.thinking-art-v7 i:nth-child(3){height:20px}
.thinking-art-v7 i:nth-child(4){height:37px}
.thinking-art-v7 i:nth-child(5){height:24px}

.write-art-v7{
  position:absolute;
  right:23px;
  bottom:25px;
  width:90px;
}

.write-art-v7 i{
  display:block;
  height:6px;
  margin:7px 0;
  border-radius:4px;
  background:#272E36;
}

.write-art-v7 i:nth-child(2){width:72%}
.write-art-v7 i:nth-child(3){width:52%}
.write-art-v7 i:nth-child(4){width:66%}

.freedom-art-v7{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  justify-content:flex-end;
}

.freedom-art-v7 span{
  padding:7px 9px;
  border:1px solid rgba(245,158,11,.1);
  border-radius:999px;
  color:#7A848F;
  font-size:7px;
  letter-spacing:1px;
}

/* DOCUMENTS */

.documents-v7{
  padding:60px 34px 140px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:90px;
  align-items:center;
}

.documents-visual-v7{
  position:relative;
  min-height:470px;
  display:grid;
  place-items:center;
}

.documents-ring-v7{
  position:absolute;
  width:405px;
  height:405px;
  border:1px solid rgba(245,158,11,.085);
  border-radius:50%;
  animation:documentsRingV7 7s ease-in-out infinite alternate;
}

@keyframes documentsRingV7{
  from{transform:scale(.94);opacity:.45}
  to{transform:scale(1.06);opacity:1}
}

.documents-core-v7{
  position:relative;
  z-index:2;
  width:220px;
  height:220px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  border:1px solid rgba(255,255,255,.08);
  border-radius:27px;
  background:rgba(14,18,23,.9);
  box-shadow:0 30px 85px rgba(0,0,0,.4);
}

.documents-core-v7 > div{
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  margin-bottom:17px;
  border-radius:12px;
  background:#F5A30B;
  color:#160E04;
  font-weight:800;
}

.documents-core-v7 strong{
  color:#D5DBDF;
  font-size:13px;
}

.documents-core-v7 span{
  margin-top:5px;
  color:#6A7580;
  font-size:9px;
}

.documents-core-v7 b{
  margin-top:16px;
  color:#F5A30B;
  font-size:17px;
}

.document-card-v7{
  position:absolute;
  z-index:4;
  display:flex;
  align-items:center;
  gap:9px;
  padding:10px;
  border:1px solid rgba(255,255,255,.075);
  border-radius:10px;
  background:rgba(17,21,26,.87);
  box-shadow:0 15px 40px rgba(0,0,0,.3);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}

.document-card-v7 > span{
  width:30px;
  height:30px;
  display:grid;
  place-items:center;
  border-radius:8px;
  background:rgba(245,158,11,.08);
  color:#EDA82E;
  font-size:7px;
  font-weight:700;
}

.document-card-v7 strong{
  display:block;
  color:#ACB4BC;
  font-size:9px;
}

.document-card-v7 small{
  display:block;
  margin-top:2px;
  color:#59636D;
  font-size:7px;
}

.document-a-v7{
  top:50px;
  left:4%;
  animation:documentFloatV7 5s ease-in-out infinite;
}

.document-b-v7{
  right:3%;
  bottom:49px;
  animation:documentFloatV7 6s ease-in-out -2s infinite;
}

@keyframes documentFloatV7{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-9px)}
}

.documents-copy-v7{
  max-width:520px;
}

.documents-copy-v7 > small{
  color:#616C77;
  font-size:8px;
  letter-spacing:1.2px;
}

.documents-copy-v7 h2{
  margin:12px 0 0;
  font-size:clamp(43px,5vw,66px);
  line-height:.95;
  letter-spacing:-3px;
}

.documents-copy-v7 h2 em{
  color:#F5A30B;
  font-style:normal;
}

.documents-copy-v7 p{
  max-width:450px;
  margin:23px 0 0;
  color:#78838E;
  font-size:13px;
  line-height:1.7;
}

.file-types-v7{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:22px;
}

.file-types-v7 span{
  padding:8px 10px;
  border:1px solid rgba(255,255,255,.065);
  border-radius:999px;
  color:#68737E;
  font-size:8px;
}

/* PRICING */

.pricing-v7{
  padding:70px 34px 135px;
}

.pricing-heading-v7{
  text-align:center;
}

.pricing-heading-v7 > small{
  color:#5E6873;
  font-size:8px;
  letter-spacing:1.2px;
}

.pricing-heading-v7 h2{
  margin:12px 0 0;
  font-size:clamp(44px,5.5vw,70px);
  line-height:.94;
  letter-spacing:-3.4px;
}

.pricing-heading-v7 h2 em{
  color:#F5A30B;
  font-style:normal;
}

.pricing-heading-v7 p{
  margin:16px 0 0;
  color:#707B86;
  font-size:12px;
}

.pricing-card-v7{
  position:relative;
  display:grid;
  grid-template-columns:1fr 1fr auto;
  align-items:center;
  gap:38px;
  margin:43px auto 0;
  padding:29px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:17px;
  background:
    radial-gradient(circle at 12% 50%,rgba(245,158,11,.06),transparent 27%),
    rgba(14,18,23,.9);
  box-shadow:0 32px 95px rgba(0,0,0,.32);
}

.pricing-price-v7 > small{
  color:#69747F;
  font-size:8px;
  letter-spacing:1px;
}

.pricing-price-v7 > div{
  display:flex;
  align-items:baseline;
  gap:8px;
  margin-top:8px;
}

.pricing-price-v7 strong{
  font-size:36px;
  letter-spacing:-1.3px;
}

.pricing-price-v7 > div span{
  color:#65707B;
  font-size:9px;
}

.pricing-price-v7 p{
  max-width:320px;
  margin:11px 0 0;
  color:#69737E;
  font-size:9px;
  line-height:1.55;
}

.pricing-list-v7{
  display:grid;
  gap:9px;
  color:#7A848E;
  font-size:9px;
}

.pricing-action-v7{
  display:flex;
  align-items:center;
  gap:15px;
  padding:13px 15px;
  border:0;
  border-radius:9px;
  background:#F5A30B;
  color:#180F04;
  font-size:10px;
  font-weight:700;
  cursor:pointer;
  white-space:nowrap;
}

.pricing-action-v7 b{
  font-size:15px;
}

/* FINAL */

.final-v7{
  padding:130px 34px 120px;
  text-align:center;
  border-top:1px solid rgba(255,255,255,.05);
}

.final-glow-v7{
  position:absolute;
  width:620px;
  height:320px;
  left:50%;
  top:46%;
  transform:translate(-50%,-50%);
  background:radial-gradient(circle,rgba(245,158,11,.1),transparent 68%);
  filter:blur(30px);
  pointer-events:none;
}

.final-v7 > small{
  position:relative;
  z-index:2;
  color:#616C77;
  font-size:8px;
  letter-spacing:1.2px;
}

.final-v7 h2{
  position:relative;
  z-index:2;
  margin:13px 0 0;
  font-size:clamp(53px,7vw,88px);
  line-height:.91;
  letter-spacing:-4.5px;
}

.final-v7 h2 em{
  color:#F5A30B;
  font-style:normal;
}

.final-v7 p{
  position:relative;
  z-index:2;
  margin:20px 0 28px;
  color:#727D88;
  font-size:13px;
}

.final-button-v7{
  position:relative;
  z-index:2;
}

.footer-v7{
  position:relative;
  z-index:2;
  width:min(1260px,100%);
  margin:auto;
  padding:19px 34px 25px;
  border-top:1px solid rgba(255,255,255,.045);
  display:flex;
  justify-content:center;
  gap:10px;
  color:#414B55;
  font-size:8px;
}

.footer-v7 strong{
  color:#69737E;
}

/* AUTH */

.auth-panel{
  width:100%;
  min-height:100vh;
  display:grid;
  place-items:center;
  padding:24px;
  background:
    radial-gradient(circle at 50% 20%,rgba(245,158,11,.08),transparent 35%),
    #07090C;
}

.auth-panel[hidden],
.landing-page[hidden]{
  display:none;
}

/* RESPONSIVE */

@media(max-width:1050px){
  .hero-v7{
    min-height:auto;
  }

  .hero-demo-v7{
    min-height:540px;
  }

  .hero-float-v7{
    display:none;
  }

  .usage-grid-v7{
    grid-template-columns:1fr 1fr;
  }

  .card-main-v7{
    grid-row:auto;
    min-height:330px;
  }

  .usage-wide-v7{
    grid-column:1 / 3;
  }

  .documents-v7{
    grid-template-columns:1fr;
  }
}

@media(max-width:720px){
  .landing-nav-v7{
    padding:17px 18px;
  }

  .landing-nav-links-v7 a{
    display:none;
  }

  .hero-v7{
    padding:38px 18px 65px;
  }

  .hero-top-v7 h1{
    font-size:clamp(49px,14vw,72px);
    letter-spacing:-3.5px;
  }

  .hero-top-v7 > p{
    font-size:14px;
  }

  .hero-cta-v7{
    flex-direction:column;
  }

  .hero-button-v7{
    width:100%;
  }

  .hero-price-v7{
    align-items:center;
  }

  .hero-demo-v7{
    min-height:390px;
    margin-top:40px;
  }

  .orbit-v7{
    display:none;
  }

  .demo-layout-v7{
    grid-template-columns:70px 1fr;
    min-height:310px;
  }

  .demo-sidebar-v7{
    padding:11px 6px;
  }

  .demo-sidebar-v7 > small,
  .demo-new-v7{
    display:none;
  }

  .demo-option-v7{
    justify-content:center;
  }

  .demo-option-v7 span{
    display:none;
  }

  .demo-option-v7 b{
    width:25px;
    height:25px;
  }

  .demo-main-v7{
    padding:15px;
  }

  .demo-chat-v7{
    margin-top:30px;
  }

  .demo-model-v7 > span{
    display:none;
  }

  .demo-input-v7{
    left:15px;
    right:15px;
  }

  .demo-caption-v7{
    display:none;
  }

  .hero-bottom-v7{
    flex-direction:column;
    align-items:center;
    gap:8px;
    font-size:9px;
  }

  .usages-v7,
  .documents-v7,
  .pricing-v7{
    padding-left:18px;
    padding-right:18px;
  }

  .section-title-v7{
    flex-direction:column;
    align-items:flex-start;
  }

  .usage-grid-v7{
    grid-template-columns:1fr;
  }

  .usage-wide-v7{
    grid-column:auto;
  }

  .documents-v7{
    gap:35px;
  }

  .documents-visual-v7{
    min-height:350px;
  }

  .documents-ring-v7{
    width:290px;
    height:290px;
  }

  .documents-core-v7{
    width:175px;
    height:175px;
  }

  .pricing-card-v7{
    grid-template-columns:1fr;
  }

  .pricing-action-v7{
    justify-content:center;
  }

  .final-v7{
    padding-left:18px;
    padding-right:18px;
  }

  .final-v7 h2{
    font-size:clamp(47px,13vw,68px);
    letter-spacing:-3px;
  }

  .footer-v7{
    flex-direction:column;
    align-items:center;
    padding-left:18px;
    padding-right:18px;
  }
}

@media(max-width:440px){
  .nav-cta-v6{
    display:none;
  }

  .landing-brand-v7{
    font-size:14px;
  }

  .landing-mark-v7{
    width:34px;
    height:34px;
  }

  .demo-topbar-v7{
    height:35px;
  }

  .demo-user-v7{
    font-size:7px;
  }

  .demo-answer-v7 p{
    font-size:8px;
  }

  .demo-code-v7{
    display:none;
  }

  .hero-bottom-v7{
    display:none;
  }

  .document-card-v7{
    transform:scale(.85);
  }

  .document-a-v7{
    left:-6px;
  }

  .document-b-v7{
    right:-6px;
  }
}

@media(prefers-reduced-motion:reduce){
  .hero-glow-v7,
  .hero-badge-v7 span,
  .orbit-a-v7,
  .orbit-b-v7,
  .demo-window-v7,
  .hero-float-v7,
  .documents-ring-v7,
  .document-card-v7{
    animation:none !important;
  }
}


/* V7 CTA DYNAMIC */

.hero-button-v7,
.pricing-action-v7 button,
.final-v7 .hero-button-v7{
  min-width:270px;
  min-height:62px;
  padding:0 24px;
  border:1px solid rgba(255,210,100,.7);
  border-radius:14px;
  background:linear-gradient(135deg,#FFD66B 0%,#FFB300 52%,#F59E0B 100%);
  color:#171009;
  font:700 15px/1 var(--font-display);
  letter-spacing:-.01em;
  cursor:pointer;
  box-shadow:
    0 12px 28px rgba(245,158,11,.22),
    0 0 0 1px rgba(255,255,255,.05) inset,
    0 0 38px rgba(245,158,11,.12);
  transition:
    transform .22s ease,
    box-shadow .22s ease,
    filter .22s ease;
  position:relative;
  overflow:hidden;
}

.hero-button-v7::before,
.pricing-action-v7 button::before,
.final-v7 .hero-button-v7::before{
  content:"";
  position:absolute;
  top:0;
  left:-120%;
  width:70%;
  height:100%;
  background:linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.35),
    transparent
  );
  transform:skewX(-18deg);
  animation:yamo-cta-shine 3.8s ease-in-out infinite;
}

.hero-button-v7:hover,
.pricing-action-v7 button:hover,
.final-v7 .hero-button-v7:hover{
  transform:translateY(-4px) scale(1.025);
  filter:brightness(1.05);
  box-shadow:
    0 18px 38px rgba(245,158,11,.30),
    0 0 0 1px rgba(255,255,255,.08) inset,
    0 0 55px rgba(245,158,11,.20);
}

.hero-button-v7:active,
.pricing-action-v7 button:active,
.final-v7 .hero-button-v7:active{
  transform:translateY(-1px) scale(.99);
}

.hero-button-v7 b{
  position:relative;
  z-index:2;
  margin-left:12px;
  font-size:18px;
}

@keyframes yamo-cta-shine{
  0%,55%,100%{
    left:-120%;
  }
  72%{
    left:145%;
  }
}

.hero-cta-v7{
  position:relative;
}

.hero-price-v7 strong{
  font-size:15px;
}

.hero-glow-v7{
  filter:blur(4px);
  opacity:1;
}

.hero-v7::after{
  content:"";
  position:absolute;
  left:50%;
  top:150px;
  width:min(900px,88vw);
  height:420px;
  transform:translateX(-50%);
  background:
    radial-gradient(
      ellipse at center,
      rgba(245,158,11,.13) 0%,
      rgba(245,158,11,.055) 28%,
      rgba(245,158,11,.018) 52%,
      transparent 75%
    );
  pointer-events:none;
  z-index:-1;
}

.landing-page::after{
  content:"";
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:45vh;
  pointer-events:none;
  background:linear-gradient(
    180deg,
    rgba(255,255,255,.025),
    transparent 70%
  );
}

@media(max-width:720px){
  .hero-button-v7,
  .pricing-action-v7 button,
  .final-v7 .hero-button-v7{
    width:100%;
    min-width:0;
    min-height:60px;
    font-size:15px;
  }
}



/* CTA HERO — OVERRIDE FINAL */

#landing-start-btn,
.pricing-action-v7 button,
.final-v7 button{
  width:320px !important;
  min-width:320px !important;
  height:72px !important;
  min-height:72px !important;
  padding:0 18px 0 28px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:18px !important;

  border:1px solid rgba(255,225,150,.9) !important;
  border-radius:16px !important;

  background:
    linear-gradient(
      135deg,
      #FFE08A 0%,
      #FFC02E 42%,
      #FFAA00 72%,
      #F59E0B 100%
    ) !important;

  color:#171009 !important;
  font:700 16px/1 var(--font-display) !important;
  letter-spacing:-.02em !important;

  cursor:pointer !important;
  position:relative !important;
  overflow:hidden !important;

  box-shadow:
    0 16px 38px rgba(245,158,11,.34),
    0 0 55px rgba(245,158,11,.20),
    0 0 100px rgba(245,158,11,.10),
    inset 0 1px 0 rgba(255,255,255,.65) !important;

  transition:
    transform .22s ease,
    box-shadow .22s ease,
    filter .22s ease !important;

  animation:yamo-cta-pulse 3s ease-in-out infinite !important;
}

#landing-start-btn::before,
.pricing-action-v7 button::before,
.final-v7 button::before{
  content:"" !important;
  position:absolute !important;
  top:-20% !important;
  left:-130% !important;
  width:65% !important;
  height:140% !important;
  background:linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.55),
    transparent
  ) !important;
  transform:skewX(-20deg) !important;
  animation:yamo-cta-sweep 3.2s ease-in-out infinite !important;
  pointer-events:none !important;
}

#landing-start-btn > span,
#landing-start-btn > b{
  position:relative !important;
  z-index:2 !important;
}

#landing-start-btn b{
  width:42px !important;
  height:42px !important;
  min-width:42px !important;
  display:grid !important;
  place-items:center !important;
  border-radius:12px !important;

  background:rgba(0,0,0,.14) !important;
  color:#171009 !important;

  font-size:21px !important;
  line-height:1 !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.22),
    0 4px 14px rgba(0,0,0,.10) !important;
}

#landing-start-btn:hover,
.pricing-action-v7 button:hover,
.final-v7 button:hover{
  transform:translateY(-5px) scale(1.035) !important;
  filter:brightness(1.08) !important;

  box-shadow:
    0 22px 48px rgba(245,158,11,.42),
    0 0 70px rgba(245,158,11,.28),
    0 0 130px rgba(245,158,11,.13),
    inset 0 1px 0 rgba(255,255,255,.75) !important;
}

#landing-start-btn:active,
.pricing-action-v7 button:active,
.final-v7 button:active{
  transform:translateY(-1px) scale(.99) !important;
}

@keyframes yamo-cta-sweep{
  0%,48%,100%{
    left:-130%;
  }
  68%{
    left:145%;
  }
}

@keyframes yamo-cta-pulse{
  0%,100%{
    box-shadow:
      0 16px 38px rgba(245,158,11,.34),
      0 0 55px rgba(245,158,11,.20),
      0 0 100px rgba(245,158,11,.10),
      inset 0 1px 0 rgba(255,255,255,.65);
  }
  50%{
    box-shadow:
      0 18px 44px rgba(245,158,11,.42),
      0 0 75px rgba(245,158,11,.28),
      0 0 125px rgba(245,158,11,.14),
      inset 0 1px 0 rgba(255,255,255,.72);
  }
}

.hero-top-v7{
  position:relative;
  z-index:4;
}

.hero-top-v7::after{
  content:"";
  position:absolute;
  left:50%;
  top:54%;
  width:520px;
  height:180px;
  transform:translate(-50%,-50%);
  background:radial-gradient(
    ellipse,
    rgba(245,158,11,.16),
    rgba(245,158,11,.055) 38%,
    transparent 72%
  );
  filter:blur(18px);
  pointer-events:none;
  z-index:-1;
}

@media(max-width:720px){
  #landing-start-btn,
  .pricing-action-v7 button,
  .final-v7 button{
    width:100% !important;
    min-width:0 !important;
    height:64px !important;
    min-height:64px !important;
  }
}



/* =========================================================
   IA.YAMO — DYNAMIC POLISH
   ========================================================= */

/* ---------- CTA PRICING : même impact que le CTA HERO ---------- */

.pricing-action-v7{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}

.pricing-action-v7 button{
  width:320px !important;
  min-width:320px !important;
  height:72px !important;
  min-height:72px !important;
  padding:0 18px 0 28px !important;
  border:1px solid rgba(255,225,150,.92) !important;
  border-radius:16px !important;
  background:
    linear-gradient(
      135deg,
      #FFE08A 0%,
      #FFC02E 42%,
      #FFAA00 72%,
      #F59E0B 100%
    ) !important;
  color:#171009 !important;
  font:700 16px/1 var(--font-display) !important;
  position:relative !important;
  overflow:hidden !important;
  cursor:pointer !important;
  box-shadow:
    0 16px 38px rgba(245,158,11,.34),
    0 0 55px rgba(245,158,11,.20),
    0 0 100px rgba(245,158,11,.10),
    inset 0 1px 0 rgba(255,255,255,.65) !important;
  animation:yamo-cta-pulse 3s ease-in-out infinite !important;
  transition:transform .22s ease,filter .22s ease,box-shadow .22s ease !important;
}

.pricing-action-v7 button::before{
  content:"" !important;
  position:absolute !important;
  top:-20% !important;
  left:-130% !important;
  width:65% !important;
  height:140% !important;
  background:linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.55),
    transparent
  ) !important;
  transform:skewX(-20deg) !important;
  animation:yamo-cta-sweep 3.2s ease-in-out infinite !important;
  pointer-events:none !important;
}

.pricing-action-v7 button b{
  width:42px !important;
  height:42px !important;
  min-width:42px !important;
  display:grid !important;
  place-items:center !important;
  border-radius:12px !important;
  margin-left:12px !important;
  background:rgba(0,0,0,.14) !important;
  color:#171009 !important;
  font-size:21px !important;
  position:relative !important;
  z-index:2 !important;
}

.pricing-action-v7 button:hover{
  transform:translateY(-5px) scale(1.035) !important;
  filter:brightness(1.08) !important;
  box-shadow:
    0 24px 50px rgba(245,158,11,.44),
    0 0 75px rgba(245,158,11,.30),
    0 0 140px rgba(245,158,11,.15),
    inset 0 1px 0 rgba(255,255,255,.78) !important;
}

/* ---------- BLOC PRIX ---------- */

.pricing-v7{
  position:relative;
}

.pricing-v7::before{
  content:"";
  position:absolute;
  left:50%;
  top:10%;
  width:min(1050px,92vw);
  height:500px;
  transform:translateX(-50%);
  background:
    radial-gradient(
      ellipse at center,
      rgba(245,158,11,.105),
      rgba(245,158,11,.035) 42%,
      transparent 72%
    );
  filter:blur(18px);
  pointer-events:none;
  z-index:0;
}

.pricing-card-v7{
  position:relative;
  z-index:2;
  transform:translateY(0);
  box-shadow:
    0 18px 60px rgba(0,0,0,.22),
    0 0 0 1px rgba(245,158,11,.025) inset;
  transition:
    transform .35s cubic-bezier(.2,.8,.2,1),
    box-shadow .35s ease,
    border-color .35s ease;
}

.pricing-card-v7:hover{
  transform:translateY(-7px) scale(1.006);
  border-color:rgba(245,158,11,.22) !important;
  box-shadow:
    0 28px 80px rgba(0,0,0,.32),
    0 0 70px rgba(245,158,11,.09),
    inset 0 1px 0 rgba(255,255,255,.04);
}

/* ---------- CARTES USAGES ---------- */

.usage-grid-v7{
  position:relative;
}

.usage-card-v7{
  position:relative;
  overflow:hidden;
  transform:translate3d(0,0,0);
  will-change:transform;
  transition:
    transform .45s cubic-bezier(.16,1,.3,1),
    border-color .35s ease,
    box-shadow .35s ease,
    background .35s ease;
  animation:yamo-card-float 7s ease-in-out infinite;
}

.usage-card-v7::before{
  content:"";
  position:absolute;
  inset:-35%;
  background:
    radial-gradient(
      circle at 50% 45%,
      rgba(245,158,11,.13),
      transparent 55%
    );
  opacity:.28;
  transform:scale(.82);
  transition:opacity .45s ease,transform .45s ease;
  pointer-events:none;
  z-index:0;
}

.usage-card-v7::after{
  content:"";
  position:absolute;
  top:-30%;
  left:-45%;
  width:42%;
  height:160%;
  background:linear-gradient(
    90deg,
    transparent,
    rgba(245,158,11,.12),
    transparent
  );
  transform:rotate(18deg);
  animation:yamo-card-light 5.5s ease-in-out infinite;
  pointer-events:none;
  z-index:0;
}

.usage-card-v7 > *{
  position:relative;
  z-index:2;
}

.usage-card-v7:hover{
  transform:translate3d(0,-12px,0) scale(1.018) rotateX(1.2deg);
  border-color:rgba(245,158,11,.34) !important;
  box-shadow:
    0 30px 65px rgba(0,0,0,.34),
    0 0 45px rgba(245,158,11,.11),
    0 0 110px rgba(245,158,11,.07);
}

.usage-card-v7:hover::before{
  opacity:.72;
  transform:scale(1.08);
}

.card-main-v7{
  animation-duration:8.5s;
}

.usage-card-v7:nth-child(2){
  animation-delay:-2.1s;
}

.usage-card-v7:nth-child(3){
  animation-delay:-4.3s;
}

.usage-wide-v7{
  animation-delay:-5.8s !important;
}

/* ---------- DOCUMENTS ---------- */

.documents-visual-v7{
  position:relative;
}

.documents-visual-v7::before{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:450px;
  height:450px;
  transform:translate(-50%,-50%);
  background:
    radial-gradient(
      circle,
      rgba(245,158,11,.15) 0%,
      rgba(245,158,11,.07) 27%,
      rgba(245,158,11,.025) 48%,
      transparent 72%
    );
  filter:blur(10px);
  pointer-events:none;
  z-index:0;
  animation:yamo-document-glow 4.8s ease-in-out infinite;
}

.documents-ring-v7{
  animation:
    yamo-ring-orbit 15s linear infinite,
    yamo-ring-pulse 4.5s ease-in-out infinite;
}

.documents-core-v7{
  animation:yamo-core-float 5.2s ease-in-out infinite;
  box-shadow:
    0 20px 55px rgba(0,0,0,.35),
    0 0 42px rgba(245,158,11,.10);
}

.document-card-v7{
  will-change:transform,box-shadow;
  transition:
    transform .35s cubic-bezier(.16,1,.3,1),
    box-shadow .35s ease,
    border-color .35s ease;
}

.document-card-v7:hover{
  transform:translateY(-12px) rotate(-2deg) scale(1.055) !important;
  border-color:rgba(245,158,11,.30) !important;
  box-shadow:
    0 22px 48px rgba(0,0,0,.38),
    0 0 42px rgba(245,158,11,.15);
}

.document-a-v7{
  animation:yamo-document-a 5.8s ease-in-out infinite;
}

.document-b-v7{
  animation:yamo-document-b 6.3s ease-in-out infinite;
}

.document-card-v7::after{
  content:"";
  position:absolute;
  inset:-8px;
  border-radius:inherit;
  background:radial-gradient(
    circle,
    rgba(245,158,11,.14),
    transparent 65%
  );
  filter:blur(10px);
  opacity:.35;
  z-index:-1;
}

/* ---------- LUMIÈRE DU HAUT DE PAGE ---------- */

.hero-v7::before{
  content:"";
  position:absolute;
  left:50%;
  top:0;
  width:min(1200px,100vw);
  height:620px;
  transform:translateX(-50%);
  background:
    radial-gradient(
      ellipse at 50% 25%,
      rgba(245,158,11,.15) 0%,
      rgba(245,158,11,.075) 24%,
      rgba(245,158,11,.025) 48%,
      transparent 72%
    );
  filter:blur(20px);
  pointer-events:none;
  z-index:-1;
  animation:yamo-hero-light 6s ease-in-out infinite;
}

.hero-glow-v7{
  opacity:1;
  transform:translateX(-50%) scale(1.1);
  filter:blur(10px);
  animation:yamo-hero-glow 5.5s ease-in-out infinite;
}

/* ---------- MOUVEMENT ---------- */

@keyframes yamo-card-float{
  0%,100%{
    transform:translate3d(0,0,0);
  }
  50%{
    transform:translate3d(0,-6px,0);
  }
}

@keyframes yamo-card-light{
  0%,100%{
    left:-45%;
    opacity:0;
  }
  18%{
    opacity:.8;
  }
  48%{
    left:120%;
    opacity:.9;
  }
  58%,100%{
    opacity:0;
  }
}

@keyframes yamo-document-a{
  0%,100%{
    transform:translate3d(0,0,0) rotate(-1deg);
  }
  50%{
    transform:translate3d(-10px,-13px,0) rotate(-4deg);
  }
}

@keyframes yamo-document-b{
  0%,100%{
    transform:translate3d(0,0,0) rotate(1deg);
  }
  50%{
    transform:translate3d(12px,-10px,0) rotate(4deg);
  }
}

@keyframes yamo-core-float{
  0%,100%{
    transform:translateY(0);
  }
  50%{
    transform:translateY(-7px);
  }
}

@keyframes yamo-ring-orbit{
  from{
    transform:rotate(0deg);
  }
  to{
    transform:rotate(360deg);
  }
}

@keyframes yamo-ring-pulse{
  0%,100%{
    filter:drop-shadow(0 0 0 rgba(245,158,11,0));
  }
  50%{
    filter:drop-shadow(0 0 18px rgba(245,158,11,.16));
  }
}

@keyframes yamo-document-glow{
  0%,100%{
    opacity:.5;
    transform:translate(-50%,-50%) scale(.94);
  }
  50%{
    opacity:1;
    transform:translate(-50%,-50%) scale(1.08);
  }
}

@keyframes yamo-hero-light{
  0%,100%{
    opacity:.55;
    transform:translateX(-50%) scale(.95);
  }
  50%{
    opacity:1;
    transform:translateX(-50%) scale(1.06);
  }
}

@keyframes yamo-hero-glow{
  0%,100%{
    opacity:.72;
    transform:translateX(-50%) scale(1);
  }
  50%{
    opacity:1;
    transform:translateX(-50%) scale(1.14);
  }
}

@media(max-width:720px){
  .pricing-action-v7 button{
    width:100% !important;
    min-width:0 !important;
    height:64px !important;
    min-height:64px !important;
  }

  .usage-card-v7{
    animation:none;
  }

  .usage-card-v7:hover{
    transform:translateY(-7px) scale(1.01);
  }

  .documents-ring-v7{
    animation:
      yamo-ring-pulse 4.5s ease-in-out infinite;
  }
}

@media(prefers-reduced-motion:reduce){
  .pricing-card-v7,
  .usage-card-v7,
  .documents-ring-v7,
  .documents-core-v7,
  .document-card-v7,
  .hero-glow-v7,
  .hero-v7::before{
    animation:none !important;
    transition:none !important;
  }
}


/* Même couleur pour les deux CTA */
#landing-start-btn,
#landing-start-btn ~ *,
.pricing-action-v7 button{
  background:
    linear-gradient(
      135deg,
      #FFE08A 0%,
      #FFC02E 42%,
      #FFAA00 72%,
      #F59E0B 100%
    ) !important;
}



/* CTA TARIF — même rendu que le CTA principal */
.pricing-action-v7{
  width:320px !important;
  min-width:320px !important;
  height:72px !important;
  min-height:72px !important;
  padding:0 18px 0 28px !important;

  display:inline-flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:18px !important;

  border:1px solid rgba(255,225,150,.9) !important;
  border-radius:16px !important;

  background:
    linear-gradient(
      135deg,
      #FFE08A 0%,
      #FFC02E 42%,
      #FFAA00 72%,
      #F59E0B 100%
    ) !important;

  color:#171009 !important;
  font:700 16px/1 var(--font-display) !important;
  cursor:pointer !important;

  position:relative !important;
  overflow:hidden !important;

  box-shadow:
    0 16px 38px rgba(245,158,11,.34),
    0 0 55px rgba(245,158,11,.20),
    0 0 100px rgba(245,158,11,.10),
    inset 0 1px 0 rgba(255,255,255,.65) !important;

  animation:yamo-cta-pulse 3s ease-in-out infinite !important;

  transition:
    transform .22s ease,
    filter .22s ease,
    box-shadow .22s ease !important;
}

.pricing-action-v7 b{
  width:42px !important;
  height:42px !important;
  min-width:42px !important;

  display:grid !important;
  place-items:center !important;

  margin-left:12px !important;
  border-radius:12px !important;

  background:rgba(0,0,0,.14) !important;
  color:#171009 !important;

  font-size:21px !important;
  line-height:1 !important;

  position:relative !important;
  z-index:2 !important;
}

.pricing-action-v7::before{
  content:"" !important;
  position:absolute !important;
  top:-20% !important;
  left:-130% !important;
  width:65% !important;
  height:140% !important;

  background:linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.55),
    transparent
  ) !important;

  transform:skewX(-20deg) !important;
  animation:yamo-cta-sweep 3.2s ease-in-out infinite !important;
  pointer-events:none !important;
}

.pricing-action-v7:hover{
  transform:translateY(-5px) scale(1.035) !important;
  filter:brightness(1.08) !important;

  box-shadow:
    0 22px 48px rgba(245,158,11,.42),
    0 0 70px rgba(245,158,11,.28),
    0 0 130px rgba(245,158,11,.13),
    inset 0 1px 0 rgba(255,255,255,.75) !important;
}

@media(max-width:720px){
  .pricing-action-v7{
    width:100% !important;
    min-width:0 !important;
    height:64px !important;
    min-height:64px !important;
  }
}

/* =========================================================
   CTA PRIMARY — STYLE COMMUN AUX 3 BOUTONS
   ========================================================= */

.cta-primary-v7{
  width:320px !important;
  min-width:320px !important;
  height:72px !important;
  min-height:72px !important;

  display:inline-flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:18px !important;

  padding:0 18px 0 28px !important;

  border:1px solid rgba(255,226,155,.95) !important;
  border-radius:16px !important;

  background:
    linear-gradient(
      135deg,
      #FFE08A 0%,
      #FFC02E 42%,
      #FFAA00 72%,
      #F59E0B 100%
    ) !important;

  color:#171009 !important;
  font:700 16px/1 var(--font-display) !important;

  position:relative !important;
  overflow:hidden !important;
  cursor:pointer !important;

  box-shadow:
    0 16px 38px rgba(245,158,11,.34),
    0 0 55px rgba(245,158,11,.20),
    0 0 100px rgba(245,158,11,.10),
    inset 0 1px 0 rgba(255,255,255,.68) !important;

  animation:yamo-cta-pulse 3s ease-in-out infinite !important;

  transition:
    transform .22s ease,
    filter .22s ease,
    box-shadow .22s ease !important;
}

.cta-primary-v7::before{
  content:"" !important;
  position:absolute !important;
  top:-20% !important;
  left:-130% !important;
  width:65% !important;
  height:140% !important;

  background:linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.55),
    transparent
  ) !important;

  transform:skewX(-20deg) !important;
  animation:yamo-cta-sweep 3.2s ease-in-out infinite !important;
  pointer-events:none !important;
}

.cta-primary-v7 b{
  width:42px !important;
  height:42px !important;
  min-width:42px !important;

  display:grid !important;
  place-items:center !important;

  margin-left:12px !important;
  border-radius:12px !important;

  background:rgba(0,0,0,.14) !important;
  color:#171009 !important;

  font-size:21px !important;
  line-height:1 !important;

  position:relative !important;
  z-index:2 !important;
}

.cta-primary-v7:hover{
  transform:translateY(-5px) scale(1.035) !important;
  filter:brightness(1.08) !important;

  box-shadow:
    0 24px 50px rgba(245,158,11,.44),
    0 0 75px rgba(245,158,11,.30),
    0 0 140px rgba(245,158,11,.15),
    inset 0 1px 0 rgba(255,255,255,.78) !important;
}

.cta-primary-v7:active{
  transform:translateY(-1px) scale(.99) !important;
}

@media(max-width:720px){
  .cta-primary-v7{
    width:100% !important;
    min-width:0 !important;
    height:64px !important;
    min-height:64px !important;
  }
}

/* =========================================================
   PRIX — AVANTAGES PLUS LISIBLES
   ========================================================= */

.pricing-list-v7{
  color:#F5F7FA !important;
  font-size:16px !important;
  font-weight:500 !important;
  line-height:1.9 !important;
}

.pricing-list-v7 span{
  color:#F5F7FA !important;
  font-size:16px !important;
  font-weight:500 !important;
  opacity:1 !important;
  letter-spacing:-.01em;
}

@media(max-width:720px){
  .pricing-list-v7,
  .pricing-list-v7 span{
    font-size:15px !important;
    line-height:1.85 !important;
  }
}

/* =========================================================
   AUTH — BOUTON RETOUR
   ========================================================= */

#auth-back-btn,
.auth-back-btn{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;

  width:auto !important;
  min-width:110px !important;
  height:40px !important;
  padding:0 15px !important;

  border:1px solid rgba(255,255,255,.10) !important;
  border-radius:10px !important;

  background:rgba(255,255,255,.045) !important;
  color:#F5F7FA !important;

  font:500 13px/1 var(--font-body) !important;

  cursor:pointer !important;

  box-shadow:
    0 6px 18px rgba(0,0,0,.14),
    inset 0 1px 0 rgba(255,255,255,.035) !important;

  transition:
    transform .2s ease,
    background .2s ease,
    border-color .2s ease,
    color .2s ease,
    box-shadow .2s ease !important;
}

#auth-back-btn:hover,
.auth-back-btn:hover{
  transform:translateY(-2px) !important;
  background:rgba(245,158,11,.10) !important;
  border-color:rgba(245,158,11,.38) !important;
  color:#FFC44C !important;

  box-shadow:
    0 10px 24px rgba(0,0,0,.20),
    0 0 24px rgba(245,158,11,.10) !important;
}

#auth-back-btn:active,
.auth-back-btn:active{
  transform:translateY(0) !important;
}


/* AUTH — RETOUR PLUS COMPACT */
#auth-back-btn,
.auth-back-btn{
  min-width:96px !important;
  width:96px !important;
  height:36px !important;
  padding:0 12px !important;
  border-radius:9px !important;
  font-size:12px !important;
  font-weight:500 !important;
  gap:6px !important;
}


/* AUTH — RETOUR MINI ET PLUS À GAUCHE */
#auth-back-btn,
.auth-back-btn{
  width:82px !important;
  min-width:82px !important;
  height:32px !important;
  padding:0 9px !important;

  font-size:11px !important;
  border-radius:8px !important;
  gap:4px !important;

  position:relative !important;
  left:-10px !important;
}


/* AUTH — RETOUR ULTRA COMPACT */
#auth-back-btn,
.auth-back-btn{
  width:70px !important;
  min-width:70px !important;
  height:28px !important;
  min-height:28px !important;
  padding:0 8px !important;

  margin-left:-14px !important;

  border:1px solid rgba(255,255,255,.07) !important;
  border-radius:7px !important;

  background:rgba(255,255,255,.025) !important;
  color:#DDE2E7 !important;

  font-size:10px !important;
  font-weight:500 !important;
  line-height:1 !important;

  box-shadow:none !important;
}

#auth-back-btn:hover,
.auth-back-btn:hover{
  background:rgba(245,158,11,.08) !important;
  border-color:rgba(245,158,11,.25) !important;
  color:#FFC44C !important;
  transform:translateY(-1px) !important;
}


/* AUTH — POSITION FINALE DU BOUTON RETOUR */
#auth-back-btn,
.auth-back-btn{
  margin-top:-6px !important;
  margin-left:4px !important;
}


/* ============================================================
   EXPORT PDF DES REPONSES
   ============================================================ */

.pdf-msg-btn{
  border:1px solid rgba(255,255,255,.08) !important;
  background:rgba(255,255,255,.025) !important;
  color:#DDE2E7 !important;
  transition:
    background .18s ease,
    border-color .18s ease,
    color .18s ease,
    transform .18s ease;
}

.pdf-msg-btn:hover{
  background:rgba(255,166,0,.08) !important;
  border-color:rgba(255,166,0,.28) !important;
  color:#FFB01A !important;
  transform:translateY(-1px);
}

.pdf-msg-btn:disabled{
  opacity:.55 !important;
  cursor:wait !important;
  transform:none !important;
}

/* ============================================================
   CHOIX DE L'ACCÈS — PREMIUM / ESSAI GRATUIT
   ============================================================ */

.access-panel{
  position:fixed;
  inset:0;
  z-index:205;
  overflow-y:auto;
  background:
    radial-gradient(circle at 50% 0%,rgba(245,158,11,.12),transparent 34%),
    radial-gradient(circle at 100% 50%,rgba(245,158,11,.035),transparent 30%),
    #05070A;
  color:#F5F7FA;
  padding:18px 18px 34px;
}

.access-panel[hidden]{
  display:none;
}

.access-shell{
  width:min(980px,100%);
  margin:0 auto;
}

.access-back-btn{
  width:78px !important;
  min-width:78px !important;
  height:30px !important;
  min-height:30px !important;
  padding:0 9px !important;
  margin:0 0 22px;
  border:1px solid rgba(255,255,255,.07) !important;
  border-radius:8px !important;
  background:rgba(255,255,255,.025) !important;
  color:#9EA7B1 !important;
  font-size:10px !important;
  font-weight:500 !important;
  cursor:pointer;
}

.access-back-btn:hover{
  color:#F5F7FA !important;
  border-color:rgba(245,158,11,.25) !important;
  background:rgba(245,158,11,.045) !important;
}

.access-header{
  text-align:center;
  max-width:760px;
  margin:0 auto 26px;
}

.access-brand{
  margin-bottom:16px;
  color:#F5F7FA;
  font-size:17px;
  font-weight:800;
  letter-spacing:.7px;
}

.access-brand-accent{
  color:#F59E0B;
}

.access-kicker{
  margin-bottom:8px;
  color:#757F8A;
  font-size:8px;
  font-weight:700;
  letter-spacing:2.1px;
}

.access-header h2{
  margin:0;
  color:#F4F6F8;
  font-size:31px;
  line-height:1.12;
  font-weight:750;
  letter-spacing:-.7px;
}

.access-header h2 span{
  color:#F8B632;
}

.access-header p{
  margin:10px 0 0;
  color:#747E89;
  font-size:13px;
  line-height:1.5;
}

.access-options{
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);
  gap:16px;
  align-items:stretch;
}

.access-card{
  position:relative;
  overflow:hidden;
  border-radius:21px;
  padding:24px;
  background:
    linear-gradient(145deg,rgba(16,20,25,.98),rgba(7,10,13,.98));
  box-shadow:0 24px 80px rgba(0,0,0,.34);
}

.access-card-premium{
  border:1px solid rgba(245,158,11,.44);
  box-shadow:
    0 24px 80px rgba(0,0,0,.38),
    0 0 80px rgba(245,158,11,.055);
}

.access-premium-glow{
  position:absolute;
  width:260px;
  height:260px;
  right:-100px;
  top:-120px;
  border-radius:50%;
  background:rgba(245,158,11,.08);
  filter:blur(45px);
  pointer-events:none;
}

.access-card-free{
  border:1px solid rgba(255,255,255,.08);
}

.access-card-top{
  position:relative;
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
  z-index:1;
}

.access-eyebrow{
  display:inline-flex;
  align-items:center;
  min-height:25px;
  padding:0 10px;
  border-radius:999px;
  font-size:8px;
  font-weight:700;
  letter-spacing:1.2px;
}

.premium-eyebrow{
  border:1px solid rgba(245,158,11,.24);
  background:rgba(245,158,11,.085);
  color:#F8B938;
}

.free-eyebrow{
  border:1px solid rgba(255,255,255,.075);
  background:rgba(255,255,255,.03);
  color:#8A95A0;
}

.access-card h3{
  margin:12px 0 0;
  color:#F5F7F9;
  font-size:21px;
  line-height:1.18;
  font-weight:700;
}

.access-card-subtitle{
  margin:7px 0 0 !important;
  color:#7C8691 !important;
  font-size:11px !important;
  line-height:1.45 !important;
}

.access-crown{
  display:grid;
  place-items:center;
  width:48px;
  height:48px;
  flex:0 0 48px;
  border-radius:14px;
  background:rgba(245,158,11,.09);
  border:1px solid rgba(245,158,11,.18);
  color:#F5B642;
  font-size:24px;
}

.access-free-icon{
  display:grid;
  place-items:center;
  width:42px;
  height:42px;
  flex:0 0 42px;
  color:#7F8A96;
  font-size:21px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.06);
  background:rgba(255,255,255,.025);
}

.access-price{
  display:flex;
  align-items:baseline;
  gap:7px;
  margin-top:22px;
  position:relative;
  z-index:1;
}

.access-price strong{
  color:#FFC443;
  font-size:45px;
  line-height:1;
  letter-spacing:-1.8px;
}

.access-price span{
  color:#79838E;
  font-size:12px;
}

.access-features{
  position:relative;
  z-index:1;
  display:grid;
  gap:10px;
  margin-top:21px;
}

.access-feature{
  display:grid;
  grid-template-columns:17px minmax(0,1fr);
  gap:8px;
  align-items:start;
}

.access-feature > span{
  color:#F6B536;
  font-size:13px;
  line-height:1.5;
  font-weight:700;
}

.access-card-free .access-feature > span{
  color:#8F99A3;
}

.access-feature p{
  margin:0 !important;
  color:#DDE2E7;
  font-size:12.5px;
  line-height:1.48;
}

.access-feature small{
  color:#727D88;
  font-size:10.5px;
}

.access-primary-btn,
.access-secondary-btn{
  position:relative;
  z-index:1;
  width:100%;
  min-height:57px;
  margin-top:23px;
  padding:0 18px 0 22px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  border-radius:13px;
  cursor:pointer;
  font-size:14px;
  font-weight:750;
  transition:
    transform .18s ease,
    box-shadow .18s ease,
    border-color .18s ease,
    background .18s ease;
}

.access-primary-btn{
  border:1px solid #FFD66A;
  background:linear-gradient(135deg,#FFD765,#FFAB00);
  color:#151515;
  box-shadow:0 12px 38px rgba(245,158,11,.18);
}

.access-primary-btn:hover{
  transform:translateY(-1px);
  box-shadow:0 16px 44px rgba(245,158,11,.26);
}

.access-secondary-btn{
  border:1px solid rgba(255,255,255,.11);
  background:#171C22;
  color:#E2E6EA;
}

.access-secondary-btn:hover{
  transform:translateY(-1px);
  border-color:rgba(245,158,11,.24);
  background:#1B2128;
}

.access-primary-btn b,
.access-secondary-btn b{
  font-size:20px;
  font-weight:400;
  line-height:1;
}

.payment-label{
  position:relative;
  z-index:1;
  margin-top:12px;
  text-align:center;
  color:#666F79;
  font-size:8.5px;
}

.payment-methods{
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:16px;
  margin-top:11px;
}

.payment-divider{
  width:1px;
  height:31px;
  background:rgba(255,255,255,.08);
}

.payment-brand{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-width:150px;
}

.payment-brand img{
  display:block;
  width:auto;
  height:31px;
  max-width:110px;
  object-fit:contain;
  object-position:center;
}

.payment-brand > span{
  color:#AEB6BE;
  font-size:8px;
  line-height:1.15;
  white-space:nowrap;
}

.payment-brand-mtn img{
  height:34px;
}

.payment-brand-orange img{
  height:30px;
}

@media(max-width:780px){
  .payment-brand{
    min-width:0;
  }

  .payment-brand img{
    max-width:92px;
  }

  .payment-brand > span{
    display:none;
  }
}

.free-highlight{
  display:flex;
  align-items:baseline;
  gap:7px;
  margin-top:21px;
  padding:12px 13px;
  border-radius:10px;
  background:rgba(255,255,255,.025);
  border:1px solid rgba(255,255,255,.06);
}

.free-highlight strong{
  color:#E7EBEE;
  font-size:17px;
}

.free-highlight span{
  color:#6E7883;
  font-size:9px;
}

.access-card-free .access-features{
  margin-top:17px;
}

.free-note{
  margin:9px 0 0 !important;
  text-align:center;
  color:#565F68 !important;
  font-size:8px !important;
}

.access-dots{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:6px;
  margin-top:21px;
}

.access-dots span{
  width:6px;
  height:6px;
  border-radius:50%;
  background:#39414A;
}

.access-dots .active{
  width:18px;
  border-radius:999px;
  background:#F59E0B;
}

.access-trust{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
  margin:22px auto 0;
  max-width:850px;
  padding:15px 18px;
  border-top:1px solid rgba(255,255,255,.05);
  border-bottom:1px solid rgba(255,255,255,.05);
}

.access-trust > div{
  text-align:center;
}

.access-trust strong{
  display:block;
  color:#A3ADB6;
  font-size:9px;
  font-weight:600;
}

.access-trust span{
  display:block;
  margin-top:3px;
  color:#535D67;
  font-size:7.5px;
}

.access-footer{
  margin-top:14px;
  text-align:center;
  color:#505963;
  font-size:7.5px;
}

@media(max-width:780px){
  .access-panel{
    padding:14px 10px 24px;
  }

  .access-back-btn{
    margin-bottom:20px;
  }

  .access-header{
    margin-bottom:20px;
  }

  .access-header h2{
    font-size:25px;
  }

  .access-options{
    grid-template-columns:1fr;
    gap:11px;
  }

  .access-card{
    padding:19px;
    border-radius:17px;
  }

  .access-card h3{
    font-size:18px;
  }

  .access-price strong{
    font-size:38px;
  }

  .access-feature p{
    font-size:12px;
  }

  .access-trust{
    grid-template-columns:1fr;
    gap:9px;
  }
}

/* ============================================================
   PAYMENT PREMIUM
   ============================================================ */

.payment-panel{
  position:fixed;
  inset:0;
  z-index:9999;
  width:100%;
  min-height:100vh;
  overflow-y:auto;
  background:var(--bg);
}

.payment-shell{
  width:min(760px,calc(100% - 32px));
  margin:0 auto;
  padding:28px 0 60px;
}

.payment-card{
  margin-top:28px;
  padding:28px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:18px;
  background:rgba(255,255,255,.025);
  box-shadow:0 18px 60px rgba(0,0,0,.28);
}

.payment-price-large{
  display:flex;
  align-items:baseline;
  gap:10px;
  margin-bottom:26px;
}

.payment-price-large strong{
  font-size:42px;
  font-weight:800;
}

.payment-price-large span{
  color:var(--text-muted);
  font-size:14px;
}

.payment-instructions{
  display:grid;
  gap:12px;
  margin-bottom:26px;
}

.payment-step{
  display:flex;
  gap:12px;
  align-items:flex-start;
}

.payment-step>span{
  width:26px;
  height:26px;
  display:grid;
  place-items:center;
  flex:none;
  border-radius:50%;
  background:rgba(245,158,11,.12);
  color:#F59E0B;
  font-size:12px;
  font-weight:700;
}

.payment-step p{
  margin:2px 0 0;
  color:var(--text-muted);
  line-height:1.5;
}

.payment-destinations{
  display:grid;
  gap:10px;
  margin-bottom:26px;
}

.payment-destination{
  display:flex;
  align-items:center;
  gap:14px;
  padding:14px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:12px;
  background:rgba(255,255,255,.018);
}

.payment-destination img{
  width:34px;
  height:34px;
  object-fit:contain;
}

.payment-destination div{
  display:grid;
  gap:3px;
}

.payment-destination strong{
  font-size:13px;
}

.payment-destination span{
  color:var(--text-faint);
  font-size:12px;
}

.payment-form{
  display:grid;
  gap:14px;
}

.payment-form label{
  display:grid;
  gap:7px;
  color:var(--text-muted);
  font-size:12px;
}

.payment-form input,
.payment-form select{
  width:100%;
  box-sizing:border-box;
  min-height:46px;
  padding:0 13px;
  border:1px solid var(--border);
  border-radius:10px;
  background:var(--surface);
  color:var(--text);
  outline:none;
}

.payment-form input:focus,
.payment-form select:focus{
  border-color:rgba(245,158,11,.45);
}

.payment-error{
  padding:11px 13px;
  border-radius:9px;
  background:rgba(255,80,80,.08);
  color:#ff8d8d;
  font-size:12px;
}

.payment-success{
  display:grid;
  gap:8px;
  padding:18px;
  border:1px solid rgba(74,222,128,.18);
  border-radius:12px;
  background:rgba(74,222,128,.06);
}

.payment-success strong{
  font-size:15px;
}

.payment-success span{
  color:var(--text-muted);
  line-height:1.5;
}

@media (max-width:640px){
  .payment-shell{
    width:min(100% - 20px,760px);
    padding-top:18px;
  }

  .payment-card{
    padding:20px;
  }

  .payment-price-large strong{
    font-size:34px;
  }

  .payment-destination{
    padding:12px;
  }
}


.payment-destination{
  position:relative;
}

.payment-destination .payment-number{
  color:var(--text);
  font-size:14px;
  font-weight:700;
  letter-spacing:.3px;
}

.payment-copy-btn{
  margin-left:auto;
  flex:none;
  min-height:34px;
  padding:0 11px;
  border:1px solid rgba(245,158,11,.25);
  border-radius:8px;
  background:rgba(245,158,11,.08);
  color:#F59E0B;
  cursor:pointer;
  font-size:11px;
  font-weight:700;
}

.payment-copy-btn:hover{
  background:rgba(245,158,11,.14);
}

@media (max-width:640px){
  .payment-destination{
    flex-wrap:wrap;
  }

  .payment-copy-btn{
    margin-left:48px;
    margin-top:-4px;
  }
}


/* ============================================================
   MODELES PREMIUM VERROUILLES
   ============================================================ */

.locked-model-tooltip{
  position:fixed;
  z-index:10000;
  width:min(320px,calc(100vw - 24px));
  padding:12px 13px;
  border:1px solid color-mix(in srgb,var(--accent) 38%,var(--border));
  border-radius:10px;
  background:var(--surface-raised);
  box-shadow:0 14px 40px rgba(0,0,0,.35);
  display:grid;
  gap:5px;
  animation:lockedModelTooltipIn .14s ease-out;
}

.locked-model-tooltip strong{
  color:var(--accent);
  font-size:12px;
}

.locked-model-tooltip span{
  color:var(--text-muted);
  font-size:11.5px;
  line-height:1.45;
}

.locked-model-upgrade{
  justify-self:start;
  margin-top:4px;
  padding:6px 9px;
  border:1px solid color-mix(in srgb,var(--accent) 45%,var(--border));
  border-radius:7px;
  background:color-mix(in srgb,var(--accent) 12%,var(--surface));
  color:var(--accent);
  cursor:pointer;
  font-size:10.5px;
}

.locked-model-upgrade:hover{
  background:color-mix(in srgb,var(--accent) 20%,var(--surface));
}

@keyframes lockedModelTooltipIn{
  from{
    opacity:0;
    transform:translateY(-4px);
  }
  to{
    opacity:1;
    transform:translateY(0);
  }
}


.web-citation{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:18px;
  height:18px;
  margin:0 2px;
  padding:0 4px;
  box-sizing:border-box;
  border:1px solid var(--accent-deep);
  border-radius:5px;
  background:var(--surface-raised);
  color:var(--accent);
  font-size:10px;
  font-weight:700;
  line-height:1;
  text-decoration:none;
  vertical-align:middle;
  cursor:pointer;
}

.web-citation:hover{
  background:var(--accent);
  color:var(--ink);
  text-decoration:none;
}

/* Logo officiel IA.Yamo — argent + or */
.brand-logo-image{
  display:block;
  width:auto;
  height:38px;
  max-width:190px;
  object-fit:contain;
}


/* Boutons d'interface — jaune premium IA.Yamo */
#send-btn,
.plan-upgrade-btn,
.upgrade-inline-btn{
  background:
    linear-gradient(
      135deg,
      #FFE08A 0%,
      #FFC02E 42%,
      #FFAA00 72%,
      #F59E0B 100%
    ) !important;

  color:#171009 !important;
  border:1px solid rgba(255,225,150,.9) !important;

  box-shadow:
    0 8px 24px rgba(245,158,11,.28),
    0 0 35px rgba(245,158,11,.12),
    inset 0 1px 0 rgba(255,255,255,.6) !important;
}

#send-btn:hover,
.plan-upgrade-btn:hover,
.upgrade-inline-btn:hover{
  filter:brightness(1.08) !important;
  box-shadow:
    0 12px 30px rgba(245,158,11,.38),
    0 0 45px rgba(245,158,11,.18),
    inset 0 1px 0 rgba(255,255,255,.75) !important;
}


/* Nom IA.Yamo à côté du logo dans la barre latérale */
.sidebar-top .brand-button{
  display:flex;
  align-items:center;
  gap:10px;
}

.sidebar-top .brand-logo-image{
  width:auto;
  height:34px;
  max-width:50px;
}

.brand-sidebar-name{
  color:#f5f5f5;
  font:700 18px/1 var(--font-display);
  letter-spacing:-.02em;
  white-space:nowrap;
}


/* Écran de consentement avant création de compte */
.usage-consent{
  width:100%;
  max-width:560px;
  margin:22px auto 0;
  padding:22px;
  border:1px solid rgba(255,192,46,.28);
  border-radius:18px;
  background:rgba(255,255,255,.035);
  box-shadow:0 18px 50px rgba(0,0,0,.28);
}

.usage-consent-header{
  display:flex;
  flex-direction:column;
  gap:7px;
  margin-bottom:18px;
}

.usage-consent-header strong{
  font-size:21px;
  color:#fff;
}

.usage-consent-header span{
  color:#a9a9a9;
  font-size:14px;
  line-height:1.5;
}

.usage-consent-content{
  color:#cfcfcf;
  font-size:14px;
  line-height:1.6;
}

.usage-consent-content h3{
  margin:0 0 10px;
  color:#fff;
  font-size:16px;
}

.usage-consent-content p{
  margin:0 0 11px;
}

.usage-consent-links{
  display:flex;
  flex-wrap:wrap;
  gap:10px 16px;
  margin-top:16px;
}

.usage-consent-links a{
  color:#ffc02e;
  text-decoration:none;
  font-size:13px;
}

.usage-consent-links a:hover{
  text-decoration:underline;
}

.usage-consent-check{
  display:flex;
  align-items:flex-start;
  gap:10px;
  margin-top:20px;
  color:#e5e5e5;
  font-size:13px;
  line-height:1.45;
  cursor:pointer;
}

.usage-consent-check input{
  width:17px;
  height:17px;
  margin:1px 0 0;
  flex:none;
  accent-color:#ffc02e;
}

#usage-consent-btn{
  width:100%;
  margin-top:18px;
  padding:13px 18px;
  border:1px solid rgba(255,225,150,.9);
  border-radius:12px;
  background:linear-gradient(
    135deg,
    #FFE08A 0%,
    #FFC02E 42%,
    #FFAA00 72%,
    #F59E0B 100%
  );
  color:#171009;
  font-weight:700;
  cursor:pointer;
  box-shadow:
    0 8px 24px rgba(245,158,11,.28),
    inset 0 1px 0 rgba(255,255,255,.6);
}

#usage-consent-btn:disabled{
  opacity:.45;
  cursor:not-allowed;
  filter:grayscale(.25);
  box-shadow:none;
}

#usage-consent-btn:not(:disabled):hover{
  filter:brightness(1.08);
}

@media (max-width:700px){
  .usage-consent{
    padding:18px;
    border-radius:16px;
  }

  .usage-consent-header strong{
    font-size:19px;
  }
}


/* =========================================================
   POLITIQUE — AFFICHAGE COMPLET ET ADAPTATIF
   ========================================================= */

.auth-card:has(#usage-consent:not([hidden])){
  width:min(760px, calc(100vw - 32px));
  max-width:760px;
  max-height:calc(100vh - 32px);
  overflow-y:auto;
  box-sizing:border-box;
  padding:28px;
}

.auth-card:has(#usage-consent:not([hidden])) .usage-consent{
  width:100%;
  max-width:none;
  margin:0;
  box-sizing:border-box;
}

.auth-card:has(#usage-consent:not([hidden])) .usage-consent-content{
  max-height:none;
}

@media(max-width:700px){
  .auth-card:has(#usage-consent:not([hidden])){
    width:calc(100vw - 20px);
    max-width:none;
    max-height:calc(100vh - 20px);
    padding:16px;
  }

  .auth-card:has(#usage-consent:not([hidden])) .usage-consent{
    padding:16px;
  }

  .auth-card:has(#usage-consent:not([hidden])) .usage-consent-content{
    font-size:13px;
    line-height:1.55;
  }
}



.bubble.streaming-raw{
  white-space:pre-wrap;
  overflow-wrap:anywhere;
  word-break:break-word;
}


/* ============================================================
   LIGHT THEME REFINEMENT
   ============================================================ */

body[data-theme="light"]{
  --ink:#f7f8fb;
  --surface:#ffffff;
  --surface-raised:#f1f4f7;
  --surface-hover:#e8edf2;
  --border:#d7dde5;
  --text:#18212b;
  --text-muted:#5f6b7a;
  --text-faint:#8792a1;

  --accent:#e7a21b;
  --accent-deep:#c47b08;
  --accent-ink:#2b1c05;

  --danger:#c3474f;
  --success:#238653;
  --queue:#356fae;
}

body[data-theme="light"] #messages{
  background:var(--ink);
}

body[data-theme="light"] #chat-header{
  background:rgba(255,255,255,.90);
  border-bottom-color:var(--border);
}

body[data-theme="light"] .brand-ia{
  color:var(--text);
}

body[data-theme="light"] .brand-name{
  color:#d58b12;
}

body[data-theme="light"] .new-chat-btn{
  background:#f4f6f8;
  border-color:#d8dee6;
}

body[data-theme="light"] .new-chat-btn:hover{
  background:#e9eef3;
}

body[data-theme="light"] .history-item{
  color:#657180;
}

body[data-theme="light"] .history-item:hover{
  background:#f1f4f7;
  color:var(--text);
}

body[data-theme="light"] .history-item.active{
  background:#eef2f6;
  border-color:#d7dde5;
  color:var(--text);
}

body[data-theme="light"] .sidebar-tool{
  opacity:1;
  color:var(--text-muted);
}

body[data-theme="light"] .sidebar-tool:hover{
  background:var(--surface-raised);
  color:var(--text);
}

body[data-theme="light"] .model-select,
body[data-theme="light"] .header-model-select{
  background:#f5f7f9;
  border-color:#d7dde5;
}

body[data-theme="light"] .msg-row.user .bubble{
  background:#edf1f5;
  border-color:#d8dee6;
  color:var(--text);
}

body[data-theme="light"] .msg-row.assistant .bubble{
  color:var(--text);
}

body[data-theme="light"] .msg-actions button,
body[data-theme="light"] .code-copy-btn{
  background:#ffffff;
  border-color:#d7dde5;
}

body[data-theme="light"] .msg-actions button:hover,
body[data-theme="light"] .code-copy-btn:hover{
  background:#f1f4f7;
}

body[data-theme="light"] .web-sources{
  background:#f1f4f7;
  border-color:#d7dde5;
}

body[data-theme="light"] .suggestion{
  background:#ffffff;
  border-color:#d7dde5;
}

body[data-theme="light"] .suggestion:hover{
  background:#f1f4f7;
}

body[data-theme="light"] #composer-wrap{
  background:linear-gradient(
    to bottom,
    transparent,
    rgba(247,248,251,.92) 24%,
    var(--ink) 100%
  );
}

body[data-theme="light"] #composer{
  background:#ffffff;
  border-color:#d5dce4;
  box-shadow:0 6px 24px rgba(20,32,45,.08);
}

body[data-theme="light"] #composer:focus-within{
  border-color:var(--accent-deep);
  box-shadow:0 6px 24px rgba(20,32,45,.10);
}

body[data-theme="light"] .cancel-edit-btn,
body[data-theme="light"] .stop-btn{
  background:#f5f7f9;
  border-color:#d7dde5;
}

body[data-theme="light"] .scroll-bottom-btn{
  background:#ffffff;
  border-color:#d7dde5;
  box-shadow:0 4px 16px rgba(20,32,45,.12);
}

body[data-theme="light"] .scroll-bottom-btn:hover{
  background:#f1f4f7;
}

body[data-theme="light"] .attachment-chip,
body[data-theme="light"] .message-attachment{
  background:#ffffff;
  border-color:#d7dde5;
}

body[data-theme="light"] .attachment-remove:hover{
  background:#e8edf2;
}

body[data-theme="light"] .plan-status{
  background:#f1f4f7;
  border-color:#d7dde5;
}

body[data-theme="light"] .bubble code{
  background:#eef2f5;
  color:#25313d;
}

body[data-theme="light"] .bubble th{
  background:#eef2f5;
}

body[data-theme="light"] .bubble th,
body[data-theme="light"] .bubble td{
  border-color:#d7dde5;
}

body[data-theme="light"] .toast{
  background:#ffffff;
  border-color:#d7dde5;
  box-shadow:0 8px 28px rgba(20,32,45,.12);
}


/* ============================================================
   MÉDIAS GÉNÉRÉS
   ============================================================ */

.generated-media-list{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-top:12px;
  width:min(100%,680px);
}

.generated-media{
  margin:0;
  overflow:hidden;
  border:1px solid var(--border);
  border-radius:var(--radius);
  background:var(--surface);
}

.generated-media-link{
  display:block;
  line-height:0;
  cursor:zoom-in;
}

.generated-media-image img{
  display:block;
  width:100%;
  max-height:640px;
  object-fit:contain;
  background:var(--ink);
}

.generated-media-video video{
  display:block;
  width:100%;
  max-height:640px;
  background:#000;
}

.generated-media-status{
  display:flex;
  align-items:center;
  gap:8px;
  padding:11px 13px;
  border:1px solid var(--border);
  border-radius:10px;
  background:var(--surface-raised);
  color:var(--text-muted);
  font-size:12px;
}

.generated-media-error{
  border-color:color-mix(in srgb,var(--danger) 35%,var(--border));
  color:var(--danger);
}

.generated-media-status-icon{
  width:18px;
  height:18px;
  flex:0 0 18px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:color-mix(in srgb,var(--danger) 12%,var(--surface));
  font-weight:700;
}

.generated-media-spinner{
  width:13px;
  height:13px;
  flex:0 0 13px;
  border:2px solid var(--border);
  border-top-color:var(--accent);
  border-radius:50%;
  animation:generatedMediaSpin .8s linear infinite;
}

@keyframes generatedMediaSpin{
  to{transform:rotate(360deg)}
}

@media(max-width:820px){
  .generated-media-list{
    width:100%;
  }

  .generated-media-image img,
  .generated-media-video video{
    max-height:520px;
  }
}

/* ============================================================
   MODES CHAT / IMAGE / VIDÉO
   ============================================================ */

.media-mode-btn{
  border:0;
  border-radius:7px;
  background:transparent;
  color:var(--text-muted);
  padding:6px 12px;
  font-size:11px;
  cursor:pointer;
  transition:.15s ease;
}

.media-mode-btn:hover{
  color:var(--text);
  background:var(--surface-hover);
}

.media-mode-btn.active{
  background:var(--surface);
  color:var(--text);
  box-shadow:0 1px 4px rgba(0,0,0,.08);
}

.media-options{
  width:min(800px,100%);
  margin:0 auto 7px;
  display:flex;
  align-items:center;
  gap:8px;
}

.media-options[hidden]{
  display:none;
}

.media-options label{
  display:flex;
  align-items:center;
  gap:6px;
  color:var(--text-faint);
  font-size:10px;
}

.media-options select{
  border:1px solid var(--border);
  border-radius:7px;
  background:var(--surface-raised);
  color:var(--text);
  padding:5px 8px;
  font-size:10.5px;
  outline:0;
}

.media-options select:focus{
  border-color:var(--accent-deep);
}

.media-generation-mode-option{
  flex-shrink:0;
}

.media-generation-mode-option select{
  min-width:94px;
}

.media-generation-mode-option select option{
  background:var(--surface-raised);
  color:var(--text);
}

.generated-media-prompt-pro{
  border-left:2px solid var(--accent-deep);
}

.generated-media-prompt-rapid{
  border-left:2px solid var(--border);
}

.generated-media-file-actions{
  margin-top:8px;
}

#attach-btn:disabled{
  opacity:.3;
  cursor:default !important;
}

@media(max-width:820px){
.media-mode-btn{
    flex:1;
    text-align:center;
  }

  .media-options{
    width:100%;
    overflow-x:auto;
  }
}

body[data-theme="light"] .media-mode-btn.active{
  background:#ffffff;
  box-shadow:0 1px 4px rgba(20,32,45,.08);
}

body[data-theme="light"] .media-options select{
  background:#ffffff;
  border-color:#d7dde5;
}

/* =========================================================
   CHOIX DU MODE DE RECHERCHE WEB
   ========================================================= */



/* Outils IA compacts au-dessus du composer */
.composer-tools{
  display:flex;
  align-items:center;
  gap:5px;
  width:max-content;
  max-width:100%;
  margin:0 0 6px 4px;
  padding:4px;
  border:1px solid var(--border);
  border-radius:10px;
  background:var(--surface);
}

.composer-tool-btn{
  width:32px;
  height:32px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:0;
  border-radius:8px;
  background:transparent;
  color:var(--text-muted);
  font-size:16px;
  cursor:pointer;
  transition:
    background .15s ease,
    color .15s ease,
    border-color .15s ease;
}

.composer-tool-btn:hover{
  background:var(--surface-hover);
  color:var(--text);
}

.composer-tool-btn.active{
  background:var(--surface-raised);
  color:var(--text);
}

@media (max-width:640px){
  .composer-tools{
    margin-left:2px;
  }

  .composer-tool-btn{
    width:30px;
    height:30px;
  }
}

.generated-media-prompt{
  margin-top:10px;
  padding:9px 11px;
  border:1px solid var(--border);
  border-radius:10px;
  background:var(--surface);
  line-height:1.45;
}

.generated-media-prompt-label{
  display:block;
  margin-bottom:3px;
  font-size:10px;
  font-weight:600;
  color:var(--text-muted);
  text-transform:uppercase;
  letter-spacing:.04em;
}

.generated-media-prompt-text{
  display:block;
  font-size:12px;
  color:var(--text);
  white-space:pre-wrap;
  overflow-wrap:anywhere;
}


.composer-tool-btn > span{
  font-family:
    "Noto Color Emoji",
    "Apple Color Emoji",
    "Segoe UI Emoji",
    sans-serif;
  font-size:16px;
  line-height:1;
  display:grid;
  place-items:center;
}


#video-tool-btn{
  display:inline-flex !important;
}


/* ============================================================
   POLISH — PRICING PREMIUM + ACCESS FREE
   ============================================================ */

/* Carte Premium : prix mieux centré */
.pricing-card-v7{
  align-items:center;
}

.pricing-price-v7{
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
}

.pricing-price-v7 > div{
  display:flex;
  align-items:baseline;
  justify-content:center;
  gap:8px;
  width:100%;
}

.pricing-price-v7 strong{
  display:block;
  text-align:center;
}

/* Avantages Premium : rendu plus premium */
.pricing-list-v7{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.pricing-list-v7 span{
  position:relative;
  display:flex;
  align-items:center;
  gap:10px;
  padding:9px 12px;
  border:1px solid rgba(216,138,32,.14);
  border-radius:10px;
  background:
    linear-gradient(
      135deg,
      rgba(216,138,32,.055),
      rgba(255,255,255,.015)
    );
  line-height:1.4;
  transition:
    border-color .2s ease,
    background .2s ease,
    transform .2s ease;
}

.pricing-list-v7 span::first-letter{
  color:var(--accent);
}

.pricing-list-v7 span:hover{
  border-color:rgba(216,138,32,.28);
  background:
    linear-gradient(
      135deg,
      rgba(216,138,32,.085),
      rgba(255,255,255,.025)
    );
  transform:translateX(2px);
}

/* Le symbole ✓ devient visuellement plus premium */
.pricing-list-v7 span{
  color:var(--text);
}

.pricing-list-v7 span::before{
  content:"✓";
  flex:0 0 20px;
  width:20px;
  height:20px;
  display:grid;
  place-items:center;
  border:1px solid rgba(216,138,32,.45);
  border-radius:50%;
  color:var(--accent);
  font-size:11px;
  font-weight:700;
  background:rgba(216,138,32,.08);
  box-shadow:0 0 12px rgba(216,138,32,.08);
}

/* Masque le ✓ texte original */
.pricing-list-v7 span{
  font-size:14px;
}

.pricing-list-v7 span::first-line{
  color:inherit;
}

/* Carte gratuite parfaitement centrée */
.access-options{
  display:flex;
  justify-content:center;
  align-items:flex-start;
  width:100%;
}

.access-card-free{
  width:min(100%, 490px);
  margin-inline:auto;
}

/* Le bloc de confiance reste centré */
.access-trust{
  width:100%;
  justify-content:center;
}

/* Mobile */
@media (max-width: 760px){

  .pricing-card-v7{
    grid-template-columns:1fr;
    text-align:center;
  }

  .pricing-price-v7,
  .pricing-list-v7,
  .pricing-action-v7{
    width:100%;
  }

  .pricing-list-v7{
    text-align:left;
  }

  .pricing-list-v7 span{
    padding:10px 11px;
  }

  .access-options{
    padding-inline:12px;
  }

  .access-card-free{
    width:100%;
    max-width:490px;
  }
}


/* ============================================================
   FINAL ALIGNMENT — PRICING + FREE ACCESS
   ============================================================ */

/* ---------- CARTE PREMIUM ---------- */

.pricing-card-v7{
  grid-template-columns:
    minmax(260px, .95fr)
    minmax(420px, 1.35fr)
    320px !important;
}

/* Bloc prix : centrage réel dans toute sa colonne */
.pricing-card-v7 .pricing-price-v7{
  width:100% !important;
  min-width:0;
  display:grid !important;
  justify-items:center !important;
  align-content:center;
  text-align:center !important;
}

.pricing-card-v7 .pricing-price-v7 > small{
  text-align:center;
}

.pricing-card-v7 .pricing-price-v7 > div{
  width:100% !important;
  display:flex !important;
  align-items:baseline;
  justify-content:center !important;
  text-align:center;
  gap:8px;
}

.pricing-card-v7 .pricing-price-v7 strong{
  text-align:center !important;
}

.pricing-card-v7 .pricing-price-v7 p{
  text-align:center;
  margin-left:auto;
  margin-right:auto;
}

/* Avantages Premium */
.pricing-card-v7 .pricing-list-v7{
  width:100%;
  display:flex !important;
  flex-direction:column;
  gap:9px;
  align-self:stretch;
  justify-content:center;
}

.pricing-card-v7 .pricing-list-v7 span{
  width:100%;
  min-height:42px;
  display:flex;
  align-items:center;
  gap:11px;
  padding:10px 13px;
  border:1px solid rgba(245,158,11,.20);
  border-radius:11px;
  background:
    linear-gradient(
      135deg,
      rgba(245,158,11,.075),
      rgba(255,255,255,.018)
    );
  color:#E4E7EB;
  font-size:13px;
  font-weight:500;
  letter-spacing:-.01em;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.025),
    0 4px 18px rgba(0,0,0,.12);
}

.pricing-card-v7 .pricing-list-v7 span::before{
  content:"✓";
  flex:0 0 22px;
  width:22px;
  height:22px;
  display:grid;
  place-items:center;
  border:1px solid rgba(245,158,11,.52);
  border-radius:50%;
  background:
    radial-gradient(
      circle at 35% 30%,
      rgba(255,220,130,.22),
      rgba(245,158,11,.08)
    );
  color:#F7B52C;
  font-size:11px;
  font-weight:800;
  box-shadow:
    0 0 14px rgba(245,158,11,.10),
    inset 0 0 8px rgba(245,158,11,.04);
}

.pricing-card-v7 .pricing-list-v7 span:hover{
  border-color:rgba(245,158,11,.34);
  background:
    linear-gradient(
      135deg,
      rgba(245,158,11,.105),
      rgba(255,255,255,.025)
    );
  transform:translateX(2px);
}

/* ---------- CARTE ESSAI GRATUIT ---------- */

/* Le conteneur devient explicitement centré */
.access-panel .access-options{
  width:100% !important;
  display:flex !important;
  flex-direction:row;
  justify-content:center !important;
  align-items:flex-start !important;
  margin-left:auto;
  margin-right:auto;
}

/* La carte ne prend plus la largeur implicite de son ancien grid */
.access-panel .access-options > .access-card-free{
  flex:0 0 min(490px,100%) !important;
  width:min(490px,100%) !important;
  max-width:490px !important;
  margin:0 auto !important;
}

/* ---------- MOBILE ---------- */

@media (max-width:760px){

  .pricing-card-v7{
    grid-template-columns:1fr !important;
  }

  .pricing-card-v7 .pricing-price-v7{
    width:100% !important;
  }

  .pricing-card-v7 .pricing-list-v7{
    width:100% !important;
  }

  .pricing-card-v7 .pricing-action-v7{
    width:100% !important;
    min-width:0 !important;
  }

  .access-panel .access-options{
    width:100% !important;
    padding-inline:12px;
  }

  .access-panel .access-options > .access-card-free{
    flex-basis:100% !important;
    width:100% !important;
    max-width:490px !important;
  }

}

/* Très petits écrans */
@media (max-width:440px){

  .pricing-card-v7 .pricing-list-v7 span{
    min-height:40px;
    padding:9px 10px;
    font-size:12px;
  }

}


/* ============================================================
   PREMIUM PRICE — VISIBILITY
   ============================================================ */

.pricing-card-v7 .pricing-price-v7 strong{
  font-size:clamp(52px,5vw,72px) !important;
  font-weight:850 !important;
  letter-spacing:-2.8px !important;
  line-height:.95 !important;
  color:#FFC247 !important;
  text-shadow:
    0 0 18px rgba(245,158,11,.18),
    0 0 42px rgba(245,158,11,.08);
}

.pricing-card-v7 .pricing-price-v7 > div span{
  font-size:11px !important;
  color:#8B96A2 !important;
  font-weight:600;
}

@media (max-width:760px){
  .pricing-card-v7 .pricing-price-v7 strong{
    font-size:56px !important;
  }
}



/* =========================================================
   CARTE PREMIUM INDÉPENDANTE POUR LES FEATURES
   ========================================================= */

.feature-premium-panel{
  min-height:100vh;
  width:100%;
  box-sizing:border-box;
  padding:32px 20px 48px;
}

.feature-premium-shell{
  width:min(760px,100%);
  margin:0 auto;
}

.feature-premium-back{
  border:0;
  background:transparent;
  color:rgba(255,255,255,.72);
  font:inherit;
  cursor:pointer;
  padding:8px 0;
  margin-bottom:24px;
}

.feature-premium-back:hover{
  color:#fff;
}

.feature-premium-card{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(255,182,38,.35);
  border-radius:28px;
  padding:42px 38px;
  background:
    radial-gradient(circle at 50% 0%,rgba(255,174,0,.16),transparent 42%),
    rgba(15,17,20,.96);
  box-shadow:
    0 28px 90px rgba(0,0,0,.42),
    0 0 70px rgba(255,174,0,.08);
}

.feature-premium-kicker{
  color:#ffb21a;
  font-size:13px;
  font-weight:800;
  letter-spacing:.16em;
  text-transform:uppercase;
  margin-bottom:14px;
}

.feature-premium-card h2{
  margin:0;
  color:#fff;
  font-size:clamp(30px,5vw,48px);
  line-height:1.05;
}

.feature-premium-subtitle{
  margin:16px 0 28px;
  color:rgba(255,255,255,.7);
  font-size:16px;
  line-height:1.6;
}

.feature-premium-price{
  display:flex;
  align-items:baseline;
  gap:10px;
  margin-bottom:30px;
}

.feature-premium-price strong{
  color:#ffbd32;
  font-size:clamp(52px,8vw,78px);
  line-height:.95;
  font-weight:900;
  letter-spacing:-.05em;
}

.feature-premium-price span{
  color:rgba(255,255,255,.68);
  font-size:15px;
}

.feature-premium-benefits{
  display:grid;
  gap:10px;
  margin-bottom:30px;
}

.feature-premium-benefits div{
  display:flex;
  align-items:flex-start;
  gap:11px;
  padding:13px 14px;
  border:1px solid rgba(255,174,0,.2);
  border-radius:14px;
  background:rgba(255,255,255,.025);
  color:#fff;
  line-height:1.35;
}

.feature-premium-benefits span{
  color:#ffb21a;
  font-weight:800;
}

.feature-premium-cta{
  width:100%;
  min-height:62px;
  border:0;
  border-radius:18px;
  padding:0 22px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  cursor:pointer;
  color:#111;
  background:linear-gradient(135deg,#ffe08a,#ffae00);
  font-size:17px;
  font-weight:800;
  box-shadow:0 16px 42px rgba(255,174,0,.22);
}

.feature-premium-cta b{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:12px;
  background:rgba(0,0,0,.12);
  font-size:20px;
}

@media (max-width:640px){
  .feature-premium-panel{
    padding:20px 14px 32px;
  }

  .feature-premium-card{
    padding:30px 20px;
    border-radius:22px;
  }
}

/* =========================================================
   BENEFICES PREMIUM — STYLE FLOTTANT COMME LA LANDING
   ========================================================= */

.feature-premium-benefits{
  display:grid;
  gap:10px;
  margin-bottom:30px;
}

.feature-premium-benefits div{
  position:relative;
  display:flex;
  align-items:center;
  gap:12px;
  min-height:50px;
  box-sizing:border-box;

  padding:10px 15px;

  border:1px solid rgba(184,128,0,.42);
  border-radius:15px;

  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,.035),
      rgba(255,255,255,.018)
    );

  color:#fff;
  font-size:14px;
  line-height:1.35;

  box-shadow:
    0 8px 20px rgba(0,0,0,.16),
    inset 0 0 0 1px rgba(255,180,0,.025);

  transition:
    transform .2s ease,
    border-color .2s ease,
    box-shadow .2s ease,
    background .2s ease;
}

.feature-premium-benefits div:hover{
  transform:translateY(-2px);
  border-color:rgba(255,183,0,.62);

  background:
    linear-gradient(
      180deg,
      rgba(255,183,0,.055),
      rgba(255,255,255,.02)
    );

  box-shadow:
    0 12px 26px rgba(0,0,0,.22),
    0 0 18px rgba(255,174,0,.06);
}

.feature-premium-benefits div > span{
  flex:0 0 24px;
  width:24px;
  height:24px;

  display:grid;
  place-items:center;

  border:1px solid rgba(255,177,0,.72);
  border-radius:50%;

  background:rgba(255,177,0,.055);
  color:#ffb21a;

  font-size:13px;
  font-weight:800;

  box-shadow:
    0 0 12px rgba(255,174,0,.08);
}

@media (max-width:640px){
  .feature-premium-benefits{
    gap:8px;
  }

  .feature-premium-benefits div{
    min-height:48px;
    padding:10px 12px;
    font-size:13px;
  }

  .feature-premium-benefits div > span{
    flex-basis:22px;
    width:22px;
    height:22px;
  }
}


/* PWA — installation IA.YAMO */

#install-pwa-btn.pwa-install-btn{
  border:1px solid currentColor;
  background:transparent;
  color:inherit;
  cursor:pointer;
  padding:8px 12px;
  border-radius:10px;
  font:inherit;
  font-weight:600;
}

#install-pwa-btn.pwa-install-btn:hover{
  background:rgba(255,255,255,.06);
}

#install-pwa-btn.pwa-install-btn[hidden]{
  display:none !important;
}


/* =========================================================
   IA.YAMO — INSTALLATION PWA
   ========================================================= */

.yamo-install-modal{
  position:fixed;
  inset:0;
  z-index:99999;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px;
}

.yamo-install-modal[hidden]{
  display:none !important;
}

.yamo-install-backdrop{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.72);
  backdrop-filter:blur(8px);
}

.yamo-install-panel{
  position:relative;
  z-index:1;
  width:min(440px,100%);
  max-height:calc(100vh - 40px);
  overflow:auto;
  padding:28px;
  border-radius:24px;
  background:#11161d;
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 24px 80px rgba(0,0,0,.50);
}

.yamo-install-close{
  position:absolute;
  top:12px;
  right:12px;
  width:36px;
  height:36px;
  border:0;
  border-radius:50%;
  background:rgba(255,255,255,.07);
  color:inherit;
  font-size:24px;
  cursor:pointer;
}

.yamo-install-icon{
  width:54px;
  height:54px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:16px;
  border-radius:16px;
  background:rgba(255,255,255,.08);
  font-size:24px;
  font-weight:700;
}

.yamo-install-panel h2{
  margin:0 0 8px;
}

.yamo-install-subtitle{
  margin:0 0 20px;
  opacity:.70;
  line-height:1.5;
}

.yamo-install-devices{
  display:grid;
  gap:12px;
}

.yamo-install-device{
  width:100%;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:5px;
  padding:16px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:16px;
  background:rgba(255,255,255,.04);
  color:inherit;
  cursor:pointer;
  text-align:left;
}

.yamo-install-device:hover{
  background:rgba(255,255,255,.08);
}

.yamo-install-device span{
  opacity:.65;
}

.yamo-install-guide{
  display:grid;
  gap:12px;
}

.yamo-install-guide h3{
  margin:0 0 4px;
}

.yamo-install-step{
  display:flex;
  align-items:flex-start;
  gap:12px;
  padding:13px 14px;
  border-radius:14px;
  background:rgba(255,255,255,.04);
  line-height:1.45;
}

.yamo-install-step b{
  flex:0 0 28px;
  width:28px;
  height:28px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:rgba(255,255,255,.10);
}

.yamo-install-native{
  width:100%;
  border:0;
  border-radius:14px;
  padding:14px;
  background:#fff;
  color:#000;
  font-weight:700;
  cursor:pointer;
}

.yamo-install-back{
  border:0;
  background:transparent;
  color:inherit;
  opacity:.70;
  cursor:pointer;
  text-align:left;
  padding:6px 0;
}

#sidebar-install-pwa-btn{
  width:100%;
  margin-bottom:8px;
}

@media(max-width:700px){
  .yamo-install-modal{
    padding:12px;
    align-items:flex-end;
  }

  .yamo-install-panel{
    width:100%;
    border-radius:22px 22px 16px 16px;
    padding:24px 20px 20px;
  }
}


/* =========================================================
   IA.YAMO — POLISH PWA / LOGO / MODE CLAIR
   ========================================================= */

.yamo-install-brand{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:18px;
}

.yamo-install-logo{
  width:52px;
  height:52px;
  display:block;
  object-fit:contain;
  object-position:center;
  flex:0 0 auto;
  border-radius:14px;
}

.yamo-install-brand-name{
  display:inline-flex;
  align-items:baseline;
  font-family:var(--font-display, "Space Grotesk", Inter, sans-serif);
  font-size:24px;
  line-height:1;
  font-weight:700;
  letter-spacing:-0.03em;
}

.yamo-install-brand-ia{
  color:#F2F2F2;
}

.yamo-install-brand-yamo{
  color:#FFC107;
}

.yamo-install-panel h2{
  color:inherit;
  font-weight:700;
  letter-spacing:-0.02em;
}

.yamo-install-subtitle{
  color:inherit;
}

.yamo-install-device{
  transition:
    background-color .18s ease,
    border-color .18s ease,
    transform .18s ease;
}

.yamo-install-device:hover{
  transform:translateY(-1px);
}


/* =========================================================
   MODE CLAIR
   ========================================================= */

body[data-theme="light"] .yamo-install-backdrop{
  background:rgba(15,23,42,.34);
}

body[data-theme="light"] .yamo-install-panel{
  background:#ffffff;
  color:#172033;
  border-color:#dbe2ea;
  box-shadow:0 24px 70px rgba(15,23,42,.18);
}

body[data-theme="light"] .yamo-install-close{
  background:#f1f4f8;
  color:#172033;
}

body[data-theme="light"] .yamo-install-subtitle{
  color:#667085;
}

body[data-theme="light"] .yamo-install-device{
  background:#f8fafc;
  border-color:#e2e8f0;
  color:#172033;
}

body[data-theme="light"] .yamo-install-device:hover{
  background:#f1f5f9;
  border-color:#cbd5e1;
}

body[data-theme="light"] .yamo-install-device span{
  color:#667085;
}

body[data-theme="light"] .yamo-install-step{
  background:#f8fafc;
  color:#172033;
  border:1px solid #e2e8f0;
}

body[data-theme="light"] .yamo-install-step b{
  background:#e9eef5;
  color:#172033;
}

body[data-theme="light"] .yamo-install-back{
  color:#475467;
}

body[data-theme="light"] .yamo-install-native{
  background:#111827;
  color:#ffffff;
}


/* =========================================================
   FALLBACK : si le site utilise prefers-color-scheme
   ========================================================= */

@media (prefers-color-scheme: light){
  body:not([data-theme="dark"]) .yamo-install-backdrop{
    background:rgba(15,23,42,.34);
  }

  body:not([data-theme="dark"]) .yamo-install-panel{
    background:#ffffff;
    color:#172033;
    border-color:#dbe2ea;
    box-shadow:0 24px 70px rgba(15,23,42,.18);
  }

  body:not([data-theme="dark"]) .yamo-install-close{
    background:#f1f4f8;
    color:#172033;
  }

  body:not([data-theme="dark"]) .yamo-install-subtitle{
    color:#667085;
  }

  body:not([data-theme="dark"]) .yamo-install-device{
    background:#f8fafc;
    border-color:#e2e8f0;
    color:#172033;
  }

  body:not([data-theme="dark"]) .yamo-install-step{
    background:#f8fafc;
    color:#172033;
    border:1px solid #e2e8f0;
  }
}


/* IA.YAMO — branding exact du modal */

body[data-theme="light"] .yamo-install-brand-ia{
  color:#171717;
}

body[data-theme="light"] .yamo-install-brand-yamo{
  color:#FFC107;
}

body[data-theme="light"] .yamo-install-logo{
  filter:none;
}

@media (prefers-color-scheme: light){
  body:not([data-theme="dark"]) .yamo-install-brand-ia{
    color:#171717;
  }

  body:not([data-theme="dark"]) .yamo-install-brand-yamo{
    color:#FFC107;
  }

  body:not([data-theme="dark"]) .yamo-install-logo{
    filter:none;
  }
}