:root { --bg: #0a0c12; --surface: #121620; --surface-2: #181d29; --line: #252c3b; --text: #f3f6fb; --muted: #96a0b4; --accent: #7c6cff; --accent-hover: #9588ff; --danger: #df5367; --green: #46c98b; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color: var(--text); background: var(--bg); }
body[data-workspace="miad"] { --accent: #159db9; --accent-hover: #27b8d5; background: radial-gradient(circle at 82% 0%, rgba(21,157,185,.20), transparent 33rem), radial-gradient(circle at 34% 100%, rgba(37,185,164,.10), transparent 35rem), var(--bg); }
body[data-workspace="miad"] .brand-mark { background: linear-gradient(135deg, #159db9, #2fc9aa); }
body[data-workspace="miad"] .command-hero { border-color: rgba(37,191,202,.34); background: linear-gradient(112deg, rgba(16,112,138,.46), rgba(18,34,45,.96) 47%, rgba(12,23,31,.98)); }
.workspace-switch { min-height: 38px; padding-inline: 12px; font-size: 12px; white-space: nowrap; }
.miad-panel-refresh .secondary { margin-top: 4px; }
* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
.login-body { min-height: 100vh; display: grid; place-items: center; padding: 24px; background: radial-gradient(circle at 20% 5%, #332d72 0, transparent 32rem), var(--bg); }
.login-card { width: min(100%, 450px); padding: 48px; background: rgba(18,22,32,.94); border: 1px solid var(--line); border-radius: 24px; box-shadow: 0 24px 80px rgba(0,0,0,.35); text-align: center; }
.brand-mark { width: 46px; height: 46px; display: inline-grid; place-items: center; border-radius: 13px; background: linear-gradient(135deg, var(--accent), #af65ff); color: white; font-weight: 900; font-size: 22px; }
.login-card h1 { font-size: 29px; letter-spacing: -.6px; margin: 14px 0 10px; }
.eyebrow { margin: 0 0 6px; color: #b9b3ff; font-size: 11px; font-weight: 800; letter-spacing: .13em; }
.muted { color: var(--muted); line-height: 1.6; }
.discord-button, .primary, .danger-button, .secondary, .refresh-button { display: inline-flex; justify-content: center; align-items: center; min-height: 42px; padding: 0 16px; border: 0; border-radius: 10px; color: white; text-decoration: none; font-weight: 750; transition: .18s ease; }
.discord-button, .primary { width: 100%; margin-top: 22px; background: #5865f2; }.discord-button:hover, .primary:hover { background: #707bff; transform: translateY(-1px); }
.login-note { margin: 20px 0 0; color: #778095; font-size: 12px; }.login-error { margin: 16px 0 0; color: #ff9cab; font-size: 14px; }
.app-shell { display: flex; min-height: 100vh; }
.sidebar { position: fixed; inset: 0 auto 0 0; display: flex; flex-direction: column; width: 252px; padding: 26px 16px 18px; background: #0e1119; border-right: 1px solid var(--line); z-index: 5; }
.brand { display: flex; align-items: center; gap: 10px; padding: 0 10px 30px; color: white; text-decoration: none; font-size: 20px; font-weight: 900; letter-spacing: -.8px; }.brand .brand-mark { width: 34px; height: 34px; border-radius: 10px; font-size: 17px; }.brand span span { color: #9b90ff; }
.nav { display: grid; gap: 5px; }.nav-item { padding: 12px 13px; border: 0; border-radius: 10px; color: #aab3c5; background: transparent; text-align: left; font-weight: 650; }.nav-item:hover { background: #171c28; color: white; }.nav-item.active { color: white; background: rgba(124,108,255,.16); box-shadow: inset 2px 0 0 var(--accent); }
.sidebar-footer { margin-top: auto; padding: 15px 10px 0; border-top: 1px solid var(--line); }.account { display: flex; align-items: center; gap: 10px; }.account img, .person img { width: 34px; height: 34px; border-radius: 50%; object-fit: cover; background: #242a38; }.account strong, .account small, .person span, .person small { display: block; }.account strong { font-size: 13px; }.account small, .person small { margin-top: 2px; color: var(--muted); font-size: 11px; }.quiet-button { margin-top: 14px; padding: 0; border: 0; background: none; color: #919bad; font-size: 12px; }
.content { width: 100%; margin-left: 252px; padding: 38px clamp(22px, 4vw, 72px) 70px; }.topbar { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 28px; }.topbar h1 { margin: 0; font-size: clamp(27px, 3vw, 36px); letter-spacing: -1px; }.top-actions { display: flex; align-items: center; justify-content: flex-end; gap: 11px; }.sync-status { color: #8893a8; font-size: 12px; white-space: nowrap; }.sync-status.syncing { color: #bdb6ff; }.sync-status.error { color: #ff9baa; }.refresh-button { background: #1a2030; border: 1px solid #30394b; color: #d8deeb; }.refresh-button:hover, .secondary:hover { background: #252d40; }
.view { display: none; }.view.active { display: block; }.view[hidden] { display: none !important; }.stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-bottom: 20px; }.stat, .panel { background: linear-gradient(145deg, rgba(24,29,41,.98), rgba(17,21,31,.98)); border: 1px solid var(--line); border-radius: 14px; }.stat { padding: 19px; }.stat span { display: block; color: var(--muted); font-size: 12px; }.stat strong { display: block; margin-top: 8px; font-size: 27px; letter-spacing: -.6px; }
.grid { display: grid; gap: 18px; }.grid.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }.actions-grid { margin-bottom: 18px; }.panel { padding: 22px; }.panel-heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 14px; margin-bottom: 15px; }.panel-heading h2 { margin: 0; font-size: 17px; letter-spacing: -.2px; }.status-pill, .tag, .badge { display: inline-flex; align-items: center; width: fit-content; border-radius: 999px; font-size: 11px; font-weight: 750; }.status-pill { padding: 5px 9px; color: #9df2c5; background: rgba(70,201,139,.12); }.tag { padding: 5px 8px; color: #bdb6ff; background: rgba(124,108,255,.14); }.tag.danger { color: #ffa2b0; background: rgba(223,83,103,.13); }.badge { padding: 4px 8px; color: #d8d4ff; background: #29243f; }.system-list { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }.system-list span { padding: 7px 9px; color: #c3cad8; font-size: 12px; border: 1px solid #2b3344; border-radius: 8px; }.compact-list { display: grid; gap: 9px; }.compact-list > div { display: flex; justify-content: space-between; gap: 12px; padding-bottom: 9px; border-bottom: 1px solid #252b38; font-size: 13px; }.compact-list strong { color: #b9b3ff; }.text-button { padding: 0; border: 0; background: none; color: #b9b3ff; font-size: 12px; }
.quick-actions-panel { margin-top: 18px; }.quick-actions { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }.quick-action { display: flex; align-items: center; gap: 10px; min-width: 0; padding: 13px; border: 1px solid #2b3548; border-radius: 11px; color: #e8ebf4; background: #101621; text-align: left; transition: border-color .18s ease, background .18s ease, transform .18s ease; }.quick-action:hover { border-color: rgba(124,108,255,.7); background: #171d2a; transform: translateY(-1px); }.quick-action > span { display: grid; place-items: center; width: 33px; height: 33px; flex: 0 0 auto; border-radius: 9px; background: rgba(124,108,255,.15); font-size: 16px; }.quick-action div { min-width: 0; }.quick-action strong, .quick-action small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.quick-action strong { font-size: 12px; }.quick-action small { margin-top: 3px; color: var(--muted); font-size: 10px; }
.section-intro { margin: -6px 0 17px; color: var(--muted); font-size: 14px; }.action-form label { display: grid; gap: 7px; margin-top: 13px; color: #b8c0d0; font-size: 12px; font-weight: 700; }.action-form input, .action-form select, .action-form textarea { width: 100%; padding: 10px 11px; border: 1px solid #2d3547; border-radius: 9px; outline: none; color: #eef1f7; background: #0f131c; }.action-form input:focus, .action-form select:focus, .action-form textarea:focus { border-color: #7c6cff; box-shadow: 0 0 0 3px rgba(124,108,255,.14); }.action-form textarea { resize: vertical; }.action-form .primary, .action-form .danger-button { margin-top: 18px; }.form-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }.danger-button { width: 100%; background: #b53f54; }.danger-button:hover { background: #cf4c64; }.secondary { margin: 0; background: #20283a; border: 1px solid #333e55; }.button-row { display: flex; flex-wrap: wrap; gap: 8px; }.quick-panel { min-height: 184px; }.locked { position: relative; opacity: .55; }.lock-note { margin: 15px 0 0; color: #ffb0ba; font-size: 12px; }
.table-panel { padding-bottom: 4px; }.table-wrap { overflow-x: auto; margin: 0 -22px; } table { width: 100%; border-collapse: collapse; font-size: 13px; } th { color: #8994a9; font-size: 10px; letter-spacing: .09em; text-align: left; text-transform: uppercase; } th, td { padding: 12px 22px; border-top: 1px solid #252c3b; } td { color: #dce1eb; }.person { display: flex; align-items: center; gap: 9px; min-width: 190px; }.empty { padding: 26px; text-align: center; color: var(--muted); }.audit-entry { color: #aeb7c8; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 12px; white-space: pre-wrap; }
.leave-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; }.leave-card { display: grid; gap: 9px; padding: 14px; border: 1px solid #293144; border-radius: 11px; background: #10151f; }.leave-card > strong { color: #bfb7ff; }.leave-card > small { color: var(--muted); font-size: 11px; }
.activity-controls { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin: -4px 0 18px; }.activity-periods { display: inline-flex; flex-wrap: wrap; gap: 5px; padding: 4px; border: 1px solid #2c3548; border-radius: 11px; background: #10151f; }.activity-period { min-height: 34px; padding: 0 12px; border: 0; border-radius: 8px; color: #9da8bc; background: transparent; font-size: 12px; font-weight: 800; }.activity-period:hover { color: #f1f3ff; background: #20283a; }.activity-period.active { color: #f5f3ff; background: rgba(124,108,255,.3); box-shadow: inset 0 0 0 1px rgba(176,165,255,.32); }.activity-period-label { color: #a9b2c4; font-size: 12px; font-weight: 700; white-space: nowrap; }.activity-summary .stat { position: relative; overflow: hidden; }.activity-summary .stat::after { content: ""; position: absolute; inset: auto -18px -28px auto; width: 86px; height: 86px; border: 17px solid rgba(124,108,255,.12); border-radius: 50%; }.activity-summary .stat small { display: block; margin-top: 8px; color: #7f8aa0; font-size: 11px; }.activity-chart-panel { margin-bottom: 18px; }.activity-chart-panel > .muted { margin: -5px 0 20px; font-size: 12px; }.activity-hours { display: grid; grid-template-columns: repeat(24, minmax(12px, 1fr)); align-items: end; gap: 5px; height: 210px; padding: 12px 6px 0; border-top: 1px solid #2a3140; background: linear-gradient(180deg, rgba(124,108,255,.055), transparent 42%); }.activity-hour { display: grid; grid-template-rows: 1fr auto; align-items: end; gap: 7px; min-width: 0; height: 100%; color: #79849b; text-align: center; font-size: 10px; }.activity-hour-bars { display: flex; align-items: end; justify-content: center; gap: 2px; min-height: 0; height: 100%; }.activity-bar { display: block; width: min(8px, 40%); min-height: 0; border-radius: 5px 5px 2px 2px; transition: height .25s ease; }.activity-bar.voice { background: linear-gradient(180deg, #a599ff, #6656e6); box-shadow: 0 0 14px rgba(124,108,255,.22); }.activity-bar.messages { background: linear-gradient(180deg, #63dfae, #2eaa75); }.activity-ranking { display: grid; gap: 7px; }.activity-person { display: grid; grid-template-columns: 27px 36px minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 9px 0; border-bottom: 1px solid #252c3b; }.activity-person:last-child { border-bottom: 0; }.activity-person img, .activity-avatar-fallback { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; background: #282f42; }.activity-avatar-fallback { display: grid; place-items: center; color: #cfcaff; font-size: 13px; font-weight: 800; }.activity-person strong, .activity-person small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.activity-person strong { color: #e8ecf5; font-size: 13px; }.activity-person small { margin-top: 3px; color: #96a0b4; font-size: 11px; }.activity-place { display: inline-grid; place-items: center; width: 23px; height: 23px; border-radius: 7px; color: #d6d1ff; background: rgba(124,108,255,.15); font-size: 11px; font-weight: 850; }.activity-value { color: #c9c4ff; font-size: 12px; font-weight: 800; white-space: nowrap; }.activity-reset-panel { display: flex; flex-direction: column; }.activity-reset-panel .muted { margin: 0; }.activity-reset-panel .danger-button { margin-top: auto; }
body { background: radial-gradient(circle at 85% 0%, rgba(101,86,230,.16), transparent 30rem), radial-gradient(circle at 38% 100%, rgba(36,151,111,.07), transparent 34rem), var(--bg); }.sidebar { background: linear-gradient(180deg, rgba(14,18,29,.98), rgba(9,12,19,.98)); box-shadow: 18px 0 48px rgba(0,0,0,.16); }.nav { min-height: 0; overflow-y: auto; padding-right: 3px; }.nav-label { margin: 17px 10px 4px; color: #68748c; font-size: 9px; font-weight: 900; letter-spacing: .16em; }.nav-label:first-child { margin-top: 0; }.nav-item { position: relative; display: flex; align-items: center; gap: 10px; border: 1px solid transparent; }.nav-item::before { display: grid; place-items: center; width: 23px; height: 23px; color: #a79cff; background: rgba(124,108,255,.11); border-radius: 7px; font-size: 12px; font-weight: 900; content: "◇"; }.nav-item[data-view="overview"]::before { content: "⌂"; }.nav-item[data-view="staff"]::before { content: "♙"; }.nav-item[data-view="hr"]::before { content: "↗"; }.nav-item[data-view="leaves"]::before { content: "◷"; }.nav-item[data-view="tickets"]::before { content: "◫"; }.nav-item[data-view="messages"]::before { content: "✉"; }.nav-item[data-view="activity"]::before { content: "◉"; }.nav-item[data-view="operations"]::before { content: "◇"; }.nav-item[data-view="settings"]::before { content: "⚙"; }.nav-item[data-view="logs"]::before { content: "▤"; }.nav-item[data-view="audit"]::before { content: "◷"; }.nav-item[data-view="support"]::before { content: "?"; }.nav-item:hover { border-color: rgba(124,108,255,.22); background: linear-gradient(90deg, rgba(124,108,255,.13), rgba(124,108,255,.025)); }.nav-item.active { border-color: rgba(143,130,255,.3); background: linear-gradient(90deg, rgba(124,108,255,.28), rgba(124,108,255,.07)); box-shadow: inset 2px 0 0 #a99fff, 0 8px 18px rgba(64,53,158,.12); }.nav-item.active::before { color: white; background: linear-gradient(135deg, #9185ff, #6656e6); box-shadow: 0 5px 13px rgba(99,84,230,.36); }.command-hero { position: relative; display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(300px, .7fr); gap: 34px; align-items: center; overflow: hidden; margin-bottom: 20px; padding: 30px 32px; border: 1px solid rgba(135,123,255,.32); border-radius: 20px; background: linear-gradient(112deg, rgba(74,64,169,.48), rgba(22,27,46,.96) 47%, rgba(15,20,30,.98)); box-shadow: 0 22px 52px rgba(0,0,0,.22); }.command-hero::before { content: ""; position: absolute; width: 285px; height: 285px; right: -102px; top: -150px; border: 50px solid rgba(178,166,255,.08); border-radius: 50%; }.command-hero-copy, .command-hero-metrics { position: relative; z-index: 1; }.command-hero h2 { max-width: 540px; margin: 0; color: #fff; font-size: clamp(26px, 3.2vw, 39px); letter-spacing: -1.2px; }.command-hero-copy > p:not(.eyebrow) { max-width: 620px; margin: 12px 0 0; color: #b7c0d5; line-height: 1.6; }.hero-status { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 20px; color: #cbd3e6; font-size: 12px; }.hero-status strong { color: #eff6ff; }.hero-status > span:last-child { color: #8fa0bb; }.hero-pulse { width: 9px; height: 9px; border-radius: 50%; background: #54dba0; box-shadow: 0 0 0 5px rgba(84,219,160,.13), 0 0 18px rgba(84,219,160,.62); }.command-hero-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; }.command-hero-metrics > div { padding: 16px 13px; border: 1px solid rgba(168,158,255,.18); border-radius: 13px; background: rgba(8,11,19,.35); backdrop-filter: blur(8px); }.command-hero-metrics span, .command-hero-metrics strong { display: block; }.command-hero-metrics span { color: #9ba8c0; font-size: 10px; font-weight: 750; }.command-hero-metrics strong { margin-top: 7px; color: #f8f8ff; font-size: 23px; letter-spacing: -.6px; }.stat { position: relative; overflow: hidden; box-shadow: 0 10px 28px rgba(0,0,0,.12); transition: transform .2s ease, border-color .2s ease; }.stat:hover { border-color: rgba(139,128,255,.45); transform: translateY(-2px); }.stat::before { content: ""; position: absolute; top: 0; left: 0; width: 38px; height: 3px; background: #887bff; border-radius: 0 0 5px 0; }.stat:nth-child(2)::before { background: #4fd29a; }.stat:nth-child(3)::before { background: #f0ae69; }.stat:nth-child(4)::before { background: #69a8ff; }.panel { box-shadow: 0 12px 30px rgba(0,0,0,.11); }.table-panel { overflow: hidden; }.table-panel .table-wrap { margin: -4px -10px 0; padding: 0 10px 9px; }.table-panel table { border-collapse: separate; border-spacing: 0 7px; }.table-panel th { padding: 6px 12px 5px; border: 0; color: #7f8ca5; }.table-panel td { padding: 11px 12px; border-top: 1px solid rgba(55,67,91,.75); border-bottom: 1px solid rgba(55,67,91,.75); background: linear-gradient(90deg, rgba(17,23,35,.96), rgba(14,19,30,.96)); }.table-panel td:first-child { border-left: 1px solid rgba(55,67,91,.75); border-radius: 10px 0 0 10px; }.table-panel td:last-child { border-right: 1px solid rgba(55,67,91,.75); border-radius: 0 10px 10px 0; }.table-panel tbody tr { transition: transform .18s ease, filter .18s ease; }.table-panel tbody tr:hover { filter: brightness(1.15); transform: translateX(3px); }.table-panel tbody tr:hover td { border-color: rgba(132,120,255,.5); }.table-panel .person img { width: 38px; height: 38px; border: 2px solid rgba(154,143,255,.28); box-shadow: 0 5px 12px rgba(0,0,0,.22); }.table-panel .tag, .table-panel .badge { box-shadow: inset 0 1px rgba(255,255,255,.08); }.activity-person:nth-child(1) .activity-place, #activity-message-table tr:nth-child(1) .activity-place, #activity-channel-table tr:nth-child(1) .activity-place { color: #2f2100; background: linear-gradient(135deg, #ffe59a, #d29b35); }.activity-person:nth-child(2) .activity-place, #activity-message-table tr:nth-child(2) .activity-place, #activity-channel-table tr:nth-child(2) .activity-place { color: #1d2735; background: linear-gradient(135deg, #e9eef8, #91a0b7); }.activity-person:nth-child(3) .activity-place, #activity-message-table tr:nth-child(3) .activity-place, #activity-channel-table tr:nth-child(3) .activity-place { color: #31170b; background: linear-gradient(135deg, #f3b184, #b6643c); }.settings-list { display: grid; gap: 12px; }.settings-list label { margin-top: 0; }.setting-current { color: var(--muted); font-size: 11px; font-weight: 500; }.setting-number { display: flex; align-items: center; gap: 10px; }.setting-number input { min-width: 0; }.setting-number span { min-width: 32px; color: #bdb6ff; font-weight: 800; }
.rank-role-groups { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }.rank-role-group { padding: 15px; border: 1px solid #293144; border-radius: 11px; background: #10151f; }.rank-role-group h3 { margin: 0 0 13px; color: #d9d4ff; font-size: 14px; }
.support-hero { overflow: hidden; padding: 0; margin-bottom: 18px; }.support-banner { height: 190px; background: linear-gradient(120deg, #5865f2, #101522 72%); }.support-profile-body { display: flex; align-items: flex-end; gap: 18px; padding: 0 25px 24px; margin-top: -46px; position: relative; }.support-avatar { width: 104px; height: 104px; flex: 0 0 auto; object-fit: cover; border: 5px solid #171c28; border-radius: 50%; background: #101522; }.support-profile-body h2 { margin: 0; font-size: 24px; }.support-profile-body .muted { margin: 5px 0 10px; }.badge-list { display: flex; flex-wrap: wrap; gap: 6px; }.support-link { text-decoration: none; }
.dm-thread { min-height: 390px; }.dm-thread-content { display: grid; align-content: start; gap: 10px; max-height: 560px; overflow-y: auto; padding-right: 4px; }.dm-bubble { width: min(88%, 500px); padding: 10px 12px; border: 1px solid #2b3548; border-radius: 12px 12px 12px 3px; background: #101621; }.dm-bubble.outgoing { justify-self: end; border-color: rgba(124,108,255,.55); border-radius: 12px 12px 3px 12px; background: rgba(88,101,242,.16); }.dm-bubble small { color: #9ba7bc; font-size: 10px; }.dm-bubble p { margin: 6px 0 0; white-space: pre-wrap; color: #e4e9f4; font-size: 13px; line-height: 1.45; }.dm-attachments { display: grid; gap: 8px; margin-top: 9px; }.dm-image-link { display: block; width: fit-content; }.dm-image { display: block; max-width: min(100%, 360px); max-height: 280px; border: 1px solid #39445a; border-radius: 8px; object-fit: contain; background: #080b11; }.dm-file { color: #c1b9ff; font-size: 12px; text-decoration: none; overflow-wrap: anywhere; }
.panel-heading-actions { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 8px; }.conversation-refresh { min-height: 32px; padding-inline: 10px; font-size: 11px; }
.transcript-panel { margin-top: 18px; }.transcript-panel iframe { display: block; width: 100%; min-height: 720px; border: 1px solid #2b3344; border-radius: 10px; background: #313338; }
#toast { position: fixed; right: 25px; bottom: 24px; max-width: min(440px, calc(100vw - 48px)); padding: 13px 16px; border: 1px solid #2b3851; border-radius: 10px; color: white; background: #1a2332; box-shadow: 0 12px 36px rgba(0,0,0,.32); transform: translateY(24px); opacity: 0; pointer-events: none; transition: .22s ease; z-index: 20; font-size: 13px; }.show { transform: translateY(0) !important; opacity: 1 !important; }.show.error { border-color: rgba(223,83,103,.7); background: #3c1c29; }
.confirmation-modal[hidden] { display: none; }.confirmation-modal { position: fixed; inset: 0; display: grid; place-items: center; padding: 20px; background: rgba(4, 6, 12, .72); backdrop-filter: blur(5px); z-index: 1000; }.confirmation-modal-card { width: min(100%, 520px); padding: 26px; border: 1px solid rgba(142, 130, 255, .42); border-radius: 16px; background: linear-gradient(145deg, #20273a, #121720); box-shadow: 0 26px 70px rgba(0, 0, 0, .5); }.confirmation-modal-card h2 { margin: 0; color: #f5f3ff; font-size: 22px; }.confirmation-modal-card .muted { margin: 12px 0 0; }.rating-change-summary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; margin-top: 19px; }.rating-change-summary > div { min-width: 0; padding: 12px; border: 1px solid #323e55; border-radius: 10px; background: rgba(10, 14, 23, .56); }.rating-change-summary span, .rating-change-summary strong { display: block; }.rating-change-summary span { color: #94a0b8; font-size: 10px; font-weight: 750; text-transform: uppercase; letter-spacing: .05em; }.rating-change-summary strong { margin-top: 6px; overflow-wrap: anywhere; color: #eeeaff; font-size: 13px; }.confirmation-modal-note { margin: 16px 0 0; padding: 10px 11px; border-left: 3px solid #8b7dff; border-radius: 0 8px 8px 0; color: #c9c3ff; background: rgba(124, 108, 255, .12); font-size: 12px; line-height: 1.5; }.confirmation-modal-actions { display: flex; justify-content: flex-end; gap: 9px; margin-top: 22px; }.confirmation-modal-actions .primary { width: auto; margin: 0; }.confirmation-modal-actions .secondary { min-height: 42px; }
.confirmation-modal-card { position: relative; overflow: hidden; }.confirmation-modal-card::before { position: absolute; top: 0; right: 0; left: 0; height: 3px; background: linear-gradient(90deg, #978dff, #5fddaa); content: ""; }.confirmation-modal[data-direction="demotion"] .confirmation-modal-card::before { background: linear-gradient(90deg, #978dff, #ef7788); }.rating-change-summary > div:nth-child(even) { border-color: rgba(95, 221, 170, .36); background: linear-gradient(135deg, rgba(54, 157, 112, .19), rgba(13, 24, 26, .64)); }.confirmation-modal[data-direction="demotion"] .rating-change-summary > div:nth-child(even) { border-color: rgba(239, 119, 136, .38); background: linear-gradient(135deg, rgba(164, 55, 73, .2), rgba(28, 16, 22, .68)); }.confirmation-modal[data-direction="promotion"] .confirmation-modal-actions .primary { background: #3daa78; }.confirmation-modal[data-direction="promotion"] .confirmation-modal-actions .primary:hover { background: #4acb91; }.confirmation-modal[data-direction="demotion"] .confirmation-modal-actions .primary { background: #bb4b60; }.confirmation-modal[data-direction="demotion"] .confirmation-modal-actions .primary:hover { background: #d75b71; }
button:disabled { cursor: not-allowed; opacity: .48; transform: none !important; }
.mobile-menu-toggle { display: none; }
.member-profile { margin-bottom: 18px; }.member-profile-hero { display: flex; align-items: center; gap: 15px; padding-bottom: 18px; border-bottom: 1px solid var(--line); }.member-profile-hero > div { min-width: 0; flex: 1; }.member-profile-hero h2 { margin: 0; font-size: 24px; }.member-profile-hero .muted { margin: 4px 0 0; overflow-wrap: anywhere; }.member-card-avatar { width: 70px; height: 70px; border: 3px solid #323b50; border-radius: 50%; object-fit: cover; background: #101522; }.member-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 18px 0; }.member-metrics > div { padding: 12px; border: 1px solid #2a3347; border-radius: 10px; background: #10151f; }.member-metrics span, .member-metrics strong { display: block; }.member-metrics span { color: var(--muted); font-size: 11px; }.member-metrics strong { margin-top: 5px; color: #e8e4ff; font-size: 15px; }.member-profile-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }.member-profile-grid section, .member-notes, .member-history { padding-top: 16px; }.member-profile-grid h3, .member-notes h3, .member-history h3 { margin: 0 0 11px; font-size: 14px; }.member-chip-list { display: flex; flex-wrap: wrap; gap: 7px; }.member-chip { display: inline-flex; align-items: center; gap: 5px; padding: 7px 9px; border: 1px solid #303a50; border-radius: 8px; color: #d6dced; background: #10151f; font-size: 12px; }.member-chip strong { color: #bdb6ff; }.member-chip small { color: #8e9bb0; }.member-notes { margin-top: 18px; border-top: 1px solid var(--line); }.notes-list { display: grid; gap: 8px; }.note { padding: 11px 12px; border-left: 3px solid var(--accent); border-radius: 0 9px 9px 0; background: #10151f; }.note p { margin: 0; color: #e0e5f0; white-space: pre-wrap; line-height: 1.5; font-size: 13px; }.note small { display: block; margin-top: 7px; color: var(--muted); font-size: 11px; }.note-form { display: grid; gap: 10px; margin-top: 12px; }.note-form label { display: grid; gap: 7px; color: #b8c0d0; font-size: 12px; font-weight: 700; }.note-form textarea { width: 100%; padding: 10px 11px; border: 1px solid #2d3547; border-radius: 9px; outline: none; color: #eef1f7; background: #0f131c; resize: vertical; }.note-form textarea:focus { border-color: #7c6cff; box-shadow: 0 0 0 3px rgba(124,108,255,.14); }.member-history { margin-top: 18px; border-top: 1px solid var(--line); }
@media (max-width: 960px) { .sidebar { width: 210px; }.content { margin-left: 210px; }.stats { grid-template-columns: repeat(2, 1fr); }.grid.two { grid-template-columns: 1fr; }.quick-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 680px) { .sidebar { position: sticky; top: 0; width: 100%; min-height: auto; padding: 12px 12px 10px; box-shadow: 0 8px 22px rgba(0,0,0,.28); }.app-shell { display: block; }.brand { padding: 0 6px 11px; }.nav { display: flex; gap: 4px; overflow-x: auto; padding-bottom: 2px; scrollbar-width: none; }.nav::-webkit-scrollbar { display: none; }.nav-item { flex: 0 0 auto; padding: 9px 11px; white-space: nowrap; font-size: 12px; }.sidebar-footer { display: none; }.content { margin: 0; padding: 23px 14px 44px; }.topbar { align-items: flex-start; gap: 12px; margin-bottom: 20px; }.top-actions { flex-direction: column; align-items: flex-end; gap: 6px; }.sync-status { font-size: 10px; }.refresh-button { min-height: 36px; padding: 0 10px; font-size: 11px; }.stats { gap: 10px; }.stat { padding: 14px; }.stat strong { font-size: 22px; }.panel { padding: 17px; border-radius: 12px; }.table-wrap { margin: 0 -17px; } table { min-width: 610px; } th, td { padding: 11px 17px; }.form-row, .rank-role-groups, .quick-actions { grid-template-columns: 1fr; }.leave-grid { grid-template-columns: 1fr; }.activity-hours { gap: 3px; height: 178px; padding-inline: 0; }.activity-hour { font-size: 8px; }.activity-person { grid-template-columns: 24px 34px minmax(0, 1fr) auto; gap: 8px; }.activity-person img, .activity-avatar-fallback { width: 34px; height: 34px; }.activity-value { font-size: 11px; }.support-banner { height: 130px; }.support-profile-body { gap: 13px; padding: 0 17px 18px; margin-top: -38px; }.support-avatar { width: 84px; height: 84px; border-width: 4px; }.support-profile-body h2 { font-size: 20px; }.transcript-panel iframe { min-height: 520px; } }
@media (max-width: 680px) { .mobile-menu-toggle { display: inline-flex; align-items: center; justify-content: center; min-height: 36px; margin: 0 6px 10px; padding: 0 12px; border: 1px solid #39445a; border-radius: 9px; color: #e7eaff; background: #171d2a; font-size: 12px; font-weight: 800; }.nav { display: none; }.nav.open { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; gap: 6px; padding: 2px 4px 8px; }.nav.open .nav-item { width: 100%; min-width: 0; min-height: 40px; padding: 9px 8px; overflow: hidden; text-align: center; text-overflow: ellipsis; }.sidebar-footer { display: flex; align-items: center; justify-content: flex-end; margin: 0; padding: 0 6px 5px; border: 0; }.sidebar-footer .account { display: none; }.quiet-button { min-height: 36px; margin: 0; padding: 0 10px; border: 1px solid #30394c; border-radius: 9px; color: #c6cede; background: #151b27; }.topbar { position: relative; }.topbar h1 { max-width: 55vw; }.primary, .danger-button, .secondary, .refresh-button { min-height: 44px; }.member-profile-hero { align-items: flex-start; flex-wrap: wrap; }.member-profile-hero > .tag { width: 100%; }.member-metrics, .member-profile-grid { grid-template-columns: 1fr; }.member-metrics { gap: 7px; }.member-metrics > div { display: flex; align-items: baseline; justify-content: space-between; } }
@media (max-width: 960px) { .command-hero { grid-template-columns: 1fr; gap: 22px; }.command-hero-metrics { max-width: 520px; } }
@media (max-width: 680px) { .nav.open { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; padding: 2px 4px 8px; }.nav.open .nav-label { grid-column: 1 / -1; margin: 12px 5px 1px; }.nav.open .nav-item { min-width: 0; }.activity-controls { align-items: flex-start; flex-direction: column; gap: 9px; }.activity-period-label { white-space: normal; }.command-hero { margin-inline: -1px; padding: 23px 19px; border-radius: 16px; }.command-hero h2 { font-size: 29px; }.command-hero-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }.command-hero-metrics > div { padding: 12px 9px; }.command-hero-metrics strong { font-size: 19px; }.table-panel .table-wrap { margin-inline: -8px; padding-inline: 8px; }.table-panel th, .table-panel td { padding-inline: 10px; } }
@media (max-width: 390px) { .content { padding-inline: 10px; }.topbar h1 { font-size: 25px; }.stats { grid-template-columns: 1fr; }.panel { padding: 15px; }.top-actions { gap: 4px; }.sync-status { max-width: 100px; text-align: right; white-space: normal; } }

/* Raporty */
.nav-item[data-view="reports"]::before { content: "▤"; }
.report-layout { align-items: start; }
.report-preview-panel { position: sticky; top: 22px; }
.report-preview-panel .discord-preview { min-height: 330px; }
.report-mention-choice { display: flex !important; align-items: center; gap: 9px; margin: 2px 0 0; color: #c9d2e3; font-size: 12px; font-weight: 700; }
.report-mention-choice input { width: 16px; height: 16px; accent-color: #7c6cff; }
.report-preview-mentions { min-height: 19px; margin: -3px 0 7px; color: #aeb9d1; font-size: 12px; }
.report-preview-mentions strong { color: #cec8ff; }
.reports-list { display: grid; gap: 10px; }
.report-card { padding: 15px; border: 1px solid #2c3549; border-radius: 12px; background: linear-gradient(130deg, rgba(33, 41, 62, .7), rgba(14, 19, 29, .9)); }
.report-card-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.report-card-actions { display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }
.report-card-actions .text-button { min-height: 30px; padding-inline: 8px; }
.report-card h3 { margin: 3px 0 0; color: #eef1fa; font-size: 15px; }
.report-card-meta { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.report-card p { margin: 12px 0 0; color: #cbd2df; white-space: pre-wrap; font-size: 13px; line-height: 1.55; }
.report-card-note { padding: 10px 11px; border-left: 3px solid #7c6cff; border-radius: 0 8px 8px 0; color: #d8d2ff; background: rgba(124, 108, 255, .10); }
.report-card footer { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; color: #8d9ab1; font-size: 11px; }
@media (max-width: 960px) { .report-preview-panel { position: static; } }

/* Szybkie wyszukiwanie i karta pracownika */
.global-member-search { position: relative; width: clamp(225px, 25vw, 350px); z-index: 10; }.global-search-field { display: flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 10px 0 12px; border: 1px solid rgba(86, 99, 132, .72); border-radius: 12px; color: #aeb9cd; background: rgba(13, 18, 29, .88); box-shadow: inset 0 1px rgba(255, 255, 255, .025), 0 8px 20px rgba(0, 0, 0, .14); transition: border-color .18s ease, box-shadow .18s ease, background .18s ease; }.global-search-field:focus-within { border-color: rgba(154, 143, 255, .86); background: #121827; box-shadow: 0 0 0 4px rgba(124, 108, 255, .13), 0 12px 28px rgba(0, 0, 0, .2); }.global-search-field > span { color: #b9b1ff; font-size: 20px; line-height: 1; }.global-search-field input { width: 100%; min-width: 0; border: 0; outline: 0; color: #f1f3fb; background: transparent; font-size: 12px; }.global-search-field input::placeholder { color: #7e8aa0; }.global-search-field kbd { flex: 0 0 auto; padding: 3px 5px; border: 1px solid #38445a; border-bottom-color: #263044; border-radius: 5px; color: #929eb5; background: #171e2b; font-family: inherit; font-size: 9px; font-weight: 800; white-space: nowrap; }.global-search-results { position: absolute; top: calc(100% + 8px); right: 0; left: 0; overflow: hidden; padding: 6px; border: 1px solid rgba(102, 93, 169, .46); border-radius: 13px; background: linear-gradient(145deg, #1d2434, #111722); box-shadow: 0 20px 38px rgba(0, 0, 0, .38); }.global-search-result { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; align-items: center; width: 100%; gap: 9px; padding: 8px; border: 0; border-radius: 9px; color: #e9edf7; background: transparent; text-align: left; transition: background .16s ease; }.global-search-result:hover, .global-search-result:focus { outline: 0; background: rgba(125, 110, 255, .18); }.global-search-result img { width: 34px; height: 34px; border: 1px solid rgba(174, 163, 255, .35); border-radius: 50%; object-fit: cover; background: #252d3f; }.global-search-result span { min-width: 0; }.global-search-result strong, .global-search-result small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.global-search-result strong { color: #f0f2fa; font-size: 12px; }.global-search-result small { margin-top: 3px; color: #96a2b8; font-size: 10px; }.global-search-result b { color: #c7c0ff; font-size: 10px; font-weight: 800; }.global-search-empty { margin: 9px 10px; color: #9ba6ba; font-size: 12px; line-height: 1.45; }
.member-profile { overflow: hidden; padding: 0; border-color: rgba(97, 110, 150, .46); background: linear-gradient(145deg, rgba(29, 36, 55, .98), rgba(14, 19, 30, .99)); box-shadow: 0 22px 52px rgba(0, 0, 0, .24); }.member-profile-banner { position: relative; overflow: hidden; padding: 28px 28px 24px; border-bottom: 1px solid rgba(103, 116, 157, .34); background: linear-gradient(110deg, rgba(105, 89, 224, .35), rgba(35, 47, 74, .91) 49%, rgba(18, 24, 38, .98)); }.member-profile-banner::after { position: absolute; top: -117px; right: -66px; width: 290px; height: 290px; border: 42px solid rgba(184, 172, 255, .075); border-radius: 50%; content: ""; }.member-profile-hero { position: relative; z-index: 1; padding: 0; border: 0; }.member-avatar-wrap { position: relative; flex: 0 0 auto; }.member-card-avatar { width: 82px; height: 82px; border: 4px solid rgba(225, 221, 255, .78); box-shadow: 0 11px 24px rgba(3, 5, 14, .35); }.member-status-dot { position: absolute; right: 2px; bottom: 4px; width: 16px; height: 16px; border: 3px solid #293146; border-radius: 50%; background: #55dba2; box-shadow: 0 0 13px rgba(85, 219, 162, .68); }.member-status-dot.on-leave { background: #ee7889; box-shadow: 0 0 13px rgba(238, 120, 137, .6); }.member-profile-hero h2 { color: #fbfbff; font-size: clamp(24px, 2.6vw, 31px); letter-spacing: -.7px; }.member-profile-summary { margin: 10px 0 0; color: #b8c2d7; font-size: 12px; line-height: 1.45; }.member-profile-actions { display: flex; flex: 0 0 auto; align-items: flex-end; flex-direction: column; gap: 8px; }.member-profile-actions .tag { text-align: right; }.copy-member-id { min-height: 34px; padding-inline: 11px; color: #e2defe; border-color: rgba(177, 167, 255, .46); background: rgba(15, 20, 33, .52); font-size: 11px; }.copy-member-id:hover { border-color: #b9b0ff; background: rgba(124, 108, 255, .22); }.member-profile > .member-metrics, .member-profile > .member-profile-grid, .member-profile > .member-notes, .member-profile > .member-history, .member-profile > .member-ems-details { margin-right: 24px; margin-left: 24px; }.member-profile > .member-metrics { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 20px; margin-bottom: 3px; }.member-metrics > div { position: relative; overflow: hidden; border-color: rgba(72, 84, 117, .66); background: linear-gradient(145deg, rgba(20, 27, 42, .92), rgba(13, 19, 30, .92)); }.member-metrics > div::after { position: absolute; right: -18px; bottom: -27px; width: 70px; height: 70px; border: 13px solid rgba(136, 122, 255, .1); border-radius: 50%; content: ""; }.member-metrics strong { color: #f0eeff; font-size: 17px; }.member-profile-grid { padding-bottom: 6px; }.member-profile-grid section { min-height: 113px; padding: 16px; border: 1px solid rgba(63, 76, 106, .74); border-radius: 13px; background: rgba(11, 17, 28, .45); }.member-profile-grid h3 { color: #e6e9f4; }.member-chip { border-color: rgba(62, 75, 106, .82); border-radius: 999px; background: rgba(26, 34, 51, .82); transition: border-color .16s ease, transform .16s ease; }.member-chip:hover { border-color: rgba(151, 140, 255, .65); transform: translateY(-1px); }.member-assignment { border-color: rgba(118, 105, 230, .6); background: linear-gradient(135deg, rgba(103, 88, 211, .28), rgba(27, 34, 54, .86)); }.member-profile .member-notes, .member-profile .member-history, .member-profile .member-ems-details { padding-bottom: 22px; }.member-profile .member-history { margin-top: 4px; }.member-profile .member-ems-details { margin-top: 18px; }
@media (max-width: 960px) { .topbar { align-items: flex-start; }.top-actions { flex-wrap: wrap; }.global-member-search { flex: 1 1 260px; }.member-profile-actions { align-items: flex-start; }.member-profile > .member-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 680px) { .topbar { flex-direction: column; }.topbar h1 { max-width: none; }.top-actions { width: 100%; align-items: stretch; }.global-member-search { width: 100%; }.global-search-field { min-height: 44px; }.global-search-field kbd { display: none; }.global-search-results { left: 0; }.member-profile-banner { padding: 21px 18px; }.member-profile-hero { gap: 13px; }.member-profile-actions { width: 100%; flex-direction: row; align-items: center; justify-content: space-between; }.member-profile > .member-metrics, .member-profile > .member-profile-grid, .member-profile > .member-notes, .member-profile > .member-history, .member-profile > .member-ems-details { margin-right: 17px; margin-left: 17px; }.member-profile > .member-metrics { grid-template-columns: 1fr; margin-top: 17px; }.member-metrics > div { display: block; }.member-card-avatar { width: 72px; height: 72px; }.member-profile-grid section { min-height: auto; }.member-profile .member-history { margin-top: 2px; } }

/* Baza stanowisk MIAD */
.miad-database-panel { margin-bottom: 18px; }
.miad-management { margin-top: 22px; }
.miad-slot-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(225px, 1fr)); gap: 10px; }
.miad-slot { display: grid; gap: 13px; min-height: 105px; padding: 14px; border: 1px solid #2d394b; border-radius: 12px; background: #101722; }
.miad-slot.is-free { border-style: dashed; border-color: rgba(67, 202, 170, .48); background: linear-gradient(135deg, rgba(23, 132, 117, .14), rgba(13, 22, 31, .9)); }
.miad-slot.is-free[data-badge] { cursor: pointer; transition: transform .18s ease, border-color .18s ease, filter .18s ease; }
.miad-slot.is-free[data-badge]:hover, .miad-slot.is-free[data-badge]:focus { border-color: #65ddb8; outline: none; filter: brightness(1.14); transform: translateY(-2px); }
.miad-slot.is-taken { background: linear-gradient(135deg, rgba(22, 55, 71, .55), rgba(13, 20, 30, .96)); }
.miad-slot-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.miad-slot-rank { color: #bcc9dc; font-size: 11px; font-weight: 750; text-align: right; }
.miad-slot-free { color: #7ae0bf; font-size: 13px; font-weight: 800; }
.miad-slot .person { min-width: 0; }
.miad-slot .person span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.miad-database-form .muted { margin: 14px 0 -1px; font-size: 12px; }

/* Konkurs Wiedza */
.knowledge-editor { gap: 16px; }
.knowledge-webhook-panel { margin: 0 0 18px; }
.knowledge-webhook-panel .button-row { margin-top: 18px; }
.knowledge-round-details-panel { margin: 0 0 18px; }
.knowledge-round-details-panel .secondary { margin-top: 18px; }
.knowledge-time-limit small { color: #8f9cb4; font-size: 11px; font-weight: 500; line-height: 1.4; }
.knowledge-answer-editor { display: grid; gap: 9px; }
.knowledge-answer-row { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: end; gap: 9px; padding: 10px; border: 1px solid #2d394b; border-radius: 10px; background: #101722; }
.knowledge-answer-input { min-width: 0; margin: 0; }
.knowledge-answer-label { display: block; margin-bottom: 6px; color: #9ba9c3; font-size: 10px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.knowledge-correct { display: inline-flex; align-items: center; gap: 6px; min-height: 38px; margin: 0; color: #cbd5e8; font-size: 12px; white-space: nowrap; }
.knowledge-correct input { width: auto; accent-color: #8477ff; }
.knowledge-remove-answer { align-self: center; }
.knowledge-add-answer { width: fit-content; }
.knowledge-summary-panel { display: flex; flex-direction: column; align-items: flex-start; }
.knowledge-summary-panel .button-row { margin-top: auto; }
.knowledge-dashboard-questions { display: grid; gap: 10px; }
.knowledge-dashboard-question { display: grid; gap: 10px; padding: 13px; border: 1px solid #2d394b; border-radius: 11px; background: #101722; }
.knowledge-dashboard-question > div { display: flex; align-items: flex-start; gap: 9px; color: #e8edfa; line-height: 1.4; }
.knowledge-question-meta { display: flex; flex-wrap: wrap; gap: 7px; color: #9caac2; font-size: 11px; }
.knowledge-question-meta span { padding: 4px 7px; border: 1px solid #2c3850; border-radius: 7px; background: rgba(35, 45, 66, .48); }
.knowledge-question-meta b { color: #d8d2ff; }
.knowledge-question-number { display: grid; flex: 0 0 22px; width: 22px; height: 22px; place-items: center; border-radius: 50%; color: #1a1c2a; background: #a99eff; font-size: 11px; font-weight: 900; }
.knowledge-dashboard-question ol { display: grid; gap: 4px; margin: 0; padding-left: 20px; color: #aebbd1; font-size: 12px; }
.knowledge-dashboard-question li.correct { color: #8de1b8; font-weight: 750; }
.knowledge-dashboard-question li small { margin-left: 4px; color: #67c99b; font-size: 10px; text-transform: uppercase; }
.knowledge-dashboard-question .text-button { justify-self: start; padding: 0; }
.knowledge-submissions-panel { margin-top: 18px; }
.knowledge-history-panel { margin-top: 18px; }
.knowledge-history-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; margin-top: 16px; }.knowledge-history-actions .danger-button { margin: 0; font-size: 12px; }
.knowledge-history-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(245px, 1fr)); gap: 11px; margin-top: 17px; }
.knowledge-history-card { overflow: hidden; border: 1px solid #2d394b; border-radius: 11px; background: #101722; }
.knowledge-history-card header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 12px; border-bottom: 1px solid #2a3549; background: rgba(79, 67, 165, .12); }
.knowledge-history-card header span, .knowledge-history-card header strong, .knowledge-history-card header small { display: block; }.knowledge-history-card header span { color: #aca3ff; font-size: 10px; font-weight: 900; letter-spacing: .07em; text-transform: uppercase; }.knowledge-history-card header strong { margin-top: 3px; color: #edf0fa; font-size: 13px; }.knowledge-history-card header small { max-width: 115px; color: #91a0ba; font-size: 10px; line-height: 1.35; text-align: right; }
.knowledge-history-card ol { display: grid; gap: 7px; margin: 0; padding: 11px 13px; list-style: none; }.knowledge-history-card li { display: grid; grid-template-columns: 20px minmax(0, 1fr) auto; align-items: center; gap: 7px; color: #c7d0df; font-size: 12px; }.knowledge-history-card li > span { color: #9990d9; font-weight: 850; text-align: center; }.knowledge-history-card li strong { overflow: hidden; color: #e1e7f3; text-overflow: ellipsis; white-space: nowrap; }.knowledge-history-card li b { color: #c8c2ff; font-size: 11px; }.knowledge-history-card .knowledge-history-empty { display: block; color: #8f9cb3; }
.knowledge-submission-details { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 12px; margin-top: 17px; }
.knowledge-submission-card { overflow: hidden; border: 1px solid #2d394b; border-radius: 12px; background: #101722; }
.knowledge-submission-card header { display: flex; align-items: center; gap: 10px; padding: 13px; border-bottom: 1px solid #2a3549; background: linear-gradient(100deg, rgba(91, 75, 192, .18), rgba(16, 23, 34, .72)); }
.knowledge-submission-card header img, .knowledge-answer-avatar { width: 32px; height: 32px; border-radius: 50%; object-fit: cover; }
.knowledge-answer-avatar { display: grid; place-items: center; color: #dfdbff; background: #484078; font-size: 12px; font-weight: 850; }
.knowledge-submission-card header div { min-width: 0; }.knowledge-submission-card header strong, .knowledge-submission-card header small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.knowledge-submission-card header strong { color: #f0f2fa; font-size: 13px; }.knowledge-submission-card header small { margin-top: 2px; color: #aebbd1; font-size: 10px; }
.knowledge-submission-card ol { display: grid; gap: 9px; margin: 0; padding: 13px 13px 13px 31px; }.knowledge-submission-card li { padding-left: 2px; font-size: 12px; line-height: 1.45; }.knowledge-submission-card li small, .knowledge-submission-card li strong, .knowledge-submission-card li span { display: block; }.knowledge-submission-card li small { color: #8493ad; font-size: 10px; text-transform: uppercase; letter-spacing: .05em; }.knowledge-submission-card li strong { margin: 2px 0; color: #d9e0ed; font-size: 12px; }.knowledge-submission-card li span { color: #adbacd; }.knowledge-submission-card li.is-correct span { color: #80d7a9; }.knowledge-submission-card li.is-wrong span { color: #f0a2a9; }

.knowledge-body { min-height: 100vh; margin: 0; color: #e8edf9; background: radial-gradient(circle at 82% 0%, rgba(126, 113, 255, .23), transparent 28rem), #080b11; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
.knowledge-shell { width: min(1120px, calc(100% - 40px)); margin: 0 auto; padding: 24px 0 58px; }
.knowledge-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 4px 0 30px; }
.knowledge-brand { color: #fbfbff; font-size: 20px; font-weight: 900; letter-spacing: -.06em; text-decoration: none; }.knowledge-brand span { color: #9589ff; }
.knowledge-account { display: flex; align-items: center; gap: 9px; color: #bdc6d8; font-size: 12px; font-weight: 700; }.knowledge-account img { width: 29px; height: 29px; border-radius: 50%; object-fit: cover; }.knowledge-account a { margin-left: 6px; padding: 7px 9px; border: 1px solid #364056; border-radius: 8px; color: #dedaff; text-decoration: none; }
.knowledge-hero { position: relative; overflow: hidden; padding: clamp(28px, 6vw, 58px); border: 1px solid rgba(139, 126, 255, .47); border-radius: 22px; background: linear-gradient(118deg, rgba(86, 75, 188, .38), rgba(17, 23, 35, .94) 60%); box-shadow: 0 22px 58px rgba(0, 0, 0, .28); }.knowledge-hero::after { position: absolute; top: -170px; right: -65px; width: 360px; height: 360px; border: 48px solid rgba(214, 209, 255, .07); border-radius: 50%; content: ""; }.knowledge-hero > * { position: relative; z-index: 1; }.knowledge-hero h1 { margin: 5px 0 12px; color: #fff; font-size: clamp(42px, 7vw, 78px); line-height: .95; letter-spacing: -.075em; }.knowledge-hero p:not(.eyebrow) { max-width: 560px; margin: 0; color: #cbd3e5; line-height: 1.6; }.knowledge-round-details { display: grid; gap: 8px; width: min(100%, 620px); margin-top: 17px; padding: 13px 14px; border: 1px solid rgba(191, 181, 255, .34); border-radius: 12px; background: rgba(10, 14, 24, .29); }.knowledge-round-details p { margin: 0 !important; color: #e0e5f3 !important; font-size: 13px; }.knowledge-round-details span { color: #d8d2ff; font-size: 12px; }.knowledge-round-details strong { color: #fff0b0; }.knowledge-meta { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 24px; }.knowledge-meta span, .knowledge-lock, .knowledge-count { padding: 6px 9px; border: 1px solid rgba(185, 176, 255, .42); border-radius: 999px; color: #ddd9ff; background: rgba(21, 26, 41, .4); font-size: 11px; font-weight: 850; letter-spacing: .04em; text-transform: uppercase; }
.knowledge-layout { display: grid; grid-template-columns: minmax(0, 1.48fr) minmax(280px, .82fr); align-items: start; gap: 18px; margin-top: 18px; }.knowledge-panel { padding: 24px; border: 1px solid #2a3345; border-radius: 16px; background: linear-gradient(145deg, rgba(18, 25, 38, .97), rgba(11, 16, 25, .98)); }.knowledge-panel-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }.knowledge-panel-heading h2 { margin: 4px 0 0; color: #f1f3fb; font-size: 21px; letter-spacing: -.03em; }.knowledge-panel .muted { margin: 18px 0 0; }
.knowledge-integrity-note { margin: 8px 0 0; color: #9facc4; font-size: 11px; line-height: 1.5; }.knowledge-start { margin-top: 22px; }
.knowledge-questions { display: grid; gap: 15px; margin: 22px 0; }.knowledge-question { margin: 0; padding: 0; border: 0; }.knowledge-question legend { display: flex; align-items: flex-start; gap: 9px; width: 100%; margin-bottom: 10px; color: #eff2fa; font-size: 14px; font-weight: 800; line-height: 1.45; }.knowledge-question legend span { display: grid; flex: 0 0 24px; width: 24px; height: 24px; place-items: center; border-radius: 7px; color: #221e54; background: #b5acff; font-size: 11px; }.knowledge-options { display: grid; gap: 7px; }.knowledge-options label { display: flex; align-items: center; gap: 10px; padding: 11px 12px; border: 1px solid #303a4f; border-radius: 10px; color: #bdc8dc; background: #0c121d; cursor: pointer; transition: border-color .16s ease, background .16s ease; }.knowledge-options label:hover { border-color: #7f74df; background: #161d2e; }.knowledge-options input { accent-color: #9488ff; }.knowledge-options span { font-size: 13px; line-height: 1.4; }.knowledge-submit { width: 100%; padding: 13px; border: 0; border-radius: 10px; color: #171329; background: #b6adff; font: inherit; font-size: 13px; font-weight: 900; cursor: pointer; }.knowledge-submit:hover { filter: brightness(1.08); }.knowledge-submit:disabled { cursor: wait; opacity: .65; }
.knowledge-question-status { display: flex; justify-content: flex-end; margin: -2px 0 10px; }.knowledge-timer { padding: 5px 8px; border: 1px solid rgba(255, 198, 109, .35); border-radius: 999px; color: #ffd68b; background: rgba(133, 89, 24, .16); font-size: 11px; font-weight: 850; letter-spacing: .03em; }.knowledge-timer.is-unlimited { border-color: rgba(134, 151, 184, .32); color: #aebbd0; background: rgba(68, 81, 108, .16); }
.knowledge-result { display: grid; gap: 5px; margin-top: 20px; padding: 18px; border: 1px solid rgba(111, 219, 165, .38); border-radius: 12px; background: rgba(33, 142, 100, .12); }.knowledge-result span { color: #98dab9; font-size: 11px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }.knowledge-result strong { color: #fff; font-size: 36px; letter-spacing: -.06em; }.knowledge-result p { margin: 0; color: #b9cfbf; font-size: 12px; }
.knowledge-review { display: grid; gap: 9px; margin: 13px 0 0; padding: 13px 0 0 20px; border-top: 1px solid rgba(134, 213, 170, .24); }.knowledge-review li { padding-left: 2px; color: #c2d3c7; font-size: 12px; line-height: 1.45; }.knowledge-review li small, .knowledge-review li strong, .knowledge-review li span { display: block; }.knowledge-review li small { color: #a5b8aa; font-size: 10px; font-weight: 850; letter-spacing: .05em; text-transform: uppercase; }.knowledge-review li strong { margin: 2px 0; color: #effbf3; }.knowledge-review li.is-correct span { color: #8ae1b3; }.knowledge-review li.is-wrong span { color: #ffb2b6; }
.knowledge-leaderboard { display: grid; gap: 5px; margin: 18px 0 0; padding: 0; list-style: none; }.knowledge-leaderboard li { display: grid; grid-template-columns: 28px 31px minmax(0, 1fr) auto; align-items: center; gap: 9px; min-height: 52px; padding: 8px; border-bottom: 1px solid rgba(51, 63, 86, .7); }.knowledge-leaderboard li:last-child { border-bottom: 0; }.knowledge-leaderboard li img, .knowledge-avatar-fallback { width: 29px; height: 29px; border-radius: 50%; object-fit: cover; }.knowledge-avatar-fallback { display: grid; place-items: center; color: #dbd7ff; background: #353067; font-size: 12px; font-weight: 800; }.knowledge-place { color: #8076b8; font-size: 12px; font-weight: 900; text-align: center; }.knowledge-leaderboard div { min-width: 0; }.knowledge-leaderboard strong, .knowledge-leaderboard small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.knowledge-leaderboard strong { color: #e8edf9; font-size: 12px; }.knowledge-leaderboard small { margin-top: 2px; color: #91a0bb; font-size: 10px; }.knowledge-leaderboard b { color: #d8d2ff; font-size: 12px; }.knowledge-leaderboard .knowledge-empty { display: block; padding: 15px 4px; color: #91a0b7; font-size: 12px; text-align: center; }
.knowledge-tab-warning { color: #ffc66d; font-size: 12px; font-weight: 800; }
.knowledge-public-history-panel { margin-top: 18px; }.knowledge-public-history { display: grid; grid-template-columns: repeat(auto-fit, minmax(235px, 1fr)); gap: 11px; margin-top: 18px; }.knowledge-public-history-card { overflow: hidden; border: 1px solid #2d394b; border-radius: 11px; background: rgba(11, 17, 27, .74); }.knowledge-public-history-card header { display: flex; justify-content: space-between; gap: 10px; padding: 12px; border-bottom: 1px solid #2a3549; background: rgba(92, 77, 191, .14); }.knowledge-public-history-card header strong, .knowledge-public-history-card header small { display: block; }.knowledge-public-history-card header strong { color: #f0f1fd; font-size: 13px; }.knowledge-public-history-card header small { margin-top: 3px; color: #9dabc2; font-size: 10px; }.knowledge-public-history-card header > span { color: #a9a0e7; font-size: 10px; font-weight: 750; text-align: right; }.knowledge-public-history-card ol { display: grid; gap: 7px; margin: 0; padding: 11px 13px; list-style: none; }.knowledge-public-history-card li { display: grid; grid-template-columns: 20px minmax(0, 1fr) auto; align-items: center; gap: 7px; color: #c8d1e1; font-size: 12px; }.knowledge-public-history-card li > span { color: #9d94dc; font-weight: 850; text-align: center; }.knowledge-public-history-card li strong { overflow: hidden; color: #e6ebf5; text-overflow: ellipsis; white-space: nowrap; }.knowledge-public-history-card li b { color: #cbc4ff; font-size: 11px; }

.knowledge-image-input small { color: #8f9cb4; font-size: 11px; font-weight: 500; line-height: 1.4; }
.knowledge-question-thumbnail { width: min(100%, 300px); max-height: 180px; object-fit: cover; border: 1px solid #35415a; border-radius: 9px; background: #0a0f18; }
.knowledge-schedule-panel { margin: 0 0 18px; }.knowledge-schedule-panel .button-row { margin-top: 18px; }.knowledge-schedule-pickers { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 15px; }.knowledge-schedule-picker { min-width: 0; margin: 0; padding: 13px; border: 1px solid rgba(133, 119, 236, .34); border-radius: 12px; background: linear-gradient(135deg, rgba(85, 70, 183, .15), rgba(14, 20, 31, .66)); }.knowledge-schedule-picker legend { padding: 0 5px; color: #cbc5ff; font-size: 11px; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }.knowledge-schedule-picker > div { display: grid; grid-template-columns: minmax(0, 1fr) 104px; gap: 9px; }.action-form .knowledge-schedule-picker label { margin-top: 0; color: #aeb9cf; font-size: 10px; letter-spacing: .04em; text-transform: uppercase; }.knowledge-schedule-picker input { margin-top: 2px; }.knowledge-schedule-picker small { display: block; margin-top: 9px; color: #8695b1; font-size: 10px; font-weight: 500; line-height: 1.45; }
.knowledge-stats-panel { margin-top: 18px; }
.knowledge-question-stats { display: grid; gap: 16px; margin-top: 17px; }
.knowledge-hardest { display: grid; grid-template-columns: minmax(150px, .55fr) minmax(0, 1.45fr); gap: 16px; padding: 14px; border: 1px solid rgba(141, 125, 237, .38); border-radius: 12px; background: linear-gradient(108deg, rgba(85, 71, 183, .17), rgba(16, 23, 34, .92)); }.knowledge-hardest > div > span { color: #bdb4ff; font-size: 10px; font-weight: 850; letter-spacing: .08em; }.knowledge-hardest h3 { margin: 5px 0 0; color: #f0efff; font-size: 17px; }.knowledge-hardest-list { display: grid; gap: 7px; margin: 0; padding: 0; list-style: none; }.knowledge-hardest-list li { display: grid; grid-template-columns: 20px minmax(0, 1fr) auto; align-items: center; gap: 9px; }.knowledge-hardest-list li > span { display: grid; width: 20px; height: 20px; place-items: center; border-radius: 50%; color: #1c1738; background: #b8afff; font-size: 10px; font-weight: 900; }.knowledge-hardest-list strong { overflow: hidden; color: #dce3ef; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }.knowledge-hardest-list b { color: #ffce86; font-size: 12px; }
.knowledge-stat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(255px, 1fr)); gap: 11px; }.knowledge-stat-card { display: grid; gap: 9px; padding: 13px; border: 1px solid #2d394b; border-radius: 11px; background: #101722; }.knowledge-stat-card header { display: flex; align-items: center; justify-content: space-between; gap: 8px; }.knowledge-stat-card header span { color: #9f96e2; font-size: 10px; font-weight: 850; letter-spacing: .07em; text-transform: uppercase; }.knowledge-stat-card header b { color: #a8e0c2; font-size: 11px; }.knowledge-stat-card > strong { overflow: hidden; color: #e8edf7; font-size: 13px; line-height: 1.4; text-overflow: ellipsis; white-space: nowrap; }.knowledge-stat-card > small { color: #9ba9bf; font-size: 11px; }.knowledge-stat-card ol { display: grid; gap: 5px; margin: 0; padding: 0; list-style: none; }.knowledge-stat-card li { display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; align-items: center; gap: 7px; color: #aebbd0; font-size: 11px; }.knowledge-stat-card li > span { display: grid; width: 20px; height: 20px; place-items: center; border: 1px solid #3a4861; border-radius: 5px; color: #c5c0eb; background: #161e2c; font-size: 10px; font-weight: 850; }.knowledge-stat-card li strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.knowledge-stat-card li b { color: #dfe5f0; }.knowledge-stat-card li.is-correct { color: #8bdfb4; }.knowledge-stat-card li.is-correct > span { border-color: rgba(92, 207, 149, .55); color: #b6f2d0; }
.knowledge-question-image { display: block; width: min(100%, 620px); max-height: 440px; margin: 0 0 12px; border: 1px solid #3a4661; border-radius: 12px; object-fit: contain; background: #060910; }
.announcements-layout { align-items: stretch; }.announcement-form small { color: #8f9cb4; font-size: 11px; font-weight: 500; line-height: 1.4; }.announcement-preview-panel { display: flex; flex-direction: column; }.announcement-preview-mention { min-height: 19px; margin: 2px 0 15px; color: #bcb5ff; font-size: 12px; font-weight: 750; }.announcement-discord-preview { display: grid; flex: 1; align-items: start; }.announcement-discord-card { overflow: hidden; border: 1px solid #303b4e; border-radius: 8px; background: #2b2d31; box-shadow: 0 9px 19px rgba(0, 0, 0, .2); }.announcement-discord-card > i { display: block; height: 4px; background: var(--announcement-color, #5865f2); }.announcement-discord-body { padding: 16px 17px 14px; }.announcement-discord-author { margin: 0 0 10px; color: #b8c2d9; font-size: 11px; font-weight: 800; }.announcement-discord-body h3 { margin: 0 0 10px; color: #f2f3f5; font-size: 17px; line-height: 1.32; }.announcement-discord-body p { margin: 0; color: #dbdee1; font-size: 13px; line-height: 1.5; white-space: normal; }.announcement-discord-body img { display: block; width: 100%; max-height: 230px; margin-top: 14px; border-radius: 5px; object-fit: cover; background: #1e1f22; }.announcement-discord-button { display: inline-flex; margin-top: 14px; padding: 8px 11px; border-radius: 5px; color: #fff; background: #5865f2; font-size: 12px; font-weight: 800; }.announcement-discord-footer { display: block; margin-top: 14px; color: #a6a9ad; font-size: 10px; }.announcement-safety-panel { margin-top: 18px; }
@keyframes dashboard-rise { from { opacity: 0; transform: translateY(7px); } to { opacity: 1; transform: translateY(0); } }
@keyframes dashboard-card-in { from { opacity: 0; transform: translateY(5px) scale(.992); } to { opacity: 1; transform: translateY(0) scale(1); } }
@media (prefers-reduced-motion: no-preference) {
  .view.active > :is(.section-intro, .panel, .grid) { animation: dashboard-rise .32s cubic-bezier(.2, .72, .25, 1) both; }
  .view.active > :is(.section-intro, .panel, .grid):nth-child(2) { animation-delay: .035s; }
  .view.active > :is(.section-intro, .panel, .grid):nth-child(3) { animation-delay: .07s; }
  .panel, .stat { transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }
  .panel:hover, .stat:hover { border-color: rgba(135, 123, 237, .47); box-shadow: 0 14px 30px rgba(0, 0, 0, .16); transform: translateY(-2px); }
  .knowledge-dashboard-question, .knowledge-submission-card, .report-card, .miad-slot { animation: dashboard-card-in .25s ease both; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } }
@media (max-width: 760px) { .knowledge-shell { width: min(100% - 28px, 1120px); padding-top: 14px; }.knowledge-header { align-items: flex-start; padding-bottom: 22px; }.knowledge-account span { display: none; }.knowledge-account a { margin-left: 0; }.knowledge-layout { grid-template-columns: 1fr; }.knowledge-panel { padding: 19px; }.knowledge-answer-row { grid-template-columns: 1fr auto; }.knowledge-answer-input { grid-column: 1 / -1; }.knowledge-remove-answer { display: none; }.knowledge-dashboard-question { padding: 11px; }.knowledge-submission-details { grid-template-columns: 1fr; }.knowledge-history-actions { grid-template-columns: 1fr; } }
@media (max-width: 760px) { .knowledge-schedule-pickers { grid-template-columns: 1fr; }.knowledge-schedule-picker > div { grid-template-columns: minmax(0, 1fr) 108px; } }
@media (max-width: 760px) { .knowledge-hardest { grid-template-columns: 1fr; }.knowledge-stat-grid { grid-template-columns: 1fr; } }

.discipline-stats { grid-template-columns: repeat(5, minmax(0, 1fr)); margin-bottom: 18px; }
.discipline-panel td { vertical-align: top; }.discipline-panel td small { display: block; margin-top: 5px; color: var(--muted); font-size: 11px; }.discipline-reason { min-width: 220px; max-width: 370px; color: #d9dfeb; line-height: 1.45; white-space: pre-wrap; }.discipline-end-suspension { min-height: 33px; padding: 7px 10px; font-size: 11px; }.discipline-info-panel { margin-top: 18px; }

.appeal-page { display: grid; min-height: 100vh; margin: 0; background: radial-gradient(circle at 15% 8%, rgba(118, 99, 232, .2), transparent 30%), radial-gradient(circle at 87% 91%, rgba(36, 153, 167, .12), transparent 26%), #090d15; color: #edf0f8; }.appeal-shell { display: grid; width: min(100% - 36px, 670px); margin: auto; padding: 42px 0; gap: 16px; }.appeal-brand { width: fit-content; color: #f8f7ff; font-size: 14px; font-weight: 900; letter-spacing: -.3px; text-decoration: none; }.appeal-brand::before { display: inline-grid; width: 27px; height: 27px; margin-right: 8px; border-radius: 8px; place-items: center; color: #110d24; background: linear-gradient(135deg, #b7adff, #7667e3); content: "T"; font-size: 13px; }.appeal-card { padding: 32px; border: 1px solid rgba(128, 116, 226, .5); border-radius: 18px; background: linear-gradient(145deg, rgba(29, 30, 74, .95), rgba(12, 18, 29, .98) 68%); box-shadow: 0 30px 70px rgba(0, 0, 0, .35); }.appeal-card-heading h1 { margin: 7px 0 11px; color: #fcfcff; font-size: clamp(29px, 5vw, 39px); letter-spacing: -1.4px; }.appeal-card-heading > p:last-child { max-width: 550px; margin: 0; color: #b5bfd2; line-height: 1.6; }.appeal-user { display: flex; align-items: center; gap: 10px; margin: 24px 0 20px; padding: 10px 12px; border: 1px solid rgba(103, 119, 157, .45); border-radius: 11px; color: #bdc7da; background: rgba(9, 14, 24, .47); font-size: 13px; }.appeal-user img { width: 32px; height: 32px; border-radius: 50%; object-fit: cover; }.appeal-user strong { color: #fafaff; }.appeal-form { display: grid; gap: 10px; }.appeal-form label { color: #dce2ee; font-size: 13px; font-weight: 800; }.appeal-form textarea { width: 100%; min-height: 170px; box-sizing: border-box; padding: 13px 14px; border: 1px solid #3a4560; border-radius: 11px; outline: none; color: #f2f4f9; background: rgba(8, 13, 23, .74); line-height: 1.55; resize: vertical; }.appeal-form textarea:focus { border-color: #a196ff; box-shadow: 0 0 0 3px rgba(151, 140, 255, .14); }.appeal-form button { margin-top: 5px; justify-self: start; }.appeal-note { margin: 0; color: #8996ad; font-size: 12px; line-height: 1.45; }.appeal-result { min-height: 20px; margin: 2px 0 0; color: #bdc7da; font-size: 13px; }.appeal-result.success { color: #70e1ae; }.appeal-result.error { color: #ff9da8; }
@media (max-width: 900px) { .discipline-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .discipline-stats { grid-template-columns: 1fr; }.appeal-shell { width: min(100% - 24px, 670px); padding: 22px 0; }.appeal-card { padding: 23px 19px; border-radius: 14px; } }

/* Transkrypcja ticketu otwierana nad dashboardem — bez przewijania strony. */
.ticket-transcript-open { overflow: hidden; }
.ticket-transcript-modal[hidden] { display: none; }
.ticket-transcript-modal { position: fixed; z-index: 1100; inset: 0; display: grid; place-items: center; padding: 20px; background: rgba(4, 6, 12, .8); backdrop-filter: blur(7px); }
.ticket-transcript-modal-card { display: grid; grid-template-rows: auto minmax(0, 1fr); width: min(1120px, 100%); height: min(820px, calc(100dvh - 40px)); min-height: 0; overflow: hidden; border: 1px solid rgba(142, 130, 255, .45); border-radius: 16px; background: #313338; box-shadow: 0 28px 80px rgba(0, 0, 0, .6); }
.ticket-transcript-modal-header { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 19px 20px 17px; border-bottom: 1px solid #2b3548; background: linear-gradient(100deg, rgba(94, 80, 193, .23), rgba(18, 24, 35, .96)); }
.ticket-transcript-modal-header h2 { max-width: min(760px, 70vw); margin: 3px 0 0; overflow: hidden; color: #f5f3ff; font-size: 20px; letter-spacing: -.4px; text-overflow: ellipsis; white-space: nowrap; }
.ticket-transcript-close { display: grid; flex: 0 0 auto; width: 38px; height: 38px; place-items: center; border: 1px solid #46516b; border-radius: 10px; color: #e8ebf4; background: #1a2231; font-size: 27px; line-height: 1; cursor: pointer; transition: .16s ease; }
.ticket-transcript-close:hover { border-color: #a094ff; color: #fff; background: #2a2945; }
.ticket-transcript-modal iframe { display: block; width: 100%; height: 100%; min-height: 0; align-self: stretch; border: 0; background: #313338; }
@media (max-width: 680px) { .ticket-transcript-modal { padding: 10px; }.ticket-transcript-modal-card { height: calc(100dvh - 20px); border-radius: 13px; }.ticket-transcript-modal-header { padding: 15px; }.ticket-transcript-modal-header h2 { max-width: 70vw; font-size: 17px; } }

/* Przebudowa Fraction Control: czytelniejsza hierarchia i spokojniejszy wygląd. */
:root { --bg: #080a10; --surface: #111622; --surface-2: #171d2b; --line: #273146; --text: #f5f7fc; --muted: #99a6bb; --accent: #897cff; --accent-hover: #a297ff; }
body { background: radial-gradient(circle at 82% -8%, rgba(110, 92, 244, .20), transparent 31rem), radial-gradient(circle at 22% 105%, rgba(36, 171, 137, .075), transparent 32rem), var(--bg); }
.sidebar { width: 244px; padding: 23px 13px 16px; border-right-color: rgba(79, 94, 128, .4); background: linear-gradient(180deg, rgba(13, 17, 27, .98), rgba(8, 11, 18, .99)); box-shadow: 16px 0 46px rgba(0, 0, 0, .2); }
.brand { gap: 11px; padding: 1px 9px 24px; font-size: 19px; letter-spacing: -.9px; }.brand .brand-mark { width: 36px; height: 36px; border-radius: 11px; box-shadow: 0 8px 20px rgba(120, 104, 255, .27); }.brand span span { color: #b8b1ff; }
.nav { gap: 3px; padding: 0 3px 4px; }.nav-label { margin: 19px 8px 6px; color: #6f7c94; font-size: 9px; letter-spacing: .14em; }.nav-label:first-child { margin-top: 3px; }.nav-item { min-height: 42px; padding: 9px 10px; border-radius: 10px; color: #adb8ca; font-size: 12px; font-weight: 720; }.nav-item::before { width: 25px; height: 25px; border-radius: 8px; color: #bbb4ff; background: rgba(132, 118, 255, .10); }.nav-item:hover { border-color: rgba(143, 130, 255, .26); background: rgba(137, 124, 255, .10); }.nav-item.active { border-color: rgba(157, 146, 255, .37); background: linear-gradient(90deg, rgba(126, 111, 241, .30), rgba(126, 111, 241, .08)); box-shadow: inset 2px 0 #b7afff, 0 8px 18px rgba(71, 57, 168, .16); }.nav-item.active::before { background: linear-gradient(135deg, #a59bff, #7163e9); box-shadow: 0 5px 13px rgba(111, 95, 231, .35); }
.sidebar-footer { margin: 14px 3px 0; padding: 14px 7px 0; border-top-color: rgba(65, 78, 105, .52); }.account img { width: 36px; height: 36px; border: 2px solid rgba(163, 153, 255, .32); }.quiet-button { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 34px; margin-top: 12px; border: 1px solid #303b52; border-radius: 9px; color: #aeb8ca; background: #121925; }.quiet-button:hover { border-color: #6057a5; color: #f2f3fb; background: #191f2f; }
.content { width: calc(100% - 244px); margin-left: 244px; padding: 32px clamp(22px, 4vw, 64px) 68px; }.topbar { min-height: 51px; margin-bottom: 24px; }.topbar h1 { font-size: clamp(28px, 3.2vw, 38px); letter-spacing: -1.35px; }.topbar .eyebrow { margin-bottom: 5px; }.sync-status { display: inline-flex; align-items: center; gap: 6px; padding: 7px 10px; border: 1px solid rgba(65, 79, 106, .55); border-radius: 8px; background: rgba(14, 20, 31, .6); font-size: 10px; font-weight: 750; }.sync-status::before { width: 6px; height: 6px; border-radius: 50%; background: #53d79d; box-shadow: 0 0 0 4px rgba(83, 215, 157, .11); content: ""; }.sync-status.error::before { background: #ee7084; box-shadow: 0 0 0 4px rgba(238, 112, 132, .1); }.refresh-button { min-height: 40px; border-color: #3b4860; border-radius: 10px; background: #171f2e; font-size: 12px; }.refresh-button:hover { border-color: #756be1; background: #222a3d; }
.global-search-field { min-height: 42px; border-radius: 10px; background: rgba(15, 21, 33, .88); }.global-search-field > span { color: #c1baff; }.global-search-field:focus-within { border-color: rgba(164, 153, 255, .86); }
.view.active > :is(.section-intro, .panel, .grid, .stats, .command-hero) { animation: dashboard-rise .34s cubic-bezier(.2, .72, .25, 1) both; }.view.active > :nth-child(2) { animation-delay: .035s; }.view.active > :nth-child(3) { animation-delay: .07s; }
.panel, .stat { border-color: rgba(57, 70, 96, .82); border-radius: 16px; background: linear-gradient(145deg, rgba(23, 30, 45, .96), rgba(13, 18, 29, .98)); box-shadow: 0 13px 32px rgba(0, 0, 0, .14); }.panel { padding: 21px; }.panel-heading { align-items: center; margin-bottom: 17px; }.panel-heading h2 { font-size: 18px; letter-spacing: -.35px; }.eyebrow { color: #bdb5ff; font-size: 10px; letter-spacing: .15em; }.muted { color: #9daac0; }.tag { border: 1px solid rgba(145, 134, 244, .26); color: #c9c3ff; background: rgba(125, 111, 242, .12); }.status-pill { border: 1px solid rgba(89, 222, 157, .23); color: #9aefc3; background: rgba(47, 166, 110, .12); }
.stats { gap: 12px; margin-bottom: 18px; }.stat { min-height: 112px; padding: 18px; }.stat::before { width: 44px; background: linear-gradient(90deg, #9c91ff, #6fdfac); }.stat span { color: #9da9bf; font-size: 11px; font-weight: 700; }.stat strong { margin-top: 9px; color: #f9f9ff; font-size: 29px; letter-spacing: -1px; }.stat:hover { border-color: rgba(149, 137, 255, .62); box-shadow: 0 16px 38px rgba(0, 0, 0, .21); }
.command-center-hero { grid-template-columns: minmax(0, 1.2fr) minmax(315px, .8fr); min-height: 266px; gap: 38px; margin-bottom: 18px; padding: 33px 34px; border-color: rgba(137, 124, 255, .46); border-radius: 19px; background: linear-gradient(116deg, rgba(88, 73, 194, .58), rgba(27, 32, 57, .98) 51%, rgba(15, 20, 32, .98)); box-shadow: 0 24px 62px rgba(3, 4, 15, .36); }.command-center-hero::before { top: -158px; right: -110px; width: 338px; height: 338px; border-width: 52px; }.command-center-hero::after { position: absolute; right: 28%; bottom: -94px; width: 230px; height: 230px; border: 1px solid rgba(192, 183, 255, .07); border-radius: 50%; content: ""; }.command-hero-copy, .command-hero-metrics { z-index: 1; }.command-hero h2 { max-width: 650px; font-size: clamp(31px, 3.6vw, 46px); line-height: .98; letter-spacing: -1.85px; }.command-hero-copy > p:not(.eyebrow) { max-width: 580px; margin-top: 15px; color: #c0c9dc; font-size: 14px; line-height: 1.62; }.hero-status { margin-top: 20px; padding-top: 14px; border-top: 1px solid rgba(205, 199, 255, .16); }.hero-status strong { color: #f2f3ff; }.hero-actions { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 19px; }.hero-action-primary, .hero-action-quiet { display: inline-flex; align-items: center; min-height: 38px; padding: 0 13px; border-radius: 9px; font-size: 12px; font-weight: 800; }.hero-action-primary { gap: 9px; border: 1px solid rgba(237, 234, 255, .24); color: #191632; background: #ddd8ff; box-shadow: 0 8px 19px rgba(5, 5, 18, .2); }.hero-action-primary:hover { background: #f0eeff; transform: translateY(-1px); }.hero-action-primary span { font-size: 16px; }.hero-action-quiet { border: 1px solid rgba(203, 198, 255, .27); color: #ddd9ff; background: rgba(12, 16, 27, .26); }.hero-action-quiet:hover { border-color: rgba(215, 209, 255, .55); background: rgba(26, 32, 51, .55); }.command-hero-metrics { grid-template-columns: 1fr; gap: 8px; }.command-hero-metrics > div { display: grid; grid-template-columns: minmax(105px, 1fr) auto; align-items: baseline; gap: 2px 12px; padding: 11px 13px; border-color: rgba(190, 182, 255, .16); border-radius: 11px; background: rgba(7, 10, 19, .28); }.command-hero-metrics span { font-size: 10px; }.command-hero-metrics strong { grid-column: 2; grid-row: 1 / span 2; margin: 0; font-size: 25px; }.command-hero-metrics small { color: #93a0b9; font-size: 10px; }
.overview-focus-grid { margin-bottom: 18px; }.overview-systems { background: linear-gradient(128deg, rgba(28, 48, 54, .9), rgba(15, 22, 31, .98) 70%); }.overview-leaves-panel { background: linear-gradient(128deg, rgba(37, 32, 69, .76), rgba(15, 20, 31, .98) 68%); }.system-list { gap: 7px; margin-top: 17px; }.system-list span { border-color: rgba(92, 108, 138, .56); border-radius: 999px; color: #c8d3e4; background: rgba(11, 16, 25, .25); font-size: 11px; }.compact-list > div { align-items: center; padding: 10px 0; border-bottom-color: rgba(65, 78, 105, .55); }.compact-list > div:last-child { border-bottom: 0; }.compact-list strong { color: #d3ceff; }.text-button { color: #c8c1ff; font-weight: 800; }.text-button:hover { color: #f0eeff; }
.quick-actions-panel { overflow: hidden; background: linear-gradient(145deg, rgba(21, 28, 42, .98), rgba(12, 17, 27, .98)); }.quick-actions { grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 9px; }.quick-action { position: relative; gap: 11px; min-height: 75px; padding: 13px; border-color: rgba(66, 79, 106, .74); border-radius: 12px; background: rgba(10, 15, 25, .48); }.quick-action:hover { border-color: rgba(157, 145, 255, .72); background: linear-gradient(135deg, rgba(107, 91, 221, .20), rgba(22, 29, 45, .75)); transform: translateY(-2px); }.quick-action > span { width: 36px; height: 36px; border-radius: 10px; background: rgba(135, 122, 255, .16); }.quick-action strong { color: #edf0f8; font-size: 12px; }.quick-action small { color: #98a6be; }.quick-action b { margin-left: auto; color: #a99fff; font-size: 16px; font-weight: 500; }
.section-intro { margin: -2px 0 19px; padding: 13px 15px; border-left: 3px solid #8d80ff; border-radius: 0 10px 10px 0; background: rgba(97, 81, 214, .09); color: #b4bfd1; font-size: 13px; }.section-intro p { margin: 0; }.action-form { border-top-color: rgba(145, 133, 249, .42); }.action-form label { color: #c2ccdc; }.action-form input, .action-form select, .action-form textarea { border-color: #334057; border-radius: 10px; background: #0c121d; }.action-form input:hover, .action-form select:hover, .action-form textarea:hover { border-color: #475675; }.action-form input:focus, .action-form select:focus, .action-form textarea:focus { border-color: #9a8fff; box-shadow: 0 0 0 3px rgba(145, 132, 255, .14); }.primary, .danger-button, .secondary { border-radius: 10px; }.primary { background: linear-gradient(135deg, #8172f0, #6557d5); }.primary:hover { background: linear-gradient(135deg, #9488ff, #7465e6); }.secondary { border-color: #3a4760; background: #172030; }.secondary:hover { border-color: #6960b8; background: #212a3d; }.danger-button { border: 1px solid rgba(242, 118, 136, .35); background: linear-gradient(135deg, #ad4258, #863244); }
.table-panel { border-color: rgba(60, 73, 100, .88); }.table-panel .table-wrap { margin: -3px -12px 0; padding: 0 12px 10px; }.table-panel td { border-color: rgba(58, 72, 98, .78); background: linear-gradient(90deg, rgba(20, 27, 41, .95), rgba(12, 18, 29, .95)); }.table-panel tbody tr:hover td { border-color: rgba(151, 140, 255, .55); }.table-panel tbody tr:hover { filter: brightness(1.12); }.table-panel th { color: #8492aa; }.tag, .badge { box-shadow: inset 0 1px rgba(255, 255, 255, .06); }
@media (max-width: 1100px) { .sidebar { width: 224px; }.content { width: calc(100% - 224px); margin-left: 224px; }.command-center-hero { grid-template-columns: 1fr; gap: 23px; }.command-hero-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }.command-hero-metrics > div { display: block; }.command-hero-metrics strong { margin-top: 6px; }.command-hero-metrics small { display: block; margin-top: 3px; } }
@media (max-width: 680px) { .sidebar { position: sticky; width: 100%; padding: 13px 10px 9px; }.brand { padding: 0 7px 11px; }.content { width: 100%; margin-left: 0; padding: 20px 14px 44px; }.topbar { gap: 13px; margin-bottom: 19px; }.top-actions { gap: 7px; }.sync-status { align-self: flex-end; }.command-center-hero { min-height: 0; margin-inline: -1px; padding: 24px 19px; border-radius: 16px; }.command-hero h2 { font-size: 32px; letter-spacing: -1.35px; }.hero-actions { display: grid; grid-template-columns: 1fr; }.hero-action-primary, .hero-action-quiet { justify-content: center; min-height: 42px; }.command-hero-metrics { grid-template-columns: 1fr; }.command-hero-metrics > div { display: grid; grid-template-columns: 1fr auto; align-items: center; }.command-hero-metrics strong { grid-column: 2; grid-row: 1 / span 2; margin: 0; }.command-hero-metrics small { margin-top: 2px; }.stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }.stat { min-height: 96px; padding: 14px; }.stat strong { font-size: 23px; }.quick-actions { grid-template-columns: 1fr; }.overview-focus-grid { gap: 12px; }.panel { padding: 17px; }.nav.open .nav-label { color: #77849b; }.nav.open .nav-item { text-align: left; } }
.consultation-proof-paste {
  display: grid;
  gap: 4px;
  margin: 8px 0 10px;
  padding: 15px;
  border: 1px dashed #536dce;
  border-radius: 12px;
  color: #dce5ff;
  background: rgba(72, 93, 177, .12);
  cursor: pointer;
  outline: none;
  transition: border-color .18s ease, background .18s ease, transform .18s ease;
}
.consultation-proof-paste:hover,
.consultation-proof-paste:focus {
  border-color: #8ba4ff;
  background: rgba(91, 118, 224, .2);
  transform: translateY(-1px);
}
.consultation-proof-paste strong { font-size: 14px; }
.consultation-proof-paste span { color: #adbbdc; font-size: 12px; }
.consultation-proof-paste kbd {
  padding: 1px 5px;
  border: 1px solid #586a99;
  border-radius: 4px;
  color: #eaf0ff;
  background: #151d31;
  font-family: inherit;
  font-size: 11px;
}

/* Edytor struktury stopni i odznak. */
.rank-catalog-settings { overflow: hidden; }.rank-catalog-groups { display: grid; gap: 18px; }.rank-catalog-group { overflow: hidden; border: 1px solid rgba(68,82,112,.78); border-radius: 13px; background: rgba(9,14,23,.36); }.rank-catalog-group-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; border-bottom: 1px solid rgba(62,76,105,.68); background: linear-gradient(90deg, rgba(108,93,222,.16), rgba(18,24,37,.36)); }.rank-catalog-group-heading h3 { margin: 0; color: #e7e4ff; font-size: 14px; }.rank-catalog-group-heading span { display: block; margin-top: 3px; color: #9eabbe; font-size: 10px; font-weight: 800; }.rank-catalog-add { min-height: 30px; padding: 0 10px; border: 1px solid rgba(165,153,255,.50); border-radius: 8px; color: #e9e6ff; background: rgba(117,100,225,.19); font-size: 10px; font-weight: 850; white-space: nowrap; transition: .16s ease; }.rank-catalog-add:hover { border-color: #bdb3ff; background: rgba(132,114,246,.31); transform: translateY(-1px); }.rank-catalog-row { display: grid; grid-template-columns: 28px minmax(150px, 1.4fr) minmax(88px, .6fr) minmax(88px, .6fr) minmax(160px, 1fr) auto; align-items: end; gap: 9px; padding: 11px 12px; border-bottom: 1px solid rgba(56,70,95,.58); }.rank-catalog-row:last-child { border-bottom: 0; }.rank-catalog-position { display: grid; width: 24px; height: 24px; place-items: center; margin-bottom: 6px; border-radius: 7px; color: #d9d5ff; background: rgba(128,114,242,.16); font-size: 10px; font-weight: 900; }.rank-catalog-row label { display: grid; gap: 5px; min-width: 0; color: #b9c3d5; font-size: 10px; font-weight: 800; }.rank-catalog-row input, .rank-catalog-row select { width: 100%; min-width: 0; height: 35px; padding: 0 9px; border: 1px solid #35425a; border-radius: 8px; outline: none; color: #ecf0f8; background: #0b111b; font-size: 11px; }.rank-catalog-row input:focus, .rank-catalog-row select:focus { border-color: #9d91ff; box-shadow: 0 0 0 3px rgba(145,132,255,.13); }.rank-catalog-row small { overflow: hidden; color: #8996ae; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }.rank-catalog-actions { display: grid; min-height: 35px; place-items: end center; }.rank-catalog-remove { min-height: 30px; padding: 0 9px; border: 1px solid rgba(232,109,129,.38); border-radius: 8px; color: #ffb2bf; background: rgba(169,53,75,.15); font-size: 10px; font-weight: 850; }.rank-catalog-remove:hover { border-color: rgba(255,143,159,.70); background: rgba(193,59,86,.27); }
@media (max-width: 900px) { .rank-catalog-row { grid-template-columns: 28px 1fr 1fr; }.rank-catalog-row label:first-of-type { grid-column: 2 / -1; }.rank-catalog-row label:last-of-type { grid-column: 2 / -1; }.rank-catalog-actions { grid-column: 2 / -1; justify-content: end; } }
@media (max-width: 560px) { .rank-catalog-row { grid-template-columns: 28px 1fr; }.rank-catalog-row label, .rank-catalog-row label:first-of-type, .rank-catalog-row label:last-of-type, .rank-catalog-actions { grid-column: 2; }.rank-catalog-position { grid-row: 1; }.rank-catalog-actions { justify-content: start; } }

/* Centrum właściciela — osobny, spokojny widok operacyjny. */
.owner-page { min-height: 100vh; padding: 34px 20px 60px; background: radial-gradient(circle at 6% 0%, rgba(124,108,255,.26), transparent 32rem), radial-gradient(circle at 96% 35%, rgba(48,190,147,.10), transparent 29rem), #080a10; }
.owner-status-section { padding: 21px; border: 1px solid rgba(91, 82, 168, .62); border-radius: 18px; background: linear-gradient(135deg, rgba(45, 37, 106, .46), rgba(14, 20, 32, .96)); }.owner-status-section .owner-section-heading { margin: 0 0 16px; }.owner-status-form { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }.owner-status-form label { display: grid; gap: 5px; color: #c7cee0; font-size: 10px; font-weight: 800; }.owner-status-form input, .owner-status-form select, .owner-status-form textarea { width: 100%; min-width: 0; border: 1px solid #39455d; border-radius: 8px; color: #eaf0fa; background: rgba(7, 12, 21, .70); font: inherit; font-size: 11px; }.owner-status-form input, .owner-status-form select { height: 35px; padding: 0 9px; }.owner-status-form textarea { min-height: 75px; padding: 9px; resize: vertical; line-height: 1.45; }.owner-status-form small { color: #8f9bb1; font-size: 9px; font-weight: 500; }.owner-status-messages { grid-column: span 3; }.owner-status-form .billing-save { grid-column: 1 / -1; }
.owner-shell { width: min(1160px, 100%); margin: 0 auto; }
.owner-hero { position: relative; display: flex; justify-content: space-between; gap: 32px; overflow: hidden; padding: 35px 38px; border: 1px solid rgba(154,143,255,.42); border-radius: 24px; background: linear-gradient(120deg, rgba(77,63,177,.54), rgba(25,30,51,.98) 48%, rgba(13,20,31,.98)); box-shadow: 0 25px 70px rgba(0,0,0,.30); }
.owner-hero::after { position: absolute; right: -64px; top: -90px; width: 270px; height: 270px; border: 44px solid rgba(207,201,255,.07); border-radius: 50%; content: ""; }
.owner-hero-copy, .owner-hero-side { position: relative; z-index: 1; }.owner-hero-copy { max-width: 620px; }.owner-brand { display: flex; align-items: center; gap: 9px; margin-bottom: 27px; color: #d9d5ff; font-size: 11px; font-weight: 900; letter-spacing: .13em; }.owner-brand-mark { display: grid; width: 32px; height: 32px; place-items: center; border-radius: 10px; color: #18152f; background: linear-gradient(135deg, #cbc5ff, #8c7dff); box-shadow: 0 7px 18px rgba(0,0,0,.19); font-size: 16px; letter-spacing: 0; }.owner-hero h1 { margin: 7px 0 12px; color: #fbfbff; font-size: clamp(31px, 4.4vw, 48px); letter-spacing: -1.85px; line-height: .98; }.owner-hero-copy > p:last-child { max-width: 570px; margin: 0; color: #c0cae0; font-size: 14px; line-height: 1.65; }.owner-hero-side { display: flex; flex: 0 0 280px; flex-direction: column; justify-content: space-between; align-items: flex-end; }.owner-account { padding: 8px 10px; border: 1px solid rgba(205,199,255,.18); border-radius: 9px; color: #acb7cc; background: rgba(5,8,17,.20); font-size: 11px; }.owner-account strong { color: #f3f2ff; }.owner-metrics { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; width: 100%; }.owner-metrics > div { padding: 13px; border: 1px solid rgba(197,190,255,.16); border-radius: 12px; background: rgba(7,11,20,.26); backdrop-filter: blur(7px); }.owner-metrics strong, .owner-metrics span { display: block; }.owner-metrics strong { color: #f7f6ff; font-size: 23px; letter-spacing: -.7px; }.owner-metrics span { margin-top: 4px; color: #9ca9c1; font-size: 10px; line-height: 1.3; }
.owner-section { margin-top: 23px; }.owner-section-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin: 0 4px 13px; }.owner-section-heading h2 { margin: 5px 0 6px; color: #f5f6fc; font-size: 21px; letter-spacing: -.5px; }.owner-section-heading p:not(.eyebrow) { margin: 0; color: #93a1b8; font-size: 13px; line-height: 1.5; }.owner-lock { display: inline-flex; align-items: center; gap: 6px; padding: 8px 10px; border: 1px solid rgba(150,140,255,.25); border-radius: 999px; color: #cfcaff; background: rgba(115,98,221,.11); font-size: 11px; font-weight: 800; white-space: nowrap; }
.owner-server-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(390px, 1fr)); gap: 15px; }.owner-server-card { padding: 20px; border: 1px solid rgba(57,71,98,.90); border-radius: 18px; background: linear-gradient(145deg, rgba(22,29,44,.98), rgba(12,17,27,.99)); box-shadow: 0 15px 34px rgba(0,0,0,.14); }.owner-server-card.is-suspended { border-color: rgba(224,91,112,.58); background: linear-gradient(145deg, rgba(63,29,42,.78), rgba(15,18,28,.99) 60%); }.owner-server-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }.owner-server-name { display: flex; min-width: 0; align-items: center; gap: 11px; }.owner-server-name img, .owner-server-avatar { display: grid; flex: 0 0 auto; width: 43px; height: 43px; place-items: center; border: 1px solid rgba(177,168,255,.34); border-radius: 13px; background: linear-gradient(135deg, #7770d7, #423a8e); color: white; object-fit: cover; font-size: 17px; font-weight: 900; }.owner-server-name h3 { max-width: 220px; margin: 0; overflow: hidden; color: #f3f5fb; font-size: 16px; letter-spacing: -.3px; text-overflow: ellipsis; white-space: nowrap; }.owner-server-name p { margin: 4px 0 0; color: #8f9bb1; font-size: 11px; }.owner-state-stack { display: grid; justify-items: end; gap: 5px; }.owner-state { display: inline-flex; width: fit-content; padding: 4px 8px; border: 1px solid transparent; border-radius: 999px; font-size: 9px; font-weight: 900; letter-spacing: .05em; }.server-active { border-color: rgba(77,211,150,.26); color: #94efbd; background: rgba(48,180,117,.12); }.server-pending { border-color: rgba(241,181,96,.25); color: #f2c57f; background: rgba(207,143,48,.10); }.server-disabled, .server-disconnected { border-color: rgba(222,91,112,.28); color: #ffabb7; background: rgba(213,73,99,.11); }.billing-not_configured { border-color: rgba(125,139,165,.26); color: #adb9ca; background: rgba(109,122,150,.11); }.billing-awaiting_payment, .billing-due_soon { border-color: rgba(244,179,85,.30); color: #f4cb88; background: rgba(222,151,44,.11); }.billing-paid { border-color: rgba(83,218,155,.26); color: #9aefc5; background: rgba(46,175,110,.11); }.billing-suspended { border-color: rgba(241,102,124,.34); color: #ffacb8; background: rgba(220,69,95,.12); }.owner-config-summary { display: flex; flex-wrap: wrap; gap: 7px; margin: 16px 0; }.owner-config-summary span { padding: 5px 7px; border: 1px solid rgba(64,77,104,.7); border-radius: 7px; color: #aebad0; background: rgba(8,13,22,.28); font-size: 10px; }
.billing-card { padding: 15px; border: 1px solid rgba(113,101,204,.34); border-radius: 14px; background: linear-gradient(145deg, rgba(69,56,144,.16), rgba(11,16,26,.57)); }.billing-card-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }.billing-card-heading > div { display: flex; align-items: center; gap: 9px; }.billing-icon { display: grid; width: 31px; height: 31px; place-items: center; border-radius: 9px; color: #e1ddff; background: rgba(139,126,255,.22); font-size: 18px; }.billing-card h4 { margin: 0; color: #f0effb; font-size: 13px; }.billing-card-heading p { margin: 3px 0 0; color: #9da9c0; font-size: 10px; }.billing-when { padding: 5px 7px; border-radius: 7px; color: #d6d1ff; background: rgba(123,109,236,.17); font-size: 10px; font-weight: 800; white-space: nowrap; }.billing-timeline { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 15px 0 10px; }.billing-timeline div { min-width: 0; padding: 9px 8px; border-left: 2px solid rgba(158,146,255,.5); border-radius: 0 7px 7px 0; background: rgba(7,11,20,.24); }.billing-timeline span, .billing-timeline strong { display: block; }.billing-timeline span { color: #7f8da6; font-size: 9px; }.billing-timeline strong { margin-top: 4px; overflow: hidden; color: #dfe3ef; font-size: 10px; line-height: 1.35; text-overflow: ellipsis; }.billing-note { margin: 0 0 13px; color: #aab5c9; font-size: 10px; line-height: 1.5; }.billing-form { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }.billing-form label { display: grid; gap: 5px; color: #c0c8d8; font-size: 10px; font-weight: 750; }.billing-form input, .billing-form select { width: 100%; min-width: 0; height: 35px; padding: 0 9px; border: 1px solid #35415a; border-radius: 8px; outline: none; color: #e9edf8; background: #0b111b; font-size: 11px; }.billing-form input:focus, .billing-form select:focus { border-color: #988dff; box-shadow: 0 0 0 3px rgba(144,132,255,.13); }.billing-form small { color: #8794ab; font-size: 9px; font-weight: 500; }.billing-save { grid-column: 1 / -1; min-height: 38px; margin-top: 2px; border: 1px solid rgba(223,219,255,.18); border-radius: 9px; color: #18152f; background: linear-gradient(135deg, #c6beff, #9588ff); font-size: 11px; font-weight: 900; transition: transform .16s ease, filter .16s ease; }.billing-save:hover { filter: brightness(1.08); transform: translateY(-1px); }.billing-test { margin-top: 9px; }.billing-test button { width: 100%; min-height: 32px; border: 1px dashed rgba(159,148,255,.42); border-radius: 8px; color: #cfcaff; background: rgba(95,80,197,.08); font-size: 10px; font-weight: 800; }.billing-test button:hover { border-style: solid; background: rgba(108,93,216,.17); }
.owner-access-card { margin-top: 13px; padding: 14px; border: 1px solid rgba(90, 104, 144, .54); border-radius: 13px; background: rgba(8, 13, 23, .34); }.owner-center-access-card { margin-top: 23px; }.owner-access-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }.owner-access-heading > div { display: flex; align-items: center; gap: 9px; }.owner-access-heading h4 { margin: 0; color: #edf0f8; font-size: 13px; }.owner-access-heading p { margin: 3px 0 0; color: #94a1b8; font-size: 10px; }.owner-access-heading > span { padding: 5px 7px; border-radius: 7px; color: #d4d0ff; background: rgba(119, 105, 220, .16); font-size: 10px; font-weight: 800; white-space: nowrap; }.owner-access-form { display: flex; align-items: end; gap: 8px; margin-top: 12px; }.owner-access-form label { display: grid; flex: 1; gap: 5px; color: #bac5d9; font-size: 10px; font-weight: 800; }.owner-access-form input { width: 100%; height: 34px; padding: 0 9px; border: 1px solid #35415a; border-radius: 8px; color: #e9edf8; background: #0b111b; font-size: 11px; }.owner-access-note { margin: 12px 0 0; color: #9da9c0; font-size: 10px; }.owner-access-list { display: grid; gap: 6px; margin-top: 12px; }.owner-access-list > div { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 9px; border: 1px solid rgba(57, 70, 95, .62); border-radius: 8px; background: rgba(5, 10, 18, .28); }.owner-access-list strong, .owner-access-list small { display: block; overflow: hidden; max-width: 270px; text-overflow: ellipsis; white-space: nowrap; }.owner-access-list strong { color: #dde3f0; font-size: 10px; }.owner-access-list small, .owner-access-list > p { margin: 0; color: #8f9cb3; font-size: 9px; }.owner-access-list form { margin: 0; }.owner-access-revoke { min-height: 27px; padding: 0 8px; border: 1px solid rgba(229, 106, 127, .31); border-radius: 7px; color: #f0adb8; background: rgba(170, 57, 78, .12); font-size: 9px; font-weight: 850; }
.owner-settings { margin-top: 13px; border-top: 1px solid rgba(58,72,99,.62); }.owner-settings summary { padding-top: 13px; color: #bcb6ff; cursor: pointer; font-size: 11px; font-weight: 800; }.owner-settings-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; margin-top: 11px; }.owner-settings-grid > div { min-width: 0; }.owner-settings-grid strong { color: #e2e0f5; font-size: 11px; }.owner-settings-grid p { display: flex; justify-content: space-between; gap: 6px; margin: 6px 0; color: #96a3ba; font-size: 10px; }.owner-settings-grid code { overflow: hidden; color: #c8c1ff; text-overflow: ellipsis; }.owner-server-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }.owner-server-actions form { margin: 0; }.owner-open, .owner-disable { min-height: 34px; padding: 0 10px; border-radius: 8px; font-size: 11px; font-weight: 850; }.owner-open { border: 1px solid rgba(201,195,255,.20); color: #1d1839; background: #d2ccff; }.owner-disable { border: 1px solid rgba(228,103,125,.28); color: #f2aab5; background: rgba(181,57,81,.12); }.owner-empty { grid-column: 1 / -1; padding: 45px 20px; border: 1px dashed #3b4862; border-radius: 16px; color: #9ba8bd; text-align: center; }.owner-empty > span { display: grid; width: 42px; height: 42px; margin: 0 auto 10px; place-items: center; border-radius: 12px; color: #c9c3ff; background: rgba(121,107,237,.12); font-size: 20px; }.owner-empty h3 { margin: 0; color: #e4e7f0; font-size: 15px; }.owner-empty p { margin: 7px 0 0; font-size: 12px; }
.owner-invite-section { padding: 22px; border: 1px solid rgba(59,73,101,.84); border-radius: 18px; background: linear-gradient(145deg, rgba(18,25,39,.94), rgba(10,15,25,.97)); }.owner-invite-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 9px; }.owner-invite-grid a { display: flex; align-items: center; gap: 11px; padding: 12px; border: 1px solid rgba(66,80,108,.75); border-radius: 11px; color: #e8eaf3; background: rgba(7,12,20,.35); text-decoration: none; transition: .17s ease; }.owner-invite-grid a:hover { border-color: rgba(151,140,255,.68); background: rgba(111,96,218,.13); transform: translateY(-1px); }.owner-invite-icon { display: grid; flex: 0 0 auto; width: 32px; height: 32px; place-items: center; border-radius: 9px; color: #e9e6ff; background: rgba(134,120,255,.22); font-size: 20px; }.owner-invite-grid a > span:nth-child(2) { min-width: 0; }.owner-invite-grid strong, .owner-invite-grid small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.owner-invite-grid strong { font-size: 12px; }.owner-invite-grid small { margin-top: 3px; color: #91a0b8; font-size: 10px; }.owner-invite-grid b { margin-left: auto; color: #c5beff; font-size: 19px; font-weight: 500; }.owner-empty-line { margin: 4px 0; color: #9ba7ba; font-size: 12px; }.owner-disconnected { padding: 16px 20px; border: 1px solid rgba(89,71,85,.7); border-radius: 14px; background: rgba(55,29,38,.25); }.owner-disconnected > p:not(.eyebrow) { margin: 6px 0; color: #d0aab2; font-size: 11px; }.owner-disconnected span { color: #8f99ad; }.owner-back { margin: 21px 4px 0; }.owner-back a { color: #c8c2ff; font-size: 12px; font-weight: 800; text-decoration: none; }.owner-back a:hover { color: #f0eeff; }
@media (max-width: 760px) { .owner-page { padding: 14px 12px 36px; }.owner-hero { display: grid; gap: 24px; padding: 26px 21px; border-radius: 18px; }.owner-hero-side { align-items: stretch; flex-basis: auto; gap: 17px; }.owner-account { align-self: flex-start; }.owner-section-heading { margin-inline: 2px; }.owner-lock { display: none; }.owner-status-section { padding: 16px; border-radius: 14px; }.owner-status-form { grid-template-columns: 1fr 1fr; }.owner-status-messages { grid-column: 1 / -1; }.owner-access-form { display: grid; grid-template-columns: 1fr; }.owner-server-grid { grid-template-columns: 1fr; }.owner-server-card { padding: 16px; border-radius: 14px; }.billing-timeline { grid-template-columns: 1fr; }.billing-form { grid-template-columns: 1fr; }.owner-settings-grid { grid-template-columns: 1fr; }.owner-invite-section { padding: 17px; border-radius: 14px; }.owner-hero h1 { font-size: 34px; }.owner-state-stack { max-width: 115px; }.owner-server-name h3 { max-width: 155px; } }

/* Rozliczenia: kanał z podglądem oraz spokojny tryb wyłącznie do odczytu. */
.billing-dashboard-section { padding: 21px; border: 1px solid rgba(93, 116, 185, .56); border-radius: 18px; background: linear-gradient(135deg, rgba(31, 54, 101, .39), rgba(14, 20, 32, .96)); }
.billing-dashboard-form { display: grid; grid-template-columns: minmax(180px, 1fr) minmax(180px, 1fr) auto; align-items: end; gap: 10px; }
.billing-dashboard-form label { display: grid; gap: 5px; color: #c7cee0; font-size: 10px; font-weight: 800; }
.billing-dashboard-form select { width: 100%; min-width: 0; height: 36px; padding: 0 9px; border: 1px solid #39455d; border-radius: 8px; color: #eaf0fa; background: rgba(7, 12, 21, .70); font: inherit; font-size: 11px; }
.billing-dashboard-form .billing-save { min-width: 210px; min-height: 36px; margin: 0; }
.billing-dashboard-note { margin: 11px 0 0; color: #9facc2; font-size: 10px; line-height: 1.5; }
.billing-lock-notice { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 13px; margin: 0 0 18px; padding: 14px 16px; border: 1px solid rgba(241, 165, 76, .58); border-radius: 13px; color: #ffe0ae; background: linear-gradient(100deg, rgba(116, 68, 18, .37), rgba(68, 43, 20, .20)); }
.billing-lock-notice strong { display: block; color: #fff2d9; font-size: 13px; }.billing-lock-notice p { margin: 4px 0 0; color: #e9c99a; font-size: 11px; line-height: 1.45; }.billing-lock-icon { display: grid; width: 31px; height: 31px; place-items: center; border-radius: 9px; background: rgba(245, 165, 69, .18); font-size: 16px; }.billing-lock-notice a, .billing-lock-notice > span:last-child { padding: 7px 9px; border: 1px solid rgba(255, 212, 145, .35); border-radius: 8px; color: #ffe5bc; background: rgba(84, 48, 14, .20); font-size: 10px; font-weight: 850; text-decoration: none; white-space: nowrap; }.billing-lock-notice a:hover { background: rgba(119, 72, 19, .35); }
.billing-readonly .content .view button, .billing-readonly .content .view input, .billing-readonly .content .view select, .billing-readonly .content .view textarea { pointer-events: none; cursor: not-allowed; opacity: .48; filter: grayscale(.25); }.billing-readonly .content .view form, .billing-readonly .content .view .quick-panel { position: relative; }.billing-readonly .content .view form::after, .billing-readonly .content .view .quick-panel::after { position: absolute; inset: 0; z-index: 3; border-radius: inherit; background: rgba(10, 13, 19, .12); content: ""; cursor: not-allowed; }
@media (max-width: 760px) { .billing-dashboard-section { padding: 16px; border-radius: 14px; }.billing-dashboard-form { grid-template-columns: 1fr; }.billing-dashboard-form .billing-save { width: 100%; min-width: 0; }.billing-lock-notice { grid-template-columns: auto 1fr; }.billing-lock-notice a, .billing-lock-notice > span:last-child { grid-column: 1 / -1; justify-self: start; } }

/* Ekran rozliczeniowy jest samodzielny, więc nie znika, gdy zwykły panel
   nie może jeszcze pobrać danych serwera po zakończeniu usługi. */
.billing-blocked-page { min-height: 100vh; margin: 0; background: radial-gradient(circle at 13% 8%, rgba(161, 100, 32, .22), transparent 30rem), radial-gradient(circle at 88% 88%, rgba(122, 77, 197, .16), transparent 28rem), #090b10; color: #eef2fa; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }.billing-blocked-shell { display: grid; min-height: 100vh; place-items: center; padding: 24px; box-sizing: border-box; }.billing-blocked-card { width: min(570px, 100%); padding: 42px; box-sizing: border-box; border: 1px solid rgba(239, 170, 80, .46); border-radius: 24px; background: linear-gradient(145deg, rgba(54, 37, 25, .96), rgba(18, 22, 31, .98)); box-shadow: 0 32px 90px rgba(0, 0, 0, .43); text-align: center; }.billing-blocked-mark { display: grid; width: 62px; height: 62px; place-items: center; margin: 0 auto 20px; border: 1px solid rgba(255, 202, 126, .38); border-radius: 19px; color: #ffd48e; background: rgba(171, 99, 22, .17); box-shadow: 0 10px 28px rgba(0, 0, 0, .18); font-size: 29px; }.billing-blocked-card .eyebrow { margin: 0 0 9px; color: #e4b876; font-size: 10px; font-weight: 900; letter-spacing: .14em; }.billing-blocked-card h1 { margin: 0; color: #fff7e9; font-size: clamp(28px, 5vw, 40px); letter-spacing: -1.25px; }.billing-blocked-card > p:not(.eyebrow) { margin: 15px auto 0; color: #d6c3a9; font-size: 14px; line-height: 1.65; }.billing-blocked-card > p strong { color: #fff2d9; }.billing-blocked-status { display: flex; align-items: center; justify-content: center; gap: 8px; margin: 25px 0 0; padding: 11px; border: 1px solid rgba(241, 177, 89, .27); border-radius: 10px; color: #f5cd91; background: rgba(123, 76, 27, .14); font-size: 11px; }.billing-blocked-status span { width: 8px; height: 8px; border-radius: 50%; background: #f1ad55; box-shadow: 0 0 0 5px rgba(241, 173, 85, .12); animation: billing-wait-pulse 1.5s ease-in-out infinite; }.billing-blocked-small { color: #aa9a84 !important; font-size: 11px !important; }.billing-blocked-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 9px; margin-top: 25px; }.billing-blocked-actions a { min-height: 38px; padding: 0 14px; display: inline-flex; align-items: center; justify-content: center; border-radius: 9px; font-size: 11px; font-weight: 850; text-decoration: none; }.billing-blocked-primary { color: #20170b; background: linear-gradient(135deg, #ffd88e, #eca64a); }.billing-blocked-secondary { border: 1px solid rgba(224, 207, 177, .24); color: #e5d9c6; background: rgba(255, 255, 255, .04); }.billing-blocked-card > small { display: block; margin-top: 25px; color: #8e8477; font-size: 10px; }@keyframes billing-wait-pulse { 50% { transform: scale(.72); opacity: .58; } }@media (max-width: 560px) { .billing-blocked-shell { padding: 15px; }.billing-blocked-card { padding: 31px 22px; border-radius: 18px; }.billing-blocked-actions { display: grid; }.billing-blocked-actions a { width: 100%; box-sizing: border-box; } }

/* Kreator globalnego wyglądu wiadomości Discord. */
.embed-settings-form { background: linear-gradient(145deg, rgba(72, 60, 145, .18), rgba(14, 19, 29, .96) 58%); }.embed-brand-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 16px 0; }.embed-brand-wide { grid-column: 1 / -1; }.embed-live-preview { margin:18px 0; overflow:hidden; border:1px solid rgba(122,139,181,.38); border-radius:12px; background:linear-gradient(135deg,rgba(27,33,49,.86),rgba(9,13,21,.82)); }.embed-preview-heading { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:14px 15px; border-bottom:1px solid rgba(97,112,148,.28); }.embed-preview-heading .eyebrow { margin:0 0 4px; }.embed-preview-heading h3 { margin:0; color:#edf1fb; font-size:13px; }.embed-preview-heading label { display:grid; gap:4px; color:#aab7cc; font-size:9px; font-weight:800; }.embed-preview-heading select { min-width:175px; padding:7px 8px; border:1px solid #35425a; border-radius:7px; color:#dfe5f2; background:#0c1320; font:inherit; font-size:10px; }.embed-preview-discord { display:grid; grid-template-columns:30px minmax(0,1fr); gap:9px; padding:16px; background:radial-gradient(circle at 100% 0,rgba(110,96,221,.15),transparent 15rem),#161b25; }.embed-preview-avatar { display:grid; width:30px; height:30px; place-items:center; border-radius:50%; color:#25203f; background:linear-gradient(135deg,#cfc8ff,#8978f4); font-size:12px; font-weight:900; }.embed-preview-message > strong { color:#f1f3f8; font-size:11px; }.embed-preview-message > strong span { margin-left:4px; padding:2px 4px; border-radius:3px; color:#fff; background:#5865f2; font-size:7px; vertical-align:1px; }.embed-preview-message > small { margin-left:6px; color:#8995a9; font-size:8px; }.embed-preview-card { position:relative; max-width:590px; margin-top:6px; padding:12px 14px 11px 16px; overflow:hidden; border-radius:4px; color:#dce2ee; background:#2b2d31; }.embed-preview-card > i { position:absolute; inset:0 auto 0 0; width:4px; background:var(--embed-preview-color,#5865f2); }.embed-preview-card h4 { margin:7px 70px 6px 0; color:#fff; font-size:12px; line-height:1.35; }.embed-preview-card p { max-width:455px; margin:0; white-space:pre-line; color:#d2d7e1; font-size:10px; line-height:1.5; }.embed-preview-author { display:flex; align-items:center; gap:5px; min-height:13px; margin-right:76px; color:#fff; font-size:9px; font-weight:750; }.embed-preview-author img { width:13px; height:13px; border-radius:50%; object-fit:cover; }.embed-preview-thumbnail { position:absolute; top:13px; right:14px; width:58px; height:58px; overflow:hidden; border-radius:4px; background:#17191d; }.embed-preview-thumbnail img { width:100%; height:100%; object-fit:cover; }.embed-preview-image { display:block; width:100%; max-height:170px; margin-top:10px; border-radius:4px; object-fit:cover; }.embed-preview-card footer { margin-top:11px; color:#a6adbb; font-size:8px; }.embed-preview-note { margin:0; padding:9px 15px; border-top:1px solid rgba(97,112,148,.22); color:#99a6bd; background:rgba(5,8,14,.22); font-size:9px; line-height:1.45; }.embed-template-list { display: grid; gap: 8px; margin: 15px 0 18px; }.embed-template-card { overflow: hidden; border: 1px solid #303b50; border-radius: 10px; background: rgba(8, 12, 19, .38); }.embed-template-card summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 13px; cursor: pointer; list-style: none; }.embed-template-card summary::-webkit-details-marker { display: none; }.embed-template-card summary span { display: grid; gap: 3px; }.embed-template-card summary strong { color: #e9edfa; font-size: 12px; }.embed-template-card summary small { color: #8e9cb5; font-size: 10px; line-height: 1.35; }.embed-template-card summary b { padding: 4px 7px; border: 1px solid rgba(142, 129, 255, .35); border-radius: 6px; color: #c6bfff; background: rgba(95, 79, 202, .12); font-size: 9px; }.embed-template-card[open] summary { border-bottom: 1px solid #303b50; background: rgba(89, 74, 180, .11); }.embed-template-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; padding: 13px; }.embed-template-fields label { display: grid; gap: 5px; color: #c4cede; font-size: 10px; font-weight: 750; }.embed-template-fields input, .embed-template-fields textarea, .embed-brand-grid input { width: 100%; min-width: 0; box-sizing: border-box; }.embed-template-fields textarea { min-height: 60px; resize: vertical; }.embed-template-fields label:nth-last-child(4), .embed-template-fields label:nth-last-child(3) { grid-column: 1 / -1; }@media (max-width: 680px) { .embed-brand-grid, .embed-template-fields { grid-template-columns: 1fr; }.embed-brand-wide, .embed-template-fields label:nth-last-child(4), .embed-template-fields label:nth-last-child(3) { grid-column: auto; }.embed-preview-heading { align-items:start; flex-direction:column; }.embed-preview-heading select { min-width:0; width:100%; } }