@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:ital,wght@0,600;0,700;0,800;1,800&display=swap');
:root {
    --red:#D42B2B; --red-dim:#7A1818;
    --black:#09090a; --s2:#121314; --s3:#1b1c1e;
    --border:#2a2c2f; --border2:#3b3e42;
    --text:#EEECE8; --muted:#979a9e; --dim:#4a4d51;
    --green:#3bb273; --amber:#e0952c; --blue:#3a82c4; --cyan:#27a0b4;
    --hairline:rgba(255,255,255,.08);
    --display:'Barlow Condensed','Bebas Neue',sans-serif;
    --accent:#D42B2B; --accent-dim:#7A1818; --accent-rgb:212,43,43;
}

/* Thème Octobre Rose — classe ajoutée par common.js uniquement en octobre */
html.octobre-rose {
    --accent:     #ec407a;
    --accent-dim: #8E2A4F;
    --accent-rgb: 236,64,122;
}

* { margin:0; padding:0; box-sizing:border-box; -webkit-tap-highlight-color:transparent; }

body { font-family:'DM Sans',sans-serif; background:#080808 url('bennys.png') center/cover fixed; min-height:100vh; color:var(--text); -webkit-font-smoothing:antialiased; line-height:1.5; }

body::before { content:''; position:fixed; inset:0; pointer-events:none; z-index:0; background:linear-gradient(rgba(8,8,9,.80),rgba(8,8,9,.95)); }

body::after {
    content:'';
    position:fixed; inset:0;
    background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
    pointer-events:none; z-index:1; opacity:.6;
}

header, main { position:relative; z-index:2; }

.header { background:rgba(9,9,10,.94); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); padding:0 32px; min-height:72px; display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap; position:sticky; top:0; z-index:200; }

