/* Ready4nexxt Konto v2519
   Konto Dashboard statt Diagnosebericht.
   - Eine Statuszeile je Information, kompakte Karten, wenige Hauptaktionen.
   - Statusfarbe immer zusammen mit Text, nie Farbe allein.
   - Mobile einspaltig ab 320 Pixel, Desktop hoechstens zwei Spalten.
*/
:root{
  color-scheme:dark;
  --access-bg:#07080b;--access-surface:#11141b;--access-surface-2:#0b0e14;
  --access-border:rgba(255,255,255,.10);--access-border-soft:rgba(255,255,255,.07);
  --access-text:#f4f2ec;--access-muted:#b3bac6;--access-faint:#8b93a1;
  --access-gold:#d4af37;--access-gold-light:#f1d371;
  --access-green:#67c899;--access-orange:#e0a83a;--access-red:#ef7a68;
  --access-shadow:0 24px 70px rgba(0,0,0,.38);
  --access-serif:"Cormorant Garamond",Georgia,serif;
  --access-sans:"DM Sans",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
*{box-sizing:border-box}
body.r4x-access-page{margin:0;min-width:320px;min-height:100vh;background:radial-gradient(circle at 14% 2%,rgba(23,43,72,.42),transparent 34rem),radial-gradient(circle at 88% 8%,rgba(212,175,55,.07),transparent 30rem),var(--access-bg);color:var(--access-text);font-family:var(--access-sans);-webkit-font-smoothing:antialiased}
body.has-modal{overflow:hidden}
.is-hidden{display:none !important}

.access-main{width:min(1140px,calc(100% - 28px));margin:0 auto;padding:34px 0 64px}
@media(min-width:900px){.access-main{padding:52px 0 78px}}

.access-eyebrow{display:flex;align-items:center;gap:10px;margin:0 0 10px;color:var(--access-gold);font-size:.7rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase}
.access-eyebrow::before{content:"";width:24px;height:1px;background:rgba(212,175,55,.48)}
.access-main h1{margin:0 0 10px;font-family:var(--access-serif);font-size:clamp(2rem,5vw,2.9rem);font-weight:600;line-height:1.06;letter-spacing:-.02em}
.access-lead-top{margin:0 0 22px;max-width:56ch;color:var(--access-muted);font-size:.95rem;line-height:1.6}

/* ---------- Karten ---------- */
.access-card{border:1px solid var(--access-border);border-radius:18px;background:linear-gradient(180deg,rgba(18,22,30,.96),rgba(13,16,23,.96));box-shadow:var(--access-shadow);padding:18px}
@media(min-width:600px){.access-card{padding:22px}}
.access-card+.access-card{margin-top:14px}
.access-card-title{display:flex;align-items:center;gap:9px;margin:0 0 12px;font-family:var(--access-sans);font-size:1rem;font-weight:700;letter-spacing:.01em}
.access-icon{flex:0 0 auto;width:20px;height:20px;color:var(--access-gold)}
.access-card-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:0 0 12px}
.access-card-head h2{display:flex;align-items:center;gap:9px;margin:0;font-family:var(--access-sans);font-size:1rem;font-weight:700}
.access-card-count{color:var(--access-faint);font-size:.8rem;white-space:nowrap}
.access-card-text{margin:6px 0 0;color:var(--access-muted);font-size:.88rem;line-height:1.55}
.access-meta{margin:8px 0 0;color:var(--access-faint);font-size:.8rem;line-height:1.5}
.access-fine{margin:10px 0 0;color:var(--access-faint);font-size:.76rem;line-height:1.5}
.access-sub-title{margin:0 0 6px;color:var(--access-text);font-size:.88rem;font-weight:700}

