:root{--bg:#0f0d15;--bg2:#17141f;--bg3:#1f1b29;--line:#2b2638;--ink:#eeeaf5;--mut:#948ca6;--pink:#ff66ab;--ok:#6ee7a8;--ko:#ff7a7a;--warn:#ffcf6e;
  --btn:linear-gradient(135deg,#332a3e 0%,#231e2d 100%);--btn-main:linear-gradient(120deg,#d4458a 0%,#8a3262 42%,#2c2433 100%)}
*{box-sizing:border-box}
html{color-scheme:dark}
body{margin:0;background:var(--bg);color:var(--ink);font:14px/1.45 "Segoe UI",system-ui,-apple-system,sans-serif}
a{color:var(--pink)}
[hidden]{display:none!important}
.grow{flex:1}
.mut{color:var(--mut)}.small{font-size:12.5px}.ok{color:var(--ok)}.ko{color:var(--ko)}

/* En-tête */
.top{display:flex;gap:14px;align-items:center;padding:10px 20px;border-bottom:1px solid var(--line);background:var(--bg2);position:sticky;top:0;z-index:20}
.logo{font-weight:800;font-size:20px;letter-spacing:-.03em;color:var(--ink);text-decoration:none}.logo b{color:var(--pink)}
.tabs{display:flex;gap:2px;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:3px}
.tabs a{padding:6px 14px;border-radius:7px;color:var(--mut);font-weight:600;text-decoration:none}
.tabs a:hover{color:var(--ink)}.tabs a.on{background:var(--bg3);color:var(--ink);box-shadow:inset 0 -2px 0 var(--pink)}
#notice{max-width:1500px;margin:10px auto 0;padding:0 20px;font-weight:600;color:var(--pink)}#notice:empty{display:none}
footer{max-width:1500px;margin:0 auto;padding:4px 20px 26px;color:var(--mut);font-size:12px}

/* Contrôles */
button,input,select{font:inherit;color:var(--ink)}
.btn{font-weight:700;border:1px solid #3a3148;border-radius:8px;padding:8px 14px;background:var(--btn);cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:6px;justify-content:center;white-space:nowrap;transition:filter .12s,border-color .12s}
.btn:hover{filter:brightness(1.18);border-color:#4a3f5c}.btn:active{filter:brightness(.95)}
.btn.main{background:var(--btn-main);border-color:#6b2e4f;color:#fff}.btn.main:hover{border-color:#a4426f}
.btn.sm{padding:5px 10px;font-size:12.5px}.btn.ghost{background:none;border-color:transparent;color:var(--mut)}.btn.ghost:hover{color:var(--ink)}
.btn:disabled{opacity:.45;cursor:default;filter:none}
.chip{padding:4px 11px;border-radius:99px;background:var(--bg2);border:1px solid var(--line);color:var(--mut);font-size:12.5px;font-weight:600;cursor:pointer;white-space:nowrap}
.chip:hover{color:var(--ink)}.chip.on{color:var(--ink);border-color:#ff66ab88;background:#ff66ab1a}
input[type=text],input[type=url],input[type=search],input[type=number],input[type=date],select{background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:6px 9px;min-width:0}
input:focus,select:focus{outline:none;border-color:#ff66ab99}
input[type=number]{width:4.6em}input[type=number]::-webkit-inner-spin-button{display:none}
.field{display:inline-flex;align-items:center;gap:6px;color:var(--mut);font-size:12.5px;font-weight:600}
.field .dash{margin:0 -2px}
.search{flex:1;min-width:180px}
input[type=checkbox]{appearance:none;width:17px;height:17px;margin:0;border-radius:5px;border:2px solid #4a4260;background:none;cursor:pointer;display:inline-grid;place-content:center;flex:none}
input[type=checkbox]:checked{background:var(--pink);border-color:var(--pink)}
input[type=checkbox]:checked::after{content:"";width:8px;height:4px;border:2px solid #1a0d14;border-top:0;border-right:0;transform:rotate(-45deg) translate(1px,-1px)}
label.check{display:inline-flex;align-items:center;gap:7px;cursor:pointer}

/* Mise en page */
.layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:18px;padding:14px 20px;max-width:1500px;margin:auto}
.toolbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:10px}
.info{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:4px 0 10px;color:var(--mut);font-size:12.5px}
.panel{background:var(--bg2);border:1px solid var(--line);border-radius:12px;padding:14px;margin-bottom:12px}
.pager{display:flex;gap:8px;align-items:center;justify-content:center;margin:12px 0}
.empty{padding:40px 20px;text-align:center;color:var(--mut)}

/* Liste de maps */
.list{border:1px solid var(--line);border-radius:12px;overflow:clip}
.row{display:grid;grid-template-columns:22px 60px minmax(0,1fr) 70px 50px 48px 38px 38px 38px 64px 70px;gap:10px;align-items:center;padding:7px 12px;border-bottom:1px solid var(--line);background:var(--bg2)}
.row:last-child{border-bottom:0}
.row.item{cursor:pointer}.row.item:hover{background:#1d1928}.row.item.sel{background:#22172a}
.row.head{background:var(--bg);color:var(--mut);font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;font-weight:700;position:sticky;top:61px;z-index:5}
.row.head button{all:unset;cursor:pointer}.row.head button:hover{color:var(--ink)}.row.head button.on{color:var(--ink)}
.row.head button.on::after{content:" ▾";color:var(--pink)}.row.head button.on.asc::after{content:" ▴"}
.n{text-align:right;font-variant-numeric:tabular-nums}
.cover{width:60px;height:34px;border-radius:6px;object-fit:cover;background:var(--bg3) linear-gradient(135deg,#ff66ab22,#40d6ff14);display:block}
.t{font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.t a{color:var(--ink);text-decoration:none}.t a:hover{color:var(--pink)}
.a{color:var(--mut);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.a i{font-style:normal;color:#c9bfe0}
.sr{display:inline-block;font-weight:800;font-size:11.5px;padding:1px 7px;border-radius:99px;color:#111;min-width:46px;text-align:center;font-variant-numeric:tabular-nums}
.tag{display:inline-block;vertical-align:1px;margin-left:6px;text-transform:uppercase;font-size:9.5px;font-weight:800;letter-spacing:.06em;padding:2px 5px;border-radius:4px;background:#ffffff12;color:var(--mut)}
.tag.ranked,.tag.approved,.tag.qualified{color:#8fd4ff;background:#40a0ff22}.tag.loved{color:#ff8fc4;background:#ff66ab22}.tag.pending{color:var(--warn);background:#ffb02022}
.tag.have{color:var(--ok);background:#6ee7a81a}
.slot{display:inline-block;margin-right:6px;font-weight:800;font-size:11px;padding:1px 6px;border-radius:5px;background:#ff66ab22;color:var(--pink);vertical-align:1px}
.slot.HD{background:#ffcf6e22;color:var(--warn)}.slot.HR{background:#ff7a7a22;color:var(--ko)}.slot.DT{background:#b58cff22;color:#c9a8ff}.slot.FM{background:#6ee7a81a;color:var(--ok)}.slot.TB{background:#ffffff18;color:var(--ink)}
.dots{display:flex;gap:3px;margin-top:3px;align-items:center}.dot{width:12px;height:5px;border-radius:3px}
.expand{background:#141119;border-bottom:1px solid var(--line);padding:6px 12px 10px 104px}
.expand table{width:100%;border-collapse:collapse;font-size:12.5px}.expand td,.expand th{padding:4px 8px;text-align:right;font-variant-numeric:tabular-nums}
.expand th{color:var(--mut);font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;font-weight:700}.expand td:first-child,.expand th:first-child{text-align:left}
.expand tr:hover td{background:#1d1928}

/* Panier */
.cart{position:sticky;top:75px;align-self:start;background:var(--bg2);border:1px solid var(--line);border-radius:14px;display:flex;flex-direction:column;max-height:calc(100vh - 90px)}
.cart-head{padding:14px 16px 10px;border-bottom:1px solid var(--line)}.cart-head h2{margin:0;font-size:16px}
.bar{height:6px;border-radius:99px;background:#ffffff12;overflow:hidden;margin:10px 0 6px}.bar i{display:block;height:100%;background:linear-gradient(90deg,#8a3262,var(--pink));transition:width .3s}
.cart-status{display:flex;justify-content:space-between;gap:8px;font-size:12px}
.items{overflow:auto;padding:4px 8px;flex:1;min-height:60px}
.ci{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:10px;align-items:center;padding:6px 8px;border-radius:8px}.ci:hover{background:var(--bg3)}
.ci .cover{width:40px;height:40px;border-radius:7px}.ci .t{font-size:13px}
.mini{height:3px;border-radius:2px;background:#ffffff12;overflow:hidden;margin-top:4px}.mini i{display:block;height:100%;background:var(--pink)}
.st{font-size:11.5px;font-weight:700;white-space:nowrap}
.x{all:unset;cursor:pointer;color:var(--mut);padding:2px 6px;border-radius:5px}.x:hover{color:var(--ink);background:#ffffff12}
.cart-foot{padding:12px 16px 16px;border-top:1px solid var(--line);display:grid;gap:8px}
.cart-foot input[type=text]{width:100%}
.opts{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:12px;color:var(--mut)}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.cart .empty{padding:24px 10px;font-size:13px}

@media (max-width:1100px){.row{grid-template-columns:22px 60px minmax(0,1fr) 70px 50px 48px 38px 64px}.row>.c-cs,.row>.c-od,.row>.c-x{display:none}}
@media (max-width:900px){
  .layout{grid-template-columns:1fr}.cart{position:static;max-height:none}.search{flex-basis:100%}
  .top{flex-wrap:wrap;position:static}.row.head{top:0}
  .row{grid-template-columns:22px 54px minmax(0,1fr) 64px}.row>:nth-child(n+5){display:none}.expand{padding-left:12px}
}
