/* Unchained — Lootlog (nutzt die Tokens aus unchained-common.css) */
html{background:var(--bg);}
body{
  margin:0;
  min-height:100vh;
  background:
    radial-gradient(ellipse 900px 500px at 15% -10%, rgba(201,154,74,.08), transparent 60%),
    radial-gradient(ellipse 700px 500px at 100% 0%, rgba(91,141,189,.07), transparent 55%),
    var(--bg);
  background-repeat:no-repeat;
  background-attachment:fixed;
  color:var(--text);
  font-family:'Inter',sans-serif;
  padding:0 0 80px;
  line-height:1.45;
}
[hidden]{display:none !important;}
a{color:var(--gold-soft);}
.hero-sub{color:var(--muted);font-size:14px;max-width:620px;margin:0;}
.nav-bar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
.user-chip{display:inline-flex;align-items:center;gap:8px;color:var(--muted);font-size:13px;}
.user-chip img{width:26px;height:26px;border-radius:50%;}
.user-chip b{color:var(--text);}

.btn{
  appearance:none;border:1px solid var(--border);background:var(--panel2);color:var(--text);
  padding:9px 15px;border-radius:7px;font-size:13.5px;font-weight:600;cursor:pointer;
  font-family:'Inter',sans-serif;transition:border-color .15s, background .15s, transform .05s;
  text-decoration:none;display:inline-flex;align-items:center;gap:6px;line-height:1.2;
}
.btn:hover{border-color:var(--gold);}
.btn:active{transform:translateY(1px);}
.btn:disabled{opacity:.55;cursor:default;}
.btn-primary{background:linear-gradient(180deg, var(--gold-soft), var(--gold));color:#1a1206;border:none;}
.btn-primary:hover{filter:brightness(1.06);}
.btn-ghost{background:transparent;}
.btn-sm{padding:5px 10px;font-size:12px;}
.btn-danger{border-color:rgba(224,100,90,.45);color:#ffb3ac;}
.btn-danger:hover{border-color:var(--danger);}
.btn-discord{background:#5865f2;border-color:#5865f2;color:#fff;}
.btn-discord:hover{background:#4752c4;border-color:#4752c4;}
.btn-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px;align-items:center;}
.hint{color:var(--muted);font-size:12.5px;}
.hint code,code{color:var(--gold-soft);font-family:'JetBrains Mono',monospace;font-size:.92em;}

input[type=text],input[type=password],input[type=search],input[type=number],input[type=datetime-local],input[type=date],select,textarea{
  background:var(--bg-alt);border:1px solid var(--border);color:var(--text);border-radius:7px;
  padding:8px 10px;font-size:13.5px;font-family:'Inter',sans-serif;width:100%;min-width:0;
}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--gold);}
textarea{resize:vertical;min-height:60px;}
select{cursor:pointer;}
input[type=datetime-local]{color-scheme:dark;}
label.f{display:block;font-size:11.5px;color:var(--muted);margin:0 0 5px;}
.field{margin-bottom:12px;min-width:0;}
.check{display:flex;align-items:center;gap:8px;font-size:13.5px;margin:8px 0;cursor:pointer;}

.card{background:var(--panel);border:1px solid var(--border-soft);border-radius:10px;margin-bottom:20px;}
.card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px;border-bottom:1px solid var(--border-soft);
  background:linear-gradient(180deg, rgba(255,255,255,.02), transparent);border-radius:10px 10px 0 0;flex-wrap:wrap;}
.card-head h2{font-family:'Cinzel',serif;font-size:16px;font-weight:600;margin:0;color:var(--gold-soft);letter-spacing:.3px;}
.card-body{padding:18px;}

.tabs{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 18px;border-bottom:1px solid var(--border);}
.tab{appearance:none;background:transparent;border:1px solid transparent;border-bottom:none;color:var(--muted);
  padding:9px 16px;border-radius:8px 8px 0 0;font:600 13.5px 'Inter',sans-serif;cursor:pointer;margin-bottom:-1px;}
.tab:hover{color:var(--text);}
.tab.active{background:var(--panel);border-color:var(--border);color:var(--gold-soft);}

