/* Cloud Design Premium UI v1.0.4
   Loaded after app.css so this file can safely refine the visual system without
   rewriting the original component layer. */

:root{
  --bg:#0b0b10;
  --bg2:#0f1016;
  --surface:#14151c;
  --surface2:#191b24;
  --surface-2:var(--surface2);
  --text:#f4f2f8;
  --muted:#9995a8;
  --line:rgba(235,231,255,.10);
  --soft:rgba(236,232,255,.055);
  --accent:#7568f8;
  --accent-rgb:117,104,248;
  --radius:20px;
  --radius-sm:13px;
  --shadow:0 28px 80px rgba(0,0,0,.34);
  --shadow-soft:0 14px 42px rgba(0,0,0,.20);
  --button-radius:14px;
  --header:72px;
  color-scheme:dark;
}
html[data-theme="light"]{
  --bg:#f4f2ee;
  --bg2:#ebe8e3;
  --surface:#fbfaf7;
  --surface2:#f2efea;
  --surface-2:var(--surface2);
  --text:#19181e;
  --muted:#6e6978;
  --line:rgba(38,32,52,.115);
  --soft:rgba(67,55,92,.052);
  --shadow:0 24px 70px rgba(55,45,70,.12);
  --shadow-soft:0 12px 34px rgba(55,45,70,.09);
  color-scheme:light;
}

html{background:var(--bg)}
body{
  background:
    radial-gradient(900px 580px at 83% -10%,color-mix(in srgb,var(--accent) 12%,transparent),transparent 72%),
    radial-gradient(760px 520px at -8% 24%,rgba(147,124,255,.055),transparent 72%),
    var(--bg);
}
body:before{display:none}
html[data-theme="light"] body{
  background:
    radial-gradient(860px 520px at 85% -8%,color-mix(in srgb,var(--accent) 8%,transparent),transparent 72%),
    linear-gradient(180deg,#f8f6f2 0,var(--bg) 45%,#f1eee9 100%);
}
::selection{background:color-mix(in srgb,var(--accent) 38%,transparent);color:var(--text)}

/* Typography */
h1{font-weight:720;letter-spacing:-.06em}
h2{font-weight:710;letter-spacing:-.048em}
h3{font-weight:690}
.eyebrow{letter-spacing:.145em;color:color-mix(in srgb,var(--muted) 88%,var(--text))}
.eyebrow:before{width:22px;background:linear-gradient(90deg,var(--accent),color-mix(in srgb,var(--accent) 22%,transparent))}
.lead,.hero-copy{color:var(--muted)}

/* Surfaces */
.card{
  background:linear-gradient(150deg,color-mix(in srgb,var(--surface) 97%,var(--accent) 1.5%),var(--surface));
  border-color:var(--line);
  box-shadow:0 1px 0 rgba(255,255,255,.035) inset,var(--shadow-soft);
}
html[data-theme="light"] .card{
  background:linear-gradient(150deg,#fffdf9,var(--surface));
  box-shadow:0 1px 0 rgba(255,255,255,.8) inset,var(--shadow-soft);
}

/* Consistent buttons */
.primary-btn,.ghost-btn,.icon-btn,.menu-btn,.guest-chat-fab{
  -webkit-tap-highlight-color:transparent;
}
.primary-btn,.ghost-btn{
  min-height:46px;
  padding:0 19px;
  border-radius:var(--button-radius);
  font-size:.92rem;
  line-height:1.1;
  white-space:nowrap;
  font-weight:720;
  letter-spacing:-.015em;
  position:relative;
  overflow:hidden;
}
.primary-btn{
  background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 82%,white 18%),var(--accent));
  color:#fff;
  border:1px solid color-mix(in srgb,var(--accent) 76%,white 12%);
  box-shadow:0 11px 28px color-mix(in srgb,var(--accent) 22%,transparent),0 1px 0 rgba(255,255,255,.18) inset;
}
.primary-btn:hover{transform:translateY(-1px);box-shadow:0 15px 34px color-mix(in srgb,var(--accent) 27%,transparent),0 1px 0 rgba(255,255,255,.22) inset}
.primary-btn:active,.ghost-btn:active{transform:translateY(0) scale(.985)}
.ghost-btn{
  background:color-mix(in srgb,var(--surface) 78%,transparent);
  border:1px solid var(--line);
  color:var(--text);
  box-shadow:0 1px 0 rgba(255,255,255,.025) inset;
}
.ghost-btn:hover{background:color-mix(in srgb,var(--accent) 7%,var(--surface));border-color:color-mix(in srgb,var(--accent) 30%,var(--line));transform:translateY(-1px)}
.compact{min-height:40px;padding:0 14px;border-radius:12px;font-size:.84rem}
.icon-btn,.menu-btn{
  width:40px;height:40px;min-height:40px;border-radius:12px;
  background:color-mix(in srgb,var(--surface) 72%,transparent);
  border:1px solid var(--line);color:var(--text);
}
.icon-btn:hover,.menu-btn:hover{background:color-mix(in srgb,var(--accent) 7%,var(--surface));border-color:color-mix(in srgb,var(--accent) 27%,var(--line))}
.danger-outline{background:transparent!important}

