.public-mode{margin:20px 0;padding:0;border:0}.public-mode legend{font-weight:800;margin-bottom:12px}.public-mode-card{display:flex;gap:12px;padding:16px;border:1px solid var(--border);border-radius:12px;margin-bottom:10px;cursor:pointer;align-items:center}.public-mode-card:has(input:checked){border-color:var(--brand);background:var(--panel-2)}.public-mode-card strong,.public-mode-card small{display:block}.public-mode-card small{color:var(--text-dim);margin-top:6px}.public-mode-card input{width:18px;height:18px;flex-shrink:0}.public-mode-card:has(input:disabled){opacity:.55}.usage-context{padding:16px;margin-bottom:16px;border:1px solid var(--border);border-radius:12px;background:var(--panel-2)}.usage-context[hidden],.usage-item[hidden],.usage-group[hidden]{display:none}.usage-search{margin:20px 0}.usage-item{padding:16px 0;border-bottom:1px solid var(--border);display:grid;grid-template-columns:minmax(0,1fr) minmax(140px,.8fr);gap:18px;align-items:start}.usage-item:last-child{border-bottom:0}.usage-item p{margin:6px 0}.usage-item input[type=number]{min-height:48px}.usage-group,.usage-report{margin:18px 0}.usage-lots{display:grid;gap:12px}.usage-done{text-align:center;padding:35px 20px}.usage-done p{margin:18px 0}.usage-report .btn{margin:4px}.usage-report td{vertical-align:top}.usage-report h3{margin-bottom:6px}@media(max-width:520px){.usage-item{grid-template-columns:1fr;gap:10px}.public-mode-card{align-items:start}.usage-report .btn{width:100%}}


        .pub-wrap { max-width: 720px; margin: 0 auto; padding: 24px 16px 140px; }
        .pub-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }

        /* ---- Progression ---- */
        .progress-panel { position: sticky; top: 8px; z-index: 30; }
        .progress-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; flex-wrap: wrap; }
        .progress-track { height: 8px; border-radius: 999px; background: var(--panel-2); overflow: hidden; }
        .progress-fill { height: 100%; background: var(--brand); transition: width .25s ease; }

        /* ---- Sections repliables ---- */
        .section-toggle { width: 100%; background: transparent; border: 0; cursor: pointer; color: inherit; text-align: left; font: inherit; }
        .section-toggle .chev { transition: transform .2s ease; flex-shrink: 0; }
        .section-panel.is-collapsed .section-body { display: none; }
        .section-panel.is-collapsed .chev { transform: rotate(-90deg); }

        /* ---- Ligne d'article ---- */
        .inv-line { padding: 14px; border-bottom: 1px solid var(--border); border-left: 3px solid transparent; border-radius: 8px; margin-bottom: 2px; transition: background .15s ease, border-color .15s ease; }
        .inv-line:last-child { border-bottom: 0; margin-bottom: 0; }
        .inv-line.st-unverified { border-left-color: var(--orange); background: color-mix(in srgb, var(--orange) 7%, transparent); }
        .inv-line.st-conforme { border-left-color: var(--green); }
        .inv-line.st-anomalie { border-left-color: var(--red); background: color-mix(in srgb, var(--red) 7%, transparent); }
        .inv-line-main { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; flex-wrap: wrap; }
        .inv-line-info { flex: 1; min-width: 180px; }
        .status-seg { display: flex; gap: 8px; flex-shrink: 0; }
        .seg-btn { display: inline-flex; align-items: center; gap: 6px; padding: 8px 12px; border-radius: 10px; border: 1px solid var(--border); background: var(--panel-2); color: var(--text-dim); font-weight: 700; font-size: .82rem; cursor: pointer; transition: var(--tr); font-family: var(--font-body); }
        .seg-btn svg { width: 15px; height: 15px; }
        .seg-btn[aria-pressed="true"].seg-ok { background: var(--green-bg); border-color: var(--green); color: var(--green); }
        .seg-btn[aria-pressed="true"].seg-bad { background: var(--red-bg); border-color: var(--red); color: var(--red); }
        .anomaly { margin-top: 12px; padding: 12px; border-radius: 10px; background: var(--panel-2); }
        .anomaly[hidden] { display: none; }

        /* ---- Brouillon ---- */
        .draft-banner .panel-body { padding: 16px 20px; }

        /* ---- Barre fixe ---- */
        .sticky-bar { position: fixed; left: 0; right: 0; bottom: 0; background: var(--panel); border-top: 1px solid var(--border); box-shadow: 0 -8px 24px rgba(0,0,0,.18); z-index: 80; padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); }
        .sticky-bar-inner { max-width: 720px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
        .sticky-actions { display: flex; gap: 10px; flex-wrap: wrap; }
        @media (max-width: 480px) {
            .sticky-bar-inner { flex-direction: column; align-items: stretch; }
            .sticky-actions { width: 100%; }
            .sticky-actions .btn { flex: 1; }
        }