/* Erzeugt aus bleeter/html/style.css – nicht von Hand aendern. Jeder Selektor ist auf .bl-root gekapselt, damit Bleeters Farben und Schrift nicht den uebrigen PC einfaerben. */ .bl-root{--bg: #020414;--panel: #061325;--panel-2: #091a31;--panel-3: #0d203a;--line: rgba(255, 255, 255, 0.08);--text: #f5f8ff;--muted: #71809b;--green: #19d889;--green-2: #00b978;--red: #ff4f5f;--gold: #f2b866;--shadow: 0 24px 80px rgba(0, 0, 0, 0.58)} .bl-root *{box-sizing: border-box;} .bl-root{color: var(--text);font-family: Inter, Arial, Helvetica, sans-serif} .bl-root button,.bl-root input,.bl-root textarea{font: inherit;} .bl-root button{cursor: pointer;} .bl-root .hidden{display: none !important;} .bl-root .tablet{position: relative; width: min(1680px, 96vw); aspect-ratio: 16 / 7.45; min-height: 700px; border: 13px solid #313943; border-radius: 72px; background: #020414; box-shadow: var(--shadow), inset 0 0 0 5px #77818b; overflow: hidden;} .bl-root .tablet-glass{position: absolute; inset: 7px; border-radius: 58px; pointer-events: none; box-shadow: inset 0 2px 12px rgba(255, 255, 255, 0.22), inset 0 -24px 60px rgba(255, 255, 255, 0.04); z-index: 5;} .bl-root .screen{position: absolute; inset: 22px; border-radius: 48px; background: var(--bg); overflow: hidden;} .bl-root .topbar{height: 92px; display: grid; grid-template-columns: 212px minmax(0, 1fr) 320px 58px 44px; gap: 18px; align-items: center; padding: 0 54px;} .bl-root .top-close{width: 40px; height: 40px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, 0.14); background: rgba(255, 255, 255, 0.05); color: rgba(255, 255, 255, 0.66); font-size: 16px; line-height: 1; cursor: pointer; transition: background .15s, color .15s, border-color .15s;} .bl-root .top-close:hover{background: rgba(229, 57, 53, 0.16); border-color: rgba(229, 57, 53, 0.5); color: #ff8a80;} .bl-root .brand{height: 58px; border: 0; border-radius: 0 0 8px 8px; padding: 0; background: transparent; overflow: hidden;} .bl-root .brand img{width: 100%; height: 100%; display: block; object-fit: contain;} .bl-root .search-wrap{position: relative;} .bl-root .global-search{width: 100%; height: 44px; border: 1px solid rgba(25, 216, 137, 0.38); border-radius: 999px; outline: 0; padding: 0 18px; color: var(--text); background: rgba(5, 20, 38, 0.94); font-size: 14px; font-weight: 800;} .bl-root .global-search::placeholder{color: #53627a;} .bl-root .search-results{position: absolute; top: 52px; right: 0; width: 100%; z-index: 20; display: grid; gap: 8px; padding: 8px; border: 1px solid var(--line); border-radius: 8px; background: #051426; box-shadow: 0 16px 40px rgba(0, 0, 0, 0.35);} .bl-root .search-result{display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 10px; align-items: center; border: 0; border-radius: 8px; padding: 8px; text-align: left; color: var(--text); background: rgba(255, 255, 255, 0.04);} .bl-root .search-result img{width: 36px; height: 36px; border-radius: 999px; object-fit: cover;} .bl-root .top-profile{width: 54px; height: 54px; border: 2px solid var(--green); border-radius: 999px; padding: 0; background: #0b1a2c; overflow: hidden;} .bl-root .top-profile img{width: 100%; height: 100%; object-fit: cover; display: block;} .bl-root .app-grid{height: calc(100% - 92px); display: grid; grid-template-columns: 86px minmax(0, 1fr) 300px; gap: 22px; padding: 0 54px 38px;} .bl-root .side-nav{display: flex; flex-direction: column; gap: 9px; padding-top: 20px; padding-bottom: 8px; overflow: hidden;} .bl-root .nav-button{width: 64px; height: 58px; border: 0; border-radius: 8px; color: #52617a; background: #071b34; display: grid; place-items: center; gap: 3px; transition: color 0.15s ease, background 0.15s ease;} .bl-root .nav-button.active{color: var(--green); background: #092541; box-shadow: inset 3px 0 0 var(--green);} .bl-root .nav-icon{display: grid; place-items: center; min-height: 22px; font-size: 20px; line-height: 1;} .bl-root .nav-icon svg{width: 20px; height: 20px; display: block;} .bl-root .nav-label{font-size: 9px; font-weight: 700; line-height: 1.05; max-width: 58px; overflow-wrap: anywhere;} .bl-root .content,.bl-root .context{min-width: 0; overflow: auto; scrollbar-color: var(--green) transparent; scrollbar-width: thin;} .bl-root .content{padding: 36px 0 8px;} .bl-root .context{padding: 36px 0 8px;} .bl-root .section-title{display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 18px;} .bl-root .section-title h1{margin: 0; font-size: 25px; line-height: 1.1;} .bl-root .section-title p{margin: 4px 0 0; color: var(--muted); font-size: 13px;} .bl-root .compose{display: grid; grid-template-columns: 52px minmax(0, 1fr); gap: 14px; padding: 16px; margin-bottom: 18px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel);} .bl-root .avatar{width: 52px; height: 52px; border: 2px solid var(--green); border-radius: 999px; object-fit: cover; background: #12243a;} .bl-root .compose textarea{width: 100%; min-height: 74px; resize: none; border: 0; outline: 0; color: var(--text); background: transparent;} .bl-root .compose-actions{display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 10px;} .bl-root .upload-row{display: flex; align-items: center; gap: 10px; min-width: 0; flex-wrap: wrap;} .bl-root .upload-button{border: 1px solid rgba(25, 216, 137, 0.45); border-radius: 999px; padding: 8px 13px; color: var(--green); background: rgba(25, 216, 137, 0.08); font-size: 12px; font-weight: 900;} .bl-root .media-url-input{width: min(360px, 42vw); min-height: 34px; border: 1px solid var(--line); border-radius: 8px; outline: 0; padding: 0 10px; color: var(--text); background: rgba(255, 255, 255, 0.04); font-size: 12px;} .bl-root .url-upload-row{display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: center;} .bl-root .toast-layer{position: absolute; right: 34px; bottom: 32px; z-index: 30; display: grid; gap: 10px; width: min(360px, 30vw); pointer-events: none;} .bl-root .toast{padding: 13px 15px; border: 1px solid var(--line); border-radius: 8px; color: var(--text); background: rgba(6, 19, 37, 0.96); box-shadow: 0 12px 32px rgba(0, 0, 0, 0.32); font-size: 13px; font-weight: 800;} .bl-root .toast-error{border-color: rgba(255, 79, 95, 0.55); color: #ffd7dc;} .bl-root .toast-success{border-color: rgba(25, 216, 137, 0.55); color: #b8ffdf;} .bl-root .hint{color: var(--muted); font-size: 12px;} .bl-root .primary-button,.bl-root .ghost-button,.bl-root .danger-button{border-radius: 999px; padding: 10px 18px; font-size: 13px; font-weight: 900;} .bl-root .primary-button{border: 0; color: #001527; background: var(--green);} .bl-root .ghost-button{border: 1px solid rgba(255, 255, 255, 0.12); color: var(--text); background: rgba(255, 255, 255, 0.04);} .bl-root .danger-text{border-color: rgba(255, 79, 95, 0.42); color: #ff6d7b;} .bl-root .danger-button{border: 1px solid rgba(255, 79, 95, 0.6); color: var(--red); background: rgba(255, 79, 95, 0.08);} .bl-root .feed-list{display: grid; gap: 18px;} .bl-root .post-card{overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: var(--panel);} .bl-root .post-head{display: grid; grid-template-columns: 54px minmax(0, 1fr) auto; gap: 14px; align-items: center; padding: 16px 18px;} .bl-root .author-link{display: inline-flex; align-items: center; gap: 6px; border: 0; padding: 0; color: var(--text); background: transparent; text-align: left;} .bl-root .author-name{display: flex; align-items: center; gap: 6px; font-weight: 900;} .bl-root .handle{color: var(--muted); font-size: 12px; font-weight: 700;} .bl-root .verified,.bl-root .staff-badge{display: inline-grid; width: 18px; height: 18px; place-items: center; border-radius: 999px; color: #001527; background: var(--green); font-size: 13px; font-weight: 1000;} .bl-root .verified svg,.bl-root .staff-badge svg{width: 18px; height: 18px;} .bl-root .staff-badge{color: #fff; background: transparent;} .bl-root .verified + .staff-badge{margin-left: 4px;} .bl-root .post-time{color: var(--muted); font-size: 12px;} .bl-root .post-body{padding: 0 18px 16px 86px; white-space: pre-wrap; font-size: 14px; line-height: 1.45;} .bl-root .post-image{display: block; width: 100%; max-height: 480px; object-fit: cover; background: #101a29;} .bl-root .post-actions{display: flex; gap: 22px; align-items: center; padding: 14px 18px; color: var(--text); border-top: 1px solid var(--line);} .bl-root .action-link{border: 0; color: var(--text); background: transparent; font-size: 13px; font-weight: 400;} .bl-root .danger-text{color: var(--red);} .bl-root .icon-action{width: 28px; height: 28px; display: inline-grid; place-items: center; border-radius: 8px; background: transparent;} .bl-root .icon-action svg{width: 16px; height: 16px; display: block;} .bl-root .danger-icon{border: 1px solid rgba(255, 79, 95, 0.35); color: var(--red);} .bl-root .danger-icon:hover{background: rgba(255, 79, 95, 0.1);} .bl-root .comment-actions{display: flex; align-items: center; gap: 12px;} .bl-root .comments-panel{display: grid; gap: 10px; padding: 14px 18px 18px 86px; border-top: 1px solid var(--line); background: rgba(0, 0, 0, 0.1);} .bl-root .comment-form{display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px;} .bl-root .comment-form input,.bl-root .market-search,.bl-root .market-sort,.bl-root .event-input{min-height: 38px; border: 1px solid var(--line); border-radius: 8px; outline: 0; padding: 0 12px; color: var(--text); background: rgba(255, 255, 255, 0.04);} .bl-root .comment-item{display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 10px 12px; border-radius: 8px; background: rgba(255, 255, 255, 0.04);} .bl-root .comment-item strong{display: block; margin-bottom: 3px;} .bl-root .market-tools{display: grid; grid-template-columns: minmax(0, 1fr) 210px; gap: 12px; margin-bottom: 18px;} .bl-root .market-post{display: grid; grid-template-columns: minmax(0, 1fr) 110px; gap: 12px; align-items: start;} .bl-root .market-compose-grid{display: grid; grid-template-columns: minmax(0, 1fr) 220px; gap: 10px; margin-bottom: 10px;} .bl-root .price-input{border-color: rgba(25, 216, 137, 0.36);} .bl-root .market-author{display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 10px; align-items: center; margin-bottom: 12px;} .bl-root .market-avatar-link{width: 42px; height: 42px; border: 0; border-radius: 999px; padding: 0; background: transparent;} .bl-root .market-avatar-link img,.bl-root .market-avatar-link span,.bl-root .market-author > img,.bl-root .market-author > span{width: 42px; height: 42px; border-radius: 999px; object-fit: cover; display: grid; place-items: center; border: 2px solid var(--green); background: #102036; font-weight: 900;} .bl-root .market-author p{margin: 2px 0 0;} .bl-root .market-author-name{display: flex; align-items: center; gap: 7px; flex-wrap: wrap;} .bl-root .mail-icon-button{width: 28px; height: 28px; border: 1px solid rgba(25, 216, 137, 0.35); border-radius: 999px; padding: 0; display: inline-grid; place-items: center; color: var(--green); background: rgba(25, 216, 137, 0.08);} .bl-root .mail-icon-button svg{width: 15px; height: 15px;} .bl-root .market-image{width: 100%; max-height: 260px; object-fit: cover; border-radius: 8px; margin-top: 12px;} .bl-root .market-side{display: grid; justify-items: end; align-content: start; gap: 12px;} .bl-root .price-tag{justify-self: end; padding: 8px 12px; border-radius: 999px; color: #001527; background: var(--green); font-weight: 900;} .bl-root .calendar-list{display: grid; gap: 10px;} .bl-root .day-card{border: 1px solid var(--line); border-radius: 8px; padding: 14px 16px; color: var(--text); background: var(--panel); text-align: left; cursor: pointer;} .bl-root .day-card.active{border-color: rgba(25, 216, 137, 0.72); box-shadow: inset 3px 0 0 var(--green);} .bl-root .day-title{font-size: 18px; font-weight: 900;} .bl-root .event-line{margin-top: 5px; color: var(--text); font-size: 14px; display: flex; align-items: center; justify-content: space-between; gap: 12px;} .bl-root .event-editor{display: grid; gap: 12px;} .bl-root .event-editor-head{display: flex; justify-content: space-between; gap: 12px; font-weight: 900;} .bl-root .legal-text{max-width: 980px; white-space: pre-line; font-size: 15px; line-height: 1.55;} .bl-root .profile-editor{max-width: 820px;} .bl-root .edit-form{display: grid; gap: 14px; padding: 18px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel);} .bl-root .edit-form label,.bl-root .event-editor label{display: grid; gap: 7px; color: var(--text); font-size: 13px; font-weight: 900;} .bl-root .edit-textarea{min-height: 120px; resize: vertical; border: 1px solid var(--line); border-radius: 8px; outline: 0; padding: 11px 12px; color: var(--text); background: rgba(255, 255, 255, 0.04);} .bl-root .edit-actions{display: flex; justify-content: flex-end; gap: 10px;} .bl-root .page-grid{display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px;} .bl-root .business-card{position: relative; width: 100%; min-height: 114px; overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: var(--panel-2); padding: 0; color: var(--text); text-align: left;} .bl-root .business-card.closed{filter: grayscale(0.8); opacity: 0.62;} .bl-root .business-banner{position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;} .bl-root .business-overlay{position: relative; min-height: 114px; display: flex; align-items: center; gap: 18px; padding: 20px 24px; background: linear-gradient(90deg, rgba(2, 4, 20, 0.16), rgba(2, 4, 20, 0.48));} .bl-root .business-avatar{width: 78px; height: 78px; border: 4px solid var(--green); border-radius: 999px; object-fit: cover;} .bl-root .business-label{max-width: 74%; padding: 12px 20px; border-radius: 8px; background: rgba(3, 12, 28, 0.94);} .bl-root .business-label strong{display: flex; align-items: center; gap: 7px; font-size: 23px; line-height: 1.05;} .bl-root .status-strip{height: 14px; margin-bottom: 22px; border-radius: 0 0 999px 999px; background: var(--green);} .bl-root .status-strip.closed{background: #586477;} .bl-root .profile-hero{position: relative; overflow: hidden; min-height: 310px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel);} .bl-root .comment-author-link{border: 0; padding: 0; color: var(--text); background: transparent; font-weight: 900;} .bl-root .profile-banner{width: 100%; height: 210px; object-fit: cover; display: block;} .bl-root .profile-banner-empty{background: linear-gradient(135deg, #082443, #0e332f);} .bl-root .profile-meta{display: grid; grid-template-columns: 140px minmax(0, 1fr) auto; gap: 18px; align-items: end; padding: 0 24px 24px; margin-top: -58px;} .bl-root .profile-avatar{width: 128px; height: 128px; border: 4px solid var(--green); border-radius: 999px; object-fit: cover; background: #102036;} .bl-root .profile-avatar-empty{display: grid; place-items: center; color: var(--green); font-size: 42px; font-weight: 900;} .bl-root .profile-actions{display: flex; align-items: center; justify-content: flex-end; gap: 10px; flex-wrap: wrap;} .bl-root .moderation-actions{display: inline-flex; align-items: center; gap: 8px;} .bl-root .moderation-icon-button{width: 40px; height: 40px; border: 1px solid rgba(25, 216, 137, 0.35); border-radius: 8px; padding: 0; display: inline-grid; place-items: center; color: var(--green); background: rgba(25, 216, 137, 0.06);} .bl-root .moderation-icon-button svg{width: 18px; height: 18px;} .bl-root .moderation-icon-button.active{color: #001527; background: var(--green);} .bl-root .moderation-icon-button.danger{border-color: rgba(255, 79, 95, 0.42); color: var(--red); background: rgba(255, 79, 95, 0.08);} .bl-root .moderation-icon-button.danger.active{color: #fff; background: rgba(255, 79, 95, 0.92);} .bl-root .profile-mail-button{width: 40px; height: 40px;} .bl-root .profile-mail-button svg{width: 18px; height: 18px;} .bl-root .profile-meta h1{display: flex; align-items: center; gap: 8px; margin: 0; font-size: 32px;} .bl-root .profile-meta p{margin: 8px 0 0; color: var(--muted);} .bl-root .profile-stats{display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px;} .bl-root .profile-stats button{position: relative; min-width: 48px; height: 30px; border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 8px; padding: 0 8px; display: inline-flex; align-items: center; justify-content: center; gap: 5px; color: var(--green); background: rgba(255, 255, 255, 0.035);} .bl-root .profile-stats button::after{content: attr(title); position: absolute; left: 50%; bottom: calc(100% + 7px); transform: translateX(-50%); opacity: 0; pointer-events: none; border: 1px solid var(--line); border-radius: 8px; padding: 5px 8px; color: var(--text); background: #051426; font-size: 11px; font-weight: 800; white-space: nowrap; transition: opacity 0.12s ease;} .bl-root .profile-stats button:hover::after{opacity: 1;} .bl-root .profile-stats svg{width: 15px; height: 15px; flex: 0 0 auto;} .bl-root .profile-stats strong{color: var(--text); font-size: 13px; font-weight: 400; line-height: 1.1;} .bl-root .profile-content-section{scroll-margin-top: 18px;} .bl-root .profile-content-section{display: grid; gap: 12px; margin-top: 18px;} .bl-root .profile-content-section h2{margin: 0; font-size: 18px;} .bl-root .profile-event-card h3{margin-bottom: 8px;} .bl-root .simple-list{display: grid; gap: 12px;} .bl-root .list-card,.bl-root .context-card{padding: 16px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel);} .bl-root .list-card h3,.bl-root .context-card h3{margin: 0 0 6px; font-size: 15px;} .bl-root .list-card p,.bl-root .context-card p{margin: 0; color: var(--muted); font-size: 13px; line-height: 1.35;} .bl-root .context-title{display: flex; align-items: center; gap: 10px; margin: 0 0 14px; font-size: 16px;} .bl-root .context-stack{display: grid; gap: 12px;} .bl-root .suggestion{display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; gap: 12px; align-items: center;} .bl-root .suggestion-avatar{width: 42px; height: 42px; border-radius: 999px; background: #8b97a8; display: grid; place-items: center; font-weight: 900;} .bl-root .mini-button{border: 0; border-radius: 999px; padding: 9px 15px; color: #001527; background: var(--green); font-size: 12px; font-weight: 900;} .bl-root .social-section{display: grid; gap: 10px; margin-bottom: 18px;} .bl-root .social-section h2{margin: 0; font-size: 16px;} .bl-root .social-row{display: flex; justify-content: space-between; gap: 16px; align-items: center;} .bl-root .social-actions{display: flex; gap: 8px; align-items: center; flex-wrap: wrap; justify-content: flex-end;} .bl-root .protected-pill{border: 1px solid rgba(255, 255, 255, 0.12); border-radius: 999px; padding: 8px 12px; color: var(--muted); font-size: 12px; font-weight: 900;} @media (max-width: 1280px) {.bl-root .tablet{min-height: 640px;} .bl-root .app-grid{grid-template-columns: 78px minmax(0, 1fr) 260px; gap: 16px; padding-inline: 36px;} .bl-root .topbar{padding-inline: 36px;}}