/* Header + account avatar */
.site-header{transition:background .25s,border-color .25s,box-shadow .25s}
.site-header.scrolled{
  background:color-mix(in srgb,var(--bg) 78%,transparent);
  backdrop-filter:blur(22px) saturate(1.15);
  -webkit-backdrop-filter:blur(22px) saturate(1.15);
  box-shadow:0 8px 30px rgba(0,0,0,.08);
}
html[data-theme="light"] .site-header.scrolled{background:rgba(248,246,242,.84)}
.brand-mark{width:36px;height:36px}
.desktop-nav{gap:20px}
.desktop-nav a{font-size:.84rem}
.account-chip{
  min-height:42px;display:flex;align-items:center;gap:9px;padding:4px 9px 4px 5px;
  border:1px solid var(--line);border-radius:14px;background:color-mix(in srgb,var(--surface) 74%,transparent);
  transition:.2s;max-width:210px;
}
.account-chip:hover{border-color:color-mix(in srgb,var(--accent) 34%,var(--line));background:color-mix(in srgb,var(--accent) 6%,var(--surface))}
.account-avatar,.profile-avatar{
  flex:0 0 auto;display:grid;place-items:center;overflow:hidden;border-radius:50%;
  background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 84%,white 10%),color-mix(in srgb,var(--accent) 70%,#30265f 30%));
  color:#fff;border:1px solid color-mix(in srgb,var(--accent) 40%,var(--line));
  box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 7%,transparent);
  font-weight:760;text-transform:uppercase;
}
.account-avatar{width:32px;height:32px;font-size:.78rem}
.account-avatar img,.profile-avatar img{width:100%;height:100%;object-fit:cover}
.account-chip-copy{min-width:0;display:grid;line-height:1.08}
.account-chip-copy b{font-size:.78rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.account-chip-copy small{font-size:.63rem;color:var(--muted);margin-top:4px}
.account-chip .badge-dot{position:absolute;transform:translate(8px,-14px);right:0}
.header-actions{gap:7px}

/* Mobile navigation - card-like full screen drawer */
.mobile-menu{
  top:var(--header);padding:14px 14px max(18px,env(safe-area-inset-bottom));
  background:color-mix(in srgb,var(--bg) 91%,transparent);
  backdrop-filter:blur(24px) saturate(1.2);-webkit-backdrop-filter:blur(24px) saturate(1.2);
  overflow:auto;
}
.mobile-menu.open{animation:cdMenuIn .22s ease both}
@keyframes cdMenuIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.mobile-menu-inner{
  gap:6px;padding:10px;border:1px solid var(--line);border-radius:22px;background:var(--surface);box-shadow:var(--shadow);
}
.mobile-menu a:not(.primary-btn):not(.mobile-account){padding:13px 14px;border:0;border-radius:12px;font-size:1.03rem;font-weight:650}
.mobile-menu a:not(.primary-btn):not(.mobile-account):hover{background:var(--soft)}
.mobile-menu-cta{margin:10px 4px 4px!important;width:calc(100% - 8px)}
.mobile-account{display:flex!important;align-items:center!important;gap:11px;padding:10px!important;border:1px solid var(--line)!important;border-radius:15px!important;background:var(--soft);margin-bottom:4px}
.mobile-account>span:last-child{display:grid;line-height:1.15}.mobile-account b{font-size:.9rem}.mobile-account small{color:var(--muted);font-size:.72rem;margin-top:4px}

/* Hero */
.hero{padding-top:calc(var(--header) + 72px)}
.hero-grid{gap:54px}
.hero-status{display:inline-flex;padding:8px 11px;border:1px solid var(--line);border-radius:999px;background:var(--soft);margin-bottom:22px}
.hero h1 .outline{-webkit-text-stroke:1px color-mix(in srgb,var(--text) 34%,transparent)}
.hero-core{background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 84%,white 16%),var(--accent));border:1px solid color-mix(in srgb,var(--accent) 65%,white 10%);box-shadow:0 30px 72px color-mix(in srgb,var(--accent) 27%,transparent)}
.hero-orbit:before,.hero-orbit:after{border-color:color-mix(in srgb,var(--accent) 13%,var(--line))}
.orbital-card{background:color-mix(in srgb,var(--surface) 88%,transparent);border-color:var(--line);box-shadow:var(--shadow-soft)}
html[data-theme="light"] .orbital-card{background:rgba(255,253,249,.82)}

