/* Saison-Seite (saison.html): Rangliste, Aufgaben, Abzeichen, Garderobe. Baut auf theme.css und site.css auf. */
.ss-main{max-width:720px}
.ss-head .hero-title{font-size:clamp(34px,7vw,46px)}
.ss-title{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap}
.ss-ends{text-align:right}
.ss-ends .lbl{display:block;margin:0}
.ss-ends b{font-family:var(--f-display);font-weight:400;font-size:22px;color:var(--lantern);letter-spacing:.02em}
.stat b .ico{width:.8em;height:.8em;vertical-align:-.05em;margin-right:3px}
.ss-small{font-size:13px;margin:0}
.ss-row{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap}
.ss-row .lbl{margin:0}
.ico{width:1em;height:1em;display:inline-block;vertical-align:-.12em}

.ss-tabs{position:sticky;top:calc(var(--sa-t) + 70px);z-index:5;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.ss-tabs button{position:relative;font-size:14px}
.dot-badge{position:absolute;top:2px;right:6px;min-width:18px;height:18px;border-radius:9px;background:var(--coral);color:var(--night);font-size:11px;line-height:18px;padding:0 5px}

/* Umschalter */
.ss-seg{display:flex;gap:4px;background:rgba(10,8,34,.45);border:1px solid var(--stroke);border-radius:12px;padding:4px}
.ss-seg button{flex:1;border:0;background:transparent;color:var(--muted);font-weight:900;font-size:13.5px;padding:8px 4px;border-radius:9px}
.ss-seg button[aria-pressed="true"]{background:rgba(255,255,255,.1);color:var(--ink)}

/* Rangliste */
.ss-list .lb-row{grid-template-columns:36px 38px minmax(0,1fr) auto auto}
.ss-list .fc{display:grid;place-items:center}
.ss-list .fc svg{width:34px;height:auto;filter:drop-shadow(0 3px 4px rgba(0,0,0,.35))}
.ss-list .pt{font-family:var(--f-display);font-weight:400;font-size:20px;color:var(--lantern);letter-spacing:.02em}
.ss-list .pt small{font-family:var(--f-body);font-size:12px}
.ss-list .nm small{color:var(--lantern);font-size:12px}
.ss-list .nm small .ico{width:12px;height:12px}
.lb-row.mine{background:rgba(255,201,74,.1);box-shadow:inset 0 0 0 1.5px rgba(255,201,74,.45)}
.lb-row.top1 .pl{color:#ffd666}.lb-row.top2 .pl{color:#d9dcf2}.lb-row.top3 .pl{color:#e3a36a}
.ss-me{margin:0;padding:10px 12px;border-radius:var(--r-sm);background:rgba(10,8,34,.45);font-weight:900;text-align:center}
.ss-info{font-size:14px;color:var(--muted)}
.ss-info ul{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:4px}
.ss-info b{color:var(--ink)}

/* Aufgaben */
.ss-quests{display:flex;flex-direction:column;gap:10px}
.ss-quest{display:flex;align-items:center;gap:12px;background:rgba(10,8,34,.45);border:1px solid var(--stroke);border-radius:var(--r-md);padding:12px 14px}
.ss-quest.done{border-color:rgba(255,201,74,.55);box-shadow:0 0 22px -8px rgba(255,201,74,.6)}
.ss-quest.claimed{opacity:.65}
.q-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.q-main small{color:var(--muted);font-weight:800}
.bar{height:8px;border-radius:4px;background:rgba(255,255,255,.08);overflow:hidden}
.bar i{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,var(--teal),var(--lantern))}
.q-side{display:flex;flex-direction:column;align-items:flex-end;gap:6px;flex:none}
.rw{font-weight:900;white-space:nowrap}
.btn.sm{flex:none;font-size:15px;padding:9px 14px 7px;box-shadow:0 3px 0 var(--lantern-d)}
.ok-tag{font-size:12px;font-weight:900;color:var(--teal);padding:4px 10px;border-radius:999px;background:rgba(60,208,180,.12)}
.ss-bonus{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:12px 14px;border-radius:var(--r-md);
  background:linear-gradient(120deg,rgba(255,201,74,.14),rgba(178,139,255,.12));border:1px dashed rgba(255,201,74,.4)}
.ss-bonus > span:first-child{flex:1;min-width:180px}

/* Abzeichen */
.ss-badges{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.ss-badge{display:flex;flex-direction:column;align-items:center;text-align:center;gap:3px;padding:14px 10px 12px;border-radius:var(--r-md);
  background:rgba(10,8,34,.45);border:1px solid var(--stroke);filter:grayscale(1);opacity:.55}
.ss-badge.got{filter:none;opacity:1;border-color:rgba(255,201,74,.35)}
.ss-badge b{font-size:14.5px;line-height:1.2;margin-top:4px}
.ss-badge small{font-size:12px;color:var(--muted);line-height:1.3}
.ss-badge .when{color:var(--faint);margin-top:2px}
.medal{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;position:relative;
  background:radial-gradient(circle at 35% 30%,#fff2c4,var(--lantern) 45%,#c9921b);box-shadow:0 0 0 3px rgba(21,18,56,.6),0 0 0 5px rgba(255,201,74,.5),0 8px 18px -6px rgba(255,201,74,.6)}
.medal span{font-family:var(--f-display);font-size:19px;color:#5a3b05;letter-spacing:.01em}
.ss-badge:nth-child(4n+2) .medal{background:radial-gradient(circle at 35% 30%,#d6fff4,var(--teal) 45%,#1f8d78);box-shadow:0 0 0 3px rgba(21,18,56,.6),0 0 0 5px rgba(60,208,180,.5),0 8px 18px -6px rgba(60,208,180,.6)}
.ss-badge:nth-child(4n+2) .medal span{color:#08443a}
.ss-badge:nth-child(4n+3) .medal{background:radial-gradient(circle at 35% 30%,#efe6ff,var(--lilac) 45%,#6a44c2);box-shadow:0 0 0 3px rgba(21,18,56,.6),0 0 0 5px rgba(178,139,255,.5),0 8px 18px -6px rgba(178,139,255,.6)}
.ss-badge:nth-child(4n+3) .medal span{color:#2d1670}
.ss-badge:nth-child(4n) .medal{background:radial-gradient(circle at 35% 30%,#ffe0dc,var(--coral) 45%,#b53d33);box-shadow:0 0 0 3px rgba(21,18,56,.6),0 0 0 5px rgba(255,107,94,.5),0 8px 18px -6px rgba(255,107,94,.6)}
.ss-badge:nth-child(4n) .medal span{color:#5c140e}

/* Garderobe */
.ss-stage{position:relative;height:180px;border-radius:var(--r-md);overflow:hidden;
  background:radial-gradient(circle at 50% 40%,#3a2f96,#1b1650 65%,#100d2e);box-shadow:inset 0 0 0 1px var(--stroke)}
.ss-stage canvas{width:100%;height:100%;display:block}
.ss-wallet{position:absolute;top:10px;right:12px;font-family:var(--f-display);font-size:20px;color:var(--lantern);letter-spacing:.02em;
  background:rgba(10,8,34,.6);border-radius:999px;padding:6px 12px 3px}
.ss-wallet .ico{width:16px;height:16px;vertical-align:-.1em}
.ss-group + .ss-group{margin-top:14px}
.ss-items{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px}
.ss-item{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 4px 8px;border-radius:var(--r-md);
  background:rgba(10,8,34,.45);border:1.5px solid var(--stroke);color:var(--ink);font:inherit;cursor:pointer;transition:border-color .15s,transform .1s}
.ss-item:hover{border-color:rgba(255,255,255,.3)}
.ss-item:active{transform:scale(.97)}
.ss-item .ic{height:58px;display:grid;place-items:center}
.ss-item .ic svg{width:46px;height:auto}
.ss-item b{font-size:13px;line-height:1.15}
.ss-item small{font-size:11.5px;font-weight:900;color:var(--lantern);display:inline-flex;align-items:center;gap:3px}
.ss-item small .ico{width:12px;height:12px}
.ss-item.owned small{color:var(--teal)}
.ss-item.on{border-color:var(--lantern);box-shadow:0 0 0 3px rgba(255,201,74,.2)}
.ss-item.on small{color:var(--lantern)}
.ss-item.locked{opacity:.5}
.ss-item.locked small{color:var(--muted);text-align:center}
.ss-item.poor small{color:var(--faint)}
.ss-item.armed{border-color:var(--coral);box-shadow:0 0 0 3px rgba(255,107,94,.25)}
.ss-item.armed small{color:var(--coral)}
.trail-ic{font-size:28px;line-height:1;color:var(--lantern);text-shadow:0 0 12px rgba(255,201,74,.7)}

@media (max-width:560px){
  .ss-list .lb-row{grid-template-columns:28px 34px minmax(0,1fr) auto}
  .ss-list .gm{display:none}
  .ss-tabs button{font-size:12.5px;padding:9px 2px}
  .ss-badges{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ss-items{grid-template-columns:repeat(3,minmax(0,1fr))}
}

/* Meldungen als Hinweis unten, damit sie auch beim Scrollen in der Garderobe sichtbar sind */
#msg{position:fixed;left:50%;bottom:calc(var(--sa-b) + 16px);transform:translateX(-50%);z-index:20;
  width:max-content;max-width:calc(100vw - 32px);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:var(--shadow)}
#msg.ok{background:rgba(20,70,62,.92)}
#msg.err{background:rgba(90,28,24,.92)}

/* ---------- Event der Woche und Teilen ---------- */
.ev-card{display:flex;flex-direction:column;gap:6px;padding:14px;border-radius:var(--r-sm);border:1px solid rgba(255,201,74,.4);
  background:radial-gradient(120% 140% at 0% 0%,rgba(255,201,74,.16),rgba(10,8,34,.45) 60%)}
.ev-card p{margin:0}
.ev-card .btn{align-self:flex-start;margin-top:6px}
.ev-name{font-family:var(--f-display);font-weight:400;font-size:clamp(26px,7vw,34px);color:var(--lantern);margin:0;line-height:1.05}
#p-event{display:flex;flex-direction:column;gap:12px}
#p-event[hidden]{display:none}
.ss-share{margin-top:6px}