/* ---------- Statuspunkte ---------- */
.access-state{display:flex;align-items:center;gap:8px;margin:0;font-size:.92rem}
.access-state strong{font-weight:700}
.access-dot{flex:0 0 auto;width:9px;height:9px;border-radius:50%;background:var(--access-faint)}
.is-ok .access-dot,.access-dot.is-ok{background:var(--access-green);box-shadow:0 0 0 3px rgba(103,200,153,.16)}
.is-gold .access-dot,.access-dot.is-gold{background:var(--access-gold);box-shadow:0 0 0 3px rgba(212,175,55,.16)}
.access-dot.is-silver{background:linear-gradient(180deg,#e8ecf2,#aab3c0);box-shadow:0 0 0 3px rgba(200,209,221,.14)}
.is-warn .access-dot,.access-dot.is-warn{background:var(--access-orange);box-shadow:0 0 0 3px rgba(224,168,58,.16)}
.is-error .access-dot,.access-dot.is-error{background:var(--access-red);box-shadow:0 0 0 3px rgba(239,122,104,.16)}
.access-dot.is-busy{background:var(--access-gold-light);animation:accessPulse 1.1s ease-in-out infinite}
@keyframes accessPulse{0%,100%{opacity:.35}50%{opacity:1}}
@media(prefers-reduced-motion:reduce){.access-dot.is-busy{animation:none}}

/* ---------- Konto Statuskarte ---------- */
.access-statuscard{padding:6px 18px}
@media(min-width:600px){.access-statuscard{padding:8px 22px}}
.access-statuslist{list-style:none;margin:0;padding:0}
.access-statuslist>li{display:grid;grid-template-columns:minmax(0,1fr);gap:4px;padding:14px 0;border-bottom:1px solid var(--access-border-soft)}
.access-statuslist>li:last-child{border-bottom:0}
@media(min-width:560px){
  .access-statuslist>li{grid-template-columns:150px minmax(0,1fr) auto;align-items:center;gap:14px;padding:13px 0}
}
.access-statuslabel{color:var(--access-faint);font-size:.78rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.access-statusvalue{min-width:0;color:var(--access-text);font-size:.95rem;overflow-wrap:anywhere;word-break:break-word}
.access-statusvalue .access-state{font-size:.95rem}
.access-statusaside{color:var(--access-faint);font-size:.82rem}
.access-inline-link{justify-self:start;min-height:44px;display:inline-flex;align-items:center;color:var(--access-gold-light);font-size:.84rem;font-weight:600;text-decoration:none;border-bottom:1px solid rgba(212,175,55,.35)}
.access-inline-link:hover{color:var(--access-gold)}
@media(min-width:560px){.access-inline-link{justify-self:end}}

/* ---------- Raster ---------- */
.access-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;margin-top:14px}
@media(min-width:960px){.access-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start}}
.access-col{min-width:0}
.access-col>.access-card:first-child{margin-top:0}

.access-auth-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
@media(min-width:960px){.access-auth-grid{grid-template-columns:minmax(0,1fr) minmax(320px,380px);align-items:start;gap:22px}}
.access-column{min-width:0}
.access-side{min-width:0;display:grid;gap:14px}

/* ---------- Formular ---------- */
.access-mode-switch{display:grid;grid-template-columns:1fr 1fr;gap:4px;margin:0 0 18px;padding:4px;border:1px solid var(--access-border);border-radius:13px;background:#090c12}
.access-mode{min-height:44px;border:0;border-radius:9px;background:transparent;color:#919aa8;font:inherit;font-size:.85rem;font-weight:700;cursor:pointer}
.access-mode.is-active{background:rgba(212,175,55,.13);color:var(--access-gold-light);box-shadow:inset 0 0 0 1px rgba(212,175,55,.25)}
.access-step-label{margin:0 0 8px;color:var(--access-gold);font-size:.68rem;font-weight:700;letter-spacing:.17em;text-transform:uppercase}
.access-card h2.access-form-title{margin:0;font-family:var(--access-serif);font-size:1.55rem;font-weight:600;line-height:1.1}
.access-lead{margin:8px 0 16px;color:var(--access-muted);font-size:.9rem;line-height:1.55;overflow-wrap:anywhere}
.access-label{display:block;margin:12px 0 7px;color:#aeb6c3;font-size:.78rem;font-weight:500}
.access-email{display:block;width:100%;height:50px;border:1px solid rgba(255,255,255,.14);border-radius:12px;background:#090c12;color:var(--access-text);padding:0 14px;font:inherit;outline:none}
.access-email::placeholder{color:#636a75}
.access-email:focus{border-color:rgba(212,175,55,.58);box-shadow:0 0 0 3px rgba(212,175,55,.12)}
.access-codes{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;margin:16px 0 6px}
.access-code-input{width:100%;height:54px;min-width:0;border:1px solid rgba(255,255,255,.15);border-radius:11px;background:#080b10;color:#fff;text-align:center;font:700 1.3rem var(--access-sans);outline:none}
.access-code-input:focus{border-color:rgba(212,175,55,.62);box-shadow:0 0 0 3px rgba(212,175,55,.12)}
.access-email-echo{color:var(--access-text);font-weight:600}
.access-hint{margin:12px 0 0;color:var(--access-faint);font-size:.8rem;line-height:1.55}
.access-optin{margin:16px 0 4px;padding:14px;border:1px solid var(--access-border);border-radius:13px;background:rgba(255,255,255,.022)}
.access-optin-row{display:grid;grid-template-columns:auto minmax(0,1fr);gap:11px;align-items:start;cursor:pointer}
.access-optin-row input{width:20px;height:20px;margin:2px 0 0;accent-color:var(--access-gold);cursor:pointer}
.access-optin-row span{color:#b8c0cd;font-size:.85rem;line-height:1.5}
.access-optin-row strong{color:var(--access-text);font-weight:600}
.access-optin-note{margin:10px 0 0;color:var(--access-faint);font-size:.72rem;line-height:1.45}
.access-optin-note a{color:#b7a460}

/* ---------- Knoepfe ---------- */
.access-btn{width:100%;min-height:46px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:0 14px;border:1px solid rgba(212,175,55,.72);border-radius:12px;background:linear-gradient(180deg,#e3bf45,#d4af37);color:#131006;text-decoration:none;font:inherit;font-size:.87rem;font-weight:700;line-height:1.2;text-align:center;cursor:pointer}
.access-btn:hover{filter:brightness(1.04)}
.access-btn:disabled{opacity:.6;cursor:default;filter:none}
.access-btn--secondary{border-color:rgba(212,175,55,.5);background:rgba(212,175,55,.06);color:var(--access-gold-light)}
.access-btn--tertiary{border-color:var(--access-border);background:transparent;color:#c8d2e2}
.access-btn--danger{border-color:rgba(239,122,104,.45);background:rgba(239,122,104,.08);color:#f0a094}
.access-card-actions{display:grid;gap:8px;margin-top:14px}
@media(min-width:560px){.access-card-actions{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}}
.access-link-button{min-height:44px;border:0;padding:0;background:none;color:var(--access-gold-light);font:inherit;font-size:.84rem;text-align:left;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.access-link-button:disabled{opacity:.55;cursor:default}
:focus-visible{outline:2px solid var(--access-gold-light);outline-offset:2px;border-radius:6px}

/* ---------- Hinweise ---------- */
.access-notice-slot:empty{display:none}
.access-notice{margin-top:12px;padding:12px 13px;border:1px solid var(--access-border);border-left-width:3px;border-radius:11px;background:rgba(255,255,255,.028)}
.access-notice.is-ok{border-left-color:var(--access-green)}
.access-notice.is-info{border-left-color:var(--access-gold)}
.access-notice.is-warn{border-left-color:var(--access-orange)}
.access-notice.is-error{border-left-color:var(--access-red)}
.access-notice-title{margin:0;color:var(--access-text);font-size:.9rem;font-weight:700}
.access-notice-text{margin:6px 0 0;color:var(--access-muted);font-size:.85rem;line-height:1.55}
.access-notice-title+.access-notice-text{margin-top:5px}
.access-notice-actions{display:grid;gap:8px;margin-top:12px}
@media(min-width:520px){.access-notice-actions{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}}

/* ---------- Unterbereiche ---------- */
.access-subpanel{margin-top:14px;padding:13px;border:1px solid var(--access-border-soft);border-radius:12px;background:rgba(255,255,255,.02)}
.access-subpanel p{margin:0}
.access-subpanel .access-btn{margin-top:12px}

/* ---------- Konflikt ---------- */
.access-conflict{margin-top:14px;border-color:rgba(239,122,104,.45);background:linear-gradient(180deg,rgba(40,20,20,.7),rgba(16,14,18,.96))}
.access-conflict h2{display:flex;align-items:center;gap:9px;margin:0;font-family:var(--access-sans);font-size:1.05rem;font-weight:700;color:#f6b3a6}
.access-conflict h2 .access-icon{color:#f6b3a6}
.access-conflict>p{margin:8px 0 0;color:var(--access-muted);font-size:.88rem;line-height:1.55}
.access-conflict-scope{color:var(--access-text) !important;font-weight:600}
.access-conflict-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;margin-top:14px}
@media(min-width:820px){.access-conflict-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.access-conflict-card{min-width:0;padding:14px;border:1px solid var(--access-border);border-radius:13px;background:rgba(10,12,17,.72)}
.access-conflict-card h3{margin:0 0 6px;font-family:var(--access-sans);font-size:.95rem;font-weight:700}
.access-conflict-card p{margin:0;color:var(--access-muted);font-size:.85rem;line-height:1.5}
.access-conflict-facts{margin-top:11px;padding:10px 11px;border:1px solid var(--access-border-soft);border-radius:10px;background:rgba(255,255,255,.026);display:grid;gap:6px}
.access-conflict-fact{display:grid;grid-template-columns:minmax(0,1fr);gap:1px;font-size:.83rem;line-height:1.45}
@media(min-width:420px){.access-conflict-fact{grid-template-columns:132px minmax(0,1fr);gap:10px;align-items:baseline}}
.access-conflict-fact-label{color:var(--access-faint);font-size:.75rem;letter-spacing:.04em;text-transform:uppercase}
.access-conflict-fact.is-strong strong{color:var(--access-text);font-size:.92rem;font-weight:700;overflow-wrap:anywhere}
.access-conflict-fact span:last-child{color:var(--access-muted);overflow-wrap:anywhere}
.access-conflict-card .access-btn{margin-top:12px}

/* ---------- Geraete ---------- */
.access-device-list{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.access-device{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;padding:12px;border:1px solid var(--access-border-soft);border-radius:12px;background:rgba(255,255,255,.02)}
@media(min-width:520px){.access-device{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px}}
.access-device-name{margin:0;font-size:.9rem;font-weight:600;overflow-wrap:anywhere}
.access-device-current{margin-left:8px;padding:3px 8px;border-radius:999px;background:rgba(103,200,153,.14);color:var(--access-green);font-size:.68rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;white-space:nowrap}
.access-device-meta{margin:4px 0 0;color:var(--access-faint);font-size:.79rem}
.access-device-btn{min-height:44px;padding:0 14px;border:1px solid var(--access-border);border-radius:10px;background:transparent;color:#c8d2e2;font:inherit;font-size:.82rem;cursor:pointer;white-space:nowrap}
.access-device-btn:hover{border-color:rgba(255,255,255,.24)}
.access-device-btn:disabled{opacity:.55;cursor:default}

/* ---------- Aktionen und Hilfe ---------- */
.access-actions-card{display:grid;gap:10px;margin-top:14px}
@media(min-width:560px){.access-actions-card{grid-template-columns:repeat(2,minmax(0,1fr))}}
.access-actions-card .access-btn{margin:0}
.access-help{margin-top:14px;border:1px solid var(--access-border);border-radius:16px;background:rgba(255,255,255,.02)}
.access-help>summary{list-style:none;min-height:52px;display:flex;align-items:center;gap:10px;padding:14px 16px;color:var(--access-text);font-size:.9rem;font-weight:600;cursor:pointer}
.access-help>summary::-webkit-details-marker{display:none}
.access-help>summary::after{content:"+";margin-left:auto;color:var(--access-faint);font-size:1.1rem}
.access-help[open]>summary::after{content:"-"}
.access-help-body{padding:0 16px 16px}
.access-help-body>p{margin:0 0 12px;color:var(--access-muted);font-size:.86rem;line-height:1.55}
.access-diagblock{margin-top:16px;padding-top:14px;border-top:1px solid var(--access-border-soft)}
.access-diag-head{margin:0;font-size:.88rem;font-weight:700}
.access-diag-note{margin:5px 0 10px;color:var(--access-faint);font-size:.78rem}
.access-diag-list{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.access-diag-list li{display:grid;grid-template-columns:minmax(0,1fr);gap:2px;color:var(--access-muted);font-size:.8rem}
@media(min-width:520px){.access-diag-list li{grid-template-columns:200px minmax(0,1fr);gap:10px}}
.access-diag-list span:first-child{color:var(--access-faint)}
.access-diag-list span:last-child{overflow-wrap:anywhere}

/* ---------- Nutzen, Plus, Grafik ---------- */
.access-reasons,.access-plus{border:1px solid var(--access-border);border-radius:18px;background:rgba(255,255,255,.022);padding:18px}
.access-reasons h2,.access-plus h2{margin:0 0 10px;font-family:var(--access-sans);font-size:.98rem;font-weight:700;line-height:1.35}
.access-reasons ul,.access-plus-list{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.access-reasons li,.access-plus-list li{position:relative;padding-left:20px;color:var(--access-muted);font-size:.86rem;line-height:1.5}
.access-reasons li::before,.access-plus-list li::before{content:"";position:absolute;left:0;top:.55em;width:7px;height:7px;border-radius:50%;background:rgba(212,175,55,.7)}
.access-plus{border-color:rgba(212,175,55,.28);background:rgba(212,175,55,.045)}
.access-plus-eyebrow{margin:0 0 8px;color:var(--access-gold);font-size:.68rem;font-weight:700;letter-spacing:.17em;text-transform:uppercase}
.access-plus .access-btn{margin-top:14px}
.access-figure{margin:0;border:1px solid var(--access-border);border-radius:18px;background:rgba(255,255,255,.022);padding:12px}
.access-figure-btn{position:relative;display:block;width:100%;padding:0;border:0;border-radius:12px;background:none;cursor:zoom-in}
.access-figure-zoom{position:absolute;right:9px;bottom:9px;display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:0 11px;border:1px solid rgba(212,175,55,.55);border-radius:999px;background:rgba(8,10,15,.82);color:var(--access-gold-light);font-size:.76rem;font-weight:600;backdrop-filter:blur(2px)}
.access-figure-zoom-icon{width:15px;height:15px;flex:0 0 auto}
.access-figure-btn:hover .access-figure-zoom{border-color:var(--access-gold);color:#fff}
.access-link-button--zoom{display:inline-flex;align-items:center;gap:7px;text-decoration:none;border-bottom:1px solid rgba(212,175,55,.4)}
.access-figure-btn img{display:block;width:100%;height:auto;border-radius:12px}
.access-figure figcaption{margin-top:9px;color:var(--access-faint);font-size:.76rem;line-height:1.45}
.access-figure-link{margin:14px 0 0}

/* ---------- Dialog ---------- */
/* Die gemeinsamen Leisten sind sticky und liegen sehr hoch im Stapel. Ein
   Dialog darunter wird oben angeschnitten, deshalb liegt er ausdruecklich
   darueber. */
.access-modal{position:fixed;inset:0;z-index:1000600;display:flex;align-items:flex-end;justify-content:center;padding:0}
@media(min-width:640px){.access-modal{align-items:center;padding:24px}}
.access-modal-backdrop{position:absolute;inset:0;background:rgba(4,5,8,.72);backdrop-filter:blur(2px)}
.access-modal-card{position:relative;width:min(560px,100%);max-height:92vh;overflow:auto;border:1px solid var(--access-border);border-radius:18px 18px 0 0;background:linear-gradient(180deg,#161a22,#0e1118);box-shadow:var(--access-shadow);padding:20px}
@media(min-width:640px){.access-modal-card{border-radius:18px}}
.access-modal-card:focus{outline:none}
.access-modal-card h2{margin:0 0 10px;font-family:var(--access-sans);font-size:1.05rem;font-weight:700}
.access-modal-text p{margin:0 0 8px;color:var(--access-muted);font-size:.88rem;line-height:1.55}
.access-modal-text p:last-child{margin-bottom:0}
.access-modal-actions{display:grid;gap:8px;margin-top:16px}
@media(min-width:520px){.access-modal-actions{grid-template-columns:repeat(2,minmax(0,1fr))}}
.access-modal-actions .access-btn{margin:0}
.access-figure-modal{align-items:center;padding:16px}
@media(min-width:900px){.access-figure-modal{padding:40px 24px}}
/* Rund zehn Prozent schmaler als zuvor, damit die Grafik vollstaendig und ohne
   Ueberdeckung durch die Leisten sichtbar bleibt. */
.access-figure-modal .access-modal-card{width:min(1080px,100%);max-height:calc(100vh - 80px);border-radius:18px;padding:14px}
.access-figure-modal img{display:block;width:100%;height:auto;border-radius:12px}
.access-figure-close{margin-top:12px}