/**
 * VOLTIGMA
 * Entwickler : Sven Helle
 * Webseite   : https://sven-helle.de
 * Projekt    : VOLTIGMA
 * Datei      : user.css
 * Version    : V3.0
 * Stand      : 26.09.2026
 *
 * Datei: public/assets/css/user.css
 * Aufgabe: Layout und Design des Benutzerbereichs und Nachrichtensystems.
 * Weblink: sven-helle.de
 * Author: Sven Helle
 * Copyright: © 2026 Sven Helle
 */
*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at top,#123264,#03101f 65%);color:#eef7ff;font-family:system-ui,Arial,sans-serif}main{width:min(1100px,94vw);margin:35px auto}h1{font-size:clamp(2rem,6vw,4rem)}section{background:#0b2246dd;border:1px solid #5bd9ff55;border-radius:20px;padding:22px;margin:18px 0;box-shadow:0 18px 50px #0008}.grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}label{display:block;font-weight:700;margin:12px 0}input,textarea,select,button{width:100%;padding:12px;border-radius:10px;border:1px solid #5592c9;background:#06152d;color:#fff;font:inherit}textarea{min-height:120px}button{background:#1769c9;font-weight:900;cursor:pointer}.danger{background:#9d2432}.captcha{width:280px;max-width:100%;height:90px;border-radius:12px;border:1px solid #4db4e7;display:block;margin:10px 0}.msg,.toast{padding:13px 16px;border-radius:12px}.ok{background:#126b4c}.err{background:#8b2632}.toast{position:fixed;right:20px;top:20px;background:#1769c9;box-shadow:0 10px 35px #0009}article{border-bottom:1px solid #ffffff22;padding:12px 0}a{color:#6feaff}@media(max-width:760px){.grid{grid-template-columns:1fr}}
.account-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:20px}.account-head h1{margin-bottom:0}.account-head p{opacity:.65;margin-top:4px}.back,.buttonlink{display:inline-block;color:#fff;text-decoration:none;border:1px solid #4d78bd;background:#10285a;padding:10px 15px;border-radius:12px}.warning{border-color:#f4b23d;background:rgba(112,65,5,.45)}.warning h2{color:#ffd36b}.dangerzone{border-color:#b84652}dl{display:grid;grid-template-columns:130px 1fr;gap:8px 12px}dt{opacity:.65}dd{margin:0;font-weight:700}.logout{margin-top:18px}.hint{font-size:.9rem;opacity:.7}@media(max-width:650px){.account-head{align-items:flex-start;flex-direction:column}dl{grid-template-columns:1fr}dd{margin-bottom:8px}}

.profile-card{display:flex;gap:20px;align-items:center}.avatar{width:100px;height:100px;object-fit:cover;border-radius:22px;border:1px solid #6da7ff;box-shadow:0 10px 35px #0008}.avatar.placeholder{display:grid;place-items:center;font-size:42px;background:#0a1d43}.private-badge{font-size:.72rem;padding:3px 7px;border-radius:999px;background:#27375c;color:#c7d4eb}.check{display:flex;gap:9px;align-items:center;font-weight:500}.check input{width:auto}select{width:100%;padding:12px 14px;border-radius:12px;border:1px solid #5f83c5;background:#071633;color:#fff;font:inherit}

.account-resend-note{margin:14px 0;padding:12px 14px;border:1px solid rgba(91,177,255,.38);border-radius:10px;background:rgba(18,55,96,.24)}
.account-resend-note>strong,.account-resend-note>span{display:block;margin-bottom:6px}
.account-resend-note form{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:10px}
.account-resend-note img{height:42px;width:auto;border-radius:6px}
.account-resend-note input{min-height:38px}

/* Spielerbereich V2 */
.account-top{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:0 0 22px;padding:12px 16px;border:1px solid rgba(99,160,230,.24);border-radius:12px;background:rgba(5,15,35,.72)}
.account-brand{display:flex;flex-direction:column}.account-brand a{text-decoration:none;color:inherit;font-size:18px;font-weight:800}.account-brand a strong{letter-spacing:.08em}.account-brand span{font-size:9px;letter-spacing:.2em;opacity:.6}
.account-main-nav{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.account-main-nav a{padding:8px 10px;border-radius:7px;text-decoration:none;font-size:11px;font-weight:800;color:#dcecff}.account-main-nav a:hover{background:rgba(77,151,230,.16)}
.user-app{display:grid;grid-template-columns:220px minmax(0,1fr);gap:18px;align-items:start}
.user-sidebar{position:sticky;top:12px;padding:10px;border:1px solid rgba(99,160,230,.22);border-radius:12px;background:rgba(5,15,35,.68)}
.user-sidebar-title{padding:8px 10px 12px;font-size:10px;font-weight:900;letter-spacing:.18em;opacity:.55}
.user-sidebar>a{display:flex;flex-direction:column;gap:2px;margin:2px 0;padding:10px;border-radius:8px;color:#dcecff;text-decoration:none;font-weight:800}.user-sidebar>a small{font-size:9px;font-weight:500;opacity:.55}.user-sidebar>a:hover,.user-sidebar>a.active{background:rgba(71,151,236,.18)}.user-sidebar>a.danger-nav{color:#ff9d9d}
.sidebar-logout{margin:9px 0 0;padding-top:9px;border-top:1px solid rgba(255,255,255,.08)}.sidebar-logout button{width:100%}
.user-content{min-width:0}.account-welcome{padding:22px}.account-welcome h2{margin:.2em 0}.eyebrow{font-size:10px;font-weight:900;letter-spacing:.2em;opacity:.55}
.account-dashboard{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:12px}.dash-card{display:flex;flex-direction:column;gap:7px;padding:18px;border:1px solid rgba(99,160,230,.22);border-radius:11px;background:rgba(7,22,49,.6);text-decoration:none;color:#dcecff}.dash-card strong{font-size:17px}.dash-card span{font-size:12px;opacity:.68}.dash-card:hover{border-color:rgba(99,180,255,.55);transform:translateY(-1px)}
@media(max-width:760px){.account-top{align-items:flex-start;flex-direction:column}.user-app{grid-template-columns:1fr}.user-sidebar{position:static;display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.user-sidebar-title{grid-column:1/-1}.account-dashboard{grid-template-columns:1fr}}

.profile-return{padding:5px 12px!important;letter-spacing:.06em}

.login-key-btn{width:34px;height:34px;min-width:34px;display:inline-flex;align-items:center;justify-content:center;border-radius:7px;border:1px solid;text-decoration:none;font-size:17px;line-height:1;box-sizing:border-box}.login-key-btn.is-logged-in{background:rgba(38,166,91,.18);border-color:rgba(73,226,137,.72);box-shadow:0 0 10px rgba(54,220,126,.22)}.login-key-btn.is-logged-out{background:rgba(190,55,55,.16);border-color:rgba(255,91,91,.65)}
.logout-modal[hidden]{display:none}.logout-modal{position:fixed;inset:0;z-index:99999;display:grid;place-items:center}.logout-modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.72);backdrop-filter:blur(3px)}.logout-modal-box{position:relative;z-index:1;width:min(390px,calc(100vw - 32px));padding:24px;text-align:center;border:1px solid rgba(108,174,245,.38);border-radius:14px;background:#08152b;box-shadow:0 22px 70px rgba(0,0,0,.55)}.logout-modal-box h2{margin:8px 0}.logout-modal-box p{opacity:.72}.logout-key{font-size:28px}.logout-modal-actions{display:flex;justify-content:center;gap:10px;margin-top:20px;flex-wrap:wrap}.logout-no,.logout-yes{min-width:145px}.logout-yes{border-color:rgba(255,91,91,.6)!important}.modal-open{overflow:hidden}

.history-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:12px 0}.history-summary>div{padding:14px;border:1px solid rgba(99,160,230,.2);border-radius:10px;background:rgba(7,22,49,.58)}.history-summary span{display:block;font-size:10px;letter-spacing:.08em;opacity:.58;text-transform:uppercase}.history-summary strong{display:block;margin-top:7px;font-size:17px}.history-table-wrap{overflow-x:auto}.history-table{width:100%;border-collapse:collapse;min-width:620px}.history-table th,.history-table td{padding:11px 10px;text-align:left;border-bottom:1px solid rgba(255,255,255,.07);font-size:12px}.history-table th{font-size:10px;letter-spacing:.08em;opacity:.58}.history-yes{font-weight:900}.history-no{opacity:.48}.history-empty{padding:18px;border:1px dashed rgba(99,160,230,.25);border-radius:9px;opacity:.65}@media(max-width:760px){.history-summary{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Scrollbarer persönlicher Spielverlauf */
.history-table-wrap{max-height:430px;overflow:auto;border:1px solid rgba(99,160,230,.16);border-radius:9px}.history-table thead th{position:sticky;top:0;z-index:2;background:#0a1730}.history-table tbody tr:hover{background:rgba(80,150,230,.06)}

/* Verifizierte Team-/Admin-Markierungen */
.staff-badge{display:inline-flex;align-items:center;vertical-align:middle;margin-left:7px;padding:4px 7px;border-radius:5px;font-size:9px;font-weight:900;letter-spacing:.08em;line-height:1;border:1px solid;white-space:nowrap}
.staff-badge.admin{background:rgba(45,133,224,.16);border-color:rgba(79,166,255,.72);color:#8fc8ff;box-shadow:0 0 9px rgba(58,151,245,.14)}
.staff-badge.superadmin{background:rgba(163,84,255,.17);border-color:rgba(190,121,255,.75);color:#d3a8ff;box-shadow:0 0 10px rgba(163,84,255,.18)}
.staff-badge.developer{background:rgba(43,190,142,.14);border-color:rgba(74,220,172,.62);color:#83e5c5}

.message-tabs{display:flex;gap:8px;margin:10px 0 18px}.message-tabs a{padding:9px 13px;border:1px solid rgba(99,160,230,.28);border-radius:7px;text-decoration:none}.message-card{padding:14px;margin:9px 0;border:1px solid rgba(99,160,230,.16);border-radius:9px}.message-state{font-size:11px;opacity:.65;margin:7px 0}

/* Messages V3 – Mail UI */
.mail-app{max-width:1180px}.mail-head{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:18px}.mail-head h1{margin:3px 0}.mail-head p{margin:0;opacity:.62}.compose-open,.send-btn{border:1px solid rgba(120,98,255,.75);background:linear-gradient(135deg,#6747e8,#923cdd);color:#fff;border-radius:9px;padding:11px 15px;font-weight:900;box-shadow:0 8px 25px rgba(95,55,210,.22);cursor:pointer}.mail-layout{display:grid;grid-template-columns:190px 1fr;min-height:520px;border:1px solid rgba(125,153,205,.18);border-radius:14px;overflow:hidden;background:rgba(8,13,26,.55)}.mail-folders{padding:14px 9px;border-right:1px solid rgba(125,153,205,.14);background:rgba(4,8,18,.52)}.folder{width:100%;display:grid;grid-template-columns:25px 1fr auto;align-items:center;text-align:left;gap:7px;padding:11px 9px;border:0;border-radius:8px;background:transparent;color:inherit;cursor:pointer}.folder b{font-size:10px;opacity:.55}.folder.active{background:rgba(111,73,225,.18);color:#c6b5ff}.mail-list-pane{min-width:0}.mail-pane{display:none}.mail-pane.active{display:block}.mail-list-title{padding:14px 17px;font-size:11px;font-weight:900;letter-spacing:.1em;border-bottom:1px solid rgba(125,153,205,.14)}.mail-list-title span{font-weight:500;letter-spacing:0;opacity:.45;margin-left:8px}.mail-row{display:grid;grid-template-columns:40px 1fr 36px;gap:11px;padding:14px 16px;border-bottom:1px solid rgba(125,153,205,.1);transition:.16s}.mail-row:hover{background:rgba(119,92,216,.07)}.mail-avatar{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#41327e,#7154c9);font-weight:900}.mail-avatar.sent{font-size:13px}.mail-main{min-width:0}.mail-meta{display:flex;align-items:center;gap:7px}.mail-meta time{margin-left:auto;font-size:10px;opacity:.45}.mail-preview{font-size:13px;margin-top:6px;line-height:1.55;word-break:break-word}.read-state{margin-top:7px;font-size:10px;font-weight:800}.read-state.unread{opacity:.55}.read-state.read{color:#71d9a9}.mail-delete{align-self:center}.icon-danger{border:0;background:transparent;color:#d97f91;font-size:18px;cursor:pointer}.mail-empty{padding:45px;text-align:center;opacity:.45}.compose-dialog{width:min(720px,calc(100vw - 30px));padding:0;border:1px solid rgba(125,112,229,.38);border-radius:15px;background:#123052;color:#edf1ff;box-shadow:0 30px 100px rgba(0,0,0,.7)}.compose-dialog::backdrop{background:rgba(0,0,0,.72);backdrop-filter:blur(4px)}.compose-dialog form{margin:0}.compose-title{display:flex;justify-content:space-between;align-items:center;padding:14px 17px;border-bottom:1px solid rgba(125,153,205,.14)}.compose-title b,.compose-title small{display:block}.compose-title small{opacity:.45;margin-top:2px}.compose-title>button{border:0;background:none;color:#fff;font-size:25px;cursor:pointer}.recipient-wrap{position:relative;display:grid;grid-template-columns:45px 1fr;align-items:center;padding:9px 15px;border-bottom:1px solid rgba(125,153,205,.14)}.recipient-wrap label{font-size:11px;opacity:.55}.recipient-wrap input{border:0!important;background:transparent!important;box-shadow:none!important}.user-suggestions{position:absolute;left:55px;right:15px;top:51px;z-index:10;background:#11182b;border:1px solid rgba(125,153,205,.25);border-radius:9px;box-shadow:0 15px 45px rgba(0,0,0,.5);overflow:hidden}.suggest-user{display:grid;grid-template-columns:32px 1fr auto;align-items:center;gap:9px;width:100%;padding:9px 11px;border:0;border-bottom:1px solid rgba(255,255,255,.05);background:transparent;color:#fff;text-align:left;cursor:pointer}.suggest-user:hover{background:rgba(114,84,222,.16)}.suggest-avatar{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#4c3a91}.suggest-user small{color:#c9adff;font-size:8px}.editor-toolbar{display:flex;align-items:center;gap:5px;padding:7px 14px;border-bottom:1px solid rgba(125,153,205,.12)}.editor-toolbar button,.emoji-picker button{border:0;background:rgba(255,255,255,.05);color:#e8ecff;border-radius:5px;min-width:31px;height:29px;cursor:pointer}.editor-toolbar span{width:1px;height:20px;background:rgba(255,255,255,.12);margin:0 3px}.emoji-picker{padding:8px 14px;display:flex;flex-wrap:wrap;gap:4px;border-bottom:1px solid rgba(125,153,205,.12)}.emoji-picker[hidden]{display:none}.emoji-picker button{font-size:17px}.compose-dialog textarea{width:100%;min-height:240px;resize:vertical;border:0!important;border-radius:0!important;background:#123052!important;padding:17px!important;box-sizing:border-box;outline:0}.compose-foot{display:flex;align-items:center;gap:9px;padding:11px 14px;border-top:1px solid rgba(125,153,205,.12)}.compose-foot>span{margin-right:auto;font-size:10px;opacity:.45}.compose-foot .secondary{background:transparent;border:1px solid rgba(255,255,255,.15);color:#ddd;padding:9px 12px;border-radius:7px;cursor:pointer}@media(max-width:760px){.mail-layout{grid-template-columns:1fr}.mail-folders{display:flex;border-right:0;border-bottom:1px solid rgba(125,153,205,.14)}.folder{grid-template-columns:auto auto auto;justify-content:center}.mail-head{align-items:flex-start;flex-direction:column}.mail-row{grid-template-columns:35px 1fr 28px}.mail-meta{flex-wrap:wrap}.mail-meta time{width:100%;margin-left:0}}

.mail-row{grid-template-columns:40px 1fr 36px 36px}.mail-block{align-self:center}.icon-block{border:0;background:transparent;color:#e4aa5e;font-size:18px;cursor:pointer}.blocked-user{grid-template-columns:40px 1fr auto}.blocked-user .secondary{white-space:nowrap}

/* PM V3.2 */
.mail-click{text-decoration:none;color:inherit;grid-template-columns:40px 1fr 24px}.mail-click.is-unread{background:rgba(113,78,220,.10);box-shadow:inset 3px 0 #8666ff}.mail-click.is-unread strong{color:#d8ceff}.mail-chevron{font-size:28px;opacity:.28;align-self:center}.rich-editor{min-height:230px;padding:17px;outline:0;line-height:1.6;overflow:auto}.rich-editor:empty:before{content:attr(data-placeholder);opacity:.35;pointer-events:none}.emoji-picker{display:grid!important;grid-template-columns:repeat(8,34px);gap:5px;max-height:165px;overflow:auto;padding:10px 14px}.emoji-picker[hidden]{display:none!important}.emoji-picker button{width:34px;height:34px;font-size:19px;transition:.15s}.emoji-picker button:hover{transform:translateY(-2px) scale(1.12);background:rgba(128,91,235,.2)}.reader-dialog{width:min(760px,calc(100vw - 28px));border:1px solid rgba(125,112,229,.38);border-radius:15px;background:#123052;color:#edf1ff;padding:0;box-shadow:0 30px 100px #000b}.reader-dialog::backdrop{background:#000a;backdrop-filter:blur(4px)}.reader-head{display:flex;justify-content:space-between;padding:20px 22px;border-bottom:1px solid rgba(255,255,255,.09)}.reader-head h2{margin:4px 0}.reader-head small,.reader-head time{opacity:.48}.dialog-x{font-size:29px;color:#fff;text-decoration:none}.reader-body{padding:28px 24px;min-height:190px;line-height:1.75;font-size:15px}.reader-actions{display:flex;gap:9px;padding:14px 20px;border-top:1px solid rgba(255,255,255,.09)}.reader-actions form:last-child{margin-left:auto}.reply-btn{background:linear-gradient(135deg,#6747e8,#923cdd);border:0;color:#fff;border-radius:8px;padding:10px 14px;font-weight:900}.danger{background:#54202c;border:1px solid #9c4055;color:#ffdce4;border-radius:8px;padding:9px 12px}.mail-pop{animation:mailPop .5s ease}@keyframes mailPop{0%{transform:translateY(20px);opacity:0}60%{transform:translateY(-4px)}100%{transform:none;opacity:1}}@media(max-width:520px){.emoji-picker{grid-template-columns:repeat(6,34px)}}

/* PM V3.2.2 – Schnell löschen */
.mail-click{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 42px;padding:0!important}
.mail-open-hit{display:grid;grid-template-columns:40px minmax(0,1fr) 24px;gap:11px;align-items:start;padding:14px 10px 14px 16px;color:inherit;text-decoration:none;min-width:0}
.quick-delete{display:grid;place-items:center;border-left:1px solid rgba(125,153,205,.08)}
.quick-delete button{width:32px;height:32px;border:1px solid transparent;border-radius:8px;background:transparent;color:#b87987;font-size:19px;cursor:pointer;transition:.15s}
.quick-delete button:hover{color:#ffd7df;background:rgba(172,58,83,.18);border-color:rgba(211,81,109,.35);transform:scale(1.06)}
.mail-click:hover .quick-delete button{opacity:1}
@media(pointer:fine){.quick-delete button{opacity:.55}}

.report-dialog{width:min(620px,calc(100vw - 28px));padding:0;border:1px solid rgba(222,111,133,.32);border-radius:15px;background:#123052;color:#edf1ff;box-shadow:0 30px 100px #000b}.report-dialog::backdrop{background:#000a;backdrop-filter:blur(4px)}.report-body{padding:18px}.report-body p{font-size:13px;line-height:1.55;opacity:.7}.report-body label{display:block;font-size:11px;font-weight:900;margin:15px 0 6px}.report-body textarea{width:100%;min-height:150px;box-sizing:border-box;resize:vertical}.report-body>small{display:block;text-align:right;opacity:.45;margin-top:5px}

/* V3.4 – Profilverlinkung und Gastschutz */
.user-profile-link{color:inherit;text-decoration:none;border-bottom:1px dotted rgba(179,157,255,.45);transition:.15s}
.user-profile-link:hover{color:#cdbdff;border-bottom-color:#9b78ff;text-shadow:0 0 14px rgba(143,101,255,.35)}
.profile-guest-gate{min-height:100vh;display:grid;place-items:center;padding:24px;box-sizing:border-box;background:radial-gradient(circle at 50% 30%,rgba(91,59,171,.16),transparent 45%)}
.profile-guest-gate section{width:min(650px,100%);padding:42px 34px;text-align:center;border:1px solid rgba(128,108,218,.3);border-radius:18px;background:rgba(8,13,26,.88);box-shadow:0 28px 80px rgba(0,0,0,.45)}
.profile-guest-gate .gate-icon{font-size:38px;margin-bottom:12px}.profile-guest-gate h1{font-size:clamp(22px,4vw,34px);margin:8px 0 12px}.profile-guest-gate p{opacity:.68;line-height:1.6;max-width:520px;margin:0 auto 24px}.gate-actions{display:flex;justify-content:center;flex-wrap:wrap;gap:9px}.gate-actions a{text-decoration:none}

/* PM V3.5 – Mehrfachauswahl + Papierkorb */
.bulk-head{display:flex;align-items:center;gap:12px}.bulk-head>span{margin-right:auto}.bulk-head label{font-size:10px;letter-spacing:0;display:flex;align-items:center;gap:5px}.bulk-delete{border:1px solid rgba(205,88,111,.35);background:rgba(126,37,55,.18);color:#ffd9e1;border-radius:7px;padding:7px 9px;font-size:10px;font-weight:900;cursor:pointer}.bulk-delete:disabled{opacity:.3;cursor:not-allowed}.has-select{grid-template-columns:34px minmax(0,1fr)!important}.mail-select{display:grid;place-items:center;border-right:1px solid rgba(125,153,205,.08);cursor:pointer}.mail-select input,.bulk-head input{accent-color:#8968ef;width:16px;height:16px}.mail-row-inner{display:grid;grid-template-columns:minmax(0,1fr) 42px;min-width:0}.trash-row{display:grid;grid-template-columns:40px 1fr auto;gap:11px;align-items:center;padding:14px 16px;border-bottom:1px solid rgba(125,153,205,.1)}.trash-row form{margin:0}@media(max-width:700px){.bulk-head{flex-wrap:wrap}.bulk-head>span{width:100%;order:2}.trash-row{grid-template-columns:36px 1fr}.trash-row form{grid-column:2}}

/* PM V3.5.1 – Layout-Reparatur */
.bulk-mail-row{display:grid!important;grid-template-columns:38px minmax(0,1fr) 38px 38px!important;align-items:stretch;padding:0!important;min-height:78px}
.bulk-mail-row .mail-select{display:grid;place-items:center;border-right:1px solid rgba(125,153,205,.08)}
.bulk-mail-row .mail-open-hit{display:grid!important;grid-template-columns:42px minmax(0,1fr) 22px!important;gap:12px;align-items:center;padding:13px 14px!important;min-width:0;width:auto!important;box-sizing:border-box}
.bulk-mail-row .mail-main{min-width:0;overflow:hidden}
.bulk-mail-row .mail-meta{display:flex!important;align-items:center;gap:8px;min-width:0}
.bulk-mail-row .mail-meta strong{min-width:0;max-width:55%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bulk-mail-row .mail-meta time{margin-left:auto;white-space:nowrap}
.bulk-mail-row .mail-preview{display:block!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;max-width:100%!important;margin-top:5px}
.profile-jump,.quick-delete-button{display:grid;place-items:center;align-self:stretch;border:0;border-left:1px solid rgba(125,153,205,.08);background:transparent;color:#9ba9c9;text-decoration:none;cursor:pointer;font-size:18px;transition:.15s}
.profile-jump:hover{background:rgba(113,83,208,.15);color:#d7ccff}.quick-delete-button:hover{background:rgba(172,58,83,.17);color:#ffd4dc}
.bulk-head{min-height:48px;box-sizing:border-box}
.bulk-head strong{white-space:nowrap}
@media(max-width:760px){.bulk-mail-row{grid-template-columns:34px minmax(0,1fr) 34px!important}.profile-jump{display:none}.bulk-mail-row .mail-open-hit{grid-template-columns:36px minmax(0,1fr) 16px!important;padding:10px!important}.bulk-mail-row .mail-meta time{display:none}.bulk-mail-row .mail-meta strong{max-width:100%}}

/* PM V3.6 – echte Live-Zustellung */
.live-new{animation:pmLiveIn .45s ease-out}
@keyframes pmLiveIn{from{opacity:0;transform:translateY(-10px);background:rgba(120,87,225,.25)}to{opacity:1;transform:none}}

/* PM V3.6.1 – Reader als echtes Top-Layer-Popup */
.reader-dialog{position:fixed!important;inset:0!important;margin:auto!important;width:min(760px,calc(100vw - 36px))!important;max-width:760px!important;max-height:min(78vh,760px)!important;z-index:2147483647!important;border:1px solid rgba(137,104,239,.55)!important;border-radius:18px!important;background:#123052!important;color:#edf2ff!important;box-shadow:0 35px 130px rgba(0,0,0,.82),0 0 0 1px rgba(137,104,239,.12)!important;overflow:hidden!important;padding:0!important}
.reader-dialog::backdrop{background:rgba(1,5,14,.82)!important;backdrop-filter:blur(8px)!important;-webkit-backdrop-filter:blur(8px)!important}
.reader-dialog[open]{display:flex!important;flex-direction:column!important;animation:readerPop .2s ease-out}
.reader-dialog .reader-head{flex:0 0 auto}.reader-dialog .reader-body{flex:1 1 auto;overflow:auto;min-height:180px;max-height:none!important}.reader-dialog .reader-actions{flex:0 0 auto}
@keyframes readerPop{from{opacity:0;transform:scale(.965) translateY(10px)}to{opacity:1;transform:none}}
@media(max-width:650px){.reader-dialog{width:calc(100vw - 18px)!important;max-height:88vh!important;border-radius:14px!important}}

/* Profile V3.7 – Info + Geschlecht */
.gender-icon{display:inline-grid;place-items:center;width:25px;height:25px;margin-left:6px;border-radius:50%;font-size:17px;font-weight:900;vertical-align:middle;border:1px solid rgba(180,190,220,.25);background:rgba(255,255,255,.045)}.gender-icon.male{color:#77b8ff}.gender-icon.female{color:#ff91c7}.gender-icon.diverse{color:#d2a6ff}
.profile-about{margin-top:14px;padding:20px 22px;border:1px solid rgba(125,153,205,.16);border-radius:14px;background:rgba(11,17,33,.65)}.profile-info-text{margin-top:8px;line-height:1.65;white-space:normal;overflow-wrap:anywhere}.profile-editor-toolbar{display:flex;gap:5px;padding:7px;border:1px solid rgba(125,153,205,.2);border-bottom:0;border-radius:9px 9px 0 0;background:rgba(0,0,0,.16)}.profile-editor-toolbar button{width:34px;height:30px;padding:0;border:1px solid rgba(125,153,205,.2);border-radius:6px;background:rgba(255,255,255,.035);color:#e7ebfa;cursor:pointer}.profile-editor-toolbar button:hover{background:rgba(137,104,239,.18)}.profile-info-editor{min-height:145px;max-height:320px;overflow:auto;padding:12px;border:1px solid rgba(125,153,205,.2);border-radius:0 0 9px 9px;background:rgba(0,0,0,.12);line-height:1.55;outline:none}.profile-info-editor:focus{border-color:rgba(137,104,239,.6);box-shadow:0 0 0 2px rgba(137,104,239,.08)}

/* Profile V3.11 */
.profile-details{margin-top:14px;padding:20px 22px;border:1px solid rgba(125,153,205,.16);border-radius:14px;background:rgba(11,17,33,.65)}.profile-detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 18px;margin-top:10px}.profile-detail-grid>div{padding:10px 12px;border:1px solid rgba(125,153,205,.11);border-radius:9px;background:rgba(255,255,255,.018)}.profile-detail-grid span{display:block;color:#8592ad;font-size:11px;text-transform:uppercase;letter-spacing:.05em}.profile-detail-grid strong{display:block;margin-top:4px;color:#edf2ff}.profile-secret{color:#b49cff!important;font-style:italic}.profile-empty{color:#758097!important;font-style:italic;text-transform:none!important;letter-spacing:0!important}.profile-about{display:block}.profile-info-text .profile-secret,.profile-info-text .profile-empty{display:inline}@media(max-width:700px){.profile-detail-grid{grid-template-columns:1fr}}


/* ===== PROFILE V3.12.1: exact layout repair ===== */
body.profile-page main{
 width:min(1380px,96vw)!important;
 max-width:1380px!important;
 margin:24px auto!important;
 padding:0!important;
}
body.profile-page .user-app{
 display:grid!important;
 grid-template-columns:220px minmax(0,1fr)!important;
 gap:22px!important;
 width:100%!important;
 max-width:none!important;
 align-items:start!important;
}
body.profile-page .user-content{
 width:100%!important;
 max-width:none!important;
 min-width:0!important;
}
body.profile-page .account-head{
 width:100%!important;
 max-width:none!important;
}
body.profile-page .profile-card{
 display:grid!important;
 grid-template-columns:130px minmax(0,1fr)!important;
 gap:26px!important;
 align-items:center!important;
 width:100%!important;
 max-width:none!important;
 min-height:180px!important;
 padding:26px 30px!important;
 margin:18px 0!important;
}
body.profile-page .profile-card .avatar{
 width:120px!important;height:120px!important;
 max-width:120px!important;min-width:120px!important;
 object-fit:cover!important;
}
body.profile-page .profile-card>div{min-width:0!important}
body.profile-page .profile-card h2{
 display:flex!important;
 flex-wrap:wrap!important;
 align-items:center!important;
 gap:9px!important;
 margin:0 0 14px!important;
 font-size:30px!important;
 line-height:1.2!important;
}
body.profile-page .profile-card h2 .user-presence{
 position:static!important;
 width:auto!important;
 max-width:none!important;
 margin:0 0 0 3px!important;
 overflow:visible!important;
}
body.profile-page .profile-card h2 .user-presence-text{
 position:static!important;width:auto!important;height:auto!important;
 clip:auto!important;overflow:visible!important;margin:0!important;
}
body.profile-page .profile-details{
 display:block!important;
 width:100%!important;
 max-width:none!important;
 margin:18px 0!important;
 padding:24px 26px!important;
}
body.profile-page .profile-detail-grid{
 display:grid!important;
 grid-template-columns:repeat(3,minmax(0,1fr))!important;
 gap:14px!important;
 width:100%!important;
 margin-top:14px!important;
}
body.profile-page .profile-detail-grid>div{
 min-width:0!important;
 width:auto!important;
 min-height:92px!important;
 padding:15px 16px!important;
 display:flex!important;
 flex-direction:column!important;
 justify-content:center!important;
 overflow:hidden!important;
}
body.profile-page .profile-detail-grid>div>span{
 display:block!important;
 width:100%!important;
 white-space:normal!important;
 overflow-wrap:anywhere!important;
 line-height:1.25!important;
}
body.profile-page .profile-detail-grid>div>strong{
 display:block!important;
 width:100%!important;
 margin-top:8px!important;
 font-size:17px!important;
 line-height:1.35!important;
 white-space:normal!important;
 overflow-wrap:anywhere!important;
}
body.profile-page .profile-about{
 display:block!important;
 width:100%!important;
 max-width:none!important;
 margin:18px 0!important;
 padding:24px 26px!important;
}
body.profile-page .profile-info-text{
 width:100%!important;
 max-width:none!important;
 min-height:44px!important;
 line-height:1.7!important;
 overflow-wrap:anywhere!important;
}
body.profile-page .user-content>.grid{
 display:grid!important;
 grid-template-columns:minmax(0,1.35fr) minmax(320px,.65fr)!important;
 gap:18px!important;
 width:100%!important;
 max-width:none!important;
 align-items:start!important;
}
body.profile-page .user-content>.grid>section{
 width:100%!important;
 min-width:0!important;
 max-width:none!important;
 margin:0!important;
}
body.profile-page .profile-info-editor{width:100%!important;max-width:none!important}

@media(max-width:1050px){
 body.profile-page .profile-detail-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 body.profile-page .user-content>.grid{grid-template-columns:1fr!important}
}
@media(max-width:760px){
 body.profile-page main{width:calc(100% - 20px)!important;margin:10px auto!important}
 body.profile-page .user-app{grid-template-columns:1fr!important}
 body.profile-page .profile-card{grid-template-columns:96px minmax(0,1fr)!important;padding:20px!important}
 body.profile-page .profile-card .avatar{width:90px!important;height:90px!important;min-width:90px!important}
 body.profile-page .profile-detail-grid{grid-template-columns:1fr!important}
}
@media(max-width:480px){
 body.profile-page .profile-card{grid-template-columns:1fr!important;text-align:center!important}
 body.profile-page .profile-card .avatar{margin:auto!important}
 body.profile-page .profile-card h2{justify-content:center!important}
}

/* ================================================================
 * PRIVATNACHRICHTEN – DIALOGDESIGN
 * Projektversion V3.0 / Stand 26.09.2026
 *
 * Aufgabe:
 * - Leser-, Verfassen- und Melden-Dialoge an das blau/cyane Spiel-Design anpassen;
 * - Hauptaktionen klar hervorheben;
 * - Blockieren und Melden bewusst als dezente Nebenaktionen darstellen.
 * ================================================================ */
body:has(.mail-app) .reader-dialog,
body:has(.mail-app) .compose-dialog,
body:has(.mail-app) .report-dialog{
  background:linear-gradient(145deg,#0b3143 0%,#082737 52%,#061f2e 100%)!important;
  border:1px solid rgba(76,222,244,.62)!important;
  color:#edfaff!important;
  box-shadow:0 28px 90px rgba(0,0,0,.68),inset 0 1px 0 rgba(255,255,255,.06),0 0 24px rgba(34,205,235,.10)!important;
}
body:has(.mail-app) .reader-dialog::backdrop,
body:has(.mail-app) .compose-dialog::backdrop,
body:has(.mail-app) .report-dialog::backdrop{
  background:rgba(1,10,18,.72)!important;
  backdrop-filter:blur(6px)!important;
  -webkit-backdrop-filter:blur(6px)!important;
}
body:has(.mail-app) .reader-head,
body:has(.mail-app) .compose-title{
  background:linear-gradient(180deg,rgba(18,70,88,.92),rgba(8,43,58,.88))!important;
  border-bottom:1px solid rgba(92,224,243,.24)!important;
}
body:has(.mail-app) .reader-head small,
body:has(.mail-app) .reader-head time,
body:has(.mail-app) .compose-title small{color:#a8ced8!important;opacity:.78!important}
body:has(.mail-app) .reader-body{
  background:rgba(5,34,48,.48)!important;
  color:#edfaff!important;
}
body:has(.mail-app) .reader-actions,
body:has(.mail-app) .compose-foot{
  background:rgba(4,28,40,.72)!important;
  border-top:1px solid rgba(92,224,243,.20)!important;
}
body:has(.mail-app) .recipient-wrap,
body:has(.mail-app) .editor-toolbar{
  background:rgba(7,39,54,.72)!important;
  border-bottom-color:rgba(92,224,243,.18)!important;
}
body:has(.mail-app) .recipient-wrap input{
  background:#071f2d!important;
  border:1px solid rgba(111,225,242,.42)!important;
  color:#f1fbff!important;
  padding:10px 12px!important;
}
body:has(.mail-app) .rich-editor{
  background:#082535!important;
  color:#f1fbff!important;
  min-height:220px!important;
}
body:has(.mail-app) .editor-toolbar button{
  background:rgba(137,197,211,.10)!important;
  border:1px solid rgba(128,211,229,.10)!important;
  color:#dff7fc!important;
}
body:has(.mail-app) .editor-toolbar button:hover{background:rgba(65,207,233,.18)!important}

/* Antworten und Senden sind die primären Aktionen. */
body:has(.mail-app) .reply-btn,
body:has(.mail-app) .send-btn{
  background:linear-gradient(135deg,#6540df,#8d3ee7)!important;
  border:1px solid rgba(190,157,255,.38)!important;
  color:#fff!important;
  box-shadow:0 8px 22px rgba(88,47,190,.22)!important;
}

/* Sicherheits-/Moderationsaktionen bewusst klein und optisch zurückhaltend. */
body:has(.mail-app) .reader-actions{align-items:center!important;gap:8px!important}
body:has(.mail-app) .reader-actions form{width:auto!important;margin:0!important}
body:has(.mail-app) .reader-actions form:last-child{margin-left:auto!important}
body:has(.mail-app) .reader-actions .secondary,
body:has(.mail-app) .reader-actions .report-open{
  width:auto!important;
  min-width:0!important;
  padding:7px 9px!important;
  border:1px solid rgba(159,190,201,.18)!important;
  border-radius:7px!important;
  background:rgba(112,143,154,.07)!important;
  color:#91a9b2!important;
  font-size:10px!important;
  font-weight:700!important;
  box-shadow:none!important;
  opacity:.72!important;
}
body:has(.mail-app) .reader-actions .secondary:hover,
body:has(.mail-app) .reader-actions .report-open:hover{
  opacity:1!important;color:#c8e1e8!important;background:rgba(117,161,174,.13)!important;
  border-color:rgba(159,214,226,.28)!important;
}
body:has(.mail-app) .reader-actions .danger{
  width:auto!important;min-width:0!important;padding:8px 11px!important;
  font-size:11px!important;background:rgba(100,35,47,.70)!important;
  border-color:rgba(191,77,96,.55)!important;box-shadow:none!important;
}
body:has(.mail-app) .reader-actions .reply-btn{
  width:auto!important;min-width:210px!important;padding:11px 18px!important;font-size:14px!important;
}
body:has(.mail-app) .compose-foot .secondary{
  background:rgba(125,159,170,.06)!important;border-color:rgba(159,199,210,.20)!important;
  color:#b7cbd2!important;box-shadow:none!important;
}
@media(max-width:650px){
  body:has(.mail-app) .reader-actions{flex-wrap:wrap!important}
  body:has(.mail-app) .reader-actions .reply-btn{min-width:100%!important}
  body:has(.mail-app) .reader-actions form:last-child{margin-left:0!important}
}

/* ================================================================
 * EINHEITLICHER HEADER + ACCOUNT-OVERLAY
 * Version V3.0 / Stand 26.09.2026
 *
 * Aufgabe: Einheitliche Grundmaße der Kopfzeilen-Buttons und ein
 * schwebendes, vertikal aufgebautes Benutzermenü auf Kontoseiten.
 * ================================================================ */
.account-main-nav>a:not(.login-key-btn){
  min-width:132px;
  height:42px;
  min-height:42px;
  padding:0 12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  text-align:center;
}
.account-main-nav .login-key-btn{
  width:42px!important;
  min-width:42px!important;
  height:42px!important;
  min-height:42px!important;
  padding:0!important;
}
.account-menu-wrap{position:relative;display:inline-flex;align-items:center}
.account-menu-toggle{cursor:pointer;font-family:inherit}
.account-quick-menu[hidden]{display:none!important}
.account-quick-menu{
  position:fixed!important;z-index:2147483000!important;display:flex;flex-direction:column;align-items:stretch;gap:2px;
  width:248px;max-width:calc(100vw - 20px);padding:9px;box-sizing:border-box;border:1px solid rgba(49,218,240,.72);
  border-radius:14px;background:linear-gradient(155deg,rgba(12,61,78,.995),rgba(5,31,43,.995));
  box-shadow:0 20px 52px rgba(0,0,0,.68),0 0 26px rgba(32,214,232,.18),inset 0 1px 0 rgba(255,255,255,.10)
}
.account-quick-menu::before{content:"";position:absolute;top:-6px;left:var(--account-arrow-left,18px);width:11px;height:11px;background:#0c3d4e;border-left:1px solid rgba(49,218,240,.72);border-top:1px solid rgba(49,218,240,.72);transform:rotate(45deg)}
.account-quick-head{padding:7px 10px 10px;margin-bottom:4px;border-bottom:1px solid rgba(95,216,235,.20)}
.account-quick-head small,.account-quick-head strong{display:block}.account-quick-head small{color:#82b9c7;font-size:8px;font-weight:900;letter-spacing:.13em}.account-quick-head strong{margin-top:2px;color:#effcff;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.account-quick-menu>a,.account-quick-logout button{width:100%!important;min-height:37px;display:flex!important;align-items:center;justify-content:flex-start;gap:10px;padding:8px 11px;box-sizing:border-box;border:0;border-radius:8px;background:transparent;color:#e9f9fc;text-decoration:none;text-align:left;white-space:nowrap;font:800 11px/1.15 Inter,system-ui,sans-serif;cursor:pointer}
.account-quick-menu>a span,.account-quick-logout button span{flex:0 0 18px;width:18px;text-align:center;color:#5ce4f3;font-size:13px}.account-quick-menu>a:hover{background:rgba(42,190,215,.14);color:#fff}.account-quick-logout{display:block;width:100%;margin:5px 0 0;padding:5px 0 0;border-top:1px solid rgba(255,255,255,.11)}.account-quick-logout button{color:#d9b9bd}.account-quick-logout button span{color:#c9858e}.account-quick-logout button:hover{background:rgba(155,55,70,.15);color:#ffe7e9}

/* Private Nachrichten: Elektro-Emoticons */
.emoticon-picker{padding:10px 14px;display:grid;grid-template-columns:repeat(5,minmax(72px,1fr));gap:8px;max-height:280px;overflow:auto;border-bottom:1px solid rgba(125,153,205,.12);background:rgba(5,14,31,.28)}
.emoticon-picker[hidden]{display:none!important}.emoticon-picker button{height:78px;padding:5px;border:1px solid rgba(125,153,205,.14);border-radius:9px;background:rgba(255,255,255,.045);cursor:pointer;overflow:hidden}.emoticon-picker button:hover{background:rgba(128,91,235,.18);transform:translateY(-1px)}.emoticon-picker img{width:100%;height:100%;object-fit:contain;display:block}.pm-emoticon{width:118px;max-width:42vw;height:auto;vertical-align:middle;margin:4px 5px;object-fit:contain}.pm-emoticon-editor{width:88px;max-width:30%;user-select:none}.reader-body .pm-emoticon{width:150px;max-width:55%}@media(max-width:520px){.emoticon-picker{grid-template-columns:repeat(3,minmax(70px,1fr))}.emoticon-picker button{height:70px}.pm-emoticon{width:96px}.reader-body .pm-emoticon{width:120px}}


/* ===============================================================
   Private Nachrichten: Electro Circuit 3D Toolbar / Compose
   Nur Compose-Dialog; keine globalen Button-Aenderungen.
   =============================================================== */
body:has(.mail-app) .compose-dialog{
  position:relative;isolation:isolate;overflow:hidden;
  background:linear-gradient(145deg,#0b3040 0%,#071c2c 56%,#091a30 100%)!important;
  border:1px solid rgba(72,215,240,.48)!important;border-radius:18px!important;
  box-shadow:0 32px 95px #000b,0 0 0 1px rgba(114,228,244,.09),inset 0 1px 0 rgba(197,249,255,.18)!important;
}
body:has(.mail-app) .compose-dialog::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.24;
  background-image:linear-gradient(90deg,transparent 0 32px,rgba(56,201,226,.24) 32px 34px,transparent 34px 100px),linear-gradient(0deg,transparent 0 46px,rgba(56,201,226,.16) 46px 48px,transparent 48px 110px);
  background-size:100px 110px;mask-image:linear-gradient(125deg,#000,transparent 75%);
}
body:has(.mail-app) .compose-dialog .compose-title{
  background:linear-gradient(180deg,rgba(22,79,96,.82),rgba(7,37,53,.83));
  box-shadow:inset 0 1px rgba(181,249,255,.15);
}
body:has(.mail-app) .compose-dialog .editor-toolbar{
  display:flex!important;flex-wrap:wrap!important;justify-content:flex-start!important;
  align-items:center!important;gap:9px!important;padding:11px 17px!important;
  background:linear-gradient(180deg,rgba(10,51,68,.97),rgba(4,28,44,.94))!important;
  box-shadow:inset 0 1px rgba(115,227,246,.13),0 8px 22px #0003;
}
body:has(.mail-app) .compose-dialog .editor-toolbar button{
  box-sizing:border-box!important;flex:0 0 42px!important;display:inline-flex!important;
  align-items:center!important;justify-content:center!important;
  width:42px!important;min-width:42px!important;max-width:42px!important;
  height:39px!important;min-height:39px!important;padding:0!important;margin:0!important;
  font-size:19px!important;line-height:1!important;font-weight:800!important;
  border:1px solid rgba(110,224,245,.31)!important;border-radius:9px!important;
  background:linear-gradient(155deg,#22596b,#0b3043 54%,#092338)!important;
  color:#e9fbff!important;
  text-shadow:0 1px 3px #0008!important;
  box-shadow:inset 0 1px 0 #d6fbff25,inset 0 -2px 3px #0005,0 4px 8px #0005!important;
  transform:translateY(0);transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease!important;
  cursor:pointer!important;
}
body:has(.mail-app) .compose-dialog .editor-toolbar button:hover{
  transform:translateY(-3px)!important;border-color:#6ce8ff!important;
  box-shadow:inset 0 1px #e8ffff50,0 8px 15px #0008,0 0 13px #36cde75a!important;
}
body:has(.mail-app) .compose-dialog .editor-toolbar button:active{transform:translateY(1px)!important;box-shadow:inset 0 3px 6px #0009!important}
body:has(.mail-app) .compose-dialog .editor-toolbar button:focus-visible{outline:2px solid #a7edff!important;outline-offset:3px!important}
body:has(.mail-app) .compose-dialog .editor-toolbar .toolbar-divider{
  display:block!important;flex:0 0 1px!important;width:1px!important;height:27px!important;
  margin:0 5px!important;background:linear-gradient(transparent,#58d9ecaa,transparent)!important;
}
body:has(.mail-app) .compose-dialog .editor-toolbar #emojiBtn{font-size:24px!important}
body:has(.mail-app) .compose-dialog .editor-toolbar #emoticonBtn{
  color:#ffce6d!important;border-color:#f6b74b80!important;
  background:linear-gradient(155deg,#65451e,#3a3025 55%,#1d2a33)!important;
}
body:has(.mail-app) .compose-dialog .editor-toolbar button[aria-expanded="true"]{
  border-color:#86efff!important;box-shadow:inset 0 2px 7px #0007,0 0 15px #50ddf966!important;
}
body:has(.mail-app) .compose-dialog .rich-editor{
  position:relative;background:linear-gradient(135deg,#082536,#071c2d)!important;
  box-shadow:inset 0 8px 16px #0003!important;
}
body:has(.mail-app) .compose-dialog .rich-editor:focus{box-shadow:inset 0 8px 16px #0003,inset 0 0 0 1px #59cfe45a!important}
body:has(.mail-app) .compose-dialog .compose-foot{background:linear-gradient(180deg,#0b3042,#071d2d)!important}
@media(max-width:520px){
 body:has(.mail-app) .compose-dialog .editor-toolbar{gap:6px!important;padding:9px 11px!important}
 body:has(.mail-app) .compose-dialog .editor-toolbar button{flex-basis:37px!important;width:37px!important;min-width:37px!important;max-width:37px!important;height:36px!important;min-height:36px!important}
 body:has(.mail-app) .compose-dialog .editor-toolbar .toolbar-divider{margin:0 2px!important}
}
@media(prefers-reduced-motion:reduce){body:has(.mail-app) .compose-dialog .editor-toolbar button{transition:none!important}}