:root{--bord:#5e1427;--bord3:#3c0b19;--creme:#f5edda;--papier:#efe4cb;--encre:#2a1d16;--encre2:#4a382c;--or:#b08d4a;--or2:#d3b573;--vert:#1f3a2d;--rouge:#8a1c1c}
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--creme);color:var(--encre);font:19px/1.55 "EB Garamond",Georgia,serif;min-height:100vh}
h1,h2,h3,h4{font-family:"Cormorant Garamond",Georgia,serif;color:var(--bord3);line-height:1.15;font-weight:600}
button,input,select,textarea{font:inherit}
.boot{padding:40px;text-align:center;color:var(--encre2)}
/* connexion */
.login{min-height:100vh;display:grid;place-items:center;padding:20px;background:linear-gradient(135deg,var(--bord3),var(--bord) 60%,var(--vert))}
.lcard{background:var(--creme);width:min(440px,100%);padding:38px 34px;border-radius:8px;box-shadow:0 30px 80px rgba(0,0,0,.5);border-top:5px solid var(--or)}
.lcard .logo{width:64px;height:64px;margin:0 auto 12px;display:block}
.lcard h1{font-size:34px;text-align:center}.lcard p.sub{text-align:center;color:var(--encre2);margin:6px 0 24px}
.field{display:grid;gap:6px;margin-bottom:18px}.field label{font:700 19px "Cormorant Garamond",serif;color:var(--bord3)}
.field small{color:var(--encre2);font-size:16px}
input,select,textarea{width:100%;padding:13px 14px;border:1px solid #8c7a62;background:#fffaf0;border-radius:4px;color:var(--encre)}
input:focus,select:focus,textarea:focus{outline:3px solid rgba(94,20,39,.35);border-color:var(--bord)}
.pw{display:flex;gap:8px}.pw input{flex:1}
.btn{font:700 19px "Cormorant Garamond",serif;letter-spacing:.03em;padding:14px 22px;border:1px solid var(--bord);background:#fffaf0;color:var(--bord);cursor:pointer;border-radius:4px;transition:.2s;text-decoration:none;display:inline-block;text-align:center}
.btn:hover{background:var(--bord);color:#fff}.btn.primary{background:var(--bord);color:#fff}.btn.primary:hover{background:var(--bord3)}
.btn.small{font-size:16px;padding:9px 14px}.btn.danger{border-color:var(--rouge);color:var(--rouge)}.btn.danger:hover{background:var(--rouge);color:#fff}
.btn:disabled{opacity:.5;cursor:wait}.btn.full{width:100%}
.err{background:#fbe4e4;color:var(--rouge);border:1px solid #e0b0b0;padding:12px 14px;border-radius:4px;margin-bottom:16px;font-weight:600}
.ok{background:#e1efe6;color:var(--vert);border:1px solid #aacdb7;padding:12px 14px;border-radius:4px;margin-bottom:16px;font-weight:600}
/* structure */
.top{background:var(--bord3);color:var(--creme);position:sticky;top:0;z-index:30;box-shadow:0 4px 18px rgba(0,0,0,.25)}
.top .in{max-width:1100px;margin:auto;padding:12px 22px;display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.top a.brand{display:flex;gap:12px;align-items:center;color:var(--creme);text-decoration:none;font:600 24px "Cormorant Garamond",serif}
.top .brand svg{width:38px;height:38px}
.top nav{display:flex;gap:10px;flex-wrap:wrap}
.top .btn{background:transparent;border-color:var(--or2);color:var(--creme);padding:9px 16px;font-size:17px}.top .btn:hover{background:var(--or2);color:var(--bord3)}
main{max-width:1100px;margin:auto;padding:30px 22px 130px}
.crumb{margin-bottom:18px}.crumb a{color:var(--bord);font-weight:600}
h1.page{font-size:42px;margin-bottom:6px}.lead{color:var(--encre2);margin-bottom:26px;max-width:760px}
h2.sec{font-size:30px;margin:38px 0 6px;padding-bottom:8px;border-bottom:1px solid var(--or)}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px;margin-top:16px}
.tile{display:grid;gap:4px;align-content:start;padding:20px 20px 18px;background:#fffaf0;border:1px solid #cdbb94;border-radius:8px;text-decoration:none;color:var(--encre);cursor:pointer;text-align:left;transition:.2s;font:inherit}
.tile:hover{border-color:var(--bord);box-shadow:0 12px 28px rgba(60,11,25,.15);transform:translateY(-2px)}
.tile .ic{font-size:30px}.tile b{font:700 24px "Cormorant Garamond",serif;color:var(--bord3)}.tile span{color:var(--encre2);font-size:17px;line-height:1.35}
.tile.big{background:var(--bord);border-color:var(--bord)}.tile.big b,.tile.big span{color:#fff}
.help{background:#fffaf0;border:1px solid #cdbb94;border-left:5px solid var(--or);border-radius:6px;padding:16px 20px;margin:18px 0}
.help summary{font:700 22px "Cormorant Garamond",serif;cursor:pointer;color:var(--bord3)}.help ol,.help ul{margin:10px 0 0 22px}.help li{margin:6px 0}
/* listes */
.bar{position:fixed;left:0;right:0;bottom:0;z-index:40;background:var(--bord3);color:#fff;padding:12px 22px;display:flex;gap:14px;align-items:center;justify-content:space-between;flex-wrap:wrap;box-shadow:0 -8px 28px rgba(0,0,0,.35)}
.bar .st{font-size:17px}.bar .st.on{color:#ffd88a;font-weight:700}
.bar .btn.primary{background:var(--or2);border-color:var(--or2);color:var(--bord3)}.bar .btn.primary:hover{background:#fff}
.bar .btn{background:transparent;border-color:var(--or2);color:#fff}.bar .btn:hover{background:var(--or2);color:var(--bord3)}
.tools{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-bottom:16px}.tools input{max-width:340px}
.items{display:grid;gap:10px;grid-template-columns:minmax(0,1fr)}.item{min-width:0}
.item{background:#fffaf0;border:1px solid #cdbb94;border-radius:6px}
.item[open]{border-color:var(--bord);box-shadow:0 8px 22px rgba(60,11,25,.12)}
.item>summary{list-style:none;display:flex;align-items:center;gap:12px;padding:12px 14px;cursor:pointer}
.item>summary::-webkit-details-marker{display:none}
.item .n{font:600 20px "Cormorant Garamond",serif;color:var(--or);min-width:34px}
.item .t{flex:1;min-width:0;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.item .t small{color:var(--encre2);margin-left:8px}
.item .acts{display:flex;gap:6px}
.mini{min-width:40px;height:38px;border:1px solid var(--bord);background:#fffaf0;color:var(--bord);border-radius:4px;cursor:pointer;font:700 17px Georgia,serif;padding:0 10px}.mini:hover{background:var(--bord);color:#fff}
.mini.danger{border-color:var(--rouge);color:var(--rouge)}.mini.danger:hover{background:var(--rouge);color:#fff}
.form{padding:6px 16px 16px;border-top:1px solid #e3d6b6;display:grid;gap:4px;padding-top:16px}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:14px}.row3{display:grid;grid-template-columns:1fr 1fr 2fr;gap:14px}
@media(max-width:700px){.row2,.row3{grid-template-columns:1fr}}
.mbar{display:flex;gap:6px;margin-bottom:6px}
.addbtn{margin-top:16px}
.empty{color:var(--encre2);font-style:italic;padding:20px}
/* médiathèque */
.drop{display:grid;gap:4px;justify-items:center;text-align:center;border:2px dashed var(--or);background:#fffaf0;padding:30px 16px;border-radius:8px;cursor:pointer;transition:.2s;position:relative}
.drop:hover,.drop.over{background:#fff;border-color:var(--bord)}.drop .big{font-size:42px}.drop b{font:700 24px "Cormorant Garamond",serif;color:var(--bord)}.drop small{color:var(--encre2)}
.drop input{position:absolute;inset:0;opacity:0;cursor:pointer}
.mgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px;margin-top:18px}
.mcard{background:#fffaf0;border:1px solid #cdbb94;border-radius:6px;overflow:hidden;display:grid}
.mcard .im{aspect-ratio:4/3;background:#e8dcc0;display:grid;place-items:center;overflow:hidden}.mcard img{width:100%;height:100%;object-fit:cover}.mcard video{width:100%;height:100%;object-fit:cover}
.mcard .meta{padding:10px 12px;font-size:15px;color:var(--encre2);word-break:break-word}.mcard .meta b{display:block;color:var(--encre);font-size:16px}
.mcard .btns{display:flex;gap:6px;padding:0 12px 12px}.mcard .btns button{flex:1}
.tabs{display:flex;gap:8px;margin:20px 0 0}.tabs button{padding:10px 18px;border:1px solid var(--bord);background:#fffaf0;color:var(--bord);font:700 18px "Cormorant Garamond",serif;cursor:pointer;border-radius:4px 4px 0 0}.tabs button.on{background:var(--bord);color:#fff}
.toast{position:fixed;left:50%;bottom:90px;transform:translateX(-50%);background:var(--vert);color:#fff;padding:14px 22px;border-radius:6px;z-index:90;box-shadow:0 10px 30px rgba(0,0,0,.4);max-width:92vw}
.toast.err{background:var(--rouge)}
.hist{display:grid;gap:10px}.hist .h{display:flex;gap:14px;align-items:center;justify-content:space-between;background:#fffaf0;border:1px solid #cdbb94;border-radius:6px;padding:12px 16px;flex-wrap:wrap}.hist .h small{color:var(--encre2);display:block}
.modal-b{position:fixed;inset:0;background:rgba(30,8,14,.7);display:grid;place-items:center;z-index:100;padding:16px}
.modal{background:var(--creme);width:min(480px,100%);padding:26px;border-radius:8px}.modal h3{font-size:28px;margin-bottom:10px}.modal .btns{display:flex;gap:10px;justify-content:flex-end;margin-top:18px}
