/* Odette : surfaces lumineuses, vert profond et accents cuivre. */
:root{--bg:#f4f5f1;--surface:#fff;--sunken:#eef0eb;--ink:#202b28;--muted:#64716b;--faint:#7c8882;--line:#e1e7e1;--radius:20px;--shadow:0 2px 4px #183c2803,0 12px 32px #183c2806}
body{letter-spacing:-.012em}
h1{font-size:34px;line-height:1.16}
button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}
.sidebar{padding:28px 16px 18px;background:linear-gradient(180deg,#fff,#f9fbf8);border-right-color:#e0e7df}
.brand{padding-bottom:24px;margin-bottom:22px}
.brand-mark{width:48px;height:48px;border-radius:15px}
.nav-label{font-size:10px;letter-spacing:.13em;color:var(--muted)}
nav{gap:20px}nav button{padding:10px 13px;border-radius:12px;font-size:13px}
nav button.active{background:var(--brand);color:var(--on-brand);box-shadow:0 5px 14px color-mix(in srgb,var(--brand) 18%,transparent)}
nav button.active .ico{color:var(--on-brand)}
.profile{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:12px}
main>header{height:76px;background:color-mix(in srgb,var(--bg) 92%,transparent);border-bottom:1px solid #e2e7e080}
#content{padding-top:38px;padding-bottom:24px}
.page-head{margin-bottom:30px}.subtitle{line-height:1.65;margin-top:10px}
.btn{border-radius:12px;min-height:42px;padding:10px 17px;transition:background .18s,box-shadow .18s,transform .18s}
.btn.primary{box-shadow:0 4px 10px color-mix(in srgb,var(--brand) 14%,transparent)}
.btn.primary:hover{box-shadow:0 6px 16px color-mix(in srgb,var(--brand) 23%,transparent)}
input:not([type=checkbox]):not([type=radio]),select,textarea{border-radius:12px;border-color:var(--line);background:#fcfdfb;min-height:45px}
input:focus,select:focus,textarea:focus{background:#fff;box-shadow:0 0 0 3px var(--brand-soft)}
.field{gap:8px;font-size:12px;font-weight:600;color:var(--ink)}
.field small{font-weight:400;line-height:1.5}
.card-head{padding:23px 24px}.card-head h2{font-size:16px;letter-spacing:-.025em}
.card-head p{line-height:1.6;margin-top:6px}.card-body{padding:4px 24px 24px}
.stats{gap:18px;margin-bottom:26px}.stat{padding:23px 24px;position:relative;overflow:hidden}
.stat:first-child{background:linear-gradient(145deg,var(--brand),color-mix(in srgb,var(--brand) 85%,#000));color:var(--on-brand);border-color:var(--brand)}
.stat:first-child .stat-top,.stat:first-child .stat-note{color:var(--on-brand);opacity:.85}
.stat:first-child .stat-icon{background:#ffffff20;color:var(--on-brand)}
.stat-value{font-size:clamp(23px,2.2vw,30px);font-weight:600;margin:18px 0 8px}
.stat-icon{width:38px;height:38px;border-radius:12px}.stat-note{line-height:1.6}
thead th{background:#f8faf6;color:var(--muted);font-size:10px;letter-spacing:.075em;padding-top:15px;padding-bottom:15px}
tbody td{padding-top:16px;padding-bottom:16px;border-color:#edf0ea}
tbody tr:hover td{background:#f9fbf7}.pill{border-radius:8px;font-weight:600}
.insight-banner{border-radius:20px;border:1px solid var(--brand-line);background:var(--brand-soft);padding:24px}
.insight-banner .spark{color:var(--platform-accent)}
.notice{border-radius:12px;line-height:1.65}
dialog{border-radius:24px;padding:28px;box-shadow:0 30px 100px #103c3030}
dialog::backdrop{background:#102e285e;backdrop-filter:blur(6px)}
.recovery-code{border:1px solid var(--brand-line)}
footer{padding:26px 20px;color:var(--muted);font-size:11px}
/* Accueil : formulaire compact et vitrine éditoriale. */
.auth{grid-template-columns:minmax(0,1fr) minmax(0,1fr);background:#fcfdf9}
.auth-form{padding:36px clamp(24px,5vw,72px);gap:20px;justify-content:center}
.auth-brand{margin-bottom:4px}.product-logo{width:210px}
.visitor-currency{margin:0;max-width:270px;font-size:11px;color:var(--muted)}
.visitor-currency select{font-size:12px;min-height:38px;padding-top:7px;padding-bottom:7px}
.auth-card{margin:10px auto;padding:28px 0;width:100%;max-width:420px}
.auth-card h1{font-size:36px;letter-spacing:-.03em;margin-top:28px}
.auth-card .subtitle{font-size:13px;margin-bottom:28px}
.auth-card form .btn.primary{min-height:48px;border-radius:13px}
.auth-tabs{background:#edf1e9;border-radius:13px;padding:4px}
.auth-tabs button{padding:11px}.auth-foot{color:var(--muted);line-height:1.65;max-width:430px;margin:0 auto}
.auth-showcase{padding:54px clamp(28px,5vw,72px);background:radial-gradient(ellipse at 100% 0%,#3b7060 0%,#174c43 48%,#103a33 100%);min-height:100vh}
.auth-showcase::before{content:"";position:absolute;right:-160px;top:-150px;width:520px;height:520px;border:1px solid #ffffff14;border-radius:50%;box-shadow:0 0 0 70px #ffffff04,0 0 0 140px #ffffff03;pointer-events:none}
.showcase-inner{max-width:520px}.auth-showcase h2{font-size:clamp(34px,3.5vw,50px);line-height:1.14;letter-spacing:-.035em;margin-bottom:30px}
.auth-showcase .eyebrow{font-size:10px;letter-spacing:.16em;color:#dfbe95}
.benefits{gap:20px}.benefits li{line-height:1.6}.benefits b{font-size:13px}.benefits span{color:#d8e5df;font-size:12px}
.mock{transform:none!important;border-radius:20px;box-shadow:0 24px 60px #082a2845;border:1px solid #ffffff30;margin-top:32px}
.mock-top{background:#f8faf6}.mock-kpis div{border-color:#e5ebe2;background:#fff}.mock-chart span{border-radius:5px 5px 0 0}
.demo-caption{font-size:10px;letter-spacing:.01em}.mock-orders>div{border-radius:10px}
/* Console opérateur : même langage visuel. */
main.console{margin:0 auto;max-width:1360px;padding:34px 32px 60px}
.console-head{padding:0 0 24px;border-bottom:1px solid var(--line);margin-bottom:28px}
.console-head h1{font-size:28px}.kpis{gap:16px;margin-bottom:26px}
.kpi{padding:22px;border-radius:20px;box-shadow:var(--shadow)}.kpi b{font-size:30px;margin-top:12px}
.auth-box{max-width:440px;margin:8vh auto}.auth-box .card{padding:32px}.auth-box h1{font-size:30px}
@media(max-width:1100px){.auth{grid-template-columns:1fr}.auth-form{min-height:100svh;max-width:620px;width:100%;margin:0 auto;padding:30px 36px}.auth-showcase{display:none}.auth-card{margin:auto;padding:25px 0}}
@media(max-width:860px){main>header{height:68px}#content{padding:24px 18px}h1{font-size:29px}.page-head{margin-bottom:22px}.stat{padding:18px}.card-head{padding:19px 18px}.card-body{padding:4px 18px 20px}main.console{padding:22px 18px 40px}.console-head h1{font-size:24px}}
@media(max-width:480px){.auth-form{padding:24px;gap:18px}.auth-card h1{font-size:32px}.product-logo{width:185px}.visitor-currency{max-width:100%}.auth-card{padding:15px 0}.stat-value{font-size:23px}.kpi{padding:16px}.kpi b{font-size:25px}dialog{padding:22px}.console-logo{width:145px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;scroll-behavior:auto!important}}
