:root {
  color-scheme: light;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: #ede9dc;
  color: #292d20;
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; min-height: 100vh; background: linear-gradient(180deg, #d9d2b9 0, #f5f2e8 38%); }
main { width: min(100%, 560px); margin: 0 auto; padding: max(24px, env(safe-area-inset-top)) 18px 28px; }
header { background: #5d633f; color: #fffef6; border-radius: 28px; padding: 26px 22px; box-shadow: 0 12px 30px #41452c33; }
.eyebrow { margin: 0 0 6px; text-transform: uppercase; letter-spacing: .12em; font-weight: 800; font-size: .76rem; color: #e8dfb9; }
h1 { margin: 0; font-size: clamp(2.3rem, 12vw, 4rem); letter-spacing: -.04em; }
.lead { margin: 8px 0 20px; font-size: 1.05rem; line-height: 1.45; }
.status { display: inline-flex; min-height: 36px; align-items: center; border-radius: 999px; padding: 7px 12px; background: #ffffff20; font-weight: 750; font-size: .9rem; }
.status.ok { background: #dff4d4; color: #254c22; }
.status.error { background: #ffe0d6; color: #762813; }
section { margin-top: 28px; }
h2 { font-size: 1.25rem; margin: 0 0 12px; }
.card, .panel { background: #fffefa; border-radius: 22px; padding: 20px; box-shadow: 0 7px 20px #554c3420; }
.panel { background: #fff7df; border: 2px solid #c7b36f; }
form { display: grid; gap: 10px; }
label { margin-top: 6px; font-weight: 800; }
input, select, textarea { width: 100%; min-height: 48px; border: 2px solid #a9a38d; border-radius: 14px; padding: 11px 12px; background: #fff; color: #292d20; font: inherit; }
textarea { resize: vertical; min-height: 120px; }
input:focus, select:focus, textarea:focus { border-color: #596638; outline: 3px solid #9cae7366; }
.primary { border: 0; border-radius: 15px; min-height: 50px; margin-top: 8px; padding: 10px 16px; background: #5d633f; color: white; font-size: 1rem; font-weight: 850; cursor: pointer; }
.message { min-height: 24px; margin: 0; color: #8a2e1a; font-weight: 700; }
.session-bar { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin: 18px 2px -8px; color: #55594b; font-weight: 750; }
.session-bar button, .close { min-height: 44px; border-radius: 12px; border: 0; padding: 0 14px; background: #e8dfc5; font-weight: 750; cursor: pointer; }
.actions { display: grid; gap: 12px; }
.actions button { border: 0; border-radius: 22px; min-height: 92px; padding: 16px 18px; background: #fffefa; color: inherit; box-shadow: 0 7px 20px #554c3420; display: grid; grid-template-columns: 50px 1fr; grid-template-rows: auto auto; text-align: left; cursor: pointer; }
.actions button:focus-visible, button:focus-visible { outline: 4px solid #c06f34; outline-offset: 3px; }
.actions button span { grid-row: 1 / 3; font-size: 2rem; align-self: center; }
.actions strong { font-size: 1.2rem; align-self: end; }
.actions small { font-size: .92rem; color: #5b5f50; align-self: start; margin-top: 4px; }
.close { float: right; }
.step { margin: 0 0 5px; color: #6b705a; font-size: .82rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.hint { color: #676a5c; font-size: .86rem; line-height: 1.4; }
.result { border-radius: 14px; padding: 12px; font-weight: 800; }
.result.success { background: #dff4d4; color: #254c22; }
.result.error { background: #ffe0d6; color: #762813; }
#timeline { margin-top: 14px; display: grid; gap: 10px; }
.tl-head { font-size: 1.05rem; }
.tl-culture { margin: 0; font-weight: 800; color: #4a5230; }
.tl-event { background: #fffefa; border-radius: 22px; box-shadow: 0 7px 20px #554c3420; }
.tl-event > summary { list-style: none; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; padding: 13px 40px 13px 14px; min-height: 56px; cursor: pointer; position: relative; }
.tl-event > summary::-webkit-details-marker { display: none; }
.tl-event > summary::after { content: ""; position: absolute; right: 16px; top: 50%; width: 9px; height: 9px; margin-top: -7px; border-right: 3px solid #5d633f; border-bottom: 3px solid #5d633f; transform: rotate(45deg); transition: transform .15s; }
.tl-event[open] > summary::after { transform: rotate(-135deg); margin-top: -2px; }
.tl-date { flex: 0 0 auto; font-size: .8rem; font-weight: 850; color: #fffef6; background: #5d633f; border-radius: 8px; padding: 3px 8px; }
.tl-event.todo .tl-date { background: #c06f34; }
.tl-event > summary strong { flex: 1 1 200px; font-size: 1rem; line-height: 1.3; }
.tl-tag { display: inline-block; padding: 3px 9px; border-radius: 999px; background: #e8dfc5; font-size: .78rem; font-weight: 800; }
.tl-tag.warn { background: #ffe0d6; color: #762813; }
.tl-details { display: grid; grid-template-columns: auto 1fr; gap: 6px 12px; margin: 0; padding: 0 14px 12px; font-size: .9rem; border-top: 1px solid #e8dfc5; padding-top: 12px; }
.tl-details dt { font-weight: 800; color: #55594b; }
.tl-details dd { margin: 0; overflow-wrap: anywhere; }
.tl-event > .hint { padding: 0 14px 12px; margin: 0; }
.tl-notes { margin: 0 14px 12px; font-size: .88rem; }
.tl-notes summary { cursor: pointer; font-weight: 800; min-height: 36px; display: flex; align-items: center; }
.combo { position: relative; }
#parcel-search { padding-left: 42px; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%235d633f' stroke-width='3' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-4-4'/%3E%3C/svg%3E") no-repeat 13px center; font-weight: 750; }
.combo ul { position: absolute; z-index: 10; left: 0; right: 0; top: calc(100% + 6px); margin: 0; padding: 6px; list-style: none; max-height: 280px; overflow-y: auto; background: #fffefa; border: 2px solid #c7b36f; border-radius: 16px; box-shadow: 0 12px 28px #41452c40; }
.combo li { display: flex; justify-content: space-between; align-items: center; gap: 10px; min-height: 48px; padding: 8px 12px; border-radius: 11px; font-weight: 750; cursor: pointer; }
.combo li small { color: #6b705a; font-weight: 700; white-space: nowrap; }
.combo li.active, .combo li:hover { background: #5d633f; color: #fffef6; }
.combo li.active small, .combo li:hover small { color: #e8dfb9; }
.combo li.empty { color: #686b5d; cursor: default; background: none; }
.combo-select input { cursor: pointer; caret-color: transparent; font-weight: 800; padding-right: 42px; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%235d633f' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 9l7 7 7-7'/%3E%3C/svg%3E") no-repeat right 14px center; }
.tl-head { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 12px; }
.tl-photo { width: 64px; height: 64px; object-fit: cover; border-radius: 14px; border: 2px solid #c7b36f; background: #fff; flex: 0 0 auto; }
footer { margin-top: 32px; color: #686b5d; text-align: center; font-size: .82rem; }
@media (min-width: 700px) { main { padding-top: 48px; } }

.todo-banner { width: 100%; text-align: left; border: 0; cursor: pointer; font: inherit; min-height: 48px; }
.edit-form { padding: 0 14px 14px; border-top: 1px solid #e8dfc5; padding-top: 12px; }
.edit-title { margin: 0; font-weight: 850; color: #762813; }
.check { display: flex; align-items: center; gap: 8px; min-height: 44px; }
.check input { width: 26px; min-height: 26px; }
.primary.big { min-height: 58px; font-size: 1.1rem; }
#mic-dock { position: fixed; right: max(14px, env(safe-area-inset-right)); bottom: max(14px, env(safe-area-inset-bottom)); z-index: 20; display: flex; flex-direction: column; align-items: flex-end; gap: 12px; max-width: calc(100vw - 28px); }
#mic { width: 72px; height: 72px; border-radius: 50%; border: 3px solid #2c3414; background: #9ee27a; display: grid; place-items: center; box-shadow: 0 8px 22px #41452c66; cursor: pointer; padding: 0; }
#mic img { width: 40px; height: 40px; display: block; }
#mic.listening { background: #ffb259; animation: pulse 1s infinite; }
@keyframes pulse { 50% { box-shadow: 0 0 0 14px #ffb25955; } }
#chat-card { width: min(380px, calc(100vw - 28px)); max-height: 70vh; overflow: auto; background: #fffefa; border: 2px solid #c7b36f; border-radius: 18px; padding: 14px; box-shadow: 0 12px 30px #41452c55; }
#chat-card button { width: 100%; margin-top: 8px; min-height: 52px; border-radius: 14px; font: inherit; font-weight: 800; cursor: pointer; }
#chat-card .choice { background: #fff; border: 2px solid #5d633f; color: #2c3414; text-align: left; padding: 8px 14px; }
#chat-card .secondary { background: #eef3d9; border: 2px solid #5d633f; color: #2c3414; }
#chat-card .link { background: none; border: 0; color: #762813; min-height: 44px; text-decoration: underline; }
.chat-line { margin: 4px 0; font-weight: 750; }
.chat-line.error { color: #762813; }
.chat-line.success { color: #254c22; font-size: 1.05rem; }
.chat-user { margin: 0 0 6px; font-style: italic; color: #5d633f; }
.chat-summary { margin: 6px 0; padding: 10px 12px; background: #f4efd8; border-radius: 12px; }
.chat-summary dt { font-size: .78rem; text-transform: uppercase; color: #5d633f; font-weight: 800; }
.chat-summary dd { margin: 0 0 6px; font-weight: 850; }
.chat-note { width: 100%; box-sizing: border-box; font: inherit; border-radius: 12px; border: 2px solid #c7b36f; padding: 8px; }
main { padding-bottom: 96px; }

#mic.thinking { background: #ffe9a8; position: relative; }
#mic.thinking::after { content: ""; position: absolute; inset: -9px; border-radius: 50%; border: 5px solid #2c341433; border-top-color: #2f7d32; animation: spin 0.9s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { #mic.thinking::after { animation-duration: 3s; } }
.danger, .danger.big { background: #b3261e; color: #fff; border: 0; border-radius: 14px; min-height: 58px; font-size: 1.1rem; font-weight: 800; width: 100%; margin: 6px 0; cursor: pointer; }
.danger-link { display: block; margin: 14px 0 4px; background: none; border: 0; color: #9a2d1f; text-decoration: underline; font-weight: 700; font-size: .95rem; cursor: pointer; padding: 8px 0; }
.tl-empty { margin: 0; padding: 0 14px 10px; font-size: .82rem; color: #7a7d6c; }
.tl-link { display: inline-block; margin: 0 14px 12px; font-size: .9rem; font-weight: 700; color: #3d5a1e; }

/* Préparer un contrôle */
#controle-progress { margin: 14px 0 4px; }
.ctl-count { margin: 0 0 6px; font-weight: 850; }
progress { width: 100%; height: 14px; accent-color: #5d633f; }
#controle-body { margin-top: 14px; display: grid; gap: 12px; }
.ctl-group { background: #fffefa; border-radius: 18px; box-shadow: 0 3px 10px #554c3418; }
.ctl-group > summary, .ctl-item > summary, .ctl-todo > summary { list-style: none; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; min-height: 52px; padding: 12px 14px; cursor: pointer; }
.ctl-group > summary::-webkit-details-marker, .ctl-item > summary::-webkit-details-marker, .ctl-todo > summary::-webkit-details-marker { display: none; }
.ctl-group > summary strong { flex: 1 1 160px; font-size: 1.1rem; }
.ctl-item { margin: 0 10px 12px; border-radius: 22px; background: #fffefa; box-shadow: 0 7px 20px #554c3420; }
.ctl-item > summary strong { flex: 1 1 180px; font-size: .98rem; line-height: 1.3; }
.ctl-mark { flex: 0 0 auto; width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; font-weight: 900; color: #fffef6; background: #5d633f; }
.ctl-item.todo .ctl-mark { background: #c06f34; }
.ctl-todo { margin: 0 10px 12px; border: 0; border-radius: 16px; background: #f6f2e4; }
.ctl-todo > summary { min-height: 48px; font-weight: 850; color: #762813; }
.ctl-question { margin: 0; padding: 0 14px 8px; font-weight: 750; }
.ctl-pad { padding: 0 14px 10px; margin: 0; }
.ctl-line { padding: 10px 14px 14px; border-top: 1px solid #e8dfc5; display: grid; gap: 8px; }
.ctl-line-title { margin: 0; font-weight: 850; font-size: .92rem; color: #4a5230; }
.field-row { display: flex; gap: 8px; align-items: stretch; }
.field-mic { flex: 0 0 52px; min-height: 48px; border: 2px solid #2c3414; border-radius: 14px; background: #9ee27a; font-size: 1.4rem; cursor: pointer; }
.field-mic.listening { background: #ffb259; animation: pulse 1s infinite; }
.ctl-choices { display: grid; gap: 8px; }
.ctl-choices .secondary { background: #eef3d9; border: 2px solid #5d633f; border-radius: 15px; min-height: 50px; font-weight: 850; font-size: 1rem; cursor: pointer; }

#carte-map { height: 56vh; min-height: 320px; border-radius: 16px; border: 2px solid #a9a38d; margin: 8px 0; z-index: 0; background: #d9d6c6; }
#carte-pick { margin: 6px 0 10px; }
#carte-pick .ctl-pad { padding: 0; }
.carte-card { background: #fffefa; box-shadow: 0 5px 16px #554c3418; border-radius: 18px; padding: 10px 14px; margin: 6px 0; }
.carte-card strong { display: block; }
.carte-parcel-btn { display: flex; flex-direction: column; align-items: flex-start; text-align: left; min-height: 54px; padding: 8px 14px; background: #fffefa; border: 2px solid #5d633f; border-radius: 15px; font: inherit; cursor: pointer; }
.carte-parcel-btn small { color: #676a5c; }
.leaflet-container { font: inherit; }

.pc-tag { display: inline-block; padding: 3px 9px; border-radius: 999px; font-size: .78rem; font-weight: 800; background: #e8dfc5; }
.pc-tag.expired, .pc-tag.missing { background: #ffd0c8; color: #6d1b0d; }
.pc-tag.soon, .pc-tag.todo { background: #ffe6b0; color: #5c3d00; }
.pc-tag.ok { background: #d8e8c0; color: #2f4417; }
.pc-meta { margin: 4px 0 8px; padding-left: 14px; color: #3d4030; }

.ctl-deduced > summary { color: #3d4527; }
.ctl-deduced .tl-tag { justify-self: start; }
.ctl-check { display: flex; gap: 10px; align-items: center; }
.ctl-check input { width: 26px; height: 26px; flex: 0 0 auto; }
.ctl-check label { margin: 0; font-weight: 700; }

.ctl-photo { display: grid; gap: 10px; margin-top: 8px; }
.ctl-photo-buttons { display: grid; gap: 10px; }
.ctl-photo button, .ctl-photo a.secondary { box-sizing: border-box; min-height: 50px; width: 100%; border-radius: 15px; background: #eef3d9; border: 2px solid #5d633f; color: #2c3414; font-weight: 850; font-size: 1rem; text-align: center; text-decoration: none; display: flex; align-items: center; justify-content: center; cursor: pointer; }
