.dashboard-body {
  min-height: 100vh;
  --bg: #24242b;
  --surface: #2a2a32;
  --surface-raised: #34343f;
  --pink: #626cff;
  --pink-bright: #aab0ff;
  --line: rgba(195,197,225,.13);
}
.dashboard-body [hidden] { display: none !important; }
.dashboard-body::before { display: none; }
.dashboard-body .site-header { min-height: 50px; border-bottom-color: rgba(255,255,255,.045); background: #202027; }
.dashboard-body .nav { min-height: 50px; }
.dashboard-body .brand-mark { border-color: rgba(111,121,255,.4); background: rgba(98,108,255,.13); color: #aab0ff; }
.dashboard-body .brand-dot { color: #8790ff; }
.back-link { color: #b7b0ba; font-size: 11px; }
.back-link:hover { color: var(--pink-bright); }
.dashboard-shell { min-height: calc(100vh - 50px); }
.login-view { min-height: calc(100vh - 50px); display: grid; place-items: center; padding: 45px 20px; background: radial-gradient(ellipse at 50% 40%,rgba(95,105,245,.14),transparent 40%); }
.login-card { width: min(440px,100%); padding: 38px; border: 1px solid var(--line); border-radius: 18px; background: rgba(26,23,32,.92); box-shadow: 0 25px 80px rgba(0,0,0,.24); }
.login-mark { width: 52px; height: 52px; display: grid; place-items: center; margin-bottom: 27px; border: 1px solid rgba(243,154,184,.35); border-radius: 16px; background: rgba(243,154,184,.1); color: var(--pink-bright); font-size: 28px; }
.login-card h1,.welcome-row h1,.page-heading h1 { margin: 11px 0; font-family: "Space Grotesk",sans-serif; font-size: 38px; line-height: 1.15; letter-spacing: -.05em; }
.login-card > p:not(.setup-warning) { margin: 13px 0 23px; color: var(--muted); font-size: 12px; line-height: 1.9; }
.login-card form { display: grid; gap: 10px; }
.login-card form .field-label { margin: 0; }
.login-card form .text-input { width: 100%; margin-bottom: 7px; }
.login-button { width: 100%; }
.discord-login-button { width: 100%; justify-content: center; gap: 10px; margin: 18px 0 4px; background: #5865f2; color: #fff; }
.discord-login-button:hover { background: #6975ff; color: #fff; }
.login-divider { display: flex; align-items: center; gap: 10px; margin: 17px 0; color: #8e8793; font-size: 9px; }
.login-divider::before,.login-divider::after { height: 1px; flex: 1; background: var(--line); content: ""; }
.dashboard-body .button:disabled { opacity: .48; cursor: not-allowed; transform: none; }
.login-card > .back-link { display: inline-block; margin-top: 21px; }
.setup-warning { padding: 12px; border: 1px solid rgba(255,191,109,.2); border-radius: 8px; background: rgba(255,191,109,.06); color: #e6c691; font-size: 11px; }
.dashboard-view { min-height: calc(100vh - 50px); display: grid; grid-template-columns: 235px 1fr; }
.sidebar { position: sticky; top: 50px; height: calc(100vh - 50px); display: flex; flex-direction: column; padding: 25px 15px 16px; border-right: 1px solid var(--line); background: linear-gradient(160deg,#353541,#2b2b35 72%); }
.sidebar-brand { display: flex; align-items: center; gap: 10px; padding: 0 8px 26px; font-family: "Space Grotesk",sans-serif; font-size: 17px; font-weight: 700; }
.sidebar-brand small { display: block; margin-top: 1px; color: #7e7783; font-family: "DM Sans",sans-serif; font-size: 8px; font-weight: 600; letter-spacing: .12em; }
.server-picker { padding: 15px 8px 19px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.server-picker label { display: block; margin-bottom: 8px; color: #8e8793; font-size: 8px; font-weight: 700; letter-spacing: .13em; }
.server-picker select { width: 100%; min-height: 38px; padding: 0 9px; border: 1px solid rgba(255,255,255,.1); border-radius: 7px; background: #211e28; color: #ece5ed; font-size: 10px; }
.sidebar-user { display: grid; justify-items: center; gap: 5px; padding: 0 8px 18px; color: #f0eff7; font-size: 11px; font-weight: 700; }
.sidebar-user img { width: 62px; height: 62px; margin-bottom: 4px; border: 2px solid rgba(255,255,255,.12); border-radius: 50%; object-fit: cover; }
.sidebar-user small { color: #aaa9b7; font-size: 8px; letter-spacing: .12em; }
.side-links { display: grid; gap: 4px; overflow-y: auto; padding-top: 8px; }
.side-group-label { margin: 8px 0 2px; color: #aaa8b6; font-size: 8px; font-weight: 700; letter-spacing: .13em; }
.side-link { width: 100%; min-height: 39px; display: flex; align-items: center; gap: 11px; padding: 0 10px; border: 0; border-radius: 7px; background: transparent; color: #a7a0ab; text-align: left; font-size: 11px; cursor: pointer; }
.side-link > span { width: 16px; color: #d3d2e0; text-align: center; font-size: 14px; }
.side-link:hover,.side-link.active { background: #606bfa; color: #fff; }
.side-link.active > span { color: #fff; }
.sidebar-bottom { display: grid; gap: 4px; margin-top: auto; padding-top: 14px; border-top: 1px solid var(--line); }
.logout-button { font-family: inherit; }
.dashboard-main { min-width: 0; }
.dashboard-topbar { min-height: 64px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0 34px; border-bottom: 1px solid var(--line); background: rgba(32,32,39,.85); }
.dashboard-topbar .eyebrow { font-size: 8px; }
.dashboard-topbar > div:first-child > p { margin: 2px 0 0; color: #e9e2ea; font-size: 11px; }
.profile-chip { display: flex; align-items: center; gap: 9px; color: #c9c1cb; font-size: 10px; }
.profile-chip img { width: 28px; height: 28px; border-radius: 50%; }
.online-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--green); box-shadow: 0 0 11px rgba(141,224,194,.5); }
.offline-dot { background: #e7838a; box-shadow: 0 0 11px rgba(231,131,138,.4); }
.dashboard-content { width: min(1050px,100%); margin-inline: auto; padding: 32px 35px 20px; }
.dashboard-notice { margin-bottom: 18px; padding: 11px 14px; border: 1px solid rgba(141,224,194,.2); border-radius: 8px; background: rgba(141,224,194,.06); color: #a8e8d0; font-size: 11px; }
.dashboard-notice.error { border-color: rgba(255,127,137,.24); background: rgba(255,127,137,.06); color: #ffafb5; }
.welcome-row { display: flex; align-items: center; justify-content: space-between; margin-bottom: 23px; }
.welcome-row .eyebrow,.page-heading .eyebrow { font-size: 9px; }
.welcome-row h1,.page-heading h1 { margin: 8px 0 4px; font-size: 34px; }
.welcome-row p,.page-heading > p { margin: 0; color: var(--muted); font-size: 11px; }
.welcome-row strong { color: #e9e2ea; }
.blossom-badge { width: 55px; height: 55px; display: grid; place-items: center; border: 1px solid rgba(243,154,184,.25); border-radius: 16px; background: rgba(243,154,184,.09); color: var(--pink-bright); font-size: 28px; }
.stats-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 11px; margin-bottom: 14px; }
.stat-card,.panel-card,.settings-card { border: 1px solid var(--line); border-radius: 11px; background: linear-gradient(150deg,rgba(255,255,255,.035),rgba(255,255,255,.012)); }
.stat-card { min-height: 112px; padding: 15px; }
.stat-card > span { display: block; margin-bottom: 10px; color: #89828e; font-size: 8px; font-weight: 700; letter-spacing: .1em; }
.stat-card strong { display: flex; align-items: center; gap: 7px; font-size: 14px; }
.stat-card strong b { font-size: 13px; font-weight: 600; }
.stat-card strong code { font-size: 15px; }
.stat-card small { display: block; margin-top: 6px; color: #928b97; font-size: 9px; }
.panel-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 11px; }
.panel-card { min-height: 195px; padding: 18px; }
.panel-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
.panel-card .eyebrow { font-size: 8px; }
.panel-card h2 { margin: 5px 0 12px; font-family: "Space Grotesk",sans-serif; font-size: 17px; }
.panel-card > p { max-width: 340px; margin: 9px 0 15px; color: var(--muted); font-size: 10px; line-height: 1.9; }
.panel-card .text-link { font-size: 9px; }
.quick-list { display: grid; }
.quick-list > div { min-height: 40px; display: flex; align-items: center; gap: 9px; border-top: 1px solid rgba(255,255,255,.045); }
.quick-list b,.quick-list small { display: block; }
.quick-list b { font-size: 10px; font-weight: 600; }
.quick-list small { margin-top: 2px; color: #928b97; font-size: 9px; }
.quick-icon { width: 25px; height: 25px; display: grid; place-items: center; border-radius: 7px; background: rgba(243,154,184,.1); color: var(--pink-bright); font-size: 12px; }
.quick-green { background: rgba(141,224,194,.09); color: var(--green); }
.quick-blue { background: rgba(113,181,255,.1); color: #93c9ff; }
.analytics-summary { margin-top: 15px; }
.welcome-banner-preview { position: relative; width: 100%; aspect-ratio: 10 / 3; min-height: 120px; overflow: hidden; margin: 12px 0 16px; border: 1px solid rgba(255,255,255,.1); border-radius: 12px; background: linear-gradient(110deg,#100e19,#321f2d 62%,#7d433f); background-position: center; background-size: cover; }
.card-background-previews { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; margin-top: 15px; }
.card-background-preview-card { min-width: 0; display: grid; gap: 8px; padding: 0; border: 0; background: transparent; color: inherit; text-align: left; cursor: pointer; }
.card-preview-caption { display: flex; align-items: center; justify-content: space-between; gap: 6px; color: #e8e5f1; font-size: 10px; font-weight: 700; }
.card-preview-caption small { color: #a4a1b5; font-size: 8px; font-weight: 500; }
.card-background-preview { position: relative; display: grid; place-items: center; overflow: hidden; width: 100%; border: 1px solid rgba(255,255,255,.15); border-radius: 12px; background: linear-gradient(135deg,#25233c,#54415f 55%,#a55682); color: rgba(255,255,255,.82); text-align: center; box-shadow: 0 10px 24px rgba(0,0,0,.2); transition: transform .18s ease,border-color .18s ease,box-shadow .18s ease; }
.card-background-preview-card:hover .card-background-preview,.card-background-preview-card:focus-visible .card-background-preview { transform: translateY(-2px); border-color: rgba(170,176,255,.65); box-shadow: 0 15px 32px rgba(12,12,24,.35),0 0 0 2px rgba(124,131,255,.12); }
.card-background-preview-card:focus-visible { outline: none; }
.profile-card-preview { aspect-ratio: 0.88 / 1; }
.rank-card-preview { aspect-ratio: 2.1 / 1; background: linear-gradient(115deg,#171a39,#543157 60%,#9b4e83); }
.card-background-preview img { position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; object-fit: cover; }
.card-background-preview::after { position: absolute; inset: 0; z-index: 1; background: linear-gradient(135deg,rgba(8,9,20,.62),rgba(8,9,20,.18)); content: ""; }
.card-background-preview > span,.card-background-preview > b { position: relative; z-index: 2; text-shadow: 0 2px 8px rgba(0,0,0,.8); }
.card-background-preview > #profile-card-background-empty,.card-background-preview > #rank-card-background-empty { padding: 8px; color: #eeeaf5; font-size: 10px; }
.card-background-preview > b { position: absolute; right: 9px; bottom: 8px; padding: 4px 7px; border: 1px solid rgba(255,255,255,.2); border-radius: 20px; background: rgba(12,12,22,.55); color: #fff; font-size: 8px; }
.profile-demo,.rank-demo { position: absolute !important; inset: 0; display: flex; z-index: 2 !important; padding: 12px; color: #fff; text-align: left; }
.profile-demo { flex-direction: column; align-items: center; background: linear-gradient(180deg,rgba(9,11,26,.05),rgba(9,11,26,.76)); }
.demo-server-name { max-width: 100%; overflow: hidden; color: #d7d4ff; font-size: 7px; font-weight: 800; letter-spacing: .15em; text-overflow: ellipsis; white-space: nowrap; }
.profile-demo > .demo-server-name { align-self: flex-start; }
.demo-avatar { position: relative; width: clamp(36px,7vw,61px); aspect-ratio: 1; display: grid; place-items: center; overflow: hidden; margin: 9% 0 5px; border: 2px solid rgba(211,199,255,.9); border-radius: 50%; background: linear-gradient(145deg,#ed9cbb,#6562a7); box-shadow: 0 0 0 4px rgba(145,116,255,.18),0 6px 18px rgba(0,0,0,.38); font-family: "Space Grotesk",sans-serif; font-size: 20px; font-weight: 700; }
.demo-avatar img,.rank-demo-avatar img { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; border-radius: inherit; object-fit: cover; }
.demo-avatar b,.rank-demo-avatar b { z-index: 0; }
.demo-profile-name { max-width: 100%; overflow: hidden; font-family: "Space Grotesk",sans-serif; font-size: clamp(12px,2.1vw,18px); text-overflow: ellipsis; white-space: nowrap; }
.demo-profile-tag { margin-top: 1px; color: #d2cddd; font-size: 8px; }
.demo-profile-stats { width: 100%; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 5px; margin-top: auto; }
.demo-profile-stats > span { display: flex; flex-direction: column; gap: 2px; padding: 6px 7px; border: 1px solid rgba(255,255,255,.16); border-radius: 7px; background: rgba(13,15,34,.5); color: #c5c2d4; font-size: 6px; letter-spacing: .08em; }
.demo-profile-stats b { color: #fff; font-family: "Space Grotesk",sans-serif; font-size: 11px; letter-spacing: 0; }
.demo-progress { width: 100%; height: 4px; overflow: hidden; margin-top: 6px; border-radius: 9px; background: rgba(255,255,255,.24); }
.demo-progress i { width: 71%; height: 100%; display: block; border-radius: inherit; background: linear-gradient(90deg,#9c91ff,#f29ac5); }
.rank-demo { align-items: center; gap: 10px; padding: 10px; background: linear-gradient(105deg,rgba(9,11,26,.67),rgba(9,11,26,.16)); }
.rank-demo-avatar { position: relative; flex: 0 0 23%; aspect-ratio: 1; display: grid; place-items: center; border: 2px solid rgba(200,190,255,.9); border-radius: 50%; background: linear-gradient(145deg,#ed9cbb,#6562a7); box-shadow: 0 0 0 4px rgba(145,116,255,.18),0 8px 18px rgba(0,0,0,.36); font-family: "Space Grotesk",sans-serif; font-size: 24px; }
.rank-demo-content { min-width: 0; flex: 1; display: flex; flex-direction: column; align-items: flex-start; }
.rank-demo-content .demo-server-name { font-size: 6px; }
.rank-demo-name { max-width: 100%; overflow: hidden; margin-top: 4px; font-family: "Space Grotesk",sans-serif; font-size: clamp(12px,2vw,18px); text-overflow: ellipsis; white-space: nowrap; }
.rank-demo-content .demo-profile-tag { font-size: 7px; }
.rank-demo-stats { width: 100%; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 4px; margin-top: auto; }
.rank-demo-stats span { display: flex; flex-direction: column; gap: 2px; padding: 5px; border-left: 1px solid rgba(255,255,255,.2); color: #c7c3d6; font-size: 5px; letter-spacing: .06em; }
.rank-demo-stats b { color: #fff; font-size: 9px; letter-spacing: 0; }
.rank-demo-xp { width: 100%; display: flex; justify-content: space-between; margin-top: 4px; color: #d7d3e2; font-size: 6px; }
.rank-demo-xp b { color: #fff; }
.welcome-avatar-preview { position: absolute; display: grid; place-items: center; transform: translate(-50%,-50%); border: 3px solid rgba(255,202,177,.9); border-radius: 50%; background: linear-gradient(145deg,#ee9daf,#82576b); color: #fff; font-family: "Space Grotesk",sans-serif; font-size: clamp(14px,3vw,26px); font-weight: 700; }
.welcome-preview-copy strong,.welcome-preview-copy span { position: absolute; display: block; max-width: 70%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-shadow: 0 2px 6px rgba(0,0,0,.8); }
.welcome-preview-copy strong { font-family: "Space Grotesk",sans-serif; }
.welcome-preview-copy span { max-width: 72%; }
.color-input { min-height: 42px; padding: 4px; cursor: pointer; }
.field-grid input[type="file"] { min-width: 0; font-size: 10px; }
.field-grid input[type="file"]::file-selector-button { margin-right: 8px; padding: 7px 9px; border: 0; border-radius: 5px; background: rgba(243,154,184,.12); color: #f3c8d6; font: inherit; }
.settings-card > .button-quiet { margin-top: 10px; }
.analytics-card { min-height: 225px; margin-bottom: 12px; padding: 18px; }
.analytics-card h2 { margin: 5px 0 0; font-family: "Space Grotesk",sans-serif; font-size: 17px; }
.analytics-legend { display: flex; align-items: center; gap: 7px; color: #aaa3ad; font-size: 9px; }
.analytics-legend i { width: 8px; height: 8px; border-radius: 50%; background: var(--pink); }
.analytics-chart { min-height: 145px; display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); gap: 9px; align-items: end; padding: 20px 4px 2px; }
.analytics-day { min-width: 0; display: grid; grid-template-rows: 15px 90px 16px; justify-items: center; gap: 5px; }
.analytics-value { color: #aaa3ad; font-size: 8px; }
.analytics-track { width: min(28px,70%); height: 100%; display: flex; align-items: end; overflow: hidden; border-radius: 6px 6px 3px 3px; background: rgba(255,255,255,.035); }
.analytics-track i { width: 100%; min-height: 4px; display: block; border-radius: 6px 6px 3px 3px; background: linear-gradient(180deg,#ffc0d1,#c96e91); transition: height .35s ease; }
.analytics-day small { color: #8d8692; font-size: 8px; }
.server-detail-grid { margin-top: 12px; }
.settings-tools { display: flex; flex-wrap: wrap; gap: 8px; margin: -5px 0 14px; }
.settings-tools .button { min-height: 34px; font-size: 9px; }
.settings-tools .button:disabled { opacity: .45; cursor: not-allowed; transform: none; }
.permission-note { display: flex; align-items: center; gap: 8px; padding: 9px; border: 1px solid rgba(141,224,194,.14); border-radius: 7px; background: rgba(141,224,194,.04); color: #a9dec9; font-size: 9px; }
.page-heading { margin-bottom: 20px; }
.page-heading h1 { margin-top: 7px; font-size: 35px; }
.settings-card { margin-bottom: 11px; padding: 18px 20px; }
.settings-card-head { display: flex; align-items: flex-start; gap: 11px; margin-bottom: 15px; }
.settings-icon { flex: 0 0 34px; height: 34px; display: grid; place-items: center; border-radius: 9px; background: rgba(243,154,184,.1); color: var(--pink-bright); }
.settings-green { background: rgba(141,224,194,.09); color: var(--green); }
.settings-blue { background: rgba(113,181,255,.1); color: #93c9ff; }
.settings-orange { background: rgba(255,185,126,.1); color: #ffc18d; }
.settings-pink { background: rgba(243,154,184,.1); color: var(--pink-bright); }
.settings-purple { background: rgba(191,157,255,.1); color: #c8a9ff; }
.settings-card h2 { margin: 0 0 3px; font-size: 13px; }
.settings-card-head p { margin: 0; color: #968f9a; font-size: 9px; }
.field-label { display: block; margin: 11px 0 6px; color: #d3ccd5; font-size: 10px; font-weight: 600; }
.field-label > span { margin-left: 6px; color: #89828e; font-size: 9px; font-weight: 400; }
.text-input,.select-input { width: 100%; min-height: 37px; padding: 0 11px; border: 1px solid rgba(255,255,255,.1); border-radius: 7px; outline: none; background: #15131b; color: #e8e1e9; font-size: 10px; }
.text-input:focus,.select-input:focus { border-color: rgba(243,154,184,.5); box-shadow: 0 0 0 2px rgba(243,154,184,.08); }
.prefix-input { max-width: 150px; font-family: Consolas,monospace; }
.field-hint { margin: 6px 0 0; color: #817a86; font-size: 9px; }
.toggle-row { position: relative; min-height: 54px; display: flex; align-items: center; justify-content: space-between; gap: 15px; border-top: 1px solid rgba(255,255,255,.05); cursor: pointer; }
.toggle-row > span b,.toggle-row > span small { display: block; }
.toggle-row > span b { color: #e1dbe3; font-size: 10px; font-weight: 600; }
.toggle-row > span small { margin-top: 3px; color: #8f8894; font-size: 9px; }
.toggle-row input { position: absolute; right: 0; width: 1px; height: 1px; opacity: 0; }
.toggle-row > i { flex: 0 0 35px; width: 35px; height: 19px; border: 1px solid rgba(255,255,255,.13); border-radius: 99px; background: #35303a; transition: .18s; }
.toggle-row > i::after { display: block; width: 13px; height: 13px; margin: 2px; border-radius: 50%; background: #c3bbc6; content: ""; transition: .18s; }
.toggle-row input:checked + i { border-color: rgba(243,154,184,.55); background: #b65f82; }
.toggle-row input:checked + i::after { transform: translateX(16px); background: white; }
.toggle-row input:focus-visible + i { outline: 2px solid var(--pink-bright); outline-offset: 3px; }
.field-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.save-bar { position: sticky; bottom: 0; z-index: 4; display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 14px -10px 0; padding: 12px 10px; border: 1px solid var(--line); border-radius: 10px; background: rgba(25,22,30,.96); backdrop-filter: blur(12px); }
.save-bar > span { color: #97909b; font-size: 9px; }
.save-bar > span.unsaved { color: #ffc18d; }
.save-bar .button { min-height: 38px; font-size: 10px; }
.dashboard-footer { display: flex; align-items: center; gap: 18px; padding: 23px 0 5px; color: #79727e; font-size: 8px; }
.dashboard-footer > span:first-child { color: #aaa1ac; font-weight: 700; letter-spacing: .1em; }
.dashboard-footer a { margin-left: auto; }
.dashboard-footer a:hover { color: var(--pink-bright); }
@media (max-width: 900px) { .dashboard-view { grid-template-columns: 190px 1fr; }.dashboard-content { padding-inline: 21px; }.sidebar { padding-inline: 10px; }.panel-grid { grid-template-columns: 1fr; }.analytics-summary,.server-detail-grid { grid-template-columns: repeat(3,minmax(0,1fr)); } }
@media (max-width: 680px) {
  .dashboard-view { display: block; }.sidebar { position: static; height: auto; padding: 10px 16px; border-right: 0; border-bottom: 1px solid var(--line); }.sidebar-brand,.sidebar-user { display: none; }.sidebar-bottom { display: flex; justify-content: flex-end; gap: 5px; margin-top: 5px; padding-top: 5px; border-top: 0; }.server-picker { display: flex; align-items: center; gap: 10px; padding: 0; border: 0; }.server-picker label { flex: 0 0 auto; margin: 0; }.server-picker select { max-width: 290px; }.side-links { display: flex; gap: 5px; overflow-x: auto; padding-top: 9px; }.side-group-label { display: none; }.side-link { width: auto; flex: 0 0 auto; min-height: 34px; padding-inline: 9px; font-size: 9px; }.side-link > span { width: auto; }.dashboard-topbar { min-height: 59px; padding-inline: 17px; }.dashboard-content { padding: 24px 16px 16px; }.stats-grid { grid-template-columns: 1fr; gap: 7px; }.stat-card { min-height: auto; }.stat-card > span { margin-bottom: 5px; }.stat-card small { margin-top: 2px; }.welcome-row h1 { font-size: 29px; }.panel-grid { grid-template-columns: 1fr; }.settings-card { padding: 15px; }.field-grid { grid-template-columns: 1fr; gap: 2px; }.dashboard-footer { flex-wrap: wrap; gap: 7px 12px; }.dashboard-footer a { margin-left: 0; }.login-card { padding: 27px 22px; }.login-card h1 { font-size: 33px; }
  .analytics-summary,.server-detail-grid { grid-template-columns: 1fr; }.analytics-card { padding: 14px; }.analytics-chart { gap: 4px; }.analytics-day { grid-template-rows: 14px 78px 16px; }.analytics-track { width: 65%; }.save-bar { align-items: flex-start; flex-direction: column; }.save-bar .button { width: 100%; }
  .service-health { grid-template-columns: 1fr; }
}
.analytics-range { width: auto; min-width: 145px; }
.settings-tools > .field-label { align-self: center; margin: 0; }
.settings-card select[multiple] { height: auto; min-height: 100px; padding: 8px; }
.message-input { min-height: 92px; padding: 9px 11px; resize: vertical; font: inherit; line-height: 1.6; }
.message-preview { margin: 12px 0 0; padding: 12px; border: 1px solid rgba(243,154,184,.2); border-radius: 8px; background: rgba(243,154,184,.06); color: #eee3eb; font-size: 11px; line-height: 1.7; white-space: pre-wrap; }
.save-bar > div { display: flex; gap: 8px; }
.notification-list { display: grid; gap: 10px; }
.health-card { padding: 16px 18px; border: 1px solid rgba(255,191,109,.2); border-radius: 10px; background: rgba(255,191,109,.05); }
.health-card strong { color: #f0c990; font-size: 12px; }
.health-card p { margin: 6px 0 0; color: #aaa1a9; font-size: 10px; line-height: 1.7; }
.health-card.healthy { border-color: rgba(141,224,194,.2); background: rgba(141,224,194,.05); }
.health-card.healthy strong { color: #a8e8d0; }
.service-health { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 9px; margin-bottom: 12px; }
.service-card { display: grid; gap: 5px; padding: 14px; border: 1px solid rgba(141,224,194,.18); border-radius: 9px; background: rgba(141,224,194,.045); }
.service-card strong { color: #c9c1cb; font-size: 10px; }
.service-card span { color: #a8e8d0; font-size: 12px; font-weight: 700; }
.service-card small { color: #928b97; font-size: 9px; line-height: 1.5; }
.service-card.service-offline { border-color: rgba(255,127,137,.24); background: rgba(255,127,137,.045); }
.service-card.service-offline span { color: #ffafb5; }
.analytics-chart-scroll { overflow-x: auto; overscroll-behavior-inline: contain; }
.analytics-print-table { display: none; }
.message-builder-toolbar { display: grid; grid-template-columns: minmax(150px,.8fr) minmax(150px,.9fr) minmax(0,1.35fr) minmax(175px,.85fr); align-items: end; gap: 10px; margin: 18px 0 15px; padding: 14px; border: 1px solid var(--line); border-radius: 12px; background: linear-gradient(145deg,rgba(255,255,255,.04),rgba(255,255,255,.015)); box-shadow: 0 12px 30px rgba(0,0,0,.12); }
.message-toolbar-field { min-width: 0; }
.message-builder-toolbar .field-label { margin: 0 0 6px; }
.message-builder-toolbar .text-input,.message-builder-toolbar .select-input { min-width: 0; min-height: 36px; }
.message-toolbar-actions { display: flex; flex-wrap: wrap; align-items: end; gap: 6px; min-width: 0; }
.message-builder-toolbar .button { min-height: 36px; flex: 1 1 auto; padding-inline: 10px; font-size: 9px; white-space: nowrap; }
.message-builder-toolbar .button:disabled { opacity: .4; }
.message-mode-tabs { display: flex; width: fit-content; max-width: 100%; gap: 3px; overflow-x: auto; margin-bottom: 12px; padding: 4px; border: 1px solid rgba(255,255,255,.05); border-radius: 9px; background: rgba(255,255,255,.055); scrollbar-width: thin; }
.message-mode-tab { min-width: 86px; min-height: 30px; border: 0; border-radius: 6px; background: transparent; color: #b7b6c3; font: inherit; font-size: 10px; cursor: pointer; }
.message-mode-tab.active { background: #606bfa; color: #fff; }
.builder-content { min-height: 88px; margin-bottom: 14px; font-size: 11px; }
.message-content-area { margin-bottom: 14px; }
.message-content-area .field-label { margin-top: 0; }
.message-content-area .builder-content { margin: 0; }
.embed-builder-layout { display: grid; grid-template-columns: minmax(0,1.05fr) minmax(310px,.95fr); align-items: start; gap: 14px; }
.embed-builder-form { display: grid; gap: 11px; }
.embed-option-card { min-width: 0; padding: 16px; border: 1px solid rgba(255,255,255,.09); border-radius: 10px; background: rgba(255,255,255,.025); }
.embed-option-card .field-label { margin: 11px 0 5px; }
.embed-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.embed-section-heading .eyebrow { font-size: 8px; }
.embed-section-heading h2 { margin: 3px 0 0; font-family: "Space Grotesk",sans-serif; font-size: 14px; }
.embed-color-row { display: flex; align-items: center; gap: 9px; margin-top: 13px; }
.embed-color-swatch { width: 19px; height: 19px; border: 2px solid rgba(255,255,255,.15); border-radius: 50%; cursor: pointer; }
.embed-color-swatch.selected { outline: 2px solid #fff; outline-offset: 2px; }
.embed-color-input { width: 23px; height: 23px; padding: 0; overflow: hidden; border: 0; border-radius: 50%; background: transparent; cursor: pointer; }
.embed-color-input::-webkit-color-swatch-wrapper { padding: 0; }
.embed-color-input::-webkit-color-swatch { border: 2px solid rgba(255,255,255,.45); border-radius: 50%; }
.embed-color-row > span { color: #b7b6c3; font-family: Consolas,monospace; font-size: 9px; }
.embed-fields-heading { margin-top: 19px; }
.embed-fields-heading .button { min-height: 32px; padding-inline: 10px; font-size: 9px; }
.embed-fields-list { display: grid; gap: 8px; margin-top: 10px; }
.embed-field-editor { display: grid; gap: 5px; padding: 10px; border: 1px solid rgba(255,255,255,.075); border-radius: 8px; background: rgba(0,0,0,.1); }
.embed-field-editor-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: 2px; color: #d3d2e0; font-size: 9px; }
.embed-field-remove { padding: 3px 6px; border: 0; background: transparent; color: #ffafb5; font: inherit; font-size: 9px; cursor: pointer; }
.embed-field-editor .field-label { margin: 4px 0 0; }
.embed-field-editor .text-input { min-height: 32px; font-size: 10px; }
.embed-field-editor .message-input { min-height: 53px; padding-top: 7px; }
.embed-field-inline-label { display: flex; align-items: center; gap: 6px; color: #aaa9b7; font-size: 9px; }
.embed-field-inline-label input { accent-color: #6872ff; }
.embed-timestamp-toggle { min-height: 46px; margin-top: 8px; }
.embed-timestamp-toggle > span b { font-size: 9px; }
.embed-timestamp-toggle > span small { font-size: 8px; }
.embed-preview-sticky { position: sticky; top: 20px; overflow: hidden; border: 1px solid var(--line); border-radius: 10px; background: #202127; }
.embed-preview-heading { display: flex; align-items: center; justify-content: space-between; padding: 13px 15px; border-bottom: 1px solid var(--line); }
.embed-preview-heading .eyebrow { font-size: 8px; }
.preview-dot { width: 7px; height: 7px; border-radius: 50%; background: #66d3a9; box-shadow: 0 0 8px rgba(102,211,169,.5); }
.discord-preview { min-height: 245px; padding: 17px 13px; background: #313239; }
.preview-message-content { margin: 0 5px 9px; color: #e4e4e8; font-size: 11px; line-height: 1.65; white-space: pre-wrap; overflow-wrap: anywhere; }
.discord-embed { position: relative; max-width: 100%; padding: 12px 12px 11px; border-left: 4px solid #626cff; border-radius: 4px; background: #292a30; }
.discord-embed-main { min-width: 0; }
.discord-embed-author { margin-bottom: 7px; color: #e2e2e7; font-size: 9px; font-weight: 600; overflow-wrap: anywhere; }
.discord-embed-title { display: block; margin-bottom: 6px; color: #aeb5ff; font-size: 12px; font-weight: 700; line-height: 1.4; overflow-wrap: anywhere; pointer-events: none; text-decoration: none; }
.discord-embed-description { color: #d7d7dc; font-size: 10px; line-height: 1.65; white-space: pre-wrap; overflow-wrap: anywhere; }
.discord-embed-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 9px 10px; margin-top: 11px; }
.discord-embed-field { display: grid; gap: 3px; min-width: 0; font-size: 9px; }
.discord-embed-field:not(.inline) { grid-column: 1 / -1; }
.discord-embed-field strong { color: #e3e3e8; overflow-wrap: anywhere; }
.discord-embed-field span { color: #c6c6cd; line-height: 1.5; white-space: pre-wrap; overflow-wrap: anywhere; }
.discord-embed-thumbnail,.discord-embed-image { display: grid; place-items: center; min-height: 52px; margin-top: 10px; padding: 10px; border: 1px dashed rgba(255,255,255,.15); border-radius: 5px; color: #a6a6b0; font-size: 8px; text-align: center; overflow-wrap: anywhere; }
.discord-embed-thumbnail { width: min(100%,105px); min-height: 58px; margin-left: auto; }
.discord-embed-image { min-height: 92px; }
.discord-embed-footer { margin-top: 10px; padding-top: 8px; border-top: 1px solid rgba(255,255,255,.055); color: #b6b6bf; font-size: 8px; overflow-wrap: anywhere; }
.preview-empty { display: grid; min-height: 200px; place-items: center; padding: 20px; color: #92929c; font-size: 10px; text-align: center; }
.embed-preview-help { padding: 10px 13px; color: #9796a1; font-size: 8px; line-height: 1.5; }
.message-send-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px; border-top: 1px solid var(--line); background: rgba(0,0,0,.16); }
.message-send-bar > div { display: grid; gap: 4px; color: #aaa9b7; font-size: 9px; line-height: 1.5; }
.message-send-bar a { color: #bfc2ff; font-size: 9px; }
.message-send-bar .button { min-height: 36px; flex: 0 0 auto; padding-inline: 13px; background: #606bfa; color: #fff; font-size: 9px; }
.message-send-bar .button:hover { background: #737dff; }
.message-send-bar .button:disabled { opacity: .45; }
.component-badge { display: inline-grid; min-width: 32px; min-height: 24px; place-items: center; border: 1px solid rgba(117,128,255,.35); border-radius: 7px; background: rgba(98,108,255,.13); color: #b8bdff; font-size: 9px; font-weight: 800; letter-spacing: .08em; }
.component-builder-form { display: grid; gap: 11px; }
.component-explainer { margin: 10px 0 14px; padding: 10px 11px; border: 1px solid rgba(117,128,255,.18); border-radius: 8px; background: rgba(98,108,255,.06); color: #b8b8c5; font-size: 9px; line-height: 1.65; }
.component-subheading { margin-top: 18px; }
.component-image-input { min-height: 74px; }
.component-preview { min-width: 0; }
.component-preview-container { display: grid; gap: 10px; overflow: hidden; padding: 15px; border: 1px solid rgba(255,255,255,.08); border-left: 4px solid var(--component-accent,#626cff); border-radius: 8px; background: #282930; }
.component-preview-title { color: #f0eff7; font-size: 13px; line-height: 1.4; overflow-wrap: anywhere; }
.component-preview-description { color: #d7d7df; font-size: 10px; line-height: 1.65; white-space: pre-wrap; overflow-wrap: anywhere; }
.component-preview-gallery { display: grid; grid-template-columns: repeat(auto-fit,minmax(95px,1fr)); gap: 7px; padding-top: 10px; border-top: 1px solid rgba(255,255,255,.1); }
.component-preview-media { display: grid; min-height: 62px; place-items: center; overflow: hidden; padding: 8px; border: 1px dashed rgba(255,255,255,.17); border-radius: 6px; color: #a9a9b5; font-size: 8px; text-align: center; overflow-wrap: anywhere; }
.component-preview-button { justify-self: start; min-height: 33px; display: inline-flex; align-items: center; padding: 0 12px; border: 1px solid rgba(255,255,255,.12); border-radius: 6px; background: #41434e; color: #f2f1f8; font-size: 9px; font-weight: 600; text-decoration: none; }
.component-preview-button:hover { background: #4a4d5b; }
@media print {
  body.dashboard-body { background: white; color: #111; }
  .site-header,.sidebar,.dashboard-topbar,.settings-tools,.dashboard-footer,.dashboard-notice { display: none !important; }
  .dashboard-view { display: block; min-height: 0; }
  .dashboard-content { width: 100%; padding: 0; }
  #overview-panel,#settings-panel,#notifications-panel { display: none !important; }
  #analytics-panel { display: block !important; }
  .stat-card,.panel-card { border: 1px solid #ccc; background: white; color: #111; break-inside: avoid; }
  .stat-card small,.field-hint,.analytics-day small { color: #444; }
  .analytics-track { background: #eee; }
  .analytics-track i { background: #c96e91; }
  .analytics-chart-scroll { display: none; }
  .analytics-print-table { display: block; }
  .analytics-print-table table { width: 100%; border-collapse: collapse; font-size: 9px; }
  .analytics-print-table th,.analytics-print-table td { padding: 5px 7px; border-bottom: 1px solid #ccc; color: #222; text-align: left; }
}
  .account-stats { grid-template-columns: repeat(4,minmax(0,1fr)); margin-top: 20px; }
  .account-stats .stat-card { min-height: 98px; }
  .daily-reward-card { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 14px; padding: 17px 19px; }
  .daily-reward-card .eyebrow { font-size: 8px; }
  .daily-reward-card h2 { margin: 4px 0; font-family: "Space Grotesk",sans-serif; font-size: 15px; }
  .daily-reward-card p { margin: 0; color: #aaa9b7; font-size: 9px; }
  .daily-reward-action { display: flex; align-items: center; gap: 12px; }
  .daily-reward-action > span { color: #bfc2ff; font-size: 9px; white-space: nowrap; }
  .daily-reward-action .button { min-height: 36px; border-radius: 8px; background: #606bfa; color: #fff; font-size: 10px; white-space: nowrap; }
  .daily-reward-action .button:hover { background: #737dff; }
  .daily-reward-action .button:disabled { background: #484956; color: #c2c1cd; }
  .account-layout { display: grid; grid-template-columns: minmax(260px,.78fr) minmax(0,1.5fr); align-items: start; gap: 14px; }
  .account-profile-card,.account-store-card { min-width: 0; padding: 18px; }
  .account-balance,.store-credit-pill { color: #bfc2ff; font-size: 10px; font-weight: 700; }
  .profile-preview { position: relative; min-height: 165px; display: flex; align-items: flex-end; gap: 12px; overflow: hidden; margin: 14px 0 18px; padding: 18px; border: 1px solid rgba(255,255,255,.15); border-radius: 12px; background: linear-gradient(135deg,#d56d97,#5146a4 62%,#252a55); color: #fff; }
  .profile-preview::before,.store-item-preview::before,.store-dialog-preview::before { position: absolute; inset: 0; background: radial-gradient(circle at 75% 20%,rgba(255,255,255,.45) 0 1px,transparent 2px),radial-gradient(circle at 25% 80%,rgba(255,255,255,.35) 0 1px,transparent 2px); background-size: 42px 38px,57px 49px; content: ""; pointer-events: none; }
  .profile-preview[data-theme="moon"] { background: linear-gradient(135deg,#192747,#35638d 55%,#161b38); }
  .profile-preview[data-theme="wisteria"] { background: linear-gradient(135deg,#c779b9,#7358af 55%,#342853); }
  .profile-preview[data-theme="starlight"] { background: linear-gradient(135deg,#111a3c,#39518e 55%,#17182d); }
  .profile-preview[data-theme="gold"] { background: linear-gradient(135deg,#986f28,#c4a754 52%,#483b27); }
  .profile-preview > img { z-index: 1; width: 58px; height: 58px; border: 2px solid rgba(255,255,255,.75); border-radius: 50%; object-fit: cover; }
  .profile-preview-copy { z-index: 1; display: grid; gap: 4px; min-width: 0; }
  .profile-preview-copy > span { overflow: hidden; font-size: 15px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
  .profile-preview-copy > small { max-width: 260px; overflow: hidden; color: rgba(255,255,255,.82); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
  .profile-preview-badge { z-index: 1; position: absolute; top: 14px; right: 15px; width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.4); border-radius: 50%; background: rgba(29,25,48,.35); font-size: 17px; }
  .account-profile-form { display: grid; gap: 8px; }
  .account-profile-form .button { justify-self: start; min-height: 38px; margin-top: 5px; font-size: 10px; }
  .store-category-tabs { display: flex; gap: 6px; overflow-x: auto; margin: 13px 0 12px; padding-bottom: 3px; }
  .store-category { flex: 0 0 auto; min-height: 31px; padding: 0 10px; border: 1px solid rgba(255,255,255,.09); border-radius: 7px; background: rgba(255,255,255,.035); color: #c7c6d2; font: inherit; font-size: 9px; cursor: pointer; }
  .store-category.active,.store-category:hover { border-color: transparent; background: #606bfa; color: #fff; }
  .store-toolbar { display: flex; align-items: center; gap: 9px; padding: 0 0 12px; border-bottom: 1px solid var(--line); }
  .store-toolbar .field-label { margin: 0; }
  .store-toolbar .select-input { width: auto; min-height: 32px; padding-inline: 8px; }
  .store-owned-filter { display: flex; align-items: center; gap: 5px; margin-left: auto; color: #d0cfdb; font-size: 9px; cursor: pointer; }
  .store-owned-filter input { accent-color: #6872ff; }
  .store-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; padding-top: 14px; }
  .store-item { min-width: 0; overflow: hidden; padding: 0; border: 1px solid rgba(255,255,255,.09); border-radius: 10px; background: #25252d; color: #f2f1f8; text-align: left; cursor: pointer; transition: transform .18s,border-color .18s; }
  .store-item:hover { transform: translateY(-2px); border-color: rgba(137,146,255,.55); }
  .store-item-preview { position: relative; height: 92px; display: grid; place-items: center; overflow: hidden; background: linear-gradient(135deg,#d56d97,#5146a4 62%,#252a55); color: white; font-size: 28px; }
  .store-item-preview::before { inset: 0; }
  .theme-moon { background: linear-gradient(135deg,#192747,#35638d 55%,#161b38); }
  .theme-wisteria { background: linear-gradient(135deg,#c779b9,#7358af 55%,#342853); }
  .theme-starlight { background: linear-gradient(135deg,#111a3c,#39518e 55%,#17182d); }
  .theme-gold { background: linear-gradient(135deg,#986f28,#c4a754 52%,#483b27); }
  .store-item-info,.store-item-footer { display: flex; justify-content: space-between; gap: 8px; padding: 9px 10px 0; }
  .store-item-info { display: grid; gap: 3px; }
  .store-item-info b { overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
  .store-item-info small,.store-item-footer small { color: #a5a4b2; font-size: 8px; }
  .store-item-footer { align-items: center; padding: 7px 10px 10px; }
  .store-item-footer b { color: #bfc2ff; font-size: 9px; }
  .store-empty { padding: 22px 4px 4px; color: #aaa9b7; text-align: center; font-size: 10px; }
  .store-dialog { width: min(440px,calc(100% - 28px)); padding: 0; overflow: visible; border: 1px solid rgba(255,255,255,.12); border-radius: 12px; background: #2b2b33; color: #f1f0f7; box-shadow: 0 25px 90px rgba(0,0,0,.62); }
  .store-dialog::backdrop { background: rgba(0,0,0,.72); backdrop-filter: blur(2px); }
  .store-dialog > form { position: absolute; top: 8px; right: 10px; z-index: 2; }
  .dialog-close { width: 30px; height: 30px; border: 0; background: transparent; color: #dddce6; font-size: 23px; cursor: pointer; }
  .store-dialog-content h2 { margin: 0; padding: 15px 42px 12px 16px; border-bottom: 1px solid var(--line); font-size: 13px; font-weight: 600; text-transform: uppercase; }
  .store-dialog-preview { position: relative; height: 195px; display: grid; place-items: center; overflow: hidden; margin: 14px 17px; border-radius: 8px; background: linear-gradient(135deg,#d56d97,#5146a4 62%,#252a55); color: #fff; font-size: 48px; }
  .store-dialog-preview > span { z-index: 1; }
  .store-dialog-content > p { min-height: 36px; margin: 0 18px 14px; color: #b6b5c1; font-size: 10px; line-height: 1.6; }
  .store-dialog-footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 17px; border-top: 1px solid var(--line); background: rgba(255,255,255,.025); }
  .store-dialog-footer strong { font-size: 12px; }
  .store-dialog-footer .button { min-height: 36px; padding-inline: 15px; border-radius: 8px; background: #23996a; color: #fff; font-size: 10px; }
  .store-dialog-footer .button:hover { background: #2bb67e; }
  .store-dialog-footer .button:disabled { background: #4a4b55; }
  .card-preview-dialog { position: fixed; inset: 0; width: min(940px,calc(100vw - 28px)); max-width: 940px; max-height: min(92vh,920px); margin: auto; padding: 0; overflow: auto; border: 1px solid rgba(255,255,255,.13); border-radius: 18px; background: linear-gradient(155deg,#252630,#1c1d25); color: #f3f1fa; box-shadow: 0 30px 100px rgba(0,0,0,.68); }
  .card-preview-dialog::backdrop { background: rgba(7,8,15,.8); backdrop-filter: blur(7px); }
  .card-preview-dialog > form { position: absolute; top: 13px; right: 16px; z-index: 4; }
  .card-preview-dialog-content { padding: 24px clamp(16px,4vw,36px) 20px; }
  .card-preview-dialog-content > .eyebrow { color: #aeb1ff; font-size: 9px; letter-spacing: .16em; }
  .card-preview-dialog-content > h2 { margin: 6px 40px 5px 0; font-family: "Space Grotesk",sans-serif; font-size: clamp(20px,4vw,28px); }
  .card-preview-dialog-content > p { margin: 0 0 20px; color: #aaa9b9; font-size: 11px; line-height: 1.65; }
  .card-preview-stage { display: grid; min-height: 300px; place-items: center; padding: clamp(12px,3vw,26px); overflow: hidden; border: 1px solid rgba(255,255,255,.07); border-radius: 14px; background: radial-gradient(ellipse at 50% 20%,rgba(121,117,255,.16),transparent 54%),linear-gradient(145deg,#191a22,#22212c); }
  .card-live-preview { position: relative; isolation: isolate; overflow: hidden; width: 100%; border: 1px solid rgba(255,255,255,.18); border-radius: 16px; background: linear-gradient(145deg,#342758,#76508b 52%,#cf7298); box-shadow: 0 18px 50px rgba(0,0,0,.42),inset 0 1px rgba(255,255,255,.15); }
  .card-live-preview::before { position: absolute; inset: 0; z-index: 1; background: linear-gradient(115deg,rgba(8,10,26,.76),rgba(17,12,35,.48) 56%,rgba(12,10,25,.66)),radial-gradient(ellipse at 82% 18%,rgba(178,143,255,.3),transparent 39%); content: ""; pointer-events: none; }
  .live-card-background { position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; object-fit: cover; }
  .live-profile-preview { width: min(100%,430px); aspect-ratio: 9 / 13; display: flex; flex-direction: column; justify-content: space-between; padding: clamp(15px,4vw,25px); }
  .live-profile-top,.live-profile-identity,.live-card-footer { position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 10px; }
  .live-server-pill { max-width: 70%; overflow: hidden; padding: 7px 10px; border: 1px solid rgba(220,215,255,.2); border-radius: 999px; background: rgba(13,15,34,.45); color: #e9e6ff; font-size: 8px; font-weight: 700; letter-spacing: .08em; text-overflow: ellipsis; white-space: nowrap; backdrop-filter: blur(9px); }
  .live-card-mark { color: rgba(248,246,255,.8); font-size: 8px; font-weight: 800; letter-spacing: .16em; }
  .live-card-mark i,.live-card-footer i { color: #d3a6ff; font-style: normal; }
  .live-profile-identity { justify-content: flex-start; margin: auto 0 16px; padding: clamp(12px,3vw,19px); border: 1px solid rgba(255,255,255,.19); border-radius: 14px; background: linear-gradient(120deg,rgba(13,15,32,.72),rgba(25,18,42,.48)); box-shadow: 0 12px 26px rgba(0,0,0,.22); backdrop-filter: blur(10px); }
  .live-profile-avatar,.live-rank-avatar { position: relative; flex: 0 0 auto; display: grid; place-items: center; overflow: hidden; border: 2px solid rgba(235,224,255,.9); border-radius: 50%; background: linear-gradient(145deg,#f3a5bd,#716ac3); box-shadow: 0 0 0 4px rgba(170,146,255,.16),0 8px 18px rgba(0,0,0,.35); color: #fff; font-family: "Space Grotesk",sans-serif; font-weight: 700; }
  .live-profile-avatar { width: clamp(47px,12vw,76px); aspect-ratio: 1; font-size: 27px; }
  .live-profile-avatar img,.live-rank-avatar img { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; border-radius: inherit; object-fit: cover; }
  .live-profile-avatar b,.live-rank-avatar b { z-index: 0; }
  .live-profile-identity > span:nth-child(2) { min-width: 0; display: grid; gap: 4px; }
  .live-profile-identity strong { overflow: hidden; font-family: "Space Grotesk",sans-serif; font-size: clamp(15px,3.8vw,22px); text-overflow: ellipsis; white-space: nowrap; }
  .live-profile-identity small,.live-rank-name > span { color: #d2cede; font-size: 10px; }
  .live-member-badge { margin-left: auto; padding: 5px 7px; border: 1px solid rgba(222,195,255,.3); border-radius: 99px; background: rgba(151,115,220,.2); color: #f0dfff; font-size: 7px; font-weight: 800; letter-spacing: .07em; white-space: nowrap; }
  .live-profile-stats { position: relative; z-index: 2; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
  .live-profile-stats article,.live-rank-stats article { min-width: 0; display: grid; gap: 6px; padding: 12px; border: 1px solid rgba(255,255,255,.16); border-radius: 11px; background: linear-gradient(145deg,rgba(13,15,32,.72),rgba(18,16,34,.52)); box-shadow: 0 7px 18px rgba(0,0,0,.15); backdrop-filter: blur(9px); }
  .live-profile-stats small,.live-rank-stats small { color: #c4bfd5; font-size: 8px; font-weight: 700; letter-spacing: .11em; }
  .live-profile-stats strong { color: #fff; font-family: "Space Grotesk",sans-serif; font-size: clamp(19px,5vw,27px); }
  .live-profile-stats article > span { color: #a9e3ce; font-size: 7px; font-weight: 700; letter-spacing: .06em; }
  .live-card-footer { margin-top: 15px; color: rgba(235,230,247,.7); font-size: 7px; font-weight: 700; letter-spacing: .14em; }
  .live-rank-preview { aspect-ratio: 1500 / 640; display: flex; flex-direction: column; justify-content: center; padding: clamp(17px,4vw,36px); }
  .live-rank-identity,.live-rank-stats,.live-rank-progress,.live-rank-preview > .live-card-footer { position: relative; z-index: 2; }
  .live-rank-identity { display: flex; align-items: center; gap: clamp(12px,3vw,25px); }
  .live-rank-avatar { width: clamp(55px,12vw,106px); aspect-ratio: 1; font-size: clamp(22px,5vw,40px); }
  .live-rank-avatar > i { position: absolute; right: 1px; bottom: 1px; z-index: 2; width: 17px; height: 17px; border: 3px solid #252238; border-radius: 50%; background: #70e0a7; }
  .live-rank-name { min-width: 0; flex: 1; display: grid; gap: 4px; }
  .live-rank-name > small,.live-rank-position small { color: #d0c8e8; font-size: clamp(6px,1vw,9px); font-weight: 800; letter-spacing: .15em; }
  .live-rank-name > strong { overflow: hidden; font-family: "Space Grotesk",sans-serif; font-size: clamp(16px,4vw,30px); text-overflow: ellipsis; white-space: nowrap; }
  .live-rank-position { display: grid; justify-items: end; gap: 4px; padding-left: 14px; border-left: 1px solid rgba(255,255,255,.24); }
  .live-rank-position strong { color: #f4d18c; font-family: "Space Grotesk",sans-serif; font-size: clamp(20px,5vw,38px); }
  .live-rank-stats { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 9px; margin: clamp(14px,3vw,25px) 0 13px; }
  .live-rank-stats article { padding: clamp(8px,2vw,13px); }
  .live-rank-stats strong { overflow: hidden; color: #fff; font-family: "Space Grotesk",sans-serif; font-size: clamp(11px,2vw,18px); text-overflow: ellipsis; white-space: nowrap; }
  .live-rank-progress { padding: 0 2px; }
  .live-rank-progress > div,.live-rank-progress > small { display: flex; justify-content: space-between; color: #e9e4f4; font-size: 8px; font-weight: 700; letter-spacing: .06em; }
  .live-rank-progress > i { height: 9px; display: block; overflow: hidden; margin: 7px 0 5px; border: 1px solid rgba(255,255,255,.26); border-radius: 99px; background: rgba(14,15,31,.6); }
  .live-rank-progress > i span { width: 71%; height: 100%; display: block; border-radius: inherit; background: linear-gradient(90deg,#8c8aff,#d88de7 58%,#f3a2c2); box-shadow: 0 0 14px rgba(196,145,255,.55); }
  .live-rank-progress > small { color: #fff; font-weight: 500; letter-spacing: 0; }
  .live-rank-progress em { color: #d1ccdb; font-style: normal; }
  .card-preview-dialog-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 15px; color: #aaa8b8; font-size: 9px; }
  .card-preview-dialog-footer .button { min-height: 36px; flex: 0 0 auto; }
  @media (max-width: 900px) {
    .account-layout { grid-template-columns: 1fr; }
    .store-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
    .message-builder-toolbar { grid-template-columns: minmax(0,1fr) minmax(0,1fr); }
    .message-toolbar-actions,.message-channel-field { grid-column: 1 / -1; }
    .message-toolbar-actions .button { flex: 1 1 0; }
    .embed-builder-layout { grid-template-columns: minmax(0,1fr); }
    .embed-preview-sticky { position: static; grid-row: 1; }
  }
  @media (max-width: 680px) {
    .account-stats { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .daily-reward-card { align-items: flex-start; flex-direction: column; }
    .daily-reward-action { width: 100%; justify-content: space-between; }
    .account-layout { grid-template-columns: minmax(0,1fr); }
    .account-profile-card,.account-store-card { padding: 14px; }
    .store-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
    .store-item-preview { height: 80px; }
    .store-toolbar { flex-wrap: wrap; }
    .store-toolbar .select-input { flex: 1; }
    .message-builder-toolbar { grid-template-columns: minmax(0,1fr); gap: 9px; padding: 11px; }
    .message-toolbar-actions,.message-channel-field { grid-column: auto; }
    .message-toolbar-actions { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); }
    .message-builder-toolbar .button { min-width: 0; padding-inline: 5px; font-size: 8px; }
    .embed-option-card { padding: 12px; }
    .message-send-bar { align-items: stretch; flex-direction: column; }
    .message-send-bar .button { width: 100%; }
  }

@media (max-width: 900px) {
  .dashboard-view { grid-template-columns: 190px minmax(0,1fr); }
  .dashboard-content { padding-inline: 20px; }
  .embed-builder-layout { grid-template-columns: minmax(0,1fr); }
  .embed-preview-sticky { grid-row: 1; }
}
@media (max-width: 680px) {
  .site-header { position: sticky; top: 0; z-index: 30; }
  .dashboard-view { display: block; min-height: calc(100dvh - 50px); }
  .sidebar { position: sticky; top: 50px; z-index: 20; height: auto; max-height: none; padding: 8px 12px 9px; border-right: 0; border-bottom: 1px solid var(--line); background: rgba(39,39,47,.97); box-shadow: 0 8px 20px rgba(0,0,0,.14); backdrop-filter: blur(14px); }
  .sidebar-brand,.sidebar-user { display: none; }
  .server-picker { display: grid; grid-template-columns: auto minmax(0,1fr); align-items: center; gap: 10px; padding: 0; border: 0; }
  .server-picker label { margin: 0; white-space: nowrap; }
  .server-picker select { max-width: none; min-height: 40px; }
  .side-links { display: flex; gap: 5px; overflow-x: auto; overflow-y: hidden; margin: 4px -2px 0; padding: 4px 2px 2px; overscroll-behavior-inline: contain; scroll-snap-type: x proximity; scrollbar-width: thin; }
  .side-group-label { display: none; }
  .side-link { width: auto; min-height: 40px; flex: 0 0 auto; padding-inline: 11px; scroll-snap-align: start; white-space: nowrap; }
  .side-link > span { width: auto; }
  .sidebar-bottom { display: flex; gap: 5px; margin-top: 4px; padding-top: 4px; border-top: 0; }
  .sidebar-bottom .side-link { min-height: 34px; padding-inline: 9px; }
  .dashboard-topbar { min-height: 56px; padding-inline: 14px; }
  .dashboard-topbar .profile-chip { min-width: 0; max-width: 48%; gap: 6px; }
  .profile-chip > span:not(.online-dot) { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .dashboard-content { width: 100%; padding: 20px 14px 18px; }
  .dashboard-content .text-input,.dashboard-content .select-input { min-height: 44px; font-size: 16px; }
  .page-heading { margin-bottom: 17px; }
  .page-heading h1,.welcome-row h1 { font-size: clamp(26px,7vw,34px); overflow-wrap: anywhere; }
  .page-heading > p,.welcome-row p { line-height: 1.65; }
  .stats-grid { grid-template-columns: minmax(0,1fr); }
  .field-grid { grid-template-columns: minmax(0,1fr); gap: 3px; }
  .embed-builder-layout { gap: 10px; }
  .embed-preview-sticky { min-width: 0; }
  .embed-option-card { min-width: 0; padding: 13px; }
  .embed-section-heading { align-items: flex-start; }
  .embed-fields-heading { align-items: center; }
  .message-mode-tabs { width: 100%; }
  .message-mode-tab { flex: 1 0 auto; min-height: 40px; }
  .message-send-bar { padding: 12px; }
  .message-send-bar > div { overflow-wrap: anywhere; }
  .message-send-bar .button { min-height: 44px; }
  .component-preview-container { padding: 12px; }
}
@media (max-width: 420px) {
  .dashboard-topbar { padding-inline: 11px; }
  .dashboard-topbar .eyebrow { font-size: 7px; }
  .dashboard-content { padding-inline: 11px; }
  .message-builder-toolbar { margin-top: 13px; padding: 9px; }
  .message-toolbar-actions { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .message-toolbar-actions #delete-message-draft { grid-column: 1 / -1; }
  .embed-color-row { flex-wrap: wrap; gap: 10px; }
  .component-preview-gallery { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 560px) {
  .card-background-previews { grid-template-columns: minmax(0,1fr); gap: 14px; }
  .profile-card-preview { aspect-ratio: 1.05 / 1; }
  .rank-card-preview { aspect-ratio: 1.5 / 1; }
  .card-preview-caption { font-size: 11px; }
  .card-preview-caption small { font-size: 9px; }
  .card-preview-dialog { max-height: 92dvh; }
  .card-preview-stage { min-height: 260px; padding: 10px; }
  .live-profile-preview { width: min(100%,360px); }
  .live-rank-preview { min-height: 250px; aspect-ratio: auto; }
  .live-rank-identity { gap: 10px; }
  .live-rank-position { padding-left: 9px; }
  .live-rank-stats { gap: 5px; }
  .live-rank-stats article { gap: 4px; padding: 8px 6px; }
  .live-rank-stats small { font-size: 6px; letter-spacing: .06em; }
  .live-rank-stats strong { font-size: clamp(10px,3vw,15px); }
  .live-rank-progress > div,.live-rank-progress > small { font-size: 7px; }
  .card-preview-dialog-footer { align-items: flex-start; }
}
@media (prefers-reduced-motion: reduce) {
  .dashboard-body *, .dashboard-body *::before, .dashboard-body *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}