/* DAU TO PRO · Lernkonto und „Mein Fortschritt“. Baut auf style.css auf (Farben, Navigation, Buttons). */
.konto-main{max-width:1180px;margin:0 auto;padding:54px 28px 90px;min-height:60vh}
.konto-main h1{font-size:clamp(32px,4.2vw,52px);line-height:1.06;font-weight:950;letter-spacing:-.03em;text-transform:uppercase;margin:0 0 16px}
.konto-main h1 span{color:var(--gold);text-shadow:0 0 28px #eab44844}
.konto-main h2{font-size:clamp(20px,2.2vw,26px);font-weight:900;letter-spacing:-.01em;margin:0}
.konto-main h3{font-size:16px;font-weight:850;margin:0 0 10px;color:var(--cream)}
.konto-lead{color:var(--muted);font-size:16px;max-width:640px;margin:0}
.konto-lead strong{color:var(--goldlite)}
.konto-hint,.field-hint{color:#98a4a7;font-size:13px;line-height:1.5}
.konto-hint{margin:18px 0 0}
.field-hint{display:block;margin:-6px 0 4px}
.field-hint a,.konto-main p a:not([class]){color:var(--goldlite);text-decoration:underline;text-underline-offset:3px}
.text-link{color:var(--cyan);font-size:13px;font-weight:750}
.text-link:hover{color:#8ff7fc}
.konto-meta{color:#98a4a7;font-size:13px}
.konto-meta strong{color:var(--cream)}

.konto-card{position:relative;background:linear-gradient(150deg,rgba(25,32,36,.94),rgba(12,16,19,.96));border:1px solid rgba(233,174,56,.28);border-radius:16px;padding:24px;box-shadow:0 18px 50px #0007}
.konto-card p{color:var(--muted);font-size:14px;margin:0 0 14px}
.konto-card form+p{margin-top:18px}
.konto-card.is-danger{border-color:rgba(255,127,110,.35)}
.konto-card.has-error{box-shadow:0 0 0 2px #ff7f6e88,0 18px 50px #0007}

.konto-alert{max-width:760px;margin:0 auto 26px;padding:13px 18px;border-radius:12px;font-size:14px;font-weight:650;border:1px solid}
.konto-alert.is-ok{background:#122a20e6;border-color:#3d8f66;color:#bff2d6}
.konto-alert.is-error{background:#33181ae6;border-color:#a2484a;color:#ffd1cc}

/* Formulare */
.auth-form,.konto-card form{display:grid;gap:14px}
.konto-main label{display:grid;gap:7px;font-size:13px;font-weight:750;color:#d9d3c1}
.konto-main input[type=text],.konto-main input[type=password],.konto-main input:not([type]){width:100%;min-height:48px;padding:11px 14px;border-radius:10px;border:1px solid #3a4448;background:#0b1013;color:var(--cream);font-size:16px;outline:none;transition:border-color .15s,box-shadow .15s}
.konto-main input:focus{border-color:var(--gold);box-shadow:0 0 0 3px #eab44829}
.konto-main input:user-invalid{border-color:#ff7f6e}
.confirm-check{display:flex!important;grid-template-columns:none;align-items:center;gap:10px!important;font-weight:600!important;color:var(--muted)!important;cursor:pointer}
.confirm-check input{width:19px;height:19px;accent-color:var(--gold);flex:0 0 19px}
.confirm-check.nudge{animation:nudge .5s}
@keyframes nudge{25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
.konto-main .primary-action,.konto-main .secondary-action{border:0;width:fit-content;max-width:100%;text-align:center}
.konto-main .secondary-action{border:1px solid #a88239;font-family:inherit;cursor:pointer}
.konto-main .secondary-action:hover{background:#1a272c}
.primary-action.is-disabled{filter:grayscale(.8) brightness(.7);cursor:not-allowed}
.hp-field{position:absolute!important;left:-10000px;width:1px;height:1px;overflow:hidden}

/* Gast: Anmelden / Registrieren */
.auth-layout{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:56px;align-items:start}
.auth-intro{padding-top:18px}
.auth-points{list-style:none;padding:0;margin:28px 0 0;display:grid;gap:12px}
.auth-points li{position:relative;padding-left:30px;color:var(--muted);font-size:15px}
.auth-points li:before{content:"";position:absolute;left:4px;top:.5em;width:10px;height:10px;transform:rotate(45deg);background:var(--cyan);box-shadow:0 0 12px #00dce888}
.auth-points b{color:var(--cream)}
.auth-next{margin-top:24px;color:var(--goldlite);font-size:15px}
.auth-card{padding:0;overflow:hidden}
.auth-card .auth-form{padding:26px}
.auth-tabs{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid #2c3538}
.auth-tabs a{padding:17px 10px;text-align:center;font-weight:850;font-size:14px;color:#9aa5a8;border-bottom:2px solid transparent}
.auth-tabs a:hover{color:var(--cream)}
.auth-tabs a.active{color:var(--goldlite);border-bottom-color:var(--gold);background:linear-gradient(0deg,#eab44812,transparent)}
.auth-form .primary-action{margin-top:6px}
.auth-title{font-size:24px!important;text-transform:none!important;letter-spacing:-.01em!important;margin:0!important}
.auth-form .eyebrow{margin:0}

/* Wiederherstellungscode */
.code-card{max-width:760px;margin:0 auto;padding:34px}
.code-card h1{font-size:clamp(28px,3.4vw,40px)}
.code-box{margin:26px 0 16px;padding:20px;border:2px dashed #d1a747;border-radius:14px;background:#0b1013;text-align:center}
.code-box code{font:900 clamp(20px,4.6vw,34px)/1.2 ui-monospace,"Cascadia Mono",Consolas,monospace;letter-spacing:.08em;color:var(--goldlite);word-break:break-all;user-select:all}
.code-actions{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:6px}
.code-card .confirm-check{margin:22px 0 18px}

/* Mein Fortschritt */
.konto-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:36px;align-items:end;margin-bottom:46px}
.konto-head .konto-next{grid-column:1/-1;grid-row:2;justify-self:start}
.konto-stats{display:grid;grid-template-columns:repeat(3,auto);gap:12px;margin:0}
.konto-stats div{min-width:140px;padding:16px 18px;border:1px solid rgba(233,174,56,.28);border-radius:14px;background:rgba(12,16,19,.85)}
.konto-stats dt{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#98a4a7;font-weight:800}
.konto-stats dd{margin:6px 0 0;font-size:30px;font-weight:950;color:var(--goldlite);line-height:1}
.konto-stats dd small{font-size:15px;color:#98a4a7}
.konto-stats dd.is-text{font-size:15px;line-height:1.3;color:var(--cream)}
.konto-section{margin-top:46px}
.konto-section-head{display:flex;justify-content:space-between;align-items:baseline;gap:16px;flex-wrap:wrap;margin-bottom:18px}
.konto-empty{color:var(--muted)}
.progress-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px}
.progress-card{--mod:#eab448;display:grid;grid-template-rows:auto 1fr;border:1px solid color-mix(in srgb,var(--mod) 30%,transparent);border-radius:16px;overflow:hidden;background:rgba(12,16,19,.92);transition:border-color .2s,transform .2s}
.progress-card:hover{border-color:color-mix(in srgb,var(--mod) 65%,transparent)}
.progress-card.is-started{box-shadow:0 0 0 1px color-mix(in srgb,var(--mod) 22%,transparent),0 14px 40px #0006}
.progress-art{aspect-ratio:16/9;background:#0b1013;position:relative;overflow:hidden}
.progress-art img{position:absolute;inset:0;width:100%;height:100%;display:block}
.progress-card:not(.is-started) .progress-art img{filter:saturate(.55) brightness(.75)}
.progress-body{padding:16px 18px 18px;display:flex;flex-direction:column;gap:6px}
.progress-body h3{margin:0;font-size:17px}
.progress-state{margin:0;font-size:13px;color:var(--cream);display:flex;align-items:center;gap:8px}
.state-dot{width:9px;height:9px;border-radius:50%;background:var(--mod);box-shadow:0 0 10px var(--mod);flex:0 0 9px}
.state-dot.is-idle{background:#56616a;box-shadow:none}
.progress-meta{margin:0;font-size:12px;color:#98a4a7}
.progress-actions{margin-top:auto;padding-top:10px;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.progress-actions form{display:block}
.mini-action{display:inline-flex;align-items:center;gap:6px;padding:8px 13px;border-radius:9px;font-family:inherit;font-size:13px;font-weight:800;line-height:1.2;border:1px solid #3a4448;background:transparent;color:var(--cream);cursor:pointer}
.mini-action.is-gold{background:linear-gradient(105deg,#fff1bb,#efc261 58%,#cc8f25);color:#130f07;border-color:#ffd988}
.mini-action.is-danger{color:#ffb1a8;border-color:#7a3a3a}
.mini-action.is-danger:hover{background:#3a1c1e}

@media(max-width:900px){
  .auth-layout{grid-template-columns:1fr;gap:30px}
  .auth-intro{padding-top:0}
  .konto-head{grid-template-columns:1fr;gap:24px}
  .konto-head .konto-next{grid-row:auto}
  .konto-stats{grid-template-columns:repeat(3,minmax(0,1fr))}
  .konto-stats div{min-width:0}
}
@media(max-width:610px){
  .konto-main{padding:34px 14px 70px}
  .konto-card,.code-card{padding:20px}
  .auth-card{padding:0}
  .auth-card .auth-form{padding:20px}
  .konto-stats{grid-template-columns:1fr 1fr}
  .konto-stats div:last-child{grid-column:1/-1}
  .konto-stats dd{font-size:26px}
  .progress-grid{grid-template-columns:1fr}
  .code-actions .secondary-action{width:100%}
  .konto-main .primary-action{width:100%}
}
@media (prefers-reduced-motion:reduce){.confirm-check.nudge{animation:none}}

/* Konto-Einstellungen als aufklappbare Liste statt großer Formular-Kacheln. */
.settings-list{display:grid;gap:10px;max-width:760px}
.settings-item{background:linear-gradient(150deg,rgba(25,32,36,.94),rgba(12,16,19,.96));border:1px solid rgba(233,174,56,.22);border-radius:14px;overflow:hidden;transition:border-color .2s}
.settings-item[open]{border-color:rgba(233,174,56,.5)}
.settings-item.is-danger{border-color:rgba(255,127,110,.28)}
.settings-item.is-danger[open]{border-color:rgba(255,127,110,.55)}
.settings-item.has-error{box-shadow:0 0 0 2px #ff7f6e88}
.settings-item summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:16px;padding:16px 20px}
.settings-item summary::-webkit-details-marker{display:none}
.settings-item summary>span{display:grid;gap:2px;flex:1;min-width:0}
.settings-item summary b{font-size:15px;color:var(--cream)}
.settings-item.is-danger summary b{color:#ffb1a8}
.settings-item summary small{font-size:13px;color:var(--muted)}
.settings-item summary:after{content:"";width:9px;height:9px;border-right:2px solid var(--gold);border-bottom:2px solid var(--gold);transform:rotate(45deg) translateY(-3px);transition:transform .2s;flex:0 0 auto}
.settings-item[open] summary:after{transform:rotate(-135deg) translateY(-1px)}
.settings-item summary:hover b{color:var(--goldlite)}
.settings-item summary:focus-visible{outline:2px solid var(--gold);outline-offset:-2px}
.settings-body{display:grid;gap:14px;padding:4px 20px 20px;max-width:460px}
.settings-body .secondary-action,.settings-body .mini-action{justify-self:start}
/* Browser-Autofill nicht als olivgelbes Feld. */
.konto-main input:-webkit-autofill{-webkit-text-fill-color:#f5f0df;-webkit-box-shadow:0 0 0 40px #0b1013 inset;caret-color:#f5f0df}
@media(prefers-reduced-motion:reduce){.settings-item summary:after{transition:none}}

/* Level, Achievements und Highscore. */
.level-panel{margin:-16px 0 0;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:18px;padding:16px 20px;border:1px solid rgba(233,174,56,.38);background:linear-gradient(120deg,rgba(234,180,72,.10),rgba(12,16,19,.92) 45%);clip-path:polygon(0 0,98.5% 0,100% 22%,100% 100%,1.5% 100%,0 78%)}
.level-badge{display:grid;place-items:center;width:74px;height:74px;border:2px solid var(--gold);background:#0b1013;clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%)}
.level-badge small{font-size:9px;letter-spacing:.18em;font-weight:850;color:#98a4a7;margin-top:12px;line-height:1}
.level-badge b{font-size:28px;font-weight:950;color:var(--goldlite);line-height:1;margin-bottom:12px}
.level-title{margin:0 0 6px;font-size:18px;font-weight:900;color:var(--cream);letter-spacing:.02em}
.level-bar{height:10px;border-radius:999px;background:#ffffff14;overflow:hidden}
.level-bar i{display:block;height:100%;background:linear-gradient(90deg,#cc8f25,#efc261 60%,#fff1bb);box-shadow:0 0 12px #eab44888}
.level-meta{margin:6px 0 0;font-size:13px;color:var(--muted)}
.level-link{display:grid;justify-items:end;line-height:1.1;padding:6px 4px}
.level-link b{font-size:28px;font-weight:950;color:var(--cyan)}
.level-link small{font-size:12px;color:var(--muted)}
.level-link:hover b{text-shadow:0 0 14px #76d8df88}
.progress-subject{margin:0 0 2px;font-size:10px;letter-spacing:.14em;text-transform:uppercase;font-weight:800;color:var(--mod)}
.ach-group{margin-bottom:12px;border:1px solid rgba(233,174,56,.22);border-radius:14px;background:rgba(12,16,19,.9);overflow:hidden}
.ach-group[open]{border-color:rgba(233,174,56,.42)}
.ach-group summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 20px}
.ach-group summary::-webkit-details-marker{display:none}
.ach-group summary>span:first-child{display:grid;gap:1px}
.ach-subject{font-size:10px;letter-spacing:.16em;text-transform:uppercase;font-weight:850;color:var(--gold)}
.ach-group summary b{font-size:16px;color:var(--cream)}
.ach-count{font-weight:900;color:var(--cyan);font-size:15px;white-space:nowrap}
.ach-grid{list-style:none;margin:0;padding:4px 16px 16px;display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px}
.ach-item{--c:#5b666a;display:grid;grid-template-columns:42px minmax(0,1fr);gap:12px;align-items:start;padding:12px;border:1px solid #ffffff14;border-left:3px solid var(--c);background:#0b1013;opacity:.62}
.ach-item.is-on{opacity:1;background:linear-gradient(135deg,color-mix(in srgb,var(--c) 12%,#0b1013),#0b1013 60%)}
.ach-item.tier-bronze{--c:#d08b55}.ach-item.tier-silber{--c:#c8d0d6}.ach-item.tier-gold{--c:#eab448}.ach-item.tier-platin{--c:#7fe0e6}.ach-item.tier-witzig{--c:#c4a8ff}.ach-item.tier-versteckt{--c:#ff7f8f}
.ach-icon{width:42px;height:42px;display:grid;place-items:center;font-size:21px;border:1px solid color-mix(in srgb,var(--c) 70%,transparent);background:#ffffff08;filter:grayscale(1)}
.ach-item.is-on .ach-icon{filter:none;box-shadow:0 0 14px color-mix(in srgb,var(--c) 40%,transparent)}
.ach-item.is-secret .ach-icon{font-weight:900;color:var(--muted);font-size:20px}
.ach-text{display:grid;gap:3px;min-width:0}
.ach-text b{font-size:14px;color:var(--cream);line-height:1.3}
.ach-text small{font-size:12.5px;color:var(--muted);line-height:1.45}
.ach-meta{font-size:11px;font-weight:750;color:var(--c);letter-spacing:.02em}
.ach-date{color:#5fd99a}
@media(max-width:610px){
  .level-panel{grid-template-columns:auto minmax(0,1fr);padding:14px}
  .level-link{grid-column:1/-1;justify-items:start;display:flex;gap:6px;align-items:baseline}
  .level-badge{width:62px;height:62px}.level-badge b{font-size:23px}
  .ach-grid{grid-template-columns:1fr;padding:4px 10px 12px}
  .ach-group summary{padding:12px 14px}
}
.hs-head{grid-template-columns:1fr}
.hs-locked{max-width:620px}
.hs-hint{max-width:none;margin:0 0 22px;background:#1e1a13e6;border-color:#eab44866;color:var(--cream);font-weight:600}.hs-hint a{color:var(--goldlite);text-decoration:underline;text-underline-offset:3px}
.hs-table-wrap{overflow-x:auto;border:1px solid rgba(233,174,56,.3);border-radius:14px;background:rgba(12,16,19,.92)}
.hs-table{width:100%;border-collapse:collapse;font-size:14px;min-width:620px}
.hs-table th{text-align:left;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#98a4a7;font-weight:850;padding:14px 16px;border-bottom:1px solid #ffffff1a}
.hs-table td{padding:12px 16px;border-bottom:1px solid #ffffff0d;vertical-align:middle}
.hs-table tr:last-child td{border-bottom:0}
.hs-table .num{text-align:right;font-variant-numeric:tabular-nums}
.hs-table tr.is-self td{background:linear-gradient(90deg,#eab4481f,transparent)}
.hs-rank{font-size:18px;font-weight:900;color:var(--goldlite);width:64px}
.hs-name{font-weight:800;color:var(--cream)}.hs-name small{color:var(--gold);font-weight:700}
.hs-level b{display:inline-grid;place-items:center;min-width:34px;height:28px;padding:0 6px;margin-right:6px;background:#0b1013;border:1px solid var(--gold);color:var(--goldlite);font-weight:900}
.hs-level span{color:var(--muted)}
.hs-ach b{color:var(--cyan);font-size:16px}.hs-ach small{color:var(--muted)}
.hs-rare{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px}
.hs-chip{--c:#eab448;font-size:11px;font-weight:750;padding:2px 8px;border:1px solid color-mix(in srgb,var(--c) 60%,transparent);color:var(--c);background:color-mix(in srgb,var(--c) 10%,transparent);border-radius:999px;white-space:nowrap}
.hs-chip.tier-bronze{--c:#d08b55}.hs-chip.tier-silber{--c:#c8d0d6}.hs-chip.tier-platin{--c:#7fe0e6}.hs-chip.tier-witzig{--c:#c4a8ff}.hs-chip.tier-versteckt{--c:#ff7f8f}


.hs-table .hs-achievement-row>td{padding:0 16px 14px;border-top:0}
.hs-achievements{border:1px solid #e8b84a35;border-radius:10px;background:#0d1419;scroll-margin-top:100px}
.hs-achievements summary{cursor:pointer;padding:12px 14px;font-size:13px;color:#f0cd83;font-weight:700}
.hs-achievements summary span{display:inline-block;margin-left:12px;color:#9faeb7;font-size:12px;font-weight:400}
.hs-achievements[open] summary{border-bottom:1px solid #ffffff12;margin-bottom:12px}
.hs-achievements .ach-grid{grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr))}
.hs-achievements .ach-text{white-space:normal}
.hs-achievements .konto-hint{padding:0 14px}


/* XP 2.0 — existing colours, type and achievement tiers. */
.recent-grid .tier-platin{box-shadow:inset 0 0 22px #7fe0e612}.showcase-preview,.showcase-inline{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.showcase-preview{margin:16px 0}.showcase-icon,.showcase-empty{position:relative;display:inline-grid;place-items:center;flex:none;width:48px;height:48px;background:#ffffff06;border:1px solid var(--stroke,#ffffff24);color:inherit;border-radius:8px}.showcase-icon img,.ach-icon img{width:42px;height:42px;object-fit:contain;image-rendering:pixelated}.showcase-icon[aria-label]{cursor:pointer}.showcase-icon [role=tooltip]{position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%);width:max-content;max-width:180px;white-space:normal;padding:8px;background:#151b20;color:#fff;border:1px solid #eab448;z-index:4;display:none;font:500 12px/1.4 Inter,system-ui}.showcase-icon:hover [role=tooltip],.showcase-icon:focus [role=tooltip]{display:block}.showcase-empty{opacity:.25}.showcase-slots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-bottom:16px}.showcase-slots label{display:grid;gap:8px;min-width:0}.showcase-slots select,.profile-dialog select{max-width:100%;padding:12px;background:#12191d;color:inherit;border:1px solid #ffffff30;border-radius:6px}.learning-week{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;list-style:none;padding:0}.learning-week li{display:grid;place-items:center;padding:10px 4px;border:1px solid #ffffff20;font-size:12px}.learning-week li span{font-size:20px}.learning-week .is-done{border-color:#eab448;background:#eab44812;color:#eab448}.xp-columns{display:grid;grid-template-columns:1fr 1fr;gap:16px}.xp-breakdown{width:100%;border-collapse:collapse}.xp-breakdown th{text-align:left;font-weight:500}.xp-breakdown td{text-align:right;font-variant-numeric:tabular-nums}.xp-breakdown td,.xp-breakdown th{padding:9px 0;border-bottom:1px solid #ffffff12}.xp-history{padding:0;list-style:none}.xp-history li{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid #ffffff12}.xp-history small{display:block;color:var(--muted,#9da9b1)}.xp-history b{white-space:nowrap;color:#5fd99a}.profile-open{background:none;border:0;font:inherit;padding:0;cursor:pointer;text-align:left}.hs-name .showcase-inline{margin-top:8px}.profile-dialog{color:var(--text,#f5f0df);background:#0c1216;border:1px solid #eab44860;border-radius:12px;width:min(900px,calc(100vw - 28px));max-height:85dvh;padding:24px;box-sizing:border-box}.profile-dialog::backdrop{background:#020508b8;backdrop-filter:blur(8px) brightness(.55);animation:profile-fade .25s ease}.profile-dialog[open]{animation:profile-fade .25s ease}.profile-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}.profile-dialog .ach-grid{margin-top:20px}.profile-dialog .showcase-icon{width:auto;max-width:100%;height:auto;padding:8px;display:flex;gap:8px;font-size:12px}.profile-dialog .ach-item:not(.is-on){filter:grayscale(1);opacity:.48}.profile-dialog .showcase-icon .ach-icon{flex-shrink:0}.profile-toolbar h2{margin:0;overflow-wrap:anywhere}.profile-dialog:focus-visible,.showcase-icon:focus-visible{outline:2px solid #7fe0e6;outline-offset:3px}html:has(.profile-dialog[open]){overflow:hidden}@keyframes profile-fade{from{opacity:0}to{opacity:1}}@media(max-width:620px){.showcase-slots,.xp-columns{grid-template-columns:1fr}.profile-dialog{padding:16px}.showcase-inline .showcase-icon,.showcase-inline .showcase-empty{width:42px;height:42px}.showcase-inline .showcase-icon img{width:36px;height:36px}.learning-week{gap:4px}.learning-week li{font-size:10px}.hs-table .hs-name{min-width:150px}}@media(prefers-reduced-motion:reduce){.profile-dialog[open],.profile-dialog::backdrop{animation:none}}
@supports (transition-behavior:allow-discrete){.profile-dialog{opacity:0;transform:translateY(8px);transition:opacity .25s,transform .25s,display .25s allow-discrete,overlay .25s allow-discrete}.profile-dialog[open]{opacity:1;transform:none;animation:none}.profile-dialog::backdrop{opacity:0;transition:opacity .25s,display .25s allow-discrete,overlay .25s allow-discrete}.profile-dialog[open]::backdrop{opacity:1;animation:none}@starting-style{.profile-dialog[open],.profile-dialog[open]::backdrop{opacity:0}.profile-dialog[open]{transform:translateY(8px)}}}@media(prefers-reduced-motion:reduce){.profile-dialog,.profile-dialog::backdrop{transition:none!important}}
.showcase-icon [role=tooltip]{pointer-events:none}.hs-name .showcase-inline{display:inline-flex;vertical-align:middle;margin:4px 0 4px 8px}
.showcase-slots select{width:100%;min-width:0;box-sizing:border-box}.learning-week{grid-template-columns:repeat(7,minmax(0,1fr))}.learning-week li{min-width:0}.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.showcase-icon .ach-icon{filter:none;opacity:1;border:0;background:none}

.recent-grid .ach-item { position: relative; }
.recent-grid .recent-condition {
  position: absolute;
  z-index: 4;
  inset: auto .35rem calc(100% + .35rem);
  padding: .55rem .65rem;
  border: 1px solid #a88846;
  border-radius: 7px;
  background: #11181c;
  color: #f5f0df;
  line-height: 1.4;
  opacity: 0;
  overflow-wrap: anywhere;
  pointer-events: none;
}
.recent-grid .ach-item:hover .recent-condition,
.recent-grid .ach-item:focus .recent-condition { opacity: 1; }

.konto-modules-link{
  position:fixed;
  right:max(16px,env(safe-area-inset-right));
  bottom:max(16px,env(safe-area-inset-bottom));
  z-index:45;
  box-shadow:0 8px 24px #0008;
}
.konto-page:has(.konto-modules-link){padding-bottom:70px}
.konto-modules-cell{grid-column:-2/-1;display:flex;justify-content:flex-end;align-items:center;min-width:0;list-style:none}
.konto-modules-inline{white-space:nowrap}
.konto-recent>.konto-modules-inline{display:inline-flex;margin-top:16px}

/* Highscore profile: spacious achievement gallery instead of tiny medal-like badges. */
.highscore-page .profile-showcase-title{margin:22px 0 12px;font-size:16px;letter-spacing:.07em;text-transform:uppercase;color:var(--goldlite)}
.highscore-page .profile-showcase{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:0 0 26px}
.highscore-page .profile-showcase-card{--c:var(--gold);min-width:0;min-height:160px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center;padding:18px 12px;border:1px solid color-mix(in srgb,var(--c) 55%,transparent);border-radius:14px;background:linear-gradient(150deg,color-mix(in srgb,var(--c) 15%,#10161a),#0b1013);box-shadow:inset 0 1px #ffffff15}
.highscore-page .profile-showcase-card.tier-bronze{--c:#d08b55}.highscore-page .profile-showcase-card.tier-silber{--c:#c8d0d6}.highscore-page .profile-showcase-card.tier-gold{--c:#eab448}.highscore-page .profile-showcase-card.tier-platin{--c:#7fe0e6}.highscore-page .profile-showcase-card.tier-witzig{--c:#c4a8ff}.highscore-page .profile-showcase-card.tier-versteckt{--c:#ff7f8f}
.highscore-page .profile-showcase-card .ach-icon{width:82px;height:82px;font-size:46px;filter:none;border:0;background:transparent;color:var(--c)}
.highscore-page .profile-showcase-card .ach-icon img{width:76px;height:76px;object-fit:contain;image-rendering:pixelated}
.highscore-page .profile-showcase-card strong{font-size:13px;line-height:1.3;color:var(--cream);overflow-wrap:anywhere}
.highscore-page .profile-dialog .ach-grid{grid-template-columns:repeat(auto-fit,minmax(min(290px,100%),1fr));gap:14px}
.highscore-page .profile-dialog .ach-item{grid-template-columns:60px minmax(0,1fr);padding:16px;gap:14px}
.highscore-page .profile-dialog .ach-item .ach-icon{width:60px;height:60px;font-size:29px}
.highscore-page .profile-dialog .ach-item .ach-icon img{width:54px;height:54px;object-fit:contain;image-rendering:pixelated}
@media(max-width:540px){.highscore-page .profile-showcase{gap:8px}.highscore-page .profile-showcase-card{padding:12px 7px;min-height:130px}.highscore-page .profile-showcase-card .ach-icon{width:58px;height:58px;font-size:32px}.highscore-page .profile-showcase-card .ach-icon img{width:56px;height:56px}.highscore-page .profile-showcase-card strong{font-size:11px}}
.showcase-icon [role=tooltip] strong{display:block;color:#eab448;font-weight:700}.showcase-icon [role=tooltip] small{display:block;margin-top:4px;font:400 12px/1.4 Inter,system-ui;color:#d7dde2}.showcase-icon [role=tooltip]{max-width:220px}
