/* Ma Ludothèque — styles.
   Chargé après leaflet.css pour que les surcharges de carte s'appliquent. */

@import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,600;12..96,700;12..96,800&family=Inter:wght@400;500;600&family=Space+Mono:wght@400;700&display=swap');
:root{
  --bg:#17130f;--bg2:#1f1a15;--bg3:#2a231c;--line:#3a3129;
  --ink:#f2e9dd;--dim:#a99a86;--brass:#c99a4a;--brass-bright:#e6b968;
  --ps:#6d8cc4;--xb:#7fa06a;--nin:#b0607f;--retro:#c08a3e;--other:#8a8175;
}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Inter',system-ui,sans-serif;color:var(--ink);
  background:radial-gradient(1200px 500px at 80% -10%,#241d16 0,transparent 60%),var(--bg);min-height:100vh}
button{font-family:inherit;cursor:pointer}
.hidden{display:none!important}
.wrap{max-width:1160px;margin:0 auto;padding:0 20px 72px}

#login{min-height:100vh;display:grid;place-items:center;padding:20px}
.login-box{background:var(--bg2);border:1px solid var(--line);border-radius:18px;padding:40px 34px;width:360px;max-width:100%;text-align:center;box-shadow:0 24px 60px rgba(0,0,0,.5)}
.login-box .mark{width:54px;height:54px;border-radius:14px;margin:0 auto 18px;display:grid;place-items:center;background:linear-gradient(160deg,var(--brass-bright),var(--brass));color:#241a0c;font-size:26px}
.login-box h1{font-family:'Bricolage Grotesque';font-weight:800;font-size:22px;letter-spacing:-.02em}
.login-box p{color:var(--dim);font-size:13px;margin:6px 0 22px}
.login-box input{width:100%;background:var(--bg3);border:1px solid var(--line);border-radius:10px;padding:12px 14px;color:var(--ink);font-size:15px;outline:none;text-align:center}
.login-box input:focus{border-color:var(--brass)}
.login-box button{width:100%;margin-top:12px;background:linear-gradient(160deg,var(--brass-bright),var(--brass));color:#241a0c;border:0;border-radius:10px;padding:12px;font-weight:700;font-size:15px}
.login-err{color:#e08a7a;font-size:13px;margin-top:12px;min-height:16px}

.top{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:26px 0 16px;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:12px}
.brand .mk{width:40px;height:40px;border-radius:11px;display:grid;place-items:center;font-size:20px;background:linear-gradient(160deg,var(--brass-bright),var(--brass));color:#241a0c}
.brand h1{font-family:'Bricolage Grotesque';font-weight:800;font-size:21px;letter-spacing:-.02em;line-height:1}
.brand p{font-size:11.5px;color:var(--dim);margin-top:3px}
.ghostbtn{background:var(--bg2);border:1px solid var(--line);color:var(--dim);border-radius:9px;padding:8px 12px;font-size:12.5px}
.ghostbtn:hover{color:var(--ink)}

.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:14px;overflow:hidden;margin:16px 0 4px}
.stat{background:var(--bg2);padding:15px 16px}
.stat .n{font-family:'Space Mono';font-weight:700;font-size:24px;letter-spacing:-.03em}
.stat .n small{font-size:13px;color:var(--dim);font-weight:400}
.stat .l{font-size:11px;color:var(--dim);text-transform:uppercase;letter-spacing:.08em;margin-top:2px}

.sec-h{display:flex;align-items:baseline;gap:10px;margin:24px 0 10px}
.sec-h h2{font-family:'Bricolage Grotesque';font-weight:700;font-size:14px}
.sec-h span{font-size:11.5px;color:var(--dim)}
.shelf{background:linear-gradient(180deg,#120e0a,#1b1610);border:1px solid var(--line);border-radius:16px;padding:20px 0 0;overflow:hidden}
.shelf-scroll{overflow-x:auto;padding:0 18px}
.shelf-row{display:flex;gap:24px;align-items:flex-end;width:max-content;min-height:120px}
.sgroup{display:flex;flex-direction:column}
.spines{display:flex;gap:2px;align-items:flex-end}
.spine{width:14px;border-radius:2px 2px 0 0;box-shadow:inset -2px 0 3px rgba(0,0,0,.35),inset 1px 0 1px rgba(255,255,255,.12);transition:transform .16s;transform-origin:bottom}
.spine:hover{transform:translateY(-6px)}
.sgroup .tag{display:flex;align-items:center;gap:6px;font-size:10.5px;color:var(--dim);padding:8px 2px 0;border-top:3px solid var(--brass);margin-top:1px;white-space:nowrap}
.sgroup .tag b{color:var(--ink);font-family:'Space Mono'}
.shelf-board{height:9px;margin-top:9px;background:linear-gradient(180deg,var(--brass),#7c5a26);box-shadow:0 10px 24px -8px rgba(201,154,74,.4)}

.tabs{display:flex;gap:2px;margin:26px 0 16px;border-bottom:1px solid var(--line);overflow-x:auto}
.tab{background:none;border:0;color:var(--dim);font-size:14px;font-weight:600;padding:10px 14px;border-bottom:2px solid transparent;margin-bottom:-1px;font-family:'Bricolage Grotesque';white-space:nowrap}
.tab.on{color:var(--ink);border-color:var(--brass)}

.bar{display:flex;gap:9px;align-items:center;margin-bottom:16px;flex-wrap:wrap}
.srch{flex:1;min-width:160px;display:flex;align-items:center;gap:8px;background:var(--bg2);border:1px solid var(--line);border-radius:10px;padding:9px 12px}
.srch input{background:none;border:0;color:var(--ink);font-size:13.5px;width:100%;outline:none;font-family:inherit}
.sel,.chip{background:var(--bg2);border:1px solid var(--line);color:var(--dim);border-radius:10px;padding:9px 12px;font-size:13px;font-family:inherit}
.chip{border-radius:20px;padding:7px 13px}
.chip.on{background:var(--bg3);color:var(--ink);border-color:var(--brass)}
.sel{color:var(--ink)}
.addbtn{background:linear-gradient(160deg,var(--brass-bright),var(--brass));color:#241a0c;border:0;border-radius:10px;padding:9px 14px;font-weight:700;font-size:13px}

.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:15px}
.card{background:var(--bg2);border:1px solid var(--line);border-radius:13px;overflow:hidden;transition:transform .15s,border-color .15s;cursor:pointer;display:flex;flex-direction:column;height:100%}
.card:hover{transform:translateY(-3px);border-color:#5a4c3c}
.cover{aspect-ratio:3/4;position:relative;background:var(--bg3);display:flex;flex-direction:column;justify-content:flex-end;padding:11px}
.cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:var(--bg3)}
.cover .fallback{font-family:'Bricolage Grotesque';font-weight:700;font-size:15px;color:#fff;text-shadow:0 1px 8px rgba(0,0,0,.6);position:relative;z-index:1}
.cplat{position:absolute;top:8px;left:8px;z-index:2;font-family:'Space Mono';font-size:9.5px;font-weight:700;color:#12100c;padding:2px 6px;border-radius:5px}
.card-b{padding:10px 11px 12px;flex:1;display:flex;flex-direction:column}
.card-t{font-size:12.5px;font-weight:600;line-height:1.2}
.card-m{font-size:10.5px;color:var(--dim);margin:2px 0 0}
.card-y{font-family:'Space Mono';font-size:10px;color:var(--dim);opacity:.65;margin-top:2px}
.card-f{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-top:auto;padding-top:8px}
.badge{font-size:10px;padding:3px 7px;border-radius:20px;font-weight:600;white-space:nowrap}
.st-todo{background:#2c2a26;color:#b8ac99}.st-playing{background:#2a3140;color:#9db6dc}
.st-done{background:#2c3626;color:#a9cf8b}.st-collection{background:#332a3a;color:#c3a6d6}
.stars{display:inline-flex;gap:1px;color:var(--brass-bright);font-size:11px}
.empty{color:var(--dim);text-align:center;padding:44px 0;font-size:14px}

.lic-intro{font-size:12px;color:var(--dim);margin:0 0 14px}
.lic{background:var(--bg2);border:1px solid var(--line);border-radius:13px;padding:14px 16px;margin-bottom:11px}
.lic-h{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}
.lic-name{display:flex;align-items:center;gap:9px;font-family:'Bricolage Grotesque';font-weight:700;font-size:15px}
.lic-name .c{width:11px;height:20px;border-radius:3px}
.lic-p{font-family:'Space Mono';font-size:13px;color:var(--dim)}
.lic-p b{color:var(--brass-bright);font-size:15px}
.lic-p .done{color:#a9cf8b;font-family:'Inter';font-weight:600;font-size:12.5px}
.lic-bar{height:6px;background:var(--bg3);border-radius:20px;overflow:hidden;margin-bottom:13px}
.lic-bar i{display:block;height:100%;border-radius:20px}
.lspines{display:flex;gap:3px;flex-wrap:wrap;align-items:flex-end}
.lic-synth{display:flex;flex-wrap:wrap;gap:18px;align-items:center;background:var(--bg2);border:1px solid var(--line);border-radius:12px;padding:14px 18px;margin-bottom:14px}
.ls-item{display:flex;flex-direction:column;line-height:1.15}
.ls-item b{font-size:20px;color:var(--brass)}.ls-item b small{font-size:12px;color:var(--dim);font-weight:400}
.ls-item span{font-size:11px;color:var(--dim)}
.ls-bar{flex:1;min-width:120px;height:7px;background:var(--bg3);border-radius:4px;overflow:hidden}
.ls-bar i{display:block;height:100%;background:var(--brass)}
.lspine.clk{cursor:pointer}
.lspine{height:46px;width:16px;border-radius:2px 2px 0 0;position:relative;box-shadow:inset -2px 0 3px rgba(0,0,0,.3)}
.lspine.ghost{background:transparent!important;border:1px dashed #574a3b;box-shadow:none}
.lspine .ll{position:absolute;inset:0;writing-mode:vertical-rl;transform:rotate(180deg);font-size:7px;padding:5px 0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:rgba(255,255,255,.8);font-weight:600}
.lspine.ghost .ll{color:var(--dim)}
.lic-miss{font-size:11.5px;color:var(--dim);margin-top:11px;line-height:1.5}
.lic-miss b{color:#c9a86a;font-weight:600}

.budget{background:var(--bg2);border:1px solid var(--line);border-radius:13px;padding:15px 17px;margin-bottom:16px}
.budget .row{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:10px}
.budget b{font-family:'Bricolage Grotesque';font-size:15px}
.budget .m{font-family:'Space Mono';font-size:13px;color:var(--dim)}
.budget .m em{color:var(--brass-bright);font-style:normal}
.track{height:8px;background:var(--bg3);border-radius:20px;overflow:hidden}
.track i{display:block;height:100%;background:linear-gradient(90deg,var(--brass),var(--brass-bright));border-radius:20px}
.hunt{display:flex;align-items:center;gap:12px;background:var(--bg2);border:1px solid var(--line);border-radius:11px;padding:11px 14px;margin-bottom:8px}
.hunt.got{opacity:.55}
.prio{width:6px;height:32px;border-radius:4px;flex:none}
.hunt .main{flex:1;min-width:0}
.hunt .t{font-weight:600;font-size:13.5px}
.hunt .mm{font-size:11px;color:var(--dim);margin-top:1px}
.hunt .pr{font-family:'Space Mono';font-size:13px;color:var(--brass-bright);white-space:nowrap}
.hunt .act{display:flex;gap:6px}
.mini{background:var(--bg3);border:1px solid var(--line);color:var(--dim);border-radius:7px;padding:5px 9px;font-size:11.5px}
.mini:hover{color:var(--ink)}

.overlay{position:fixed;inset:0;background:rgba(0,0,0,.6);display:grid;place-items:center;padding:18px;z-index:10000}
.modal{background:var(--bg2);border:1px solid var(--line);border-radius:16px;padding:22px;width:min(440px,100%);max-width:100%;max-height:90vh;overflow:auto}
.modal h3{font-family:'Bricolage Grotesque';font-weight:700;font-size:17px;margin-bottom:16px}
.fld{margin-bottom:12px}
.fld label{display:block;font-size:11px;color:var(--dim);text-transform:uppercase;letter-spacing:.06em;margin-bottom:5px}
.fld input,.fld select,.fld textarea{width:100%;background:var(--bg3);border:1px solid var(--line);border-radius:9px;padding:9px 12px;color:var(--ink);font-size:14px;font-family:inherit;outline:none}
.fld input:focus,.fld select:focus,.fld textarea:focus{border-color:var(--brass)}
.frow{display:flex;gap:10px}.frow .fld{flex:1}
.msel{position:relative}
.msel-btn{width:100%;text-align:left;background:var(--bg3);border:1px solid var(--line);border-radius:9px;padding:9px 12px;color:var(--ink);font-size:14px;font-family:inherit;cursor:pointer}
.msel-btn.empty{color:var(--dim)}
.msel-btn::after{content:"▾";float:right;color:var(--dim)}
.msel-pop{display:none;position:absolute;z-index:20;top:calc(100% + 4px);left:0;right:0;max-height:230px;overflow:auto;background:var(--bg2);border:1px solid var(--line);border-radius:9px;padding:5px;box-shadow:0 10px 28px rgba(0,0,0,.5)}
.msel.open .msel-pop{display:block}
.msel-opt{display:flex;align-items:center;gap:9px;padding:7px 9px;border-radius:7px;cursor:pointer;font-size:13.5px}
.msel-opt:hover{background:var(--bg3)}
.msel-opt input{width:auto;margin:0}
.modal-act{display:flex;gap:9px;justify-content:space-between;margin-top:18px}
.modal-act .r{display:flex;gap:9px}
.btn-p{background:linear-gradient(160deg,var(--brass-bright),var(--brass));color:#241a0c;border:0;border-radius:9px;padding:10px 18px;font-weight:700}
.btn-s{background:var(--bg3);border:1px solid var(--line);color:var(--ink);border-radius:9px;padding:10px 16px}
.btn-d{background:rgba(224,138,122,.12);border:1px solid rgba(224,138,122,.25);color:#e08a7a;border-radius:9px;padding:10px 16px}
.starpick{display:flex;gap:4px;font-size:22px;color:var(--line)}
.starpick span{cursor:pointer}.starpick span.on{color:var(--brass-bright)}

@media(max-width:640px){.stats{grid-template-columns:repeat(2,1fr)}.top{flex-wrap:wrap}}
@media(max-width:520px){.overlay{padding:10px}.modal{padding:18px 16px}.frow{flex-direction:column;gap:0}}
@media(prefers-reduced-motion:reduce){.spine,.card{transition:none}}
.leaflet-pane,.leaflet-top,.leaflet-bottom{z-index:400 !important}

#collhead.hide{display:none}
.shop-region{margin-bottom:18px}
.shop-rh{font-size:15px;margin:0 0 8px;display:flex;align-items:center;gap:8px;color:var(--ink)}
.shop-count{font-size:11px;background:var(--bg3);border:1px solid var(--line);border-radius:20px;padding:1px 8px;color:var(--dim)}
.shop-card{background:var(--bg2);border:1px solid var(--line);border-radius:11px;padding:11px 13px;margin-bottom:8px;cursor:pointer;transition:border-color .15s}
.shop-card:hover{border-color:var(--brass)}
.shop-name{font-family:'Bricolage Grotesque',inherit;font-weight:700;font-size:14.5px}
.shop-rate{font-size:12px;color:#e6b968;font-weight:600}
.shop-meta{font-size:12px;color:var(--dim);margin-top:2px}
.shop-note{font-size:12px;color:var(--ink);opacity:.85;margin-top:4px}
.leaflet-popup-content{font-family:'Inter',sans-serif;font-size:13px}
.shop-dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:6px;vertical-align:middle;border:1px solid rgba(255,255,255,.5)}
.shop-dot.ret{background:#e6b968}
.shop-dot.occ{background:#4a86c8}
.shop-dot.v-refaire{background:#2f7d4f}
.shop-dot.v-occ{background:#e6b968}
.shop-dot.v-inutile{background:#a23c3c}
.shop-dot.v-none{background:#5a5a5a}
.vbadge{display:inline-block;font-size:10.5px;font-weight:700;border-radius:20px;padding:1px 8px;margin-left:6px;vertical-align:middle}
.vbadge.v-refaire{background:#234b34;color:#8fe0ab;border:1px solid #2f7d4f}
.vbadge.v-occ{background:#4a3f22;color:#e6c682;border:1px solid #a5852f}
.vbadge.v-inutile{background:#4b2626;color:#e79b9b;border:1px solid #a23c3c}
.bcb{position:absolute;top:8px;right:8px;z-index:2;font-size:10px;font-weight:700;padding:2px 6px;border-radius:20px;border:1px solid rgba(0,0,0,.3)}
.bcb.y{background:#2f7d4f;color:#fff}
.bcb.n{background:#8a3a3a;color:#fff}
.bcb.q{background:#6a6a6a;color:#fff}
.bcb.b2{top:32px}
.ced{display:inline-block;font-size:10.5px;font-weight:600;color:var(--brass);border:1px solid var(--brass);border-radius:20px;padding:1px 7px;margin-left:6px;vertical-align:middle}
.cmed{display:inline-block;font-size:9.5px;font-weight:700;border-radius:20px;padding:1px 6px;margin-left:6px;vertical-align:middle;border:1px solid}
.cmed.ok{color:#8fe0ab;border-color:#2f7d4f;background:#1d3527}
.cmed.dl{color:#e6c682;border-color:#a5852f;background:#3a3018}
.cmed.code{color:#e79b9b;border-color:#a23c3c;background:#3d2020}
.hunt{position:fixed;inset:0;z-index:20000;background:#0f0e0c;display:flex;flex-direction:column}
.hunt-top{display:flex;gap:10px;align-items:center;padding:14px 14px 10px}
.hunt-top input{flex:1;font-size:18px;padding:14px 14px;border-radius:12px;background:var(--bg2);border:1px solid var(--line);color:var(--fg)}
.hunt-x{background:none;border:none;color:var(--dim);font-size:30px;line-height:1;padding:4px 8px;cursor:pointer}
.hunt-scan{background:var(--brass);color:#1a1710;border:none;border-radius:12px;font-size:22px;padding:12px 16px;cursor:pointer}
.hunt-body{flex:1;overflow:auto;padding:0 14px 20px}
.hunt-verdict{border-radius:16px;padding:22px 18px;text-align:center;margin-bottom:14px}
.hunt-verdict h2{font-size:26px;margin:0 0 6px;letter-spacing:.5px}
.hunt-verdict p{margin:0;font-size:14px;opacity:.85}
.hv-yes{background:#1d3527;border:2px solid #2f7d4f;color:#8fe0ab}
.hv-wish{background:#3a3018;border:2px solid #a5852f;color:#e6c682}
.hv-no{background:#3d2020;border:2px solid #a23c3c;color:#e79b9b}
.hunt-item{background:var(--bg2);border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin-bottom:8px}
.hunt-item b{font-size:15px}
.hunt-item div{font-size:12.5px;color:var(--dim);margin-top:3px}
.hunt-hint{color:var(--dim);font-size:13px;text-align:center;margin-top:40px;line-height:1.7}
.cval{margin-left:auto;font-family:'Space Mono';font-size:11px;color:var(--dim);opacity:.75;white-space:nowrap}


/* Bandeau hors ligne */
#offbar{position:fixed;left:0;right:0;bottom:0;z-index:30000;display:none;
  background:#4a3f22;color:#e6c682;border-top:1px solid #a5852f;
  font-size:12.5px;text-align:center;padding:8px 12px}
#offbar.on{display:block}