/* Login */
.auth-box{max-width:440px;margin:30px auto;}
.auth-box .tabs{margin-bottom:14px;}
.auth-sep{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:12px;margin:16px 0;}
.auth-sep::before,.auth-sep::after{content:'';flex:1;height:1px;background:var(--border-soft);}
.msg{padding:10px 12px;border-radius:7px;font-size:13px;margin-bottom:12px;}
.msg.err{background:rgba(224,100,90,.12);border:1px solid rgba(224,100,90,.4);color:#ffb3ac;}
.msg.info{background:rgba(111,174,124,.12);border:1px solid rgba(111,174,124,.4);color:#b6e0be;}

/* Run-Formular */
.grid{display:grid;gap:12px;}
.grid.run-head{grid-template-columns:2fr 1fr 1.3fr;}
.drop-list{display:flex;flex-direction:column;gap:10px;margin:6px 0 4px;}
.drop-row{display:grid;grid-template-columns:44px minmax(150px,1.1fr) minmax(220px,2fr) 70px 120px 40px;gap:8px;align-items:start;
  background:var(--bg-alt);border:1px solid var(--border-soft);border-radius:9px;padding:10px;}
.drop-row .extra{grid-column:2 / -1;display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center;}
.drop-icon{width:44px;height:44px;border-radius:8px;background:var(--panel2);border:1px solid var(--border);display:grid;place-items:center;overflow:hidden;}
.drop-icon img{width:36px;height:36px;image-rendering:auto;}
.shot-btn{position:relative;}
.shot-btn input{display:none;}
.shot-thumb{height:34px;border-radius:5px;border:1px solid var(--border);cursor:zoom-in;vertical-align:middle;}
.empty-drops{color:var(--muted);font-size:13px;padding:10px 2px;}

/* Item-Auswahl mit Suche */
.picker{position:relative;}
.picker-list{position:absolute;z-index:40;left:0;right:0;top:calc(100% + 4px);max-height:340px;overflow:auto;
  background:var(--panel);border:1px solid var(--gold);border-radius:8px;box-shadow:0 14px 40px rgba(0,0,0,.5);}
.picker-group{padding:6px 10px 4px;font-size:11px;color:var(--gold);text-transform:uppercase;letter-spacing:.5px;
  position:sticky;top:0;background:var(--panel);border-bottom:1px solid var(--border-soft);}
.picker-opt{display:flex;align-items:center;gap:9px;padding:6px 10px;cursor:pointer;font-size:13px;}
.picker-opt img{width:28px;height:28px;flex:none;}
.picker-opt .de{color:var(--muted);font-size:12px;}
.picker-opt .meta{color:var(--muted);font-size:11.5px;margin-left:auto;white-space:nowrap;}
.picker-opt.active,.picker-opt:hover{background:var(--panel2);}
.picker-empty{padding:10px;color:var(--muted);font-size:13px;}
.r-veryrare{color:#e6b85c;} .r-unique{color:#e07ad8;} .r-ultimate{color:#ff8a65;} .r-rare{color:#7fb2f0;} .r-uncommon{color:#8fd19e;}

/* Runs */
.filters{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px;margin-bottom:16px;}
.run{border:1px solid var(--border-soft);border-radius:9px;padding:12px 14px;margin-bottom:10px;background:var(--bg-alt);}
.run-top{display:flex;gap:10px;align-items:center;flex-wrap:wrap;}
.run-top .title{font-weight:600;}
.run-top .when{color:var(--muted);font-size:12.5px;}
.run-top .who{display:inline-flex;align-items:center;gap:6px;color:var(--muted);font-size:12.5px;}
.run-top .who img{width:18px;height:18px;border-radius:50%;}
.run-top .actions{margin-left:auto;display:flex;gap:6px;}
.pill{display:inline-block;border:1px solid var(--border);border-radius:999px;padding:1px 8px;font-size:11.5px;color:var(--muted);}
.run-drops{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px;}
.drop-chip{display:inline-flex;align-items:center;gap:7px;background:var(--panel2);border:1px solid var(--border);border-radius:8px;padding:4px 9px 4px 4px;font-size:12.5px;}
.drop-chip img.icon{width:26px;height:26px;}
.drop-chip .sub{color:var(--muted);font-size:11px;}
.run-note{color:var(--muted);font-size:12.5px;margin-top:8px;white-space:pre-wrap;}
.no-drop{color:var(--muted);font-size:12.5px;margin-top:8px;font-style:italic;}

.drop-row .extra.has-recv{grid-template-columns:minmax(140px,200px) 1fr auto;}
a.pill-link{text-decoration:none;color:var(--gold-soft);border-color:rgba(201,154,74,.45);}
a.pill-link:hover{border-color:var(--gold);}

/* Events */
.pill.st-open{color:#b6e0be;border-color:rgba(111,174,124,.5);}
.pill.st-closed{color:var(--gold-soft);border-color:rgba(201,154,74,.5);}
.pill.st-cancelled{color:#ffb3ac;border-color:rgba(224,100,90,.45);}
.ev-card.focus{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold) inset;}
.ev-toggle{appearance:none;background:none;border:none;color:var(--gold-soft);cursor:pointer;font-size:14px;padding:0 2px;width:18px;}
.ev-detail{margin-top:10px;border-top:1px solid var(--border-soft);padding-top:10px;}
.ev-slots{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px;margin-top:8px;}
.ev-slots.extras .ev-slot{background:rgba(111,174,124,.05);}
.ev-slot{background:var(--panel2);border:1px solid var(--border-soft);border-radius:8px;padding:8px 10px;display:flex;flex-direction:column;gap:4px;}
.ev-slot .h{font-weight:600;font-size:13px;}
.ev-slot .h span{color:var(--muted);font-weight:400;}
.ev-member{font-size:12.5px;display:flex;align-items:center;gap:5px;color:var(--muted);}
.ev-member.reg{color:#b6e0be;}
.ev-member .x{appearance:none;background:none;border:none;color:var(--muted);cursor:pointer;margin-left:auto;font-size:11px;padding:0 2px;}
.ev-member .x:hover{color:var(--danger);}
.grid.ev-form{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));}
input[type=color]{width:60px;height:36px;padding:2px;background:var(--bg-alt);border:1px solid var(--border);border-radius:7px;cursor:pointer;}
.swatch{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:7px;vertical-align:0;}
.tpl-slots{display:flex;flex-direction:column;gap:8px;}
.tpl-slot{display:grid;grid-template-columns:70px minmax(120px,1fr) 80px 40px;gap:8px;align-items:center;
  background:var(--bg-alt);border:1px solid var(--border-soft);border-radius:8px;padding:8px;}
.tpl-slot.cls{grid-template-columns:70px minmax(120px,1fr) auto 40px;}
.tpl-slot .class-picks{grid-column:1 / -1;}
.class-picks{display:flex;flex-wrap:wrap;gap:6px;}
.class-pick{display:inline-flex;align-items:center;gap:5px;border:1px solid var(--border);border-radius:999px;padding:3px 10px;font-size:12.5px;cursor:pointer;color:var(--muted);}
.class-pick input{display:none;}
.class-pick.on{border-color:var(--gold);color:var(--text);background:rgba(201,154,74,.1);}

/* Mehrere Runs (Doppelchar/Triplerota): je Run ein farbiger Block */
.ev-runs{display:flex;flex-direction:column;gap:12px;margin-top:10px;}
.ev-run{--run:#3498db;border:1px solid var(--border);border-left:5px solid var(--run);border-radius:9px;padding:10px 12px;
  background:linear-gradient(90deg, color-mix(in srgb, var(--run) 12%, transparent), transparent 55%);}
.ev-run.r2,.ev-run-loot.r2{--run:#2ecc71;}
.ev-run.r3,.ev-run-loot.r3{--run:#e67e22;}
.ev-run .ev-slots{margin-top:6px;}
.ev-run-h{font-size:15px;color:var(--run);margin:0;font-weight:700;letter-spacing:.3px;text-transform:uppercase;}
.ev-run-h .hint{text-transform:none;letter-spacing:0;font-weight:400;}
.ev-run-loot{--run:#3498db;color:var(--run);font-weight:600;font-size:13px;margin:8px 0 4px;}
.ev-pub{margin-top:10px;padding:10px 12px;border:1px dashed var(--gold);border-radius:9px;background:rgba(201,154,74,.06);}
.ev-pub input{height:30px;}
.ev-mirror{display:inline-flex;align-items:center;gap:4px;margin-right:10px;}
.ev-mirror .x{background:none;border:0;color:var(--muted);cursor:pointer;padding:0 2px;}
.ev-mirror .x:hover{color:var(--danger);}

/* Emoji-Auswahl */
img.cemoji{width:18px;height:18px;vertical-align:-4px;object-fit:contain;font-size:9px;overflow:hidden;}
.emoji-btn{display:inline-flex;align-items:center;justify-content:center;gap:4px;height:36px;width:100%;font-size:18px;cursor:pointer;
  background:var(--bg-alt);border:1px solid var(--border);border-radius:7px;color:var(--text);padding:0 6px;}
.emoji-btn:hover{border-color:var(--gold);}
.emoji-btn .caret{font-size:10px;color:var(--muted);}
.emoji-btn img.cemoji{width:22px;height:22px;}
.emoji-pop{position:absolute;z-index:60;width:330px;max-width:calc(100vw - 16px);background:var(--panel);border:1px solid var(--gold);
  border-radius:9px;box-shadow:0 14px 40px rgba(0,0,0,.55);padding:8px;}
.emoji-paste{display:flex;gap:6px;margin-bottom:6px;}
.emoji-scroll{max-height:300px;overflow:auto;}
.emoji-group{font-size:11px;color:var(--gold);text-transform:uppercase;letter-spacing:.5px;margin:8px 2px 4px;}
.emoji-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:2px;}
.emoji-opt{appearance:none;background:none;border:1px solid transparent;border-radius:6px;font-size:20px;height:34px;cursor:pointer;padding:0;line-height:1;overflow:hidden;}
.emoji-opt:hover{background:var(--panel2);border-color:var(--border);}
.emoji-opt.on{border-color:var(--gold);background:rgba(201,154,74,.12);}
.emoji-opt img.cemoji{width:24px;height:24px;vertical-align:middle;}

/* Statistik */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:18px;}
.kpi{background:var(--bg-alt);border:1px solid var(--border-soft);border-radius:9px;padding:12px 14px;}
.kpi .v{font:700 22px 'JetBrains Mono',monospace;color:var(--gold-soft);}
.kpi .l{color:var(--muted);font-size:12px;}
.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(420px,1fr));gap:18px;}
table.t{width:100%;border-collapse:collapse;font-size:13px;}
table.t th{text-align:left;color:var(--muted);font-weight:600;font-size:11.5px;padding:7px 8px;border-bottom:1px solid var(--border);white-space:nowrap;}
table.t td{padding:6px 8px;border-bottom:1px solid var(--border-soft);vertical-align:middle;}
table.t td.n,table.t th.n{text-align:right;font-family:'JetBrains Mono',monospace;white-space:nowrap;}
table.t img.icon{width:24px;height:24px;vertical-align:middle;margin-right:6px;}
.bar{height:6px;border-radius:3px;background:var(--gold);opacity:.8;}
.month-chart{display:flex;align-items:flex-end;gap:6px;height:150px;padding:10px 0 0;}
.month-chart .col{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;min-width:0;}
.month-chart .stack{width:100%;max-width:38px;display:flex;flex-direction:column-reverse;border-radius:4px 4px 0 0;overflow:hidden;}
.month-chart .runs{background:rgba(91,141,189,.65);}
.month-chart .drops{background:var(--gold);}
.month-chart .lbl{font-size:10.5px;color:var(--muted);white-space:nowrap;}
.month-chart .num{font-size:10.5px;color:var(--text);}
.legend{display:flex;gap:14px;font-size:12px;color:var(--muted);}
.legend i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:5px;vertical-align:-1px;}

/* Admin */
.admin-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(380px,1fr));gap:18px;}
.status-box{background:var(--bg-alt);border:1px solid var(--border-soft);border-radius:8px;padding:10px 12px;font-size:13px;}
.copy-row{display:flex;gap:8px;}

.lightbox{position:fixed;inset:0;background:rgba(5,7,10,.88);display:grid;place-items:center;z-index:100;cursor:zoom-out;padding:20px;}
.lightbox img{max-width:100%;max-height:100%;border-radius:8px;}
.toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);background:var(--panel2);border:1px solid var(--gold);color:var(--gold-soft);
  padding:10px 18px;border-radius:7px;font-size:13px;opacity:0;pointer-events:none;transition:opacity .2s, transform .2s;z-index:120;max-width:90vw;}
.toast.show{opacity:1;transform:translateX(-50%) translateY(-4px);}
.toast.err{border-color:var(--danger);color:#ffb3ac;}
.loading{color:var(--muted);padding:30px;text-align:center;}

@media (max-width:820px){
  .grid.run-head{grid-template-columns:1fr 1fr;}
  .grid.run-head .field:first-child{grid-column:1 / -1;}
  .drop-row{grid-template-columns:44px 1fr 1fr;}
  .drop-row .picker-cell{grid-column:2 / -1;}
  .drop-row .extra{grid-column:1 / -1;}
  .stat-grid,.admin-grid{grid-template-columns:1fr;}
}