/* Sections / cards */
.trust-strip{background:color-mix(in srgb,var(--surface) 38%,transparent)}
.service-card,.price-card,.feature-card{padding:25px}
.service-card:hover,.case-card:hover,.price-card:hover,.feature-card:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--accent) 28%,var(--line))}
.service-card h3{margin-top:38px}
.case-card{box-shadow:var(--shadow-soft)}
.price-card .price{letter-spacing:-.045em}
.discount-badge{border:1px solid color-mix(in srgb,var(--accent) 18%,transparent);background:color-mix(in srgb,var(--accent) 9%,transparent)}
.cta-panel{border-radius:26px;border-color:color-mix(in srgb,var(--accent) 22%,var(--line));background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 7%,var(--surface)),var(--surface));box-shadow:var(--shadow-soft)}
.feature-line{border-color:var(--line)}
.faq details{border-color:var(--line)}

/* Inputs */
input,textarea,select{
  min-height:46px;background:color-mix(in srgb,var(--bg2) 86%,var(--surface));
  border-color:var(--line);border-radius:12px;padding:12px 13px;
}
html[data-theme="light"] input,html[data-theme="light"] textarea,html[data-theme="light"] select{background:#f7f4ef}
input:focus,textarea:focus,select:focus{border-color:color-mix(in srgb,var(--accent) 72%,var(--line));box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 10%,transparent)}