.logo { display:flex; align-items:baseline; gap:10px; }
.logo h1 { font-family:var(--display); font-weight:800; font-style:italic; font-size:36px; letter-spacing:.5px; text-transform:uppercase; color:#fff; line-height:1; }
.logo span { font-size:11px; font-weight:600; letter-spacing:3px; text-transform:uppercase; color:var(--muted); }

.main { max-width:1100px; margin:0 auto; padding:48px 24px 96px; }

.section-hd { display:flex; align-items:center; flex-wrap:wrap; gap:16px; margin:0 0 28px; }
.section-hd:first-child { margin-top:0; }

.section-icon-box { width:54px; height:54px; background:var(--accent); border-radius:4px; display:flex; align-items:center; justify-content:center; font-size:25px; flex-shrink:0; }

.section-name { font-family:var(--display); font-weight:800; font-style:italic; font-size:clamp(38px,6vw,58px); line-height:.95; text-transform:uppercase; color:#fff; }

.calc-card { background:rgba(18,19,20,.96); border:1px solid var(--border); border-radius:6px; overflow:hidden; box-shadow:0 28px 50px -30px #000;}

.type-selector { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; padding:16px; border-bottom:1px solid var(--hairline); }

.type-btn { padding:16px 12px; display:flex; flex-direction:column; align-items:center; gap:6px; background:#0d0e0f; border:1px solid var(--border2); border-radius:4px; cursor:pointer; transition:.15s; color:var(--muted); }
.type-btn:last-child { border-right:1px solid var(--border2); }
.type-btn:hover { background:rgba(255,255,255,0.03); color:var(--text); }
.type-btn.active { background:var(--accent); border-color:var(--accent); color:#fff; }
.type-btn.active .type-indicator { background:transparent; }

.type-icon { font-size:24px; }
.type-label { font-family:var(--display); font-size:17px; font-weight:700; letter-spacing:1.2px; text-transform:uppercase; }
.type-indicator { width:4px; height:4px; border-radius:50%; background:transparent; transition:.2s; margin-top:2px; }

.form-body { padding:24px; display:flex; flex-direction:column; gap:18px; }

.field-row {
    display:flex; flex-direction:column; gap:8px;
}

.field-label { font-family:var(--display); font-size:15px; font-weight:700; letter-spacing:1.4px; text-transform:uppercase; color:#b4b6b9; }

.field-input-wrap { position:relative; display:flex; align-items:center; }

.field-prefix { position:absolute; left:16px; font-size:20px; font-weight:600; color:var(--muted); pointer-events:none; }

input[type="number"] { width:100%; padding:13px 14px 13px 28px; background:#0a0b0c; border:1px solid var(--border2); border-radius:4px; font-family:'DM Sans',sans-serif; font-size:16px; font-weight:600; color:var(--text); transition:.15s; -webkit-appearance:none; appearance:none; }
input[type="number"]:focus { outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(var(--accent-rgb),.22); }
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button { -webkit-appearance:none; margin:0; }

.results { margin:0 24px 24px; background:#0b0c0d; border:1px solid var(--hairline); border-radius:4px; overflow:hidden; }

.result-row {
    display:flex; align-items:center; justify-content:space-between;
    padding:14px 18px;
    border-bottom:1px solid rgba(255,255,255,0.05);
}
.result-row:last-child { border-bottom:none; }

.result-label { font-size:13px; font-weight:500; color:#a9abae; display:flex; align-items:center; gap:8px; }
.result-label .dot-badge {
    width:6px; height:6px; border-radius:50%;
}

.result-value { font-family:var(--display); font-weight:700; font-size:32px; letter-spacing:.5px; font-variant-numeric:tabular-nums; }
.result-value.highlight { color:var(--green); }
.result-value.total { color:#fff; font-size:46px; }
.result-value.marge { color:var(--amber); }
.result-value.capped { color:var(--red); }

.cap-notice {
    display:none; margin:0 24px 12px;
    background:rgba(212,43,43,0.08); border:1px solid rgba(212,43,43,0.2);
    border-radius:4px; padding:10px 14px;
    font-size:12px; font-weight:500; color:#e05555;
    align-items:center; gap:8px;
}
.cap-notice.visible { display:flex; }

.marge-rule {
    font-size:11px; color:var(--muted); line-height:1.5;
    padding:10px 18px 14px;
    border-top:1px solid rgba(255,255,255,0.05);
    text-align:center;
}

.discount-sep {
    margin:0 24px;
    border:none; border-top:1px dashed rgba(255,255,255,0.1);
}

.discount-body {
    padding:20px 24px; display:flex; flex-direction:column; gap:14px;
}

.discount-label-row {
    display:flex; align-items:center; gap:10px;
}

.discount-badge {
    font-size:10px; font-weight:700; letter-spacing:1.5px; text-transform:uppercase;
    background:rgba(196,120,26,0.15); color:var(--amber);
    border:1px solid rgba(196,120,26,0.3);
    padding:3px 9px; border-radius:100px;
}

.field-suffix {
    position:absolute; right:14px;
    font-size:15px; font-weight:600; color:var(--muted); pointer-events:none;
}

input.no-prefix { padding-left:14px; }
input.has-suffix { padding-right:34px; }

.discount-results {
    background:rgba(196,120,26,0.06);
    border:1px solid rgba(196,120,26,0.15);
    border-radius:6px; overflow:hidden;
}

.discount-results .result-row { border-bottom-color:rgba(196,120,26,0.1); }

.btn-reset { display:flex; align-items:center; justify-content:center; gap:8px; width:calc(100% - 48px); margin:0 24px 24px; padding:13px; border-radius:4px; background:transparent; color:var(--muted); font-family:var(--display); font-size:16px; font-weight:700; letter-spacing:1.2px; text-transform:uppercase; cursor:pointer; transition:.15s; border:1px solid var(--border2); }
.btn-reset:hover { color:#fff; border-color:var(--accent); background:rgba(var(--accent-rgb),.12); }
.btn-reset:active { transform:scale(.98); }

.formula-panel { background:rgba(18,19,20,.96); border:1px solid var(--border); border-radius:6px; overflow:hidden; box-shadow:0 28px 50px -30px #000; margin-top:0;}

.formula-header {
    padding:14px 20px; border-bottom:1px solid rgba(255,255,255,0.07);
    display:flex; align-items:center; gap:10px;
}
.formula-header h2 { font-family:var(--display); font-size:22px; font-weight:800; font-style:italic; letter-spacing:1px; text-transform:uppercase; }

.formula-grid {
    display:grid; grid-template-columns:repeat(2,1fr);
}

.formula-item {
    padding:16px 18px; border-right:1px solid rgba(255,255,255,0.07);
}
.formula-item:last-child { border-right:none; }

.fi-vehicle { font-family:var(--display); font-size:15px; font-weight:700; letter-spacing:1.4px; text-transform:uppercase; color:#c8cacd; margin-bottom:8px; display:flex; align-items:center; gap:6px; }

.fi-formula { font-family:'DM Sans',sans-serif; font-size:14px; font-weight:500; color:var(--text); line-height:1.55; }

.fi-cap { display:inline-block; font-size:12px; color:#ff8a8a; margin-top:8px; font-weight:600; padding:3px 10px; border-radius:3px; background:rgba(212,43,43,.12); border:1px solid rgba(212,43,43,.3); }

.toast { display:none; position:fixed; bottom:24px; left:50%; transform:translateX(-50%); padding:12px 22px; border-radius:4px; font-size:13px; font-weight:600; z-index:2000; white-space:nowrap; box-shadow:0 14px 34px -8px rgba(0,0,0,.7); animation:toastIn .3s cubic-bezier(.16,1,.3,1); }
@keyframes toastIn {
    from{opacity:0;transform:translateX(-50%) translateY(16px)}
    to{opacity:1;transform:translateX(-50%) translateY(0)}
}
.toast.success { background:var(--green); color:#fff; }
.toast.warning { background:var(--amber); color:#fff; }

@media(max-width:600px){
    .header { padding:14px 16px; }
    .logo h1 { font-size:26px; }
    .main { padding:24px 12px 70px; }
    .type-btn { padding:14px 8px; }
    .type-icon { font-size:20px; }
    .formula-grid { grid-template-columns:1fr; }
    .formula-item { border-right:none; border-bottom:1px solid rgba(255,255,255,0.07); }
    .formula-item:last-child { border-bottom:none; }
}

.page-nav { display:flex; gap:4px; align-items:center; position:relative; z-index:2; }
.page-nav-btn { padding:10px 16px; display:flex; align-items:center; gap:8px; background:transparent; border:none; border-radius:4px; font-family:var(--display); font-size:17px; font-weight:700; letter-spacing:1.2px; text-transform:uppercase; color:#b4b6b9; cursor:pointer; transition:.15s; text-decoration:none; white-space:nowrap; }
.page-nav-btn .pnb-ico { font-size:14px; opacity:.8; }
.page-nav-btn:hover { color:#fff; background:rgba(255,255,255,.07); }
.page-nav-btn.active { color:#fff; background:var(--accent); }

.page { display:none; }
.page.active { display:block; }

@media(max-width:600px){
    .page-nav { padding:0 12px; gap:16px; overflow-x:auto; }
    .page-nav-btn { font-size:13px; padding:13px 0 11px; white-space:nowrap; }
}

.highlight-note { margin:0 24px 20px; background:rgba(224,149,44,.10); border:1px solid rgba(224,149,44,.4); border-left:4px solid var(--amber); border-radius:4px; padding:14px 16px; display:flex; align-items:flex-start; gap:10px; }
.highlight-note .hn-icon { font-size:17px; line-height:1.3; flex-shrink:0; }
.highlight-note .hn-text { font-size:12.5px; line-height:1.55; color:#e8c98a; font-weight:500; }
.highlight-note .hn-text strong { color:var(--amber); }

#page-stock {
    width:100vw;
    max-width:1200px;
    position:relative;
    left:50%;
    transform:translateX(-50%);
    padding:0 20px;
    box-sizing:border-box;
}
.stock-grid {
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(360px, 1fr));
    gap:22px;
    align-items:start;
}
.stock-card { background:rgba(18,19,20,.96); border:1px solid var(--border); border-radius:6px; overflow:hidden; box-shadow:0 28px 50px -30px #000;}

.stock-card-wide { grid-column:1 / -1; }

@media(max-width:700px){
    .stock-grid { grid-template-columns:1fr; }
    #page-stock { padding:0 20px; }
}
.stock-card-hd { padding:16px 22px; border-bottom:1px solid var(--hairline); background:rgba(255,255,255,.025); display:flex; align-items:center; justify-content:space-between; gap:10px; }
.stock-card-hd h3 { font-family:var(--display); font-size:24px; font-weight:800; font-style:italic; letter-spacing:.8px; text-transform:uppercase; color:#fff; }
.stock-source-tag {
    font-size:9.5px; font-weight:700; letter-spacing:1px; text-transform:uppercase;
    color:var(--muted); background:rgba(255,255,255,0.05); border:1px solid var(--border);
    padding:3px 8px; border-radius:100px; white-space:nowrap;
}

.stock-tier-dot { width:8px; height:8px; border-radius:50%; flex-shrink:0; }
.tier-bas { background:var(--blue); }
.tier-moyenne { background:var(--cyan); }
.tier-haute { background:var(--amber); }
.tier-performance { background:var(--red); }
.tier-utilitaire { background:var(--green); }

.stock-qty-input {
    width:72px; padding:9px 10px; text-align:center;
    background:rgba(255,255,255,0.07); border:1.5px solid var(--border); border-radius:4px;
    font-family:'DM Sans',sans-serif; font-size:15px; font-weight:700; color:var(--text);
    -webkit-appearance:none; appearance:none;
}
.stock-qty-input:focus { outline:none; border-color:var(--accent-dim); box-shadow:0 0 0 3px rgba(var(--accent-rgb),.12); }
.stock-qty-input.low { border-color:rgba(212,43,43,.5); color:#e05555; }

.stock-status-bar { padding:10px 20px 14px; display:flex; align-items:center; gap:8px; font-size:11px; color:var(--muted); }
.stock-tabs { display:flex; flex-wrap:wrap; gap:8px; padding:0 0 18px; }
.stock-tab { font-family:var(--display); font-size:17px; font-weight:700; letter-spacing:1px; text-transform:uppercase; color:#b4b6b9; background:#0d0e0f; border:1px solid var(--border2); border-radius:4px; padding:9px 18px; cursor:pointer; transition:.15s; }
.stock-tab:hover { color:var(--text); border-color:var(--border2); }
.stock-tab.active { color:#fff; background:var(--accent); border-color:var(--accent); }
.stock-grid { grid-template-columns:1fr; }
@media(min-width:900px){ .stock-grid { grid-template-columns:1fr; } }
.stock-status-dot { width:6px; height:6px; border-radius:50%; background:var(--muted); }
.stock-status-dot.ok { background:var(--green); }
.stock-status-dot.err { background:var(--red); }
.stock-status-dot.loading { background:var(--amber); animation:pulse 1s infinite; }
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:.3} }

.stock-refresh-btn {
    display:flex; align-items:center; gap:6px;
    background:rgba(255,255,255,0.06); border:1px solid var(--border); border-radius:4px;
    color:var(--muted); font-family:'DM Sans',sans-serif; font-size:11px; font-weight:600;
    padding:7px 12px; cursor:pointer; transition:.2s;
}
.stock-refresh-btn:hover { color:var(--text); border-color:var(--border2); }

@media(max-width:600px){
    .stock-qty-input { width:52px; }
}

.stock-input-wrap { display:flex; flex-wrap:wrap; align-items:center; gap:6px; justify-content:center; }
.stock-th-inline { display:none; align-items:center; gap:5px; width:100%; justify-content:center; margin-top:4px; }
.threshold-edit-active .stock-th-inline { display:flex; }
.threshold-edit-active .stock-hist-btn { display:none; }
.stock-th-input {
    width:56px; padding:6px 7px; text-align:center;
    background:rgba(var(--accent-rgb),0.07); border:1.5px solid var(--accent-dim); border-radius:4px;
    font-family:'DM Sans',sans-serif; font-size:12.5px; font-weight:700; color:var(--text);
}
.stock-th-input::placeholder { color:var(--muted); font-weight:600; }
.threshold-edit-bar {
    display:none; flex-wrap:wrap; align-items:center; gap:10px;
    padding:12px 14px; margin-bottom:16px; background:rgba(var(--accent-rgb),0.06);
    border:1px solid var(--accent-dim); border-radius:6px;
}
.threshold-edit-bar.visible { display:flex; }
.threshold-edit-label { font-size:12.5px; font-weight:700; color:var(--text); }
.stock-hist-btn {
    width:26px; height:26px; flex-shrink:0;
    display:flex; align-items:center; justify-content:center;
    background:rgba(255,255,255,0.05); border:1px solid var(--border); border-radius:4px;
    color:var(--muted); cursor:pointer; font-size:13px; transition:.2s; line-height:1;
}
.stock-hist-btn:hover { color:var(--cyan); border-color:var(--cyan); background:rgba(31,138,156,0.1); }
.stock-hist-btn:disabled { opacity:.35; cursor:not-allowed; }
.stock-hist-btn:disabled:hover { color:var(--muted); border-color:var(--border); background:rgba(255,255,255,0.05); }
.stat-card .stock-input-wrap { justify-content:center; }

.hist-overlay {
    display:none; position:fixed; inset:0; z-index:3000;
    background:rgba(0,0,0,0.72); backdrop-filter:blur(4px);
    align-items:center; justify-content:center; padding:20px;
}
.hist-overlay.visible { display:flex; }
.hist-modal {
    width:100%; max-width:560px;
    background:#0d0d0d; border:1px solid rgba(255,255,255,0.1); border-radius:6px;
    overflow:hidden;
}
.hist-modal-hd {
    padding:16px 20px; border-bottom:1px solid rgba(255,255,255,0.07);
    display:flex; align-items:center; justify-content:space-between; gap:10px;
}
.hist-modal-hd h3 { font-family:var(--display); font-size:18px; letter-spacing:1.5px; color:var(--text); }
.hist-detail-toggle {
    display:flex; align-items:center; gap:6px; font-size:12px; color:var(--muted);
    margin-left:auto; margin-right:14px; cursor:pointer; user-select:none;
}
.hist-detail-toggle input { accent-color:var(--accent); cursor:pointer; }
.hist-close-btn {
    width:28px; height:28px; border-radius:4px; border:1px solid var(--border);
    background:rgba(255,255,255,0.05); color:var(--muted); cursor:pointer; font-size:15px;
}
.hist-close-btn:hover { color:var(--text); border-color:var(--border2); }
.hist-modal-body { padding:18px 20px 22px; }
.hist-chart-wrap { position:relative; height:260px; }
.hist-empty { text-align:center; color:var(--muted); font-size:13px; padding:40px 10px; }
.hist-loading { text-align:center; color:var(--muted); font-size:13px; padding:40px 10px; }

.hist-summary {
    display:flex; align-items:baseline; gap:10px; margin-bottom:6px;
}
.hist-summary-current {
    font-family:var(--display); font-size:28px; letter-spacing:.5px; color:var(--text);
}
.hist-summary-delta { font-size:12px; font-weight:600; }

.reduction-selector {
    display:grid; grid-template-columns:repeat(3,1fr); gap:8px;
}
.reduction-btn {
    display:flex; flex-direction:column; align-items:center; gap:4px;
    padding:12px 8px;
    background:rgba(255,255,255,0.04); border:1px solid var(--border); border-radius:6px;
    cursor:pointer; transition:.2s; color:var(--muted);
    font-family:'DM Sans',sans-serif;
}
.reduction-btn:hover { background:rgba(255,255,255,0.07); color:var(--text); border-color:var(--border2); }
.reduction-btn.active { background:rgba(196,120,26,0.12); border-color:var(--amber); color:var(--text); }
.reduction-btn .rb-label { font-size:10px; font-weight:700; letter-spacing:1px; text-transform:uppercase; }
.reduction-btn .rb-pct { font-family:var(--display); font-size:20px; letter-spacing:.5px; color:var(--muted); }
.reduction-btn.active .rb-pct { color:var(--amber); }

.stock-status-sep { color:var(--dim); }

.stock-auth-bar { margin:0 0 18px; background:rgba(18,19,20,.96); border:1px solid var(--border); border-radius:6px; padding:12px 16px; }
.stock-auth-locked, .stock-auth-unlocked {
    display:flex; align-items:center; gap:10px; flex-wrap:wrap;
}
.stock-auth-icon { font-size:15px; flex-shrink:0; }
.stock-auth-input {
    flex:1; min-width:140px;
    padding:9px 12px;
    background:rgba(255,255,255,0.06); border:1px solid var(--border); border-radius:4px;
    font-family:'DM Sans',sans-serif; font-size:13px; font-weight:600; color:var(--text);
}
.stock-auth-input:focus { outline:none; border-color:var(--accent-dim); box-shadow:0 0 0 3px rgba(var(--accent-rgb),.12); }
.stock-auth-input.err { border-color:#e05555; }
.stock-auth-error {
    display:none; margin-top:10px; padding:8px 12px;
    background:rgba(212,43,43,0.08); border:1px solid rgba(212,43,43,0.25); border-radius:4px;
    font-size:12px; font-weight:600; color:#e05555;
}
.stock-auth-btn {
    padding:9px 16px; border-radius:4px; border:1px solid var(--border);
    background:rgba(255,255,255,0.06); color:var(--text);
    font-family:'DM Sans',sans-serif; font-size:12px; font-weight:700;
    letter-spacing:.5px; cursor:pointer; transition:.2s; white-space:nowrap;
}
.stock-auth-btn:hover { border-color:var(--border2); background:rgba(255,255,255,0.1); }
.stock-auth-btn:disabled { opacity:.5; cursor:not-allowed; }
.stock-auth-btn-lock { background:rgba(var(--accent-rgb),0.1); border-color:rgba(var(--accent-rgb),0.3); color:var(--accent); }
.stock-auth-btn-lock:hover { background:rgba(var(--accent-rgb),0.18); }
.stock-auth-badge { font-size:12.5px; font-weight:600; color:var(--green); }
.stock-auth-badge #stockAuthName { color:var(--text); }

.stock-qty-input:disabled {
    opacity:.45; cursor:not-allowed; background:rgba(255,255,255,0.03);
}

.stock-fold-btn {
    display:flex; align-items:center; gap:6px;
    background:rgba(255,255,255,0.06); border:1px solid var(--border); border-radius:4px;
    color:var(--muted); font-family:'DM Sans',sans-serif; font-size:11px; font-weight:600;
    padding:7px 12px; cursor:pointer; transition:.2s; white-space:nowrap;
}
.stock-fold-btn:hover { color:var(--text); border-color:var(--border2); }
.stock-fold-btn:disabled { opacity:.35; cursor:not-allowed; }
.stock-fold-btn:disabled:hover { color:var(--muted); border-color:var(--border); }

.stock-qty-input.high { border-color:rgba(42,148,85,.5); color:#4CC98A; }
.stock-alert-badge {
    width:100%; text-align:center; font-size:10.5px; font-weight:700;
    letter-spacing:.3px; padding-top:2px;
}
.stock-alert-badge.low { color:#e05555; }
.stock-alert-badge.high { color:#4CC98A; }

.stat-grid {
    display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr));
    gap:14px; padding:18px;
}
.stat-card {
    position:relative; overflow:hidden;
    background:rgba(255,255,255,0.03); border:1px solid var(--border); border-radius:6px;
    padding:20px 14px 16px; display:flex; flex-direction:column; align-items:center; gap:8px;
    text-align:center;
}
.stat-card-top {
    position:absolute; top:0; left:0; right:0; height:3px;
}
.stat-card-top-neutral { background:var(--accent-dim); }
.stat-card-ico { font-size:22px; margin-top:2px; }
.stat-card-label {
    font-size:10px; font-weight:700; letter-spacing:1px; text-transform:uppercase; color:var(--muted);
}
.stat-card-value { font-family:var(--display); font-weight:700; font-size:40px; color:#fff; line-height:1; }
.stat-card-value .scv-unit { font-size:12px; color:var(--muted); margin-left:2px; }
.stat-card .stock-input-wrap { margin-top:4px; }

.kits-groups {
    display:grid; grid-template-columns:repeat(auto-fit,minmax(480px,1fr));
}
.stat-group { padding:18px 18px 4px; border-bottom:1px solid rgba(255,255,255,0.05); }
.kits-groups .stat-group:last-child { border-bottom:none; }
.stat-group-label {
    display:flex; align-items:center; gap:8px; font-weight:700; font-size:13px;
    color:var(--text); margin-bottom:12px;
}
.stat-group .stat-grid { padding:0 0 18px; }

@media(max-width:600px){
    .stat-grid { grid-template-columns:repeat(2,1fr); gap:10px; padding:14px; }
    .stat-card-value { font-size:26px; }
}

/* ---- Identité atelier ---- */
html { color-scheme:dark; scroll-behavior:smooth; }
::selection { background:var(--accent); color:#fff; }
.logo h1::before { content:''; display:inline-block; width:11px; height:28px; margin-right:12px; background:var(--accent); transform:skewX(-18deg); vertical-align:-3px; }
.calc-card { border-top:4px solid var(--accent); }
.field-input-wrap input[type="number"] { font-family:var(--display); font-size:34px; font-weight:700; letter-spacing:.5px; padding:10px 16px 8px 38px; font-variant-numeric:tabular-nums; }
.formula-item { border-right:none; border-bottom:1px solid var(--hairline); }
.formula-item:last-child { border-bottom:none; }
.formula-grid { grid-template-columns:1fr; }
/* Pages calculateur : formule à gauche, calcul à droite */
#page-calc.active, #page-casino.active { display:grid; grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:20px 28px; align-items:start; }
#page-calc > .section-hd, #page-casino > .section-hd { grid-column:1 / -1; }
#page-calc > .calc-card, #page-casino > .calc-card { grid-column:2; grid-row:2 / span 6; }
#page-calc > .formula-panel, #page-calc > .highlight-note, #page-casino > .formula-panel, #page-casino > .highlight-note { grid-column:1; }
#page-casino > .highlight-note, #page-calc > .highlight-note { margin:0 !important; }
body > footer { background:#09090a !important; border-top:1px solid var(--border); margin-top:24px; padding:32px 20px 40px !important; }
a:focus-visible, button:focus-visible, summary:focus-visible { outline:2px solid #fff; outline-offset:2px; }
* { scrollbar-width:thin; scrollbar-color:var(--border2) transparent; }
@media (max-width:860px) {
    #page-calc.active, #page-casino.active { grid-template-columns:1fr; }
    #page-calc > *, #page-casino > * { grid-column:1 !important; grid-row:auto !important; }
    #page-calc > .calc-card, #page-casino > .calc-card { order:-1; }
    #page-calc > .section-hd, #page-casino > .section-hd { order:-2; }
}
@media (max-width:700px) {
    .header { padding:12px 16px 17px; gap:10px; }
    .page-nav { width:100%; overflow-x:auto; }
    .page-nav .page-nav-btn { padding:9px 13px; font-size:15px; }
    .logo h1 { font-size:30px; }
}
@media (prefers-reduced-motion:reduce) { *, *::before, *::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; } }