/* Déposez votre propre fichier PermanentMarker-Regular.ttf dans assets/ pour activer la police exacte. */
@font-face{font-family:PermanentMarker;src:url('assets/PermanentMarker-Regular.ttf') format('truetype');font-display:swap}
:root{--pink:#e81978;--rasp:#c83c75;--gold:#ffd452;--bg:#0b0711;--edge:#f01881;--white:#f9f1f6;--marker:PermanentMarker,'Trebuchet MS',cursive}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 50% 0,#39112b 0,transparent 40%),var(--bg);color:var(--white);font:16px/1.45 'Trebuchet MS',Arial,sans-serif}.hero{max-width:1100px;margin:auto;position:relative;background:#1c0a23}.hero img{width:100%;display:block}.hero-bottom{display:flex;justify-content:space-between;gap:8px;align-items:center;padding:8px 18px;background:linear-gradient(90deg,#140a17,#320b25,#140a17);color:var(--gold);font:clamp(16px,3vw,26px) var(--marker);border-bottom:2px solid var(--edge)}.hero-bottom span{font-size:.58em;color:#ff91b9}.shell{max-width:1100px;margin:auto;padding:16px clamp(10px,2.5vw,26px) 40px}.intro{display:flex;justify-content:space-between;gap:12px;align-items:center;color:var(--gold);font:clamp(13px,2.5vw,20px) var(--marker);padding:7px 5px 14px}.intro strong{color:#ff72a9;font-size:.85em}.category{background:linear-gradient(135deg,rgba(24,13,29,.98),rgba(4,4,10,.99));border:1.5px solid var(--edge);border-radius:14px;padding:12px;margin:0 0 13px;box-shadow:0 0 14px #d3116725,inset 0 0 20px #ef11720a}.section-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:9px}.section-heading{display:flex;gap:10px;align-items:center;min-width:0}.section-icon{font-size:clamp(25px,4vw,40px);filter:drop-shadow(0 2px 3px #000)}h2{font:clamp(22px,3.3vw,38px)/1.06 var(--marker);color:var(--pink);margin:0;overflow-wrap:anywhere}small{font:clamp(11px,1.7vw,16px) var(--marker);color:var(--gold)}.progress-side{min-width:110px;width:26%;max-width:240px}.counter{color:var(--gold);font-size:13px}.progress{height:9px;border:1px solid #6e556a;border-radius:20px;overflow:hidden;margin-top:5px;background:#170e1b}.fill{height:100%;background:linear-gradient(90deg,#fa1480,#b72c74);border-radius:20px;transition:width .2s}.toggle-section{border:0;background:none;color:var(--gold);font-size:22px;cursor:pointer;padding:8px;min-width:42px;min-height:42px}.section-content{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:13px}.foods{min-width:0}.food-row{display:flex;align-items:center;gap:7px;min-height:46px;border-bottom:1px solid #453444;background:linear-gradient(90deg,#241529,#100d17);border-radius:5px;padding:4px 7px;margin:2px 0}.food-row.selected{box-shadow:inset 0 0 0 1px #a61b61;background:#301326}.check{appearance:none;flex:none;width:25px;height:25px;border:2px solid #d9d1d9;border-radius:5px;background:#07050a;cursor:pointer;margin:0}.check:checked{background:#ec1878;border-color:#ec1878}.check:checked:after{content:'✔';display:block;text-align:center;color:white;line-height:21px;font-size:17px}.food-name{min-width:0;flex:1;display:flex;align-items:center;text-align:left;gap:8px;border:0;background:none;color:#f9f5f7;font:clamp(13px,1.7vw,17px) 'Trebuchet MS',sans-serif;cursor:pointer;padding:7px 1px}.food-name span{overflow-wrap:anywhere}.food-name em{font-size:23px;font-style:normal;flex:none}.food-row:has(.check:checked) .food-name span{color:#b6a6b2;text-decoration:line-through}.arrow{color:var(--gold);font-size:25px;margin-left:auto}.nutrition{border:1px solid #e01879;border-radius:11px;background:radial-gradient(ellipse at top,#3b112c,#110b17 75%);padding:14px;align-self:start;min-height:170px;box-shadow:inset 0 0 22px #c8136626}.nutrition h3{font:clamp(18px,2.6vw,27px) var(--marker);margin:0;color:#fff}.nutrition .basis{font:clamp(12px,1.5vw,15px) var(--marker);color:var(--gold);margin:5px 0 13px}.macro-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.macro{border:1px solid #a62162;border-radius:7px;padding:9px 3px;text-align:center;min-width:0}.macro strong{display:block;color:var(--gold);font:clamp(16px,2.3vw,25px) var(--marker);white-space:nowrap}.macro span{font-size:clamp(10px,1.35vw,14px)}.note{color:#bdb1b9;font-size:12px;margin:11px 0 0}.empty-nutrition{color:#b9a9b4;font-size:14px}.add-form{display:flex;gap:8px;margin:10px 0}.add-form input,.dialog-actions button,dialog input{background:#100b17;border:1px solid #a52061;border-radius:6px;color:white;padding:12px;font:inherit}.add-form input{min-width:0;flex:1}.add-form button,.action,.dialog-actions button:last-child{background:#db196f;color:white;border:1px solid #ee2983;border-radius:7px;padding:10px 13px;font:14px var(--marker);cursor:pointer}.personal-row{display:flex;align-items:center;gap:8px;border-bottom:1px solid #493047;padding:6px 2px}.personal-row .food-name{font-size:15px}.small-btn{background:none;color:var(--gold);border:0;font-size:20px;cursor:pointer;min-width:40px;min-height:40px}.small-btn.delete{color:#ff4978}.actions{display:flex;justify-content:space-between;gap:12px;margin-top:18px}.action{min-height:52px}.action.clear{background:#170b18;color:#ff5d9d}.action.new{background:#1b1210;color:var(--gold);border-color:#ffce42;box-shadow:0 0 10px #ffb82a44}.save-note,.disclaimer{color:#bfb0bd;text-align:center;font-size:12px}.disclaimer{margin-top:14px}footer{text-align:center;color:var(--gold);font:13px var(--marker);padding-top:20px}dialog{width:min(94vw,500px);background:#160c1b;color:white;border:1px solid var(--edge);border-radius:14px;box-shadow:0 0 0 100vmax #000b}dialog::backdrop{background:#0009}dialog form{display:grid;gap:12px;padding:8px}dialog label{display:grid;gap:5px;font-size:13px;color:var(--gold)}dialog input{width:100%;color:white}.edit-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.dialog-hint{font-size:12px;color:#c4b4c1}.dialog-actions{display:flex;justify-content:flex-end;gap:9px}.dialog-actions button{cursor:pointer}button:focus-visible,input:focus-visible{outline:2px solid var(--gold);outline-offset:2px}@media(max-width:700px){.section-content{grid-template-columns:1fr}.nutrition{margin-top:4px}.section-top{flex-wrap:wrap}.progress-side{margin-left:auto;width:130px}.section-heading{flex:1}.hero-bottom span{display:none}.actions{flex-direction:column}.macro strong{font-size:clamp(16px,4vw,22px)}.macro span{font-size:11px}.nutrition{padding:10px}.section-icon{font-size:27px}.section-heading h2{font-size:clamp(20px,5vw,28px)}}

html{scroll-behavior:smooth}.cover{max-width:1100px;margin:0 auto;position:relative;background:#0b0711}.cover>img{display:block;width:100%;height:auto}.cover-next{display:block;text-align:center;padding:16px 12px;color:#ffd452;background:#16091c;text-decoration:none;font:clamp(15px,3vw,24px) PermanentMarker,'Trebuchet MS',sans-serif;border-bottom:2px solid #c83c75}.cover-next:focus-visible{outline:3px solid #ffd452;outline-offset:-3px}
/* Mobile: titres lisibles, compteur sous le titre, aucun mot coupé */
@media(max-width:700px){
 .section-top{display:grid;grid-template-columns:minmax(0,1fr) 42px;gap:6px 8px;align-items:start}
 .section-heading{grid-column:1;grid-row:1;min-width:0;align-items:center;gap:10px}
 .section-heading>div{min-width:0;flex:1}
 .section-heading h2{font-size:clamp(19px,5vw,27px);line-height:1.13;overflow-wrap:normal;word-break:normal;hyphens:none}
 .section-heading small{display:block;font-size:clamp(11px,3vw,15px);line-height:1.3;margin-top:5px;overflow-wrap:normal;word-break:normal}
 .section-icon{flex:none;font-size:27px}
 .progress-side{grid-column:1;grid-row:2;margin:0 0 5px 37px;width:auto;max-width:none;min-width:0}
 .toggle-section{grid-column:2;grid-row:1 / span 2;align-self:center;justify-self:center}
 .counter{font-size:13px}
}

/* Functional changes only: original palette, images and typography retained. */
.section-content{display:block}.foods>.nutrition,.personal-list>.nutrition{margin:4px 0 10px}.section-controls{display:flex;align-items:center}.section-controls .toggle-section{display:block}#hiddenList{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}summary{cursor:pointer;color:var(--gold)}#reader{margin:12px 0;width:100%;overflow:hidden}#reader video{width:100%}#scanDialog a{color:var(--gold)}
@media(max-width:700px){.section-top{grid-template-columns:minmax(0,1fr) 80px}.section-controls{grid-column:2;grid-row:1 / span 2;align-self:center}.section-controls .toggle-section{min-width:40px;padding:4px}.section-controls .small-btn{min-width:36px}.food-row{gap:5px}.food-row>.small-btn{min-width:32px}.macro-grid{gap:4px}.macro strong{font-size:clamp(14px,4vw,22px)}}