/* Profile / avatar */
.profile-avatar-md{width:58px;height:58px;font-size:1.15rem}
.profile-avatar-lg{width:72px;height:72px;font-size:1.45rem}
.profile-avatar-xl{width:112px;height:112px;font-size:2rem}
.dashboard-user-title,.profile-heading-identity{display:flex;align-items:center;gap:15px;min-width:0}
.profile-mini-link{display:inline-flex;margin-top:6px;color:var(--muted);font-size:.77rem}.profile-mini-link:hover{color:var(--accent)}
.profile-role{margin:6px 0 0;font-size:.86rem}
.profile-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:16px;align-items:start}
.profile-main-column,.profile-side-column{min-width:0}.profile-side-column{display:grid;gap:16px;position:sticky;top:calc(var(--header) + 18px)}
.profile-form{padding:28px}.profile-form-title h2{font-size:1.8rem;margin-bottom:7px}.profile-form-title p{margin-bottom:0}
.avatar-editor{display:flex;align-items:center;gap:22px;padding:24px 0;border-block:1px solid var(--line);margin:23px 0}
.avatar-editor-copy{min-width:0}.avatar-editor-copy p{font-size:.86rem;margin:5px 0 13px;max-width:500px}
.native-avatar-input{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
.file-btn{width:max-content}.profile-fields{margin-top:2px}.profile-fields label{min-width:0}
.profile-notify-box{margin-top:22px;padding:18px;border:1px solid var(--line);border-radius:15px;background:var(--soft)}
.profile-switches{display:grid;grid-template-columns:1fr 1fr;gap:10px 18px;margin-top:14px}.profile-switches .check{color:var(--text);font-size:.86rem}
.profile-form-actions{display:flex;justify-content:flex-end;margin-top:20px}
.profile-account-card b{word-break:break-word}.profile-card-label{display:block;color:var(--muted);text-transform:uppercase;letter-spacing:.12em;font-size:.67rem;margin-bottom:9px}
.field-errors,.errorlist{color:#f28c99;font-size:.78rem}

/* Dashboard refinements */
.dashboard-shell{padding-top:calc(var(--header) + 30px)}
.side-nav{border-radius:17px;box-shadow:none;background:color-mix(in srgb,var(--surface) 78%,transparent)}
.side-nav a{border-radius:10px}
.side-nav a:hover{background:color-mix(in srgb,var(--accent) 6%,var(--surface));color:var(--text)}
.metric-card{padding:18px}.metric-card b{font-size:1.65rem}.metric-card span{font-size:.75rem}
.table-wrap{background:var(--surface);box-shadow:0 1px 0 rgba(255,255,255,.025) inset}
.project-row{box-shadow:none}
.panel{box-shadow:none}

/* Guest chat */
.guest-chat-fab{border-radius:14px;background:color-mix(in srgb,var(--surface) 92%,transparent);backdrop-filter:blur(15px);font-size:.86rem}
.guest-chat-panel{border-radius:18px;box-shadow:0 30px 90px rgba(0,0,0,.42)}
html[data-theme="light"] .guest-chat-panel{box-shadow:0 30px 80px rgba(55,45,70,.18)}

/* Light theme fixes beyond variables */
html[data-theme="light"] .case-card:before{background:linear-gradient(180deg,rgba(10,10,16,.08),rgba(10,10,16,.88))}
html[data-theme="light"] .case-card.no-cover{background:linear-gradient(140deg,#312d3c,#17151d)}
html[data-theme="light"] .theme-icon{color:#2d2934}
html[data-theme="light"] .status-pill.good{color:#267852;background:#e9f5ef}
html[data-theme="light"] .status-pill.warn{color:#8d631e;background:#faf0db}
html[data-theme="light"] .status-pill.bad{color:#a54955;background:#f9e9eb}
html[data-theme="light"] .pc-warning{background:color-mix(in srgb,var(--accent) 5%,#fffaf4)}
html[data-theme="light"] .site-footer{background:#ebe8e3}
html[data-theme="light"] .toast{background:#fffdf9}
html[data-theme="light"] .chat-bubble.staff{background:#eeebe6}

/* Tablet */
@media(max-width:1060px){
  .account-chip-copy{display:none}.account-chip{padding:4px;min-width:42px;justify-content:center}.account-chip .badge-dot{right:-4px;top:2px}
  .profile-layout{grid-template-columns:1fr}.profile-side-column{position:static;grid-template-columns:repeat(3,minmax(0,1fr))}
  .side-nav{top:calc(var(--header) + 8px);z-index:30;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(18px)}
}

/* Mobile redesign */
@media(max-width:720px){
  :root{--header:60px;--radius:16px;--button-radius:12px}
  body{font-size:15px}
  .container,.narrow{width:min(100% - 24px,1180px)}
  .site-header{height:var(--header)}
  .header-inner{gap:8px}.brand{gap:8px}.brand-mark{width:32px;height:32px}.brand-copy b{font-size:.9rem}.brand-copy small{display:none}
  .header-actions{gap:5px}.header-actions .login-btn{display:none}.icon-btn,.menu-btn{width:38px;height:38px;min-height:38px;border-radius:11px}.menu-btn span{left:11px}
  .account-chip{width:38px;min-width:38px;height:38px;min-height:38px;border-radius:11px;padding:3px}.account-avatar{width:30px;height:30px}.account-chip .badge-dot{min-width:16px;height:16px;font-size:.6rem}
  .mobile-menu{padding:10px 10px max(12px,env(safe-area-inset-bottom))}.mobile-menu-inner{border-radius:18px;padding:8px}

  .section{padding:68px 0}.section-tight{padding:44px 0}.section-head{margin-bottom:26px}.section-head h2{margin-bottom:0}.section-head p{font-size:.92rem;line-height:1.55}
  h1{letter-spacing:-.052em}h2{font-size:clamp(2rem,10vw,2.7rem);line-height:1.02}h3{font-size:1.2rem}
  .eyebrow{font-size:.67rem;letter-spacing:.13em}

  .hero{min-height:auto;padding:calc(var(--header) + 42px) 0 52px;overflow:visible}
  .hero-grid{gap:34px}.hero-status{font-size:.74rem;margin-bottom:17px;padding:7px 10px}
  .hero h1{font-size:clamp(2.85rem,13.3vw,4.05rem);line-height:.94;margin-bottom:22px;overflow-wrap:normal}
  .hero-copy{font-size:1rem;line-height:1.58;margin-bottom:25px}
  .hero-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px}.hero-actions .primary-btn,.hero-actions .ghost-btn{width:100%;padding-inline:12px}
  .hero-orbit{height:228px;max-width:360px;margin:2px auto 0}.hero-orbit:before{inset:5% 15%}.hero-orbit:after{inset:19% 28%}
  .hero-core{width:76px;height:76px;border-radius:22px}.hero-core img{width:43px}
  .orbital-card{width:165px;padding:13px;border-radius:15px}.orbital-card.one{top:4%;right:0}.orbital-card.two{bottom:2%;left:0}.orbital-card .tiny{font-size:.58rem}.orbital-card strong{font-size:.88rem;margin-top:7px}.orbital-card .mini-line{margin-top:9px}

  .trust-grid{grid-template-columns:1fr 1fr}.trust-item{padding:18px 15px}.trust-item b{font-size:.95rem}.trust-item span{font-size:.74rem;line-height:1.35;display:block;margin-top:3px}

  .service-grid,.case-grid,.price-grid,.feature-grid{gap:11px}.service-card,.price-card,.feature-card{padding:20px}.service-card h3{margin-top:28px}.service-card p,.feature-card p{font-size:.88rem}.case-card{min-height:272px;border-radius:17px}.case-card h3{font-size:1.4rem}.case-card p{font-size:.87rem}
  .price-card .price{font-size:2rem}.price-card .ghost-btn,.price-card .primary-btn{width:100%}

  .process-list{gap:10px}.process-item{grid-template-columns:38px 1fr!important;gap:8px 10px!important;padding:18px!important;border:1px solid var(--line)!important;border-radius:16px;background:var(--surface)}.process-item:before{grid-row:1/3;font-size:.72rem;padding-top:3px}.process-item h3{margin:0}.process-item p{grid-column:2!important;margin:0;font-size:.88rem;color:var(--muted)}
  .split{gap:30px}.feature-list{gap:0}.feature-line{display:grid;gap:5px;padding:15px 0}.feature-line b{min-width:0}.feature-line span{font-size:.88rem}
  .cta-panel{padding:26px 20px;border-radius:20px}.cta-panel h2{font-size:2.1rem}.cta-panel .inline-actions{display:grid;grid-template-columns:1fr;gap:8px}.cta-panel .primary-btn,.cta-panel .ghost-btn{width:100%}
  .faq details{padding:18px 0}.faq summary{font-size:.98rem;gap:12px}.faq p{font-size:.88rem}

  .page-hero{padding:calc(var(--header) + 45px) 0 42px}.page-hero h1{font-size:clamp(2.55rem,12.5vw,3.75rem);line-height:.96}.page-hero .lead{font-size:1rem}.breadcrumbs{margin-bottom:20px}
  .case-hero{min-height:62svh;padding-bottom:38px}.case-hero h1{font-size:clamp(2.45rem,12vw,3.6rem)}
  .article-body{font-size:1rem}.article-body h2{font-size:1.7rem;margin-top:40px}

  .lead-form,.callback-form,.raw-form,.profile-form{padding:20px}.form-grid.two{grid-template-columns:1fr}.form-grid{gap:13px}input,textarea,select{font-size:16px;min-height:46px}
  .auth-wrap{padding:calc(var(--header) + 28px) 0 45px;place-items:start center}.auth-card{padding:22px;border-radius:18px}.auth-card h1{font-size:2.2rem}.auth-card .primary-btn,.auth-card .ghost-btn{width:100%}

  .dashboard-shell{padding:calc(var(--header) + 12px) 0 55px}.dashboard-grid{display:block}.side-nav{position:sticky!important;top:calc(var(--header) + 6px)!important;display:flex!important;gap:4px;margin:0 0 18px;padding:6px;border-radius:14px;overflow-x:auto;scroll-snap-type:x proximity;box-shadow:var(--shadow-soft);z-index:50}.side-nav::-webkit-scrollbar{display:none}.side-nav{scrollbar-width:none}.side-nav .nav-label{display:none}.side-nav a{min-width:max-content;padding:9px 11px;font-size:.78rem;scroll-snap-align:start;background:transparent}.dashboard-head{align-items:flex-start;gap:14px;margin-bottom:18px}.dashboard-head h1{font-size:2rem;line-height:1.05}.dashboard-head>.inline-actions{margin-top:0}.dashboard-head>.inline-actions .primary-btn{min-height:40px}
  .dashboard-user-title{gap:11px}.profile-avatar-md{width:46px;height:46px}.profile-mini-link{font-size:.7rem;margin-top:4px}
  .metric-grid{grid-template-columns:1fr 1fr;gap:8px}.metric-card{padding:14px}.metric-card b{font-size:1.4rem}.metric-card span{font-size:.68rem}
  .panel{padding:16px}.project-list{gap:9px}.project-row{padding:17px!important;gap:14px!important}.project-row .ghost-btn{width:100%}
  .table-wrap{border-radius:14px;margin-inline:0}th,td{padding:12px 13px}

  .profile-dashboard-head{margin-bottom:17px}.profile-heading-identity{gap:12px}.profile-avatar-lg{width:58px;height:58px}.profile-layout{grid-template-columns:1fr;gap:12px}.profile-side-column{grid-template-columns:1fr;gap:10px}.avatar-editor{align-items:flex-start;gap:16px;padding:19px 0;margin:19px 0}.profile-avatar-xl{width:84px;height:84px}.avatar-editor-copy p{font-size:.8rem}.file-btn{min-height:38px;padding-inline:11px}.profile-switches{grid-template-columns:1fr;gap:9px}.profile-notify-box{padding:15px}.profile-form-actions .primary-btn{width:100%}

  .contact-grid{gap:12px}.contact-channels{padding:20px}.contact-channels a,.contact-channels .channel-off{padding:15px 0}.callback-form .primary-btn,.lead-form .primary-btn{width:100%}
  .footer-grid{gap:26px}.site-footer{padding:48px 0 22px}.footer-bottom{margin-top:30px;padding-top:17px;gap:8px;font-size:.68rem}
  .guest-chat{right:8px;bottom:max(8px,env(safe-area-inset-bottom))}.guest-chat-fab{height:44px;padding:0 13px;font-size:.78rem}.guest-chat-panel{position:fixed;inset:calc(var(--header) + 8px) 8px max(8px,env(safe-area-inset-bottom)) 8px;width:auto;height:auto;border-radius:17px}.guest-chat-panel form{padding:10px}.guest-chat-panel form textarea{min-height:62px}
  .toast-stack{right:10px;top:calc(var(--header) + 10px);width:calc(100% - 20px)}
  .copy-row{display:grid}.partner-row-form{grid-template-columns:1fr!important}.inline-settings input,.inline-settings select{width:100%;max-width:none}
  .media-tile{grid-template-columns:60px 1fr!important}.media-tile img{width:60px;height:52px}.media-tile>.inline-actions{grid-column:1/-1}
  .staff-chat-tools label{min-width:0}.chat-window{min-height:60svh}.chat-search{display:grid;grid-template-columns:1fr auto}.chat-search input{width:100%}
}

@media(max-width:430px){
  .container,.narrow{width:min(100% - 20px,1180px)}
  .brand-copy b{font-size:.84rem}.header-actions{gap:4px}
  .hero h1{font-size:clamp(2.65rem,13.2vw,3.5rem)}
  .hero-actions{grid-template-columns:1fr}.hero-orbit{height:205px}.orbital-card{width:150px;padding:11px}.orbital-card strong{font-size:.82rem}.orbital-card .tiny{font-size:.54rem}
  .trust-item{padding:16px 12px}.trust-item b{font-size:.9rem}
  .section{padding:58px 0}.section-tight{padding:38px 0}.cta-panel h2{font-size:1.85rem}
  .dashboard-head{display:grid}.dashboard-head>.inline-actions{width:100%}.dashboard-head>.inline-actions .primary-btn{width:100%}
  .profile-avatar-xl{width:76px;height:76px}.avatar-editor{gap:12px}.avatar-editor-copy p{display:none}
  .metric-grid{grid-template-columns:1fr 1fr}
  .backup-codes{grid-template-columns:1fr}
}

/* Avatars inside project chats */
.chat-bubble .chat-meta{align-items:center;flex-wrap:wrap;gap:6px 8px;margin-bottom:7px}
.chat-meta-avatar{width:22px;height:22px;border-radius:50%;overflow:hidden;display:grid;place-items:center;flex:0 0 auto;background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 82%,white 12%),var(--accent));color:#fff;font-size:.58rem;font-weight:760;border:1px solid color-mix(in srgb,var(--accent) 35%,var(--line))}
.chat-meta-avatar img{width:100%;height:100%;object-fit:cover}.chat-meta-name{font-weight:700;color:color-mix(in srgb,var(--text) 88%,var(--muted));font-size:.7rem}
@media(max-width:720px){.chat-bubble{max-width:92%;padding:11px 12px;border-radius:15px}.chat-messages{padding:14px 11px}.chat-meta-avatar{width:20px;height:20px}.chat-compose{padding:10px}.chat-compose .primary-btn{width:100%}}
.avatar-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.avatar-remove{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:.78rem;cursor:pointer}.avatar-remove input{width:16px;height:16px;min-height:0;padding:0}.avatar-remove:hover{color:#e3838e}.account-chip{position:relative}