/* Astra Sense / White Liquid Glass — shared chrome, controls and surfaces. */
:root {
  --bg: #090909;
  --bg-2: #121212;
  --text: #fff;
  --muted: #b7b7b7;
  --quiet: #969696;
  --border: rgba(255,255,255,.12);
  --white: #fff;
  --blue: #fff;
  --silver: #e4e4e4;
  --gradient: linear-gradient(140deg,#ffffff 0%,#e1e1e1 100%);
  --glass-bg: linear-gradient(145deg,rgba(255,255,255,.085),rgba(255,255,255,.025) 48%,rgba(255,255,255,.045));
  --glass-border: rgba(255,255,255,.14);
  --glass-shadow: inset 0 1px 0 rgba(255,255,255,.14),inset 0 -1px 0 rgba(255,255,255,.025),0 20px 55px rgba(0,0,0,.28);
  --radius: 22px;
  --shadow: 0 28px 90px rgba(0,0,0,.38);
  color-scheme: dark;
}
body {
  background: radial-gradient(ellipse at 78% 0%,rgba(255,255,255,.045),transparent 35%),radial-gradient(ellipse at 3% 36%,rgba(255,255,255,.025),transparent 32%),var(--bg);
  color:var(--text);
  isolation:isolate;
}
.drawer-lock {overflow:hidden}
::selection {background:#e6e6e6;color:#121212}
html {scroll-padding-top:116px;scrollbar-color:#494949 #0c0c0c}
.ambient-light {background:radial-gradient(ellipse,rgba(255,255,255,.045),transparent 65%)}
.eyebrow {color:#bababa;letter-spacing:.16em;font-size:11px}
.muted,.text-muted {color:var(--muted)}
.subtle-text {color:#bbbbbb}
.gradient-text {background:linear-gradient(110deg,#ffffff 8%,#c1c1c1 48%,#f6f6f6 85%);-webkit-background-clip:text;background-clip:text;color:transparent}
.brand-mark,.brand-dot,.section-dot,.tiny-spark,.verified {color:#f0f0f0}
.brand-sense {color:#c9c9c9}
.text-link {color:#dddddd}
.text-link:hover {color:#ffffff}
.skip-link {background:#f4f4f4;color:#111111}

/* Floating navigation: a quiet refractive lens, not an opaque application bar. */
.navbar {
  top:16px;
  width:min(1320px,calc(100% - 64px));
  margin:16px auto 0;
  border:1px solid rgba(255,255,255,.15);
  border-radius:23px;
  background:linear-gradient(130deg,rgba(255,255,255,.105),rgba(255,255,255,.035) 55%,rgba(255,255,255,.07));
  box-shadow:inset 0 1px 0 #ffffff18,0 12px 40px #00000025;
  -webkit-backdrop-filter:blur(28px) saturate(110%);
  backdrop-filter:blur(28px) saturate(110%);
}
.navbar.scrolled {background:rgba(22,22,22,.86);border-color:#ffffff26;box-shadow:inset 0 1px 0 #ffffff13,0 16px 50px #00000055}
.navbar .nav-inner {width:100%;height:70px;padding:0 24px;gap:22px}
.nav-links {gap:5px;border:1px solid #ffffff07;border-radius:40px;padding:4px;background:#ffffff02}
.nav-links a {padding:8px 16px;border-radius:30px;color:#b1b1b1;font-size:13px;font-weight:550;transition:background .2s,color .2s}
.nav-links a:hover,.nav-links a.active {color:#ffffff;background:#ffffff0d}
.nav-links a.active {box-shadow:inset 0 1px 0 #ffffff12}
.nav-links .active:after {display:none}
.nav-actions {gap:12px}
.nav-divider {background:#ffffff19}
.nav-login {color:#cdcdcd;font-size:13px}
.search-trigger {color:#b0b0b0}
kbd {border-color:#ffffff12;color:#aeaeae;background:#ffffff03;border-radius:6px}
.nav-profile {background:#ffffff08;border:1px solid #ffffff10;padding:5px 10px 5px 5px;border-radius:40px}
.notification-dot {background:#f2f2f2;box-shadow:0 0 0 3px #161616}
.nav-register {border-radius:13px}
.mobile-menu {inset:98px 16px auto;border-radius:23px;background:rgba(26,26,26,.95);border-color:#ffffff25;box-shadow:var(--glass-shadow);-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);max-height:calc(100dvh - 120px);overflow-y:auto}
.mobile-menu a {border-radius:12px;padding:13px 14px;color:#dbdbdb}
.mobile-menu a.active {background:#ffffff0e;color:#ffffff}

/* White primary actions and frosted secondary controls. */
.btn {border-radius:13px;min-height:46px;font-size:13px;padding:12px 19px;letter-spacing:-.01em}
.btn-primary {color:#151515;background:linear-gradient(140deg,#ffffff,#e2e2e2);border:1px solid #ffffff91;box-shadow:inset 0 1px 0 #ffffff,0 3px 10px #ffffff0c,0 5px 20px #00000033}
.btn-primary:hover {color:#090909;background:linear-gradient(140deg,#ffffff,#f0f0f0);box-shadow:inset 0 1px 0 #ffffff,0 5px 25px #ffffff1a,0 10px 25px #00000033}
.btn-secondary {background:linear-gradient(135deg,#ffffff0d,#ffffff04);border-color:#ffffff20;color:#e9e9e9;box-shadow:inset 0 1px 0 #ffffff0c}
.btn-secondary:hover {background:#ffffff10;border-color:#ffffff38}
.btn-ghost {color:#c2c2c2}
.btn-ghost:hover {color:#ffffff;background:#ffffff08}
.btn-sm {min-height:38px;font-size:12px;padding:9px 14px;border-radius:11px}
.btn-lg {min-height:53px;padding:15px 24px;font-size:14px}
.btn-danger {color:#bfbfbf;background:#52525218;border-color:#95959530}
.icon-button {color:#b9b9b9;border-radius:11px}
.icon-button:hover {background:#ffffff0e;color:#ffffff}
.icon-button.bordered {border-color:#ffffff20;background:#ffffff04}
.avatar-letter {background:linear-gradient(145deg,#656565,#313131);color:#ffffff}
.badge {color:#dddddd;background:#ffffff08;border-color:#ffffff16;border-radius:8px}
.chip {border-color:#ffffff13;background:#ffffff03;color:#c1c1c1;border-radius:40px;font-size:12px;padding:10px 17px;min-height:39px}
.chip.active,.chip:hover {color:#ffffff;background:linear-gradient(140deg,#ffffff15,#ffffff09);border-color:#ffffff32;box-shadow:inset 0 1px 0 #ffffff15}
.tabs {border-bottom-color:#ffffff12}
.tabs a,.tabs button {color:#b1b1b1}
.tabs .active,.tabs a:hover {color:#f5f5f5;border-color:#e4e4e4}

/* Every working surface shares the same optical treatment. */
.panel,.card,.project-card,.creator-card,.category-card,.sidebar,.admin-sidebar,.message-sidebar,.chat-panel,.message-info,.settings-tabs,.info-nav {
  border-color:var(--glass-border);
  background:var(--glass-bg);
  border-radius:var(--radius);
  box-shadow:var(--glass-shadow);
  -webkit-backdrop-filter:blur(18px);
  backdrop-filter:blur(18px);
}
.project-card {overflow:hidden}
.project-card:hover,.creator-card:hover,.category-card:hover {border-color:#ffffff30;box-shadow:inset 0 1px 0 #ffffff20,0 24px 60px #00000044;transform:translateY(-4px)}
.project-cover {border-radius:19px 19px 0 0;background:#181818}
.project-cover:after {background:linear-gradient(0deg,#09090970,transparent 60%)}
.cover-category {background:#151515c9;border:1px solid #ffffff24;color:#e5e5e5;border-radius:30px;backdrop-filter:blur(12px)}
.cover-open {background:#ffffff18;color:#ffffff;border-color:#ffffff30;backdrop-filter:blur(16px)}
.project-card-body {padding:19px 20px}
.project-card h3 {color:#ededed;font-weight:600}
.creator-mini {color:#b7b7b7}
.card-metrics {color:#aaaaaa;font-size:11px}
.save-card {color:#b1b1b1}
.save-card.active {color:#ffffff;background:#ffffff0d}
.category-card {min-height:110px;padding:24px}
.category-icon {background:linear-gradient(140deg,#ffffff12,#ffffff04);border:1px solid #ffffff17;color:#e8e8e8;border-radius:15px;box-shadow:inset 0 1px 0 #ffffff10}
.creator-status {color:#b9b9b9}
.creator-specialty {color:#b4b4b4}
.creator-numbers {border-color:#ffffff0e;color:#acacac}
.creator-numbers strong {color:#eeeeee}
.page-header {padding-bottom:30px}
.page-header h1 {color:#f1f1f1;letter-spacing:-.045em}
.page-header>p {color:#b4b4b4}
.panel h2,.card h2 {font-weight:600}
.panel p,.card p {color:#b9b9b9}
.empty-state {color:#b7b7b7}
.empty-state>svg {color:#d5d5d5}
.empty-state h2,.empty-state h3 {color:#ededed}
.empty-state p {color:#b0b0b0}
.cover-empty {background:radial-gradient(ellipse at 35% 20%,#ffffff0d,transparent 70%),#151515;color:#b9b9b9}

/* Forms, search, tables and modal surfaces stay readable through the glass. */
input:not([type=checkbox]):not([type=radio]):not([type=color]),textarea,select,.input,.textarea {
  background:linear-gradient(140deg,#ffffff08,#ffffff03);
  border-color:#ffffff20;
  color:#ececec;
  border-radius:12px;
  box-shadow:inset 0 1px 2px #00000018;
}
input::placeholder,textarea::placeholder {color:#959595;opacity:1}
input:focus,textarea:focus,select:focus {border-color:#ffffff65;box-shadow:0 0 0 3px #ffffff09}
input[type=checkbox],input[type=radio] {accent-color:#efefef}
select option {background:#1b1b1b;color:#f1f1f1}
.field label,label.field {color:#d0d0d0;font-size:12px;font-weight:500}
.field small,.help-text {color:#a5a5a5}
.explore-search {background:var(--glass-bg);border:1px solid #ffffff23;border-radius:20px;box-shadow:var(--glass-shadow);backdrop-filter:blur(20px)}
.explore-search input {background:transparent;border:0;box-shadow:none}
.explore-search>svg {color:#c8c8c8}
.drop-zone {background:linear-gradient(145deg,#ffffff06,#ffffff02);border-color:#ffffff27;border-radius:18px;color:#dbdbdb}
.drop-zone.dragover {background:#ffffff0c;border-color:#ffffff80}
.upload-progress {accent-color:#e4e4e4}
.upload-progress::-webkit-progress-value {background:#e4e4e4}
.data-table th,table th {color:#aeaeae;background:#ffffff03;border-color:#ffffff13;font-weight:500}
.data-table td,table td {color:#d5d5d5;border-color:#ffffff0b}
.data-table tbody tr:hover {background:rgba(255,255,255,.025)}
.stat {background:var(--glass-bg);border-color:#ffffff13}
.stat strong {color:#f4f4f4}
.stat>svg,.dashboard-main .stat>svg {color:#dfdfdf}
.sidebar nav a,.admin-sidebar a,.info-nav a {color:#b6b6b6}
.sidebar nav a.active,.sidebar nav a:hover,.admin-sidebar a.active,.admin-sidebar a:hover,.info-nav a.active {background:linear-gradient(130deg,#ffffff13,#ffffff06);border-color:#ffffff18;color:#f5f5f5;box-shadow:inset 0 1px 0 #ffffff0e}
.sidebar-note {background:rgba(255,255,255,.035);border-color:#ffffff13}
.sidebar-note>svg {color:#e2e2e2}
.sidebar-note p,.sidebar-heading {color:#ababab}
.studio-drawer-trigger {background:var(--glass-bg);border-color:#ffffff20}
.notification-item.unread {background:#ffffff03;border-color:#ffffff0f}
.notification-icon {color:#dfdfdf;background:#ffffff08}
.unread-dot {background:#e9e9e9;box-shadow:0 0 8px #ffffff1a}
.chat-bubble {background:#ffffff05;border:1px solid #ffffff0d;color:#e1e1e1}
.chat-bubble.own {background:linear-gradient(140deg,#ffffff17,#ffffff08);border-color:#ffffff25;color:#f5f5f5}
.chat-bubble small {color:#a9a9a9}
.conversation-item.active,.conversation-link.active,.conversation-item:hover,.conversation-link:hover {background:#ffffff0b;border-color:#ffffff19;color:#f5f5f5}
.message-info p {color:#b4b4b4}
.profile-banner:not([style]) {background:radial-gradient(ellipse at 25% 20%,#ffffff0e,transparent 60%),linear-gradient(120deg,#121212,#212121)}
.banner-grid {opacity:.2}
.profile-head .eyebrow {color:#c7c7c7!important}
.profile-stats strong {color:#f0f0f0}
.profile-stats span,.profile-meta {color:#a8a8a8}
.profile-actions {gap:10px}
.case-study blockquote {border-color:#dbdbdb;color:#dddddd;background:rgba(255,255,255,.035);border-radius:0 15px 15px 0}
.code-block {background:#121212;border-color:#ffffff13;color:#dcdcdc;border-radius:18px}
.project-toolbar .active {color:#121212;background:#e9e9e9;border-color:#e9e9e9}
.social-link {border-color:#ffffff15;background:#ffffff03;color:#cbcbcb}
.error-number {background:linear-gradient(140deg,#ffffff,#717171);background-clip:text;-webkit-background-clip:text;color:transparent}
.error-orbit {border-color:#ffffff12;box-shadow:0 0 80px #ffffff05}

.auth-art {color:#eaeaea}
.auth-art:before {background:radial-gradient(ellipse,#ffffff12,transparent 65%)}
.auth-art:after {border-color:#ffffff1d}
.auth-footer,.auth-footer a,.form-between a {color:#cbcbcb}
.onboarding-progress .active,.onboarding-progress .done {color:#ffffff;background:#ffffff12;border-color:#ffffff35}
.creator-types label:has(input:checked) {color:#ffffff;background:#ffffff0e;border-color:#ffffff45}
.onboarding-welcome>svg {color:#ffffff;filter:drop-shadow(0 0 20px #ffffff18)}
.settings-tabs a.active {color:#ffffff;background:#ffffff10;box-shadow:inset 0 1px 0 #ffffff12}
.toast {background:rgba(31,31,31,.95);border-color:#ffffff24;color:#f1f1f1;border-radius:17px;box-shadow:var(--glass-shadow);backdrop-filter:blur(22px)}
.toast>svg {color:#f3f3f3}
.toast-error>svg {color:#c3c3c3}
.search-dialog,#report-dialog {background:rgba(28,28,28,.97);border:1px solid #ffffff2c;border-radius:24px;box-shadow:var(--glass-shadow),0 32px 140px #000000bb;color:#f1f1f1;backdrop-filter:blur(28px)}
.search-dialog::backdrop,#report-dialog::backdrop {background:#00000088;backdrop-filter:blur(10px)}
.search-input-wrap>svg,.search-hint>svg {color:#d7d7d7}
.search-input-wrap input {background:transparent;border:0;box-shadow:none}
.search-hint {color:#b3b3b3}
.search-hint p {color:#d5d5d5}
.search-hint span,.search-footer {color:#a2a2a2}
.search-result:hover,.search-result:focus {background:#ffffff08}
.search-result strong {color:#e9e9e9}
.search-result small {color:#b1b1b1;font-size:12px}
.search-result .result-type {color:#d5d5d5;background:#ffffff09;border:1px solid #ffffff0e;border-radius:7px;font-size:10px}
.skeleton {background:linear-gradient(100deg,#171717 30%,#2b2b2b 45%,#171717 60%);background-size:300% 100%;border:1px solid #ffffff08;border-radius:18px}
.footer {border-color:#ffffff0d;background:linear-gradient(180deg,transparent,#ffffff02)}
.footer-main {padding-top:55px;padding-bottom:45px}
.footer-main h4 {color:#e2e2e2;font-size:12px;letter-spacing:.02em}
.footer-main>div>a:not(.brand) {color:#a5a5a5;font-size:12px}
.footer-main>div>a:hover {color:#ffffff}
.footer-brand p,.footer-bottom {color:#9a9a9a}
.footer-bottom {border-color:#ffffff0c;padding-block:22px}

/* Keyboard and transparency fallbacks are part of the design, not an afterthought. */
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,
.field input:focus-visible,.field textarea:focus-visible,.field select:focus-visible {
  outline:2px solid #f4f4f4;outline-offset:4px;
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
  .navbar,.navbar.scrolled,.mobile-menu,.panel,.card,.creator-card,.project-card,.category-card,.sidebar,.admin-sidebar,.message-sidebar,.chat-panel,.message-info,.settings-tabs,.info-nav {background:linear-gradient(145deg,#232323,#151515)}
}
@media(prefers-reduced-transparency:reduce) {
  .navbar,.navbar.scrolled,.mobile-menu,.panel,.card,.creator-card,.project-card,.category-card,.sidebar,.admin-sidebar,.message-sidebar,.chat-panel,.message-info,.settings-tabs,.info-nav {background:#1a1a1a;backdrop-filter:none;-webkit-backdrop-filter:none}
}
@media(max-width:1200px) {.nav-links a{padding:8px 12px}.navbar .nav-inner{padding-inline:20px}.nav-actions{gap:9px}}
@media(max-width:1024px) {.navbar{width:calc(100% - 32px);top:12px;margin-top:12px;border-radius:20px}.navbar .nav-inner{height:65px;padding-inline:18px}.mobile-menu{top:89px}}
@media(max-width:768px) {
  html{scroll-padding-top:102px}
  .navbar{width:calc(100% - 24px);top:10px;margin-top:10px;border-radius:19px}
  .navbar .nav-inner{height:62px;padding:0 14px;gap:10px}
  .brand{font-size:21px;letter-spacing:-.9px;gap:6px}.brand-mark svg{width:23px;height:23px}
  .nav-actions{gap:6px}.nav-register{font-size:11px;min-height:34px;padding:8px 12px;border-radius:11px}
  .mobile-menu{inset:84px 12px auto;max-height:calc(100dvh - 106px)}
  .panel,.card,.creator-card,.project-card,.category-card{border-radius:19px;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
  .btn{font-size:12px;min-height:44px;padding:11px 17px}.btn-lg{font-size:12px;min-height:48px;padding:13px 19px}
  .btn-sm{font-size:11px;min-height:36px;padding:8px 12px}
  .project-card-body{padding:16px}.category-card{min-height:90px;padding:18px}
  .project-cover{border-radius:17px 17px 0 0}.category-icon{border-radius:12px}
  .footer-main{padding-top:35px;padding-bottom:30px}.footer-bottom{padding-block:18px}
  .page-header{padding-bottom:24px}.eyebrow{font-size:10px}
  .search-input-wrap{padding:18px}.search-result{padding:12px;gap:10px}
  .search-result .result-type{font-size:9px}.search-footer{font-size:10px}
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .project-card:hover,.creator-card:hover,.category-card:hover,.btn:hover{transform:none}
  body.js-reveal .reveal:not(.in-view){opacity:1;transform:none;filter:none}
}

@media(prefers-reduced-transparency:reduce) {
  .navbar,.navbar.scrolled,.mobile-menu,.panel,.card,.creator-card,.project-card,.category-card,.sidebar,.admin-sidebar,.message-sidebar,.chat-panel,.message-info,.settings-tabs,.info-nav {background:#1a1a1a;backdrop-filter:none;-webkit-backdrop-filter:none}
}
@media(max-width:1200px){.message-person{display:none}}

@media(max-width:768px){
 .has-js .dashboard-layout>.sidebar#dashboard-sidebar{top:84px;left:12px;bottom:12px;height:calc(100dvh - 96px);max-height:calc(100dvh - 96px);align-self:auto;width:min(280px,calc(100% - 24px));border-radius:19px}
 .studio-open .studio-backdrop{inset:84px 0 0}
}

@media(prefers-reduced-transparency:reduce){*,*::before,*::after{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}}

@media(max-width:768px){.has-js:not(.studio-open) .dashboard-layout>.sidebar#dashboard-sidebar{transform:translateX(calc(-100% - 24px))}}

input[type=file]::file-selector-button{margin-right:12px;padding:8px 12px;border:1px solid #ffffff24;border-radius:9px;background:linear-gradient(145deg,#ffffff18,#ffffff06);color:#f5f5f5;font:inherit;cursor:pointer;transition:background .2s}
input[type=file]::file-selector-button:hover{background:#ffffff22}
.conversation-item small{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;max-width:100%}
.conversation-item>div{min-width:0}

/* The entire presentation stays monochrome, including incoming media. */
img,video,input[type=color]{filter:grayscale(1)!important}

.dashboard-main,.analytics-panel,.analytics-grid>section,.chart-container{min-width:0;max-width:100%}
.analytics-panel canvas,.analytics-grid canvas{max-width:100%!important}

/* Original AS artwork, framed without changing the supplied PNG. */
.brand{gap:9px;flex-shrink:0}
.brand-logo-frame{position:relative;display:block;flex:0 0 44px;width:44px;height:44px;overflow:hidden;border-radius:12px;isolation:isolate}
.brand-logo-frame .brand-logo{position:absolute;left:50%;top:-5px;width:64px;height:64px;max-width:none;object-fit:contain;transform:translateX(-50%);mix-blend-mode:screen;pointer-events:none}
.brand-wordmark{display:inline-flex;align-items:baseline;white-space:nowrap}
.footer-brand .brand{gap:9px}
.footer-brand .brand-logo-frame{flex-basis:48px;width:48px;height:48px}
.footer-brand .brand-logo-frame .brand-logo{width:70px;height:70px;top:-6px}
@media(max-width:1200px){.navbar .brand{font-size:24px;gap:7px}}
@media(max-width:768px){.navbar .brand{font-size:21px;gap:6px}.navbar .brand-logo-frame{width:36px;height:36px;flex-basis:36px;border-radius:10px}.navbar .brand-logo-frame .brand-logo{width:54px;height:54px;top:-5px}}
@media(max-width:390px){.navbar .brand{font-size:19px;letter-spacing:-.8px;gap:4px}.navbar .brand-logo-frame{width:32px;height:32px;flex-basis:32px}.navbar .brand-logo-frame .brand-logo{width:49px;height:49px;top:-5px}.navbar .nav-inner{padding-inline:11px}}
