/* ═══════════════════════════════════════════════════════════
   ASCENSION LIFEOS — LUXURY INTELLIGENCE OS
   Design System v4.0 — Ridiculously Expensive
   ═══════════════════════════════════════════════════════════ */

*, *::before, *::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* Profile access point for Sprout, NexusHome, FamilyOS, and their invitations. */
.profile-family-access .profile-content{width:min(1180px,100%);margin:0 auto;padding:clamp(1rem,3vw,2rem)}
.profile-family-hero{position:relative;overflow:hidden;margin:1rem 0;padding:clamp(1.2rem,4vw,2.4rem);border:1px solid color-mix(in srgb,var(--gold-primary) 32%,transparent);border-radius:26px;background:radial-gradient(circle at 88% 12%,color-mix(in srgb,var(--gold-primary) 18%,transparent),transparent 34%),linear-gradient(145deg,var(--card-surface),color-mix(in srgb,var(--card-surface) 82%,#101b2d));box-shadow:0 24px 60px rgba(0,0,0,.18)}
.profile-family-hero>span,.profile-family-card>span,.profile-family-pending>div>span{color:var(--gold-primary);font-size:.7rem;font-weight:850;letter-spacing:.12em;text-transform:uppercase}
.profile-family-hero h1{margin:.35rem 0;font-size:clamp(2rem,5vw,3.8rem);line-height:1}.profile-family-hero p{max-width:780px;margin:.7rem 0 0;color:var(--text-secondary);line-height:1.65}
.profile-family-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.9rem}.profile-family-card{display:grid;align-content:start;gap:.8rem;min-height:390px;padding:1.2rem;border:1px solid var(--border-color);border-radius:24px;background:var(--card-surface);box-shadow:0 16px 38px rgba(0,0,0,.12)}
.profile-family-card.sprout{background:linear-gradient(155deg,color-mix(in srgb,#66ce8c 10%,var(--card-surface)),var(--card-surface))}.profile-family-card.home{background:linear-gradient(155deg,color-mix(in srgb,#477dff 10%,var(--card-surface)),var(--card-surface))}.profile-family-card.family{background:linear-gradient(155deg,color-mix(in srgb,var(--gold-primary) 10%,var(--card-surface)),var(--card-surface))}
.profile-family-card h2{margin:0;font-size:1.45rem}.profile-family-card>p{min-height:88px;margin:0;color:var(--text-secondary);line-height:1.55}.profile-family-status{display:flex;align-items:end;gap:.5rem}.profile-family-status strong{font-size:2.5rem;line-height:1;color:var(--gold-primary)}.profile-family-status small{padding-bottom:.25rem;color:var(--text-secondary)}
.profile-family-invite{display:grid;gap:.5rem;margin-top:auto;padding-top:.85rem;border-top:1px solid var(--border-color)}.profile-family-invite input,.profile-family-invite select{width:100%;min-height:44px;border:1px solid var(--border-color);border-radius:12px;padding:.65rem .75rem;background:var(--input-bg,var(--bg-secondary));color:var(--text-primary);font:inherit}
.profile-family-boundaries{display:grid;grid-template-columns:repeat(3,1fr);gap:.7rem;margin:1rem 0}.profile-family-boundaries article{padding:1rem;border:1px solid var(--border-color);border-radius:18px;background:color-mix(in srgb,var(--card-surface) 88%,transparent)}.profile-family-boundaries p{margin:.3rem 0 0;color:var(--text-secondary);font-size:.78rem;line-height:1.5}
.profile-family-pending{display:grid;gap:.7rem;padding:1.1rem;border:1px solid var(--border-color);border-radius:22px;background:var(--card-surface)}.profile-family-pending h2{margin:.25rem 0}.profile-family-pending>article{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.8rem;border-radius:14px;background:var(--bg-secondary)}.profile-family-pending>article>div{display:grid;gap:.2rem}.profile-family-pending small,.profile-family-pending>p{color:var(--text-secondary)}.profile-family-notice{margin-bottom:.8rem;padding:.75rem 1rem;border:1px solid var(--border-color);border-radius:14px;color:var(--text-secondary)}
@media(max-width:900px){.profile-family-grid{grid-template-columns:1fr}.profile-family-card{min-height:0}.profile-family-card>p{min-height:0}.profile-family-boundaries{grid-template-columns:1fr}}
@media(max-width:640px){.profile-family-access .profile-content{padding:.75rem}.profile-family-hero{border-radius:20px}.profile-family-pending>article{align-items:flex-start;flex-direction:column}.profile-family-pending>article button{width:100%}}

/* Creation project room: saved projects + cofounder chat + tools + reality path */
.creation-studio-shell{padding:0!important;overflow:hidden;--creation-accent:var(--gold-primary)}.creation-studio{height:calc(100dvh - 72px);min-height:620px;display:grid;grid-template-columns:minmax(190px,230px) minmax(360px,1fr) minmax(220px,270px);overflow:hidden;background:radial-gradient(circle at 52% -20%,rgba(var(--metal-rgb),.13),transparent 38%),#090a0c;border-top:1px solid rgba(var(--metal-rgb),.18);--gold-primary:var(--creation-accent)}.creation-studio *, .creation-studio-shell *{--gold-primary:var(--creation-accent)}
.creation-project-rail,.creation-tool-rail{min-width:0;min-height:0;background:linear-gradient(180deg,rgba(18,19,22,.98),rgba(10,11,13,.98))}.creation-project-rail{display:flex;flex-direction:column;border-right:1px solid rgba(var(--metal-rgb),.17);padding:1rem .75rem}.creation-rail-head{display:flex;align-items:center;justify-content:space-between;padding:.25rem .35rem .8rem}.creation-rail-head>div{display:grid;gap:.16rem}.creation-rail-head span,.creation-side-label{color:var(--gold-primary);font-size:.62rem;font-weight:800;letter-spacing:.16em}.creation-rail-head strong{font-size:1rem;color:var(--text-primary,#f4e9cf)}.creation-rail-head button{width:32px;height:32px;border-radius:10px;border:1px solid rgba(var(--metal-rgb),.35);background:rgba(var(--metal-rgb),.08);color:var(--gold-primary);font-size:1.3rem;cursor:pointer}.creation-type-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:.35rem;padding-bottom:.75rem;border-bottom:1px solid rgba(var(--metal-rgb),.12)}.creation-type-strip button{min-width:0;padding:.48rem .2rem;border:1px solid transparent;border-radius:9px;background:transparent;color:#81796c;cursor:pointer}.creation-type-strip button span{display:none}.creation-type-strip button.active,.creation-type-strip button:hover{border-color:rgba(var(--metal-rgb),.32);background:rgba(var(--metal-rgb),.09);color:var(--gold-primary)}.creation-project-list{min-height:0;overflow:auto;padding:.65rem 0}.creation-project-item{display:grid;width:100%;gap:.2rem;padding:.72rem .7rem;margin-bottom:.32rem;border:1px solid transparent;border-radius:11px;background:transparent;text-align:left;color:#9c9487;cursor:pointer}.creation-project-item span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.8rem;font-weight:700}.creation-project-item small{font-size:.62rem;color:#665f56;text-transform:capitalize}.creation-project-item:hover,.creation-project-item.active{border-color:rgba(var(--metal-rgb),.26);background:linear-gradient(110deg,rgba(var(--metal-rgb),.12),rgba(255,255,255,.02));color:var(--gold-primary)}.creation-no-projects{padding:1.25rem .65rem;color:#827a6f;text-align:center}.creation-no-projects strong{display:block;color:var(--gold-primary);font-size:.8rem}.creation-no-projects p{font-size:.7rem;line-height:1.5}.creation-chat-room{min-width:0;min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr) auto;background:linear-gradient(180deg,rgba(255,255,255,.018),transparent 35%)}.creation-room-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 1.25rem;border-bottom:1px solid rgba(var(--metal-rgb),.14);background:rgba(8,9,11,.72);backdrop-filter:blur(18px)}[data-theme=light] .creation-room-head{background:rgba(255,255,255,.78)}.creation-room-head>div{min-width:0}.creation-room-head span{display:block;margin-bottom:.2rem;color:var(--gold-primary);font-size:.62rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase}.creation-room-head h2{margin:0;color:var(--text-primary,#f7edda);font-size:1.02rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.creation-room-head p{margin:.28rem 0 0;color:#756f67;font-size:.69rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.creation-project-chat{min-height:0;overflow:auto;padding:1.1rem max(1rem,7%);scroll-behavior:smooth}.creation-chat-empty{height:100%;min-height:270px;display:grid;place-content:center;justify-items:center;text-align:center;color:#777168}.creation-chat-empty h3{margin:.6rem 0 .35rem;color:var(--text-primary,#efe4cf);font-size:1.2rem}.creation-chat-empty p{max-width:520px;margin:0;font-size:.8rem;line-height:1.65}.creation-empty-mark{width:48px;height:48px;display:grid;place-items:center;border:1px solid rgba(var(--metal-rgb),.42);border-radius:15px;background:radial-gradient(circle,rgba(var(--metal-rgb),.17),transparent 72%);box-shadow:0 0 30px rgba(var(--metal-rgb),.12);color:var(--gold-primary);font-weight:800}.creation-chat-message{display:grid;grid-template-columns:34px minmax(0,1fr);gap:.75rem;padding:1rem 0;border-bottom:1px solid rgba(255,255,255,.055)}[data-theme=light] .creation-chat-message{border-bottom-color:rgba(0,0,0,.06)}.creation-chat-message.user{margin-left:10%}.creation-chat-avatar{width:32px;height:32px;display:grid;place-items:center;border:1px solid rgba(var(--metal-rgb),.23);border-radius:10px;background:rgba(var(--metal-rgb),.07);color:var(--gold-primary);font-size:.61rem;font-weight:800}.creation-chat-copy{color:var(--text-primary,#eee5d6);font-size:.86rem;line-height:1.68;white-space:pre-wrap;overflow-wrap:anywhere}.creation-save-output{margin-top:.5rem;padding:.3rem .5rem;border:1px solid rgba(var(--metal-rgb),.2);border-radius:7px;background:transparent;color:#827a6e;font-size:.61rem;cursor:pointer}.creation-save-output:hover{color:var(--gold-primary);border-color:rgba(var(--metal-rgb),.45)}.creation-project-composer{display:flex;align-items:flex-end;gap:.6rem;margin:.7rem max(.8rem,6%) 1rem;padding:.55rem .55rem .55rem .9rem;border:1px solid rgba(var(--metal-rgb),.38);border-radius:16px;background:rgba(17,18,21,.94);box-shadow:0 14px 38px rgba(0,0,0,.25)}[data-theme=light] .creation-project-composer{background:#fff;box-shadow:0 10px 28px rgba(28,31,35,.09)}.creation-project-composer textarea{min-width:0;max-height:140px;flex:1;padding:.46rem 0;resize:none;border:0;outline:0;background:transparent;color:var(--text-primary,#f5ebd7);font:inherit;font-size:.83rem;line-height:1.45}.creation-project-composer button{width:36px;height:36px;flex:0 0 36px;border:0;border-radius:11px;background:var(--gold-primary);color:#111;font-size:1.15rem;cursor:pointer}.creation-project-composer button:disabled{opacity:.3}.creation-tool-rail{display:flex;flex-direction:column;gap:.8rem;overflow:auto;padding:1rem .8rem;border-left:1px solid rgba(var(--metal-rgb),.17)}.creation-path-card,.creation-tools-card,.creation-artifact-card{padding:.85rem;border:1px solid rgba(var(--metal-rgb),.14);border-radius:13px;background:rgba(255,255,255,.018)}.creation-project-path>p,.creation-project-artifacts>p{margin:.7rem 0 0;color:#716a60;font-size:.7rem;line-height:1.45}.creation-stage-track{display:grid;gap:.1rem;margin:.7rem 0}.creation-stage-track button{display:grid;grid-template-columns:16px 1fr;align-items:center;gap:.45rem;padding:.34rem .2rem;border:0;background:transparent;color:#625c54;text-align:left;text-transform:capitalize;font-size:.7rem;cursor:pointer}.creation-stage-track button i{width:9px;height:9px;border:1px solid #514c45;border-radius:50%;position:relative}.creation-stage-track button.done{color:#938b7f}.creation-stage-track button.done i{background:rgba(var(--metal-rgb),.38);border-color:var(--gold-primary)}.creation-stage-track button.current{color:var(--gold-primary);font-weight:800}.creation-stage-track button.current i{background:var(--gold-primary);border-color:var(--gold-primary);box-shadow:0 0 13px rgba(var(--metal-rgb),.7)}.creation-stage-track button:not(:last-child) i:after{content:"";position:absolute;top:9px;left:3px;width:1px;height:14px;background:rgba(var(--metal-rgb),.16)}.creation-enterprise-action{width:100%;padding:.55rem;border:1px solid rgba(var(--metal-rgb),.27);border-radius:9px;background:linear-gradient(110deg,rgba(var(--metal-rgb),.11),transparent);color:var(--gold-primary);font-size:.67rem;font-weight:700;cursor:pointer}.creation-project-tools{display:grid;gap:.38rem;margin-top:.65rem}.creation-project-tools button{display:grid;gap:.12rem;padding:.55rem .6rem;border:1px solid rgba(255,255,255,.055);border-radius:9px;background:rgba(255,255,255,.018);color:#9b9387;text-align:left;cursor:pointer}.creation-project-tools button:hover{border-color:rgba(var(--metal-rgb),.33);color:var(--gold-primary)}.creation-project-tools strong{font-size:.7rem}.creation-project-tools span{color:#625c54;font-size:.59rem}.creation-project-artifacts{display:grid;gap:.38rem;margin-top:.6rem}.creation-project-artifacts>div{display:grid;gap:.08rem;padding:.42rem .5rem;border-radius:7px;background:rgba(var(--metal-rgb),.055)}.creation-project-artifacts strong{color:#91897e;font-size:.66rem}.creation-project-artifacts span{color:#5e5851;font-size:.57rem}.creation-studio-loading{display:grid;place-items:center;min-height:100px}
@media(max-width:1280px){.creation-studio{grid-template-columns:190px minmax(330px,1fr) 220px}.creation-tool-rail{padding:.75rem .55rem}.creation-project-tools button{padding:.48rem}}
@media(max-width:980px){.creation-studio{height:auto;min-height:calc(100dvh - 64px);grid-template-columns:180px minmax(0,1fr)}.creation-tool-rail{grid-column:1/-1;display:grid;grid-template-columns:1fr 1.4fr 1fr;border-left:0;border-top:1px solid rgba(var(--metal-rgb),.16);overflow:visible}.creation-chat-room{height:calc(100dvh - 64px)}.creation-path-card,.creation-tools-card,.creation-artifact-card{min-width:0}.creation-project-tools{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:680px){.creation-studio{display:flex;flex-direction:column;overflow:auto}.creation-project-rail{flex:0 0 auto;border-right:0;border-bottom:1px solid rgba(var(--metal-rgb),.15);padding:.6rem}.creation-rail-head{padding:.1rem .2rem .45rem}.creation-type-strip{display:flex;overflow-x:auto;border:0;padding:0 0 .45rem}.creation-type-strip button{flex:0 0 auto;min-width:42px}.creation-type-strip button span{display:none}.creation-project-list{display:flex;gap:.4rem;overflow-x:auto;padding:0}.creation-project-item{flex:0 0 155px;margin:0}.creation-no-projects{width:100%;padding:.6rem}.creation-chat-room{height:68dvh;min-height:520px;flex:0 0 auto}.creation-room-head{padding:.75rem}.creation-room-head p{max-width:62vw}.creation-project-chat{padding:.7rem}.creation-chat-message.user{margin-left:3%}.creation-project-composer{margin:.55rem}.creation-tool-rail{display:flex;overflow-x:auto;flex-direction:row;border-top:1px solid rgba(var(--metal-rgb),.15);padding:.7rem}.creation-path-card,.creation-tools-card,.creation-artifact-card{flex:0 0 82vw}.creation-project-tools{grid-template-columns:repeat(2,minmax(0,1fr))}}

.sprout-code-handoff{max-width:760px;margin:clamp(1rem,4vw,3rem) auto;padding:clamp(1.25rem,4vw,2.5rem);border:1px solid color-mix(in srgb,var(--gold-primary) 55%,transparent);border-radius:24px;background:linear-gradient(145deg,color-mix(in srgb,var(--gold-primary) 11%,var(--card-surface)),var(--card-surface));box-shadow:0 28px 80px rgba(0,0,0,.24)}
.sprout-code-handoff>span{display:block;color:var(--gold-primary);font-size:.72rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase}
.sprout-code-handoff h2{margin:.45rem 0 .7rem}.sprout-code-handoff p,.sprout-code-handoff small{color:var(--text-secondary);line-height:1.6}
.sprout-code-value{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin:1.25rem 0;padding:1rem 1.15rem;border:1px solid var(--border);border-radius:16px;background:rgba(0,0,0,.24)}
.sprout-code-value strong{font-family:'JetBrains Mono',monospace;font-size:clamp(1.05rem,3vw,1.55rem);letter-spacing:.08em;color:var(--gold-primary);overflow-wrap:anywhere}
.sprout-handoff-actions{display:flex;flex-wrap:wrap;gap:.75rem;margin-bottom:1rem}
.sprout-guardian-card small{display:block;margin-top:.35rem;color:var(--text-secondary)}
@media(max-width:600px){.sprout-code-value{align-items:stretch;flex-direction:column}.sprout-code-value .btn,.sprout-handoff-actions>*{width:100%;justify-content:center}}

html {
  scroll-behavior: smooth;
  font-size: 15px;
}

body {
  font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  background: var(--bg-void, #07070d);
  color: var(--text-primary, #f0ede8);
  overflow-x: hidden;
  line-height: 1.6;
  min-height: 100vh;
}

/* Grain texture — always present */
/* SVG uses viewBox to tile sharply on high-DPI; background-size forces cover at any scale */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
  background-size: 200px 200px;
  pointer-events: none;
  z-index: 9999;
  image-rendering: auto;
}

h1, h2, h3, h4 {
  font-family: 'Syne', 'Space Grotesk', sans-serif;
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: -0.02em;
  color: var(--text-primary, #f0ede8);
}

a { color: var(--gold-primary); text-decoration: none; }
a:hover { color: var(--gold-bright); }

.mono, code, pre {
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.88em;
}

/* ═══════════════════════════════════════════════════════════
   CSS VARIABLES — LUXURY DESIGN TOKENS
   ═══════════════════════════════════════════════════════════ */

:root {
  --metal-rgb:      200, 169, 110;
  /* Background layers */
  --bg-void:        #07070d;
  --bg-deep:        #0a0a12;
  --bg-surface:     #0e0e18;
  --bg-elevated:    #141424;
  --bg-glass:       rgba(14, 14, 24, 0.7);

  /* Gold — metallic gradient */
  --gold-primary:   #c8a96e;
  --gold-bright:    #e8d5a3;
  --gold-muted:     #8a7a52;
  --gold-dim:       #5a4a30;
  --gold-glow:      rgba(var(--metal-rgb), 0.12);
  --gold-glow-med:  rgba(var(--metal-rgb), 0.2);
  --gold-glow-strong: rgba(var(--metal-rgb), 0.35);
  --gold-gradient:  linear-gradient(135deg, #e8d5a3 0%, #c8a96e 40%, #8a7a52 100%);
  --gold-border:    rgba(var(--metal-rgb), 0.2);

  /* AI violet */
  --ai-primary:     #7b68ee;
  --ai-bright:      #a78bfa;
  --ai-deep:        #4a3f8a;
  --ai-glow:        rgba(123, 104, 238, 0.2);
  --ai-glow-strong: rgba(123, 104, 238, 0.4);

  /* Text */
  --text-primary:   #f0ede8;
  --text-secondary: #a8a4a0;
  --text-muted:     #6b6762;
  --text-ghost:     rgba(240, 237, 232, 0.35);

  /* Borders */
  --border-subtle:  rgba(255, 255, 255, 0.05);
  --border-glass:   rgba(255, 255, 255, 0.07);
  --border-active:  rgba(255, 255, 255, 0.12);
  --border-gold:    rgba(var(--metal-rgb), 0.2);
  --border-ai:      rgba(123, 104, 238, 0.25);

  /* Status */
  --success:        #4ade80;
  --success-dim:    rgba(74, 222, 128, 0.12);
  --warning:        #fbbf24;
  --warning-dim:    rgba(251, 191, 36, 0.12);
  --danger:         #f87171;
  --danger-dim:     rgba(248, 113, 113, 0.12);
  --info:           #60a5fa;

  /* Spacing */
  --space-1:  0.25rem;
  --space-2:  0.5rem;
  --space-3:  0.75rem;
  --space-4:  1rem;
  --space-5:  1.25rem;
  --space-6:  1.5rem;
  --space-8:  2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;

  /* Border radius */
  --radius-sm:   6px;
  --radius-md:   10px;
  --radius-lg:   16px;
  --radius-xl:   24px;
  --radius-pill: 100px;

  /* Typography */
  --text-xs:   11px;
  --text-sm:   13px;
  --text-base: 15px;
  --text-lg:   18px;
  --text-xl:   22px;
  --text-2xl:  28px;
  --text-3xl:  36px;

  /* Motion */
  --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out:   cubic-bezier(0.4, 0, 0.2, 1);
  --ease-spring:   cubic-bezier(0.34, 1.56, 0.64, 1);
  --dur-fast:      150ms;
  --dur-normal:    250ms;
  --dur-slow:      400ms;
  --dur-slowest:   700ms;

  /* Z-index layers */
  --z-shell:    50;
  --z-dock:     100;
  --z-nav:      200;
  --z-modal:    500;
  --z-toast:    600;
  --z-grain:    9999;

  /* Sidebar dimensions */
  --sidebar-collapsed: 64px;
  --sidebar-expanded:  220px;
  --topbar-height: 60px;

  /* Legacy/component aliases */
  --card-surface: var(--bg-surface);
  --surface: var(--bg-surface);
  --surface-2: var(--bg-elevated);
  --surface-elevated: var(--bg-elevated);
  --card-bg: var(--bg-surface);
  --white: var(--text-primary);
  --gray-light: var(--text-secondary);
  --gray: var(--text-muted);
  --gold: var(--gold-primary);
  --accent: var(--ai-primary);
  --border: var(--border-subtle);
  --text: var(--text-primary);
}

:root[data-theme="light"] {
  --metal-rgb: 95, 107, 122;
  --bg-void: #f5f1e9;
  --bg-deep: #eee8dc;
  --bg-surface: #fffaf2;
  --bg-elevated: #ffffff;
  --bg-glass: rgba(255, 252, 246, 0.82);

  --gold-primary: #5f6b7a;
  --gold-bright: #344152;
  --gold-muted: #7c8795;
  --gold-dim: #d9dee5;
  --gold-glow: rgba(var(--metal-rgb), 0.1);
  --gold-glow-med: rgba(var(--metal-rgb), 0.16);
  --gold-glow-strong: rgba(var(--metal-rgb), 0.25);
  --gold-gradient: linear-gradient(135deg, #f4f7fa 0%, #aab4c1 44%, #5f6b7a 100%);
  --gold-border: rgba(var(--metal-rgb), 0.24);
  --border-gold: rgba(var(--metal-rgb), 0.24);

  --ai-primary: #6654d7;
  --ai-bright: #5745c5;
  --ai-deep: #43369a;
  --ai-glow: rgba(102, 84, 215, 0.14);
  --ai-glow-strong: rgba(102, 84, 215, 0.25);

  --text-primary: #211d18;
  --text-secondary: #625b52;
  --text-muted: #847b70;
  --text-ghost: rgba(33, 29, 24, 0.38);

  --border-subtle: rgba(61, 48, 31, 0.09);
  --border-glass: rgba(61, 48, 31, 0.12);
  --border-active: rgba(61, 48, 31, 0.2);
  --border-gold: rgba(var(--metal-rgb), 0.24);
  --border-ai: rgba(102, 84, 215, 0.24);

  --success: #18864b;
  --warning: #a96500;
  --danger: #c33737;
  --info: #266bc0;
}

:root[data-theme="light"] img[src*="ascension-mark"] {
  filter: grayscale(1) contrast(1.08) brightness(1.06);
}

:root[data-theme="light"] .pr-badge,
:root[data-theme="light"] .set-tag-pr {
  background: var(--gold-gradient);
}

:root[data-theme="light"] .lb-rank.top-1 {
  color: var(--gold-bright);
  background: var(--gold-glow-med);
}

:root[data-theme="light"] .quest-card-domain-prod {
  --quest-color: var(--gold-primary);
}

/* ═══════════════════════════════════════════════════════════
   KEYFRAME ANIMATIONS
   ═══════════════════════════════════════════════════════════ */

@keyframes fadeUp {
  from { opacity: 0; transform: translateY(20px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes fadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes slideInLeft {
  from { opacity: 0; transform: translateX(-20px); }
  to   { opacity: 1; transform: translateX(0); }
}

/* AI Glyph animations */
@keyframes glyphBreathe {
  0%, 100% { box-shadow: 0 0 20px rgba(123,104,238,0.3), 0 0 40px rgba(123,104,238,0.1); }
  50%      { box-shadow: 0 0 40px rgba(123,104,238,0.5), 0 0 80px rgba(123,104,238,0.2), 0 0 120px rgba(123,104,238,0.05); }
}
@keyframes glyphCoreBreath {
  0%, 100% { transform: scale(1); }
  50%      { transform: scale(1.04); }
}
@keyframes glyphSpinConic {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}
@keyframes glyphRingRotate1 { from { transform: translate(-50%,-50%) rotate(0deg); } to { transform: translate(-50%,-50%) rotate(360deg); } }
@keyframes glyphRingRotate2 { from { transform: translate(-50%,-50%) rotate(360deg); } to { transform: translate(-50%,-50%) rotate(0deg); } }
@keyframes glyphPulse {
  0%, 100% { opacity: 0.5; }
  50%      { opacity: 1; }
}

/* Skeleton loading pulse */
@keyframes pulse {
  0%, 100% { opacity: 0.5; }
  50%       { opacity: 0.9; }
}

/* Gold shimmer */
@keyframes goldShimmer {
  0%   { background-position: -200% center; }
  100% { background-position: 200% center; }
}

/* Float */
@keyframes float {
  0%, 100% { transform: translateY(0px); }
  50%      { transform: translateY(-6px); }
}

/* Scroll reveal */
.reveal {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity var(--dur-slow) var(--ease-out-expo),
              transform var(--dur-slow) var(--ease-out-expo);
}
.reveal.visible { opacity: 1; transform: translateY(0); }

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  .reveal { opacity: 1; transform: none; }
  body::before { display: none; }
}

.account-backup-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 1rem;
  margin: 1.2rem 0;
  padding: clamp(1rem, 2vw, 1.35rem);
  border: 1px solid color-mix(in srgb, var(--gold-primary) 38%, var(--border));
  border-radius: 18px;
  background:
    radial-gradient(circle at 92% 12%, var(--gold-glow-med), transparent 34%),
    linear-gradient(135deg, color-mix(in srgb, var(--surface) 94%, var(--gold-primary) 6%), var(--surface));
}

.account-backup-copy h3 { margin: 0.18rem 0 0.35rem; }
.account-backup-copy p { margin: 0; max-width: 68ch; color: var(--text-secondary); line-height: 1.55; }
.account-backup-kicker { color: var(--gold-primary); font-size: 0.72rem; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; }
.account-backup-status { display: flex; flex-wrap: wrap; gap: 0.35rem 0.7rem; margin-top: 0.75rem; font-size: 0.82rem; }
.account-backup-status strong { color: var(--text-primary); }
.account-backup-status span { color: var(--text-secondary); }
.account-backup-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 0.55rem; }

@media (max-width: 720px) {
  .account-backup-card { grid-template-columns: 1fr; }
  .account-backup-actions { justify-content: flex-start; }
}

/* ═══════════════════════════════════════════════════════════
   APP SHELL — DESKTOP
   ═══════════════════════════════════════════════════════════ */

.app-shell {
  display: flex;
  min-height: 100vh;
  position: relative;
}

/* ── SIDEBAR ── */
.lux-sidebar {
  position: fixed;
  top: 0;
  left: 0;
  width: var(--sidebar-expanded);
  height: 100vh;
  z-index: var(--z-shell);
  background: rgba(7, 7, 13, 0.95);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  border-right: 1px solid var(--border-subtle);
  display: flex;
  flex-direction: column;
  transition: width var(--dur-slow) var(--ease-out-expo);
  overflow: hidden;
}

/* Grain on sidebar */
.lux-sidebar::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.025'/%3E%3C/svg%3E");
  pointer-events: none;
  z-index: 0;
}

.lux-sidebar:hover {
  width: var(--sidebar-expanded);
}

.sidebar-brand {
  padding: 1.25rem 0.75rem;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  border-bottom: 1px solid var(--border-subtle);
  position: relative;
  z-index: 1;
  min-height: 64px;
  cursor: pointer;
}

.sidebar-brand-icon {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  background: var(--gold-gradient);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-family: 'JetBrains Mono', monospace;
  font-size: 14px;
  font-weight: 700;
  color: #07070d;
  letter-spacing: -0.03em;
}

.sidebar-brand-text {
  font-family: 'Syne', sans-serif;
  font-size: var(--text-sm);
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  background: var(--gold-gradient);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  white-space: nowrap;
  opacity: 1;
  transition: opacity var(--dur-normal) var(--ease-out-expo);
}

.lux-sidebar:hover .sidebar-brand-text {
  opacity: 1;
}

.sidebar-nav {
  flex: 1;
  padding: 0.75rem 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
  overflow-y: auto;
  overflow-x: hidden;
  position: relative;
  z-index: 1;
}

.sidebar-section-label {
  font-size: var(--text-xs);
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--text-muted);
  padding: 0.5rem 1rem;
  white-space: nowrap;
  opacity: 1;
  transition: opacity var(--dur-normal) var(--ease-out-expo);
  margin-top: 0.5rem;
}

.lux-sidebar:hover .sidebar-section-label {
  opacity: 1;
}

.sidebar-link {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.65rem 0.75rem;
  color: var(--text-secondary);
  text-decoration: none;
  border-radius: var(--radius-md);
  transition: all var(--dur-fast) var(--ease-out-expo);
  position: relative;
  white-space: nowrap;
  font-size: var(--text-sm);
  font-weight: 500;
  min-height: 44px;
  border-left: 2px solid transparent;
}

.sidebar-link::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: var(--radius-md);
  background: rgba(255,255,255,0.03);
  opacity: 0;
  transition: opacity var(--dur-fast) var(--ease-out-expo);
}

.sidebar-link:hover::before { opacity: 1; }
.sidebar-link:hover { color: var(--text-primary); }

.sidebar-link.active {
  color: var(--gold-bright);
  border-left-color: var(--gold-primary);
  background: rgba(var(--metal-rgb), 0.06);
}

.sidebar-link.active::after {
  content: '';
  position: absolute;
  left: -2px;
  top: 50%;
  transform: translateY(-50%);
  width: 2px;
  height: 20px;
  background: var(--gold-primary);
  border-radius: 0 2px 2px 0;
  box-shadow: 0 0 8px rgba(var(--metal-rgb), 0.5);
}

.sidebar-link-icon {
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 14px;
  border-radius: var(--radius-sm);
  background: rgba(255,255,255,0.04);
  transition: all var(--dur-fast) var(--ease-out-expo);
}

.sidebar-link:hover .sidebar-link-icon {
  background: rgba(255,255,255,0.08);
}

.sidebar-link-text {
  opacity: 1;
  transition: opacity var(--dur-normal) var(--ease-out-expo);
}

.lux-sidebar:hover .sidebar-link-text {
  opacity: 1;
}

/* Media Studio hamburger sub-groups */
.sidebar-sub-group {
  margin-bottom: 0.25rem;
}
.sidebar-sub-label {
  font-size: 0.65rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--text-muted);
  padding: 0.4rem 0.75rem 0.2rem;
  opacity: 0.6;
  transition: opacity var(--dur-normal) var(--ease-out-expo);
}
.lux-sidebar:hover .sidebar-sub-label { opacity: 0.6; }
.sidebar-sub-link {
  padding-left: 2rem !important;
  font-size: 0.78rem !important;
  min-height: 36px !important;
}

.sidebar-top {
  padding: 0.75rem 0;
  border-bottom: 1px solid var(--border-subtle);
  position: relative;
  z-index: 1;
}

.sidebar-bottom {
  padding: 0.75rem 0;
  border-top: 1px solid var(--border-subtle);
  position: relative;
  z-index: 1;
}

.sidebar-user {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.65rem 0.75rem;
  border-radius: var(--radius-md);
  cursor: pointer;
  transition: all var(--dur-fast) var(--ease-out-expo);
  white-space: nowrap;
  min-height: 44px;
  width: 100%;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
  font: inherit;
}

.sidebar-user:hover {
  background: rgba(255,255,255,0.04);
}

.sidebar-avatar {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--ai-deep), var(--ai-primary));
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  font-weight: 600;
  color: #f0ede8;
  flex-shrink: 0;
  border: 1px solid var(--border-glass);
  overflow: hidden;
}

.nav-profile-photo {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: inherit;
}

.sidebar-profile-link:focus-visible,
.nav-mobile-profile-link:focus-visible {
  outline: 2px solid var(--gold-bright);
  outline-offset: 2px;
}

.sidebar-user-info {
  opacity: 1;
  transition: opacity var(--dur-normal) var(--ease-out-expo);
  overflow: hidden;
}

.lux-sidebar:hover .sidebar-user-info {
  opacity: 1;
}

.sidebar-user-name {
  font-size: var(--text-sm);
  font-weight: 600;
  color: var(--text-primary);
  white-space: nowrap;
}

.sidebar-user-level {
  font-size: var(--text-xs);
  color: var(--text-muted);
  font-family: 'JetBrains Mono', monospace;
}

.sidebar-user-card {
  margin: 0 0.45rem;
  padding: 0.25rem;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-lg);
  background: linear-gradient(145deg, rgba(var(--metal-rgb), 0.055), rgba(255,255,255,0.012));
}

.sidebar-user-card .sidebar-user { padding: 0.55rem 0.45rem; }

.sidebar-os-toggle,
.nav-mobile-os-toggle {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3px;
  padding: 3px;
  border: 1px solid var(--border-subtle);
  border-radius: 9px;
  background: rgba(0,0,0,0.16);
  color: var(--text-muted);
  text-decoration: none;
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.61rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.sidebar-os-toggle span,
.nav-mobile-os-toggle span {
  display: grid;
  place-items: center;
  min-height: 25px;
  border-radius: 6px;
  transition: color var(--dur-fast), background var(--dur-fast);
}

.sidebar-os-toggle .active,
.nav-mobile-os-toggle .active {
  color: var(--bg-primary);
  background: var(--gold-gradient);
  box-shadow: 0 3px 14px rgba(var(--metal-rgb), 0.13);
}

.sidebar-os-toggle:hover span:last-child,
.nav-mobile-os-toggle:hover span:last-child { color: var(--gold-bright); }

/* ── STANDALONE PAGE TOP NAV ── */
.top-nav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: var(--z-shell);
  display: flex;
  align-items: center;
  gap: 1rem;
  height: var(--topbar-height);
  padding: 0 1.25rem;
  background: rgba(7, 7, 13, 0.92);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-bottom: 1px solid var(--border-subtle);
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.18);
}

.top-nav h1 {
  margin: 0;
  font-size: var(--text-md);
  font-weight: 700;
  color: var(--text-primary);
  flex: 1;
}

.creation-main,
.inbox-main {
  padding-top: calc(var(--topbar-height) + 1rem);
  min-height: 100vh;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  padding-bottom: 2rem;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  max-width: 1100px;
}

.inbox-view {
  background: rgba(var(--metal-rgb), 0.05);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  padding: 1.25rem;
}

.inbox-view .section-header {
  margin-bottom: 1rem;
}

.inbox-list {
  display: grid;
  gap: 0.5rem;
}

.inbox-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.75rem;
  background: rgba(var(--metal-rgb), 0.04);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm);
}

.inbox-row-name {
  color: var(--text-primary);
  font-weight: 500;
  word-break: break-word;
}

.inbox-card {
  margin-top: 1rem;
  padding: 1rem;
  background: rgba(var(--metal-rgb), 0.04);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm);
  display: grid;
  gap: 0.75rem;
}

.inbox-card-title {
  margin: 0;
  font-size: var(--text-sm);
  font-weight: 700;
  color: var(--gold-primary);
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.inbox-messages {
  display: grid;
  gap: 0.75rem;
  margin-bottom: 1rem;
}

.inbox-message {
  max-width: 80%;
  padding: 0.75rem 1rem;
  border-radius: var(--radius-md);
  background: rgba(var(--metal-rgb), 0.08);
  border: 1px solid var(--border-subtle);
}

.inbox-message.me {
  margin-left: auto;
  background: rgba(201, 175, 131, 0.12);
  border-color: rgba(201, 175, 131, 0.25);
}

.inbox-message p {
  margin: 0 0 0.35rem;
  color: var(--text-primary);
  line-height: 1.45;
}

.inbox-message small {
  display: block;
  color: var(--text-muted);
  font-size: var(--text-xs);
}

.inbox-compose-row {
  display: flex;
  gap: 0.5rem;
  align-items: flex-start;
}

.inbox-compose-row .form-input {
  flex: 1;
}

/* ── SPACES HUB ── */
.spaces-main {
  padding-top: calc(var(--topbar-height) + 1rem);
  min-height: 100vh;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  padding-bottom: 2rem;
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: 1.5rem;
  align-items: start;
}

.spaces-view {
  background: rgba(var(--metal-rgb), 0.05);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  padding: 1.25rem;
}

.spaces-view .section-header {
  margin-bottom: 1rem;
}

.spaces-list {
  display: grid;
  gap: 0.75rem;
}

.space-card {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.9rem;
  background: rgba(var(--metal-rgb), 0.04);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm);
}

.space-type {
  font-size: var(--text-xs);
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--gold-primary);
}

.space-card h3 {
  margin: 0.25rem 0;
  color: var(--text-primary);
  font-size: var(--text-md);
}

.space-card p {
  margin: 0;
  color: var(--text-muted);
  font-size: var(--text-sm);
}

.spaces-form {
  display: grid;
  gap: 0.85rem;
}

@media (max-width: 900px) {
  .spaces-main {
    grid-template-columns: 1fr;
  }
}

/* ── CREATION WORKSPACE STANDALONE ── */
.creation-main {
  display: grid;
  grid-template-columns: 260px 1fr 260px;
  gap: 1.25rem;
  align-items: start;
}

.creation-sidebar {
  position: sticky;
  top: calc(var(--topbar-height) + 1rem);
  background: rgba(var(--metal-rgb), 0.04);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  padding: 1rem;
  max-height: calc(100vh - var(--topbar-height) - 2rem);
  overflow: auto;
}

.creation-sidebar h3 {
  margin: 0 0 0.75rem;
  font-size: var(--text-sm);
  font-weight: 700;
  color: var(--gold-primary);
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.creation-seed-list {
  display: grid;
  gap: 0.5rem;
  margin-bottom: 0.5rem;
}

.creation-seed-item {
  padding: 0.6rem;
  background: rgba(var(--metal-rgb), 0.04);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm);
}

.creation-seed-item span {
  font-size: var(--text-xs);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--gold-primary);
}

.creation-seed-item p {
  margin: 0.25rem 0;
  color: var(--text-primary);
  font-weight: 500;
}

.creation-seed-item small {
  display: block;
  color: var(--text-muted);
  font-size: var(--text-xs);
}

.creation-seed-form {
  display: grid;
  gap: 0.5rem;
}

.creation-center {
  display: flex;
  flex-direction: column;
  height: calc(100vh - var(--topbar-height) - 2rem);
  background: rgba(var(--metal-rgb), 0.04);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  overflow: hidden;
}

.chat-messages {
  flex: 1;
  overflow-y: auto;
  padding: 1rem;
  display: grid;
  gap: 0.75rem;
  align-content: flex-start;
}

.creation-message {
  max-width: 80%;
  padding: 0.75rem 1rem;
  border-radius: var(--radius-md);
  background: rgba(var(--metal-rgb), 0.08);
  border: 1px solid var(--border-subtle);
}

.creation-message.user {
  margin-left: auto;
  background: rgba(201, 175, 131, 0.12);
  border-color: rgba(201, 175, 131, 0.25);
}

.creation-message p {
  margin: 0;
  color: var(--text-primary);
  line-height: 1.45;
}

.creation-message a {
  color: var(--gold-primary);
  text-decoration: none;
}

.creation-compose,
.creation-upload {
  display: flex;
  gap: 0.5rem;
  padding: 0.75rem;
  border-top: 1px solid var(--border-subtle);
  background: rgba(7, 7, 13, 0.6);
  align-items: flex-start;
}

.creation-compose .form-input,
.creation-upload .form-input,
.creation-upload input[type="file"] {
  flex: 1;
}

.creation-asset-row,
.creation-upload {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0.5rem 0;
  border-bottom: 1px solid var(--border-subtle);
}

.creation-asset-row:last-child,
.creation-upload {
  border-bottom: none;
}

#creation-actions .btn-secondary,
#creation-actions .btn-primary,
#creation-seed-vault .btn-secondary,
#creation-seed-vault .btn-primary {
  width: 100%;
  margin-bottom: 0.4rem;
  text-align: left;
}

@media (max-width: 900px) {
  .creation-main {
    grid-template-columns: 1fr;
  }
  .creation-sidebar {
    position: static;
    max-height: none;
  }
  .creation-center {
    height: 60vh;
  }
}

/* ── TOP BAR ── */
.lux-topbar {
  position: fixed;
  top: 0;
  left: var(--sidebar-expanded);
  right: 0;
  height: var(--topbar-height);
  z-index: var(--z-shell);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 2rem;
  background: rgba(7, 7, 13, 0.9);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-bottom: 1px solid var(--border-subtle);
  transition: left var(--dur-slow) var(--ease-out-expo);
}

.topbar-left {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.topbar-context-line {
  display: flex;
  flex-direction: column;
}

.topbar-context-label {
  font-size: var(--text-xs);
  color: var(--text-muted);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-family: 'JetBrains Mono', monospace;
}

.topbar-context-value {
  font-size: var(--text-sm);
  color: var(--text-secondary);
  font-weight: 500;
  line-height: 1.2;
}

.topbar-right {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.topbar-messages-link {
  color: var(--text-primary);
  text-decoration: none;
  font-size: 1.25rem;
  line-height: 1;
  padding: 0.35rem;
  border-radius: var(--radius-sm);
  transition: color 0.15s, background 0.15s;
}

.topbar-messages-link:hover,
.topbar-messages-link:focus {
  color: var(--accent-primary);
  background: rgba(var(--metal-rgb), 0.08);
}

.topbar-center {
  display: flex;
  align-items: center;
  justify-content: center;
}

.topbar-product-logo {
  display: block;
  width: 52px;
  height: 52px;
  object-fit: contain;
  border-radius: 10px;
  filter: drop-shadow(0 0 10px rgba(var(--metal-rgb), 0.2));
}

/* Mobile hamburger button */
.topbar-hamburger {
  display: none;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 5px;
  width: 40px;
  height: 40px;
  background: rgba(var(--metal-rgb),  0.08);
  border: 1px solid rgba(var(--metal-rgb),  0.15);
  border-radius: 10px;
  cursor: pointer;
  padding: 0;
  transition: background var(--dur-fast);
  flex-shrink: 0;
}

.topbar-hamburger:hover { background: rgba(var(--metal-rgb),  0.15); }
.topbar-hamburger:active { background: rgba(var(--metal-rgb),  0.25); }

.hamburger-bar {
  display: block;
  width: 18px;
  height: 2px;
  background: var(--gold-primary);
  border-radius: 2px;
  transition: all var(--dur-normal);
}

#nav-hamburger[aria-expanded="true"] .hamburger-bar:nth-child(1) {
  transform: translateY(7px) rotate(45deg);
}
#nav-hamburger[aria-expanded="true"] .hamburger-bar:nth-child(2) {
  opacity: 0;
}
#nav-hamburger[aria-expanded="true"] .hamburger-bar:nth-child(3) {
  transform: translateY(-7px) rotate(-45deg);
}

/* Mobile backdrop */
.nav-mobile-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(7, 7, 13, 0.7);
  backdrop-filter: blur(4px);
  z-index: calc(var(--z-shell) + 1);
  opacity: 0;
  pointer-events: none;
  transition: opacity var(--dur-normal);
}

.nav-mobile-backdrop.open {
  opacity: 1;
  pointer-events: auto;
}

/* Mobile slide-out nav */
.nav-mobile-menu {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  width: 300px;
  max-width: 85vw;
  background: rgba(7, 7, 13, 0.98);
  backdrop-filter: blur(30px);
  -webkit-backdrop-filter: blur(30px);
  border-right: 1px solid rgba(var(--metal-rgb), 0.12);
  z-index: calc(var(--z-shell) + 2);
  transform: translateX(-100%);
  transition: transform var(--dur-normal) var(--ease-out-expo);
  overflow-y: auto;
  padding-bottom: calc(2rem + env(safe-area-inset-bottom, 0));
}

.nav-mobile-menu.open {
  transform: translateX(0);
}

.nav-mobile-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.25rem 1rem;
  border-bottom: 1px solid rgba(var(--metal-rgb), 0.1);
}

.nav-mobile-brand {
  font-family: 'Syne', sans-serif;
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  background: var(--gold-gradient);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.nav-mobile-close {
  background: none;
  border: none;
  color: var(--text-secondary);
  font-size: 1.2rem;
  cursor: pointer;
  padding: 0.25rem;
  border-radius: 6px;
}

.nav-mobile-close:hover { color: var(--text-primary); }

.nav-mobile-user {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 1rem;
  width: 100%;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
  font: inherit;
  cursor: pointer;
}

.nav-mobile-user:hover { background: rgba(255,255,255,0.04); }

.nav-mobile-user-card {
  margin: 0.7rem 0.75rem 0.2rem;
  padding: 0.25rem;
  border: 1px solid var(--border-subtle);
  border-radius: 14px;
  background: linear-gradient(145deg, rgba(var(--metal-rgb), 0.055), rgba(255,255,255,0.012));
}

.nav-mobile-user-card .nav-mobile-user { padding: 0.7rem; }
.nav-mobile-user-card .nav-mobile-os-toggle { margin: 0 0.35rem 0.35rem; }

.nav-mobile-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--gold-gradient);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 0.9rem;
  color: #07070d;
  flex-shrink: 0;
  overflow: hidden;
}

.nav-mobile-name {
  font-weight: 600;
  font-size: 0.9rem;
  color: var(--text-primary);
}

.nav-mobile-level {
  font-size: 0.75rem;
  color: var(--text-muted);
}

.nav-mobile-divider {
  height: 1px;
  background: rgba(var(--metal-rgb), 0.08);
  margin: 0.5rem 0;
}

.nav-mobile-section-label {
  font-size: 0.65rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--text-muted);
  padding: 0.5rem 1rem 0.25rem;
}

.nav-mobile-link {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.65rem 1rem;
  color: var(--text-secondary);
  text-decoration: none;
  font-size: 0.88rem;
  transition: all var(--dur-fast);
  border-left: 2px solid transparent;
}

.nav-mobile-link:hover { color: var(--text-primary); background: rgba(255,255,255,0.04); }
.nav-mobile-link.active { color: var(--gold-bright); background: rgba(var(--metal-rgb), 0.06); border-left-color: var(--gold-primary); }

.nav-mobile-icon {
  font-size: 1rem;
  width: 1.5rem;
  text-align: center;
  opacity: 0.7;
}

.nav-mobile-link.active .nav-mobile-icon { opacity: 1; }

.nav-mobile-signout {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.65rem 1rem;
  color: var(--text-muted);
  text-decoration: none;
  font-size: 0.88rem;
  transition: color var(--dur-fast);
  margin-top: 0.5rem;
}

.nav-mobile-signout:hover { color: var(--danger); }

/* ── MAIN CONTENT ── */
:root {
  --ap-terminal-clearance: 7rem;
}

.app-content {
  margin-left: var(--sidebar-expanded);
  margin-top: var(--topbar-height);
  min-height: calc(100vh - var(--topbar-height));
  width: calc(100% - var(--sidebar-expanded));
  transition: all var(--dur-slow) var(--ease-out-expo);
  padding: 2rem 2.5rem calc(var(--ap-terminal-clearance) + env(safe-area-inset-bottom, 0px));
  position: relative;
}

/* ═══════════════════════════════════════════════════════════
   GLASS SURFACE SYSTEM — "RIDICULOUSLY EXPENSIVE"
   ═══════════════════════════════════════════════════════════ */

.glass-card {
  background: var(--bg-glass);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid var(--border-glass);
  border-radius: var(--radius-lg);
  box-shadow: 0 0 0 1px rgba(0,0,0,0.3),
              0 20px 60px rgba(0, 0, 0, 0.4),
              0 0 30px rgba(var(--metal-rgb), 0.04);
  transition: all var(--dur-normal) var(--ease-out-expo);
  position: relative;
  overflow: hidden;
}

/* Ambient edge highlight */
.glass-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(to right, transparent, rgba(255,255,255,0.08), transparent);
  pointer-events: none;
}

.glass-card:hover {
  border-color: var(--border-active);
  box-shadow: 0 0 0 1px rgba(0,0,0,0.3),
              0 24px 60px rgba(0, 0, 0, 0.5),
              0 0 24px rgba(var(--metal-rgb), 0.06);
}

/* ── AI Profile Completeness ────────────────────────────────────────────── */

.ai-profile-completeness { margin-bottom: 1.5rem; }
.ai-profile-header {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--gold-primary);
  margin-bottom: 0.75rem;
}
.ai-profile-bar-wrap {
  background: rgba(255,255,255,0.05);
  border-radius: 20px;
  height: 10px;
  overflow: hidden;
  margin-bottom: 0.25rem;
}
.ai-profile-bar-fill {
  height: 100%;
  background: linear-gradient(to right, var(--gold-muted), var(--gold-primary), var(--gold-bright));
  border-radius: 20px;
  transition: width 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}
.ai-profile-bar-track {
  display: flex;
  justify-content: space-between;
  font-size: 0.7rem;
  color: #6b6560;
  margin-top: 0.25rem;
}
.ai-profile-sources { margin-top: 1rem; }
.ai-profile-source-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.4rem 0;
  border-bottom: 1px solid rgba(255,255,255,0.04);
  font-size: 0.78rem;
}
.ai-profile-source-label { display: flex; align-items: center; gap: 0.4rem; }
.ai-profile-source-bar { width: 60px; height: 4px; background: rgba(255,255,255,0.06); border-radius: 2px; overflow: hidden; flex-shrink: 0; }
.ai-profile-source-bar-fill { height: 100%; background: var(--gold-primary); border-radius: 2px; }
.ai-profile-source-connected { color: #22c55e; font-size: 0.72rem; }
.ai-profile-source-missing { color: #6b6560; font-size: 0.72rem; }
.ai-profile-missing-blocks { margin-top: 0.75rem; }

/* ── Connection Value Card ───────────────────────────────────────────────── */

.conn-value-card {
  margin-top: 0.75rem;
  padding-top: 0.75rem;
  border-top: 1px solid rgba(255,255,255,0.06);
}
.conn-value-card-title {
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #a09080;
  margin-bottom: 0.4rem;
}
.conn-value-card-learnings {
  list-style: none;
  padding: 0;
  margin: 0;
}
.conn-value-card-learnings li {
  font-size: 0.75rem;
  color: #a09080;
  padding: 0.2rem 0;
  padding-left: 1rem;
  position: relative;
  line-height: 1.4;
}
.conn-value-card-learnings li::before {
  content: '•';
  position: absolute;
  left: 0;
  color: var(--gold-primary);
}
.conn-value-card-impact {
  margin-top: 0.5rem;
  font-size: 0.75rem;
  font-style: italic;
  color: var(--gold-primary);
  line-height: 1.4;
}

/* ── Before You Skip Modal ──────────────────────────────────────────────── */

.before-skip-modal .modal-body { text-align: center; }
.before-skip-modal .skip-icon { font-size: 2.5rem; margin-bottom: 0.75rem; }
.before-skip-modal .skip-title { font-size: 1rem; font-weight: 700; color: #f0ede8; margin-bottom: 0.5rem; }
.before-skip-modal .skip-desc { font-size: 0.82rem; color: #a09080; line-height: 1.5; margin-bottom: 0.75rem; }
.before-skip-modal .skip-example {
  background: rgba(var(--metal-rgb), 0.06);
  border: 1px solid rgba(var(--metal-rgb), 0.12);
  border-radius: 8px;
  padding: 0.75rem;
  font-size: 0.75rem;
  color: var(--gold-primary);
  font-style: italic;
  margin-bottom: 1rem;
  text-align: left;
  line-height: 1.5;
}
.before-skip-modal .skip-actions { display: flex; gap: 0.5rem; justify-content: center; flex-wrap: wrap; }
.before-skip-modal .skip-actions .btn { flex: 1; min-width: 120px; }

/* ── AI Intelligence Profile section ───────────────────────────────────── */

.ai-intel-section { margin-top: 1rem; }
.ai-intel-header-row { display: flex; justify-content: space-between; align-items: center; margin-bottom: 0.75rem; }
.ai-intel-header { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--gold-primary); }
.ai-intel-bar-wrap { background: rgba(255,255,255,0.05); border-radius: 20px; height: 8px; overflow: hidden; margin-bottom: 0.25rem; }
.ai-intel-bar-fill { height: 100%; background: linear-gradient(to right, var(--gold-muted), var(--gold-primary)); border-radius: 20px; transition: width 0.8s cubic-bezier(0.16, 1, 0.3, 1); }
.ai-intel-source-row { display: flex; justify-content: space-between; align-items: center; padding: 0.35rem 0; border-bottom: 1px solid rgba(255,255,255,0.04); font-size: 0.75rem; }
.ai-intel-bar-small { width: 50px; height: 3px; background: rgba(255,255,255,0.06); border-radius: 2px; overflow: hidden; flex-shrink: 0; }
.ai-intel-bar-small-fill { height: 100%; background: var(--gold-primary); border-radius: 2px; }

/* Toast AI voice */
.toast.ai-voice { border-left: 3px solid var(--gold-primary); }
.toast.ai-voice .toast-text { font-style: italic; }

.glass-card-elevated {
  background: rgba(20, 20, 36, 0.8);
  backdrop-filter: blur(30px);
  -webkit-backdrop-filter: blur(30px);
  border: 1px solid rgba(var(--metal-rgb), 0.15);
  border-radius: var(--radius-xl);
  box-shadow: 0 0 40px rgba(var(--metal-rgb), 0.05),
              0 30px 80px rgba(0, 0, 0, 0.5);
}

.glass-surface {
  background: rgba(14, 14, 24, 0.6);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
}

/* ═══════════════════════════════════════════════════════════
   STATE ZONES — DASHBOARD
   ═══════════════════════════════════════════════════════════ */

.state-zones {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 1rem;
  margin-bottom: 2.5rem;
}

.state-zone {
  padding: 1.5rem;
  position: relative;
  overflow: hidden;
  cursor: pointer;
}

.state-zone::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: var(--zone-color, var(--gold-primary));
  opacity: 0.4;
  transition: opacity var(--dur-normal);
}

.state-zone:hover::after { opacity: 0.8; }

.state-zone-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.75rem;
}

.state-zone-icon {
  width: 36px;
  height: 36px;
  border-radius: var(--radius-sm);
  background: rgba(255,255,255,0.05);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  border: 1px solid var(--border-subtle);
}

.state-zone-label {
  font-size: var(--text-xs);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--text-muted);
  font-weight: 600;
}

.state-zone-statement {
  font-size: var(--text-base);
  font-weight: 500;
  color: var(--text-primary);
  line-height: 1.5;
  margin-bottom: 0.75rem;
}

.state-zone-hint {
  font-size: var(--text-sm);
  color: var(--text-muted);
  font-style: italic;
}

.state-zone-cta {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: var(--text-sm);
  color: var(--zone-color, var(--gold-primary));
  font-weight: 600;
  opacity: 0;
  transform: translateY(4px);
  transition: all var(--dur-normal) var(--ease-out-expo);
}

.state-zone:hover .state-zone-cta {
  opacity: 1;
  transform: translateY(0);
}

/* ═══════════════════════════════════════════════════════════
   GLOBAL DESIGN CONSTITUTION — MOBILE NAV
   ═══════════════════════════════════════════════════════════ */

/* Mobile bottom bar — 5 tabs + center Orb */
.mobile-dock {
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: var(--z-dock);
  padding: 0.6rem 1rem calc(0.6rem + env(safe-area-inset-bottom, 0));
  background: rgba(7, 7, 13, 0.98);
  backdrop-filter: blur(30px) saturate(180%);
  -webkit-backdrop-filter: blur(30px) saturate(180%);
  border-top: 1px solid rgba(var(--metal-rgb), 0.12);
}

.dock-inner {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 0.25rem;
  max-width: 500px;
  margin: 0 auto;
}

.dock-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  padding: 0.4rem 0.3rem;
  background: none;
  border: none;
  color: var(--text-muted);
  cursor: pointer;
  border-radius: var(--radius-md);
  transition: all var(--dur-fast) var(--ease-out-expo);
  min-width: 52px;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
  flex: 1;
}

.dock-btn:active {
  transform: scale(0.9);
  color: var(--text-primary);
}

.dock-btn.active { color: var(--gold-bright); }

.dock-btn-icon {
  width: 22px;
  height: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  opacity: 0.7;
  transition: opacity var(--dur-fast);
}

.dock-btn.active .dock-btn-icon { opacity: 1; }

.dock-btn-label {
  font-size: 9px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 600;
  opacity: 0.55;
  transition: opacity var(--dur-fast);
}

.dock-btn.active .dock-btn-label { opacity: 1; }

/* AI Dock Orb — GPU-composited for sharp retina rendering */
.dock-ai-orb {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: radial-gradient(circle at 40% 40%, var(--ai-primary) 0%, var(--ai-deep) 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0 20px rgba(123,104,238,0.4), 0 0 40px rgba(123,104,238,0.15);
  cursor: pointer;
  transition: all var(--dur-normal) var(--ease-out-expo);
  flex-shrink: 0;
  border: none;
  animation: glyphBreathe 4s ease-in-out infinite;
  transform: translateZ(0);
  backface-visibility: hidden;
}

.dock-ai-orb:active {
  transform: scale(0.94) translateZ(0);
}

.dock-ai-orb .glyph-core-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #ffffff;
  box-shadow: 0 0 6px rgba(255,255,255,0.6);
  transform: translateZ(0);
  will-change: contents;
}

/* ═══════════════════════════════════════════════════════════
   GLOBAL DESIGN CONSTITUTION — AI SCREEN (4-MODE SEGMENTED CONTROL)
   ═══════════════════════════════════════════════════════════ */

.ai-mode-control {
  display: flex;
  gap: 0.35rem;
  padding: 0.75rem 1rem;
  background: var(--bg-surface);
  border-bottom: 1px solid var(--border-subtle);
  overflow-x: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.ai-mode-control::-webkit-scrollbar { display: none; }

.ai-mode-btn {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.5rem 0.875rem;
  background: rgba(255,255,255,0.03);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-pill);
  color: var(--text-muted);
  font-size: 0.8rem;
  font-weight: 600;
  cursor: pointer;
  transition: all var(--dur-fast) var(--ease-out-expo);
  font-family: inherit;
  white-space: nowrap;
  flex-shrink: 0;
}

.ai-mode-btn:hover {
  color: var(--text-primary);
  background: rgba(255,255,255,0.06);
  border-color: var(--border-glass);
}

.ai-mode-btn.active {
  background: var(--ai-glow);
  border-color: var(--ai-primary);
  color: var(--ai-bright);
}

.ai-mode-icon { font-size: 0.85rem; }
.ai-mode-label { font-size: 0.8rem; }

/* Mobile AI mode: compact */
@media (max-width: 640px) {
  .ai-mode-control { padding: 0.5rem 0.75rem; gap: 0.25rem; }
  .ai-mode-btn { padding: 0.4rem 0.65rem; font-size: 0.75rem; }
  .ai-mode-label { display: none; }
}

/* ═══════════════════════════════════════════════════════════
   GLOBAL DESIGN CONSTITUTION — DAILY BRIEFING (HOME)
   ═══════════════════════════════════════════════════════════ */

/* Briefing Header */
.briefing-header {
  margin-bottom: 1.25rem;
}

.briefing-date {
  font-size: 0.72rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-muted);
  font-weight: 600;
  margin-bottom: 0.35rem;
}

.briefing-greeting {
  font-family: 'Syne', sans-serif;
  font-size: 2rem;
  font-weight: 700;
  color: var(--text-primary);
  line-height: 1.1;
  letter-spacing: -0.03em;
}

.briefing-greeting span {
  color: var(--gold-primary);
}

.briefing-streak {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  margin-top: 0.5rem;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--gold-primary);
  background: var(--gold-glow);
  border: 1px solid var(--gold-border);
  padding: 0.25rem 0.65rem;
  border-radius: 100px;
}

.briefing-streak.muted {
  color: var(--text-muted);
  background: transparent;
  border-color: var(--border-subtle);
}

.streak-flame {
  font-size: 0.9rem;
}

/* Three State Cards — Constitution: Intelligence Present, Not Displayed */
.briefing-state-zones {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.75rem;
  margin-bottom: 1.5rem;
}

.briefing-card {
  padding: 1.1rem 1rem;
  background: rgba(14, 14, 24, 0.6);
  border: 1px solid var(--border-glass);
  border-radius: var(--radius-lg);
  border-top: 2px solid var(--card-accent, var(--gold-primary));
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  transition: all var(--dur-normal) var(--ease-out-expo);
  cursor: default;
}

.briefing-card:hover {
  background: rgba(20, 20, 36, 0.8);
  border-color: var(--card-accent, var(--gold-border));
  transform: translateY(-2px);
}

.briefing-card-icon {
  font-size: 1.1rem;
  margin-bottom: 0.15rem;
}

.briefing-card-label {
  font-size: 0.62rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--text-muted);
  font-weight: 600;
}

.briefing-card-value {
  font-family: 'Syne', sans-serif;
  font-size: 1.3rem;
  font-weight: 700;
  color: var(--text-primary);
  line-height: 1.1;
  text-transform: capitalize;
}

.briefing-card-hint {
  font-size: 0.72rem;
  color: var(--text-muted);
  line-height: 1.4;
  margin-top: 0.1rem;
}

/* Today's Focus Card */
.briefing-focus-card {
  background: rgba(14, 14, 24, 0.8);
  border: 1px solid var(--gold-border);
  border-radius: var(--radius-xl);
  padding: 1.5rem;
  margin-bottom: 1.5rem;
  text-align: center;
}

.bfc-label {
  font-size: 0.65rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--gold-muted);
  font-weight: 700;
  margin-bottom: 0.75rem;
}

.bfc-title {
  font-family: 'Syne', sans-serif;
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--text-primary);
  line-height: 1.4;
}

.bfc-meta {
  margin-top: 0.4rem;
  font-size: 0.78rem;
  color: var(--gold-primary);
  font-weight: 600;
}

/* Mobile briefing: stack to single column */
@media (max-width: 640px) {
  .briefing-greeting { font-size: 1.6rem; }
  .briefing-state-zones { grid-template-columns: 1fr; gap: 0.5rem; }
  .briefing-card { padding: 0.875rem; }
  .briefing-card-value { font-size: 1.1rem; }
}

@media (min-width: 641px) and (max-width: 900px) {
  .briefing-state-zones { grid-template-columns: repeat(3, 1fr); }
}

/* ═══════════════════════════════════════════════════════════
   DASHBOARD — MODULE GRID
   ═══════════════════════════════════════════════════════════ */

.module-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 0.75rem;
  margin-bottom: 2rem;
}

.module-card {
  padding: 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  cursor: pointer;
  text-decoration: none;
  position: relative;
}

.module-card-glyph {
  width: 40px;
  height: 40px;
  border-radius: var(--radius-sm);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
}

.module-card-name {
  font-family: 'Syne', sans-serif;
  font-size: var(--text-sm);
  font-weight: 700;
  color: var(--text-primary);
  letter-spacing: -0.01em;
}

.module-card-desc {
  font-size: var(--text-xs);
  color: var(--text-muted);
  line-height: 1.4;
}

.module-card-stat {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  font-size: var(--text-xs);
  color: var(--text-secondary);
  font-family: 'JetBrains Mono', monospace;
}

/* ═══════════════════════════════════════════════════════════
   DASHBOARD HEADER
   ═══════════════════════════════════════════════════════════ */

.dashboard-header {
  margin-bottom: 2rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid var(--border-subtle);
}

.greeting-row {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 0.5rem;
}

.greeting-label {
  font-family: 'JetBrains Mono', monospace;
  font-size: var(--text-xs);
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--gold-primary);
  font-weight: 500;
}

.greeting-name {
  font-family: 'Syne', sans-serif;
  font-size: var(--text-3xl);
  font-weight: 700;
  color: var(--text-primary);
  letter-spacing: -0.03em;
  line-height: 1.1;
}

.greeting-name em {
  font-style: normal;
  background: var(--gold-gradient);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.dashboard-date {
  font-size: var(--text-sm);
  color: var(--text-muted);
  margin-bottom: 1.25rem;
  font-family: 'JetBrains Mono', monospace;
  letter-spacing: 0.04em;
}

/* XP Progress */
.xp-progress-wrap {
  max-width: 400px;
  margin-top: 0.5rem;
}

.xp-maxed-wrap {
  background: rgba(var(--metal-rgb), 0.05);
  border: 1px solid rgba(var(--metal-rgb), 0.2);
  border-radius: var(--radius-md);
  padding: 0.75rem 1rem;
  box-shadow: 0 0 20px rgba(var(--metal-rgb), 0.1);
}

.xp-progress-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.5rem;
}

.xp-level-badge {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.xp-level-num {
  font-family: 'JetBrains Mono', monospace;
  font-size: var(--text-xs);
  font-weight: 700;
  color: var(--gold-primary);
  background: rgba(var(--metal-rgb), 0.1);
  border: 1px solid rgba(var(--metal-rgb), 0.2);
  padding: 0.2rem 0.5rem;
  border-radius: var(--radius-pill);
}

.xp-level-name {
  font-size: var(--text-sm);
  font-weight: 600;
  color: var(--text-secondary);
  letter-spacing: 0.04em;
}

.xp-progress-meta {
  font-size: var(--text-xs);
  color: var(--text-muted);
  font-family: 'JetBrains Mono', monospace;
}

.xp-progress-meta strong {
  color: var(--text-secondary);
}

.xp-bar-track {
  height: 3px;
  background: rgba(255,255,255,0.06);
  border-radius: var(--radius-pill);
  overflow: hidden;
}

.xp-bar-fill {
  height: 100%;
  background: var(--gold-gradient);
  border-radius: var(--radius-pill);
  transition: width var(--dur-slowest) var(--ease-out-expo);
  box-shadow: 0 0 8px rgba(var(--metal-rgb), 0.4);
}

/* Streak badge */
.streak-badge-header {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  font-family: 'JetBrains Mono', monospace;
  font-size: var(--text-sm);
  font-weight: 700;
  color: var(--warning);
  background: rgba(251, 191, 36, 0.1);
  border: 1px solid rgba(251, 191, 36, 0.2);
  padding: 0.2rem 0.6rem;
  border-radius: var(--radius-pill);
}

/* Weekly activity */
.weekly-activity-container {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-top: 0.75rem;
}

.weekly-dots {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.activity-dot-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
}

.activity-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  transition: all var(--dur-normal);
}

.activity-dot.active {
  background: var(--gold-primary);
  box-shadow: 0 0 6px rgba(var(--metal-rgb), 0.4);
}

.activity-dot.inactive {
  background: rgba(255,255,255,0.1);
}

.activity-dot-wrapper.today .activity-dot.active {
  box-shadow: 0 0 10px rgba(var(--metal-rgb), 0.7);
}

.activity-dot-label {
  font-size: 9px;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.weekly-summary {
  font-size: var(--text-xs);
  color: var(--text-muted);
  font-family: 'JetBrains Mono', monospace;
}

/* ═══════════════════════════════════════════════════════════
   GLOBAL DESIGN CONSTITUTION — QUEST BOARD (MISSION CONTROL)
   ═══════════════════════════════════════════════════════════ */

.quest-mission-tabs {
  display: flex;
  gap: 0.5rem;
  margin: 0 0 1.5rem;
  border-bottom: 1px solid var(--border-subtle);
  padding-bottom: 0.75rem;
}

.quest-mission-tab {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.5rem 1rem;
  background: rgba(255,255,255,0.03);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-pill);
  color: var(--text-muted);
  font-size: 0.82rem;
  font-weight: 600;
  cursor: pointer;
  transition: all var(--dur-fast) var(--ease-out-expo);
  font-family: inherit;
}

.quest-mission-tab:hover { color: var(--text-primary); border-color: var(--border-glass); }
.quest-mission-tab.active { background: var(--gold-glow); border-color: var(--gold-border); color: var(--gold-bright); }
.qmt-icon { font-size: 0.9rem; }

.mission-section { margin-bottom: 1.5rem; }
.quest-draft-section { padding:0.8rem 1rem; border:1px solid var(--gold-border); border-radius:16px; background:var(--gold-glow); }
.quest-draft-section > summary { display:flex; align-items:center; justify-content:space-between; gap:1rem; cursor:pointer; list-style:none; }
.quest-draft-section > summary::-webkit-details-marker { display:none; }
.quest-draft-section > summary .mission-section-label { margin:0; }
.quest-draft-summary-hint { color:var(--gold-bright); font-size:0.72rem; font-weight:700; }
.quest-draft-section[open] .quest-draft-intro { margin-top:0.8rem; }
.quest-draft-intro { margin:-0.2rem 0 0.85rem; color:var(--text-secondary); font-size:0.8rem; line-height:1.5; }
.quest-draft-card { display:flex; justify-content:space-between; align-items:flex-end; gap:1rem; padding:1rem; background:var(--surface); border:1px solid var(--border); border-radius:14px; }
.quest-draft-card + .quest-draft-card { margin-top:0.7rem; }
.quest-draft-card h3 { color:var(--text-primary); margin:0.25rem 0; }
.quest-draft-card p { color:var(--text-secondary); font-size:0.82rem; line-height:1.5; margin:0; }
.quest-draft-meta,.quest-draft-actions { display:flex; flex-wrap:wrap; gap:0.45rem; margin-top:0.65rem; }
.quest-draft-meta span { color:var(--text-muted); border:1px solid var(--border); border-radius:999px; padding:0.25rem 0.5rem; font-size:0.68rem; }
.quest-draft-actions { flex-shrink:0; }
@media (max-width: 720px) {
  .quest-draft-card { align-items:stretch; flex-direction:column; }
  .quest-draft-actions .btn { flex:1; }
}

.mission-section-label {
  font-size: 0.65rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--text-muted);
  font-weight: 700;
  margin-bottom: 0.75rem;
  display: flex;
  align-items: center;
  gap: 0.4rem;
}

.mission-all-done {
  text-align: center;
  padding: 3rem 1rem;
  background: linear-gradient(135deg, rgba(var(--metal-rgb), 0.06), rgba(var(--metal-rgb), 0.02));
  border: 1px solid var(--gold-border);
  border-radius: var(--radius-xl);
  margin-bottom: 1.5rem;
}

.mission-all-done-icon { font-size: 2.5rem; margin-bottom: 0.5rem; }
.mission-all-done-title { font-family: 'Syne', sans-serif; font-size: 1.3rem; font-weight: 700; color: var(--text-primary); }
.mission-all-done-sub { font-size: 0.85rem; color: var(--text-muted); margin-top: 0.25rem; }

.mission-empty-state {
  text-align: center;
  padding: 3rem 1rem;
  color: var(--text-muted);
}

.mission-empty-icon { font-size: 2.5rem; margin-bottom: 0.75rem; }

/* ═══════════════════════════════════════════════════════════
   QUEST CARDS
   ═══════════════════════════════════════════════════════════ */

.quest-card {
  padding: 1.25rem 1.5rem;
  margin-bottom: 0.75rem;
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  cursor: pointer;
  transition: all var(--dur-normal) var(--ease-out-expo);
  border-left: 3px solid transparent;
}

.quest-card:hover {
  border-left-color: var(--gold-primary);
}

.quest-card-domain-health   { --quest-color: #4ade80; }
.quest-card-domain-fin      { --quest-color: #60a5fa; }
.quest-card-domain-prod    { --quest-color: var(--gold-primary); }
.quest-card-domain-social  { --quest-color: #f472b6; }
.quest-card-domain-mind    { --quest-color: #a78bfa; }
.quest-card-domain-crea    { --quest-color: #fb923c; }
.quest-card-domain-env     { --quest-color: #34d399; }
.quest-card-domain-finan   { --quest-color: #fbbf24; }
.quest-card-domain-lead     { --quest-color: #818cf8; }
.quest-card-domain-default  { --quest-color: #6b6762; }
.quest-card-domain-fitness   { --quest-color: #ff6b6b; }
.quest-card-domain-learning  { --quest-color: #6bcbff; }
.quest-card-domain-spiritual { --quest-color: #dfe6e9; }
.quest-card-domain-founder   { --quest-color: #fdcb6e; }
.quest-card-domain-energy    { --quest-color: #74b9ff; }
.quest-card-domain-general   { --quest-color: #636e72; }

.quest-card-v2 {
  display: flex;
  align-items: flex-start;
  gap: 0.85rem;
  margin-bottom: 0.75rem;
  padding: 1rem;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--card);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.05);
}

.quest-card-v2.completed { opacity: 0.66; }
.quest-card-v2-icon { font-size: 1.25rem; line-height: 1.4; }
.quest-card-v2-body { flex: 1; min-width: 0; }
.quest-card-v2-title { color: var(--text); font-weight: 700; line-height: 1.35; }
.quest-card-v2-desc { margin-top: 0.3rem; color: var(--text-secondary); font-size: 0.84rem; line-height: 1.5; }
.quest-card-v2-tags { display: flex; flex-wrap: wrap; align-items: center; gap: 0.38rem; margin-top: 0.65rem; }
.quest-tag { display: inline-flex; align-items: center; border-radius: 999px; padding: 0.2rem 0.5rem; font-size: 0.68rem; }
.quest-card-v2-check { flex:0 0 2rem; width:2rem; height:2rem; display:grid; place-items:center; border:1px solid var(--border); border-radius:8px; background:var(--surface); color:transparent; cursor:pointer; font:700 1rem/1 inherit; transition:all var(--dur-fast); }
.quest-card-v2-check:hover,.quest-card-v2-check:focus-visible { border-color:var(--accent); color:var(--accent); box-shadow:0 0 0 3px var(--gold-glow); }
.quest-card-v2-check.is-complete { border-color:var(--accent); background:var(--accent); color:#111; cursor:default; }

/* Compact weekly planning and visual food catalogs */
.weekly-mode-strip,.weekly-signal-strip { display:flex; gap:0.65rem; overflow-x:auto; padding:0.15rem 0 0.8rem; scroll-snap-type:x proximity; }
.weekly-mode-strip > *, .weekly-signal-strip > * { flex:0 0 min(220px,72vw); scroll-snap-align:start; }
.weekly-input-panel > summary { display:flex; align-items:center; justify-content:space-between; gap:1rem; cursor:pointer; list-style:none; }
.weekly-input-panel > summary::-webkit-details-marker,.weekly-draft-item > summary::-webkit-details-marker { display:none; }
.weekly-input-panel > summary h3,.weekly-input-panel > summary p { margin:0; }
.weekly-input-panel > summary > span,.weekly-draft-item > summary > span { color:var(--gold-bright); font-size:0.72rem; font-weight:700; }
.weekly-input-panel[open] > summary { margin-bottom:1rem; }
.weekly-map-strip { display:grid; grid-auto-flow:column; grid-auto-columns:minmax(190px,1fr); gap:0.75rem; overflow-x:auto; padding-bottom:0.55rem; scroll-snap-type:x mandatory; }
.weekly-map-day { scroll-snap-align:start; min-height:170px; }
.weekly-map-day.is-today { border-color:var(--gold-border); box-shadow:inset 0 3px 0 var(--accent); }
.weekly-drafts-list { display:grid; gap:0.65rem; }
.weekly-draft-item { padding:0.8rem 1rem; }
.weekly-draft-item > summary { display:flex; align-items:center; justify-content:space-between; gap:1rem; cursor:pointer; list-style:none; }
.weekly-draft-item[open] > summary { padding-bottom:0.65rem; border-bottom:1px solid var(--border); }
.nutrition-tab-bar { display:flex; gap:0.45rem; overflow-x:auto; margin:0 0 1rem; padding:0.38rem; border:1px solid var(--border); border-radius:16px; background:color-mix(in srgb,var(--card) 90%,transparent); scrollbar-width:none; }
.nutrition-tab-bar::-webkit-scrollbar { display:none; }
.nutrition-facts-search{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.65rem}.nutrition-media-contract{font-size:.76rem;color:var(--text-secondary);border-left:2px solid var(--accent-gold);padding-left:.7rem}.nutrition-facts-workspace{display:grid;grid-template-columns:minmax(260px,.8fr) minmax(320px,1.2fr);gap:1rem;align-items:start}.nutrition-food-results{display:grid;gap:.5rem;max-height:520px;overflow:auto;padding-right:.2rem}.nutrition-food-result{display:grid;grid-template-columns:58px minmax(0,1fr) auto;gap:.7rem;align-items:center;text-align:left;border:1px solid var(--border);border-radius:14px;background:var(--card);color:var(--text-primary);padding:.55rem;cursor:pointer}.nutrition-food-result:hover,.nutrition-food-result.active{border-color:var(--accent-gold);background:color-mix(in srgb,var(--accent-gold) 7%,var(--card))}.nutrition-food-result>span:nth-child(2){display:grid;gap:.15rem;min-width:0}.nutrition-food-result strong,.nutrition-food-result small,.nutrition-food-result em{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nutrition-food-result small,.nutrition-food-result em,.nutrition-food-result>b{font-size:.7rem;color:var(--text-secondary);font-style:normal}.nutrition-food-thumb{width:58px;height:58px;border-radius:12px;overflow:hidden;display:grid;place-items:center;background:var(--surface-muted);border:1px solid var(--border)}.nutrition-food-thumb img{width:100%;height:100%;object-fit:contain}.nutrition-food-thumb i{font-size:.62rem;color:var(--text-secondary);text-align:center}.nutrition-impact-card{border:1px solid var(--border);border-radius:18px;background:linear-gradient(145deg,color-mix(in srgb,var(--card) 94%,var(--accent-gold)),var(--card));padding:1rem;display:grid;gap:1rem}.nutrition-impact-card>header{display:grid;grid-template-columns:84px 1fr;gap:.85rem;align-items:center}.nutrition-impact-card>header img,.nutrition-impact-card>header>span{width:84px;height:84px;border-radius:16px;object-fit:contain;background:var(--surface-muted);display:grid;place-items:center;font-size:.65rem;text-align:center;padding:.3rem}.nutrition-impact-card h3{margin:.1rem 0}.nutrition-impact-card p{margin:0;color:var(--text-secondary);font-size:.78rem}.nutrition-portion-control{display:flex;gap:.5rem;align-items:end;flex-wrap:wrap}.nutrition-portion-control label{display:grid;gap:.25rem;font-size:.72rem;color:var(--text-secondary)}.nutrition-portion-control input,.nutrition-portion-control select{min-height:38px;border:1px solid var(--border);border-radius:10px;background:var(--surface);color:var(--text-primary);padding:.45rem .6rem}.nutrition-fact-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(92px,1fr));gap:.5rem}.nutrition-fact-grid span{border:1px solid var(--border);border-radius:12px;padding:.6rem;display:grid;font-size:.67rem;color:var(--text-secondary)}.nutrition-fact-grid strong{font-size:1rem;color:var(--text-primary)}.nutrition-impact-signals{display:grid;gap:.45rem}.nutrition-impact-signals>div{font-size:.78rem;padding:.6rem .7rem;border-radius:10px;background:var(--surface-muted)}.nutrition-impact-signals>.attention{border-left:3px solid var(--warning)}.nutrition-impact-disclaimer{color:var(--text-secondary);line-height:1.45}.nutrition-no-photo{font-size:.64rem;line-height:1.2;color:var(--text-secondary);padding:.5rem;text-align:center}
.nutrition-tab { display:flex; align-items:center; justify-content:center; gap:0.45rem; flex:1 0 auto; min-height:42px; padding:0.62rem 0.85rem; border:1px solid transparent; border-radius:12px; background:transparent; color:var(--text-secondary); font:inherit; font-size:0.78rem; font-weight:750; cursor:pointer; }
.nutrition-tab:hover { color:var(--text); background:var(--hover); }
.nutrition-tab.active { border-color:var(--gold-border); color:var(--text); background:linear-gradient(135deg,var(--gold-glow),color-mix(in srgb,var(--card) 88%,transparent)); box-shadow:0 8px 24px rgba(0,0,0,.12); }
.nutrition-tab span { min-width:1.45rem; padding:0.12rem 0.38rem; border-radius:999px; background:var(--accent); color:var(--bg); font-size:0.64rem; }
.nutrition-tab-panel[hidden] { display:none !important; }
.nutrition-tab-panel.active { animation:nutritionPanelIn .22s ease both; }
@keyframes nutritionPanelIn { from { opacity:0; transform:translateY(5px); } to { opacity:1; transform:none; } }
.nutrition-research-callout { display:grid; gap:0.75rem; margin-bottom:1rem; padding:1rem; border:1px solid var(--gold-border); border-radius:16px; background:linear-gradient(135deg,var(--gold-glow),color-mix(in srgb,var(--card) 92%,transparent)); }
.nutrition-research-callout > div:first-child { display:grid; gap:0.25rem; }
.nutrition-research-callout span,.nutrition-research-callout small { color:var(--text-secondary); font-size:0.73rem; line-height:1.45; }
.nutrition-research-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:0.6rem; }
.nutrition-library-heading { display:flex; align-items:end; justify-content:space-between; gap:1rem; margin:1rem 0 0.75rem; }
.nutrition-library-heading > div { display:grid; gap:0.2rem; }
.nutrition-library-heading span { color:var(--text-muted); font-size:0.7rem; }
.nutrition-library-heading .form-input { width:min(330px,100%); }
.nutrition-library-pagination { display:flex; align-items:center; justify-content:space-between; gap:0.75rem; padding-top:0.85rem; color:var(--text-secondary); font-size:0.82rem; }
.nutrition-plan-hero { display:flex; justify-content:space-between; gap:1rem; align-items:center; padding:0.8rem 1rem; border:1px solid var(--gold-border); border-radius:14px; background:var(--gold-glow); }
.nutrition-plan-hero > div { display:grid; gap:0.15rem; }
.nutrition-plan-hero span,.nutrition-plan-hero small { color:var(--text-muted); font-size:0.72rem; }
.nutrition-day-strip { display:grid; grid-auto-flow:column; grid-auto-columns:minmax(210px,1fr); gap:0.7rem; overflow-x:auto; padding:0.8rem 0 0.25rem; scroll-snap-type:x mandatory; }
.nutrition-day-card { scroll-snap-align:start; border:1px solid var(--border); border-radius:14px; padding:0.85rem; background:var(--card); }
.nutrition-day-card header { display:flex; justify-content:space-between; align-items:center; padding-bottom:0.6rem; border-bottom:1px solid var(--border); }
.nutrition-day-card header span { color:var(--accent); font-weight:800; text-transform:uppercase; }
.nutrition-meal-list { display:grid; gap:0.65rem; padding-top:0.65rem; }
.nutrition-meal-list div { display:grid; gap:0.15rem; }
.nutrition-meal-list i { color:var(--text-muted); font-size:0.65rem; text-transform:uppercase; font-style:normal; }
.nutrition-meal-list span { color:var(--text-secondary); font-size:0.8rem; line-height:1.4; }
.nutrition-recipe-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:0.7rem; }
.nutrition-recipe-card { display:grid; grid-template-rows:110px auto; overflow:hidden; padding:0; text-align:left; border:1px solid var(--border); border-radius:14px; background:var(--card); color:inherit; cursor:pointer; }
.nutrition-recipe-card:hover { border-color:var(--gold-border); transform:translateY(-1px); }
.nutrition-recipe-visual { display:grid; place-items:center; overflow:hidden; font-size:2.4rem; background:radial-gradient(circle at 20% 20%,rgba(249,115,22,.22),transparent 50%),linear-gradient(135deg,rgba(var(--metal-rgb), .16),rgba(255,255,255,.025)); }
.nutrition-recipe-visual img { width:100%; height:100%; object-fit:cover; }
.nutrition-recipe-copy { display:grid; gap:0.3rem; padding:0.75rem; }
.nutrition-recipe-copy small { color:var(--text-secondary); line-height:1.4; }
.nutrition-recipe-copy i { color:var(--accent); font-size:0.67rem; font-style:normal; }
.nutrition-recipe-copy em { color:var(--text-muted); font-size:0.62rem; font-style:normal; }
.nutrition-recipe-detail { margin:0 0 0.85rem; padding:1rem; border:1px solid var(--gold-border); border-radius:16px; background:color-mix(in srgb,var(--card) 95%,transparent); box-shadow:var(--shadow-sm); }
.nutrition-recipe-detail-head { display:flex; align-items:start; justify-content:space-between; gap:1rem; padding-bottom:0.75rem; border-bottom:1px solid var(--border); }
.nutrition-recipe-detail-head div { display:grid; gap:0.15rem; }
.nutrition-recipe-detail-head span { color:var(--accent); font-size:0.66rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.nutrition-recipe-detail-head h3 { margin:0; }
.nutrition-recipe-detail-grid { display:grid; grid-template-columns:minmax(220px,.8fr) minmax(0,1.2fr); gap:1rem; padding:0.9rem 0; }
.nutrition-recipe-detail-grid section { padding:0; border:0; background:none; }
.nutrition-recipe-detail-grid ul,.nutrition-recipe-detail-grid ol { display:grid; gap:0.42rem; margin:0.65rem 0 0; padding-left:1.2rem; color:var(--text-secondary); font-size:0.76rem; line-height:1.45; }
.nutrition-recipe-detail-actions { display:flex; align-items:center; gap:0.6rem; flex-wrap:wrap; }
.nutrition-recipe-detail-actions small { flex:1 1 280px; color:var(--text-muted); font-size:0.66rem; line-height:1.4; }
@media (max-width:700px) {
  .nutrition-tab { flex:0 0 auto; }
  .nutrition-research-row,.nutrition-recipe-detail-grid { grid-template-columns:1fr; }
  .nutrition-library-heading { align-items:stretch; flex-direction:column; }
  .nutrition-library-heading .form-input { width:100%; }
  .nutrition-library-pagination { flex-wrap:wrap; justify-content:center; }
  .nutrition-library-pagination span { order:-1; width:100%; text-align:center; }
}
.career-job-facts { display:flex; gap:0.35rem; flex-wrap:wrap; margin-top:0.55rem; }
.career-job-facts span { border:1px solid var(--border); border-radius:999px; padding:0.2rem 0.45rem; color:var(--text-secondary); font-size:0.65rem; }
.career-job-intelligence { margin-top:0.6rem; max-width:720px; }
.career-job-intelligence summary { color:var(--accent); font-size:0.7rem; cursor:pointer; }
.career-job-intelligence summary span { color:var(--text-muted); margin-left:0.35rem; }
.career-job-intelligence p { display:grid; gap:0.15rem; margin:0.55rem 0; color:var(--text-secondary); font-size:0.76rem; line-height:1.45; }
.career-job-intelligence p strong { color:var(--text); }
.career-job-intelligence small { color:var(--text-muted); line-height:1.4; }

.astro-chart-guide {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  border-left:3px solid var(--gold, var(--gold-primary));
}
.astro-chart-guide > span {
  flex:0 0 auto;
  border:1px solid rgba(var(--metal-rgb), 0.28);
  border-radius:999px;
  padding:0.42rem 0.7rem;
  color:var(--gold, var(--gold-primary));
  background:rgba(var(--metal-rgb), 0.08);
  font-size:0.72rem;
  font-weight:800;
}
.astro-placement-grid {
  grid-template-columns:repeat(auto-fit,minmax(235px,1fr));
  align-items:start;
}
.astro-placement-card {
  display:block;
  padding:0;
  overflow:hidden;
  text-decoration:none;
  background:linear-gradient(145deg,rgba(var(--metal-rgb), 0.08),rgba(255,255,255,0.025));
}
.astro-placement-card[open] {
  grid-column:span 2;
  border-color:rgba(var(--metal-rgb), 0.42);
  box-shadow:0 14px 36px rgba(0,0,0,0.18);
}
.astro-placement-card summary {
  position:relative;
  display:grid;
  gap:0.22rem;
  min-height:112px;
  padding:0.9rem 2rem 0.9rem 0.9rem;
  cursor:pointer;
  list-style:none;
}
.astro-placement-card summary::-webkit-details-marker { display:none; }
.astro-placement-card summary::after {
  content:'+';
  position:absolute;
  right:0.85rem;
  top:0.8rem;
  color:var(--gold, var(--gold-primary));
  font-size:1.2rem;
}
.astro-placement-card[open] summary::after { content:'−'; }
.astro-placement-card summary span {
  color:var(--gold, var(--gold-primary));
  font-size:0.66rem;
  font-weight:800;
  letter-spacing:0.11em;
  text-transform:uppercase;
}
.astro-placement-card summary strong {
  color:var(--text-primary);
  font-size:1.15rem;
}
.astro-placement-card summary small {
  color:var(--text-secondary);
  font-size:0.74rem;
  line-height:1.45;
}
.astro-placement-translation {
  display:grid;
  gap:0.65rem;
  padding:0.9rem;
  border-top:1px solid var(--border);
  background:rgba(0,0,0,0.12);
}
.astro-placement-translation p {
  display:grid;
  gap:0.2rem;
  margin:0;
  color:var(--text-secondary);
  font-size:0.78rem;
  line-height:1.5;
}
.astro-placement-translation p strong {
  color:var(--text-primary);
  font-size:0.7rem;
  letter-spacing:0.04em;
  text-transform:uppercase;
}
.astro-placement-translation .btn { justify-self:start; }

.quest-identity-link {
  display: block;
  width: fit-content;
  max-width: 100%;
  margin-top: 0.55rem;
  padding-left: 0.55rem;
  border-left: 2px solid var(--accent);
  color: var(--text-secondary);
  font-size: 0.74rem;
  line-height: 1.35;
}

.quest-adapt-action {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--text-secondary);
  padding: 0.2rem 0.35rem;
  font: inherit;
  font-size: 0.68rem;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.quest-adapt-action:hover { color: var(--text); }

.identity-reinforce-callout {
  margin: -0.25rem 0 0.9rem 2.7rem;
  padding: 0.8rem 0.9rem;
  border: 1px solid var(--border);
  border-left: 2px solid var(--accent);
  border-radius: 10px;
  background: var(--card);
}

.identity-reinforce-callout .ir-label { color: var(--accent); font-size: 0.68rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; }
.identity-reinforce-callout .ir-text { margin-top: 0.28rem; color: var(--text); font-size: 0.84rem; line-height: 1.45; }

.quest-domain-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--quest-color, var(--gold-primary));
  flex-shrink: 0;
  margin-top: 0.4rem;
  box-shadow: 0 0 6px var(--quest-color, var(--gold-primary));
}

.quest-body { flex: 1; min-width: 0; }

.quest-title {
  font-size: var(--text-base);
  font-weight: 600;
  color: var(--text-primary);
  margin-bottom: 0.35rem;
  line-height: 1.4;
}

.quest-meta {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-size: var(--text-xs);
  color: var(--text-muted);
  flex-wrap: wrap;
}

.quest-xp-badge {
  font-family: 'JetBrains Mono', monospace;
  font-size: var(--text-xs);
  font-weight: 700;
  color: var(--gold-primary);
  background: rgba(var(--metal-rgb), 0.1);
  border: 1px solid rgba(var(--metal-rgb), 0.2);
  padding: 0.15rem 0.5rem;
  border-radius: var(--radius-pill);
}

.quest-difficulty-low    { color: var(--success); }
.quest-difficulty-medium { color: var(--warning); }
.quest-difficulty-high   { color: var(--danger); }

.quest-domain-label {
  font-size: var(--text-xs);
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

/* Quest action buttons */
.quest-actions {
  display: flex;
  gap: 0.5rem;
  margin-top: 0.75rem;
}

/* ═══════════════════════════════════════════════════════════
   IDENTITY, JOURNAL, EVOLUTION — MODULE PAGES
   ═══════════════════════════════════════════════════════════ */

.identity-vision-card {
  padding: 1.5rem;
  margin-bottom: 1.25rem;
}

.iv-accent {
  font-size: 18px;
  color: var(--gold-primary);
  margin-bottom: 0.75rem;
  opacity: 0.6;
}

.iv-text {
  font-family: 'Syne', sans-serif;
  font-size: var(--text-lg);
  font-weight: 600;
  color: var(--text-primary);
  line-height: 1.4;
  letter-spacing: -0.02em;
  font-style: italic;
  border-left: 3px solid var(--gold-primary);
  padding-left: 1.25rem;
}

.iv-gap {
  margin-top: 1rem;
  font-size: var(--text-sm);
  color: var(--text-muted);
  padding-left: 1.25rem;
}

/* Journal entries */
.journal-entry {
  padding: 1.5rem;
  margin-bottom: 0.75rem;
  border-left: 3px solid var(--border-glass);
  transition: all var(--dur-normal) var(--ease-out-expo);
}

.journal-entry:hover {
  border-left-color: var(--ai-primary);
}

.journal-entry-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.75rem;
}

.journal-entry-date {
  font-family: 'JetBrains Mono', monospace;
  font-size: var(--text-xs);
  color: var(--text-muted);
}

.journal-mood-tag {
  font-size: var(--text-xs);
  color: var(--text-muted);
  background: rgba(255,255,255,0.04);
  border: 1px solid var(--border-subtle);
  padding: 0.15rem 0.5rem;
  border-radius: var(--radius-pill);
}

.journal-entry-text {
  font-size: var(--text-base);
  color: var(--text-secondary);
  line-height: 1.6;
}

.journal-analysis-bar {
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid var(--border-subtle);
}

.analysis-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: var(--text-sm);
  color: var(--text-muted);
  margin-bottom: 0.35rem;
}

.analysis-label {
  color: var(--text-muted);
  width: 80px;
  flex-shrink: 0;
}

.analysis-bar-track {
  flex: 1;
  height: 3px;
  background: rgba(255,255,255,0.06);
  border-radius: var(--radius-pill);
  overflow: hidden;
  max-width: 200px;
}

.analysis-bar-fill {
  height: 100%;
  border-radius: var(--radius-pill);
  transition: width var(--dur-slowest) var(--ease-out-expo);
}

/* Evolution arc */
.evolution-arc {
  padding: 2rem;
  text-align: center;
}

.arc-title {
  font-family: 'Syne', sans-serif;
  font-size: var(--text-xl);
  font-weight: 700;
  color: var(--text-primary);
  margin-bottom: 0.5rem;
  letter-spacing: -0.02em;
}

.arc-subtitle {
  font-size: var(--text-sm);
  color: var(--text-muted);
  margin-bottom: 2rem;
}

/* ═══════════════════════════════════════════════════════════
   AI CHAT — LUXURY SHELL
   ═══════════════════════════════════════════════════════════ */

.chat-container {
  height: calc(100vh - var(--topbar-height) - 4rem);
  display: flex;
  flex-direction: column;
}

.chat-messages {
  flex: 1;
  overflow-y: auto;
  padding: 1.5rem 0;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.chat-context-bar {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 0.75rem;
  background: rgba(255,255,255,0.03);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  margin-bottom: 1rem;
  font-size: var(--text-xs);
  color: var(--text-muted);
  flex-wrap: wrap;
}

.chat-context-tag {
  background: rgba(123,104,238,0.1);
  border: 1px solid rgba(123,104,238,0.2);
  color: var(--ai-bright);
  padding: 0.15rem 0.5rem;
  border-radius: var(--radius-pill);
  font-family: 'JetBrains Mono', monospace;
}

.msg-bubble {
  max-width: 80%;
  padding: 0.875rem 1.25rem;
  border-radius: var(--radius-lg);
  font-size: var(--text-base);
  line-height: 1.6;
  animation: fadeUp var(--dur-slow) var(--ease-out-expo);
}

.msg-user {
  align-self: flex-end;
  background: rgba(var(--metal-rgb), 0.1);
  border: 1px solid rgba(var(--metal-rgb), 0.15);
  color: var(--text-primary);
  border-radius: var(--radius-lg) var(--radius-lg) var(--radius-sm) var(--radius-lg);
}

.msg-ai {
  align-self: flex-start;
  background: rgba(123,104,238,0.07);
  border: 1px solid rgba(123,104,238,0.12);
  color: var(--text-primary);
  border-radius: var(--radius-lg) var(--radius-lg) var(--radius-lg) var(--radius-sm);
}

.msg-timestamp {
  font-size: var(--text-xs);
  color: var(--text-muted);
  font-family: 'JetBrains Mono', monospace;
  margin-top: 0.25rem;
  opacity: 0.6;
}

.chat-input-area {
  padding-top: 1rem;
  border-top: 1px solid var(--border-subtle);
}

.chat-input-row {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  background: rgba(255,255,255,0.03);
  border: 1px solid var(--border-glass);
  border-radius: var(--radius-lg);
  padding: 0.75rem 1rem;
  transition: all var(--dur-fast) var(--ease-out-expo);
}

.chat-input-row:focus-within {
  border-color: rgba(123,104,238,0.3);
  box-shadow: 0 0 0 3px rgba(123,104,238,0.08);
}

.chat-textarea {
  flex: 1;
  background: none;
  border: none;
  outline: none;
  color: var(--text-primary);
  font-family: 'DM Sans', sans-serif;
  font-size: var(--text-base);
  line-height: 1.5;
  resize: none;
  max-height: 120px;
}

.chat-textarea::placeholder {
  color: var(--text-muted);
}

/* ═══════════════════════════════════════════════════════════
   AI CHAT — Full Layout + Messages + Streaming
   ═══════════════════════════════════════════════════════════ */

.chat-page {
  padding: 0 !important;
  padding-bottom: 0 !important;
  height: calc(100vh - var(--topbar-height, 60px));
  height: calc(100dvh - var(--topbar-height, 60px));
  max-height: calc(100vh - var(--topbar-height, 60px));
  max-height: calc(100dvh - var(--topbar-height, 60px));
  min-height: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.app-content.chat-page {
  padding: 0 !important;
  padding-bottom: 0 !important;
  height: calc(100vh - var(--topbar-height, 60px));
  height: calc(100dvh - var(--topbar-height, 60px));
  max-height: calc(100vh - var(--topbar-height, 60px));
  max-height: calc(100dvh - var(--topbar-height, 60px));
  min-height: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.chat-layout {
  display: flex;
  flex: 1 1 auto;
  height: 100%;
  max-height: 100%;
  min-height: 0;
  overflow: hidden;
}

.chat-sidebar {
  width: 260px;
  min-width: 260px;
  border-right: 1px solid var(--border-subtle, rgba(255,255,255,0.06));
  background: rgba(10,10,15,0.6);
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow: hidden;
}

.chat-sidebar-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.75rem 1rem;
  border-bottom: 1px solid var(--border-subtle, rgba(255,255,255,0.06));
  flex: 0 0 auto;
  min-height: 0;
}

.chat-sidebar-title {
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--text-muted, rgba(255,255,255,0.45));
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.chat-new-btn {
  font-size: 0.75rem !important;
  padding: 0.3rem 0.7rem !important;
}

.chat-convo-count {
  font-size: 0.68rem;
  font-weight: 400;
  color: var(--text-muted, rgba(255,255,255,0.3));
}

.chat-sidebar-search {
  padding: 0.5rem 0.75rem;
  border-bottom: 1px solid var(--border-subtle, rgba(255,255,255,0.06));
  flex: 0 0 auto;
}

.chat-search-input {
  width: 100%;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px;
  padding: 0.45rem 0.7rem;
  color: var(--text-primary, #fff);
  font-size: 0.78rem;
  outline: none;
  font-family: inherit;
}

.chat-search-input::placeholder { color: var(--text-muted, rgba(255,255,255,0.35)); }
.chat-search-input:focus { border-color: rgba(123,104,238,0.4); }

.chat-convo-list {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  padding: 0.25rem 0;
}

.chat-sidebar-archives {
  flex: 0 0 auto;
  max-height: 42%;
  min-height: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.chat-sidebar-archives .chat-convo-list {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
}

.chat-convo-empty {
  padding: 1.5rem 1rem;
  text-align: center;
  color: var(--text-muted, rgba(255,255,255,0.35));
  font-size: 0.82rem;
}

.chat-convo-item {
  padding: 0.6rem 1rem;
  cursor: pointer;
  border-left: 3px solid transparent;
  transition: all 0.15s;
}

.chat-convo-item:hover {
  background: rgba(255,255,255,0.03);
}

.chat-convo-item.active {
  background: rgba(123,104,238,0.08);
  border-left-color: var(--ai-bright, #7b68ee);
}

.chat-convo-item-inner {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.chat-convo-title {
  font-size: 0.82rem;
  font-weight: 500;
  color: var(--text-primary, #fff);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.chat-convo-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.25rem;
}

.chat-convo-time {
  font-size: 0.68rem;
  color: var(--text-muted, rgba(255,255,255,0.35));
}

.chat-convo-delete {
  background: none;
  border: none;
  color: var(--text-muted, rgba(255,255,255,0.25));
  cursor: pointer;
  font-size: 0.7rem;
  padding: 0.15rem 0.3rem;
  border-radius: 4px;
  opacity: 0;
  transition: all 0.15s;
}

.chat-convo-rename {
  background: none;
  border: none;
  color: var(--text-muted, rgba(255,255,255,0.25));
  cursor: pointer;
  font-size: 0.65rem;
  padding: 0.15rem 0.3rem;
  border-radius: 4px;
  opacity: 0;
  transition: all 0.15s;
}
.chat-convo-item:hover .chat-convo-rename,
.chat-convo-item:hover .chat-convo-delete { opacity: 1; }
.chat-convo-rename:hover { color: var(--accent, #7b68ee); background: rgba(123,104,238,0.1); }
.chat-convo-delete:hover { color: var(--danger, #f87171); background: rgba(248,113,113,0.1); }

/* ── Chat Main Area ─────────────────────────────── */

.chat-main {
  flex: 1 1 0;
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  height: 100%;
  max-height: 100%;
  overflow: hidden;
}

.chat-main > .ai-mode-control {
  flex: 0 0 auto;
  min-height: 0;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
  position: relative;
  z-index: 3;
}

#chat-mode-content {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.chat-messages {
  flex: 1 1 0;
  min-height: 0;
  max-height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  padding: 1.5rem 1rem 2rem;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  scroll-behavior: smooth;
}

.chat-messages-empty {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--text-muted, rgba(255,255,255,0.35));
  font-size: 0.85rem;
}

/* ── Messages ───────────────────────────────────── */

.chat-msg {
  display: flex;
  gap: 0.75rem;
  max-width: 800px;
  width: 100%;
  margin: 0 auto;
  padding: 0.5rem 0;
  animation: chatFadeIn 0.25s ease-out;
}

@keyframes chatFadeIn {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}

.chat-msg-user {
  flex-direction: row-reverse;
}

.chat-msg-avatar {
  width: 32px;
  height: 32px;
  min-width: 32px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.9rem;
  background: rgba(123,104,238,0.12);
  color: var(--ai-bright, #7b68ee);
  flex-shrink: 0;
  margin-top: 2px;
}

.chat-msg-content {
  flex: 1;
  min-width: 0;
  max-width: 85%;
}

.chat-msg-bubble {
  padding: 0.7rem 1rem;
  border-radius: 16px;
  font-size: 0.88rem;
  line-height: 1.65;
  color: var(--text-primary, #fff);
  word-break: break-word;
}

.chat-msg-user .chat-msg-bubble {
  background: rgba(var(--metal-rgb), 0.1);
  border: 1px solid rgba(var(--metal-rgb), 0.12);
  border-radius: 16px 16px 4px 16px;
}

.chat-msg-ai .chat-msg-bubble {
  background: rgba(123,104,238,0.06);
  border: 1px solid rgba(123,104,238,0.08);
  border-radius: 16px 16px 16px 4px;
}

.chat-result-cards { display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.65rem;margin-top:.7rem;max-width:820px; }
.chat-result-card { display:grid;grid-template-columns:86px minmax(0,1fr);overflow:hidden;border:1px solid color-mix(in srgb,var(--primary) 22%,var(--border));border-radius:14px;background:var(--card-surface);box-shadow:0 10px 30px rgba(0,0,0,.12); }
.chat-result-card:not(:has(.chat-result-image)) { grid-template-columns:1fr; }
.chat-result-image { width:86px;height:100%;min-height:116px;object-fit:cover;background:var(--bg-secondary); }
.chat-result-body { min-width:0;padding:.75rem; }
.chat-result-meta { display:block;color:var(--primary);font-size:.65rem;line-height:1.2;text-transform:uppercase;letter-spacing:.09em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.chat-result-body strong { display:block;margin-top:.28rem;color:var(--text-primary);font-size:.88rem;line-height:1.3; }
.chat-result-body p { margin:.35rem 0 0;color:var(--text-secondary);font-size:.75rem;line-height:1.42;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden; }
.chat-result-actions { display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.65rem; }
.chat-result-action { border:0;border-radius:999px;background:var(--primary);color:#0b0910;padding:.42rem .68rem;font:inherit;font-size:.68rem;font-weight:750;text-decoration:none;cursor:pointer; }
.chat-result-action.secondary { background:transparent;color:var(--text-primary);box-shadow:inset 0 0 0 1px var(--border); }

.ap-surface-search { margin:0 0 1rem;padding:1rem;border:1px solid color-mix(in srgb,var(--primary) 24%,var(--border));border-radius:16px;background:linear-gradient(135deg,color-mix(in srgb,var(--primary) 8%,var(--card-surface)),var(--card-surface)); }
.ap-surface-search > div:first-child { display:flex;flex-direction:column;gap:.2rem;margin-bottom:.7rem; }
.ap-surface-search > div:first-child span { color:var(--primary);font-size:.67rem;text-transform:uppercase;letter-spacing:.1em; }
.ap-surface-search > div:first-child strong { color:var(--text-primary);font-size:.9rem; }
.ap-surface-search-row { display:flex;gap:.55rem;align-items:center; }
.ap-surface-search-row .form-input { flex:1;min-width:0; }
.ap-surface-result-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.65rem;margin-top:.8rem;max-height:430px;overflow:auto; }
.ap-surface-result { display:flex;flex-direction:column;padding:.8rem;border:1px solid var(--border);border-radius:12px;background:var(--bg-secondary); }
.ap-surface-result > span { color:var(--primary);font-size:.62rem;text-transform:uppercase;letter-spacing:.08em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.ap-surface-result > strong { margin-top:.3rem;color:var(--text-primary);font-size:.84rem;line-height:1.35; }
.ap-surface-result > p { flex:1;margin:.4rem 0;color:var(--text-secondary);font-size:.73rem;line-height:1.45;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden; }
.ap-surface-result > div { display:flex;gap:.4rem;flex-wrap:wrap;margin-top:.5rem; }

@media (max-width: 640px) {
  .chat-result-cards { grid-template-columns:1fr; }
  .chat-result-card { grid-template-columns:70px minmax(0,1fr); }
  .chat-result-image { width:70px;min-height:104px; }
  .ap-surface-search-row { align-items:stretch;flex-direction:column; }
  .ap-surface-result-grid { grid-template-columns:1fr; }
}

.chat-msg-time {
  font-size: 0.65rem;
  color: var(--text-muted, rgba(255,255,255,0.3));
  margin-top: 0.2rem;
  padding: 0 0.25rem;
}

.chat-msg-user .chat-msg-time { text-align: right; }

.chat-msg-error-bubble {
  background: rgba(248,113,113,0.1) !important;
  border-color: rgba(248,113,113,0.2) !important;
  color: var(--danger, #f87171) !important;
}

/* ── Message Actions ────────────────────────────── */

.chat-msg-actions {
  display: flex;
  gap: 0.25rem;
  margin-top: 0.3rem;
  opacity: 0;
  transition: opacity 0.15s;
}

.chat-msg:hover .chat-msg-actions { opacity: 1; }

.chat-msg-action-btn {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.08);
  color: var(--text-muted, rgba(255,255,255,0.4));
  border-radius: 6px;
  padding: 0.2rem 0.45rem;
  font-size: 0.68rem;
  cursor: pointer;
  transition: all 0.15s;
  display: flex;
  align-items: center;
  gap: 0.25rem;
}

.chat-msg-action-btn:hover {
  background: rgba(123,104,238,0.1);
  border-color: rgba(123,104,238,0.25);
  color: var(--ai-bright, #7b68ee);
}

.chat-msg-action-btn.copied {
  color: var(--success, #4ade80);
  border-color: rgba(74,222,128,0.3);
}

/* ── Typing Indicator ───────────────────────────── */

.chat-typing {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 0.2rem 0;
}

.chat-typing span {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--ai-bright, #7b68ee);
  opacity: 0.4;
  animation: chatTyping 1.4s infinite;
}

.chat-typing span:nth-child(2) { animation-delay: 0.2s; }
.chat-typing span:nth-child(3) { animation-delay: 0.4s; }

@keyframes chatTyping {
  0%, 60%, 100% { opacity: 0.3; transform: scale(0.8); }
  30% { opacity: 1; transform: scale(1); }
}

/* ── Typing label ──────────────────────────────── */
.chat-typing-label {
  font-size: 0.72rem;
  color: var(--text-muted, rgba(255,255,255,0.35));
  margin-top: 0.3rem;
  letter-spacing: 0.02em;
  animation: chatFadeIn 0.3s ease-out;
}

/* ── Streaming cursor ───────────────────────────── */

.chat-streaming-cursor::after {
  content: '';
  display: inline-block;
  width: 2px;
  height: 1em;
  background: var(--ai-bright, #7b68ee);
  margin-left: 2px;
  animation: chatBlink 0.8s step-end infinite;
  vertical-align: text-bottom;
}

@keyframes chatBlink {
  0%, 50% { opacity: 1; }
  51%, 100% { opacity: 0; }
}

/* ── Chat Input ─────────────────────────────────── */

.chat-input-wrap {
  padding: 0.75rem 1rem 1rem;
  border-top: 1px solid var(--border-subtle, rgba(255,255,255,0.06));
  background: rgba(10,10,15,0.96);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 0.5rem;
  width: 100%;
  margin: 0;
  flex: 0 0 auto;
  position: sticky;
  bottom: 0;
  z-index: 1250;
}

.chat-main.chat-conversation-open {
  height: 100%;
  min-height: 0;
  overflow: hidden;
}

.chat-main.chat-conversation-open #chat-mode-content {
  flex: 1 1 0;
  min-height: 0;
  height: auto;
  max-height: none;
  overflow: hidden;
}

.chat-main.chat-conversation-open .chat-messages {
  flex: 1 1 0;
  min-height: 0;
  max-height: none;
  overflow-y: auto;
  overflow-x: hidden;
  overflow-anchor: none;
  overscroll-behavior: contain;
  padding-bottom: 1.5rem;
}

.chat-main.chat-conversation-open #chat-file-preview {
  flex: 0 0 auto;
  max-height: 120px;
  overflow-y: auto;
}

.chat-main.chat-conversation-open .chat-input-wrap {
  position: sticky;
  bottom: 0;
  flex: 0 0 auto;
  z-index: 1200;
  box-shadow: 0 -16px 36px rgba(0,0,0,0.24);
}

.chat-input-wrap > .chat-input {
  max-width: 800px;
}

.chat-input {
  flex: 1;
  min-width: 0;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 12px;
  padding: 0.65rem 0.9rem;
  color: var(--text-primary, #fff);
  font-size: 0.88rem;
  font-family: 'DM Sans', sans-serif;
  line-height: 1.5;
  resize: none;
  outline: none;
  max-height: 160px;
  transition: border-color 0.2s;
}

.chat-input:focus {
  border-color: rgba(123,104,238,0.4);
  box-shadow: 0 0 0 2px rgba(123,104,238,0.08);
}

.chat-input::placeholder {
  color: var(--text-muted, rgba(255,255,255,0.35));
}

/* PWA install banner: below active chat input/AP, above page content. */
.pwa-banner {
  position: fixed;
  left: 50%;
  bottom: calc(1rem + env(safe-area-inset-bottom, 0px));
  width: min(720px, calc(100vw - 2rem));
  transform: translate(-50%, calc(100% + 1.5rem));
  opacity: 0;
  z-index: 780;
  transition: transform 0.28s ease, opacity 0.28s ease;
  pointer-events: none;
}

body:has(.chat-page) .pwa-banner,
body:has(.chat-input-wrap) .pwa-banner,
body:has(.chat-composer) .pwa-banner,
body:has([role="dialog"]) .pwa-banner {
  display: none;
}

.pwa-banner-visible {
  transform: translate(-50%, 0);
  opacity: 1;
  pointer-events: auto;
}

.pwa-banner-inner {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  border: 1px solid rgba(var(--metal-rgb), 0.28);
  border-radius: 14px;
  background: rgba(10, 10, 15, 0.96);
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.45);
  padding: 0.85rem;
  backdrop-filter: blur(16px);
}

.pwa-banner-icon {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
}

.pwa-banner-icon img {
  width: 32px;
  height: 32px;
  border-radius: 10px;
  object-fit: cover;
}

.pwa-banner-text {
  flex: 1;
  min-width: 0;
  display: grid;
  gap: 0.1rem;
}

.pwa-banner-text strong {
  color: var(--text-primary, #fff);
  font-size: 0.92rem;
  line-height: 1.2;
}

.pwa-banner-text span {
  color: var(--text-secondary, rgba(255,255,255,0.68));
  font-size: 0.78rem;
  line-height: 1.3;
}

.pwa-banner-actions {
  display: flex;
  gap: 0.45rem;
  align-items: center;
}

.pwa-btn,
.pwa-banner-close {
  min-height: 36px;
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 10px;
  color: var(--text-primary, #fff);
  background: rgba(255,255,255,0.06);
  cursor: pointer;
}

.pwa-btn {
  padding: 0 0.8rem;
  font-size: 0.78rem;
  font-weight: 700;
}

.pwa-btn-primary {
  border-color: rgba(var(--metal-rgb), 0.45);
  background: rgba(var(--metal-rgb), 0.18);
  color: #f3d98a;
}

.pwa-btn-ghost {
  color: var(--text-secondary, rgba(255,255,255,0.72));
}

.pwa-banner-close {
  flex: 0 0 36px;
  width: 36px;
  display: grid;
  place-items: center;
}

.chat-send-btn {
  width: 44px;
  height: 44px;
  min-width: 44px;
  border-radius: 10px;
  background: var(--ai-bright, #7b68ee);
  border: none;
  color: #fff;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.15s;
  flex-shrink: 0;
}

.chat-send-btn:hover { background: #6c5ce7; transform: scale(1.05); }
.chat-send-btn:disabled { opacity: 0.4; cursor: not-allowed; transform: none; }

/* ── Welcome Screen ─────────────────────────────── */

.chat-welcome {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 2rem 1.5rem;
  gap: 0.75rem;
}

.chat-welcome-icon {
  font-size: 2.5rem;
  color: var(--ai-bright, #7b68ee);
  margin-bottom: 0.5rem;
}

.chat-welcome h2 {
  font-size: 1.3rem;
  color: var(--text-primary, #fff);
  font-weight: 600;
  margin: 0;
}

.chat-welcome p {
  color: var(--text-muted, rgba(255,255,255,0.5));
  font-size: 0.88rem;
  max-width: 480px;
  margin: 0;
  line-height: 1.6;
}

.chat-starters {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.6rem;
  max-width: 520px;
  width: 100%;
  margin-top: 1rem;
}

.chat-starter-btn {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.08);
  color: var(--text-primary, rgba(255,255,255,0.8));
  padding: 0.75rem 1rem;
  border-radius: 12px;
  font-size: 0.8rem;
  cursor: pointer;
  text-align: left;
  transition: all 0.15s;
  line-height: 1.45;
}

.chat-starter-btn:hover {
  background: rgba(123,104,238,0.08);
  border-color: rgba(123,104,238,0.25);
  color: var(--ai-bright, #7b68ee);
}

.chat-starter-icon {
  margin-right: 0.15rem;
}

.chat-starters-loading {
  grid-column: 1 / -1;
  display: flex;
  justify-content: center;
  padding: 1rem 0;
}

/* ── Welcome input (send from welcome screen) ──── */
.chat-welcome-input-wrap {
  display: flex;
  align-items: flex-end;
  gap: 0.5rem;
  max-width: 520px;
  width: 100%;
  margin-top: 1.5rem;
}

.chat-welcome-input-wrap .chat-input {
  flex: 1;
  min-height: 38px;
}

/* ── Sidebar toggle (mobile) ──────────────────── */
.chat-sidebar-toggle {
  display: none;
  background: none;
  border: none;
  color: var(--text-muted, rgba(255,255,255,0.45));
  font-size: 1.1rem;
  cursor: pointer;
  padding: 0.2rem;
  border-radius: 4px;
  transition: all 0.15s;
  flex-shrink: 0;
}

.chat-sidebar-toggle:hover { color: var(--text-primary, #fff); background: rgba(255,255,255,0.05); }

/* ── Markdown in Chat ───────────────────────────── */

.chat-msg-bubble h1,
.chat-msg-bubble h2,
.chat-msg-bubble h3 {
  font-size: 1rem;
  font-weight: 700;
  color: var(--text-primary, #fff);
  margin: 1rem 0 0.4rem;
  line-height: 1.3;
}

.chat-msg-bubble h1:first-child,
.chat-msg-bubble h2:first-child,
.chat-msg-bubble h3:first-child { margin-top: 0; }

.chat-msg-bubble h4 {
  font-size: 0.92rem;
  font-weight: 600;
  color: var(--text-primary, #fff);
  margin: 0.8rem 0 0.3rem;
}

.chat-msg-bubble strong { color: var(--text-primary, #fff); }

.chat-msg-bubble ul, .chat-msg-bubble ol {
  margin: 0.4rem 0;
  padding-left: 1.4rem;
}

.chat-msg-bubble li {
  margin-bottom: 0.2rem;
  line-height: 1.6;
}

.chat-msg-bubble a {
  color: var(--ai-bright, #7b68ee);
  text-decoration: underline;
  text-decoration-color: rgba(123,104,238,0.3);
  text-underline-offset: 2px;
}

.chat-msg-bubble a:hover { text-decoration-color: var(--ai-bright, #7b68ee); }

.chat-msg-bubble blockquote {
  border-left: 3px solid rgba(123,104,238,0.3);
  margin: 0.6rem 0;
  padding: 0.3rem 0 0.3rem 0.8rem;
  color: var(--text-secondary, rgba(255,255,255,0.65));
  font-style: italic;
}

.chat-msg-bubble hr {
  border: none;
  border-top: 1px solid rgba(255,255,255,0.08);
  margin: 0.8rem 0;
}

.chat-msg-bubble table {
  width: 100%;
  border-collapse: collapse;
  margin: 0.6rem 0;
  font-size: 0.82rem;
}

.chat-msg-bubble th, .chat-msg-bubble td {
  padding: 0.35rem 0.6rem;
  border: 1px solid rgba(255,255,255,0.08);
  text-align: left;
}

.chat-msg-bubble th {
  background: rgba(255,255,255,0.04);
  font-weight: 600;
  color: var(--text-primary, #fff);
}

/* ── Code Blocks ────────────────────────────────── */

.chat-code-block {
  position: relative;
  background: rgba(0,0,0,0.35);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px;
  margin: 0.6rem 0;
  overflow: hidden;
}

.chat-code-block-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.35rem 0.75rem;
  background: rgba(255,255,255,0.04);
  border-bottom: 1px solid rgba(255,255,255,0.06);
  font-size: 0.7rem;
  color: var(--text-muted, rgba(255,255,255,0.4));
}

.chat-code-copy-btn {
  background: none;
  border: none;
  color: var(--text-muted, rgba(255,255,255,0.4));
  cursor: pointer;
  font-size: 0.7rem;
  padding: 0.15rem 0.4rem;
  border-radius: 4px;
  transition: all 0.15s;
}

.chat-code-copy-btn:hover { color: #fff; background: rgba(255,255,255,0.08); }
.chat-code-copy-btn.copied { color: var(--success, #4ade80); }

.chat-code-block pre {
  margin: 0;
  padding: 0.75rem;
  overflow-x: auto;
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.8rem;
  line-height: 1.55;
  color: #e6e6e6;
}

.chat-code-block code { font-family: inherit; }

.chat-code-inline {
  background: rgba(255,255,255,0.07);
  padding: 0.12rem 0.4rem;
  border-radius: 4px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.82em;
  color: #e0b0ff;
}

/* ── Syntax colors (basic token highlighting) ──── */
.chat-code-block .tok-kw { color: #c792ea; }
.chat-code-block .tok-str { color: #c3e88d; }
.chat-code-block .tok-num { color: #f78c6c; }
.chat-code-block .tok-cm { color: #546e7a; font-style: italic; }
.chat-code-block .tok-fn { color: #82aaff; }
.chat-code-block .tok-op { color: #89ddff; }
.chat-code-block .tok-type { color: #ffcb6b; }
.chat-code-block .tok-bool { color: #ff5370; }
.chat-code-block .tok-dec { color: #c792ea; font-style: italic; }

/* ── Mobile ─────────────────────────────────────── */
@media (max-width: 768px) {
  .chat-page {
    height: calc(100vh - 56px);
    height: calc(100dvh - 56px);
    max-height: calc(100vh - 56px);
    max-height: calc(100dvh - 56px);
    padding: 0 !important;
    padding-bottom: 0 !important;
  }

  .app-content.chat-page {
    padding: 0 !important;
    padding-bottom: 0 !important;
    height: calc(100vh - 56px);
    height: calc(100dvh - 56px);
    max-height: calc(100vh - 56px);
    max-height: calc(100dvh - 56px);
    min-height: 0;
    overflow: hidden;
  }

  .chat-layout {
    flex-direction: column;
    height: 100%;
    max-height: 100%;
    min-height: 0;
  }

  .chat-sidebar-toggle { display: block; }

  .chat-sidebar {
    width: 100%;
    min-width: 100%;
    max-height: 44px;
    overflow: hidden;
    border-right: none;
    border-bottom: 1px solid var(--border-subtle, rgba(255,255,255,0.06));
    transition: max-height 0.25s ease;
  }

  .chat-sidebar.expanded {
    max-height: 220px;
  }

  .chat-sidebar.collapsed .chat-convo-list,
  .chat-sidebar.collapsed .chat-sidebar-search { display: none; }

  .chat-main {
    flex: 1 1 0;
    min-height: 0;
    height: 100%;
    max-height: 100%;
    overflow: hidden;
  }

  #chat-mode-content {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
  }

  .chat-messages {
    flex: 1 1 0;
    min-height: 0;
    max-height: none;
    overflow-y: auto;
    padding: 1rem 0.75rem calc(1.25rem + env(safe-area-inset-bottom, 0px));
  }

  .chat-input-wrap {
    position: sticky;
    bottom: 0;
    flex: 0 0 auto;
    padding: 0.5rem 0.75rem 0.85rem;
    background: rgba(10,10,15,0.95);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    max-width: none;
    margin: 0;
    z-index: 1250;
  }

  .pwa-banner {
    bottom: calc(5.25rem + env(safe-area-inset-bottom, 0px));
    width: min(420px, calc(100vw - 1rem));
    z-index: 780;
  }

  .pwa-banner-inner {
    align-items: flex-start;
    padding: 0.75rem;
  }

  .pwa-banner-actions {
    display: none;
  }

  .chat-msg-content { max-width: 92%; }

  .chat-starters { grid-template-columns: 1fr; }

  .chat-convo-item { padding: 0.45rem 0.75rem; }

  /* On mobile, show rename/delete buttons always since hover doesn't work on touch */
  .chat-convo-rename,
  .chat-convo-delete { opacity: 0.6 !important; }

  /* On mobile, always show message actions */
  .chat-msg-actions { opacity: 0.8 !important; }

  .chat-welcome-input-wrap { max-width: 100%; }

}

.chat-fab {
  position: fixed;
  bottom: 1.5rem;
  right: 1.5rem;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--gold-gradient);
  color: #0a0a0a;
  border: none;
  font-size: 1.5rem;
  cursor: pointer;
  box-shadow: 0 4px 16px rgba(0,0,0,0.4);
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}
.chat-fab:hover { transform: scale(1.05); }
@media (max-width: 640px) {
  .chat-fab { bottom: 1rem; right: 1rem; width: 50px; height: 50px; font-size: 1.25rem; }
}

@media (max-width: 400px) {
  .chat-msg-bubble { font-size: 0.84rem; padding: 0.55rem 0.8rem; }
  .chat-welcome h2 { font-size: 1.1rem; }
  .chat-welcome-input-wrap .chat-input { font-size: 0.84rem; }
}

/* ── Welcome Input Primary (input-first layout) ── */
.chat-welcome-input-primary {
  margin-top: 1rem;
  margin-bottom: 0;
}

.chat-welcome-input-primary .chat-input {
  background: rgba(255,255,255,0.06);
  border-color: rgba(123,104,238,0.2);
  font-size: 0.92rem;
  padding: 0.75rem 1rem;
}

.chat-welcome-input-primary .chat-input:focus {
  border-color: rgba(123,104,238,0.5);
  box-shadow: 0 0 0 3px rgba(123,104,238,0.1);
}

.chat-starters-label {
  font-size: 0.72rem;
  color: var(--text-muted, rgba(255,255,255,0.3));
  margin-top: 1.25rem;
  margin-bottom: -0.25rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-weight: 500;
}

/* AP-first home */
.ap-home-page #chat-mode-content {
  overflow-y: auto;
  overscroll-behavior: contain;
}

.ap-home-welcome {
  justify-content: flex-start;
  min-height: min-content;
  padding: clamp(2rem, 7vh, 5.75rem) 1.5rem 2.5rem;
  gap: 0.7rem;
}

.ap-home-orb {
  width: 76px;
  height: 76px;
  border-radius: 28px;
  display: grid;
  place-items: center;
  margin-bottom: 0.35rem;
  color: #0b0910;
  font: 800 1.7rem/1 'Syne', sans-serif;
  background:
    radial-gradient(circle at 30% 25%, rgba(255,255,255,0.75), transparent 28%),
    linear-gradient(135deg, var(--gold-bright), var(--gold-primary) 48%, var(--ai-primary));
  box-shadow:
    0 18px 55px var(--gold-glow-strong),
    0 0 0 1px var(--gold-border),
    inset 0 1px rgba(255,255,255,0.45);
  animation: apHomeBreathe 5.5s ease-in-out infinite;
}

@keyframes apHomeBreathe {
  0%, 100% { transform: translateY(0) scale(1); box-shadow: 0 18px 55px var(--gold-glow-strong), 0 0 0 1px var(--gold-border); }
  50% { transform: translateY(-4px) scale(1.025); box-shadow: 0 24px 70px var(--ai-glow-strong), 0 0 0 1px var(--border-ai); }
}

.ap-home-eyebrow {
  color: var(--gold-primary);
  font: 700 0.7rem/1.4 'JetBrains Mono', monospace;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}

.chat-welcome.ap-home-welcome h1 {
  margin: 0.15rem 0 0;
  font-size: clamp(1.85rem, 4vw, 3.1rem);
  letter-spacing: -0.045em;
}

.chat-welcome .ap-home-lede {
  max-width: 670px;
  color: var(--text-secondary);
  font-size: clamp(0.9rem, 1.5vw, 1.02rem);
}

.ap-home-composer {
  max-width: 760px;
  margin-top: 1rem;
  padding: 0.5rem 0.55rem 0.5rem 0.75rem;
  border: 1px solid var(--border-ai);
  border-radius: 18px;
  background: var(--bg-elevated);
  box-shadow: 0 22px 70px rgba(0,0,0,0.18), 0 0 0 4px var(--ai-glow);
}

.ap-home-composer .chat-input {
  min-height: 48px;
  max-height: 180px;
  padding: 0.75rem 0.5rem;
  border: 0;
  background: transparent;
  box-shadow: none;
  font-size: 0.96rem;
}

.ap-home-composer .chat-input:focus {
  border: 0;
  box-shadow: none;
}

.ap-home-trust {
  color: var(--text-muted);
  font-size: 0.72rem;
}

.ap-home-utility {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0.55rem;
  width: min(860px, 100%);
  margin-top: 1.15rem;
}

.ap-home-utility button {
  min-width: 0;
  min-height: 76px;
  padding: 0.8rem;
  border: 1px solid var(--border-subtle);
  border-radius: 13px;
  background: color-mix(in srgb, var(--bg-elevated) 84%, transparent);
  color: var(--text-primary);
  text-align: left;
  cursor: pointer;
  transition: transform var(--dur-fast), border-color var(--dur-fast), background var(--dur-fast);
}

.ap-home-utility button:hover {
  transform: translateY(-2px);
  border-color: var(--border-gold);
  background: var(--bg-elevated);
}

.ap-home-utility strong,
.ap-home-utility small {
  display: block;
}

.ap-home-utility strong {
  margin-bottom: 0.2rem;
  font-size: 0.8rem;
}

.ap-home-utility small {
  color: var(--text-muted);
  font-size: 0.68rem;
  line-height: 1.35;
}

.ap-home-page .chat-starters {
  max-width: 760px;
}

/* Persistent color mode controls */
.theme-toggle {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  border: 1px solid var(--border-subtle);
  border-radius: 12px;
  background: var(--bg-glass);
  color: var(--text-secondary);
  font-size: 1rem;
  cursor: pointer;
  transition: color var(--dur-fast), border-color var(--dur-fast), transform var(--dur-fast);
}

.theme-toggle:hover {
  color: var(--gold-primary);
  border-color: var(--border-gold);
  transform: translateY(-1px);
}

.theme-toggle:focus-visible {
  outline: 2px solid var(--gold-primary);
  outline-offset: 2px;
}

.theme-mobile-toggle {
  width: 100%;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

/* Light mode shell and component contrast */
:root[data-theme="light"] body::before {
  opacity: 0.28;
}

:root[data-theme="light"] .lux-sidebar,
:root[data-theme="light"] .lux-topbar {
  background: rgba(250, 246, 238, 0.93);
}

:root[data-theme="light"] .nav-mobile-menu,
:root[data-theme="light"] .mobile-dock,
:root[data-theme="light"] .chat-input-wrap,
:root[data-theme="light"] .pwa-banner-inner {
  background: rgba(250, 246, 238, 0.97);
}

:root[data-theme="light"] .chat-sidebar {
  background: rgba(238, 232, 220, 0.62);
}

:root[data-theme="light"] .chat-search-input,
:root[data-theme="light"] .chat-input,
:root[data-theme="light"] input,
:root[data-theme="light"] textarea,
:root[data-theme="light"] select {
  color: var(--text-primary);
  border-color: var(--border-glass);
}

:root[data-theme="light"] .chat-search-input,
:root[data-theme="light"] .chat-input:not(.ap-home-composer .chat-input) {
  background: rgba(255,255,255,0.62);
}

:root[data-theme="light"] .chat-convo-item:hover,
:root[data-theme="light"] .sidebar-link::before,
:root[data-theme="light"] .sidebar-link-icon,
:root[data-theme="light"] .chat-starter-btn {
  background: rgba(70, 54, 35, 0.045);
}

:root[data-theme="light"] .chat-msg-action-btn,
:root[data-theme="light"] .pwa-btn,
:root[data-theme="light"] .pwa-banner-close {
  background: rgba(70, 54, 35, 0.06);
  border-color: var(--border-glass);
}

:root[data-theme="light"] .chat-code-block {
  background: #24212c;
}

:root[data-theme="light"] #ap-panel {
  background: linear-gradient(180deg, rgba(255,252,246,0.99), rgba(244,238,227,0.99));
}

@media (max-width: 768px) {
  .ap-home-welcome {
    padding: 1.5rem 1rem calc(6rem + env(safe-area-inset-bottom, 0px));
  }

  .ap-home-orb {
    width: 58px;
    height: 58px;
    border-radius: 20px;
    font-size: 1.25rem;
  }

  .ap-home-utility {
    display: flex;
    overflow-x: auto;
    padding: 0.15rem 0.1rem 0.5rem;
    scroll-snap-type: x proximity;
  }

  .ap-home-utility button {
    flex: 0 0 142px;
    scroll-snap-align: start;
  }

  .ap-home-page #chat-mode-content {
    overflow-y: auto;
  }
}

@media (max-width: 480px) {
  .chat-welcome.ap-home-welcome h1 {
    font-size: 1.65rem;
  }

  .ap-home-eyebrow {
    font-size: 0.62rem;
  }

  .ap-home-composer {
    border-radius: 15px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ap-home-orb {
    animation: none;
  }
}

/* ── Strikethrough ─────────────────────────────── */
.chat-msg-bubble del {
  color: var(--text-muted, rgba(255,255,255,0.45));
  text-decoration: line-through;
}

/* ── H5/H6 in chat ────────────────────────────── */
.chat-msg-bubble h5 {
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--text-primary, #fff);
  margin: 0.6rem 0 0.25rem;
}
.chat-msg-bubble h6 {
  font-size: 0.84rem;
  font-weight: 600;
  color: var(--text-secondary, rgba(255,255,255,0.7));
  margin: 0.5rem 0 0.2rem;
}

/* ── Footnotes ────────────────────────────────── */
.chat-footnote {
  font-size: 0.7em;
  color: var(--ai-bright, #7b68ee);
  cursor: default;
  vertical-align: super;
  padding: 0 0.1em;
}

/* ── Chat File Upload ──────────────────────────── */

.chat-attach-btn {
  width: 44px;
  height: 44px;
  min-width: 44px;
  border-radius: 8px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  color: var(--text-muted, rgba(255,255,255,0.4));
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.15s;
  flex-shrink: 0;
}

.chat-attach-btn:hover {
  background: rgba(123,104,238,0.1);
  border-color: rgba(123,104,238,0.25);
  color: var(--ai-bright, #7b68ee);
}

.chat-file-preview {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.5rem 1rem;
  max-width: 800px;
  width: 100%;
  margin: 0 auto;
  background: rgba(123,104,238,0.06);
  border: 1px solid rgba(123,104,238,0.12);
  border-bottom: none;
  border-radius: 10px 10px 0 0;
  flex: 0 0 auto;
  position: relative;
  z-index: 4;
}

.chat-file-thumb { width: 40px; height: 40px; border-radius: 6px; overflow: hidden; flex-shrink: 0; }
.chat-file-thumb img { width: 100%; height: 100%; object-fit: cover; }
.chat-file-thumb-icon { width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; font-size: 1.2rem; background: rgba(255,255,255,0.05); border-radius: 6px; flex-shrink: 0; }
.chat-file-info { flex: 1; min-width: 0; }
.chat-file-name { display: block; font-size: 0.78rem; font-weight: 500; color: var(--text-primary, #fff); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.chat-file-size { display: block; font-size: 0.68rem; color: var(--text-muted, rgba(255,255,255,0.4)); }
.chat-file-remove { background: none; border: none; color: var(--text-muted); cursor: pointer; font-size: 0.75rem; padding: 0.2rem 0.35rem; border-radius: 4px; transition: all 0.15s; }
.chat-file-remove:hover { color: var(--danger, #f87171); background: rgba(248,113,113,0.1); }

.chat-file-attachment { margin-bottom: 0.4rem; }
.chat-file-img { max-width: 260px; max-height: 200px; border-radius: 8px; cursor: pointer; transition: opacity 0.15s; border: 1px solid rgba(255,255,255,0.08); }
.chat-file-img:hover { opacity: 0.85; }
.chat-file-link { display: inline-flex; align-items: center; gap: 0.3rem; font-size: 0.8rem; color: var(--ai-bright, #7b68ee); text-decoration: none; padding: 0.3rem 0.6rem; background: rgba(123,104,238,0.08); border-radius: 6px; transition: all 0.15s; }
.chat-file-link:hover { background: rgba(123,104,238,0.15); }

.chat-dragover { outline: 2px dashed rgba(123,104,238,0.4); outline-offset: -4px; background: rgba(123,104,238,0.03) !important; }

/* ── Chat Mode Toggle ─────────────────────────── */

.chat-mode-btn {
  padding: 0.45rem 1.1rem;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.06);
  color: var(--text-muted, rgba(255,255,255,0.45));
  font-size: 0.78rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.15s;
  white-space: nowrap;
}

.chat-mode-btn:first-child { border-radius: 8px 0 0 8px; }
.chat-mode-btn:last-child { border-radius: 0 8px 8px 0; border-left: none; }

.chat-mode-btn.active {
  background: rgba(123,104,238,0.12);
  border-color: rgba(123,104,238,0.2);
  color: var(--ai-bright, #7b68ee);
}

.chat-mode-btn:hover:not(.active) {
  background: rgba(255,255,255,0.05);
  color: var(--text-primary, #fff);
}

/* ═══════════════════════════════════════════════════════════
   PROFILE CARD (used in Identity module)
   ═══════════════════════════════════════════════════════════ */

.profile-card {
  padding: 1.25rem 1.5rem;
  margin-bottom: 1rem;
}

.pc-header {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 1rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid var(--border-subtle);
}

.pc-icon { font-size: 18px; }

.pc-header h3 {
  font-size: var(--text-base);
  font-weight: 700;
  color: var(--text-primary);
  letter-spacing: -0.01em;
}

.pc-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.4rem 0;
  border-bottom: 1px solid rgba(255,255,255,0.03);
}

.pc-label {
  font-size: var(--text-sm);
  color: var(--text-muted);
}

.pc-val {
  font-size: var(--text-sm);
  font-weight: 600;
  color: var(--text-primary);
}

.pc-chips-row {
  padding: 0.5rem 0;
}

.pc-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-top: 0.35rem;
}

.chip-tag {
  font-size: var(--text-xs);
  padding: 0.2rem 0.6rem;
  border-radius: var(--radius-pill);
  font-weight: 600;
  letter-spacing: 0.02em;
}

.chip-tag.success {
  background: var(--success-dim);
  color: var(--success);
  border: 1px solid rgba(74,222,128,0.2);
}

.chip-tag.warning {
  background: var(--warning-dim);
  color: var(--warning);
  border: 1px solid rgba(251,191,36,0.2);
}

.chip-tag.danger {
  background: var(--danger-dim);
  color: var(--danger);
  border: 1px solid rgba(248,113,113,0.2);
}

/* ═══════════════════════════════════════════════════════════
   WORLD / ENVIRONMENTAL / SOCIAL INTELLIGENCE MODULES
   ═══════════════════════════════════════════════════════════ */

.intelligence-zone {
  padding: 1.5rem;
  margin-bottom: 1rem;
}

.iz-header {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 1rem;
}

.iz-title {
  font-family: 'Syne', sans-serif;
  font-size: var(--text-base);
  font-weight: 700;
  color: var(--text-primary);
  letter-spacing: -0.01em;
}

.iz-score {
  font-family: 'JetBrains Mono', monospace;
  font-size: var(--text-sm);
  font-weight: 700;
  color: var(--text-muted);
  margin-left: auto;
}

.iz-statement {
  font-size: var(--text-base);
  color: var(--text-secondary);
  line-height: 1.6;
  margin-bottom: 1rem;
  font-style: italic;
}

.iz-recommendation {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  padding: 0.875rem 1rem;
  background: rgba(var(--metal-rgb), 0.05);
  border: 1px solid rgba(var(--metal-rgb), 0.1);
  border-radius: var(--radius-md);
  font-size: var(--text-sm);
  color: var(--text-secondary);
}

.iz-recommendation-icon {
  font-size: 16px;
  flex-shrink: 0;
  color: var(--gold-primary);
}

/* ═══════════════════════════════════════════════════════════
   FOUNDEROS SPECIFIC
   ═══════════════════════════════════════════════════════════ */

.founder-section-label {
  font-family: 'JetBrains Mono', monospace;
  font-size: var(--text-xs);
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--gold-primary);
  margin-bottom: 1rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.founder-section-label::after {
  content: '';
  flex: 1;
  height: 1px;
  background: var(--border-subtle);
}

.founder-kpi-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 0.75rem;
  margin-bottom: 1.5rem;
}

.founder-kpi {
  padding: 1rem 1.25rem;
  text-align: center;
}

.founder-kpi-value {
  font-family: 'JetBrains Mono', monospace;
  font-size: var(--text-2xl);
  font-weight: 700;
  color: var(--text-primary);
  letter-spacing: -0.04em;
  margin-bottom: 0.25rem;
}

.founder-kpi-label {
  font-size: var(--text-xs);
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

/* ═══════════════════════════════════════════════════════════
   NAV (DESKTOP — OLD, now in sidebar)
   ═══════════════════════════════════════════════════════════ */

.app-nav {
  /* Deprecated — replaced by lux-sidebar + lux-topbar */
  display: none;
}

/* ═══════════════════════════════════════════════════════════
   BUTTONS — LUXURY SYSTEM
   ═══════════════════════════════════════════════════════════ */

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.7rem 1.5rem;
  font-family: 'Syne', sans-serif;
  font-size: var(--text-sm);
  font-weight: 700;
  letter-spacing: 0.04em;
  border: none;
  border-radius: var(--radius-md);
  cursor: pointer;
  transition: all var(--dur-normal) var(--ease-out-expo);
  text-decoration: none;
  position: relative;
  overflow: hidden;
  min-height: 44px;
  min-width: 44px;
}

.btn::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(255,255,255,0.08);
  opacity: 0;
  transition: opacity var(--dur-fast);
}

.btn:hover::after { opacity: 1; }
.btn:active { transform: scale(0.97); }

.btn-primary {
  background: var(--gold-gradient);
  color: #07070d;
  box-shadow: 0 0 20px rgba(var(--metal-rgb), 0.2);
}

.btn-primary:hover {
  box-shadow: 0 0 30px rgba(var(--metal-rgb), 0.35);
  color: #07070d;
}

.btn-secondary {
  background: rgba(255,255,255,0.04);
  color: var(--text-primary);
  border: 1px solid var(--border-glass);
}

.btn-secondary:hover {
  border-color: var(--border-active);
  background: rgba(255,255,255,0.07);
}

.btn-ghost {
  background: transparent;
  color: var(--text-muted);
  border: 1px solid transparent;
}

.btn-ghost:hover {
  color: var(--text-primary);
  background: rgba(255,255,255,0.04);
}

.btn-success {
  background: var(--success);
  color: #07070d;
}

.btn-success:hover {
  background: #6ee7a7;
  color: #07070d;
}

.btn-danger {
  background: var(--danger-dim);
  color: var(--danger);
  border: 1px solid rgba(248,113,113,0.2);
}

.btn-block { width: 100%; }

.btn-sm {
  padding: 0.45rem 1rem;
  font-size: var(--text-xs);
  min-height: 44px;
}

.btn-lg {
  padding: 0.9rem 2rem;
  font-size: var(--text-base);
}

/* ═══════════════════════════════════════════════════════════
   FORMS
   ═══════════════════════════════════════════════════════════ */

.form-group {
  margin-bottom: 1.25rem;
}

.app-shell input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),
.app-shell textarea,
.app-shell select,
.modal input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),
.modal textarea,
.modal select {
  background: linear-gradient(180deg, rgba(16, 16, 28, 0.94), rgba(9, 9, 16, 0.94)) !important;
  border: 1px solid rgba(var(--metal-rgb), 0.18) !important;
  color: var(--text-primary) !important;
  border-radius: 8px !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.025), 0 10px 30px rgba(0,0,0,0.12);
  caret-color: var(--gold-bright);
}

.app-shell input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"])::placeholder,
.app-shell textarea::placeholder,
.modal input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"])::placeholder,
.modal textarea::placeholder {
  color: rgba(240, 237, 232, 0.44) !important;
}

.app-shell input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):focus,
.app-shell textarea:focus,
.app-shell select:focus,
.modal input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):focus,
.modal textarea:focus,
.modal select:focus {
  border-color: rgba(var(--metal-rgb), 0.48) !important;
  box-shadow: 0 0 0 3px rgba(var(--metal-rgb), 0.08), inset 0 0 0 1px rgba(255,255,255,0.04) !important;
}

.form-group label {
  display: block;
  font-size: var(--text-xs);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-muted);
  margin-bottom: 0.5rem;
  font-weight: 600;
}

.form-group input,
.form-group textarea,
.form-group select {
  width: 100%;
  padding: 0.875rem 1rem;
  background: rgba(255,255,255,0.03);
  border: 1px solid var(--border-glass);
  border-radius: var(--radius-md);
  color: var(--text-primary);
  font-family: 'DM Sans', sans-serif;
  font-size: var(--text-base);
  transition: all var(--dur-fast) var(--ease-out-expo);
  outline: none;
}

.form-group input::placeholder,
.form-group textarea::placeholder {
  color: var(--text-muted);
}

.form-group input:focus,
.form-group textarea:focus,
.form-group select:focus {
  border-color: rgba(var(--metal-rgb), 0.4);
  box-shadow: 0 0 0 3px rgba(var(--metal-rgb), 0.06);
  background: rgba(255,255,255,0.05);
}

.form-group textarea {
  resize: vertical;
  min-height: 80px;
}

.form-group select {
  appearance: none;
  cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%236b6762' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 1rem center;
  padding-right: 2.5rem;
}

/* Tester-readiness guardrail: route-specific forms sometimes ship inline or
   legacy classes. Keep all text inputs readable on the dark LifeOS surfaces. */
#app input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),
#app textarea,
#app select,
.ap-bubble-panel input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),
.ap-bubble-panel textarea,
.ap-bubble-panel select {
  background-color: #10101c !important;
  background-image: linear-gradient(180deg, rgba(18,18,32,0.96), rgba(9,9,16,0.96)) !important;
  color: #f0ede8 !important;
  border-color: rgba(var(--metal-rgb), 0.24) !important;
  outline: none !important;
}

#app input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"])::placeholder,
#app textarea::placeholder,
.ap-bubble-panel input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"])::placeholder,
.ap-bubble-panel textarea::placeholder {
  color: rgba(240,237,232,0.48) !important;
}

#app input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):focus,
#app textarea:focus,
#app select:focus,
.ap-bubble-panel input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):focus,
.ap-bubble-panel textarea:focus,
.ap-bubble-panel select:focus {
  border-color: rgba(var(--metal-rgb), 0.58) !important;
  box-shadow: 0 0 0 3px rgba(var(--metal-rgb), 0.1), inset 0 0 0 1px rgba(255,255,255,0.04) !important;
}

/* ═══════════════════════════════════════════════════════════
   AUTH PAGES — LUXURY UPGRADE
   ═══════════════════════════════════════════════════════════ */

.auth-page {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2rem;
}

.auth-card {
  width: 100%;
  max-width: 420px;
  padding: 2.5rem;
  animation: fadeUp var(--dur-slow) var(--ease-out-expo);
}

.auth-card.signup-card {
  width: min(940px, calc(100vw - 2rem));
  max-width: 940px;
}

.signup-plan-picker {
  border: 0;
  margin: 0 0 1rem;
  min-width: 0;
}

.signup-plan-picker legend {
  color: var(--text-primary);
  font-family: 'Syne', sans-serif;
  font-size: 0.92rem;
  font-weight: 700;
  margin-bottom: 0.7rem;
}

.signup-plan-strip {
  display: grid;
  grid-template-columns: repeat(5, minmax(145px, 1fr));
  gap: 0.55rem;
  overflow-x: auto;
  padding: 0.15rem 0.1rem 0.45rem;
  scrollbar-width: thin;
}

.signup-plan {
  background: linear-gradient(145deg, var(--bg-elevated), var(--bg-surface));
  border: 1px solid var(--border-glass);
  border-radius: 14px;
  cursor: pointer;
  display: grid;
  gap: 0.28rem;
  min-height: 130px;
  padding: 0.85rem;
  position: relative;
  transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.signup-plan:hover,
.signup-plan.selected {
  border-color: var(--gold-primary);
  box-shadow: 0 0 0 1px var(--gold-border), 0 10px 30px var(--gold-glow);
  transform: translateY(-2px);
}

.signup-plan input {
  height: 1px;
  opacity: 0;
  pointer-events: none;
  position: absolute;
  width: 1px;
}

.signup-plan-name {
  color: var(--text-primary);
  font-family: 'Syne', sans-serif;
  font-size: 0.8rem;
  font-weight: 700;
}

.signup-plan strong {
  color: var(--gold-bright);
  font-size: 1rem;
}

.signup-plan small,
.signup-plan-help {
  color: var(--text-muted);
  font-size: 0.68rem;
  line-height: 1.35;
}

.signup-plan-help { margin: 0.4rem 0 0; }

.signup-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
}

.auth-notice {
  background: var(--gold-glow);
  border: 1px solid var(--gold-border);
  border-radius: 10px;
  color: var(--text-secondary);
  font-size: 0.76rem;
  margin-bottom: 0.8rem;
  padding: 0.7rem 0.8rem;
}

.auth-notice-error {
  background: var(--danger-dim);
  border-color: color-mix(in srgb, var(--danger) 35%, transparent);
}

#google-register-link[aria-disabled="true"] {
  cursor: not-allowed;
  opacity: 0.55;
}

@media (max-width: 720px) {
  .signup-plan-strip { grid-template-columns: repeat(5, 155px); }
  .signup-fields { grid-template-columns: 1fr; gap: 0; }
}

.auth-card .logo-text {
  font-family: 'Syne', sans-serif;
  font-size: var(--text-lg);
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  background: var(--gold-gradient);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-align: center;
  margin-bottom: 0.35rem;
}

.auth-card .subtitle {
  text-align: center;
  color: var(--text-muted);
  font-size: var(--text-sm);
  margin-bottom: 2.5rem;
  letter-spacing: 0.05em;
}

.auth-card h2 {
  text-align: center;
  color: var(--text-primary);
  font-size: var(--text-xl);
  margin-bottom: 1.75rem;
  letter-spacing: -0.02em;
}

.auth-footer {
  text-align: center;
  margin-top: 1.5rem;
  font-size: var(--text-sm);
  color: var(--text-muted);
}

.auth-footer a {
  color: var(--gold-primary);
  text-decoration: none;
  font-weight: 600;
}

.auth-footer a:hover { color: var(--gold-bright); }

/* ═══════════════════════════════════════════════════════════
   ERROR / SUCCESS MESSAGES
   ═══════════════════════════════════════════════════════════ */

.error-msg {
  background: var(--danger-dim);
  color: var(--danger);
  padding: 0.75rem 1rem;
  border-radius: var(--radius-md);
  font-size: var(--text-sm);
  margin-bottom: 1.25rem;
  border: 1px solid rgba(248,113,113,0.15);
  display: none;
}

.error-msg.visible { display: block; }

/* ═══════════════════════════════════════════════════════════
   SECTION / MODULE CONTAINERS
   ═══════════════════════════════════════════════════════════ */

.db-section {
  margin-bottom: 2rem;
}

.db-section-label {
  font-family: 'JetBrains Mono', monospace;
  font-size: var(--text-xs);
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--text-muted);
  margin-bottom: 0.75rem;
}

.db-two-col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
}

@media (max-width: 600px) {
  .db-two-col { grid-template-columns: 1fr; }
}

/* Loading */
.loading {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 3rem;
}

.spinner {
  width: 32px;
  height: 32px;
  border: 2px solid var(--border-glass);
  border-top-color: var(--gold-primary);
  border-radius: 50%;
  animation: glyphSpinConic 0.8s linear infinite;
}

/* ═══════════════════════════════════════════════════════════
   ONBOARDING PAGES
   ═══════════════════════════════════════════════════════════ */

.onboarding-page {
  min-height: 100vh;
  padding: 4rem 2rem;
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* ── AI Onboarding Conversation ───────────────────────── */
.ai-onboarding-page {
  padding-top: 3rem;
  padding-bottom: 2rem;
}

.ai-ob-chat {
  width: 100%;
  max-width: 560px;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  padding: 1.5rem 1rem;
  overflow-y: auto;
  max-height: calc(100vh - 280px);
  margin-bottom: 1rem;
}

.ai-ob-msg {
  display: flex;
  align-items: flex-end;
  gap: 0.6rem;
}

.ai-ob-msg-ai {
  flex-direction: row;
}

.ai-ob-msg-user {
  flex-direction: row-reverse;
}

.ai-ob-avatar {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--gold-gradient);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.7rem;
  color: #07070d;
  flex-shrink: 0;
  font-weight: 700;
}

.ai-ob-bubble {
  max-width: 75%;
  padding: 0.85rem 1.1rem;
  border-radius: 18px;
  font-size: 0.95rem;
  line-height: 1.5;
  word-break: break-word;
}

.ai-ob-msg-ai .ai-ob-bubble {
  background: rgba(var(--metal-rgb), 0.08);
  border: 1px solid rgba(var(--metal-rgb), 0.15);
  border-bottom-left-radius: 4px;
  color: var(--text-primary);
}

.ai-ob-msg-user .ai-ob-bubble {
  background: rgba(var(--metal-rgb), 0.18);
  border: 1px solid rgba(var(--metal-rgb), 0.3);
  border-bottom-right-radius: 4px;
  color: var(--gold-bright);
}

.ai-ob-typing .ai-ob-bubble {
  font-size: 1.1rem;
}

.typing-dots span {
  animation: typingBounce 1.2s infinite;
  opacity: 0.4;
}
.typing-dots span:nth-child(2) { animation-delay: 0.2s; }
.typing-dots span:nth-child(3) { animation-delay: 0.4s; }

@keyframes typingBounce {
  0%, 60%, 100% { opacity: 0.4; }
  30% { opacity: 1; }
}

.ai-ob-input-wrap {
  width: 100%;
  max-width: 560px;
  display: flex;
  align-items: flex-end;
  gap: 0.5rem;
  padding: 0 1rem;
  flex-shrink: 0;
}

/* ── General onboarding ─────────────────────────────── */
.ob-header {
  text-align: center;
  margin-bottom: 0.75rem;
  width: 100%;
  max-width: 560px;
}

.ob-logo {
  font-family: 'Syne', sans-serif;
  font-size: 1.5rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  color: var(--gold-primary);
  margin-bottom: 0.25rem;
}

.onboarding-progress {
  display: flex;
  gap: 0.5rem;
  margin-bottom: 3rem;
}

.onboarding-progress .dot {
  width: 40px;
  height: 4px;
  border-radius: 2px;
  background: rgba(255,255,255,0.06);
  transition: background var(--dur-normal);
}

.onboarding-progress .dot.active {
  background: var(--gold-gradient);
  box-shadow: 0 0 8px rgba(var(--metal-rgb), 0.3);
}

/* ═══════════════════════════════════════════════════════════
   ONBOARDING CHOICE CHIPS
   ═══════════════════════════════════════════════════════════ */

.chip-group {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 0.5rem;
}

.chip {
  display: inline-block;
  padding: 0.45rem 0.9rem;
  border-radius: 999px;
  border: 1px solid rgba(var(--metal-rgb), 0.25);
  background: rgba(255, 255, 255, 0.03);
  color: var(--text-secondary, #aaa);
  font-size: 0.82rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.15s ease;
  user-select: none;
  line-height: 1.4;
  min-height: 44px;
}

.chip:hover {
  border-color: var(--accent);
  color: var(--text-primary, #e0d9c8);
  background: rgba(var(--metal-rgb), 0.08);
}

.chip.selected {
  border-color: var(--accent);
  background: var(--accent);
  color: #0d0b09;
  font-weight: 600;
  box-shadow: 0 0 12px rgba(var(--metal-rgb), 0.25);
}

/* ═══════════════════════════════════════════════════════════
   CALENDAR ONBOARDING CARD
   ═══════════════════════════════════════════════════════════ */
.ob-calendar-card {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 16px;
  padding: 1.5rem;
  backdrop-filter: blur(12px);
}
.ob-calendar-provider {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 1rem;
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 12px;
  margin-bottom: 0.75rem;
  background: rgba(255,255,255,0.02);
  cursor: pointer;
  transition: border-color 0.2s, background 0.2s;
}
.ob-calendar-provider:hover {
  border-color: rgba(var(--metal-rgb), 0.3);
  background: rgba(var(--metal-rgb), 0.04);
}
.ob-calendar-provider.connected {
  border-color: rgba(39,217,133,0.3);
  background: rgba(39,217,133,0.05);
}
.ob-calendar-provider .provider-icon { font-size: 1.4rem; }
.ob-calendar-provider .provider-info { flex: 1; }
.ob-calendar-provider .provider-name {
  font-weight: 600;
  font-size: 0.95rem;
  color: var(--text-primary);
}
.ob-calendar-provider .provider-desc {
  font-size: 0.8rem;
  color: var(--gray);
  margin-top: 0.15rem;
}
.ob-calendar-benefit {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.85rem;
  color: var(--gray);
  margin: 0.35rem 0;
}
.ob-calendar-benefit::before {
  content: '✓';
  color: var(--gold);
}
.ob-calendar-connected-state {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.75rem 1rem;
  border: 1px solid rgba(39,217,133,0.3);
  border-radius: 12px;
  background: rgba(39,217,133,0.05);
  margin-bottom: 0.75rem;
}
.ob-calendar-connected-state .connected-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #27d985;
  flex-shrink: 0;
}

/* ═══════════════════════════════════════════════════════════
   SETTINGS / PROFILE
   ═══════════════════════════════════════════════════════════ */

.settings-grid {
  display: grid;
  gap: 1.5rem;
  max-width: 700px;
}

.settings-hero {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin: 0 0 1rem;
  padding: 1.25rem;
  border: 1px solid rgba(var(--metal-rgb), 0.2);
  border-radius: var(--radius-lg);
  background:
    linear-gradient(135deg, rgba(var(--metal-rgb), 0.1), rgba(255, 255, 255, 0.025)),
    rgba(12, 12, 14, 0.78);
}

.settings-kicker {
  color: var(--gold-primary, var(--gold-primary));
  font-size: var(--text-xs);
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 0.35rem;
}

.settings-hero h2 {
  margin: 0;
  color: var(--text-primary);
  font-size: var(--text-2xl);
}

.settings-hero p {
  max-width: 48rem;
  margin: 0.35rem 0 0;
  color: var(--text-secondary);
  font-size: var(--text-sm);
  line-height: 1.55;
}

.settings-control-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.75rem;
  margin: 0 0 1rem;
}

.settings-control-tile {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  min-height: 8rem;
  padding: 0.9rem;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  background: rgba(255, 255, 255, 0.035);
  color: var(--text-secondary);
  text-decoration: none;
  transition: border-color var(--dur-fast), transform var(--dur-fast), background var(--dur-fast);
}

.settings-control-tile:hover {
  transform: translateY(-1px);
  background: rgba(255, 255, 255, 0.055);
  border-color: rgba(var(--metal-rgb), 0.3);
}

.settings-control-tile span {
  color: var(--gold-primary, var(--gold-primary));
  font-size: var(--text-xs);
  font-weight: 800;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.settings-control-tile strong {
  color: var(--text-primary);
  font-size: var(--text-sm);
}

.settings-control-tile small {
  color: var(--text-muted);
  font-size: var(--text-xs);
  line-height: 1.45;
}

.deployment-summary,
.deployment-env-box,
.deployment-callback-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.85rem;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  background: rgba(255, 255, 255, 0.035);
}

.deployment-summary-main,
.deployment-env-box > div,
.deployment-callback-row > div {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.deployment-summary strong,
.deployment-env-box code,
.deployment-callback-row code {
  color: var(--text-primary);
  overflow-wrap: anywhere;
}

.deployment-summary small,
.deployment-env-box small,
.deployment-callback-row small,
.deployment-callbacks p {
  color: var(--text-muted);
  font-size: var(--text-xs);
  line-height: 1.45;
}

.deployment-env-box,
.deployment-callbacks {
  margin-top: 0.75rem;
}

.deployment-env-box span {
  color: var(--gold-primary, var(--gold-primary));
  font-size: var(--text-xs);
  font-weight: 800;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.deployment-pill {
  align-self: flex-start;
  border-radius: 999px;
  padding: 0.2rem 0.6rem;
  font-size: var(--text-xs);
  font-weight: 800;
}

.deployment-pill-ok {
  color: #4ade80;
  background: rgba(74, 222, 128, 0.12);
  border: 1px solid rgba(74, 222, 128, 0.22);
}

.deployment-pill-warn {
  color: #fbbf24;
  background: rgba(251, 191, 36, 0.12);
  border: 1px solid rgba(251, 191, 36, 0.22);
}

.deployment-callbacks h4 {
  margin: 0 0 0.2rem;
  color: var(--text-primary);
  font-size: var(--text-sm);
}

.deployment-callback-row {
  margin-top: 0.6rem;
}

.settings-section {
  padding: 1.75rem;
}

.settings-section-title {
  font-family: 'Syne', sans-serif;
  font-size: var(--text-base);
  font-weight: 700;
  color: var(--text-primary);
  margin-bottom: 1.25rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid var(--border-subtle);
}

.settings-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.75rem 0;
  border-bottom: 1px solid rgba(255,255,255,0.03);
}

.settings-row:last-child { border-bottom: none; }

.settings-row-label {
  font-size: var(--text-sm);
  color: var(--text-primary);
}

.settings-row-desc {
  font-size: var(--text-xs);
  color: var(--text-muted);
  margin-top: 0.2rem;
}

@media (max-width: 900px) {
  .settings-hero {
    flex-direction: column;
  }

  .settings-control-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 520px) {
  .settings-control-grid {
    grid-template-columns: 1fr;
  }

  .settings-hero .btn {
    width: 100%;
  }

  .deployment-summary,
  .deployment-env-box,
  .deployment-callback-row {
    flex-direction: column;
  }

  .deployment-summary .btn,
  .deployment-env-box .btn,
  .deployment-callback-row .btn {
    width: 100%;
  }
}

.settings-identity-field {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  padding: 0.55rem 0.7rem;
  background: var(--bg-tertiary);
  border: 1px solid var(--border);
  border-radius: 8px;
}
.settings-identity-field small {
  font-size: 0.65rem;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.settings-identity-field strong {
  font-size: 0.88rem;
  color: var(--text-primary);
  word-break: break-word;
}

/* Toggle switch */
.toggle-switch {
  position: relative;
  width: 44px;
  height: 24px;
  flex-shrink: 0;
  min-height: 44px;
}

.toggle-switch input { opacity: 0; width: 0; height: 0; }

.toggle-slider {
  position: absolute;
  cursor: pointer;
  inset: 0;
  background: rgba(255,255,255,0.1);
  border: 1px solid var(--border-glass);
  border-radius: var(--radius-pill);
  transition: all var(--dur-normal) var(--ease-out-expo);
}

.toggle-slider::before {
  content: '';
  position: absolute;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--text-muted);
  left: 2px;
  top: 2px;
  transition: all var(--dur-normal) var(--ease-out-expo);
}

.toggle-switch input:checked + .toggle-slider {
  background: var(--gold-primary);
  border-color: var(--gold-primary);
  box-shadow: 0 0 8px rgba(var(--metal-rgb), 0.3);
}

.toggle-switch input:checked + .toggle-slider::before {
  transform: translateX(20px);
  background: #07070d;
}

/* ═══════════════════════════════════════════════════════════
   BILLING
   ═══════════════════════════════════════════════════════════ */

.billing-card {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 14px;
  padding: 1.25rem;
  margin-bottom: 1.25rem;
}
.billing-section-label {
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--text-secondary);
  margin-bottom: 1rem;
}
.billing-metric-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.45rem;
  margin-bottom: 0.9rem;
}
@media (max-width: 480px) {
  .billing-metric-grid { grid-template-columns: repeat(2, 1fr); }
}
.billing-sub-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.5rem 0;
  border-bottom: 1px solid rgba(255,255,255,0.04);
  font-size: 0.82rem;
}
.billing-sub-row:last-child { border-bottom: none; }
.billing-txn-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.45rem 0.6rem;
  margin-bottom: 0.15rem;
  background: rgba(255,255,255,0.02);
  border-radius: 8px;
  font-size: 0.8rem;
}
.billing-health-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.35rem 0.75rem;
  border-radius: 20px;
  font-size: 0.78rem;
  font-weight: 600;
}
.billing-health-green  { background: rgba(74,222,128,0.15); color: #4ade80; }
.billing-health-yellow { background: rgba(250,204,21,0.15);  color: #facc15; }
.billing-health-red    { background: rgba(248,113,113,0.15); color: #f87171; }

/* ═══════════════════════════════════════════════════════════
   MODULE-SPECIFIC: Calendar, Leaderboard, Achievements, etc.
   ═══════════════════════════════════════════════════════════ */

/* Calendar strip (compact) */
.calendar-strip {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  overflow-x: auto;
  padding: 0.5rem 0;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}

.calendar-strip::-webkit-scrollbar { display: none; }

.calendar-day {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 0.5rem;
  border-radius: var(--radius-md);
  cursor: pointer;
  transition: all var(--dur-fast);
  min-width: 44px;
}

.calendar-day:hover { background: rgba(255,255,255,0.04); }

.calendar-day.active {
  background: rgba(var(--metal-rgb), 0.08);
  border: 1px solid rgba(var(--metal-rgb), 0.15);
}

.calendar-day-num {
  font-family: 'JetBrains Mono', monospace;
  font-size: var(--text-base);
  font-weight: 700;
  color: var(--text-secondary);
}

.calendar-day.active .calendar-day-num { color: var(--gold-primary); }

.calendar-day-label {
  font-size: var(--text-xs);
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.calendar-day-dots {
  display: flex;
  gap: 2px;
}

.calendar-dot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--gold-dim);
}

.calendar-dot.completed { background: var(--gold-primary); }

/* Leaderboard */
.leaderboard-row {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.875rem 1rem;
  margin-bottom: 0.35rem;
  border-radius: var(--radius-md);
  transition: all var(--dur-fast);
}

.leaderboard-row:hover {
  background: rgba(255,255,255,0.03);
}

.lb-rank {
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'JetBrains Mono', monospace;
  font-size: var(--text-xs);
  font-weight: 700;
  color: var(--text-muted);
  border-radius: var(--radius-sm);
  background: rgba(255,255,255,0.04);
  flex-shrink: 0;
}

.lb-rank.top-3 { color: var(--gold-primary); background: rgba(var(--metal-rgb), 0.1); }
.lb-rank.top-1 { color: var(--gold-bright); background: rgba(var(--metal-rgb), 0.15); }

.lb-name {
  flex: 1;
  font-size: var(--text-sm);
  font-weight: 600;
  color: var(--text-primary);
}

.lb-xp {
  font-family: 'JetBrains Mono', monospace;
  font-size: var(--text-xs);
  font-weight: 700;
  color: var(--text-muted);
}

/* Achievements */
.achievement-card {
  padding: 1.25rem;
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-bottom: 0.75rem;
  transition: all var(--dur-normal);
}

.achievement-card.locked {
  opacity: 0.4;
}

.achievement-badge {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--gold-glow);
  border: 1px solid var(--gold-border);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  flex-shrink: 0;
}

.achievement-info { flex: 1; }

.achievement-name {
  font-weight: 700;
  font-size: var(--text-base);
  color: var(--text-primary);
  margin-bottom: 0.2rem;
}

.achievement-desc {
  font-size: var(--text-sm);
  color: var(--text-muted);
}

/* Guilds */
.guild-card {
  padding: 1.5rem;
  margin-bottom: 1rem;
}

.guild-header {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-bottom: 1rem;
}

.guild-icon {
  width: 48px;
  height: 48px;
  border-radius: var(--radius-md);
  background: var(--gold-glow);
  border: 1px solid var(--gold-border);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  flex-shrink: 0;
}

.guild-name {
  font-family: 'Syne', sans-serif;
  font-size: var(--text-lg);
  font-weight: 700;
  color: var(--text-primary);
  letter-spacing: -0.01em;
}

.guild-meta {
  font-size: var(--text-sm);
  color: var(--text-muted);
}

/* DMs */
.dm-row {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 1rem 1.25rem;
  cursor: pointer;
  transition: all var(--dur-fast);
  border-bottom: 1px solid var(--border-subtle);
}

.dm-row:hover { background: rgba(255,255,255,0.03); }
.dm-row:last-child { border-bottom: none; }

.dm-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--ai-deep), var(--ai-primary));
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 600;
  color: #f0ede8;
  flex-shrink: 0;
}

.dm-name { font-weight: 600; font-size: var(--text-sm); color: var(--text-primary); }
.dm-preview { font-size: var(--text-xs); color: var(--text-muted); margin-top: 2px; }
.dm-time { font-family: 'JetBrains Mono', monospace; font-size: var(--text-xs); color: var(--text-muted); }

/* Feed */
.post-card {
  padding: 1.5rem;
  margin-bottom: 1rem;
}

.post-header {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 1rem;
}

.post-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--ai-deep), var(--ai-primary));
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  font-weight: 600;
  color: #f0ede8;
  flex-shrink: 0;
}

.post-author { font-weight: 600; font-size: var(--text-sm); color: var(--text-primary); }
.post-time { font-size: var(--text-xs); color: var(--text-muted); font-family: 'JetBrains Mono', monospace; }

.post-content {
  font-size: var(--text-base);
  color: var(--text-secondary);
  line-height: 1.6;
  margin-bottom: 1rem;
}

/* Documents */
.doc-item {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.875rem 1rem;
  margin-bottom: 0.5rem;
  border-radius: var(--radius-md);
  transition: all var(--dur-fast);
  cursor: pointer;
}

.doc-item:hover { background: rgba(255,255,255,0.03); }

.doc-icon {
  width: 36px;
  height: 36px;
  border-radius: var(--radius-sm);
  background: var(--ai-glow);
  border: 1px solid var(--border-ai);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  flex-shrink: 0;
}

.doc-info { flex: 1; min-width: 0; }
.doc-name { font-weight: 600; font-size: var(--text-sm); color: var(--text-primary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.doc-meta { font-size: var(--text-xs); color: var(--text-muted); margin-top: 2px; }

/* Vault hub */
.vault-hub-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.85rem;
  margin: 1.1rem 0;
}

.vault-hub-card {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  min-height: 142px;
  padding: 1rem;
  text-align: left;
  color: var(--text-secondary);
  background: rgba(255,255,255,0.035);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  cursor: pointer;
  transition: border-color var(--dur-fast), transform var(--dur-fast), background var(--dur-fast);
}

.vault-hub-card:hover {
  transform: translateY(-1px);
  background: rgba(255,255,255,0.055);
  border-color: rgba(var(--metal-rgb), 0.28);
}

.vault-hub-card-active {
  background: linear-gradient(135deg, rgba(var(--metal-rgb), 0.1), rgba(255,255,255,0.035));
  border-color: rgba(var(--metal-rgb), 0.32);
}

.vault-hub-kicker {
  font-size: var(--text-xs);
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--gold-primary);
}

.vault-hub-card strong {
  color: var(--text-primary);
  font-size: var(--text-base);
}

.vault-hub-card span:last-child {
  color: var(--text-muted);
  font-size: var(--text-sm);
  line-height: 1.45;
}

.vault-trust-strip {
  display: flex;
  gap: 0.45rem;
  flex-wrap: wrap;
  padding: 0.65rem 0.75rem;
  background: rgba(0,0,0,0.18);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm);
}

.vault-trust-strip span {
  font-size: var(--text-xs);
  color: var(--text-muted);
  padding: 0.18rem 0.5rem;
  background: rgba(255,255,255,0.04);
  border-radius: var(--radius-pill);
}

.vault-legal-footer {
  display: flex;
  gap: 0.85rem;
  flex-wrap: wrap;
  justify-content: center;
  margin: 2rem 0 0;
  padding-top: 1rem;
  border-top: 1px solid var(--border-subtle);
}

.vault-legal-footer a {
  color: var(--text-muted);
  font-size: var(--text-xs);
  text-decoration: none;
}

.vault-legal-footer a:hover {
  color: var(--gold-primary);
}

/* Teach AP */
.teach-ap-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}

.teach-ap-header > div {
  min-width: 0;
}

.teach-ap-header-actions {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.teach-ap-session-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1rem;
  align-items: center;
  padding: 1.1rem;
  margin-bottom: 1rem;
  background: linear-gradient(135deg, rgba(var(--metal-rgb), 0.11), rgba(255,255,255,0.025));
  border: 1px solid rgba(var(--metal-rgb), 0.22);
  border-radius: var(--radius-md);
  box-shadow: 0 18px 48px rgba(0,0,0,0.22);
}

.teach-ap-kicker {
  font-size: var(--text-xs);
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--gold-primary);
  margin-bottom: 0.35rem;
}

.teach-ap-session-copy h3 {
  margin: 0 0 0.3rem;
  color: var(--text-primary);
  font-size: var(--text-lg);
}

.teach-ap-session-copy p {
  margin: 0;
  color: var(--text-muted);
  font-size: var(--text-sm);
  line-height: 1.55;
}

.teach-ap-session-actions {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.teach-ap-forever-card,
.teach-live-gaps-section {
  padding: 1rem;
  margin-bottom: 1rem;
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: var(--radius-md);
  background: rgba(255,255,255,0.035);
}

.teach-ap-forever-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1rem;
  align-items: center;
}

.teach-ap-forever-card h3 {
  margin: 0 0 0.35rem;
  color: var(--text-primary);
  font-size: var(--text-base);
}

.teach-ap-forever-card p {
  margin: 0;
  color: var(--text-muted);
  font-size: var(--text-sm);
  line-height: 1.55;
}

.teach-ap-forever-actions {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.teach-cat-heading-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  flex-wrap: wrap;
  margin-bottom: 0.75rem;
}

.teach-cat-heading-row .teach-cat-label {
  margin: 0;
}

.teach-gap-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 0.75rem;
}

.teach-gap-card {
  padding: 0.9rem;
  border: 1px solid rgba(var(--metal-rgb), 0.18);
  border-radius: var(--radius-sm);
  background: rgba(var(--metal-rgb), 0.055);
}

.teach-gap-card p {
  margin: 0 0 0.75rem;
  color: var(--text-secondary);
  font-size: var(--text-sm);
  line-height: 1.45;
}

.teach-gap-card-empty {
  background: rgba(255,255,255,0.035);
  border-color: rgba(255,255,255,0.08);
}

.teach-next-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1rem;
  align-items: center;
  margin: 1rem 0;
  padding: 1rem;
  border: 1px solid rgba(var(--metal-rgb), 0.24);
  border-radius: var(--radius-md);
  background: rgba(var(--metal-rgb), 0.07);
}

.teach-next-card h3 {
  margin: 0 0 0.35rem;
  color: var(--text-primary);
  font-size: var(--text-base);
}

.teach-next-card p {
  margin: 0;
  color: var(--text-muted);
  font-size: var(--text-sm);
  line-height: 1.5;
}

.teach-next-actions {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.teach-next-card-complete {
  border-color: rgba(39, 217, 133, 0.22);
  background: rgba(39, 217, 133, 0.055);
}

.teach-section {
  padding: 1.5rem;
  margin-bottom: 1rem;
}

.teach-prompt {
  font-size: var(--text-base);
  color: var(--text-secondary);
  line-height: 1.6;
  margin-bottom: 1rem;
  font-style: italic;
}

@media (max-width: 720px) {
  .vault-hub-grid {
    grid-template-columns: 1fr;
  }

  .teach-ap-header,
  .teach-ap-session-card,
  .teach-ap-forever-card,
  .teach-next-card {
    grid-template-columns: 1fr;
    flex-direction: column;
    align-items: stretch;
  }

  .teach-ap-header .btn,
  .teach-ap-session-actions .btn,
  .teach-ap-header-actions .btn,
  .teach-ap-forever-actions .btn,
  .teach-next-actions .btn,
  .teach-next-card > .btn {
    width: 100%;
  }

  .teach-ap-session-actions,
  .teach-ap-header-actions,
  .teach-ap-forever-actions,
  .teach-next-actions {
    justify-content: stretch;
  }
}

/* Guided Learn — editorial progression, not dashboard card density */
.learn-continue-hero,.learn-objective,.learn-path-main,.learn-path-aside>section,.learn-catalog-shell,.guided-learn-empty,.guided-learn-error { background:var(--surface-elevated); border:1px solid var(--border); border-radius:16px; }
.learn-editorial-kicker { color:var(--accent); font-size:0.68rem; font-weight:700; letter-spacing:0.13em; text-transform:uppercase; }
.learn-continue-hero { display:flex; align-items:flex-end; justify-content:space-between; gap:1.5rem; padding:1.5rem; margin-bottom:0.85rem; border-left:4px solid var(--accent); }
.learn-continue-hero h2,.learn-objective h2,.learn-editorial-heading h2,.learn-path-aside h2 { color:var(--text-primary); letter-spacing:-0.025em; }
.learn-continue-hero h2 { font-size:clamp(1.5rem,4vw,2.35rem); margin:0.25rem 0 0.4rem; }
.learn-continue-hero p,.learn-objective p,.learn-editorial-heading p { color:var(--text-secondary); margin:0; max-width:680px; line-height:1.5; }
.learn-continue-meta { display:flex; flex-wrap:wrap; gap:0.5rem; margin-top:0.7rem; color:var(--text-muted); font-size:0.72rem; text-transform:capitalize; }
.learn-sequence-progress,.guided-lesson-progress { height:5px; background:var(--surface); border-radius:999px; overflow:hidden; margin-top:0.8rem; }
.learn-sequence-progress span,.guided-lesson-progress span { display:block; height:100%; background:var(--accent); }
.learn-objective { padding:1.1rem 1.25rem; margin-bottom:0.85rem; }
.learn-objective h2 { font-size:1.15rem; margin:0.25rem 0; }
.learn-objective .btn { margin-top:0.7rem; }
.learn-path-layout { display:grid; grid-template-columns:minmax(0,2fr) minmax(260px,0.82fr); gap:0.85rem; align-items:start; }
.learn-path-main { padding:1.3rem; }
.learn-editorial-heading { display:flex; justify-content:space-between; gap:1rem; align-items:flex-start; padding-bottom:1rem; border-bottom:1px solid var(--border); }
.learn-editorial-heading h2 { margin:0.2rem 0; font-size:1.4rem; }
.learn-path-summary { text-align:right; flex-shrink:0; }
.learn-path-summary strong,.learn-path-summary span { display:block; }
.learn-path-summary strong { color:var(--accent); font:700 1.65rem var(--font-mono); }
.learn-path-summary span { color:var(--text-muted); font-size:0.68rem; }
.learn-roadmap { position:relative; padding:1rem 0 0 0.25rem; }
.learn-roadmap:before { content:""; position:absolute; left:20px; top:1.3rem; bottom:1rem; width:1px; background:var(--border); }
.learn-roadmap-module { position:relative; margin-bottom:1.25rem; }
.learn-roadmap-module>header { display:flex; gap:0.8rem; align-items:flex-start; margin-bottom:0.5rem; }
.learn-roadmap-module>header>span { display:grid; place-items:center; z-index:1; width:40px; height:40px; flex:0 0 40px; border:1px solid var(--border); background:var(--surface-elevated); border-radius:50%; color:var(--accent); font:700 0.72rem var(--font-mono); }
.learn-roadmap-module h3 { color:var(--text-primary); margin:0; font-size:1rem; }
.learn-roadmap-module p { color:var(--text-muted); margin:0.2rem 0; font-size:0.76rem; }
.learn-roadmap-lessons { margin-left:53px; }
.learn-roadmap-lesson { appearance:none; display:flex; align-items:center; gap:0.7rem; width:100%; background:none; border:0; border-top:1px solid var(--border); color:inherit; padding:0.75rem 0.2rem; text-align:left; cursor:pointer; }
.learn-roadmap-lesson:disabled { cursor:not-allowed; opacity:0.45; }
.learn-roadmap-marker { width:9px; height:9px; flex:0 0 9px; border:2px solid var(--text-muted); border-radius:50%; }
.learn-roadmap-lesson.current .learn-roadmap-marker { border-color:var(--accent); background:var(--accent); box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 15%,transparent); }
.learn-roadmap-lesson.completed .learn-roadmap-marker,.learn-roadmap-lesson.review .learn-roadmap-marker { border-color:#22c55e; background:#22c55e; }
.learn-roadmap-copy { flex:1; min-width:0; }
.learn-roadmap-copy strong,.learn-roadmap-copy small { display:block; }
.learn-roadmap-copy strong { color:var(--text-primary); font-size:0.86rem; }
.learn-roadmap-copy small,.learn-roadmap-state { color:var(--text-muted); font-size:0.66rem; text-transform:capitalize; }
.learn-path-aside { display:grid; gap:0.85rem; }
.learn-path-aside>section { padding:1rem; }
.learn-path-aside h2 { margin:0.2rem 0 0.65rem; font-size:1rem; }
.learn-gap-row,.learn-recent-row { appearance:none; display:flex; width:100%; gap:0.65rem; background:none; border:0; border-top:1px solid var(--border); color:inherit; padding:0.7rem 0; text-align:left; cursor:pointer; }
.learn-gap-severity { display:grid; place-items:center; width:28px; height:28px; flex:0 0 28px; border:1px solid var(--border); border-radius:50%; color:var(--accent); font:700 0.68rem var(--font-mono); }
.learn-gap-row strong,.learn-gap-row small,.learn-recent-row strong,.learn-recent-row span { display:block; }
.learn-gap-row strong,.learn-recent-row strong { color:var(--text-primary); font-size:0.8rem; }
.learn-gap-row small,.learn-recent-row span,.learn-muted-copy { color:var(--text-muted); font-size:0.7rem; line-height:1.4; }
.learn-recent-row { flex-direction:column; gap:0.2rem; }
.learn-catalog-shell { padding:1.25rem; }
.learn-catalog-filters { display:grid; grid-template-columns:minmax(220px,2fr) repeat(3,minmax(130px,1fr)); gap:0.55rem; margin:1rem 0; }
.learn-catalog-list { border-top:1px solid var(--border); }
.learn-catalog-row { appearance:none; display:grid; grid-template-columns:38px minmax(0,1fr) 100px; gap:0.8rem; width:100%; background:none; border:0; border-bottom:1px solid var(--border); color:inherit; padding:0.9rem 0.25rem; text-align:left; cursor:pointer; }
.learn-catalog-index { color:var(--accent); font:700 0.72rem var(--font-mono); }
.learn-catalog-copy strong,.learn-catalog-copy small,.learn-catalog-copy i { display:block; }
.learn-catalog-copy strong { color:var(--text-primary); }
.learn-catalog-copy small { color:var(--text-secondary); font-size:0.75rem; margin:0.2rem 0; }
.learn-catalog-copy i,.learn-catalog-meta { color:var(--text-muted); font-size:0.66rem; font-style:normal; line-height:1.45; text-transform:capitalize; }
.learn-catalog-meta { text-align:right; }
.guided-learn-empty,.guided-learn-error { padding:2rem; text-align:center; }
.guided-learn-empty h2,.guided-learn-empty strong,.guided-learn-error strong { color:var(--text-primary); }
.guided-learn-empty p,.guided-learn-error p { color:var(--text-secondary); max-width:560px; margin:0.5rem auto 1rem; }
.guided-lesson-modal { overflow-y:auto; background:var(--bg-primary); z-index:10060; }
.guided-lesson-shell { max-width:920px; margin:0 auto; padding:0.8rem 1rem 6rem; }
.guided-lesson-header { display:grid; grid-template-columns:100px minmax(0,1fr) 100px; gap:0.8rem; align-items:center; }
.guided-lesson-header>div { text-align:center; min-width:0; }
.guided-lesson-header span,.guided-lesson-header strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.guided-lesson-header span { color:var(--text-muted); font-size:0.65rem; text-transform:uppercase; letter-spacing:0.08em; }
.guided-lesson-header strong { color:var(--text-primary); font-size:0.85rem; }
.guided-lesson-progress { margin:0.65rem 0 1.5rem; }
.guided-reading-pane { max-width:720px; margin:0 auto; }
.guided-reading-meta { display:flex; align-items:center; gap:0.7rem; color:var(--text-muted); font-size:0.7rem; margin-bottom:1.4rem; }
.learn-audio-button { margin-left:auto; appearance:none; border:1px solid var(--border); border-radius:999px; background:none; color:var(--text-secondary); padding:0.3rem 0.6rem; cursor:pointer; }
.guided-reading-pane h1 { color:var(--text-primary); font-size:clamp(1.75rem,5vw,3rem); line-height:1.08; letter-spacing:-0.04em; margin:0.35rem 0 1rem; }
.guided-reading-body { color:var(--text-primary); font-size:clamp(1rem,2vw,1.12rem); line-height:1.75; max-width:68ch; }
.guided-example,.guided-activity { margin:1.4rem 0; padding:1rem 1.1rem; border-left:3px solid var(--accent); background:var(--surface-elevated); }
.guided-activity { border-left-color:var(--gold); }
.guided-example strong,.guided-activity strong { color:var(--text-primary); }
.guided-example p,.guided-activity p { color:var(--text-secondary); line-height:1.55; margin:0.35rem 0 0; }
.guided-notes,.guided-checkpoint { margin:1.5rem 0; padding-top:1.2rem; border-top:1px solid var(--border); }
.guided-notes label { display:block; color:var(--text-primary); font-weight:700; margin-bottom:0.5rem; }
.guided-notes .btn { margin-top:0.5rem; }
.guided-checkpoint h2 { color:var(--text-primary); font-size:1.1rem; }
.guided-checkpoint>button { appearance:none; display:block; width:100%; margin:0.45rem 0; padding:0.75rem; border:1px solid var(--border); border-radius:10px; background:var(--surface-elevated); color:var(--text-primary); text-align:left; cursor:pointer; }
#guided-checkpoint-result .correct { color:#22c55e; }
#guided-checkpoint-result .incorrect { color:#f59e0b; }
.guided-lesson-controls { position:fixed; bottom:0; left:0; right:0; display:flex; justify-content:center; gap:0.6rem; padding:0.8rem; background:var(--surface-elevated); border-top:1px solid var(--border); }
.family-lesson-share-modal { display:grid; place-items:center; padding:1rem; background:rgba(4,4,9,.82); backdrop-filter:blur(14px); z-index:10020; }
.family-lesson-share-card { width:min(520px,100%); padding:1.35rem; border:1px solid rgba(var(--metal-rgb),.34); border-radius:22px; background:var(--surface-elevated); box-shadow:0 24px 80px rgba(0,0,0,.42); }
.family-lesson-share-card h2 { margin:.35rem 0 .5rem; color:var(--text-primary); }
.family-lesson-share-card p,.family-lesson-share-card label { color:var(--text-muted); }
.family-lesson-share-card label { display:grid; gap:.4rem; margin:1rem 0; font-size:.78rem; font-weight:700; }
.family-lesson-share-actions { display:flex; justify-content:flex-end; gap:.55rem; flex-wrap:wrap; }

@media (max-width: 760px) {
  .learn-continue-hero,.learn-editorial-heading { flex-direction:column; align-items:flex-start; }
  .learn-path-layout { grid-template-columns:1fr; }
  .learn-path-summary { text-align:left; }
  .learn-catalog-filters { grid-template-columns:1fr 1fr; }
  .learn-catalog-filters input { grid-column:1/-1; }
  .guided-lesson-header { grid-template-columns:72px minmax(0,1fr) 72px; }
  .learn-catalog-row { grid-template-columns:30px minmax(0,1fr); }
  .learn-catalog-meta { grid-column:2; text-align:left; }
}

/* Privacy vault */
.privacy-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 0;
  border-bottom: 1px solid var(--border-subtle);
}

.privacy-item:last-child { border-bottom: none; }

.privacy-label { font-size: var(--text-sm); font-weight: 600; color: var(--text-primary); }
.privacy-value { font-size: var(--text-sm); color: var(--text-muted); }

.profile-blueprint-card {
  border: 1px solid rgba(var(--metal-rgb), 0.22);
  background:
    linear-gradient(135deg, rgba(var(--metal-rgb), 0.1), rgba(255, 255, 255, 0.025)),
    rgba(12, 12, 14, 0.78);
  border-radius: var(--radius-lg);
  padding: 1.25rem;
  margin: 1rem 0;
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.22);
}

/* Profile: social identity header + personal command center */
.profile-command-page {
  width: calc(100% - var(--sidebar-expanded));
  margin-left: var(--sidebar-expanded);
  margin-right: 0;
  box-sizing: border-box;
}

.profile-command-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(300px, 0.92fr);
  gap: 1rem;
  align-items: start;
  width: 100%;
  max-width: 1180px;
  margin-inline: auto;
}

.profile-command-grid > .profile-social-header,
.profile-command-grid > .profile-command-tabs,
.profile-command-grid > .profile-quick-actions,
.profile-command-grid > #privacy-section {
  grid-column: 1 / -1;
}

.profile-social-header {
  position: relative;
  min-height: 310px;
  display: grid;
  grid-template-columns: 132px minmax(0, 1fr) auto auto;
  gap: 0.75rem;
  align-items: end;
  padding: 154px 1.5rem 1.5rem;
  overflow: hidden;
  border: 1px solid var(--border-glass);
  border-radius: 22px;
  background: var(--bg-surface);
  box-shadow: 0 24px 70px rgba(0,0,0,0.28);
}

.profile-cover-art {
  position: absolute;
  inset: 0 0 auto;
  height: 138px;
  overflow: hidden;
  border-bottom: 1px solid rgba(var(--metal-rgb), 0.2);
  background:
    radial-gradient(circle at 18% 20%, rgba(var(--metal-rgb), 0.25), transparent 30%),
    radial-gradient(circle at 78% 24%, rgba(116, 92, 210, 0.24), transparent 34%),
    linear-gradient(120deg, #10101a, #171225 52%, #0a0a11);
}

.profile-cover-art::before {
  content: '';
  position: absolute;
  width: 300px;
  height: 300px;
  right: 7%;
  top: -212px;
  transform: rotate(45deg);
  border: 1px solid rgba(var(--metal-rgb), 0.3);
  box-shadow: 0 0 70px rgba(var(--metal-rgb), 0.1);
}

.profile-cover-art span {
  position: absolute;
  right: 1.4rem;
  bottom: 0.8rem;
  color: rgba(var(--metal-rgb), 0.42);
  font: 700 0.65rem/1 'JetBrains Mono', monospace;
  letter-spacing: 0.2em;
}

.profile-social-header .profile-avatar-wrap {
  position: relative;
  z-index: 2;
  width: 120px;
  height: 120px;
  align-self: start;
  margin-top: -48px;
}

.profile-social-header .profile-avatar,
.profile-social-header .profile-avatar-lg {
  width: 120px;
  height: 120px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  border: 4px solid var(--bg-surface);
  outline: 1px solid rgba(var(--metal-rgb), 0.42);
  background: linear-gradient(135deg, var(--ai-deep), var(--ai-primary));
  color: #fff;
  font-size: 2rem;
  font-weight: 800;
  object-fit: cover;
}

.profile-photo-edit {
  position: absolute;
  right: -3px;
  bottom: 4px;
  min-width: 50px;
  height: 30px;
  padding: 0 0.55rem;
  border: 1px solid rgba(var(--metal-rgb), 0.42);
  border-radius: 999px;
  background: var(--bg-elevated);
  color: var(--gold-bright);
  font: 700 0.65rem/1 'JetBrains Mono', monospace;
  cursor: pointer;
  box-shadow: 0 6px 20px rgba(0,0,0,0.35);
}

.profile-photo-edit:hover { border-color: var(--gold-bright); }
.profile-social-header .profile-identity { min-width: 0; z-index: 1; }
.profile-social-header .profile-name { margin: 0; color: var(--text-primary); font-size: clamp(1.55rem, 3vw, 2.35rem); letter-spacing: -0.035em; }
.profile-social-header .profile-username { margin-top: 0.15rem; color: var(--gold-primary); font: 600 0.78rem/1.3 'JetBrains Mono', monospace; }
.profile-social-header .profile-bio { max-width: 660px; margin: 0.65rem 0 0; color: var(--text-secondary); font-size: 0.9rem; line-height: 1.55; }
.profile-social-meta { display: flex; flex-wrap: wrap; gap: 0.45rem 0.9rem; margin-top: 0.65rem; color: var(--text-muted); font-size: 0.72rem; }
.profile-social-meta span:not(:first-child)::before { content: '•'; margin-right: 0.9rem; color: rgba(var(--metal-rgb), 0.65); }

.profile-command-tabs {
  display: flex;
  gap: 0.35rem;
  padding: 0.35rem;
  margin-bottom: 0.15rem;
  border: 1px solid var(--border-glass);
  border-radius: 14px;
  background: rgba(255,255,255,0.025);
}

.profile-command-tab {
  min-height: 42px;
  padding: 0 1.15rem;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--text-muted);
  font: 700 0.78rem/1 'Inter', sans-serif;
  cursor: pointer;
}

.profile-command-tab:hover { color: var(--text-primary); background: rgba(255,255,255,0.04); }
.profile-command-tab.active { color: var(--gold-bright); background: rgba(var(--metal-rgb), 0.12); box-shadow: inset 0 0 0 1px rgba(var(--metal-rgb), 0.22); }

.profile-command-grid > .profile-section,
.profile-command-grid > .profile-stats-row {
  margin: 0;
}

.profile-quick-actions {
  padding: 0.9rem 1rem;
  border: 1px solid var(--border-subtle);
  border-radius: 14px;
  background: rgba(255,255,255,0.02);
}

.profile-blueprint-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}

.profile-kicker {
  color: var(--gold-primary, var(--gold-primary));
  font-size: var(--text-xs);
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 0.35rem;
}

.profile-blueprint-top h2 {
  margin: 0;
  color: var(--text-primary);
  font-size: var(--text-xl);
}

.profile-blueprint-top p {
  max-width: 48rem;
  margin: 0.35rem 0 0;
  color: var(--text-secondary);
  font-size: var(--text-sm);
  line-height: 1.55;
}

.profile-completion-ring {
  width: 5.4rem;
  min-width: 5.4rem;
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  text-align: center;
  border-radius: 50%;
  border: 1px solid rgba(var(--metal-rgb), 0.45);
  background: rgba(var(--metal-rgb), 0.09);
}

.profile-completion-ring strong {
  display: block;
  color: var(--gold-primary, var(--gold-primary));
  font-size: var(--text-lg);
}

.profile-completion-ring span {
  display: block;
  margin-top: -0.7rem;
  color: var(--text-muted);
  font-size: var(--text-xs);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.profile-blueprint-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
}

.profile-blueprint-item {
  min-width: 0;
  padding: 0.85rem;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: var(--radius-md);
  background: rgba(255, 255, 255, 0.035);
}

.profile-blueprint-item span,
.profile-future-self span {
  display: block;
  color: var(--text-muted);
  font-size: var(--text-xs);
  font-weight: 800;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  margin-bottom: 0.25rem;
}

.profile-blueprint-item strong {
  display: block;
  color: var(--text-primary);
  font-size: var(--text-sm);
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.profile-future-self {
  margin-top: 0.85rem;
  padding-top: 0.85rem;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.profile-future-self p {
  margin: 0;
  color: var(--text-secondary);
  font-size: var(--text-sm);
  line-height: 1.6;
}

.profile-blueprint-actions {
  display: flex;
  gap: 0.55rem;
  flex-wrap: wrap;
  margin-top: 0.95rem;
}

.profile-missing-note {
  margin-top: 0.8rem;
  color: var(--text-muted);
  font-size: var(--text-xs);
}

.profile-edit-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.85rem;
  margin-bottom: 1rem;
}

.profile-edit-field {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  min-width: 0;
}

.profile-edit-field span {
  font-size: var(--text-xs);
  font-weight: 800;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--text-muted);
}

.profile-edit-field-wide {
  grid-column: 1 / -1;
}

@media (max-width: 720px) {
  .profile-command-grid { grid-template-columns: 1fr; }
  .profile-command-grid > * { grid-column: 1 !important; }
  .profile-social-header {
    grid-template-columns: 92px minmax(0, 1fr);
    padding: 126px 1rem 1rem;
    min-height: 300px;
  }
  .profile-cover-art { height: 112px; }
  .profile-social-header .profile-avatar-wrap,
  .profile-social-header .profile-avatar,
  .profile-social-header .profile-avatar-lg { width: 88px; height: 88px; }
  .profile-social-header .profile-avatar-wrap { margin-top: -34px; }
  .profile-social-header > .btn { grid-column: auto; width: 100%; }
  .profile-command-tabs { position: sticky; top: calc(var(--topbar-height) + 4px); z-index: 20; backdrop-filter: blur(18px); }
  .profile-command-tab { flex: 1; padding-inline: 0.4rem; }
  .profile-social-meta span:not(:first-child)::before { display: none; }

  .profile-blueprint-top {
    flex-direction: column;
  }

  .profile-completion-ring {
    width: 4.7rem;
    min-width: 4.7rem;
  }

  .profile-blueprint-grid {
    grid-template-columns: 1fr;
  }

  .profile-blueprint-actions .btn {
    width: 100%;
  }

  .profile-edit-grid {
    grid-template-columns: 1fr;
  }
}

/* Announcement banner */
.announcement-card {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 1rem 1.25rem;
  background: rgba(var(--metal-rgb), 0.05);
  border: 1px solid rgba(var(--metal-rgb), 0.15);
  border-radius: var(--radius-md);
  margin-bottom: 1rem;
  animation: fadeUp var(--dur-slow) var(--ease-out-expo);
}

.announcement-icon { font-size: 18px; flex-shrink: 0; }
.announcement-body { flex: 1; }
.announcement-title { font-weight: 700; font-size: var(--text-sm); color: var(--text-primary); margin-bottom: 0.2rem; }
.announcement-content { font-size: var(--text-sm); color: var(--text-muted); }
.announcement-dismiss {
  background: none;
  border: none;
  color: var(--text-muted);
  cursor: pointer;
  padding: 0.25rem;
  font-size: 14px;
  border-radius: 4px;
  transition: all var(--dur-fast);
}

.announcement-dismiss:hover { color: var(--text-primary); background: rgba(255,255,255,0.05); }

/* API Discovery Card */
.api-discovery-card {
  padding: 1rem 1.25rem;
  background: rgba(100,60,200,0.04);
  border: 1px solid rgba(100,60,200,0.15);
  border-radius: var(--radius-md);
  margin-bottom: 1rem;
  animation: fadeUp var(--dur-slow) var(--ease-out-expo);
}
.ad-card-header { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 0.85rem; }
.ad-card-icon { font-size: 20px; flex-shrink: 0; }
.ad-card-title { font-weight: 700; font-size: var(--text-base); color: var(--text-primary); }
.ad-card-subtitle { font-size: var(--text-xs); color: var(--text-muted); margin-top: 0.1rem; }
.ad-category-pills { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-bottom: 0.75rem; }
.ad-cat-pill {
  background: rgba(100,60,200,0.1);
  border: 1px solid rgba(100,60,200,0.2);
  color: var(--text-secondary);
  padding: 0.2rem 0.6rem;
  border-radius: 20px;
  font-size: var(--text-xs);
  cursor: pointer;
  transition: all var(--dur-fast);
}
.ad-cat-pill:hover { background: rgba(100,60,200,0.2); color: var(--text-primary); }
.ad-cat-pill.active { background: rgba(100,60,200,0.25); border-color: rgba(100,60,200,0.5); color: #a78bfa; }
.ad-api-list { display: flex; flex-direction: column; gap: 0.5rem; }
.ad-api-item { padding: 0.6rem 0.75rem; background: rgba(255,255,255,0.03); border-radius: 8px; border: 1px solid rgba(255,255,255,0.06); }
.ad-api-name { font-weight: 600; font-size: var(--text-sm); color: var(--text-primary); margin-bottom: 0.15rem; }
.ad-api-desc { font-size: var(--text-xs); color: var(--text-muted); line-height: 1.4; margin-bottom: 0.35rem; }
.ad-api-meta, .ad-meta { display: flex; gap: 0.35rem; flex-wrap: wrap; }
.ad-badge { font-size: 10px; padding: 0.1rem 0.4rem; border-radius: 4px; font-weight: 600; }
.ad-badge-green { background: rgba(16,185,129,0.15); color: #6ee7b7; }
.ad-badge-yellow { background: rgba(245,158,11,0.15); color: #fcd34d; }
.ad-badge-gray { background: rgba(255,255,255,0.07); color: var(--text-muted); }
.ad-loading, .ad-empty { font-size: var(--text-xs); color: var(--text-muted); padding: 0.5rem 0; text-align: center; }

/* Streak milestone banner */
.streak-milestone-banner {
  display: flex;
  align-items: center;
  padding: 0.75rem 1rem;
  border-radius: var(--radius-md);
  margin: 0.75rem 0;
  font-size: var(--text-sm);
  font-weight: 600;
}

.streak-milestone-banner.tier-1 {
  background: rgba(var(--metal-rgb), 0.08);
  border: 1px solid rgba(var(--metal-rgb), 0.2);
  color: var(--gold-bright);
}

.streak-milestone-banner.tier-2 {
  background: rgba(var(--metal-rgb), 0.12);
  border: 1px solid rgba(var(--metal-rgb), 0.3);
  color: var(--gold-bright);
}

/* Ref invite banner */
.ref-invite-banner {
  background: rgba(var(--metal-rgb), 0.08);
  border: 1px solid rgba(var(--metal-rgb), 0.2);
  border-radius: var(--radius-md);
  padding: 0.75rem 1rem;
  font-size: var(--text-sm);
  color: var(--text-secondary);
  margin-bottom: 1.25rem;
  text-align: center;
}

/* Founder badge */
.nav-founder-badge, .nav-mobile-founder-badge {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 0.2rem 0.6rem;
  background: rgba(var(--metal-rgb), 0.12);
  border: 1px solid rgba(var(--metal-rgb), 0.3);
  border-radius: var(--radius-pill);
  font-size: var(--text-xs);
  font-weight: 700;
  color: var(--gold-primary);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  white-space: nowrap;
  flex-shrink: 0;
}

/* User badge — interactive XP panel trigger */
.user-badge {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.35rem 0.75rem;
  background: rgba(255,255,255,0.04);
  border: 1px solid var(--border-glass);
  border-radius: var(--radius-pill);
  font-size: var(--text-xs);
  font-weight: 600;
  color: var(--text-secondary);
  flex-shrink: 0;
  white-space: nowrap;
  cursor: pointer;
  transition: background var(--dur-fast), border-color var(--dur-fast), box-shadow var(--dur-fast);
}

.user-badge:hover {
  background: rgba(var(--metal-rgb), 0.08);
  border-color: rgba(var(--metal-rgb), 0.25);
  box-shadow: 0 0 12px rgba(var(--metal-rgb), 0.1);
}

.user-badge:active {
  transform: scale(0.97);
}

.user-badge .level {
  background: var(--gold-gradient);
  color: #07070d;
  padding: 0.1rem 0.45rem;
  border-radius: var(--radius-pill);
  font-family: 'JetBrains Mono', monospace;
  font-size: var(--text-xs);
  font-weight: 700;
}

.user-badge-maxed {
  background: rgba(var(--metal-rgb), 0.1);
  border: 1px solid rgba(var(--metal-rgb), 0.3);
  box-shadow: 0 0 16px rgba(var(--metal-rgb), 0.15);
}

/* Scrollbar */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.1); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,0.15); }

/* Modal overlay */
.modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.6);
  backdrop-filter: blur(4px);
  z-index: var(--z-modal);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
  animation: fadeIn var(--dur-fast);
}

.modal-content {
  background: var(--bg-surface);
  border: 1px solid var(--border-glass);
  border-radius: var(--radius-xl);
  max-width: 560px;
  width: 100%;
  max-height: 90vh;
  overflow-y: auto;
  padding: 2rem;
  animation: fadeUp var(--dur-slow) var(--ease-out-expo);
  box-shadow: 0 30px 80px rgba(0,0,0,0.6);
}

.modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1.25rem;
}
.modal-title {
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--text-primary);
}
.modal-close {
  background: none;
  border: none;
  color: var(--text-muted);
  font-size: 1.5rem;
  cursor: pointer;
  padding: 0.25rem 0.5rem;
  line-height: 1;
  transition: color var(--dur-fast);
}
.modal-close:hover { color: var(--text-primary); }
.modal-body { color: var(--text-secondary); }
.modal-overlay {
  opacity: 0;
  transition: opacity var(--dur-normal);
}
.modal-overlay.visible { opacity: 1; }

/* Evolution report */
.ev-report-card {
  padding: 1.5rem;
  margin-bottom: 0.75rem;
  cursor: pointer;
  transition: all var(--dur-normal);
}

.ev-report-card:hover {
  border-color: rgba(var(--metal-rgb), 0.2);
}

.ev-header-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.75rem;
}

.ev-week-label {
  font-family: 'Syne', sans-serif;
  font-size: var(--text-base);
  font-weight: 700;
  color: var(--text-primary);
}

.ev-date-label {
  font-family: 'JetBrains Mono', monospace;
  font-size: var(--text-xs);
  color: var(--text-muted);
}

.ev-stats-row {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  margin-bottom: 0.75rem;
}

.ev-stat {
  padding: 0.5rem 0.75rem;
  background: rgba(255,255,255,0.03);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  min-width: 65px;
  text-align: center;
}

.ev-stat-value {
  font-family: 'JetBrains Mono', monospace;
  font-size: var(--text-lg);
  font-weight: 700;
  color: var(--text-primary);
  letter-spacing: -0.03em;
}

.ev-stat-label {
  font-size: var(--text-xs);
  color: var(--text-muted);
  margin-top: 0.15rem;
}

.ev-preview-text {
  font-size: var(--text-sm);
  color: var(--text-muted);
  line-height: 1.5;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Evolution modal */
.ev-modal {
  background: var(--bg-elevated);
  border: 1px solid var(--border-glass);
  border-radius: var(--radius-xl);
  max-width: 600px;
  width: 100%;
  max-height: 90vh;
  overflow-y: auto;
  padding: 2rem;
}

.ev-modal-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 1.25rem;
}

.ev-modal-week { font-size: var(--text-base); font-weight: 700; color: var(--text-primary); }
.ev-modal-date { font-size: var(--text-xs); color: var(--text-muted); margin-top: 0.2rem; }

.ev-modal-close {
  background: none;
  border: none;
  color: var(--text-muted);
  font-size: 1.1rem;
  cursor: pointer;
  padding: 0.25rem;
  border-radius: 4px;
  transition: all var(--dur-fast);
}

.ev-modal-close:hover { color: var(--text-primary); }

.ev-id-grid {
  display: flex;
  gap: 0.5rem;
  margin-bottom: 1.25rem;
  flex-wrap: wrap;
}

/* EV identity dimension pill */
.ev-id-pill {
  padding: 0.35rem 0.75rem;
  border-radius: var(--radius-pill);
  font-size: var(--text-xs);
  font-weight: 600;
}

.ev-id-pill.starter { background: rgba(255,255,255,0.04); color: var(--text-muted); border: 1px solid var(--border-subtle); }
.ev-id-pill.active  { background: rgba(var(--metal-rgb), 0.1); color: var(--gold-primary); border: 1px solid rgba(var(--metal-rgb), 0.2); }
.ev-id-pill.vision  { background: rgba(123,104,238,0.1); color: var(--ai-bright); border: 1px solid rgba(123,104,238,0.2); }

/* Evolution past items */
.ev-past-item {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.875rem 1rem;
  margin-bottom: 0.5rem;
  border-radius: var(--radius-md);
  background: rgba(255,255,255,0.02);
  border: 1px solid var(--border-subtle);
}

.ev-past-week { font-family: 'JetBrains Mono', monospace; font-size: var(--text-xs); color: var(--text-muted); flex-shrink: 0; }
.ev-past-text { font-size: var(--text-sm); color: var(--text-secondary); flex: 1; }
.ev-past-link { font-size: var(--text-xs); color: var(--gold-primary); font-weight: 600; }

/* ═══════════════════════════════════════════════════════════
   RESPONSIVE — TABLET (≤900px) / MOBILE (≤640px)
   ═══════════════════════════════════════════════════════════ */

@media (max-width: 900px) {
  .lux-sidebar { display: none; }
  .lux-topbar { left: 0; }
  .app-content {
    margin-left: 0;
    width: 100%;
    padding: 1.5rem 1.25rem;
    padding-bottom: calc(var(--ap-terminal-clearance) + env(safe-area-inset-bottom, 0px));
  }
  .mobile-dock { display: block; }

  .topbar-context-value { display: none; }
  .topbar-context-label { display: none; }
  .topbar-hamburger { display: flex; }
  .topbar-product-logo { width: 44px; height: 44px; border-radius: 8px; }
}

/* ═══════════════════════════════════════════════════════════
   MOBILE HIGH-DPI / RETINA CRISPNESS FIXES
   Reduces blur, adds GPU compositing, tightens spacing
   Target: 375px (iPhone SE) through 639px
   ═══════════════════════════════════════════════════════════ */

@media (max-width: 640px) {
  .app-content {
    padding: 1.25rem 1rem;
    padding-bottom: calc(var(--ap-terminal-clearance) + env(safe-area-inset-bottom, 0px));
  }

  .greeting-name {
    font-size: var(--text-2xl);
  }

  .state-zones {
    grid-template-columns: 1fr;
  }

  .module-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .auth-page {
    padding: 1rem;
    align-items: flex-start;
    padding-top: 3rem;
  }

  .auth-card {
    padding: 1.75rem 1.5rem;
  }

  .founder-kpi-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .dock-btn-label { display: none; }
  .dock-btn { min-width: 44px; }
  .dock-inner { max-width: 100%; }

  .onboarding-page { padding: 2rem 1rem; }

  /* ── Glass surfaces: reduce blur for iOS Safari performance ── */
  .glass-card {
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-radius: var(--radius-md);
  }

  .glass-card-elevated {
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    border-radius: var(--radius-lg);
  }

  .glass-surface {
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-radius: var(--radius-sm);
  }

  /* ── Grain texture: lighter on mobile to avoid subpixel muddiness ── */
  body::before {
    background-size: 160px 160px;
  }

  /* ── AI orb: ensure GPU compositing is active on mobile ── */
  .dock-ai-orb {
    transform: translateZ(0);
    will-change: transform;
  }

  /* ── Glass card shadows: less elaborate on mobile ── */
  .glass-card {
    box-shadow: 0 0 0 1px rgba(0,0,0,0.3),
                0 12px 40px rgba(0, 0, 0, 0.4),
                0 0 20px rgba(var(--metal-rgb), 0.04);
  }

  .glass-card-elevated {
    box-shadow: 0 0 20px rgba(var(--metal-rgb), 0.04),
                0 20px 50px rgba(0, 0, 0, 0.45);
  }

  /* ── Icon/button elements: GPU-composited for sharp edges ── */
  .dock-btn,
  .founder-kpi-card,
  .module-card,
  .quest-card,
  .state-zone {
    transform: translateZ(0);
    will-change: transform;
  }

  /* ── Smooth scroll on mobile ── */
  * { -webkit-overflow-scrolling: touch; }

  /* ── Subpixel text fix: ensure small text stays crisp ── */
  .mono, code, pre {
    font-smooth: always;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }

  /* ── iPhone SE specific (≤375px): further reduce complexity ── */
  @media (max-width: 375px) {
    .glass-card {
      backdrop-filter: blur(10px);
      -webkit-backdrop-filter: blur(10px);
    }

    .glass-card-elevated {
      backdrop-filter: blur(14px);
      -webkit-backdrop-filter: blur(14px);
    }

    .app-content {
      padding: 1rem 0.875rem;
      padding-bottom: calc(var(--ap-terminal-clearance) + env(safe-area-inset-bottom, 0px));
    }

    .state-zone { padding: 1.25rem; }

    .founder-kpi-grid {
      grid-template-columns: 1fr 1fr;
      gap: 0.5rem;
    }
  }
}

/* ═══════════════════════════════════════════════════════════
   UTILITY CLASSES
   ═══════════════════════════════════════════════════════════ */

.container {
  max-width: 800px;
  margin: 0 auto;
}

.text-gold { color: var(--gold-primary); }
.text-muted { color: var(--text-muted); }
.text-ai { color: var(--ai-primary); }

.mt-1 { margin-top: 0.25rem; }
.mt-2 { margin-top: 0.5rem; }
.mt-4 { margin-top: 1rem; }
.mb-2 { margin-bottom: 0.5rem; }
.mb-4 { margin-bottom: 1rem; }
.mb-6 { margin-bottom: 1.5rem; }
.mb-8 { margin-bottom: 2rem; }

.flex { display: flex; }
.flex-col { flex-direction: column; }
.items-center { align-items: center; }
.justify-between { justify-content: space-between; }
.gap-2 { gap: 0.5rem; }
.gap-4 { gap: 1rem; }

.w-full { width: 100%; }

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
}

/* Fade animations applied via JS */
.fade-in {
  animation: fadeIn var(--dur-slow) var(--ease-out-expo);
}

.slide-in {
  animation: slideInLeft var(--dur-slow) var(--ease-out-expo);
}

/* ── Workout Mode ──────────────────────────────────────────────────────────── */
.workout-gate { display:flex; gap:0.75rem; padding:1rem; border-radius:12px; margin-bottom:1rem; align-items:center; }
.gate-green { background:rgba(34,197,94,0.1); border:1px solid rgba(34,197,94,0.25); }
.gate-amber { background:rgba(251,191,36,0.1); border:1px solid rgba(251,191,36,0.25); }
.workout-gate-icon { font-size:1.5rem; flex-shrink:0; }
.gate-green .workout-gate-icon { color:#22c55e; }
.gate-amber .workout-gate-icon { color:#fbbf24; }
.workout-gate-label { font-weight:600; color:var(--gold); font-size:0.95rem; }
.workout-gate-detail { font-size:0.82rem; color:var(--text-secondary); margin-top:2px; }
.workout-biometrics { display:flex; gap:0.75rem; margin-top:0.4rem; font-size:0.78rem; color:var(--text-secondary); font-family:var(--font-mono); }
.workout-gate-warn { font-size:0.82rem; color:#fbbf24; text-align:center; margin:0.5rem 0 1rem; }
.workout-start-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0.65rem; margin:0.75rem 0; }
.workout-start-actions .btn-block { width:100%; margin-top:0; }
.workout-start-btn { font-size:1.1rem!important; padding:1rem!important; letter-spacing:0.04em; }
.workout-stats-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:0.75rem; margin:1.25rem 0; }
.workout-stat-card { background:var(--surface-elevated); border:1px solid var(--border); border-radius:12px; padding:1rem; text-align:center; }
.workout-stat-value { font-size:1.5rem; font-weight:700; color:var(--gold); font-family:var(--font-mono); }
.workout-stat-label { font-size:0.75rem; color:var(--text-secondary); margin-top:0.25rem; text-transform:uppercase; letter-spacing:0.06em; }
.pr-list { display:flex; flex-direction:column; gap:0.4rem; }
.pr-item { display:flex; align-items:center; gap:0.5rem; padding:0.4rem 0; font-size:0.88rem; }
.pr-badge { background:linear-gradient(135deg,var(--gold-primary),var(--gold-bright)); color:#0a0a0a; font-size:0.65rem; font-weight:700; padding:2px 6px; border-radius:4px; }
.pr-exercise { flex:1; color:var(--text-primary); }
.pr-value { font-family:var(--font-mono); color:var(--gold); font-weight:600; }
.goal-item { margin-bottom:0.75rem; }
.goal-info { display:flex; justify-content:space-between; font-size:0.88rem; margin-bottom:0.3rem; }
.goal-type { color:var(--text-primary); text-transform:capitalize; }
.goal-progress { font-family:var(--font-mono); color:var(--text-secondary); }
.workout-goal-form { display:flex; gap:0.5rem; align-items:flex-end; flex-wrap:wrap; }
.workout-goal-form .form-select, .workout-goal-form .form-input { flex:1; min-width:100px; }
.history-item { padding:0.6rem 0; border-bottom:1px solid var(--border); display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:0.25rem; }
.history-meta { display:flex; gap:0.5rem; align-items:center; }
.history-type { font-weight:600; color:var(--text-primary); font-size:0.88rem; text-transform:capitalize; }
.history-date { font-size:0.78rem; color:var(--text-secondary); }
.history-stats { display:flex; gap:0.6rem; font-size:0.78rem; color:var(--text-secondary); font-family:var(--font-mono); }
.history-status { font-size:0.7rem; text-transform:uppercase; padding:1px 5px; border-radius:3px; }
.status-completed { background:rgba(34,197,94,0.15); color:#22c55e; }
.status-cancelled { background:rgba(239,68,68,0.15); color:#ef4444; }
.status-active { background:rgba(var(--metal-rgb), 0.15); color:var(--gold); }

/* Active workout */
.active-workout { padding-bottom:2rem; }
.workout-header-active { text-align:center; margin-bottom:1.25rem; }
.workout-timer { font-size:2.5rem; font-weight:700; font-family:var(--font-mono); color:var(--gold); letter-spacing:0.05em; }
.workout-intensity { font-size:0.82rem; color:var(--text-secondary); text-transform:capitalize; }
.workout-gate-inline { font-size:0.78rem; color:#fbbf24; margin-top:0.25rem; }
.rest-timer-bar { background:rgba(59,130,246,0.12); border:1px solid rgba(59,130,246,0.3); border-radius:10px; padding:0.6rem 1rem; display:flex; align-items:center; gap:0.75rem; margin-bottom:1rem; }
.rest-timer-label { font-size:0.78rem; color:#60a5fa; text-transform:uppercase; letter-spacing:0.06em; }
.rest-timer-value { font-size:1.3rem; font-weight:700; font-family:var(--font-mono); color:#93c5fd; flex:1; }
.set-log-section { background:var(--surface-elevated); border:1px solid var(--border); border-radius:12px; padding:1rem; margin-bottom:1rem; }
.set-log-section h3 { margin:0 0 0.75rem; font-size:0.95rem; }
.set-exercise-row { margin-bottom:0.6rem; }
.set-inputs-row { display:grid; grid-template-columns:repeat(3,1fr); gap:0.5rem; margin-bottom:0.6rem; }
.set-input-group label { display:block; font-size:0.72rem; color:var(--text-secondary); text-transform:uppercase; margin-bottom:2px; }
.set-input-num { text-align:center; font-size:1.1rem!important; font-family:var(--font-mono)!important; padding:0.6rem!important; }
.set-actions-row { display:flex; justify-content:space-between; align-items:center; }
.warmup-check { font-size:0.82rem; color:var(--text-secondary); display:flex; align-items:center; gap:0.3rem; cursor:pointer; }
.workout-log-btn { min-width:120px; font-size:1rem!important; padding:0.7rem 1.2rem!important; }
.pr-alert { background:linear-gradient(135deg,rgba(var(--metal-rgb), 0.15),rgba(var(--metal-rgb), 0.1)); border:1px solid rgba(var(--metal-rgb), 0.4); border-radius:10px; padding:0.75rem 1rem; margin-bottom:1rem; animation:fadeIn 0.3s ease; }
.pr-alert-item { font-size:0.92rem; font-weight:600; color:var(--gold); }
.session-sets { margin-bottom:1.5rem; }
.session-sets h3 { font-size:0.95rem; margin-bottom:0.5rem; }
.set-row { display:flex; align-items:center; gap:0.5rem; padding:0.45rem 0; border-bottom:1px solid var(--border); font-size:0.85rem; }
.set-row.set-warmup { opacity:0.6; }
.set-row.set-pr { background:rgba(var(--metal-rgb), 0.06); border-radius:6px; padding:0.45rem 0.4rem; }
.set-num { font-family:var(--font-mono); color:var(--text-secondary); font-size:0.78rem; min-width:28px; }
.set-exercise { flex:1; color:var(--text-primary); font-weight:500; }
.set-detail { font-family:var(--font-mono); color:var(--text-secondary); }
.set-rpe { font-size:0.72rem; color:var(--text-secondary); }
.set-tag { font-size:0.6rem; font-weight:700; padding:1px 4px; border-radius:3px; text-transform:uppercase; background:var(--surface-elevated); color:var(--text-secondary); }
.set-tag-pr { background:linear-gradient(135deg,var(--gold-primary),var(--gold-bright)); color:#0a0a0a; }
.workout-end-section { display:flex; flex-direction:column; gap:0.5rem; align-items:center; }

/* Workout onboarding card */
.workout-onboard-card { background:var(--surface-elevated); border:1px solid var(--border); border-radius:16px; padding:1.5rem; max-width:480px; margin:1rem auto 0; }
.wo-field { margin-bottom:1.25rem; }
.wo-label { display:block; font-size:0.82rem; color:var(--text-secondary); text-transform:uppercase; letter-spacing:0.06em; margin-bottom:0.5rem; font-weight:600; }
.wo-chip-group { display:flex; flex-wrap:wrap; gap:0.5rem; }
.wo-chip { background:var(--surface); border:1px solid var(--border); color:var(--text-secondary); padding:0.5rem 1rem; border-radius:8px; font-size:0.88rem; cursor:pointer; transition:all 0.15s; }
.wo-chip:hover { border-color:var(--gold); color:var(--text-primary); }
.wo-chip-active { background:rgba(var(--metal-rgb), 0.15); border-color:var(--gold); color:var(--gold); font-weight:600; }
.wo-slider { width:100%; accent-color:var(--gold); margin-top:0.25rem; }
.wo-stats-row { display:flex; gap:0.5rem; }
.wo-stat-input { flex:1; position:relative; display:flex; align-items:center; }
.wo-stat-input .form-input { flex:1; padding-right:2.5rem; text-align:center; }
.wo-stat-unit { position:absolute; right:0.5rem; font-size:0.75rem; color:var(--text-secondary); pointer-events:none; }
.workout-best-streak { text-align:center; font-size:0.82rem; color:var(--text-secondary); margin-bottom:1rem; }
.streak-icon { margin-right:0.25rem; }

/* Today's Workout card */
.today-workout-card { background:var(--surface-elevated); border:1px solid var(--border); border-left:4px solid var(--gold); border-radius:12px; padding:1rem 1.25rem; margin-bottom:1rem; }
.today-workout-card h3 { margin:0 0 0.5rem; font-size:1rem; color:var(--gold); }
.tw-name { font-size:1.1rem; font-weight:700; color:var(--text-primary); margin-bottom:0.4rem; }
.tw-focus-badge, .tw-time-badge { display:inline-block; font-size:0.72rem; padding:2px 8px; border-radius:4px; background:rgba(var(--metal-rgb), 0.12); color:var(--gold); margin-right:0.4rem; text-transform:capitalize; }
.tw-exercises { margin:0.75rem 0; }
.tw-exercise-row { display:flex; align-items:baseline; gap:0.5rem; padding:0.35rem 0; border-bottom:1px solid var(--border); font-size:0.85rem; flex-wrap:wrap; }
.tw-exercise-row.tw-warmup { opacity:0.65; }
.tw-ex-name { font-weight:600; color:var(--text-primary); flex:1; min-width:120px; }
.tw-ex-detail { font-family:var(--font-mono); color:var(--text-secondary); white-space:nowrap; }
.tw-ex-notes { font-size:0.78rem; color:var(--text-muted); font-style:italic; width:100%; }

/* ═══════════════════════════════════════════════════════════
   WORKSPACE SCREENS — LEARN / COMMUNITY / WEALTH / INTELLIGENCE
   ═══════════════════════════════════════════════════════════ */

.ws-header { padding: 1.5rem 0 0.75rem; margin-bottom: 0.5rem; }
.ws-header-meta { font-size: var(--text-xs); text-transform: uppercase; letter-spacing: 0.1em; color: var(--text-muted); margin-bottom: 0.4rem; }
.ws-title { font-size: 2rem; font-weight: 800; color: var(--text-primary); margin-bottom: 0.25rem; }
.ws-title-accent { color: var(--gold-primary); }
.ws-subtitle { font-size: var(--text-sm); color: var(--text-secondary); }

.ws-sub-nav { display: flex; gap: 0.35rem; overflow-x: auto; padding: 0.25rem 0 0.75rem; border-bottom: 1px solid var(--border); margin-bottom: 1.5rem; scrollbar-width: none; }
.ws-sub-nav::-webkit-scrollbar { display: none; }
.ws-tab { display: flex; align-items: center; gap: 0.35rem; padding: 0.5rem 0.9rem; border-radius: 8px; border: 1px solid transparent; background: var(--bg-surface); color: var(--text-secondary); font-size: var(--text-sm); font-weight: 500; cursor: pointer; white-space: nowrap; transition: all 0.15s; font-family: inherit; min-height: 44px; min-width: 44px; }
.ws-tab:hover { border-color: var(--gold-border); color: var(--text-primary); background: var(--bg-elevated); }
.ws-tab.active { background: var(--gold-gradient); color: #0a0a0a; border-color: transparent; font-weight: 600; }
.ws-tab-icon { font-size: var(--text-base); }
.ws-tab-label { font-size: var(--text-xs); }

.ws-body { max-width: 900px; }
#wealth-content {
  width: 100%;
  max-width: 1180px;
}

.ws-stat-card { background: var(--bg-surface); border: 1px solid var(--border); border-radius: 12px; padding: 1.25rem; text-align: center; }
.ws-stat-value { font-size: 1.75rem; font-weight: 800; font-family: 'Syne', sans-serif; color: var(--gold-primary); line-height: 1; margin-bottom: 0.25rem; }
.ws-stat-label { font-size: var(--text-xs); color: var(--text-secondary); text-transform: uppercase; letter-spacing: 0.06em; }

/* ── Community Navigation Grid (2×2) ── */
.comm-nav-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0.6rem; margin-bottom: 1rem; }
.comm-card {
  display: flex; flex-direction: column; align-items: center; gap: 0.25rem;
  padding: 0.75rem 0.5rem; border-radius: 10px;
  background: var(--bg-surface); border: 1px solid var(--border);
  text-decoration: none; color: var(--text-primary);
  font-size: 0.78rem; font-weight: 600;
  transition: border-color 0.15s;
}
.comm-card:hover { border-color: var(--gold-border); background: var(--bg-elevated); }
.comm-card-icon { font-size: 1.4rem; }
.comm-card-label { color: var(--text-primary); }

/* ── Community Overview Activity Metrics ── */
.comm-overview-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0.6rem; }
.comm-stat-card {
  background: var(--bg-surface); border: 1px solid var(--border);
  border-radius: 12px; padding: 0.875rem 1rem;
  display: flex; flex-direction: column; gap: 0.2rem;
}
.comm-stat-card-wide { grid-column: span 2; }
.comm-stat-icon { font-size: 1.25rem; margin-bottom: 0.1rem; }
.comm-stat-val {
  font-size: 1.5rem; font-weight: 700;
  color: var(--gold-primary); font-family: 'Syne', sans-serif;
}
.comm-stat-label { font-size: 0.72rem; color: var(--text-muted); }

/* ── Leaderboard Rows (responsive single-row) ── */
.lb-board { display: flex; flex-direction: column; gap: 0.5rem; }
.lb-row {
  display: flex; align-items: center; gap: 0.75rem;
  padding: 0.875rem 1rem; border-radius: 10px;
  background: var(--bg-surface); border: 1px solid var(--border);
  text-decoration: none; color: var(--text-primary);
  transition: border-color 0.15s;
}
.lb-row:hover { border-color: var(--gold-border); }
.lb-row-link { display: flex; }
.lb-rank-num { width: 28px; font-size: 0.75rem; font-weight: 700; color: var(--text-muted); flex-shrink: 0; font-family: 'JetBrains Mono', monospace; }
.lb-avatar { width: 36px; height: 36px; border-radius: 50%; overflow: hidden; flex-shrink: 0; }
.lb-avatar-img, .lb-podium-img { width: 100%; height: 100%; object-fit: cover; }
.lb-avatar-placeholder { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background: var(--ai-glow); color: var(--ai-bright); font-weight: 700; font-size: 0.85rem; }
.lb-user-info { flex: 1; min-width: 0; }
.lb-user-name { font-size: 0.875rem; font-weight: 600; color: var(--text-primary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lb-user-meta { font-size: 0.72rem; color: var(--text-muted); }
.lb-xp-info { text-align: right; flex-shrink: 0; }
.lb-xp-value { font-size: 0.875rem; font-weight: 700; color: var(--gold-primary); font-family: 'JetBrains Mono', monospace; }
.lb-xp-label { font-size: 0.65rem; color: var(--text-muted); }
.lb-streak-info { flex-shrink: 0; }
.lb-streak { font-size: 0.75rem; font-weight: 600; color: #f97316; }
.lb-row-me { border-color: var(--gold-border); background: rgba(var(--metal-rgb), 0.05); }
.lb-my-row { margin-top: 0.5rem; }
.lb-you-tag { font-size: 0.7rem; color: var(--gold-muted); }
.lb-podium { display: flex; justify-content: center; align-items: flex-end; gap: 0.5rem; padding: 1.5rem 1rem; margin-bottom: 0.5rem; }
.lb-podium-slot { display: flex; flex-direction: column; align-items: center; gap: 0.25rem; text-decoration: none; color: var(--text-primary); }
.lb-podium-medal { font-size: 1.5rem; }
.lb-podium-avatar { width: 48px; height: 48px; border-radius: 50%; overflow: hidden; background: var(--bg-elevated); border: 2px solid var(--border); }
.lb-podium-ph { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background: var(--ai-glow); color: var(--ai-bright); font-weight: 700; }
.lb-podium-name { font-size: 0.75rem; font-weight: 600; max-width: 80px; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lb-podium-xp { font-size: 0.65rem; color: var(--text-muted); font-family: 'JetBrains Mono', monospace; }
.lb-podium-bar { width: 60px; height: 4px; border-radius: 2px; margin-top: 0.25rem; }
.lb-bar-1 { background: linear-gradient(90deg, var(--gold-primary), var(--gold-bright)); }
.lb-bar-2 { background: linear-gradient(90deg, #8a8a8a, #c0c0c0); }
.lb-bar-3 { background: linear-gradient(90deg, #8a5a2a, #c8833a); }
.lb-podium-1 .lb-podium-avatar { width: 64px; height: 64px; border-color: var(--gold-primary); }
.lb-podium-2 { transform: translateY(-8px); }
.lb-podium-3 { transform: translateY(-4px); }

/* ── Feed Post Card Density ── */
.post-card { padding: 1rem 1.25rem; margin-bottom: 0.625rem; }
.post-header { margin-bottom: 0.6rem; }

.ws-grid { display: grid; gap: 0.75rem; }
.ws-grid-2 { grid-template-columns: repeat(2, 1fr); }
.ws-grid-3 { grid-template-columns: repeat(3, 1fr); }

.ws-card { display: flex; flex-direction: column; gap: 0.4rem; padding: 1.25rem; background: var(--bg-surface); border: 1px solid var(--border); border-radius: 14px; transition: all 0.2s; text-decoration: none; color: inherit; }
.ws-card:hover { border-color: var(--gold-border); background: var(--bg-elevated); transform: translateY(-2px); box-shadow: 0 8px 24px rgba(0,0,0,0.4); }
.ws-card-icon { font-size: 1.75rem; margin-bottom: 0.25rem; }
.ws-card-title { font-size: var(--text-base); font-weight: 700; color: var(--text-primary); font-family: 'Syne', sans-serif; }
.ws-card-desc { font-size: var(--text-xs); color: var(--text-secondary); line-height: 1.4; }

.section-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 1rem; }
.section-header h2 { font-size: 1.2rem; font-weight: 700; color: var(--text-primary); }
.section-sub { font-size: var(--text-sm); color: var(--text-secondary); margin-bottom: 1rem; }

/* Learn */
.learn-hero { padding: 1.75rem; background: linear-gradient(135deg, var(--bg-surface) 0%, rgba(var(--metal-rgb), 0.08) 100%); border: 1px solid var(--gold-border); margin-bottom: 1.5rem; }
.learn-hero-label { font-size: var(--text-xs); text-transform: uppercase; letter-spacing: 0.1em; color: var(--text-muted); margin-bottom: 0.5rem; }
.learn-hero-title { font-size: 1.5rem; margin-bottom: 0.75rem; }
.learn-hero-progress { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 1rem; }
.learn-next-card { background: var(--bg-elevated); border: 1px solid var(--border); border-radius: 10px; padding: 0.9rem 1.1rem; }
.learn-next-label { font-size: var(--text-xs); text-transform: uppercase; letter-spacing: 0.08em; color: var(--text-muted); margin-bottom: 0.25rem; }
.learn-next-title { font-size: var(--text-sm); font-weight: 600; color: var(--text-primary); margin-bottom: 0.2rem; }
.learn-next-meta { font-size: var(--text-xs); color: var(--text-secondary); }
.learn-stats-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.75rem; margin-bottom: 2rem; }
.learn-trees-list { display: flex; flex-direction: column; gap: 0.75rem; }
.learn-tree-card { padding: 1.25rem; }
.learn-tree-header { display: flex; justify-content: space-between; align-items: center; }
.learn-tree-domain { font-weight: 700; font-family: 'Syne', sans-serif; }
.learn-tree-level { font-size: var(--text-xs); color: var(--text-muted); }
.learn-tree-branches { display: flex; gap: 0.5rem; margin-top: 0.5rem; }
.learn-branch { font-size: var(--text-xs); padding: 0.25rem 0.6rem; border-radius: 6px; background: var(--bg-elevated); border: 1px solid var(--border); }
.learn-branch.unlocked { background: rgba(34,197,94,0.1); border-color: rgba(34,197,94,0.3); color: #22c55e; }
.learn-branch.locked { opacity: 0.5; }
.learn-paths-list { display: flex; flex-direction: column; gap: 0.75rem; }
.learn-path-card { display: flex; align-items: center; gap: 1rem; padding: 1.25rem; }
.learn-path-badge { font-size: 2rem; flex-shrink: 0; }
.learn-path-info { flex: 1; }
.learn-path-name { font-weight: 700; font-family: 'Syne', sans-serif; margin-bottom: 0.2rem; }
.learn-path-domain { font-size: var(--text-xs); color: var(--text-secondary); margin-bottom: 0.3rem; }
.learn-path-progress-label { font-size: var(--text-xs); color: var(--text-muted); margin-top: 0.2rem; }
.learn-certs-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0.75rem; }
.learn-cert-card { padding: 1.25rem; text-align: center; }
.learn-cert-card.earned { border-color: rgba(34,197,94,0.3); background: rgba(34,197,94,0.05); }
.learn-cert-icon { font-size: 2.5rem; margin-bottom: 0.5rem; }
.learn-cert-name { font-weight: 700; font-family: 'Syne', sans-serif; margin-bottom: 0.25rem; }
.learn-cert-desc { font-size: var(--text-xs); color: var(--text-secondary); margin-bottom: 0.5rem; }
.learn-cert-date { font-size: var(--text-xs); color: #22c55e; }
.learn-cert-progress { font-size: var(--text-xs); color: var(--text-muted); margin-top: 0.25rem; }
.learn-quests-list { display: flex; flex-direction: column; gap: 0.6rem; }
.learn-quest-card { padding: 1rem 1.25rem; }
.learn-quest-card.locked { opacity: 0.5; }
.learn-quest-meta { display: flex; gap: 0.5rem; align-items: center; margin-bottom: 0.4rem; }
.quest-badge-type, .quest-badge-cat { font-size: var(--text-xs); padding: 2px 6px; border-radius: 5px; background: var(--bg-elevated); color: var(--text-secondary); text-transform: capitalize; }
.quest-xp { font-size: var(--text-xs); color: var(--gold-primary); font-weight: 600; }
.learn-quest-title { font-weight: 500; color: var(--text-primary); }
.quest-locked-label { font-size: var(--text-xs); color: var(--text-muted); margin-top: 0.4rem; }

.tutor-topic-grid { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 0; }
.tutor-topic-btn { padding: 0.45rem 0.9rem; border-radius: 8px; background: var(--bg-elevated); border: 1px solid var(--border); color: var(--text-secondary); font-size: var(--text-xs); cursor: pointer; transition: all 0.15s; font-family: inherit; }
.tutor-topic-btn:hover { border-color: var(--gold-border); color: var(--text-primary); }
.tutor-chat-history { min-height: 120px; margin-bottom: 1rem; }
.tutor-msg { margin-bottom: 1rem; }
.tutor-msg-label { font-size: var(--text-xs); color: var(--gold-muted); text-transform: uppercase; letter-spacing: 0.06em; margin-bottom: 0.25rem; }
.tutor-msg-text { font-size: var(--text-sm); color: var(--text-primary); line-height: 1.5; }
.tutor-input-row { display: flex; gap: 0.5rem; }

/* Community */
@media (max-width: 640px) {
  .community-stats-row { grid-template-columns: repeat(3, 1fr); gap: 0.5rem; }
  .community-stats-row .ws-stat-card { padding: 0.75rem 0.5rem; }
  .ws-title { font-size: 1.5rem; }
  .ws-subtitle { font-size: 0.8rem; }
  .feed-item { flex-wrap: wrap; gap: 0.5rem; }
  .feed-content { min-width: 0; word-break: break-word; }
  .ws-sub-nav { flex-wrap: wrap; }
}
.community-hero { padding: 1.5rem; }
.community-hero-label { font-size: var(--text-xs); text-transform: uppercase; letter-spacing: 0.1em; color: var(--text-muted); margin-bottom: 1rem; }
.community-stats-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.75rem; }
.feed-list { display: flex; flex-direction: column; gap: 0.5rem; }
.feed-item { display: flex; align-items: center; gap: 0.75rem; padding: 0.85rem 1rem; }
.feed-avatar { width: 32px; height: 32px; border-radius: 50%; background: var(--gold-dim); display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: var(--text-xs); color: var(--gold-bright); flex-shrink: 0; }
.feed-content { flex: 1; font-size: var(--text-sm); color: var(--text-secondary); }
.feed-user { color: var(--text-primary); font-weight: 600; }
.feed-time { font-size: var(--text-xs); color: var(--text-muted); flex-shrink: 0; }
.guilds-list { display: flex; flex-direction: column; gap: 0.75rem; }
.guild-card { padding: 1.25rem; }
.guild-card-header { display: flex; align-items: center; gap: 0.75rem; }
.guild-card-avatar { width: 42px; height: 42px; border-radius: 10px; background: var(--gold-gradient); display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: var(--text-base); color: #0a0a0a; flex-shrink: 0; }
.guild-card-info { flex: 1; }
.guild-card-name { font-weight: 700; font-family: 'Syne', sans-serif; }
.guild-card-meta { font-size: var(--text-xs); color: var(--text-muted); }
.guild-card-rank { font-size: var(--text-lg); font-weight: 800; color: var(--gold-primary); }
.guild-card-actions { display: flex; gap: 0.5rem; margin-top: 0.75rem; }
.guild-join-code-bar { display: flex; gap: 0.5rem; flex-wrap: wrap; align-items: center; }
#invite-code-input { flex: 1; min-width: 0; max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
.invite-upper { text-transform: uppercase; }
.friend-card { padding: 1.25rem; text-align: center; }
.friend-avatar { width: 48px; height: 48px; border-radius: 50%; background: var(--gold-dim); display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 1.1rem; color: var(--gold-bright); margin: 0 auto 0.5rem; }
.friend-name { font-weight: 700; margin-bottom: 0.2rem; }
.friend-meta { font-size: var(--text-xs); color: var(--text-secondary); margin-bottom: 0.4rem; }
.friend-status { font-size: var(--text-xs); text-transform: capitalize; }
.friend-status.online { color: #22c55e; }
.friend-status.away { color: #fbbf24; }
.friend-status.offline { color: var(--text-muted); }
.challenge-cards { display: flex; flex-direction: column; gap: 0.75rem; }
.challenge-card { padding: 1.25rem; position: relative; }
.challenge-card.upcoming { opacity: 0.7; }
.challenge-status-badge { font-size: var(--text-xs); text-transform: uppercase; padding: 2px 8px; border-radius: 5px; background: rgba(34,197,94,0.15); color: #22c55e; display: inline-block; margin-bottom: 0.5rem; }
.challenge-card.upcoming .challenge-status-badge { background: rgba(100,116,139,0.2); color: var(--text-secondary); }
.challenge-name { font-weight: 700; font-family: 'Syne', sans-serif; font-size: 1.1rem; margin-bottom: 0.25rem; }
.challenge-meta { font-size: var(--text-xs); color: var(--text-secondary); margin-bottom: 0.5rem; }
.challenge-progress-label { font-size: var(--text-xs); color: var(--text-muted); margin-top: 0.25rem; }
.challenge-reward { font-size: var(--text-xs); color: var(--gold-primary); margin-top: 0.5rem; }
.mentor-card { padding: 1.25rem; text-align: center; }
.mentor-avatar { width: 48px; height: 48px; border-radius: 50%; background: var(--gold-dim); display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 1.1rem; color: var(--gold-bright); margin: 0 auto 0.5rem; }
.mentor-name { font-weight: 700; margin-bottom: 0.2rem; }
.mentor-expertise { font-size: var(--text-xs); color: var(--text-secondary); margin-bottom: 0.5rem; }
.mentor-stats { display: flex; justify-content: center; gap: 1rem; font-size: var(--text-xs); color: var(--text-muted); }
.group-card { padding: 1.25rem; }
.group-name { font-weight: 700; margin-bottom: 0.2rem; }
.group-guild { font-size: var(--text-xs); color: var(--gold-muted); margin-bottom: 0.3rem; }
.group-meta { font-size: var(--text-xs); color: var(--text-secondary); }

/* Wealth Center */
.wealth-overview-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 0.85rem;
  align-items: stretch;
}
.wealth-overview-card {
  min-height: 132px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.wealth-hero-card {
  grid-column: span 2;
  min-height: 156px;
}
.wealth-hero-card { border-color: var(--gold-border); background: linear-gradient(135deg, var(--bg-surface), rgba(var(--metal-rgb), 0.08)); }
.wealth-overview-label { font-size: var(--text-xs); text-transform: uppercase; letter-spacing: 0.08em; color: var(--text-muted); margin-bottom: 0.35rem; }
.wealth-overview-value { font-size: 1.4rem; font-weight: 800; font-family: 'Syne', sans-serif; color: var(--text-primary); }
.wealth-overview-trend { font-size: var(--text-xs); margin-top: 0.25rem; }
.positive { color: #22c55e; }
.negative { color: #ef4444; }
.wealth-capital-breakdown { padding: 1.5rem; }
.capital-bar-list { display: flex; flex-direction: column; gap: 0.85rem; margin-top: 1rem; }
.capital-bar-item { display: flex; align-items: center; gap: 0.75rem; }
.capital-bar-label { width: 130px; font-size: var(--text-sm); color: var(--text-secondary); flex-shrink: 0; }
.capital-bar-score { width: 30px; text-align: right; font-size: var(--text-sm); font-family: 'JetBrains Mono', monospace; color: var(--text-primary); }

.cash-flow-summary { display: flex; align-items: center; gap: 1rem; padding: 1.5rem; justify-content: center; }
.cf-stat { text-align: center; }
.cf-stat-label { font-size: var(--text-xs); text-transform: uppercase; letter-spacing: 0.08em; color: var(--text-muted); margin-bottom: 0.25rem; }
.cf-stat-value { font-size: 1.4rem; font-weight: 800; font-family: 'Syne', sans-serif; }
.cf-divider { font-size: 1.2rem; color: var(--text-muted); }
.cf-breakdown { padding: 1.25rem; }
.cf-row { display: flex; align-items: center; gap: 0.75rem; padding: 0.6rem 0; border-bottom: 1px solid var(--border); }
.cf-row:last-child { border-bottom: none; }
.cf-cat { width: 100px; font-size: var(--text-sm); color: var(--text-secondary); flex-shrink: 0; }
.cf-amount { font-family: 'JetBrains Mono', monospace; font-size: var(--text-sm); font-weight: 600; color: var(--text-primary); }

.nw-summary { padding: 1.5rem; text-align: center; margin-bottom: 1rem; }
.nw-total { font-size: 2rem; font-weight: 800; font-family: 'Syne', sans-serif; color: var(--text-primary); }
.nw-trend { font-size: var(--text-sm); margin-top: 0.4rem; }
.nw-breakdown-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; }
.nw-section { padding: 1.25rem; }
.nw-section-title { font-weight: 700; font-family: 'Syne', sans-serif; margin-bottom: 0.75rem; color: var(--text-primary); }
.nw-row { display: flex; justify-content: space-between; align-items: center; padding: 0.45rem 0; font-size: var(--text-sm); border-bottom: 1px solid var(--border); }
.nw-row:last-child { border-bottom: none; }
.nw-total-row { font-weight: 700; margin-top: 0.5rem; padding-top: 0.5rem; border-top: 1px solid var(--border); }
.nw-positive { color: #22c55e; font-family: 'JetBrains Mono', monospace; }
.nw-negative { color: #ef4444; font-family: 'JetBrains Mono', monospace; }

.credit-score-hero { padding: 2rem; text-align: center; }
.credit-score-label { font-size: var(--text-xs); text-transform: uppercase; letter-spacing: 0.1em; color: var(--text-muted); margin-bottom: 0.5rem; }
.credit-score-value { font-size: 3.5rem; font-weight: 800; font-family: 'Syne', sans-serif; color: var(--gold-primary); line-height: 1; margin-bottom: 0.5rem; }
.credit-score-grade { font-size: var(--text-sm); color: #22c55e; text-transform: uppercase; letter-spacing: 0.08em; }
.credit-factors { padding: 1.25rem; }
.credit-factor { display: flex; align-items: center; gap: 0.75rem; padding: 0.65rem 0; border-bottom: 1px solid var(--border); }
.credit-factor:last-child { border-bottom: none; }
.credit-factor-label { width: 130px; font-size: var(--text-sm); color: var(--text-secondary); flex-shrink: 0; }
.credit-factor-val { width: 80px; font-size: var(--text-xs); color: var(--text-muted); text-align: right; flex-shrink: 0; }

.debt-summary { padding: 1.5rem; text-align: center; }
.debt-total { font-size: 2rem; font-weight: 800; font-family: 'Syne', sans-serif; color: #ef4444; }
.debt-label { font-size: var(--text-xs); text-transform: uppercase; letter-spacing: 0.08em; color: var(--text-muted); margin-top: 0.3rem; }
.debt-strategy { font-size: var(--text-xs); color: var(--gold-primary); margin-top: 0.4rem; }
.debt-list { display: flex; flex-direction: column; gap: 0.75rem; }
.debt-card { padding: 1.25rem; }
.debt-name { font-weight: 700; margin-bottom: 0.25rem; }
.debt-balance { font-size: 1.2rem; font-weight: 800; font-family: 'JetBrains Mono', monospace; color: var(--text-primary); margin-bottom: 0.25rem; }
.debt-meta { font-size: var(--text-xs); color: var(--text-muted); }
.fill-warning { background: #f59e0b !important; }
.fill-success { background: #22c55e !important; }

.invest-summary { padding: 1.5rem; text-align: center; }
.invest-total { font-size: 2rem; font-weight: 800; font-family: 'Syne', sans-serif; }
.invest-trend { font-size: var(--text-sm); margin-top: 0.35rem; }
.invest-allocation { padding: 1.25rem; }
.invest-row { display: flex; align-items: center; gap: 0.75rem; padding: 0.65rem 0; border-bottom: 1px solid var(--border); }
.invest-row:last-child { border-bottom: none; }
.invest-alloc-bar { height: 8px; border-radius: 4px; min-width: 8px; }
.invest-name { flex: 1; font-size: var(--text-sm); color: var(--text-secondary); }
.invest-pct { font-family: 'JetBrains Mono', monospace; font-size: var(--text-sm); color: var(--text-muted); width: 35px; }
.invest-val { font-family: 'JetBrains Mono', monospace; font-size: var(--text-sm); font-weight: 600; color: var(--text-primary); }

.tax-summary { padding: 1.5rem; text-align: center; }
.tax-label { font-size: var(--text-xs); text-transform: uppercase; letter-spacing: 0.08em; color: var(--text-muted); margin-bottom: 0.4rem; }
.tax-rate { font-size: 2.5rem; font-weight: 800; font-family: 'Syne', sans-serif; color: var(--text-primary); }
.tax-meta { font-size: var(--text-xs); color: var(--text-muted); margin-top: 0.25rem; }
.tax-tips { padding: 1.25rem; }
.tax-tip-row { display: flex; justify-content: space-between; align-items: center; padding: 0.65rem 0; border-bottom: 1px solid var(--border); }
.tax-tip-row:last-child { border-bottom: none; }
.tax-tip-text { font-size: var(--text-sm); color: var(--text-secondary); }
.tax-tip-saving { font-size: var(--text-xs); color: #22c55e; font-weight: 600; font-family: 'JetBrains Mono', monospace; }

.goals-list { display: flex; flex-direction: column; gap: 0.75rem; }
.goal-card { padding: 1.25rem; }
.goal-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 0.5rem; }
.goal-name { font-weight: 700; font-family: 'Syne', sans-serif; }
.goal-deadline { font-size: var(--text-xs); color: var(--text-muted); }
.goal-amounts { font-family: 'JetBrains Mono', monospace; font-size: var(--text-sm); margin-bottom: 0.35rem; }
.goal-current { color: var(--text-primary); font-weight: 600; }
.goal-sep { color: var(--text-muted); }
.goal-target { color: var(--text-secondary); }
.goal-pct { font-size: var(--text-xs); color: var(--gold-primary); margin-top: 0.25rem; }

.opp-list { display: flex; flex-direction: column; gap: 0.75rem; }
.opp-card { padding: 1.25rem; position: relative; }
.opp-priority-badge { font-size: var(--text-xs); text-transform: uppercase; padding: 2px 8px; border-radius: 5px; display: inline-block; margin-bottom: 0.5rem; }
.opp-priority-badge.high { background: rgba(239,68,68,0.15); color: #ef4444; }
.opp-priority-badge.medium { background: rgba(var(--metal-rgb), 0.15); color: var(--gold-primary); }
.opp-priority-badge.low { background: rgba(100,116,139,0.2); color: var(--text-secondary); }
.opp-title { font-weight: 700; font-family: 'Syne', sans-serif; margin-bottom: 0.35rem; }
.opp-desc { font-size: var(--text-sm); color: var(--text-secondary); margin-bottom: 0.6rem; }
.opp-impact { font-size: var(--text-sm); color: #22c55e; font-weight: 600; font-family: 'JetBrains Mono', monospace; }

/* Intelligence Center */
.intel-hero { padding: 2rem; text-align: center; margin-bottom: 1.5rem; background: linear-gradient(135deg, var(--bg-surface), rgba(var(--metal-rgb), 0.1)); border-color: var(--gold-border); }
.intel-hero-label { font-size: var(--text-xs); text-transform: uppercase; letter-spacing: 0.1em; color: var(--text-muted); margin-bottom: 0.5rem; }
.intel-hero-score { font-size: 4rem; font-weight: 800; font-family: 'Syne', sans-serif; color: var(--gold-primary); line-height: 1; margin-bottom: 0.4rem; }
.intel-hero-sub { font-size: var(--text-sm); color: var(--text-secondary); margin-bottom: 0.5rem; }
.intel-hero-trend { font-size: var(--text-sm); }
.intel-metrics-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.75rem; margin-bottom: 1.5rem; }
.intel-metric-card { padding: 1.25rem; text-align: center; }
.intel-metric-label { font-size: var(--text-xs); text-transform: uppercase; letter-spacing: 0.08em; color: var(--text-muted); margin-bottom: 0.4rem; }
.intel-metric-value { font-size: 1.5rem; font-weight: 800; font-family: 'Syne', sans-serif; color: var(--text-primary); }
.intel-metric-unit { font-size: var(--text-sm); color: var(--text-secondary); font-weight: 400; margin-left: 0.15rem; }
.intel-metric-trend { font-size: var(--text-xs); margin-top: 0.3rem; }
.intel-section-hero { padding: 2rem; text-align: center; margin-bottom: 1.25rem; }
.intel-section-score { font-size: 4rem; font-weight: 800; font-family: 'Syne', sans-serif; color: var(--gold-primary); line-height: 1; margin-bottom: 0.4rem; }
.intel-section-label { font-size: var(--text-base); font-weight: 700; color: var(--text-primary); margin-bottom: 0.35rem; }
.intel-section-desc { font-size: var(--text-sm); color: var(--text-secondary); max-width: 480px; margin: 0 auto; }
.intel-chart { padding: 1.25rem; }
.intel-chart-svg { height: 80px; margin-bottom: 0.5rem; }
.intel-chart-label { font-size: var(--text-xs); color: var(--text-muted); }
.intel-insight { padding: 1.25rem; }
.card-title { font-weight: 700; font-family: 'Syne', sans-serif; margin-bottom: 0.85rem; }
.intel-evidence { padding: 1.25rem; }
.intel-evidence-row { display: flex; align-items: center; gap: 0.75rem; padding: 0.55rem 0; border-bottom: 1px solid var(--border); }
.intel-evidence-row:last-child { border-bottom: none; }
.intel-evidence-item { flex: 1; font-size: var(--text-sm); color: var(--text-secondary); }
.intel-evidence-val { font-family: 'JetBrains Mono', monospace; font-size: var(--text-sm); font-weight: 600; color: var(--text-primary); }
.intel-evidence-status { font-size: var(--text-xs); text-transform: capitalize; }
.intel-evidence-status.strong, .intel-evidence-status.up { color: #22c55e; }
.intel-evidence-status.good { color: var(--gold-primary); }
.intel-evidence-status.ok { color: var(--text-muted); }
.why-btn {
  font-size: 0.72rem;
  padding: 0.2rem 0.6rem;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: transparent;
  color: var(--text-muted);
  cursor: pointer;
  transition: all 0.15s;
  margin-left: auto;
}
.why-btn:hover { border-color: var(--gold-primary); color: var(--gold-primary); }
.why-btn.why-btn-close { border-color: var(--gold-primary); color: var(--gold-primary); }
.score-breakdown {
  margin-top: 1rem;
  padding: 1rem;
  background: var(--bg-surface);
  border: 1px solid var(--border);
  border-radius: 10px;
}
.breakdown-title {
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--text-secondary);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin-bottom: 0.75rem;
}
.breakdown-row {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.45rem 0;
  border-bottom: 1px solid var(--border-subtle);
}
.breakdown-row:last-child { border-bottom: none; }
.breakdown-label { flex: 1; font-size: 0.82rem; color: var(--text-secondary); }
.breakdown-value {
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--text-primary);
  min-width: 60px;
  text-align: right;
}
.breakdown-bar {
  width: 80px;
  height: 4px;
  background: var(--card-surface);
  border-radius: 2px;
  overflow: hidden;
}
.breakdown-bar-fill { height: 100%; background: var(--gold-primary); border-radius: 2px; }
.intel-dimension-list { padding: 1.25rem; }
.intel-dim-row { display: flex; align-items: center; gap: 0.75rem; padding: 0.55rem 0; }
.intel-dim-name { width: 130px; font-size: var(--text-sm); color: var(--text-secondary); flex-shrink: 0; }
.intel-dim-score { font-family: 'JetBrains Mono', monospace; font-size: var(--text-sm); color: var(--text-primary); }
.momentum-factors { padding: 1.25rem; }
.momentum-factor-row { display: flex; align-items: center; gap: 0.75rem; padding: 0.55rem 0; border-bottom: 1px solid var(--border); }
.momentum-factor-row:last-child { border-bottom: none; }
.energy-pattern-insight { padding: 1.25rem; }
.energy-pattern-insight p { font-size: var(--text-sm); color: var(--text-secondary); line-height: 1.6; margin-bottom: 1rem; }
.energy-times { display: flex; gap: 0.75rem; margin-top: 0.75rem; }
.energy-time-slot { flex: 1; text-align: center; padding: 0.85rem; border-radius: 10px; }
.energy-time-slot.peak { background: rgba(34,197,94,0.1); border: 1px solid rgba(34,197,94,0.3); }
.energy-time-slot.dip { background: rgba(239,68,68,0.1); border: 1px solid rgba(239,68,68,0.3); }
.energy-time-slot.recovery { background: rgba(var(--metal-rgb), 0.1); border: 1px solid rgba(var(--metal-rgb), 0.3); }
.energy-time-label { font-size: var(--text-xs); text-transform: uppercase; letter-spacing: 0.08em; color: var(--text-muted); margin-bottom: 0.25rem; }
.energy-time-val { font-size: var(--text-sm); font-weight: 700; font-family: 'JetBrains Mono', monospace; }
.opp-history { padding: 1.25rem; }
.opp-history-row { display: flex; align-items: center; gap: 0.75rem; padding: 0.65rem 0; border-bottom: 1px solid var(--border); }
.opp-history-row:last-child { border-bottom: none; }
.opp-history-title { flex: 1; font-size: var(--text-sm); color: var(--text-primary); }
.opp-history-date { font-size: var(--text-xs); color: var(--text-muted); }
.opp-history-outcome { font-size: var(--text-xs); text-transform: capitalize; }
.opp-history-outcome.acted, .opp-history-outcome.deployed { color: #22c55e; }
.opp-history-outcome.skipped { color: var(--text-muted); }
.founder-stats-grid, .creator-stats-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0.75rem; }

/* Responsive */
@media (max-width: 768px) {
  .ws-grid-3 { grid-template-columns: repeat(2, 1fr); }
  .wealth-overview-grid { grid-template-columns: repeat(2, 1fr); }
  .wealth-hero-card { grid-column: 1 / -1; }
  .intel-metrics-grid { grid-template-columns: repeat(2, 1fr); }
  .nw-breakdown-grid { grid-template-columns: 1fr; }
  .community-stats-row { grid-template-columns: repeat(3, 1fr); }
  .intel-metric-value { font-size: 1.2rem; }
  .intel-hero-score { font-size: 3rem; }
}
@media (max-width: 480px) {
  .ws-grid-2, .ws-grid-3 { grid-template-columns: 1fr; }
  .learn-stats-row { grid-template-columns: repeat(3, 1fr); }
  .intel-metrics-grid { grid-template-columns: repeat(2, 1fr); }
  .founder-stats-grid, .creator-stats-grid { grid-template-columns: 1fr; }
  .ws-title { font-size: 1.5rem; }
  .energy-times { flex-direction: column; }
  .wealth-overview-grid { grid-template-columns: 1fr 1fr; }
  .wealth-overview-card { min-height: 112px; }
  .wealth-hero-card { grid-column: 1 / -1; }
  .workout-start-actions { grid-template-columns:1fr; }
  .workout-stats-grid { grid-template-columns:repeat(3,1fr); gap:0.5rem; }
  .workout-stat-value { font-size:1.2rem; }
  .set-inputs-row { grid-template-columns:repeat(3,1fr); gap:0.4rem; }
  .set-input-num { font-size:1.2rem!important; padding:0.8rem 0.4rem!important; }
  .workout-log-btn { min-width:100px; padding:0.8rem!important; }
  .workout-timer { font-size:2.8rem; }
  /* Leaderboard compact row */
  .lb-row { gap: 0.4rem; padding: 0.6rem 0.75rem; }
  .lb-user-meta { display: none; }
  .lb-streak-info { display: none; }
  .lb-xp-info { margin-left: auto; }
  .lb-rank-num { width: 22px; font-size: 0.7rem; }
  .lb-avatar { width: 28px; height: 28px; }
  /* Community overview single column */
  .comm-overview-grid { grid-template-columns: 1fr; }
  .comm-stat-card-wide { grid-column: span 1; }
}

/* Mirror Journal V2 */
.journal-header-row { display:flex; align-items:center; justify-content:space-between; margin-bottom:0.75rem; }
.mj-v2-mode-row { display:flex; gap:0.5rem; flex-wrap:wrap; margin-top:0.5rem; }
.mj-v2-mode-btn {
  background:var(--bg-secondary); color:var(--text-secondary);
  border:1px solid var(--border); border-radius:20px;
  padding:0.35rem 0.75rem; font-size:0.75rem; font-weight:500;
  cursor:pointer; transition:all 0.2s;
}
.mj-v2-mode-btn:hover { border-color:var(--accent); color:var(--accent); }
.mj-v2-mode-btn.active { background:var(--accent); color:#000; border-color:var(--accent); font-weight:600; }

/* ═══════════════════════════════════════════════════════════
   GLOBAL DESIGN CONSTITUTION — MIRROR JOURNAL (REFLECTION SPACE)
   Question: "What am I becoming?" Feeling: Reflection — not form, not notes app
   ═══════════════════════════════════════════════════════════ */

.journal-header {
  margin-bottom: 1.5rem;
}

.journal-header h1 {
  font-family: 'Syne', sans-serif;
  font-size: 1.8rem;
  font-weight: 700;
  margin-bottom: 0.25rem;
}

.journal-header-meta {
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-muted);
  font-weight: 500;
}

/* Mode selector — large pill cards, not tiny toggle */
.mj2-modes-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 0.75rem;
  margin-bottom: 1.5rem;
}

.mj2-mode-card {
  background: rgba(14, 14, 24, 0.6);
  border: 1px solid var(--border-glass);
  border-radius: var(--radius-lg);
  padding: 1.25rem;
  cursor: pointer;
  transition: all var(--dur-normal) var(--ease-out-expo);
  text-align: center;
}

.mj2-mode-card:hover {
  background: rgba(20, 20, 36, 0.8);
  border-color: var(--gold-border);
  transform: translateY(-2px);
}

.mj2-mode-icon { font-size: 1.5rem; margin-bottom: 0.5rem; }

.mj2-mode-name {
  font-family: 'Syne', sans-serif;
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--text-primary);
  margin-bottom: 0.25rem;
}

.mj2-mode-desc {
  font-size: 0.75rem;
  color: var(--text-muted);
  line-height: 1.4;
}

.mj2-mode-shadow { border-color: rgba(123,104,238,0.15); }
.mj2-mode-shadow:hover { border-color: rgba(123,104,238,0.35); }
.mj2-mode-record { border-color: rgba(var(--metal-rgb), 0.15); }
.mj2-mode-record:hover { border-color: rgba(var(--metal-rgb), 0.35); }

.mj2-record-badge {
  display: inline-block;
  margin-left: 0.4rem;
  font-size: 0.6rem;
  background: var(--gold-glow);
  color: var(--gold-primary);
  padding: 0.1rem 0.4rem;
  border-radius: 100px;
  font-weight: 600;
  letter-spacing: 0.04em;
}

.mj2-video-wrap {
  max-width: 760px;
  margin: 0 auto 1rem;
  padding: 1rem;
  border: 1px solid var(--border-glass);
  border-radius: var(--radius-xl);
  background: linear-gradient(145deg, rgba(14,14,24,0.92), rgba(24,20,35,0.78));
}

.mj2-camera-stage {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  margin-bottom: 0.85rem;
  overflow: hidden;
  border-radius: var(--radius-lg);
  background: radial-gradient(circle at 50% 35%, rgba(var(--metal-rgb), 0.11), rgba(4,4,10,0.96) 65%);
  border: 1px solid rgba(255,255,255,0.08);
}

.mj2-video-preview {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scaleX(-1);
}

.mj2-camera-status {
  position: absolute;
  left: 0.75rem;
  bottom: 0.75rem;
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  max-width: calc(100% - 1.5rem);
  padding: 0.4rem 0.65rem;
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 999px;
  background: rgba(5,5,12,0.78);
  color: rgba(255,255,255,0.88);
  font-size: 0.7rem;
  line-height: 1.25;
  backdrop-filter: blur(12px);
}

.mj2-camera-status-dot {
  width: 0.45rem;
  height: 0.45rem;
  flex: 0 0 auto;
  border-radius: 50%;
  background: #eab308;
  box-shadow: 0 0 10px rgba(234,179,8,0.6);
}

.mj2-camera-status[data-state="ready"] .mj2-camera-status-dot {
  background: #4ade80;
  box-shadow: 0 0 10px rgba(74,222,128,0.65);
}

.mj2-camera-status[data-state="error"] .mj2-camera-status-dot {
  background: #f87171;
  box-shadow: 0 0 10px rgba(248,113,113,0.65);
}

.mj2-camera-privacy {
  margin-top: 0.6rem;
  color: var(--text-muted);
  font-size: 0.72rem;
  line-height: 1.45;
  text-align: center;
}

.mj2-rec-controls,
.mj2-video-captured {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.mj2-rec-controls { justify-content: space-between; }
.mj2-rec-indicator { color: var(--text-secondary); font-size: 0.8rem; }
.mj2-rec-dot {
  display: inline-block;
  width: 0.55rem;
  height: 0.55rem;
  margin-right: 0.3rem;
  border-radius: 50%;
  background: #ef4444;
  animation: mj2-record-pulse 1.2s ease-in-out infinite;
}
.mj2-video-check { color: #4ade80; font-size: 1.1rem; }

@keyframes mj2-record-pulse {
  50% { opacity: 0.35; transform: scale(0.82); }
}

@media (prefers-reduced-motion: reduce) {
  .mj2-rec-dot { animation: none; }
}

/* Write panel — spacious, focused */
.mj2-write-panel {
  background: rgba(14, 14, 24, 0.5);
  border: 1px solid var(--border-glass);
  border-radius: var(--radius-xl);
  padding: 1.5rem;
  margin-bottom: 1.5rem;
}

.mj2-write-textarea {
  width: 100%;
  min-height: 140px;
  background: transparent;
  border: none;
  color: var(--text-primary);
  font-size: 0.95rem;
  font-family: inherit;
  line-height: 1.7;
  resize: none;
  outline: none;
  padding: 0;
}

.mj2-write-textarea::placeholder { color: var(--text-ghost); }

/* Past entries — minimal, dignified */
.journal-history-section { margin-top: 2rem; }

.journal-history-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1rem;
}

.journal-history-title {
  font-size: 0.65rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--text-muted);
  font-weight: 700;
}

.journal-entry {
  padding: 1rem 0;
  border-bottom: 1px solid var(--border-subtle);
}

.journal-entry:last-child { border-bottom: none; }

.journal-entry-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.4rem;
}

.journal-entry-date { font-size: 0.72rem; color: var(--text-muted); }
.journal-mood-tag { font-size: 0.65rem; background: var(--gold-glow); color: var(--gold-primary); padding: 0.15rem 0.5rem; border-radius: 100px; }

/* Capacity row — minimal biometric display */
.mj2-capacity-row {
  display: flex;
  gap: 0.5rem;
  margin-bottom: 1rem;
  flex-wrap: wrap;
}

.mj2-cap-card {
  background: rgba(14,14,24,0.5);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  padding: 0.5rem 0.75rem;
  text-align: center;
  min-width: 60px;
}

.mj2-cap-value {
  font-family: 'Syne', sans-serif;
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--text-primary);
}

.mj2-cap-label {
  font-size: 0.62rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-muted);
  font-weight: 600;
}

@media (max-width: 640px) {
  .mj2-modes-grid { grid-template-columns: 1fr 1fr; gap: 0.5rem; }
  .mj2-mode-card { padding: 0.875rem 0.75rem; }
  .journal-header h1 { font-size: 1.4rem; }
}

/* ── Life Setup (Extended Onboarding) ── */
.ls-field-label {
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--gray-light, #b0b0b0);
  margin-bottom: 0.4rem;
  margin-top: 1rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.ls-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}
.ls-chip {
  padding: 0.4rem 0.85rem;
  border-radius: 20px;
  border: 1.5px solid rgba(255,255,255,0.1);
  background: rgba(255,255,255,0.03);
  color: var(--gray-light, #b0b0b0);
  font-size: 0.82rem;
  cursor: pointer;
  transition: all 0.15s ease;
  outline: none;
}
.ls-chip:hover {
  border-color: rgba(var(--metal-rgb), 0.3);
  background: rgba(var(--metal-rgb), 0.06);
}
.ls-chip.selected {
  border-color: var(--gold, var(--gold-primary));
  background: rgba(var(--metal-rgb), 0.15);
  color: var(--gold, var(--gold-primary));
  font-weight: 600;
}
.ls-slider-wrap {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}
.ls-slider {
  flex: 1;
  -webkit-appearance: none;
  appearance: none;
  height: 6px;
  border-radius: 3px;
  background: rgba(255,255,255,0.1);
  outline: none;
}
.ls-slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--gold, var(--gold-primary));
  cursor: pointer;
  border: 2px solid rgba(0,0,0,0.3);
}
.ls-slider-val {
  min-width: 32px;
  text-align: center;
  font-weight: 700;
  color: var(--gold, var(--gold-primary));
  font-size: 0.95rem;
}
.ls-select {
  width: 100%;
  padding: 0.55rem 0.75rem;
  border-radius: 8px;
  border: 1.5px solid rgba(255,255,255,0.1);
  background: rgba(255,255,255,0.03);
  color: var(--white, #fff);
  font-size: 0.9rem;
  outline: none;
}
.ls-select:focus {
  border-color: var(--gold, var(--gold-primary));
}
.ls-input {
  width: 100%;
  padding: 0.55rem 0.75rem;
  border-radius: 8px;
  border: 1.5px solid rgba(255,255,255,0.1);
  background: rgba(255,255,255,0.03);
  color: var(--white, #fff);
  font-size: 0.9rem;
  outline: none;
  box-sizing: border-box;
}
.ls-input:focus {
  border-color: var(--gold, var(--gold-primary));
}
.ls-input::placeholder {
  color: var(--gray, #666);
}

/* Dashboard warm placeholders */
.dash-warm-placeholder {
  background: rgba(var(--metal-rgb), 0.04);
  border: 1px dashed rgba(var(--metal-rgb), 0.2);
  border-radius: 12px;
  padding: 1rem 1.25rem;
  margin-bottom: 0.75rem;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  cursor: pointer;
  transition: all 0.2s ease;
}
.dash-warm-placeholder:hover {
  background: rgba(var(--metal-rgb), 0.08);
  border-color: rgba(var(--metal-rgb), 0.35);
}
.dash-warm-icon {
  font-size: 1.5rem;
  flex-shrink: 0;
}
.dash-warm-text h4 {
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--gold, var(--gold-primary));
  margin: 0 0 0.15rem;
}
.dash-warm-text p {
  font-size: 0.78rem;
  color: var(--gray, #999);
  margin: 0;
  line-height: 1.4;
}
.dash-intel-filled {
  background: rgba(var(--metal-rgb), 0.06);
  border: 1px solid rgba(var(--metal-rgb), 0.15);
  border-radius: 12px;
  padding: 0.85rem 1rem;
  margin-bottom: 0.5rem;
}
.dash-intel-filled h4 {
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--gold, var(--gold-primary));
  margin: 0 0 0.3rem;
}
.dash-intel-filled .intel-val {
  font-size: 0.8rem;
  color: var(--gray-light, #b0b0b0);
  line-height: 1.4;
}

/* ── Media Studio: Audience Intelligence ─────────────────────────────────────── */
.audience-grid { gap: 1rem; }
.audience-card { transition: transform 0.2s ease; }
.audience-card:hover { transform: translateY(-2px); }
.audience-header { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.5rem; }
.audience-name { font-weight: 600; font-size: 0.95rem; }
.superfan-badge { background: rgba(var(--metal-rgb), 0.15); color: var(--gold,var(--gold-primary)); border: 1px solid rgba(var(--metal-rgb), 0.3); border-radius: 20px; padding: 0.1rem 0.5rem; font-size: 0.7rem; font-weight: 600; }
.audience-meta { display: flex; gap: 1rem; flex-wrap: wrap; font-size: 0.8rem; color: var(--gray); margin-bottom: 0.5rem; }
.audience-tags { display: flex; gap: 0.4rem; flex-wrap: wrap; margin-bottom: 0.75rem; }
.audience-tags .tag { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.12); border-radius: 20px; padding: 0.1rem 0.5rem; font-size: 0.68rem; }
.audience-tags .tag.gold { background: rgba(var(--metal-rgb), 0.15); color: var(--gold); border-color: rgba(var(--metal-rgb), 0.3); }
.audience-tags .tag.positive { background: rgba(74,222,128,0.12); color: #4ade80; border-color: rgba(74,222,128,0.3); }
.audience-actions { display: flex; gap: 0.5rem; margin-top: 0.75rem; }
.segment-row { display: flex; align-items: center; gap: 0.75rem; padding: 0.4rem 0; border-bottom: 1px solid rgba(255,255,255,0.05); }
.segment-label { min-width: 90px; font-size: 0.82rem; font-weight: 600; }
.segment-bar-wrap { flex: 1; background: rgba(255,255,255,0.06); border-radius: 4px; height: 8px; overflow: hidden; }
.segment-bar { height: 100%; background: linear-gradient(90deg, var(--gold,var(--gold-primary)), rgba(var(--metal-rgb), 0.4)); border-radius: 4px; transition: width 0.6s ease; }
.segment-count { font-size: 0.8rem; min-width: 30px; text-align: right; color: var(--gray); }
.signal-row { display: flex; align-items: center; gap: 1rem; padding: 0.6rem 0.75rem; margin-bottom: 0.5rem; font-size: 0.82rem; }
.signal-type { font-weight: 600; min-width: 80px; }
.signal-value { flex: 1; color: var(--gray); }
.signal-sentiment { font-size: 0.75rem; text-transform: uppercase; }
.signal-sentiment.positive { color: #4ade80; }
.signal-sentiment.negative { color: #f87171; }
.signal-date { font-size: 0.75rem; color: var(--gray); min-width: 80px; }
.tag.gold { background: rgba(var(--metal-rgb), 0.15); color: var(--gold,var(--gold-primary)); border: 1px solid rgba(var(--metal-rgb), 0.3); border-radius: 20px; padding: 0.1rem 0.5rem; font-size: 0.68rem; font-weight: 600; }

/* ── Media Studio: IP & Content Intelligence ──────────────────────────────────── */
.ip-grid { gap: 1rem; }
.ip-card-header { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.5rem; }
.ip-desc { font-size: 0.8rem; color: var(--gray); margin: 0 0 0.5rem; }
.ip-meta { font-size: 0.75rem; color: var(--gray-light); margin-bottom: 0.5rem; }
.ip-actions { display: flex; gap: 0.5rem; margin-top: 0.75rem; }
.character-card { border-left: 3px solid var(--gold,var(--gold-primary)); }
.trait-chips { display: flex; flex-wrap: wrap; gap: 0.3rem; margin-bottom: 0.5rem; }
.trait-chip { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.12); border-radius: 20px; padding: 0.1rem 0.5rem; font-size: 0.68rem; }
.revenue-badge { border-radius: 20px; padding: 0.15rem 0.6rem; font-size: 0.68rem; font-weight: 600; text-transform: capitalize; }
.revenue-badge.high { background: rgba(74,222,128,0.12); color: #4ade80; border: 1px solid rgba(74,222,128,0.3); }
.revenue-badge.medium { background: rgba(var(--metal-rgb), 0.12); color: var(--gold,var(--gold-primary)); border: 1px solid rgba(var(--metal-rgb), 0.3); }
.revenue-badge.low, .revenue-badge.dormant { background: rgba(255,255,255,0.05); color: var(--gray); border: 1px solid rgba(255,255,255,0.1); }
.merch-opp { display: flex; align-items: center; justify-content: space-between; padding: 0.6rem 0; border-bottom: 1px solid rgba(255,255,255,0.05); }
.opp-demand { background: rgba(var(--metal-rgb), 0.15); color: var(--gold); border-radius: 20px; padding: 0.1rem 0.5rem; font-size: 0.68rem; font-weight: 600; }
.franchise-row { display: flex; align-items: center; gap: 0.75rem; flex-wrap: wrap; }
.sub-tabs { display: flex; gap: 0.5rem; border-bottom: 1px solid rgba(255,255,255,0.1); padding-bottom: 0.5rem; }
.sub-tab { background: transparent; border: 1px solid rgba(255,255,255,0.1); border-radius: 8px; padding: 0.4rem 1rem; color: var(--gray); font-size: 0.82rem; cursor: pointer; transition: all 0.2s; }
.sub-tab:hover { border-color: rgba(255,255,255,0.2); color: var(--white); }
.sub-tab.active { background: rgba(var(--metal-rgb), 0.12); border-color: var(--gold,var(--gold-primary)); color: var(--gold,var(--gold-primary)); }

/* ── Media Studio: Music Intelligence ─────────────────────────────────────────── */
.pipeline-row { display: flex; gap: 1rem; overflow-x: auto; padding-bottom: 0.5rem; }
.pipeline-stage { flex: 1; min-width: 100px; background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.08); border-radius: 12px; padding: 1rem 0.75rem; text-align: center; }
.pipeline-count { font-size: 1.8rem; font-weight: 700; }
.pipeline-label { font-size: 0.72rem; color: var(--gray); margin-top: 0.25rem; text-transform: uppercase; letter-spacing: 0.05em; }
.track-card { border-left: 3px solid var(--gold,var(--gold-primary)); }
.track-header { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 0.75rem; }
.track-title { font-weight: 700; font-size: 1rem; }
.track-meta { font-size: 0.78rem; color: var(--gray); margin-top: 0.2rem; }
.status-badge { border-radius: 20px; padding: 0.15rem 0.6rem; font-size: 0.68rem; font-weight: 600; text-transform: capitalize; }
.track-mood { font-size: 0.78rem; color: var(--gray-light); font-style: italic; margin-bottom: 0.5rem; }
.track-production { display: flex; gap: 1rem; font-size: 0.78rem; color: var(--gray); flex-wrap: wrap; margin-bottom: 0.5rem; }
.track-dist { display: flex; gap: 0.5rem; font-size: 0.9rem; margin-bottom: 0.75rem; }
.track-actions { display: flex; gap: 0.5rem; }
.genre-chip { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.12); border-radius: 20px; padding: 0.25rem 0.75rem; font-size: 0.78rem; }
.track-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }

/* ── Shared Media Studio ─────────────────────────────────────────────────────── */
.loading-state { text-align: center; padding: 2rem; color: var(--gray); font-size: 0.9rem; }
.glass-card:hover { box-shadow: 0 4px 20px rgba(0,0,0,0.2); }
.form-row-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.form-row-3 { display: flex; gap: 1rem; flex-wrap: wrap; }
.chip-label { display: flex; align-items: center; gap: 0.4rem; font-size: 0.82rem; cursor: pointer; color: var(--gray); }
.modal-sm .modal-body { max-width: 500px; }

/* ═══════════════════════════════════════════════════════════
   LIFEOS PHASE 1 — INTELLIGENCE-FIRST DASHBOARD
   ═══════════════════════════════════════════════════════════ */

/* ── Intelligence Hero ──────────────────────────────────────────────────────── */
.intel-hero {
  background: linear-gradient(135deg, rgba(20,20,36,0.9) 0%, rgba(10,10,18,0.95) 100%);
  border: 1px solid var(--gold-border);
  border-radius: 18px;
  padding: 2rem 2.2rem;
  margin-bottom: 0.75rem;
  position: relative;
  overflow: hidden;
  box-shadow: 0 0 60px rgba(var(--metal-rgb), 0.06), 0 8px 32px rgba(0,0,0,0.4);
}
.intel-hero::before {
  content: '';
  position: absolute;
  top: 0; right: 0; bottom: 0; left: 0;
  background: radial-gradient(ellipse at 70% 30%, rgba(var(--metal-rgb), 0.04) 0%, transparent 60%);
  pointer-events: none;
}
.intel-hero-top { margin-bottom: 1.4rem; }
.intel-date { font-size: 0.75rem; letter-spacing: 0.12em; color: var(--gold-muted); text-transform: uppercase; margin-bottom: 0.3rem; }
.intel-greeting {
  font-family: 'Syne', sans-serif;
  font-size: 2.2rem;
  font-weight: 700;
  color: var(--text-primary);
  letter-spacing: -0.03em;
  line-height: 1.1;
}
.intel-greeting span { color: var(--gold-primary); }
.intel-state-row { margin-bottom: 0.5rem; }
.intel-state-label, .intel-focus-label {
  font-size: 0.7rem; letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--text-muted); margin-bottom: 0.2rem;
}
.intel-state-value {
  font-family: 'Syne', sans-serif; font-size: 1.1rem; font-weight: 600; color: var(--gold-primary);
}
.intel-focus-value {
  font-size: 0.95rem; color: var(--text-secondary); font-style: italic;
}
.intel-metrics-row {
  display: flex; align-items: center; gap: 0; margin: 1.2rem 0;
  background: rgba(var(--metal-rgb), 0.04); border-radius: 12px; padding: 0.8rem 1.2rem;
}
.intel-metric { flex: 1; text-align: center; }
.intel-metric-label { display: block; font-size: 0.68rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--text-muted); margin-bottom: 0.25rem; }
.intel-metric-value { font-family: 'JetBrains Mono', monospace; font-size: 1rem; font-weight: 500; color: var(--gold-primary); }
.intel-metric-divider { width: 1px; height: 28px; background: var(--border-subtle); margin: 0 0.5rem; }
.intel-action-row { margin-top: 0.5rem; }
.intel-action-text { display: flex; align-items: center; justify-content: space-between; }
.intel-action-label { font-size: 0.8rem; color: var(--text-muted); }
.intel-action-impact { font-family: 'JetBrains Mono', monospace; font-size: 0.78rem; padding: 0.15rem 0.5rem; border-radius: 6px; }
.intel-action-impact.impact-high { background: rgba(74,222,128,0.12); color: #4ade80; }
.intel-action-impact.impact-moderate { background: rgba(var(--metal-rgb), 0.12); color: var(--gold-primary); }
.intel-action-impact.impact-low { background: rgba(255,255,255,0.06); color: var(--text-muted); }
.intel-action-btn {
  width: 100%; padding: 0.85rem; border-radius: 12px; border: 1px solid var(--gold-border);
  background: linear-gradient(135deg, rgba(var(--metal-rgb), 0.12) 0%, rgba(123,104,238,0.08) 100%);
  color: var(--gold-bright); font-weight: 600; font-size: 0.9rem; cursor: pointer;
  transition: all 0.2s; letter-spacing: 0.02em;
}
.intel-action-btn:hover { background: linear-gradient(135deg, rgba(var(--metal-rgb), 0.2) 0%, rgba(123,104,238,0.15) 100%); transform: translateY(-1px); }

/* ── Today's Mission ─────────────────────────────────────────────────────────── */
.mission-card {
  background: linear-gradient(135deg, rgba(14,14,24,0.95) 0%, rgba(10,10,18,0.98) 100%);
  border: 1px solid var(--gold-border);
  border-radius: 16px;
  padding: 1.6rem 1.8rem;
  margin: 0.6rem 0;
  box-shadow: 0 4px 24px rgba(0,0,0,0.25);
}
.mission-card--checkin {
  border-color: rgba(123,104,238,0.3);
  background: linear-gradient(135deg, rgba(123,104,238,0.06) 0%, rgba(10,10,18,0.98) 100%);
}
.mission-label { font-size: 0.68rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--gold-muted); margin-bottom: 0.6rem; }
.mission-title { font-family: 'Syne', sans-serif; font-size: 1.35rem; font-weight: 700; color: var(--text-primary); margin-bottom: 0.6rem; line-height: 1.2; }
.mission-why { font-size: 0.85rem; color: var(--text-secondary); line-height: 1.5; margin-bottom: 0.8rem; font-style: italic; }
.mission-meta-row { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 0.5rem; }
.mission-xp { font-family: 'JetBrains Mono', monospace; font-size: 0.82rem; color: var(--gold-primary); }
.mission-impact { font-size: 0.75rem; padding: 0.15rem 0.5rem; border-radius: 6px; }
.mission-impact.impact-high { background: rgba(74,222,128,0.12); color: #4ade80; }
.mission-impact.impact-moderate { background: rgba(var(--metal-rgb), 0.12); color: var(--gold-primary); }
.mission-impact.impact-low { background: rgba(255,255,255,0.06); color: var(--text-muted); }

/* ── Current Trajectory ─────────────────────────────────────────────────────── */
.trajectory-card {
  background: linear-gradient(135deg, rgba(14,14,24,0.9) 0%, rgba(10,10,18,0.95) 100%);
  border: 1px solid var(--border-glass);
  border-radius: 14px;
  padding: 1.4rem 1.6rem;
  margin: 0.5rem 0;
}
.trajectory-label { font-size: 0.68rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--text-muted); margin-bottom: 1rem; }
.trajectory-visual { display: flex; align-items: center; gap: 0; margin-bottom: 0.8rem; }
.trajectory-node { text-align: center; flex-shrink: 0; }
.trajectory-icon { font-size: 1.6rem; margin-bottom: 0.3rem; }
.trajectory-node-label { font-size: 0.65rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.08em; }
.trajectory-node-name { font-family: 'Syne', sans-serif; font-size: 0.9rem; font-weight: 600; color: var(--text-primary); margin-top: 0.2rem; }
.trajectory-line {
  flex: 1; margin: 0 1rem; height: 4px; background: var(--border-subtle);
  border-radius: 2px; position: relative; overflow: visible;
}
.trajectory-progress-fill {
  height: 100%; background: linear-gradient(90deg, var(--gold-primary) 0%, var(--ai-primary) 100%);
  border-radius: 2px; transition: width 0.6s ease;
}
.trajectory-percent {
  position: absolute; top: -1.5rem; right: 0; font-family: 'JetBrains Mono', monospace;
  font-size: 0.72rem; color: var(--gold-primary); font-weight: 500;
}
.trajectory-footer { display: flex; align-items: center; gap: 0.5rem; font-size: 0.78rem; }
.trajectory-alignment { font-weight: 600; }
.trajectory-dimension { color: var(--text-muted); }

/* ── Opportunity Alerts ─────────────────────────────────────────────────────── */
.opp-section-label { font-size: 0.68rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--text-muted); margin: 0.5rem 0 0.5rem; }
.opp-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.5rem; }
.opp-card {
  background: rgba(14,14,24,0.8); border: 1px solid var(--border-glass);
  border-radius: 10px; padding: 0.7rem; text-align: center; cursor: pointer;
  transition: all 0.2s;
}
.opp-card:hover { border-color: var(--gold-border); transform: translateY(-2px); }
.opp-icon { font-size: 1rem; margin-bottom: 0.3rem; }
.opp-category { font-size: 0.65rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--text-muted); margin-bottom: 0.25rem; }
.opp-score { font-family: 'JetBrains Mono', monospace; font-size: 1rem; font-weight: 500; }
.opp-trend { font-family: 'JetBrains Mono', monospace; font-size: 0.75rem; }

/* ── AI Companion Sidebar Highlight ────────────────────────────────────────── */
.ai-companion-link {
  background: linear-gradient(135deg, rgba(123,104,238,0.15) 0%, rgba(var(--metal-rgb), 0.08) 100%) !important;
  border: 1px solid rgba(123,104,238,0.3) !important;
  margin-bottom: 0.25rem;
  border-radius: 10px !important;
}
.ai-companion-link:hover { background: linear-gradient(135deg, rgba(123,104,238,0.25) 0%, rgba(var(--metal-rgb), 0.15) 100%) !important; }
.ai-companion-icon { color: var(--ai-bright) !important; }

/* ── LifeOS Sidebar Redesign ─────────────────────────────────────────────────── */
.sidebar-section-label { font-size: 0.6rem !important; letter-spacing: 0.12em !important; text-transform: uppercase !important; color: var(--text-ghost) !important; padding: 0.4rem 0.5rem 0.25rem !important; }
.sidebar-link:hover .sidebar-link-icon { color: var(--gold-bright); }
.sidebar-link.active { background: var(--gold-glow) !important; border-left: 2px solid var(--gold-primary); }

/* ── XP Bar ──────────────────────────────────────────────────────────────────── */
.xp-progress-wrap { margin: 0.6rem 0; }
.xp-progress-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 0.4rem; }
.xp-level-badge { display: flex; align-items: center; gap: 0.4rem; }
.xp-level-num { font-family: 'JetBrains Mono', monospace; font-size: 0.78rem; color: var(--gold-primary); font-weight: 500; }
.xp-level-name { font-size: 0.75rem; color: var(--text-muted); }
.xp-progress-meta { font-size: 0.75rem; color: var(--text-muted); }
.xp-bar-track { height: 6px; background: var(--border-subtle); border-radius: 3px; overflow: hidden; }
.xp-bar-fill { height: 100%; background: linear-gradient(90deg, var(--gold-dim), var(--gold-primary), var(--gold-bright)); border-radius: 3px; transition: width 0.4s ease; }

/* ── Weekly Activity ─────────────────────────────────────────────────────────── */
.weekly-activity-container { display: flex; align-items: center; gap: 1rem; padding: 0.75rem 1rem; background: rgba(255,255,255,0.02); border: 1px solid var(--border-subtle); border-radius: 10px; margin: 0.5rem 0; }
.weekly-dots { display: flex; gap: 0.4rem; }
.activity-dot-wrapper { text-align: center; }
.activity-dot { width: 10px; height: 10px; border-radius: 50%; margin-bottom: 0.25rem; }
.activity-dot.active { background: var(--gold-primary); box-shadow: 0 0 6px rgba(var(--metal-rgb), 0.5); }
.activity-dot.inactive { background: var(--border-subtle); }
.activity-dot-wrapper.today .activity-dot { box-shadow: 0 0 0 2px var(--gold-primary); }
.activity-dot-label { font-size: 0.62rem; color: var(--text-muted); }
.weekly-summary { font-size: 0.75rem; color: var(--text-muted); white-space: nowrap; }

/* ── Briefing Cards (kept for backwards compat) ──────────────────────────────── */
.briefing-state-zones { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin: 0.6rem 0; }
.briefing-card {
  background: linear-gradient(135deg, rgba(14,14,24,0.9) 0%, rgba(10,10,18,0.95) 100%);
  border: 1px solid var(--border-glass);
  border-radius: 14px; padding: 1rem 0.9rem; text-align: center;
}
.briefing-card-icon { font-size: 1.4rem; margin-bottom: 0.4rem; }
.briefing-card-label { font-size: 0.65rem; text-transform: uppercase; letter-spacing: 0.1em; color: var(--text-muted); margin-bottom: 0.3rem; }
.briefing-card-value { font-family: 'Syne', sans-serif; font-size: 1.3rem; font-weight: 700; color: var(--card-accent, var(--gold-primary)); margin-bottom: 0.3rem; }
.briefing-card-hint { font-size: 0.75rem; color: var(--text-secondary); line-height: 1.4; }

/* ── Dashboard Content Sections ─────────────────────────────────────────────── */
.db-section { margin: 0.5rem 0; }
.db-section-label { font-size: 0.68rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--text-muted); margin-bottom: 0.6rem; padding-top: 0.5rem; }

/* ── Responsive Adjustments ──────────────────────────────────────────────────── */
@media (max-width: 768px) {
  .intel-greeting { font-size: 1.45rem; }
  .intel-hero { padding: 1rem 0.9rem; }
  .intel-hero-top { margin-bottom: 0.8rem; }
  .intel-metrics-row {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.2rem;
    margin: 0.8rem 0;
    padding: 0.65rem 0.2rem;
  }
  .intel-metric { min-width: 0; }
  .intel-metric-label { font-size: 0.56rem; letter-spacing: 0.06em; }
  .opp-grid { grid-template-columns: repeat(2, 1fr); }
  .briefing-state-zones { grid-template-columns: 1fr; }
  .trajectory-visual { flex-direction: column; gap: 0.5rem; }
  .trajectory-line { width: 100%; height: 4px; }
  .intel-metric-divider { display: none; }
}
.modal-lg .modal-body { max-width: 700px; }
.modal-md .modal-body { max-width: 550px; }

/* ── Calendar Block View ────────────────────────────────────────────────────── */

:root {
  --cal-work: #6366f1;
  --cal-exercise: #22c55e;
  --cal-meal: #f97316;
  --cal-sleep: #a78bfa;
  --cal-free: var(--gold-primary);
  --cal-social: #ec4899;
}

/* Day / hour grid */
.cal-grid-wrap {
  position: relative;
  overflow-x: auto;
  overflow-y: visible;
  overscroll-behavior-inline: contain;
}
.cal-grid {
  position: relative;
}
.cal-hour-row {
  position: relative;
  height: 60px;
  border-bottom: 1px solid rgba(255,255,255,0.05);
}
.cal-hour-label {
  position: absolute;
  left: 0;
  top: -10px;
  width: 46px;
  text-align: right;
  font-size: 0.7rem;
  color: var(--gray);
  font-family: 'JetBrains Mono', monospace;
}
.cal-hour-slot {
  position: absolute;
  left: 52px;
  right: 0;
  top: 0;
  bottom: 0;
  cursor: pointer;
  min-height: 44px;
}
.cal-hour-slot .cal-new-event-hint {
  position: absolute;
  top: 4px;
  left: 6px;
  font-size: 0.7rem;
  color: rgba(255,255,255,0.15);
  pointer-events: none;
  display: none;
}
.cal-hour-slot:hover .cal-new-event-hint {
  display: block;
}

/* Events layer */
.cal-events-layer {
  position: absolute;
  top: 0;
  left: 52px;
  right: 0;
  bottom: 0;
  pointer-events: none;
}
.cal-events-layer > * {
  pointer-events: all;
}

/* Event blocks */
.cal-event {
  position: absolute;
  left: 0;
  right: 0;
  border-radius: 8px;
  padding: 5px 8px;
  overflow: hidden;
  cursor: pointer;
  pointer-events: all;
  transition: box-shadow 0.15s;
  font-size: 0.82rem;
}
.cal-event:hover {
  box-shadow: 0 2px 12px rgba(0,0,0,0.4);
  z-index: 20;
  min-height: 44px;
  overflow: visible;
}
.cal-event:hover .cal-event-title { white-space:normal; overflow:visible; text-overflow:clip; }
.cal-event.completed {
  opacity: 0.45;
}
.cal-event-title {
  font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.cal-event-time {
  font-size: 0.72rem;
  color: rgba(255,255,255,0.6);
  margin-top: 2px;
}
.cal-event-meta {
  font-size: 0.72rem;
  color: rgba(255,255,255,0.5);
  margin-top: 2px;
}
.cal-event-done-icon {
  position: absolute;
  top: 5px;
  right: 6px;
  font-size: 0.7rem;
  color: var(--gold-primary);
}
.calendar-connection-banner { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin:0 0 1rem; padding:0.85rem 1rem; border:1px solid var(--gold-border); border-radius:14px; background:linear-gradient(120deg,var(--gold-glow),rgba(255,255,255,0.025)); }
.calendar-connection-banner > div:first-child { display:grid; gap:0.25rem; }
.calendar-connection-banner strong { color:var(--text); }
.calendar-connection-banner span { color:var(--text-secondary); font-size:0.78rem; line-height:1.45; }
.calendar-connection-banner.is-connected { border-color:rgba(74,222,128,0.3); background:rgba(74,222,128,0.055); }
.calendar-connection-actions { display:flex; gap:0.5rem; flex-wrap:wrap; flex-shrink:0; }
@media (max-width:720px) { .calendar-connection-banner { align-items:flex-start; flex-direction:column; } .calendar-connection-actions { width:100%; } .calendar-connection-actions .btn { flex:1; } }

/* Category colours */
.cal-event.work     { background: rgba(99,102,241,0.18); border: 1px solid rgba(99,102,241,0.4); }
.cal-event.exercise { background: rgba(34,197,94,0.18);  border: 1px solid rgba(34,197,94,0.4); }
.cal-event.meal     { background: rgba(249,115,22,0.18); border: 1px solid rgba(249,115,22,0.4); }
.cal-event.sleep    { background: rgba(167,139,250,0.18); border: 1px solid rgba(167,139,250,0.4); }
.cal-event.free     { background: rgba(var(--metal-rgb), 0.15); border: 1px solid rgba(var(--metal-rgb), 0.35); }
.cal-event.social   { background: rgba(236,72,153,0.18); border: 1px solid rgba(236,72,153,0.4); }
.cal-event.quest    { background: rgba(var(--metal-rgb), 0.2);  border: 1px solid rgba(var(--metal-rgb), 0.5); border-left: 3px solid var(--gold-primary); }
.cal-event.external { background: rgba(56,189,248,0.18); border: 1px solid rgba(56,189,248,0.45); border-left: 3px solid #38bdf8; }
.cal-event.ticketmaster { background: rgba(236,72,153,0.18); border: 1px solid rgba(236,72,153,0.5); border-left: 3px solid #ec4899; }

.cal-event-discovery,
.cal-event-discovery-empty {
  margin-top: 1rem;
  border: 1px solid rgba(var(--metal-rgb), 0.2);
  border-radius: 14px;
  background: rgba(255,255,255,0.025);
  padding: 1rem;
}
.cal-event-discovery-empty {
  color: var(--gray-light);
  font-size: .82rem;
}
.cal-event-discovery-head strong,
.cal-event-discovery-card strong {
  display: block;
  color: var(--white);
}
.cal-event-discovery-head small,
.cal-event-discovery-card small {
  display: block;
  margin-top: .2rem;
  color: var(--gray-light);
  line-height: 1.45;
}
.cal-event-discovery-list {
  display: grid;
  gap: .6rem;
  margin-top: .8rem;
}
.cal-event-discovery-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  border-top: 1px solid rgba(255,255,255,0.06);
  padding-top: .65rem;
}
.cal-event-discovery-card > div {
  min-width: 0;
}
@media (max-width: 640px) {
  .cal-event-discovery-card {
    align-items: flex-start;
    flex-direction: column;
  }
}

/* AI suggestion blocks */
.cal-event.ai-suggestion {
  position: absolute;
  left: 0; right: 0;
  background: rgba(var(--metal-rgb), 0.12);
  border: 1.5px dashed rgba(var(--metal-rgb), 0.6);
  border-radius: 10px;
  padding: 6px 8px;
  cursor: pointer;
  pointer-events: all;
  overflow: hidden;
  transition: background 0.15s, border-color 0.15s;
}
.cal-event.ai-suggestion::before {
  content: 'AI';
  position: absolute;
  top: 5px;
  left: 6px;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: rgba(var(--metal-rgb), 0.7);
  text-transform: uppercase;
}
.cal-event.ai-suggestion:hover {
  background: rgba(var(--metal-rgb), 0.20);
  border-color: rgba(var(--metal-rgb), 0.85);
}
.cal-event.ai-suggestion .cal-event-badge {
  position: absolute;
  top: 5px;
  right: 6px;
  background: var(--gold-primary);
  color: #1a1200;
  font-size: 10px;
  font-weight: 700;
  border-radius: 8px;
  padding: 2px 5px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.cal-event.ai-suggestion .cal-event-title {
  padding-left: 1.2rem;
}
.cal-suggestion-actions {
  display: flex;
  gap: 5px;
  margin-top: 5px;
}
.cal-suggestion-actions .btn {
  font-size: 11px;
  padding: 3px 8px;
  border-radius: 12px;
  cursor: pointer;
  pointer-events: all;
}
@keyframes ai-accept-pulse {
  0%   { opacity: 1; transform: scale(1); }
  50%  { opacity: 0.5; transform: scale(0.97); }
  100% { opacity: 0; transform: scale(0.94); }
}
.cal-event.ai-accepting {
  animation: ai-accept-pulse 0.35s ease-out forwards;
  pointer-events: none;
}

/* ── Week View Grid ────────────────────────────────────────────────────────── */
.cal-wk-headers {
  display: flex;
  align-items: flex-end;
  padding-left: 52px;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}
.cal-wk-timecol {
  width: 52px;
  flex-shrink: 0;
}
.cal-wk-col-header {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 8px 4px;
  cursor: pointer;
  border-radius: 8px 8px 0 0;
  transition: background 0.15s;
}
.cal-wk-col-header.today {
  background: rgba(var(--metal-rgb), 0.08);
}
.cal-wk-dayname {
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--gray);
}
.cal-wk-datenum {
  font-family: 'JetBrains Mono', monospace;
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--text-primary);
}
.cal-wk-datenum.today-dot {
  color: var(--gold-primary);
}
.cal-wk-grid {
  position: relative;
  overflow: visible;
  min-width: 760px;
}
.cal-wk-header { min-width:760px; }
.cal-wk-row {
  position: relative;
  height: 60px;
  display: flex;
  align-items: stretch;
}
.cal-wk-row .cal-hour-label {
  position: absolute;
  top: -10px;
  width: 46px;
  text-align: right;
  font-size: 0.7rem;
  color: var(--gray);
  font-family: 'JetBrains Mono', monospace;
}
.cal-wk-cell {
  flex: 1;
  border-right: 1px solid rgba(255,255,255,0.05);
  border-bottom: 1px solid rgba(255,255,255,0.05);
}
.cal-wk-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  pointer-events: none;
}
.cal-wk-overlay .cal-event,
.cal-wk-overlay [data-event-type] {
  pointer-events: all;
}
.cal-wk-nowline {
  position: absolute;
  left: 0;
  right: 0;
  height: 2px;
  background: #ef4444;
  z-index: 5;
  pointer-events: none;
}

/* ── Month Grid ─────────────────────────────────────────────────────────────── */
.cal-mo-grid {
  display: flex;
  flex-direction: column;
}
.cal-mo-header {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  border-bottom: 1px solid rgba(255,255,255,0.08);
}
.cal-mo-dayname {
  text-align: center;
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--gray);
  padding: 8px 0;
}
.cal-mo-cells {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
}
.cal-mo-cell {
  min-height: 80px;
  padding: 6px;
  border-right: 1px solid rgba(255,255,255,0.04);
  border-bottom: 1px solid rgba(255,255,255,0.04);
  cursor: pointer;
  transition: background 0.15s;
}
.cal-mo-cell.other-month {
  opacity: 0.35;
}
.cal-mo-cell.today {
  background: rgba(var(--metal-rgb), 0.06);
}
.cal-mo-cell.selected {
  background: rgba(var(--metal-rgb), 0.12);
  border-color: rgba(var(--metal-rgb), 0.2);
}
.cal-mo-date {
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--text-primary);
}
.cal-mo-dots {
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
  margin-top: 5px;
}
.cal-mo-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
}
.cal-mo-dot.quest { background: var(--gold-primary); }
.cal-mo-dot.work     { background: var(--cal-work); }
.cal-mo-dot.exercise { background: var(--cal-exercise); }
.cal-mo-dot.meal     { background: var(--cal-meal); }
.cal-mo-dot.sleep    { background: var(--cal-sleep); }
.cal-mo-dot.free     { background: var(--cal-free); }
.cal-mo-dot.social   { background: var(--cal-social); }

/* ── Calendar Header / Tab Chrome ──────────────────────────────────────────── */
.cal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.75rem 1rem;
  flex-wrap: wrap;
}
.cal-header-left {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}
.cal-header-right {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}
.cal-date-nav {
  display: flex;
  align-items: center;
  gap: 4px;
}
.cal-nav-btn {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,0.1);
  background: transparent;
  color: var(--text-secondary);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.15s;
}
.cal-nav-btn:hover {
  background: rgba(255,255,255,0.06);
  color: var(--text-primary);
}
.cal-today-btn {
  height: 32px;
  padding: 0 12px;
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,0.1);
  background: transparent;
  color: var(--text-secondary);
  font-size: 0.82rem;
  cursor: pointer;
  transition: all 0.15s;
}
.cal-today-btn:hover {
  background: rgba(255,255,255,0.06);
}
.cal-date-title {
  font-family: 'Syne', sans-serif;
  font-size: 1rem;
  font-weight: 600;
  color: var(--text-primary);
}
.cal-view-tabs {
  display: flex;
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 10px;
  padding: 3px;
}
.cal-view-tab {
  padding: 5px 14px;
  border-radius: 7px;
  border: none;
  background: transparent;
  color: var(--gray);
  font-size: 0.82rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.15s;
}
.cal-view-tab.active {
  background: rgba(var(--metal-rgb), 0.15);
  color: var(--gold-primary);
}
.cal-view-tab:not(.active):hover {
  color: var(--text-primary);
}
.cal-manage-btn {
  font-size: 0.8rem;
  color: var(--gold);
  text-decoration: none;
  padding: 5px 10px;
  border: 1px solid rgba(var(--metal-rgb), 0.3);
  border-radius: 8px;
  transition: all 0.15s;
}
.cal-manage-btn:hover {
  background: rgba(var(--metal-rgb), 0.08);
}

/* ── Now-line ──────────────────────────────────────────────────────────────── */
.cal-now-line {
  position: absolute;
  left: 52px;
  right: 0;
  height: 2px;
  background: #ef4444;
  z-index: 10;
  pointer-events: none;
}

/* ── Unscheduled Strip ─────────────────────────────────────────────────────── */
.cal-unscheduled-strip {
  padding: 0.75rem 1rem;
}
.cal-unscheduled-label {
  font-size: 0.78rem;
  color: var(--gray);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin-bottom: 0.5rem;
}
.cal-unscheduled-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.cal-unscheduled-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 20px;
  padding: 4px 10px;
  font-size: 0.8rem;
  cursor: pointer;
  min-width: 44px;
  min-height: 44px;
  transition: all 0.15s;
}
.cal-unscheduled-chip:hover {
  background: rgba(var(--metal-rgb), 0.1);
  border-color: rgba(var(--metal-rgb), 0.3);
}
.cal-unscheduled-chip-icon {
  font-size: 0.9rem;
}
.cal-unscheduled-chip-name {
  color: var(--text-primary);
}
.cal-unscheduled-chip-dur {
  font-size: 0.72rem;
  color: var(--gray);
}

/* ── Create Block Form ─────────────────────────────────────────────────────── */
.cal-create-form {
  position: absolute;
  left: 52px;
  right: 4px;
  background: rgba(20,20,20,0.95);
  border: 1px solid rgba(var(--metal-rgb), 0.3);
  border-radius: 12px;
  padding: 12px;
  z-index: 20;
  display: flex;
  flex-direction: column;
  gap: 8px;
  backdrop-filter: blur(12px);
}
.cal-create-form input[type="text"],
.cal-create-form input[type="time"] {
  width: 100%;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 8px;
  color: var(--text-primary);
  padding: 8px 10px;
  font-size: 0.85rem;
  font-family: 'DM Sans', sans-serif;
  outline: none;
}
.cal-create-form input[type="time"] {
  width: auto;
}
.cal-create-form-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.cal-create-btns {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

/* ── Event / Quest Modal ────────────────────────────────────────────────────── */
.cal-event-modal {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.6);
  z-index: 100;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  backdrop-filter: blur(4px);
}
.cal-event-modal-card {
  background: rgba(18,18,18,0.97);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 16px;
  padding: 1.5rem;
  max-width: 400px;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  backdrop-filter: blur(16px);
}
.cal-event-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.cal-event-modal-title {
  font-family: 'Syne', sans-serif;
  font-size: 1.1rem;
  font-weight: 600;
}
.cal-event-modal-close {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,0.1);
  background: transparent;
  color: var(--gray);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.85rem;
  transition: all 0.15s;
}
.cal-event-modal-close:hover {
  background: rgba(255,255,255,0.08);
}
.cal-event-modal-meta {
  font-size: 0.85rem;
  color: var(--gray);
}
.cal-event-modal-tag {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 20px;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.cal-event-modal-tag.quest { background: rgba(var(--metal-rgb), 0.15); color: var(--gold); }
.cal-event-modal-tag.work     { background: rgba(99,102,241,0.15); color: var(--cal-work); }
.cal-event-modal-tag.exercise { background: rgba(34,197,94,0.15);  color: var(--cal-exercise); }
.cal-event-modal-tag.meal     { background: rgba(249,115,22,0.15); color: var(--cal-meal); }
.cal-event-modal-tag.sleep    { background: rgba(167,139,250,0.15); color: var(--cal-sleep); }
.cal-event-modal-tag.free     { background: rgba(var(--metal-rgb), 0.15); color: var(--cal-free); }
.cal-event-modal-tag.social   { background: rgba(236,72,153,0.15); color: var(--cal-social); }
.cal-event-modal-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 0.25rem;
}

/* ── Schedule Intelligence Card ─────────────────────────────────────────────── */
.gcal-schedule-intel {
  margin-top: 12px;
}
.gcal-schedule-intel-loading {
  color: var(--gray);
  font-size: 0.8rem;
  padding: 4px 0;
}
.gcal-schedule-intel-card {
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 10px 12px;
}
.gcal-schedule-intel-title {
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-muted, #888);
  margin-bottom: 8px;
}
.gcal-si-row {
  display: flex;
  gap: 12px;
}
.gcal-si-metric {
  flex: 1;
  text-align: center;
}
.gcal-si-value {
  font-size: 1.4rem;
  font-weight: 700;
  color: var(--text-primary, #fff);
  line-height: 1;
}
.gcal-si-label {
  font-size: 0.68rem;
  color: var(--gray, #888);
  margin-top: 3px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
/* ═══════════════════════════════════════════════════════════
   IDENTITY EVOLUTION — TRI-BASELINE ENGINE
   ═══════════════════════════════════════════════════════════ */

/* Tri-baseline 3-column layout */
.identity-tri-baseline {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 1rem;
  margin-bottom: 1.5rem;
}

/* Summary cards row */
.identity-summary-row {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 1rem;
  margin-bottom: 1.5rem;
}
.identity-summary-card {
  background: var(--card-surface);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 1rem;
  text-align: center;
}
.identity-summary-card.aligned { border-top: 2px solid #5ab85a; }
.identity-summary-card.near    { border-top: 2px solid var(--gold-primary); }
.identity-summary-card.drifted { border-top: 2px solid #e07070; }
.isc-label { font-size: 0.72rem; color: var(--text-muted); margin-bottom: 0.3rem; }
.isc-value { font-size: 1.6rem; font-weight: 700; color: var(--gold); line-height: 1.1; }
.isc-dims  { font-size: 0.68rem; color: var(--text-muted); margin-top: 0.25rem; }

/* Tri-baseline column */
.itb-col {
  background: var(--card-surface);
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
}
.itb-header {
  padding: 0.7rem 0.85rem;
  font-size: 0.78rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.itb-header.starter { background: rgba(255,255,255,0.04); color: var(--text-muted); }
.itb-header.active  { background: rgba(var(--metal-rgb), 0.12);  color: var(--gold); }
.itb-header.vision  { background: rgba(90,184,90,0.1);    color: #5ab85a; }
.itb-body { padding: 0.5rem 0; }
.itb-dim {
  padding: 0.45rem 0.85rem;
  border-bottom: 1px solid rgba(255,255,255,0.04);
}
.itb-dim:last-child { border-bottom: none; }
.itb-dim-name  { font-size: 0.73rem; color: var(--text-muted); }
.itb-dim-state { font-size: 0.78rem; font-weight: 600; color: var(--text-primary); margin-top: 0.1rem; }

/* Dimension detail cards */
.identity-dim-details { margin-top: 1.5rem; }
.identity-cards-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 1rem;
  margin-top: 0.75rem;
}
.identity-dim-card {
  background: var(--card-surface);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 1rem;
}
.idc-header {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  margin-bottom: 0.75rem;
}
.idc-emoji { font-size: 1.1rem; }
.idc-name  { font-weight: 700; font-size: 0.88rem; flex: 1; text-transform: capitalize; }
.idc-gap   { font-size: 0.7rem; font-weight: 600; }
.idc-states { margin-bottom: 0.75rem; }
.idc-state-row { display: flex; justify-content: space-between; padding: 0.2rem 0; border-bottom: 1px solid rgba(255,255,255,0.04); }
.idc-state-row:last-child { border-bottom: none; }
.idc-state-label { font-size: 0.72rem; color: var(--text-muted); }
.idc-state-val   { font-size: 0.72rem; font-weight: 600; }
.idc-evidence    { font-size: 0.72rem; color: var(--text-muted); padding-top: 0.5rem; border-top: 1px solid rgba(255,255,255,0.04); }
.ie-evidence-item { padding: 0.2rem 0; }

/* Drift alert */
.drift-alert-box {
  background: rgba(224,112,112,0.08);
  border: 1px solid rgba(224,112,112,0.3);
  border-radius: 8px;
  padding: 1rem;
}
.drift-item { padding: 0.4rem 0; border-bottom: 1px solid rgba(255,255,255,0.05); font-size: 0.85rem; }
.drift-item:last-child { border-bottom: none; }

/* ── Mobile: ≤ 480px ── */
@media (max-width: 480px) {
  .identity-tri-baseline,
  .identity-summary-row {
    grid-template-columns: 1fr;
  }
  .identity-cards-grid {
    grid-template-columns: 1fr;
  }
}

/* ── Aspirations ─────────────────────────────────────────────────────────────
   CSS-var aliases bridge the component (uses --bg-primary etc.) to the app's
   actual token scheme (--bg-void, --bg-surface, --border-subtle, etc.).
   Missing utility classes are also defined here.
──────────────────────────────────────────────────────────────────────────── */

/* Alias tokens so the aspirations component works with the app's design system */
:root {
  --bg-primary:   var(--bg-void,   #0e0c08);
  --bg-secondary: var(--bg-surface, #181410);
  --border:       var(--border-subtle, rgba(var(--metal-rgb), 0.15));
  --text:         var(--text-primary, #e8d5b0);
  --zone-success: var(--success,    #4caf50);
  --zone-growth:  #8bc34a;
  --zone-energy:  #29b6f6;
  --zone-critical: var(--danger,   #f44336);
}

/* Progress bar */
.progress-track {
  background: rgba(255,255,255,0.08);
  border-radius: 4px;
  height: 6px;
  overflow: hidden;
}
.progress-fill {
  height: 100%;
  border-radius: 4px;
  transition: width 0.4s ease;
}

/* Aspiration card */
.asp-card {
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.asp-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 16px rgba(var(--metal-rgb), 0.12);
}

/* Empty state */
.empty-state {
  text-align: center;
  padding: 3rem 1.5rem;
  color: var(--text-secondary, #8a7e6c);
}
.empty-state p {
  margin: 0.5rem 0;
  font-size: 0.88rem;
  line-height: 1.5;
}

@media (max-width: 375px) {
  .asp-card { padding: 1rem !important; }
}

/* ═══════════════════════════════════════════════════════════
   EVOLUTION REPORT — COMPONENT STYLES
   ═══════════════════════════════════════════════════════════ */

/* Page header */
.evolution-page-header {
  margin-bottom: 2rem;
}
.evolution-page-label {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--gold, var(--gold-primary));
  margin-bottom: 0.4rem;
}
.evolution-page-header h1 {
  font-family: 'Syne', sans-serif;
  font-size: 2rem;
  font-weight: 700;
  color: var(--text-primary, #e8d5b0);
  margin: 0 0 0.4rem;
  letter-spacing: -0.02em;
}
.evolution-page-sub {
  font-size: 0.88rem;
  color: var(--text-muted, #6b6355);
  line-height: 1.5;
  max-width: 560px;
}

/* Loading skeleton */
.evo-skeleton {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.evo-skel-block {
  background: linear-gradient(90deg,
    rgba(255,255,255,0.04) 0%,
    rgba(255,255,255,0.08) 50%,
    rgba(255,255,255,0.04) 100%);
  background-size: 200% 100%;
  animation: evo-shimmer 1.6s ease-in-out infinite;
  border-radius: 10px;
}
.evo-skel-header { height: 72px; }
.evo-skel-stats  { height: 56px; }
.evo-skel-body   { height: 180px; }
.evo-skel-insight{ height: 64px; }
@keyframes evo-shimmer {
  0%   { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* Error state */
.evo-error-state {
  background: var(--card-surface, #181410);
  border: 1px solid rgba(224,112,112,0.3);
  border-radius: 12px;
  padding: 2rem;
  text-align: center;
}
.evo-error-icon { font-size: 2rem; margin-bottom: 0.75rem; }
.evo-error-title {
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--text-primary, #e8d5b0);
  margin-bottom: 0.4rem;
}
.evo-error-msg {
  font-size: 0.84rem;
  color: #e07070;
  margin-bottom: 1.25rem;
  font-family: monospace;
  background: rgba(224,112,112,0.07);
  padding: 0.5rem 0.75rem;
  border-radius: 6px;
  word-break: break-all;
}
.evo-error-sub {
  font-size: 0.84rem;
  color: var(--text-muted, #6b6355);
  margin-bottom: 1.25rem;
}

/* Main card */
.evolution-card {
  background: var(--card-surface, #181410);
  border: 1px solid var(--border-subtle, rgba(var(--metal-rgb), 0.15));
  border-radius: 16px;
  overflow: hidden;
  margin-bottom: 1.25rem;
}

/* Card header */
.evo-card-header {
  padding: 1.5rem 1.5rem 1rem;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.evo-week-badge {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--gold, var(--gold-primary));
  margin-bottom: 0.4rem;
}
.evo-card-title {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--text-primary, #e8d5b0);
  font-family: 'Syne', sans-serif;
  letter-spacing: -0.01em;
}
.evo-milestones { margin-top: 0.6rem; display: flex; gap: 0.5rem; flex-wrap: wrap; }
.evo-milestone-badge {
  font-size: 0.72rem;
  font-weight: 700;
  background: rgba(var(--metal-rgb), 0.12);
  color: var(--gold, var(--gold-primary));
  padding: 0.25rem 0.6rem;
  border-radius: 20px;
  border: 1px solid rgba(var(--metal-rgb), 0.25);
}

/* Stats row */
.evo-stats-row {
  display: flex;
  gap: 0;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.evo-stat {
  flex: 1;
  padding: 1rem 0.5rem;
  text-align: center;
  border-right: 1px solid rgba(255,255,255,0.06);
}
.evo-stat:last-child { border-right: none; }
.evo-stat-value {
  font-size: 1.4rem;
  font-weight: 800;
  color: var(--gold, var(--gold-primary));
  line-height: 1.1;
}
.evo-stat-unit { font-size: 0.72rem; font-weight: 500; opacity: 0.7; }
.evo-stat-label { font-size: 0.68rem; color: var(--text-muted, #6b6355); margin-top: 0.2rem; }

/* Narrative */
.evo-narrative {
  padding: 1.25rem 1.5rem;
  line-height: 1.75;
  color: var(--text-secondary, #a89880);
  font-size: 0.92rem;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.evo-narrative p + p { margin-top: 0.85rem; }

/* Identity trajectory section */
.evo-identity-trajectory {
  padding: 1.25rem 1.5rem;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.evo-section-label {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-muted, #6b6355);
  margin-bottom: 0.75rem;
}
.evo-trajectory-row {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
}
.evo-trajectory-node {
  flex: 1;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 8px;
  padding: 0.75rem 0.85rem;
  font-size: 0.82rem;
}
.evo-trajectory-node.node-past   { border-left: 2px solid rgba(255,255,255,0.15); }
.evo-trajectory-node.node-now    { border-left: 2px solid var(--gold, var(--gold-primary)); }
.evo-trajectory-node.node-future { border-left: 2px solid #5ab85a; }
.evo-tnode-label {
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-muted, #6b6355);
  margin-bottom: 0.3rem;
}
.evo-tnode-text { color: var(--text-primary, #e8d5b0); line-height: 1.4; }
.evo-trajectory-arrow {
  color: var(--text-muted, #6b6355);
  font-size: 0.9rem;
  padding-top: 1rem;
  flex-shrink: 0;
}

/* Active shifts section */
.evo-active-shifts {
  padding: 1.25rem 1.5rem;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.evo-shift-list { display: flex; flex-direction: column; gap: 0.6rem; margin-top: 0.5rem; }
.evo-shift-item {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.65rem 0.85rem;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 8px;
}
.evo-shift-item.is-aligned { border-left: 2px solid #5ab85a; }
.evo-shift-item.is-progress { border-left: 2px solid var(--gold, var(--gold-primary)); }
.evo-shift-dim {
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--text-primary, #e8d5b0);
  text-transform: capitalize;
  flex: 1;
}
.evo-shift-states {
  font-size: 0.75rem;
  color: var(--text-muted, #6b6355);
  white-space: nowrap;
}
.evo-shift-aligned-badge {
  font-size: 0.68rem;
  font-weight: 700;
  color: #5ab85a;
  background: rgba(90,184,90,0.1);
  padding: 0.15rem 0.45rem;
  border-radius: 12px;
}

/* Tri-baseline gap movement */
.evo-tribas-section {
  padding: 1.25rem 1.5rem;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.evo-tribas-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 0.6rem;
  margin-top: 0.5rem;
}
.evo-tribas-item {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 8px;
  padding: 0.65rem 0.85rem;
}
.evo-tribas-dim {
  font-size: 0.72rem;
  font-weight: 600;
  color: var(--text-muted, #6b6355);
  text-transform: capitalize;
  margin-bottom: 0.3rem;
}
.evo-tribas-states {
  font-size: 0.8rem;
  color: var(--text-primary, #e8d5b0);
}
.evo-tribas-arrow { color: var(--gold, var(--gold-primary)); margin: 0 0.25rem; }
.evo-tribas-aligned { color: #5ab85a; font-size: 0.72rem; font-weight: 600; }

/* Insight card */
.evo-insight-card {
  margin: 0 1.5rem 1.25rem;
  background: linear-gradient(135deg, rgba(var(--metal-rgb), 0.07), rgba(var(--metal-rgb), 0.03));
  border: 1px solid rgba(var(--metal-rgb), 0.2);
  border-radius: 10px;
  padding: 1rem 1.25rem;
}
.evo-insight-label {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--gold, var(--gold-primary));
  margin-bottom: 0.4rem;
}
.evo-insight-text {
  font-size: 0.92rem;
  color: var(--text-primary, #e8d5b0);
  line-height: 1.5;
}

/* Domain pills */
.evo-domains-section { padding: 0 1.5rem 1.25rem; }
.evo-domains-grid { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 0.5rem; }
.evo-domain-pill {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.3rem 0.75rem;
  border-radius: 20px;
  border: 1px solid currentColor;
  font-size: 0.8rem;
  color: var(--domain-color, var(--gold-primary));
  background: color-mix(in srgb, var(--domain-color, var(--gold-primary)) 10%, transparent);
}
.evo-domain-name { font-weight: 600; text-transform: capitalize; }
.evo-domain-count { font-weight: 700; }

/* Next week */
.evo-next-week { padding: 0 1.5rem 1.25rem; }
.evo-next-week-text {
  font-size: 0.88rem;
  color: var(--text-secondary, #a89880);
  line-height: 1.6;
  background: rgba(255,255,255,0.03);
  border-left: 2px solid var(--gold, var(--gold-primary));
  padding: 0.75rem 1rem;
  border-radius: 0 8px 8px 0;
  margin-top: 0.5rem;
}

/* Identity shift */
.evo-identity-shift {
  padding: 0 1.5rem 1.25rem;
}
.evo-identity-shift-text {
  font-size: 0.88rem;
  color: #a0d8a0;
  line-height: 1.5;
  background: rgba(90,184,90,0.06);
  border-left: 2px solid #5ab85a;
  padding: 0.75rem 1rem;
  border-radius: 0 8px 8px 0;
  margin-top: 0.5rem;
}

/* Footer */
.evo-card-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.85rem 1.5rem;
  border-top: 1px solid rgba(255,255,255,0.06);
}
.evo-share-hint {
  font-size: 0.78rem;
  color: var(--text-muted, #6b6355);
}

/* Past reports */
.evo-past-header {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-muted, #6b6355);
  margin-bottom: 0.75rem;
}
.evo-past-list { display: flex; flex-direction: column; gap: 0.5rem; }
.evo-past-item {
  background: var(--card-surface, #181410);
  border: 1px solid var(--border-subtle, rgba(var(--metal-rgb), 0.15));
  border-radius: 10px;
  padding: 0.85rem 1rem;
  cursor: pointer;
  transition: border-color 0.15s;
}
.evo-past-item:hover { border-color: rgba(var(--metal-rgb), 0.35); }
.evo-past-week { font-size: 0.84rem; font-weight: 600; color: var(--text-primary, #e8d5b0); margin-bottom: 0.3rem; }
.evo-past-stats { font-size: 0.75rem; color: var(--text-muted, #6b6355); display: flex; gap: 0.75rem; margin-bottom: 0.3rem; }
.evo-past-insight { font-size: 0.78rem; color: var(--text-secondary, #a89880); line-height: 1.4; }

/* Empty state */
.evolution-empty-card {
  background: var(--card-surface, #181410);
  border: 1px solid var(--border-subtle, rgba(var(--metal-rgb), 0.15));
  border-radius: 16px;
  padding: 2.5rem 2rem;
  text-align: center;
  max-width: 520px;
  margin: 0 auto;
}
.evo-empty-icon { font-size: 2.5rem; margin-bottom: 1rem; }
.evolution-empty-card h2 {
  font-size: 1.3rem;
  font-weight: 700;
  color: var(--text-primary, #e8d5b0);
  margin-bottom: 0.6rem;
  font-family: 'Syne', sans-serif;
}
.evolution-empty-card p {
  font-size: 0.88rem;
  color: var(--text-muted, #6b6355);
  line-height: 1.6;
  margin-bottom: 1.25rem;
  max-width: 380px;
  margin-left: auto;
  margin-right: auto;
}
.evo-generate-note {
  font-size: 0.78rem;
  color: var(--text-muted, #6b6355);
  margin-top: 0.75rem;
  min-height: 1.2em;
}
.evo-empty-biography {
  background: rgba(var(--metal-rgb), 0.06);
  border: 1px solid rgba(var(--metal-rgb), 0.15);
  border-radius: 10px;
  padding: 0.85rem 1rem;
  font-size: 0.84rem;
  color: var(--text-secondary, #a89880);
  line-height: 1.5;
  margin-bottom: 1.25rem;
  text-align: left;
}
.evo-empty-shifts {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  margin-bottom: 1.25rem;
  text-align: left;
}
.evo-empty-shift-item {
  font-size: 0.8rem;
  color: var(--text-muted, #6b6355);
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.evo-empty-shift-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--gold, var(--gold-primary));
  flex-shrink: 0;
}

/* Path recommendations panel */
.path-rec-empty { text-align: center; padding: 1.5rem; }
.path-rec-empty-icon { font-size: 2rem; margin-bottom: 0.5rem; }
.path-rec-empty-title { font-size: 0.95rem; font-weight: 600; color: var(--text-primary, #e8d5b0); margin-bottom: 0.4rem; }
.path-rec-empty-text { font-size: 0.82rem; color: var(--text-muted, #6b6355); line-height: 1.5; }
.path-rec-description { font-size: 0.82rem; color: var(--text-muted, #6b6355); margin-bottom: 0.75rem; }
.path-rec-list { display: flex; flex-direction: column; gap: 0.75rem; }
.path-rec-item { padding: 0.85rem; background: rgba(255,255,255,0.03); border-radius: 8px; border: 1px solid rgba(255,255,255,0.07); }
.path-rec-item.is-recommended { border-color: rgba(var(--metal-rgb), 0.25); background: rgba(var(--metal-rgb), 0.04); }
.path-rec-item-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 0.4rem; }
.path-rec-item-title { font-size: 0.88rem; font-weight: 600; color: var(--text-primary, #e8d5b0); text-transform: capitalize; }
.path-rec-item-badge { font-size: 0.68rem; font-weight: 700; color: var(--gold, var(--gold-primary)); background: rgba(var(--metal-rgb), 0.12); padding: 0.15rem 0.45rem; border-radius: 12px; }
.path-rec-item-rank { font-size: 0.75rem; color: var(--text-muted, #6b6355); }
.path-rec-scores { display: flex; gap: 0.75rem; font-size: 0.78rem; color: var(--text-muted, #6b6355); margin-bottom: 0.35rem; }
.path-rec-basis { font-size: 0.75rem; color: var(--text-muted, #6b6355); margin-bottom: 0.4rem; }
.path-rec-success-bar { height: 3px; background: rgba(255,255,255,0.06); border-radius: 2px; overflow: hidden; }
.path-rec-success-fill { height: 100%; background: var(--gold, var(--gold-primary)); border-radius: 2px; }

/* ── Mobile: ≤ 480px ── */
@media (max-width: 480px) {
  .evo-stats-row { flex-wrap: wrap; }
  .evo-stat { flex: 0 0 33.33%; }
  .evo-trajectory-row { flex-direction: column; }
  .evo-trajectory-arrow { transform: rotate(90deg); align-self: center; }
  .evolution-page-header h1 { font-size: 1.6rem; }
  .evo-tribas-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 375px) {
  .evolution-page-header h1 { font-size: 1.4rem; }
  .evo-stat { flex: 0 0 50%; }
  .evo-card-footer { flex-direction: column; gap: 0.5rem; text-align: center; }
  .evo-tribas-grid { grid-template-columns: 1fr; }
  .evolution-empty-card { padding: 1.5rem 1rem; }
}

/* ── AP Context Card — ambient intelligence layer ── */
.ap-context-card {
  background: rgba(123, 104, 238, 0.06);
  border: 1px solid rgba(123, 104, 238, 0.18);
  border-radius: 10px;
  padding: 0.75rem 1rem;
  margin-bottom: 1.25rem;
  font-size: 0.85rem;
  color: var(--text-secondary, #a8a4a0);
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  line-height: 1.5;
}
.ap-context-card .ap-insight-icon { font-size: 1rem; flex-shrink: 0; margin-top: 1px; }
.ap-context-card .ap-insight-body { flex: 1; }
.ap-context-card .ap-insight-action { margin-top: 0.35rem; }
.ap-context-card .ap-insight-action button {
  background: none;
  border: none;
  color: var(--ai-primary, #7b68ee);
  font-size: 0.8rem;
  cursor: pointer;
  padding: 0;
  font-family: inherit;
}
.ap-context-card .ap-insight-dismiss {
  background: none;
  border: none;
  color: var(--text-muted, #6b6762);
  font-size: 0.75rem;
  cursor: pointer;
  padding: 0;
  margin-left: 0.5rem;
  font-family: inherit;
  opacity: 0.6;
}
.ap-context-card .ap-insight-dismiss:hover { opacity: 1; }

/* ── Relationships Page ── */
.relationship-intelligence-page {
  display: grid;
  gap: var(--ui-screen-gap, 1rem);
}
.relationship-intelligence-page #relationships-content {
  min-width: 0;
  max-width: 1280px;
}
.relationship-page-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.55rem;
  flex-wrap: wrap;
}
.relationship-card {
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.relationship-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
}
.relationship-type-badge {
  font-family: 'DM Sans', sans-serif;
  font-weight: 600;
  text-transform: capitalize;
  letter-spacing: 0.02em;
}
@media (max-width: 760px) {
  .relationship-intelligence-page #relationships-content > div:first-child {
    align-items: flex-start !important;
    gap: 0.85rem;
    flex-direction: column;
  }
  .relationship-page-actions {
    justify-content: stretch;
    width: 100%;
  }
  .relationship-page-actions .btn {
    flex: 1 1 9rem;
    min-height: 44px;
  }
  #rel-grid { grid-template-columns: 1fr !important; }
  #rel-empty { padding: 2rem 0.75rem !important; }
}

/* ═══════════════════════════════════════════════════════════
   WEATHER INTELLIGENCE CARDS
   ═══════════════════════════════════════════════════════════ */

.weather-card { border-left: 3px solid var(--gold); }

.aqi-badge {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 12px;
  font-size: 0.75rem;
  font-weight: 600;
}
.aqi-good { background: #4ade80; color: #052e16; }
.aqi-moderate { background: #facc15; color: #1c1917; }
.aqi-unhealthy { background: #f87171; color: #1c1917; }

.uv-bar {
  height: 6px;
  border-radius: 3px;
  background: var(--bg-tertiary);
  overflow: hidden;
}
.uv-fill {
  height: 100%;
  border-radius: 3px;
  transition: width 0.3s;
}

.weather-alert-banner {
  background: rgba(248,113,113,0.15);
  border: 1px solid #f87171;
  border-radius: 8px;
  padding: 0.5rem 0.75rem;
  margin-top: 0.5rem;
  font-size: 0.8rem;
  color: #f87171;
}

.forecast-row {
  display: flex;
  gap: 0.5rem;
  overflow-x: auto;
  padding: 0.25rem 0;
  scrollbar-width: thin;
}
.forecast-day {
  flex: 0 0 auto;
  text-align: center;
  min-width: 48px;
  padding: 0.25rem;
}

/* ── Financial Upload (Layer 2/3) ───────────────────────────────────── */

.fi-upload-zone {
  transition: border-color 0.2s ease, background 0.2s ease;
}
.fi-upload-zone:hover {
  border-color: rgba(var(--metal-rgb), 0.5) !important;
  background: rgba(var(--metal-rgb), 0.04);
}
.fi-upload-zone.drag-over {
  border-color: rgba(var(--metal-rgb), 0.8) !important;
  background: rgba(var(--metal-rgb), 0.08);
}

.fi-upload-queue-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem;
  background: #1c1917;
  border-radius: 6px;
  font-size: 0.75rem;
  color: #e0d8cc;
  margin-bottom: 0.25rem;
}
.fi-upload-queue-item .progress-bar {
  height: 3px;
  background: #2a2520;
  border-radius: 2px;
  overflow: hidden;
  margin-top: 0.25rem;
}
.fi-upload-queue-item .progress-bar .fill {
  height: 100%;
  background: var(--gold-primary);
  transition: width 0.3s ease;
}

.fi-doc-card {
  background: #141420;
  border: 1px solid rgba(var(--metal-rgb), 0.1);
  border-radius: 8px;
  padding: 0.75rem;
  margin-bottom: 0.5rem;
}

.fi-extracted-summary {
  max-height: 320px;
  overflow-y: auto;
}
.fi-extracted-summary .field-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.35rem 0;
  border-bottom: 1px solid #2a2520;
  font-size: 0.72rem;
}
.fi-extracted-summary .field-row .label {
  color: #a09080;
  text-transform: capitalize;
}
.fi-extracted-summary .field-row .value {
  color: #e0d8cc;
  display: flex;
  align-items: center;
  gap: 0.25rem;
}
.fi-extracted-summary .field-row .conf-badge {
  font-size: 0.6rem;
  padding: 0.1rem 0.3rem;
  border-radius: 3px;
}
.fi-extracted-summary .field-row .conf-high { background: rgba(76, 175, 125, 0.15); color: #4caf7d; }
.fi-extracted-summary .field-row .conf-mid  { background: rgba(249, 168, 37, 0.15);  color: #f9a825; }
.fi-extracted-summary .field-row .conf-low  { background: rgba(224, 122, 95, 0.15);  color: #e07a5f; }

.fi-confidence-bar {
  height: 4px;
  background: #2a2520;
  border-radius: 2px;
  overflow: hidden;
  margin-top: 0.2rem;
}
.fi-confidence-bar .fill {
  height: 100%;
  border-radius: 2px;
  transition: width 0.3s ease;
}

.fi-history-chart {
  height: 80px;
  margin: 0.5rem 0;
  display: flex;
  align-items: flex-end;
  gap: 2px;
}
.fi-history-chart .bar {
  flex: 1;
  min-width: 4px;
  border-radius: 2px 2px 0 0;
  transition: height 0.3s ease;
}
.fi-history-chart .bar.up   { background: #4caf7d; }
.fi-history-chart .bar.down { background: #e07a5f; }
.fi-history-chart .bar.neutral { background: #8a7f70; }

.fi-insight-card {
  background: linear-gradient(135deg, #1c1917, #252117);
  border: 1px solid rgba(var(--metal-rgb), 0.2);
  padding: 1rem;
  border-radius: 10px;
  margin-bottom: 1rem;
}

.fi-plaid-cta {
  background: #1c1917;
  border: 1px solid rgba(var(--metal-rgb), 0.13);
  padding: 1rem;
  border-radius: 10px;
  margin-bottom: 1rem;
  text-align: center;
}

.fi-section-header {
  font-size: 0.65rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #8a7f70;
}

.fi-card {
  background: #141420;
  border: 1px solid rgba(var(--metal-rgb), 0.08);
  border-radius: 10px;
  padding: 1rem;
}

.fi-tab-bar {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  padding: 0.35rem;
  background: rgba(20, 20, 32, 0.7);
  border: 1px solid rgba(var(--metal-rgb), 0.08);
  border-radius: 10px;
}

.fi-tab {
  flex: 1;
  min-width: 80px;
  padding: 0.55rem 0.5rem;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: #8a7f70;
  font: inherit;
  font-size: 0.75rem;
  cursor: pointer;
  text-align: center;
  transition: background 0.15s, color 0.15s;
}

.fi-tab.active,
.fi-tab:hover {
  background: rgba(200, 169, 110, 0.12);
  color: #e0d8cc;
}

.fi-tab.active {
  font-weight: 600;
}

/* ── Routine Engine ──────────────────────────────────────────────────────────── */

.routine-suggestion-card {
  background: #1a1a2e;
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 12px;
  padding: 1.2rem;
  margin-bottom: 1rem;
}
.routine-suggestion-card .suggestion-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 0.4rem;
}
.routine-suggestion-card .suggestion-name {
  font-size: 1rem;
  color: #fff;
}
.routine-suggestion-card .suggestion-goal-badge {
  background: rgba(167,139,250,0.15);
  color: #a78bfa;
  font-size: 0.7rem;
  padding: 2px 8px;
  border-radius: 20px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.routine-suggestion-card .suggestion-meta {
  font-size: 0.8rem;
  color: #8a8a9a;
  margin-bottom: 0.4rem;
  display: flex;
  gap: 0.4rem;
  align-items: center;
}
.routine-suggestion-card .meta-sep { opacity: 0.4; }
.routine-suggestion-card .suggestion-diff.beginner { color: #34d399; }
.routine-suggestion-card .suggestion-diff.intermediate { color: #fbbf24; }
.routine-suggestion-card .suggestion-diff.advanced { color: #f87171; }
.routine-suggestion-card .suggestion-muscle-groups {
  font-size: 0.78rem;
  color: #6b7280;
  margin-bottom: 0.3rem;
}
.routine-suggestion-card .suggestion-equipment {
  font-size: 0.78rem;
  color: #4b5563;
  margin-bottom: 0.8rem;
}
.routine-suggestion-card .suggestion-actions {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 0.8rem;
}

/* Routine Projection Card */
.routine-projection-card {
  background: rgba(167,139,250,0.08);
  border: 1px solid rgba(167,139,250,0.15);
  border-radius: 10px;
  padding: 0.9rem;
  margin: 0.8rem 0;
}
.routine-projection-card .proj-label {
  font-size: 0.65rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: #a78bfa;
  margin-bottom: 0.4rem;
}
.routine-projection-card .proj-title {
  font-size: 0.75rem;
  font-weight: 600;
  color: #a78bfa;
  margin-bottom: 0.4rem;
}
.routine-projection-card .proj-summary {
  font-size: 0.85rem;
  color: #e5e7eb;
  line-height: 1.4;
  margin-bottom: 0.4rem;
}
.routine-projection-card .proj-stat {
  font-size: 0.78rem;
  color: #9ca3af;
  margin-top: 0.2rem;
}
.routine-projection-card .proj-alignment {
  font-size: 0.78rem;
  color: #6ee7b7;
  margin-top: 0.2rem;
}
.routine-projection-card .proj-disclaimer {
  font-size: 0.68rem;
  color: #4b5563;
  font-style: italic;
  margin-top: 0.5rem;
}

/* Rejection Modal */
.routine-rejection-modal {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 1000;
  align-items: center;
  justify-content: center;
}
.routine-rejection-modal .modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.6);
  backdrop-filter: blur(4px);
}
.routine-rejection-modal .modal-card {
  position: relative;
  background: #1a1a2e;
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 14px;
  padding: 1.5rem;
  max-width: 400px;
  width: 90%;
}
.routine-rejection-modal h3 {
  font-size: 1rem;
  margin-bottom: 1rem;
  color: #fff;
}
.routine-rejection-modal .rejection-reasons {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin-bottom: 1rem;
}
.routine-rejection-modal .rejection-reason-btn {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px;
  padding: 0.7rem 1rem;
  color: #e5e7eb;
  font-size: 0.9rem;
  text-align: left;
  cursor: pointer;
  transition: background 0.15s;
}
.routine-rejection-modal .rejection-reason-btn:hover {
  background: rgba(255,255,255,0.1);
}
.replacement-notice {
  font-size: 0.8rem;
  color: #6b7280;
  text-align: center;
  margin-bottom: 0.8rem;
  padding: 0.5rem;
  background: rgba(255,255,255,0.03);
  border-radius: 8px;
}
.all-rejected-message {
  text-align: center;
  padding: 2rem 1rem;
  color: #9ca3af;
  font-size: 0.9rem;
  line-height: 1.6;
}

/* Active Routine Dashboard */
.routine-active-dashboard {
  background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
  border: 1px solid rgba(167,139,250,0.2);
  border-radius: 14px;
  padding: 1.2rem;
  margin-bottom: 1rem;
}
.routine-dashboard-header {
  margin-bottom: 0.8rem;
}
.routine-name-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0.3rem;
}
.routine-name-row strong {
  font-size: 1.05rem;
  color: #fff;
}
.routine-days-badge {
  background: rgba(167,139,250,0.2);
  color: #a78bfa;
  font-size: 0.72rem;
  padding: 2px 8px;
  border-radius: 20px;
  font-weight: 600;
}
.routine-meta-row {
  display: flex;
  gap: 0.4rem;
  align-items: center;
}
.routine-goal-badge {
  background: rgba(52,211,153,0.15);
  color: #34d399;
  font-size: 0.68rem;
  padding: 2px 7px;
  border-radius: 20px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.routine-diff-badge {
  font-size: 0.68rem;
  color: #6b7280;
  padding: 2px 7px;
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 20px;
  text-transform: capitalize;
}
.routine-today-session {
  font-size: 0.85rem;
  margin-bottom: 0.8rem;
  padding: 0.5rem 0;
  border-top: 1px solid rgba(255,255,255,0.04);
  border-bottom: 1px solid rgba(255,255,255,0.04);
}
.today-session-complete { color: #34d399; }
.today-session-pending { color: #9ca3af; }
.session-check { margin-right: 0.4rem; }
.session-dot { margin-right: 0.4rem; }
.routine-week-progress {
  margin-bottom: 0.8rem;
}
.week-progress-label {
  font-size: 0.8rem;
  color: #9ca3af;
  margin-bottom: 0.4rem;
}
.routine-actions {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin-top: 0.8rem;
}
.routine-secondary-actions {
  display: flex;
  justify-content: space-between;
  padding-top: 0.5rem;
}
.routine-secondary-actions .btn-link {
  font-size: 0.8rem;
  color: #6b7280;
  cursor: pointer;
  background: none;
  border: none;
  padding: 0;
}
.routine-secondary-actions .btn-link:hover { color: #a78bfa; }

/* Fullscreen Modal */
.fullscreen-modal {
  position: fixed;
  inset: 0;
  z-index: 500;
  background: #0f0f1a;
  overflow-y: auto;
}
.fullscreen-modal .modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1rem 1.2rem;
  border-bottom: 1px solid rgba(255,255,255,0.06);
  position: sticky;
  top: 0;
  background: #0f0f1a;
  z-index: 10;
}
.fullscreen-modal .modal-header h2 {
  font-size: 1rem;
  color: #fff;
}
.fullscreen-modal .modal-header .save-routine-btn {
  color: #a78bfa;
  font-weight: 600;
}
.fullscreen-modal .modal-header .save-routine-btn:disabled {
  color: #4b5563;
  cursor: not-allowed;
}

/* Custom Builder */
.custom-builder {
  min-height: 100vh;
  padding-bottom: 2rem;
}
.builder-step {
  padding: 1.2rem;
}
.builder-field {
  margin-bottom: 1.5rem;
}
.builder-field label {
  display: block;
  font-size: 0.8rem;
  color: #9ca3af;
  margin-bottom: 0.5rem;
}
.builder-field .form-input {
  width: 100%;
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px;
  color: #fff;
  padding: 0.7rem 1rem;
  font-size: 0.9rem;
}
.builder-field-note {
  margin: 0.55rem 0 0;
  color: rgba(229,231,235,0.62);
  font-size: 0.75rem;
  line-height: 1.45;
}
.builder-choice-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.65rem;
}
.builder-choice-grid.multi {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.builder-choice {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  min-height: 76px;
  padding: 0.8rem;
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px;
  background: rgba(255,255,255,0.04);
  color: #e5e7eb;
  cursor: pointer;
  transition: border-color 0.16s, background 0.16s, transform 0.16s;
}
.builder-choice.compact {
  min-height: 48px;
  justify-content: center;
}
.builder-choice:hover {
  border-color: rgba(var(--metal-rgb), 0.28);
  background: rgba(var(--metal-rgb), 0.07);
}
.builder-choice.selected {
  border-color: rgba(var(--metal-rgb), 0.55);
  background: rgba(var(--metal-rgb), 0.12);
  box-shadow: 0 0 0 1px rgba(var(--metal-rgb), 0.12) inset;
}
.builder-choice input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.builder-choice-title {
  font-size: 0.86rem;
  font-weight: 700;
  color: #f4ddb0;
}
.builder-choice-hint {
  font-size: 0.72rem;
  color: #9ca3af;
  line-height: 1.35;
}
.days-selector {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
}
.day-toggle {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px;
  color: #9ca3af;
  padding: 0.5rem 1rem;
  font-size: 0.9rem;
  cursor: pointer;
  transition: all 0.15s;
}
.day-toggle:hover { background: rgba(255,255,255,0.08); }
.day-toggle.active {
  background: rgba(167,139,250,0.2);
  border-color: rgba(167,139,250,0.4);
  color: #a78bfa;
}

/* Day Tabs */
.day-tabs {
  display: flex;
  gap: 0.3rem;
  overflow-x: auto;
  padding: 0 1rem;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.day-tab {
  background: none;
  border: none;
  color: #6b7280;
  padding: 0.6rem 0.8rem;
  font-size: 0.8rem;
  cursor: pointer;
  border-bottom: 2px solid transparent;
  white-space: nowrap;
}
.day-tab.active {
  color: #a78bfa;
  border-bottom-color: #a78bfa;
}
.day-exercises {
  padding: 1rem 1.2rem;
}
.builder-ap-hint {
  margin: 1rem 1.2rem 0;
  padding: 0.8rem 0.9rem;
  border: 1px solid rgba(var(--metal-rgb), 0.24);
  border-radius: 8px;
  background: linear-gradient(135deg, rgba(var(--metal-rgb), 0.12), rgba(167,139,250,0.07));
  color: rgba(255,255,255,0.78);
  display: flex;
  flex-direction: column;
  gap: 0.24rem;
  font-size: 0.76rem;
  line-height: 1.4;
}
.builder-ap-hint strong {
  color: #f4ddb0;
  font-size: 0.78rem;
}
.builder-step-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.7rem;
  padding: 0 1.2rem 1.2rem;
}
.builder-step-actions .btn {
  min-height: 42px;
  white-space: normal;
}
.day-header {
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: #6b7280;
  margin-bottom: 0.8rem;
}
.custom-builder-exercise-row {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.6rem 0;
  border-bottom: 1px solid rgba(255,255,255,0.04);
}
.custom-builder-exercise-row .ex-row-name {
  flex: 1;
  font-size: 0.85rem;
  color: #e5e7eb;
}
.custom-builder-exercise-row .ex-row-fields {
  display: flex;
  gap: 0.4rem;
  align-items: center;
}
.custom-builder-exercise-row .ex-sets-input,
.custom-builder-exercise-row .ex-reps-input,
.custom-builder-exercise-row .ex-rest-input {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 6px;
  color: #e5e7eb;
  padding: 0.3rem 0.5rem;
  font-size: 0.78rem;
  width: 55px;
  text-align: center;
}
.custom-builder-exercise-row .ex-remove-btn {
  background: none;
  border: none;
  color: #6b7280;
  cursor: pointer;
  font-size: 0.9rem;
  padding: 0.3rem;
}
.custom-builder-exercise-row .ex-remove-btn:hover { color: #f87171; }

/* Exercise Search */
.exercise-search {
  min-height: 100vh;
}
.exercise-filters {
  padding: 1rem 1.2rem;
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.exercise-filters .form-input,
.exercise-filters .form-select {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px;
  color: #fff;
  padding: 0.6rem 0.9rem;
  font-size: 0.85rem;
}
.exercise-results-list {
  padding: 0.5rem 1rem;
}
.exercise-result-item {
  padding: 0.8rem 0.6rem;
  border-bottom: 1px solid rgba(255,255,255,0.04);
  cursor: pointer;
  transition: background 0.1s;
}
.exercise-result-item:hover { background: rgba(255,255,255,0.04); }
.exercise-result-item .ex-result-name {
  font-size: 0.88rem;
  color: #e5e7eb;
  margin-bottom: 0.2rem;
}
.exercise-result-item .ex-result-meta {
  font-size: 0.75rem;
  color: #6b7280;
}
@media (max-width: 520px) {
  .builder-choice-grid,
  .builder-choice-grid.multi,
  .builder-step-actions {
    grid-template-columns: 1fr;
  }
}
.nav-readiness-badge {
  display: inline-flex;
  align-items: center;
  margin-left: auto;
  padding: 0.1rem 0.35rem;
  border: 1px solid rgba(var(--metal-rgb),  0.28);
  border-radius: 6px;
  color: var(--gold);
  font-size: 0.62rem;
  font-weight: 700;
  line-height: 1.1;
  text-transform: uppercase;
  letter-spacing: 0;
  opacity: 0.86;
}

.nav-mobile-link .nav-readiness-badge {
  margin-left: 0.5rem;
}
.career-panel {
  background: rgba(26, 24, 21, 0.92);
  border: 1px solid rgba(var(--metal-rgb), 0.16);
  border-radius: 12px;
  padding: 1.25rem;
}

.career-panel-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}

.career-panel-head h3 {
  margin: 0.15rem 0 0.35rem;
  color: var(--text-primary, #f4ddb0);
}

.career-panel-head p,
.career-opportunity-card p {
  margin: 0;
  color: var(--text-muted, #9d9184);
  font-size: 0.86rem;
  line-height: 1.55;
}

.career-score {
  min-width: 58px;
  border-radius: 10px;
  padding: 0.65rem 0.75rem;
  background: rgba(var(--metal-rgb), 0.1);
  border: 1px solid rgba(var(--metal-rgb), 0.22);
  color: var(--gold, var(--gold-primary));
  font-weight: 800;
  text-align: center;
}

.career-form-grid,
.career-opportunity-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 0.85rem;
}

.career-form-grid label span,
.career-wide-field span {
  display: block;
  margin-bottom: 0.35rem;
  color: var(--text-muted, #9d9184);
  font-size: 0.76rem;
}

.career-wide-field {
  display: block;
  margin-top: 0.85rem;
}

.career-action-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 1rem;
}

.career-doc-list {
  display: grid;
  gap: 0.75rem;
}

.career-doc-card,
.career-opportunity-card {
  background: rgba(14, 13, 12, 0.56);
  border: 1px solid rgba(255, 255, 255, 0.07);
  border-radius: 10px;
  padding: 1rem;
}

.career-doc-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

.career-doc-title,
.career-opportunity-card h4 {
  color: var(--text-primary, #f4ddb0);
  font-weight: 700;
}

.career-doc-meta {
  color: var(--text-muted, #9d9184);
  font-size: 0.78rem;
  margin-top: 0.25rem;
}

.career-job-card {
  align-items:stretch;
  padding:0;
  overflow:hidden;
  border-radius:16px;
  background:linear-gradient(145deg,rgba(255,255,255,0.045),rgba(8,8,13,0.76));
}
.career-job-card.is-actionable { border-left:3px solid #69d6a1; }
.career-job-card.needs-link { border-left:3px solid #d6af69; }
.career-job-main {
  min-width:0;
  flex:1 1 auto;
  padding:1rem;
}
.career-job-heading {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:0.75rem;
}
.career-job-badges {
  display:flex;
  justify-content:flex-end;
  flex-wrap:wrap;
  gap:0.35rem;
}
.career-fit-badge,
.career-apply-ready,
.career-link-missing {
  display:inline-flex;
  align-items:center;
  border-radius:999px;
  padding:0.28rem 0.48rem;
  white-space:nowrap;
  font-size:0.65rem;
  font-weight:800;
}
.career-fit-badge {
  color:var(--gold, var(--gold-primary));
  border:1px solid rgba(var(--metal-rgb), 0.28);
  background:rgba(var(--metal-rgb), 0.08);
}
.career-apply-ready {
  color:#8ce7bc;
  border:1px solid rgba(140,231,188,0.25);
  background:rgba(140,231,188,0.08);
}
.career-link-missing {
  color:var(--gold-bright);
  border:1px solid rgba(var(--metal-rgb), 0.24);
  background:rgba(var(--metal-rgb), 0.08);
}
.career-job-summary {
  max-width:800px;
  margin-top:0.7rem;
  color:var(--text-secondary);
  font-size:0.8rem;
  line-height:1.55;
}
.career-job-summary.is-missing {
  color:var(--text-muted);
  font-style:italic;
}
.career-job-card .career-job-intelligence {
  max-width:none;
  margin-top:0.8rem;
  padding-top:0.7rem;
  border-top:1px solid var(--border);
}
.career-job-card .career-job-intelligence section {
  margin-top:0.75rem;
  color:var(--text-secondary);
  font-size:0.78rem;
  line-height:1.5;
}
.career-job-card .career-job-intelligence section > strong {
  color:var(--text-primary);
}
.career-job-card .career-job-intelligence ul {
  margin:0.35rem 0 0;
  padding-left:1.1rem;
}
.career-job-card .career-job-intelligence li + li { margin-top:0.25rem; }
.career-job-actions {
  display:flex;
  flex:0 0 160px;
  flex-direction:column;
  justify-content:center;
  gap:0.45rem;
  padding:1rem;
  border-left:1px solid var(--border);
  background:rgba(0,0,0,0.13);
}
.career-job-actions .btn {
  width:100%;
  justify-content:center;
}

.workout-api-panel {
  margin-bottom: 1rem;
  background: linear-gradient(180deg, rgba(24, 22, 19, 0.96), rgba(12, 12, 18, 0.96));
  border-color: rgba(var(--metal-rgb), 0.22);
}
.workout-api-panel > summary { display:flex; align-items:center; justify-content:space-between; gap:1rem; cursor:pointer; list-style:none; }
.workout-api-panel > summary::-webkit-details-marker { display:none; }
.workout-api-panel > summary span { color:var(--text-primary); font-weight:800; }
.workout-api-panel > summary strong { color:var(--gold); font-size:0.78rem; font-weight:700; }
.workout-api-panel[open] > summary { margin-bottom:1rem; padding-bottom:0.85rem; border-bottom:1px solid var(--border-subtle); }

.workout-api-head {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: flex-start;
  margin-bottom: 0.9rem;
}

.workout-api-head h3 {
  margin: 0 0 0.25rem;
  color: var(--text-primary, #f0ede8);
}

.workout-api-head p {
  margin: 0;
  color: var(--text-muted, #9d9184);
  font-size: 0.86rem;
  line-height: 1.45;
}

.workout-api-badge,
.workout-provider-pill {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  white-space: nowrap;
}

.workout-api-badge {
  padding: 0.38rem 0.62rem;
  background: rgba(var(--metal-rgb), 0.13);
  border: 1px solid rgba(var(--metal-rgb), 0.25);
  color: var(--gold, var(--gold-primary));
  font-size: 0.74rem;
  font-weight: 800;
}

.workout-provider-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin-bottom: 0.85rem;
}

.workout-provider-pill {
  padding: 0.3rem 0.52rem;
  border: 1px solid rgba(255, 255, 255, 0.08);
  color: var(--text-muted, #9d9184);
  font-size: 0.72rem;
}

.workout-provider-pill.is-live {
  color: #8ce7bc;
  border-color: rgba(140, 231, 188, 0.25);
  background: rgba(140, 231, 188, 0.08);
}

.workout-provider-pill.is-degraded {
  color: var(--gold-bright);
  border-color: rgba(var(--metal-rgb),  0.24);
  background: rgba(var(--metal-rgb),  0.08);
}

.workout-api-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 0.65rem;
}

.workout-api-exercise {
  min-height: 92px;
  padding: 0.78rem;
  text-align: left;
  background: rgba(255, 255, 255, 0.035);
  border: 1px solid rgba(255, 255, 255, 0.075);
  border-radius: 8px;
  color: var(--text-primary, #f0ede8);
  cursor: pointer;
}

.workout-api-exercise:hover,
.workout-api-exercise:focus-visible {
  border-color: rgba(var(--metal-rgb), 0.42);
  background: rgba(var(--metal-rgb), 0.08);
  outline: none;
}

.workout-api-exercise strong,
.workout-api-exercise span,
.workout-api-exercise small {
  display: block;
}

.workout-api-exercise strong {
  margin-bottom: 0.35rem;
  font-size: 0.9rem;
}

.workout-api-exercise span,
.workout-api-exercise small {
  color: var(--text-muted, #9d9184);
  font-size: 0.76rem;
}

.workout-api-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  margin-top: 0.85rem;
}

/* Premium database-backed workout experience */
.workout-today-hero,
.workout-premium-section,
.active-exercise-card,
.workout-detail-hero,
.workout-detail-block,
.workout-ap-fit {
  background: var(--surface-elevated);
  border: 1px solid var(--border);
  border-radius: 16px;
}
.workout-today-hero { display:flex; justify-content:space-between; align-items:flex-end; gap:1.5rem; padding:1.5rem; margin-bottom:1rem; border-top:3px solid var(--gold); }
.workout-today-hero h2 { margin:0.2rem 0 0.45rem; color:var(--text-primary); font-size:clamp(1.45rem,4vw,2.25rem); letter-spacing:-0.03em; }
.workout-today-hero p { color:var(--text-secondary); max-width:680px; margin:0; }
.workout-today-empty { border-top-color:var(--border); }
.workout-kicker { color:var(--gold); font-size:0.7rem; font-weight:700; letter-spacing:0.13em; text-transform:uppercase; }
.workout-hero-metrics,.workout-detail-metrics,.active-exercise-targets { display:flex; flex-wrap:wrap; gap:0.45rem; margin-top:0.85rem; }
.workout-hero-metrics span,.workout-detail-metrics span,.active-exercise-targets span { border:1px solid var(--border); border-radius:999px; color:var(--text-secondary); padding:0.35rem 0.65rem; font-size:0.76rem; text-transform:capitalize; }
.workout-hero-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:0.5rem; flex-shrink:0; }
.workout-premium-section { padding:1.2rem; margin:1rem 0; }
.training-paths-shell{overflow:hidden}.training-paths-shell .workout-section-heading{gap:1rem}.training-paths-shell .workout-section-heading>small{max-width:360px;text-align:right;color:var(--text-secondary)}.training-path-strip{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(220px,280px);gap:.75rem;overflow-x:auto;overscroll-behavior-inline:contain;scroll-snap-type:inline proximity;padding:.2rem .1rem .6rem}.training-path-card{scroll-snap-align:start;border:1px solid var(--border);border-radius:18px;background:var(--card);overflow:hidden;transition:border-color .2s,transform .2s}.training-path-card:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--accent-gold) 65%,var(--border))}.training-path-card.active{box-shadow:inset 3px 0 0 var(--accent-gold)}.training-path-card>button{width:100%;min-height:174px;padding:1rem;display:grid;gap:.4rem;text-align:left;border:0;background:linear-gradient(150deg,color-mix(in srgb,var(--accent-gold) 8%,var(--card)),var(--card));color:var(--text-primary);cursor:pointer}.training-path-mark{width:42px;height:42px;border:1px solid color-mix(in srgb,var(--accent-gold) 60%,var(--border));border-radius:14px;display:grid;place-items:center;font-family:var(--font-display);color:var(--accent-gold)}.training-path-card>button small{text-transform:uppercase;letter-spacing:.08em;color:var(--text-secondary);font-size:.62rem}.training-path-card>button strong{font-family:var(--font-display);font-size:1.08rem}.training-path-card>button p{margin:0;color:var(--text-secondary);font-size:.78rem}.training-path-detail{padding:0 1rem 1rem;border-top:1px solid var(--border)}.training-path-detail>p{font-size:.78rem;color:var(--text-secondary)}.training-path-detail ol{display:grid;gap:.45rem;padding-left:1.2rem}.training-path-detail li{font-size:.72rem}.training-path-detail li span{display:block;color:var(--text-secondary);margin-top:.12rem}.training-path-detail>small{display:block;color:var(--text-secondary);line-height:1.45}.training-safety-contract{font-size:.7rem;color:var(--text-secondary);margin:.65rem 0 0;border-left:2px solid var(--accent-gold);padding-left:.65rem}
@media(max-width:720px){.nutrition-facts-workspace{grid-template-columns:1fr}.nutrition-facts-search{grid-template-columns:1fr}.nutrition-food-results{max-height:360px}.training-paths-shell .workout-section-heading>small{text-align:left}.training-path-strip{grid-auto-columns:minmax(82vw,280px)}}
.workout-exact-media-detail{margin-top:1rem;border-top:1px solid var(--border);padding-top:1rem}.workout-media-layout{display:grid;grid-template-columns:minmax(240px,1fr) minmax(220px,.8fr);gap:1rem;align-items:center}.workout-media-frame{aspect-ratio:16/10;border:1px solid var(--border);border-radius:16px;overflow:hidden;background:var(--surface-muted);display:grid;place-items:center}.workout-media-frame img,.workout-media-frame iframe{width:100%;height:100%;object-fit:contain;border:0}.workout-media-frame span{font-size:.75rem;color:var(--text-secondary)}.workout-media-layout p{color:var(--text-secondary);font-size:.78rem;line-height:1.5}
@media(max-width:720px){.workout-media-layout{grid-template-columns:1fr}}
.workout-section-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:1rem; margin-bottom:0.9rem; }
.workout-section-heading h2 { margin:0.15rem 0 0; color:var(--text-primary); font-size:1.2rem; }
.workout-result-count { color:var(--text-muted); font-size:0.76rem; }
.workout-week-strip { display:grid; grid-template-columns:repeat(7,minmax(90px,1fr)); gap:0.5rem; overflow-x:auto; padding-bottom:0.15rem; }
.workout-day { appearance:none; background:var(--surface); color:var(--text-primary); border:1px solid var(--border); border-radius:12px; min-width:90px; padding:0.65rem; text-align:left; cursor:pointer; }
.workout-day span,.workout-day small { display:block; color:var(--text-muted); font-size:0.66rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.workout-day strong { display:block; font-size:1.15rem; margin:0.15rem 0; }
.workout-day.scheduled,.workout-day.active { border-color:var(--gold); box-shadow:inset 0 -3px 0 var(--gold); }
.workout-day.completed { border-color:#22c55e; box-shadow:inset 0 -3px 0 #22c55e; }
.workout-library-tabs { display:flex; gap:0.3rem; overflow-x:auto; border-bottom:1px solid var(--border); margin-bottom:0.8rem; }
.workout-library-tabs button { appearance:none; background:none; border:0; border-bottom:2px solid transparent; color:var(--text-muted); padding:0.6rem 0.8rem; cursor:pointer; white-space:nowrap; }
.workout-library-tabs button.active { border-bottom-color:var(--gold); color:var(--text-primary); font-weight:700; }
.workout-filter-bar { display:grid; grid-template-columns:minmax(180px,2fr) repeat(3,minmax(130px,1fr)); gap:0.55rem; margin-bottom:0.9rem; }
.workout-library-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(245px,1fr)); gap:0.75rem; max-height:680px; overflow-y:auto; padding:0.1rem; }
.workout-library-card { position:relative; background:var(--surface); border:1px solid var(--border); border-radius:14px; overflow:hidden; }
.workout-card-open { appearance:none; display:block; width:100%; padding:0; border:0; background:none; color:inherit; text-align:left; cursor:pointer; }
.workout-card-visual { display:flex; min-height:92px; align-items:flex-end; padding:0.85rem; background:var(--surface-inset,var(--bg-secondary)); border-bottom:1px solid var(--border); }
.workout-card-visual span { color:var(--gold); font-size:0.67rem; font-weight:700; text-transform:uppercase; letter-spacing:0.11em; }
.workout-card-body { display:block; padding:0.85rem 0.85rem 0.5rem; }
.workout-card-body strong,.workout-card-body span { display:block; }
.workout-card-body strong { color:var(--text-primary); font-size:1rem; }
.workout-card-body span { color:var(--text-secondary); font-size:0.76rem; line-height:1.45; margin-top:0.3rem; min-height:2.2em; }
.workout-card-stats { display:flex; gap:0.35rem; flex-wrap:wrap; padding:0 0.85rem; }
.workout-card-stats span,.workout-card-tags i { color:var(--text-muted); font-size:0.65rem; font-style:normal; text-transform:capitalize; }
.workout-card-tags { display:flex; gap:0.35rem; padding:0.55rem 0.85rem 0.9rem; }
.workout-card-tags i { border:1px solid var(--border); border-radius:999px; padding:0.2rem 0.4rem; }
.workout-save-toggle { position:absolute; right:0.65rem; top:0.65rem; z-index:2; border:1px solid var(--border); border-radius:999px; background:var(--surface-elevated); color:var(--text-secondary); padding:0.3rem 0.55rem; font-size:0.68rem; cursor:pointer; }
.workout-save-toggle.saved { color:var(--gold); border-color:var(--gold); }
.workout-ap-plan-intro { color:var(--text-secondary); font-size:0.8rem; line-height:1.55; margin:0 0 0.9rem; max-width:720px; }
.workout-ap-plan-card { display:flex; flex-direction:column; }
.workout-ap-plan-card .workout-card-visual { min-height:72px; }
.workout-ap-plan-details { margin:0.75rem 0.85rem; border-top:1px solid var(--border); border-bottom:1px solid var(--border); padding:0.65rem 0; color:var(--text-secondary); font-size:0.72rem; }
.workout-ap-plan-details summary { color:var(--text-primary); cursor:pointer; font-weight:700; }
.workout-ap-plan-details div { display:flex; justify-content:space-between; gap:0.75rem; padding:0.45rem 0; border-bottom:1px solid color-mix(in srgb,var(--border) 55%,transparent); }
.workout-ap-plan-details div:last-of-type { border-bottom:0; }
.workout-ap-plan-details strong { color:var(--text-primary); }
.workout-ap-plan-details small { display:block; line-height:1.45; padding-top:0.5rem; }
.workout-ap-plan-actions { display:flex; align-items:center; justify-content:space-between; gap:0.75rem; margin-top:auto; padding:0 0.85rem 0.85rem; }
.workout-ap-plan-actions > span { color:var(--gold); font-size:0.68rem; font-weight:700; text-transform:uppercase; letter-spacing:0.08em; }
.workout-empty-state,.workout-error-state { grid-column:1/-1; padding:2rem 1rem; text-align:center; color:var(--text-secondary); }
.workout-empty-state strong,.workout-error-state strong { color:var(--text-primary); }
.workout-empty-state p,.workout-error-state p { margin:0.35rem auto 0.9rem; max-width:520px; }
.workout-library-state.loading-state,.workout-premium-section.loading-state { opacity:0.62; pointer-events:none; }
.workout-detail-modal { overflow-y:auto; background:var(--bg-primary); z-index:10050; }
.workout-detail-shell { max-width:820px; margin:0 auto; padding:1rem 1rem 6rem; }
.workout-detail-header { display:flex; justify-content:space-between; align-items:center; gap:1rem; margin-bottom:0.8rem; }
.workout-detail-header span { color:var(--text-muted); font-size:0.75rem; text-transform:uppercase; letter-spacing:0.1em; }
.workout-detail-hero,.workout-detail-block,.workout-ap-fit { padding:1.2rem; margin-bottom:0.8rem; }
.workout-detail-hero h1 { color:var(--text-primary); margin:0.25rem 0; font-size:clamp(1.7rem,5vw,2.7rem); letter-spacing:-0.035em; }
.workout-detail-hero p,.workout-ap-fit p { color:var(--text-secondary); line-height:1.55; }
.workout-ap-fit { border-left:3px solid var(--gold); }
.workout-ap-fit strong,.workout-detail-block h2 { color:var(--text-primary); }
.workout-detail-block h2 { margin:0 0 0.8rem; font-size:1.05rem; }
.workout-detail-row,.workout-detail-exercise { display:flex; gap:0.8rem; padding:0.8rem 0; border-top:1px solid var(--border); }
.workout-detail-row { justify-content:space-between; }
.workout-detail-exercise h3 { color:var(--text-primary); margin:0; font-size:0.95rem; }
.workout-detail-exercise p,.workout-detail-exercise small { display:block; color:var(--text-secondary); font-size:0.77rem; line-height:1.45; margin:0.25rem 0; }
.workout-exercise-number { display:grid; place-items:center; width:30px; height:30px; flex:0 0 30px; border:1px solid var(--border); border-radius:50%; color:var(--gold); font:700 0.75rem var(--font-mono); }
.workout-exercise-prescription { display:flex; flex-wrap:wrap; gap:0.4rem; margin:0.45rem 0; }
.workout-exercise-prescription span { color:var(--gold); font:0.68rem var(--font-mono); }
.workout-detail-actions { position:fixed; left:0; right:0; bottom:0; display:flex; justify-content:center; gap:0.6rem; padding:0.8rem; background:var(--surface-elevated); border-top:1px solid var(--border); z-index:2; }
.workout-session-name { color:var(--text-primary); font-weight:700; margin-bottom:0.25rem; }
.workout-session-progress { height:5px; max-width:420px; margin:0.7rem auto 0.3rem; background:var(--surface); border-radius:999px; overflow:hidden; }
.workout-session-progress span { display:block; height:100%; background:var(--gold); }
.active-exercise-card { padding:1.25rem; margin-bottom:1rem; }
.active-exercise-card h1 { color:var(--text-primary); margin:0.25rem 0; font-size:clamp(1.6rem,6vw,2.8rem); }
.active-exercise-card p,.active-exercise-reference { color:var(--text-secondary); line-height:1.5; }
.active-exercise-reference { border-top:1px solid var(--border); margin-top:0.9rem; padding-top:0.7rem; font-size:0.78rem; }
.active-exercise-tools,.workout-session-controls { display:flex; flex-wrap:wrap; gap:0.45rem; margin-top:0.8rem; }

@media (max-width: 720px) {
  .workout-today-hero { align-items:flex-start; flex-direction:column; padding:1.1rem; }
  .workout-hero-actions { justify-content:flex-start; width:100%; }
  .workout-hero-actions .btn { flex:1; }
  .workout-filter-bar { grid-template-columns:1fr 1fr; }
  .workout-filter-bar input { grid-column:1/-1; }
  .workout-week-strip { grid-template-columns:repeat(7,82px); }
  .workout-library-grid { grid-template-columns:1fr; max-height:none; }
}

/* Tester readiness: final form readability pass.
   Keeps legacy inline/component inputs from falling back to browser-white boxes. */
#app .auth-page input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),
#app .auth-page textarea,
#app .auth-page select,
#app .onboarding-page input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),
#app .onboarding-page textarea,
#app .onboarding-page select,
#app .settings-page input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),
#app .settings-page textarea,
#app .settings-page select,
#app .career-form-grid input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),
#app .career-form-grid textarea,
#app .career-form-grid select,
#app .form-input,
#app .form-control,
#app .ls-input,
#app .ls-select {
  width: 100%;
  min-height: 44px;
  background: linear-gradient(180deg, rgba(18, 18, 30, 0.98), rgba(9, 9, 16, 0.98)) !important;
  color: var(--text-primary, #f0ede8) !important;
  border: 1px solid rgba(var(--metal-rgb), 0.26) !important;
  border-radius: 8px !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.025), 0 8px 26px rgba(0,0,0,0.12) !important;
  font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, sans-serif !important;
}

#app .auth-page input::placeholder,
#app .auth-page textarea::placeholder,
#app .onboarding-page input::placeholder,
#app .onboarding-page textarea::placeholder,
#app .settings-page input::placeholder,
#app .settings-page textarea::placeholder,
#app .career-form-grid input::placeholder,
#app .career-form-grid textarea::placeholder,
#app .form-input::placeholder,
#app .form-control::placeholder,
#app .ls-input::placeholder {
  color: rgba(240, 237, 232, 0.52) !important;
}

#app .auth-page input:focus,
#app .auth-page textarea:focus,
#app .auth-page select:focus,
#app .onboarding-page input:focus,
#app .onboarding-page textarea:focus,
#app .onboarding-page select:focus,
#app .settings-page input:focus,
#app .settings-page textarea:focus,
#app .settings-page select:focus,
#app .career-form-grid input:focus,
#app .career-form-grid textarea:focus,
#app .career-form-grid select:focus,
#app .form-input:focus,
#app .form-control:focus,
#app .ls-input:focus,
#app .ls-select:focus {
  border-color: rgba(var(--metal-rgb), 0.62) !important;
  box-shadow: 0 0 0 3px rgba(var(--metal-rgb), 0.1), inset 0 0 0 1px rgba(255,255,255,0.04) !important;
}

@media (max-width: 640px) {
  .career-panel-head,
  .career-doc-card {
    flex-direction: column;
    align-items: stretch;
  }

  .astro-chart-guide,
  .career-job-heading {
    align-items:flex-start;
    flex-direction:column;
  }

  .astro-chart-guide > span { align-self:flex-start; }
  .astro-placement-card[open] { grid-column:span 1; }
  .career-job-badges { justify-content:flex-start; }
  .career-job-actions {
    flex:0 0 auto;
    display:grid;
    grid-template-columns:1fr 1fr;
    border-top:1px solid var(--border);
    border-left:0;
  }
  .career-job-actions .btn:first-child { grid-column:1/-1; }

  .career-action-row .btn {
    width: 100%;
  }
}
/* Ascension Browser */
.asc-browser-page {
  display: grid;
  gap: 1rem;
}

.browser-session-status,
.browser-panel {
  border: 1px solid var(--border, rgba(var(--metal-rgb), 0.2));
  background: var(--surface, rgba(255, 255, 255, 0.035));
  border-radius: 18px;
}

.browser-session-status {
  padding: 0.75rem 1rem;
  color: var(--text-secondary);
  font-size: 0.86rem;
}

.browser-panel {
  padding: clamp(1rem, 2vw, 1.4rem);
  min-width: 0;
}

.browser-panel-title {
  color: var(--text-primary);
  font-family: var(--font-display, "Syne", sans-serif);
  font-size: 1rem;
  font-weight: 700;
  margin-bottom: 0.75rem;
}

.browser-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
  gap: 1rem;
}

.browser-command-panel {
  display: grid;
  align-content: start;
  gap: 0.7rem;
}

.browser-input {
  width: 100%;
  border: 1px solid var(--border, rgba(var(--metal-rgb), 0.22));
  border-radius: 12px;
  background: var(--input-bg, rgba(0, 0, 0, 0.16));
  color: var(--text-primary);
  padding: 0.78rem 0.9rem;
  font: inherit;
  resize: vertical;
}

.browser-textarea {
  min-height: 96px;
}

.browser-capture-textarea {
  min-height: 150px;
}

.browser-check-row {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  color: var(--text-secondary);
  font-size: 0.84rem;
  line-height: 1.45;
}

.browser-actions-row,
.browser-live-toolbar {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  flex-wrap: wrap;
}

.browser-actions-row {
  margin-top: 0.35rem;
}

.browser-live-toolbar {
  justify-content: space-between;
}

.browser-live-toolbar > div:first-child {
  max-width: 720px;
}

.browser-muted,
.browser-empty {
  color: var(--text-secondary);
  font-size: 0.88rem;
  line-height: 1.5;
}

.browser-safety-note,
.browser-error,
.browser-plan-confirm {
  border-radius: 12px;
  padding: 0.75rem 0.85rem;
  margin-top: 0.75rem;
  background: rgba(var(--metal-rgb), 0.08);
  color: var(--text-secondary);
  font-size: 0.82rem;
  line-height: 1.45;
}

.browser-error {
  background: rgba(220, 80, 80, 0.1);
  color: #df8b8b;
}

.browser-live-badge,
.browser-type-badge,
.browser-confidence {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0.3rem 0.65rem;
  border-radius: 999px;
  border: 1px solid var(--border, rgba(var(--metal-rgb), 0.22));
  color: var(--text-secondary);
  font-size: 0.75rem;
  font-weight: 700;
}

.browser-live-badge.is-ready {
  color: #78c89a;
  border-color: rgba(88, 190, 130, 0.38);
}

.browser-live-badge.is-live {
  color: #92e7b5;
  background: rgba(54, 183, 108, 0.14);
  box-shadow: 0 0 18px rgba(54, 183, 108, 0.16);
}

.browser-live-frame-wrap {
  margin-top: 1rem;
  min-height: 650px;
  overflow: hidden;
  border: 1px solid var(--border, rgba(var(--metal-rgb), 0.22));
  border-radius: 14px;
  background: #fff;
}

.browser-live-frame {
  display: block;
  width: 100%;
  min-height: 650px;
  border: 0;
  background: #fff;
}

.browser-action-list {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  margin: 0.85rem 0;
}

.browser-action-chip {
  border: 1px solid var(--border, rgba(var(--metal-rgb), 0.24));
  border-radius: 999px;
  background: transparent;
  color: var(--text-primary);
  padding: 0.48rem 0.72rem;
  cursor: pointer;
}

.browser-action-chip:hover {
  border-color: var(--gold, var(--gold-primary));
  background: rgba(var(--metal-rgb), 0.08);
}

.browser-result-top,
.browser-context-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

.browser-context-card {
  align-items: flex-start;
  margin-top: 0.75rem;
  padding: 0.75rem;
  border-radius: 12px;
  background: rgba(var(--metal-rgb), 0.06);
}

.browser-context-card span {
  color: var(--text-secondary);
  text-align: right;
  font-size: 0.82rem;
}

@media (max-width: 920px) {
  .browser-grid {
    grid-template-columns: 1fr;
  }
  .browser-live-frame-wrap,
  .browser-live-frame {
    min-height: 560px;
  }
}

@media (max-width: 560px) {
  .browser-live-toolbar,
  .browser-result-top,
  .browser-context-card {
    align-items: stretch;
    flex-direction: column;
  }
  .browser-context-card span {
    text-align: left;
  }
  .browser-live-frame-wrap,
  .browser-live-frame {
    min-height: 480px;
  }
}

/* Ascension signature shell: exact logo geometry, black/gold edge contrast, and protected content width. */
@media (min-width: 901px) {
  .app-shell > .app-content {
    flex: 0 0 calc(100% - var(--sidebar-expanded));
    max-width: calc(100% - var(--sidebar-expanded));
    min-width: 0;
  }
}

.lux-sidebar {
  isolation: isolate;
  background:
    linear-gradient(162deg, rgba(232, 213, 163, 0.055), transparent 25%),
    linear-gradient(180deg, #090a0d 0%, #050608 58%, #0b0906 100%);
  border-right-color: rgba(var(--metal-rgb), 0.22);
  box-shadow:
    inset -1px 0 rgba(232, 213, 163, 0.07),
    18px 0 48px rgba(0, 0, 0, 0.34);
}

.lux-sidebar::before {
  z-index: -1;
  background-image:
    linear-gradient(135deg, transparent 0 34%, rgba(var(--metal-rgb), 0.045) 34.2% 34.5%, transparent 34.7%),
    linear-gradient(45deg, transparent 0 72%, rgba(var(--metal-rgb), 0.035) 72.2% 72.5%, transparent 72.7%),
    url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.018'/%3E%3C/svg%3E");
}

.lux-sidebar::after {
  content: '';
  position: absolute;
  width: 260px;
  height: 260px;
  left: -126px;
  top: -142px;
  z-index: -1;
  border: 1px solid rgba(var(--metal-rgb), 0.14);
  transform: rotate(45deg);
  box-shadow: 0 0 46px rgba(var(--metal-rgb), 0.045);
  pointer-events: none;
}

.sidebar-brand {
  min-height: 76px;
  padding: 0.85rem 0.8rem;
  border-bottom-color: rgba(var(--metal-rgb), 0.13);
  outline: none;
}

.sidebar-brand:focus-visible {
  outline: 2px solid var(--gold-primary);
  outline-offset: -3px;
}

.sidebar-brand-icon {
  width: 47px;
  height: 47px;
  border-radius: 0;
  background: transparent;
  object-fit: contain;
  filter: drop-shadow(0 0 10px rgba(var(--metal-rgb), 0.18)) drop-shadow(4px 5px 2px rgba(0, 0, 0, 0.72));
}

.sidebar-brand-text {
  display: grid;
  gap: 0.08rem;
  background: none;
  -webkit-text-fill-color: currentColor;
  color: var(--gold-bright);
  line-height: 1;
  text-shadow: 2px 3px 1px rgba(0, 0, 0, 0.8);
}

.sidebar-brand-text strong {
  font: 750 0.82rem/1 'Syne', sans-serif;
  letter-spacing: 0.12em;
}

.sidebar-brand-text small {
  color: var(--gold-muted);
  font: 650 0.56rem/1 'DM Sans', sans-serif;
  letter-spacing: 0.24em;
}

.lux-topbar {
  background: linear-gradient(90deg, rgba(5, 6, 8, 0.96), rgba(12, 11, 8, 0.94) 48%, rgba(5, 6, 8, 0.96));
  border-bottom-color: rgba(var(--metal-rgb), 0.15);
  box-shadow: 0 14px 36px rgba(0, 0, 0, 0.2);
}

.lux-topbar::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(var(--metal-rgb), 0.48) 30%, rgba(var(--metal-rgb), 0.12) 58%, rgba(123, 104, 238, 0.22), transparent);
  pointer-events: none;
}

.topbar-product-logo {
  filter: drop-shadow(0 0 10px rgba(var(--metal-rgb), 0.2)) drop-shadow(3px 4px 1px rgba(0, 0, 0, 0.55));
}

.nav-mobile-brand {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  padding: 0;
  border: 0;
  color: var(--gold-bright);
  background: transparent;
  text-align: left;
  cursor: pointer;
  -webkit-text-fill-color: currentColor;
}

.nav-mobile-brand img {
  width: 44px;
  height: 44px;
  object-fit: contain;
  filter: drop-shadow(0 0 9px rgba(var(--metal-rgb), 0.18)) drop-shadow(3px 4px 1px rgba(0, 0, 0, 0.65));
}

.nav-mobile-brand span { display: grid; gap: 0.12rem; }
.nav-mobile-brand strong { font: 750 0.82rem/1 'Syne', sans-serif; letter-spacing: 0.11em; text-transform: uppercase; }
.nav-mobile-brand small { color: var(--gold-muted); font: 650 0.54rem/1 'DM Sans', sans-serif; letter-spacing: 0.24em; text-transform: uppercase; }

.glass-card,
.panel,
.card {
  border-color: rgba(var(--metal-rgb), 0.16);
  box-shadow: 5px 7px 0 rgba(0, 0, 0, 0.16), 0 20px 54px rgba(0, 0, 0, 0.22), inset 0 1px rgba(232, 213, 163, 0.035);
}

.btn-primary,
.btn-gold,
button.gold {
  box-shadow: 4px 5px 0 rgba(0, 0, 0, 0.7), 0 0 22px rgba(var(--metal-rgb), 0.09);
}

:root[data-theme="light"] .lux-sidebar,
:root[data-theme="light"] .lux-topbar {
  background: linear-gradient(155deg, #ffffff 0%, #eef1f4 54%, #dfe4ea 100%);
  border-color: rgba(53, 62, 73, 0.22);
  box-shadow: 14px 0 38px rgba(32, 39, 48, 0.13);
}

:root[data-theme="light"] .sidebar-brand-icon,
:root[data-theme="light"] .topbar-product-logo,
:root[data-theme="light"] .nav-mobile-brand img,
:root[data-theme="light"] img[src*="ascension-lifeos-logo"] {
  filter: grayscale(1) contrast(1.12) drop-shadow(3px 4px 1px rgba(18, 23, 29, 0.2));
}

:root[data-theme="light"] .sidebar-brand-text,
:root[data-theme="light"] .nav-mobile-brand {
  color: #344152;
  text-shadow: 2px 3px 1px rgba(255, 255, 255, 0.75);
}

@media (max-width: 900px) {
  .lux-topbar {
    background: linear-gradient(90deg, rgba(5, 6, 8, 0.97), rgba(12, 11, 8, 0.96));
  }
  :root[data-theme="light"] .lux-topbar {
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.98), rgba(231, 235, 240, 0.97));
  }
}

/* AP chat history is a right-side overlay so the active conversation stays centered. */
.chat-layout {
  position: relative;
}

.chat-layout .chat-main {
  width: 100%;
}

.chat-layout .chat-sidebar {
  position: absolute;
  inset: 0 0 0 auto;
  z-index: 46;
  width: min(340px, calc(100% - 20px));
  min-width: 0;
  max-height: none;
  border: 0;
  border-left: 1px solid var(--border-subtle, rgba(255,255,255,0.08));
  border-bottom: 0;
  background: color-mix(in srgb, var(--bg-surface) 96%, transparent);
  box-shadow: -26px 0 70px rgba(0,0,0,0.34);
  transform: translateX(104%);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition:
    transform 260ms cubic-bezier(.22,.8,.24,1),
    opacity 180ms ease,
    visibility 0s linear 260ms;
}

.chat-layout .chat-sidebar.expanded {
  max-height: none;
  transform: translateX(0);
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition:
    transform 260ms cubic-bezier(.22,.8,.24,1),
    opacity 180ms ease,
    visibility 0s;
}

.chat-layout .chat-sidebar.collapsed .chat-convo-list {
  display: block;
}

.chat-layout .chat-sidebar.collapsed .chat-sidebar-search {
  display: block;
}

.chat-layout .chat-sidebar-toggle {
  display: block;
}

.chat-history-backdrop {
  position: absolute;
  inset: 0;
  z-index: 45;
  border: 0;
  padding: 0;
  background: rgba(3,3,7,0.46);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  cursor: default;
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
  transition: opacity 180ms ease, visibility 0s linear 180ms;
}

.chat-layout.history-open .chat-history-backdrop {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition: opacity 180ms ease, visibility 0s;
}

.chat-history-open {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  flex: 0 0 auto;
  margin-left: auto;
  padding: 0.5rem 0.8rem;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-pill);
  background: rgba(255,255,255,0.03);
  color: var(--text-secondary);
  font: 600 0.78rem/1 'DM Sans', sans-serif;
  white-space: nowrap;
  cursor: pointer;
}

.chat-history-open:hover,
.chat-history-open[aria-expanded="true"] {
  color: var(--gold-primary);
  border-color: var(--border-gold);
  background: var(--gold-glow);
}

:root[data-theme="light"] .chat-layout .chat-sidebar {
  background: rgba(250,246,238,0.98);
  box-shadow: -26px 0 70px rgba(52,38,22,0.2);
}

:root[data-theme="light"] .chat-history-backdrop {
  background: rgba(40,30,20,0.28);
}

@media (max-width: 640px) {
  .chat-history-open {
    padding: 0.43rem 0.65rem;
  }

  .chat-history-open span:last-child {
    display: none;
  }

  .chat-layout .chat-sidebar {
    width: min(92vw, 340px);
    min-width: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .chat-layout .chat-sidebar,
  .chat-history-backdrop {
    transition-duration: 1ms;
  }
}

/* === Dynamic Screen Density System v4.6.189 === */
.ui-dynamic-page {
  --ui-screen-gap: clamp(0.72rem, 1vw, 1rem);
  --ui-surface-pad: clamp(0.85rem, 1.35vw, 1.15rem);
  display: flex;
  flex-direction: column;
  gap: var(--ui-screen-gap);
}

.ui-dynamic-page > * {
  margin-top: 0;
  margin-bottom: 0;
}

.ui-page-header {
  position: relative;
  isolation: isolate;
  min-height: 88px;
  padding: clamp(1rem, 1.8vw, 1.35rem) clamp(5.8rem, 10vw, 8.5rem) clamp(1rem, 1.8vw, 1.35rem) clamp(1rem, 1.8vw, 1.4rem);
  overflow: hidden;
  border: 1px solid var(--border-glass);
  border-radius: var(--radius-lg, 18px);
  background:
    radial-gradient(circle at 88% 20%, var(--gold-glow-med), transparent 34%),
    linear-gradient(135deg, color-mix(in srgb, var(--bg-elevated) 88%, transparent), color-mix(in srgb, var(--bg-surface) 94%, transparent));
  box-shadow: 0 16px 42px rgba(0,0,0,0.14);
}

.ui-page-header::after {
  content: '';
  position: absolute;
  inset: auto 0 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--gold-primary), transparent);
  opacity: 0.35;
}

.ui-page-header > :not(.ui-page-visual) {
  position: relative;
  z-index: 1;
}

.ui-page-header h1,
.ui-page-header .ws-title {
  max-width: 780px;
  margin: 0 0 0.25rem;
  font-size: clamp(1.45rem, 2.4vw, 2.1rem);
  line-height: 1.05;
  letter-spacing: -0.035em;
}

.ui-page-header p,
.ui-page-header .page-subtitle,
.ui-page-header .ws-subtitle {
  max-width: 760px;
  margin: 0.15rem 0 0;
  line-height: 1.45;
}

.ui-page-visual {
  position: absolute;
  z-index: 0;
  top: 50%;
  right: clamp(1rem, 2.4vw, 2.2rem);
  width: clamp(3.6rem, 7vw, 5.4rem);
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  border: 1px solid var(--gold-border);
  border-radius: 50%;
  color: var(--gold-bright);
  background: radial-gradient(circle, var(--gold-glow-med), transparent 70%);
  box-shadow: 0 0 0 10px var(--gold-glow), 0 0 38px var(--gold-glow-med);
  transform: translateY(-50%);
  pointer-events: none;
}

.ui-page-visual::before,
.ui-page-visual::after {
  content: '';
  position: absolute;
  border: 1px solid var(--gold-border);
  border-radius: 50%;
}

.ui-page-visual::before { inset: 9px; }
.ui-page-visual::after { inset: 19px; border-style: dashed; }
.ui-page-visual span { font: 600 clamp(1.15rem, 2.2vw, 1.75rem)/1 'Syne', sans-serif; }

.ws-header.ui-page-header,
.fi-page-header.ui-page-header,
.evolution-page-header.ui-page-header,
.sched-page-header.ui-page-header {
  margin-bottom: 0;
  padding: clamp(0.9rem, 1.5vw, 1.15rem) clamp(5.8rem, 10vw, 8.5rem) clamp(0.9rem, 1.5vw, 1.15rem) clamp(1rem, 1.8vw, 1.4rem) !important;
}

.ui-screen-rail {
  position: sticky;
  top: calc(var(--topbar-height, 64px) + 0.4rem);
  z-index: 34;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.48rem 0.55rem 0.48rem 0.75rem;
  border: 1px solid var(--border-glass);
  border-radius: var(--radius-pill, 999px);
  background: color-mix(in srgb, var(--bg-deep) 84%, transparent);
  box-shadow: 0 10px 28px rgba(0,0,0,0.16);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

.ui-screen-rail-label {
  flex: 0 0 auto;
  color: var(--text-muted);
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.ui-jump-chips {
  min-width: 0;
  display: flex;
  flex: 1;
  gap: 0.35rem;
  overflow-x: auto;
  scrollbar-width: none;
  overscroll-behavior-inline: contain;
}
.ui-jump-chips::-webkit-scrollbar { display: none; }

.ui-jump-chip,
.ui-density-toggle,
.ui-copy-toggle {
  appearance: none;
  border: 1px solid var(--border-subtle);
  color: var(--text-secondary);
  background: rgba(255,255,255,0.035);
  font: 700 0.7rem/1 'DM Sans', sans-serif;
  cursor: pointer;
  transition: color 160ms ease, border-color 160ms ease, background 160ms ease, transform 160ms ease;
}

.ui-jump-chip,
.ui-density-toggle {
  flex: 0 0 auto;
  min-height: 30px;
  padding: 0.46rem 0.7rem;
  border-radius: var(--radius-pill, 999px);
  white-space: nowrap;
}

/* Language Settings Styles */
.language-settings-section {
  padding: 1.5rem;
  max-width: 800px;
}

.language-settings-section h3 {
  margin: 0 0 0.5rem 0;
  font-size: 1.3rem;
  color: var(--text-primary);
}

.section-subtitle {
  color: var(--text-muted);
  font-size: 0.85rem;
  margin: 0 0 1.5rem 0;
}

.secondary-languages-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 0.5rem;
}

.checkbox-pill {
  display: inline-flex;
  align-items: center;
  padding: 0.4rem 0.8rem;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-pill, 999px);
  background: rgba(255,255,255,0.035);
  cursor: pointer;
  transition: all 160ms ease;
}

.checkbox-pill:hover {
  border-color: var(--accent);
  background: rgba(74, 122, 255, 0.1);
}

.checkbox-pill.checked {
  border-color: var(--accent);
  background: rgba(74, 122, 255, 0.15);
}

.checkbox-pill input {
  display: none;
}

.checkbox-pill span {
  font-size: 0.85rem;
  color: var(--text-secondary);
}

.checkbox-label {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  cursor: pointer;
}

.checkbox-label input[type="checkbox"] {
  width: 18px;
  height: 18px;
  cursor: pointer;
}

.checkbox-label span {
  font-size: 0.9rem;
  color: var(--text-secondary);
}

.language-settings-actions {
  display: flex;
  gap: 0.75rem;
  margin-top: 1.5rem;
  flex-wrap: wrap;
}

.language-test-result {
  margin-top: 1.5rem;
  padding: 1rem;
  border-radius: var(--radius-md, 12px);
  border: 1px solid var(--border-subtle);
}

.language-test-result.hidden {
  display: none;
}

/* AP Context Badge - Header Integration */
.ap-context-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.35rem 0.6rem;
  border-radius: var(--radius-pill, 999px);
  background: rgba(74, 122, 255, 0.08);
  border: 1px solid rgba(74, 122, 255, 0.2);
  font-size: 0.75rem;
  margin-left: 0.5rem;
  transition: all 160ms ease;
  cursor: pointer;
}

.ap-context-badge:hover {
  background: rgba(74, 122, 255, 0.12);
  border-color: rgba(74, 122, 255, 0.3);
}

.ap-context-badge[data-priority="critical"] {
  background: rgba(239, 68, 68, 0.08);
  border-color: rgba(239, 68, 68, 0.2);
}

.ap-context-badge[data-priority="critical"]:hover {
  background: rgba(239, 68, 68, 0.12);
  border-color: rgba(239, 68, 68, 0.3);
}

.ap-context-badge[data-priority="high"] {
  background: rgba(245, 158, 11, 0.08);
  border-color: rgba(245, 158, 11, 0.2);
}

.ap-context-badge[data-priority="high"]:hover {
  background: rgba(245, 158, 11, 0.12);
  border-color: rgba(245, 158, 11, 0.3);
}

.ap-badge-compact {
  padding: 0.25rem 0.5rem;
  gap: 0.35rem;
}

.ap-badge-idle {
  background: rgba(107, 114, 128, 0.08);
  border-color: rgba(107, 114, 128, 0.2);
}

.ap-badge-header {
  display: flex;
  align-items: center;
  gap: 0.4rem;
}

.ap-badge-icon {
  font-size: 0.9rem;
  line-height: 1;
}

.ap-badge-domain {
  font-size: 0.65rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-muted);
  font-weight: 600;
}

.ap-badge-body {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.ap-badge-message {
  color: var(--text-secondary);
  font-weight: 500;
}

.ap-badge-expand,
.ap-badge-dismiss,
.ap-badge-details {
  background: none;
  border: none;
  padding: 0.2rem 0.4rem;
  font-size: 0.7rem;
  color: var(--accent);
  cursor: pointer;
  border-radius: 4px;
  transition: background 160ms ease;
}

.ap-badge-expand:hover,
.ap-badge-details:hover {
  background: rgba(74, 122, 255, 0.1);
}

.ap-badge-dismiss {
  color: var(--text-muted);
}

.ap-badge-dismiss:hover {
  background: rgba(107, 114, 128, 0.1);
  color: var(--text-primary);
}

/* AP Context Panel - Expanded View */
.ap-context-panel {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 90%;
  max-width: 500px;
  max-height: 80vh;
  background: var(--bg-deep);
  border: 1px solid var(--border-glass);
  border-radius: var(--radius-lg, 16px);
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4);
  z-index: 1000;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.ap-panel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 1.25rem;
  border-bottom: 1px solid var(--border-subtle);
  background: rgba(255, 255, 255, 0.02);
}

.ap-panel-title {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--text-primary);
}

.ap-panel-close {
  background: none;
  border: none;
  padding: 0.3rem;
  font-size: 1.1rem;
  color: var(--text-muted);
  cursor: pointer;
  border-radius: 4px;
  transition: background 160ms ease;
}

.ap-panel-close:hover {
  background: rgba(107, 114, 128, 0.1);
  color: var(--text-primary);
}

.ap-panel-body {
  flex: 1;
  overflow-y: auto;
  padding: 1rem 1.25rem;
}

.ap-panel-empty {
  text-align: center;
  padding: 2rem;
  color: var(--text-muted);
}

.ap-panel-empty span {
  display: block;
  font-size: 0.9rem;
  font-weight: 500;
  margin-bottom: 0.35rem;
}

.ap-panel-empty small {
  font-size: 0.75rem;
  opacity: 0.8;
}

.ap-panel-insight {
  padding: 0.75rem;
  border-radius: var(--radius-md, 12px);
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid var(--border-subtle);
  margin-bottom: 0.5rem;
}

.ap-panel-insight[data-priority="critical"] {
  border-color: rgba(239, 68, 68, 0.3);
  background: rgba(239, 68, 68, 0.05);
}

.ap-panel-insight[data-priority="high"] {
  border-color: rgba(245, 158, 11, 0.3);
  background: rgba(245, 158, 11, 0.05);
}

.ap-insight-header {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  margin-bottom: 0.35rem;
}

.ap-insight-icon {
  font-size: 0.9rem;
}

.ap-insight-domain {
  font-size: 0.65rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-muted);
  font-weight: 600;
}

.ap-insight-body {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}

.ap-insight-message {
  font-size: 0.85rem;
  color: var(--text-secondary);
  flex: 1;
}

.ap-insight-expand {
  background: none;
  border: none;
  padding: 0.25rem 0.5rem;
  font-size: 0.7rem;
  color: var(--accent);
  cursor: pointer;
  border-radius: 4px;
  white-space: nowrap;
}

.ap-insight-expand:hover {
  background: rgba(74, 122, 255, 0.1);
}

.ap-panel-footer {
  padding: 1rem 1.25rem;
  border-top: 1px solid var(--border-subtle);
  background: rgba(255, 255, 255, 0.02);
}

.ap-panel-chat {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.6rem;
  background: var(--accent);
  border: none;
  border-radius: var(--radius-md, 12px);
  color: white;
  font-size: 0.85rem;
  font-weight: 500;
  cursor: pointer;
  transition: background 160ms ease;
}

.ap-panel-chat:hover {
  background: #4a6bf5;
}

.ap-panel-chat span {
  font-size: 0.9rem;
}

/* Creation Workspace Styles */
.creation-workspace {
  height: 100vh;
  display: flex;
  flex-direction: column;
}

.workspace-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.5rem 2rem;
  border-bottom: 1px solid var(--border-subtle);
  background: var(--card-surface);
}

.workspace-title h1 {
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--text-primary);
  margin: 0 0 0.25rem 0;
}

.workspace-title p {
  font-size: 0.85rem;
  color: var(--text-muted);
  margin: 0;
}

.workspace-actions {
  display: flex;
  gap: 0.75rem;
}

.workspace-layout {
  display: grid;
  grid-template-columns: 250px 1fr 350px;
  gap: 0;
  flex: 1;
  overflow: hidden;
}

/* Project Sidebar */
.project-sidebar {
  border-right: 1px solid var(--border-subtle);
  background: var(--bg-surface);
  display: flex;
  flex-direction: column;
}

.sidebar-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem;
  border-bottom: 1px solid var(--border-subtle);
}

.sidebar-header h3 {
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--text-primary);
  margin: 0;
}

.project-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  padding: 0.75rem 1rem;
  border-bottom: 1px solid var(--border-subtle);
}

.filter-btn {
  padding: 0.25rem 0.5rem;
  font-size: 0.7rem;
  background: transparent;
  border: 1px solid var(--border-subtle);
  border-radius: 4px;
  color: var(--text-muted);
  cursor: pointer;
  transition: all 160ms ease;
}

.filter-btn:hover {
  background: rgba(74, 122, 255, 0.08);
  border-color: var(--accent);
  color: var(--accent);
}

.filter-btn.active {
  background: var(--accent);
  border-color: var(--accent);
  color: white;
}

.project-list {
  flex: 1;
  overflow-y: auto;
  padding: 0.5rem;
}

.project-item {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.75rem;
  border-radius: 8px;
  cursor: pointer;
  transition: background 160ms ease;
  margin-bottom: 0.25rem;
}

.project-item:hover {
  background: rgba(255, 255, 255, 0.02);
}

.project-item.active {
  background: rgba(74, 122, 255, 0.1);
  border: 1px solid rgba(74, 122, 255, 0.2);
}

.project-icon {
  font-size: 1.25rem;
  line-height: 1;
}

.project-info {
  flex: 1;
  min-width: 0;
}

.project-title {
  font-size: 0.85rem;
  font-weight: 500;
  color: var(--text-primary);
  margin-bottom: 0.25rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.project-meta {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.7rem;
}

.lifecycle-badge {
  padding: 0.15rem 0.4rem;
  border-radius: 999px;
  font-size: 0.65rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 600;
}

.lifecycle-badge.seed {
  background: rgba(74, 122, 255, 0.1);
  color: #4a7aff;
}

.lifecycle-badge.ideation {
  background: rgba(245, 158, 11, 0.1);
  color: #f59e0b;
}

.lifecycle-badge.development {
  background: rgba(59, 130, 246, 0.1);
  color: #3b82f6;
}

.lifecycle-badge.growth {
  background: rgba(16, 185, 129, 0.1);
  color: #10b981;
}

.lifecycle-badge.live {
  background: rgba(239, 68, 68, 0.1);
  color: #ef4444;
}

.creation-type {
  color: var(--text-muted);
  text-transform: capitalize;
}

.empty-projects {
  text-align: center;
  padding: 2rem 1rem;
  color: var(--text-muted);
}

.empty-projects p {
  font-size: 0.85rem;
  margin-bottom: 1rem;
}

/* Main Editor */
.main-editor {
  display: flex;
  flex-direction: column;
  background: var(--bg-deep);
  border-right: 1px solid var(--border-subtle);
}

.editor-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.75rem 1rem;
  border-bottom: 1px solid var(--border-subtle);
  background: var(--card-surface);
}

.lifecycle-indicator {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.lifecycle-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--border-subtle);
  transition: all 160ms ease;
}

.lifecycle-dot.active {
  background: var(--accent);
}

.lifecycle-dot.current {
  box-shadow: 0 0 0 3px rgba(74, 122, 255, 0.3);
}

.lifecycle-label {
  font-size: 0.75rem;
  color: var(--text-muted);
  text-transform: capitalize;
}

.editor-tools {
  display: flex;
  gap: 0.25rem;
}

.tool-btn {
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: 1px solid var(--border-subtle);
  border-radius: 4px;
  cursor: pointer;
  transition: all 160ms ease;
  font-size: 0.85rem;
}

.tool-btn:hover {
  background: rgba(255, 255, 255, 0.02);
  border-color: var(--accent);
  color: var(--accent);
}

.editor-body {
  flex: 1;
  overflow: hidden;
}

.creation-editor {
  width: 100%;
  height: 100%;
  padding: 1.5rem;
  font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;
  font-size: 0.9rem;
  line-height: 1.6;
  background: var(--bg-deep);
  border: none;
  resize: none;
  color: var(--text-primary);
}

.creation-editor:focus {
  outline: none;
}

.creation-editor::placeholder {
  color: var(--text-muted);
}

.editor-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.75rem 1rem;
  border-top: 1px solid var(--border-subtle);
  background: var(--card-surface);
}

.context-summary {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.75rem;
}

.context-label {
  color: var(--text-muted);
  font-weight: 600;
}

.context-info {
  color: var(--text-secondary);
}

.word-count {
  font-size: 0.75rem;
  color: var(--text-muted);
}

/* AP Chat Panel */
.ap-chat-panel {
  display: flex;
  flex-direction: column;
  background: var(--bg-surface);
  border-left: 1px solid var(--border-subtle);
}

.chat-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem;
  border-bottom: 1px solid var(--border-subtle);
  background: var(--card-surface);
}

.chat-title {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--text-primary);
}

.ap-icon {
  font-size: 1rem;
}

.chat-messages {
  flex: 1;
  overflow-y: auto;
  padding: 1rem;
}

.chat-welcome {
  text-align: center;
  padding: 2rem 1rem;
  color: var(--text-muted);
}

.chat-welcome p {
  font-size: 0.85rem;
  margin-bottom: 0.5rem;
}

.chat-message {
  margin-bottom: 1rem;
  padding: 0.75rem;
  border-radius: 8px;
  max-width: 85%;
}

.chat-message.user {
  background: rgba(74, 122, 255, 0.1);
  margin-left: auto;
  border: 1px solid rgba(74, 122, 255, 0.2);
}

.chat-message.assistant {
  background: var(--card-surface);
  border: 1px solid var(--border-subtle);
}

.chat-content {
  font-size: 0.85rem;
  line-height: 1.5;
  color: var(--text-secondary);
  white-space: pre-wrap;
}

.chat-input {
  padding: 1rem;
  border-top: 1px solid var(--border-subtle);
  background: var(--card-surface);
}

.chat-input-field {
  width: 100%;
  padding: 0.5rem;
  border: 1px solid var(--border-subtle);
  border-radius: 6px;
  background: var(--bg-deep);
  color: var(--text-primary);
  font-size: 0.85rem;
  resize: none;
  margin-bottom: 0.5rem;
}

.chat-input-field:focus {
  outline: none;
  border-color: var(--accent);
}

.ap-chat-panel.minimized {
  height: 50px;
}

.ap-chat-panel.minimized .chat-messages,
.ap-chat-panel.minimized .chat-input {
  display: none;
}

/* ── Inbox / P2P / Group DM message theming ── */
.inbox-messages {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  margin-bottom: 1rem;
}

.inbox-message {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  max-width: 80%;
  padding: 0.75rem 1rem;
  border-radius: var(--radius-md);
  background: var(--card-surface);
  border: 1px solid var(--border-subtle);
  color: var(--text-primary);
}

.inbox-message.me {
  align-self: flex-end;
  flex-direction: row-reverse;
  background: rgba(var(--gold-rgb), 0.08);
  border-color: rgba(var(--gold-rgb), 0.2);
}

.inbox-message-avatar {
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  background: var(--metal);
  color: var(--bg-deep);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.8rem;
  font-weight: 700;
  flex-shrink: 0;
}

.inbox-message.me .inbox-message-avatar {
  background: var(--gold-primary);
  color: var(--bg-deep);
}

.inbox-message-body {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  min-width: 0;
}

.inbox-message p {
  margin: 0;
  line-height: 1.45;
  word-break: break-word;
}

.inbox-message-meta {
  font-size: 0.7rem;
  color: var(--text-muted);
  display: flex;
  gap: 0.5rem;
  align-items: center;
}

.inbox-message.me .inbox-message-meta {
  justify-content: flex-end;
}

.chat-message {
  margin-bottom: 1rem;
  padding: 0.75rem;
  border-radius: var(--radius-md);
  max-width: 85%;
  display: flex;
  align-items: flex-start;
  gap: 0.6rem;
  background: var(--card-surface);
  border: 1px solid var(--border-subtle);
}

.chat-message.user {
  background: rgba(var(--gold-rgb), 0.08);
  margin-left: auto;
  border-color: rgba(var(--gold-rgb), 0.2);
  flex-direction: row-reverse;
}

.chat-message.assistant {
  background: var(--card-surface);
  border: 1px solid var(--border-subtle);
}

.chat-msg-avatar {
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 50%;
  background: var(--metal);
  color: var(--bg-deep);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.75rem;
  font-weight: 700;
  flex-shrink: 0;
}

.chat-message.user .chat-msg-avatar {
  background: var(--gold-primary);
}

.chat-msg-body {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  min-width: 0;
}

.chat-msg-author {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--gold-primary);
}

.chat-msg-time {
  font-size: 0.7rem;
  color: var(--text-muted);
}

.chat-msg-content {
  font-size: 0.85rem;
  line-height: 1.5;
  color: var(--text-primary);
  word-break: break-word;
}

.guild-chat-messages {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding: 1rem;
  overflow-y: auto;
}

/* ── Checkout ── */
.checkout-main {
  padding-top: calc(var(--topbar-height) + 1rem);
  min-height: 100vh;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  padding-bottom: 2rem;
  display: flex;
  justify-content: center;
}

.checkout-card {
  width: 100%;
  max-width: 640px;
  background: rgba(var(--metal-rgb), 0.05);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-lg);
  padding: 1.75rem;
  display: grid;
  gap: 1.25rem;
}

.checkout-summary {
  display: grid;
  gap: 0.5rem;
  padding: 1rem;
  background: var(--card-surface);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
}

.checkout-line {
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: var(--text-secondary);
  font-size: 0.9rem;
}

.checkout-line strong {
  color: var(--gold-primary);
  font-weight: 600;
}

.checkout-form {
  min-height: 200px;
}

.checkout-form .loading {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  padding: 2rem;
  color: var(--text-muted);
}

/* Responsive */
@media (max-width: 1024px) {
  .workspace-layout {
    grid-template-columns: 200px 1fr;
  }
  
  .ap-chat-panel {
    display: none;
  }
}

@media (max-width: 768px) {
  .workspace-layout {
    grid-template-columns: 1fr;
  }
  
  .project-sidebar {
    display: none;
  }
}

.test-result-success {
  background: rgba(75, 181, 112, 0.1);
  border-color: rgba(75, 181, 112, 0.3);
}

.test-result-error {
  background: rgba(239, 68, 68, 0.1);
  border-color: rgba(239, 68, 68, 0.3);
}

.test-result-success h4,
.test-result-error h4 {
  margin: 0 0 0.75rem 0;
  font-size: 1rem;
}

.test-original,
.test-translated {
  margin: 0.75rem 0;
  padding: 0.75rem;
  background: rgba(255,255,255,0.05);
  border-radius: 8px;
}

.test-original strong,
.test-translated strong {
  display: block;
  font-size: 0.75rem;
  color: var(--text-muted);
  margin-bottom: 0.35rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.test-meta {
  display: flex;
  gap: 1rem;
  margin-top: 0.75rem;
  font-size: 0.75rem;
  color: var(--text-muted);
}

/* Language indicator in chat */
.language-indicator {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.25rem 0.5rem;
  background: rgba(74, 122, 255, 0.1);
  border: 1px solid rgba(74, 122, 255, 0.3);
  border-radius: var(--radius-pill, 999px);
  font-size: 0.7rem;
  color: var(--accent);
  font-weight: 600;
  letter-spacing: 0.04em;
}

.language-indicator span {
  display: flex;
  align-items: center;
  gap: 0.25rem;
}

.language-indicator .language-code {
  text-transform: uppercase;
}

.ui-density-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  color: var(--gold-bright);
  border-color: var(--gold-border);
  background: var(--gold-glow);
}

.ui-jump-chip:hover,
.ui-jump-chip:focus-visible,
.ui-density-toggle:hover,
.ui-density-toggle:focus-visible,
.ui-copy-toggle:hover,
.ui-copy-toggle:focus-visible {
  color: var(--gold-bright);
  border-color: var(--gold-primary);
  background: var(--gold-glow);
  outline: none;
}

.ui-density-surface {
  scroll-margin-top: calc(var(--topbar-height, 64px) + 4.25rem);
  content-visibility: auto;
  contain-intrinsic-size: auto 280px;
  transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.ui-density-surface:hover {
  border-color: color-mix(in srgb, var(--gold-primary) 34%, var(--border-glass));
  box-shadow: 0 14px 34px rgba(0,0,0,0.12);
  transform: translateY(-1px);
}

.ui-dynamic-page[data-ui-density="compact"] {
  --ui-screen-gap: clamp(0.62rem, 0.9vw, 0.85rem);
  --ui-surface-pad: clamp(0.72rem, 1.1vw, 0.95rem);
}

.ui-dynamic-page[data-ui-density="compact"] :is(
  .card, .settings-card, .dashboard-section, .intel-section,
  .workout-premium-section, .learn-catalog-shell, .wealth-overview-card,
  .aspiration-card, .creation-panel, .profile-section
) {
  padding: var(--ui-surface-pad);
}

.ui-dynamic-page[data-ui-density="compact"] :is(
  .workout-today-hero, .learn-continue-hero, .wealth-hero-card, .intel-hero
) {
  min-height: 0;
  padding: clamp(0.9rem, 1.5vw, 1.2rem);
}

.ui-dynamic-page[data-ui-density="compact"] :is(
  .card-header, .section-header, .settings-section-header, .workout-section-head,
  .learn-catalog-header, .wealth-section-head
) {
  margin-bottom: 0.65rem;
}

.ui-dynamic-page[data-ui-density="compact"] :is(
  .workout-library-grid, .learn-catalog-list, #workout-library-grid,
  #nutrition-grocery-lists, .goals-list
) {
  max-height: min(58vh, 590px);
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

.ui-copy-clamp:not(.is-expanded) {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.ui-copy-toggle {
  display: inline-flex;
  margin-top: 0.35rem;
  padding: 0.2rem 0;
  border: 0;
  border-bottom: 1px solid transparent;
  border-radius: 0;
  color: var(--gold-primary);
  background: transparent;
}

.ui-dynamic-page[data-ui-density="comfortable"] {
  --ui-screen-gap: clamp(1rem, 1.4vw, 1.35rem);
  --ui-surface-pad: clamp(1rem, 1.7vw, 1.45rem);
}

/* Adaptive AP intelligence spine
   Organizes existing live page evidence without replacing page-owned data or actions. */
.ui-intelligence-spine {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-width: 0;
  margin-block: 0.65rem;
  border: 1px solid color-mix(in srgb, var(--gold-primary) 32%, var(--border-glass));
  border-radius: 17px;
  background:
    radial-gradient(circle at 88% -20%, var(--gold-glow-med), transparent 40%),
    linear-gradient(132deg, color-mix(in srgb, var(--bg-deep) 96%, var(--gold-primary) 4%), color-mix(in srgb, var(--bg-secondary) 97%, transparent));
  box-shadow: 0 18px 48px rgba(0,0,0,0.2), inset 0 1px rgba(255,255,255,0.04);
}

.ui-intelligence-spine::before {
  content: '';
  position: absolute;
  z-index: -1;
  inset: 0 auto 0 0;
  width: 3px;
  background: linear-gradient(180deg, transparent, var(--gold-bright), var(--gold-primary), transparent);
  opacity: 0.76;
}

.ui-intelligence-spine.has-attention::after {
  content: '';
  position: absolute;
  z-index: -1;
  top: -60%;
  left: -16%;
  width: 20%;
  height: 220%;
  opacity: 0.12;
  transform: rotate(18deg);
  background: linear-gradient(90deg, transparent, var(--gold-bright), transparent);
  animation: ui-intelligence-sheen 5.8s ease-in-out infinite;
  pointer-events: none;
}

@keyframes ui-intelligence-sheen {
  0%, 72%, 100% { left: -22%; opacity: 0; }
  78% { opacity: 0.14; }
  92% { left: 108%; opacity: 0; }
}

.ui-intelligence-spine-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 1rem;
  min-height: 78px;
  padding: 0.78rem 0.85rem 0.78rem 1rem;
}

.ui-intelligence-heading { min-width: 0; }
.ui-intelligence-heading > strong {
  display: inline;
  margin-left: 0.45rem;
  color: var(--text-primary);
  font: 700 0.72rem/1 'Syne', sans-serif;
  letter-spacing: 0.025em;
}
.ui-intelligence-heading > p {
  max-width: 880px;
  margin: 0.36rem 0 0;
  overflow: hidden;
  color: var(--text-secondary);
  font-size: 0.83rem;
  line-height: 1.45;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ui-intelligence-live,
.ui-intelligence-label {
  color: var(--gold-bright);
  font-size: 0.61rem;
  font-weight: 850;
  letter-spacing: 0.115em;
  text-transform: uppercase;
}
.ui-intelligence-live i {
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-right: 0.35rem;
  border-radius: 50%;
  background: var(--gold-bright);
  box-shadow: 0 0 12px var(--gold-primary);
  vertical-align: 0.05em;
}

.ui-intelligence-head-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.42rem;
}
.ui-intelligence-freshness {
  color: var(--text-muted);
  font-size: 0.64rem;
  white-space: nowrap;
}
.ui-intelligence-toggle,
.ui-intelligence-open,
.ui-intelligence-panel button {
  appearance: none;
  min-height: 32px;
  padding: 0.46rem 0.72rem;
  border: 1px solid var(--border-subtle);
  border-radius: 999px;
  color: var(--text-secondary);
  background: rgba(255,255,255,0.035);
  font: 750 0.68rem/1 'DM Sans', sans-serif;
  white-space: nowrap;
  cursor: pointer;
  transition: transform 150ms ease, border-color 150ms ease, color 150ms ease, background 150ms ease;
}
.ui-intelligence-open,
.ui-intelligence-panel button {
  color: var(--gold-bright);
  border-color: var(--gold-border);
  background: var(--gold-glow);
}
.ui-intelligence-toggle:hover,
.ui-intelligence-open:hover,
.ui-intelligence-panel button:hover,
.ui-intelligence-toggle:focus-visible,
.ui-intelligence-open:focus-visible,
.ui-intelligence-panel button:focus-visible {
  color: var(--gold-bright);
  border-color: var(--gold-primary);
  background: var(--gold-glow-med);
  outline: none;
  transform: translateY(-1px);
}

.ui-intelligence-details {
  display: grid;
  grid-template-columns: minmax(230px, 1.2fr) repeat(2, minmax(210px, 1fr));
  gap: 0.58rem;
  max-height: 1000px;
  padding: 0 0.8rem 0.8rem;
  opacity: 1;
  transition: max-height 220ms ease, opacity 180ms ease, padding 220ms ease;
}
.ui-intelligence-spine.is-collapsed .ui-intelligence-details {
  max-height: 0;
  padding-block: 0;
  opacity: 0;
  overflow: hidden;
  pointer-events: none;
}

.ui-intelligence-panel {
  min-width: 0;
  padding: 0.78rem;
  border: 1px solid var(--border-subtle);
  border-radius: 13px;
  background: linear-gradient(145deg, rgba(255,255,255,0.038), rgba(255,255,255,0.012));
}
.ui-intelligence-panel > strong {
  display: block;
  margin-top: 0.38rem;
  color: var(--text-primary);
  font: 700 0.82rem/1.35 'Syne', sans-serif;
}
.ui-intelligence-panel > p {
  margin: 0.38rem 0 0.55rem;
  color: var(--text-secondary);
  font-size: 0.7rem;
  line-height: 1.45;
}
.ui-intelligence-evidence ul {
  display: flex;
  gap: 0.4rem;
  margin: 0.58rem 0 0;
  padding: 0 0 0.12rem;
  overflow-x: auto;
  list-style: none;
  scrollbar-width: none;
}
.ui-intelligence-evidence ul::-webkit-scrollbar { display: none; }
.ui-intelligence-evidence li {
  flex: 0 0 min(185px, 70vw);
  display: grid;
  gap: 0.2rem;
  padding: 0.58rem;
  border: 1px solid var(--border-subtle);
  border-radius: 10px;
  background: rgba(0,0,0,0.14);
}
.ui-intelligence-evidence li > span,
.ui-intelligence-evidence li > small {
  color: var(--text-muted);
  font-size: 0.58rem;
  letter-spacing: 0.04em;
}
.ui-intelligence-evidence li > strong {
  color: var(--text-primary);
  font-size: 0.69rem;
  line-height: 1.3;
}
.ui-intelligence-receipt {
  display: flex;
  flex-wrap: wrap;
  gap: 0.32rem;
  margin: 0.55rem 0;
}
.ui-intelligence-receipt span,
.ui-intelligence-domain-strip span {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0.28rem 0.48rem;
  border: 1px solid var(--gold-border);
  border-radius: 999px;
  color: var(--gold-bright);
  background: var(--gold-glow);
  font-size: 0.59rem;
  font-weight: 700;
  white-space: nowrap;
}
.ui-intelligence-domain-strip {
  grid-column: 1 / -1;
  display: flex;
  gap: 0.35rem;
  overflow-x: auto;
  padding: 0.05rem 0.1rem;
  scrollbar-width: none;
}
.ui-intelligence-domain-strip::-webkit-scrollbar { display: none; }

:root[data-theme="light"] .ui-page-header,
:root[data-theme="light"] .ui-screen-rail {
  box-shadow: 0 12px 32px rgba(77,53,20,0.1);
}

:root[data-theme="light"] .ui-intelligence-spine {
  border-color: color-mix(in srgb, var(--gold-primary) 42%, var(--border-glass));
  background:
    radial-gradient(circle at 88% -20%, rgba(120,128,138,0.15), transparent 40%),
    linear-gradient(132deg, rgba(255,255,255,0.98), rgba(241,243,246,0.96));
  box-shadow: 0 16px 42px rgba(31,40,52,0.11), inset 0 1px rgba(255,255,255,0.9);
}
:root[data-theme="light"] .ui-intelligence-evidence li {
  background: rgba(83,91,103,0.045);
}

@media (max-width: 760px) {
  .app-content.ui-dynamic-page {
    padding: 0.85rem 0.75rem calc(var(--ap-terminal-clearance) + env(safe-area-inset-bottom));
  }

  .ui-page-header {
    min-height: 78px;
    padding: 0.9rem 4.6rem 0.9rem 0.9rem;
    border-radius: 16px;
  }

  .ui-page-header h1,
  .ui-page-header .ws-title { font-size: clamp(1.32rem, 7vw, 1.7rem); }
  .ui-page-header p, .ui-page-header .page-subtitle { font-size: 0.78rem; }

  .ws-header.ui-page-header,
  .fi-page-header.ui-page-header,
  .evolution-page-header.ui-page-header,
  .sched-page-header.ui-page-header {
    padding: 0.9rem 4.6rem 0.9rem 0.9rem !important;
  }

  .ui-page-visual {
    right: 0.9rem;
    width: 2.8rem;
    box-shadow: 0 0 0 6px var(--gold-glow), 0 0 24px var(--gold-glow-med);
  }
  .ui-page-visual::before { inset: 6px; }
  .ui-page-visual::after { display: none; }

  .ui-screen-rail {
    top: calc(var(--topbar-height, 56px) + 0.25rem);
    margin-inline: -0.15rem;
    padding: 0.4rem;
    border-radius: 14px;
  }
  .ui-screen-rail-label { display: none; }
  .ui-density-toggle { padding-inline: 0.55rem; font-size: 0; }
  .ui-density-toggle span { font-size: 0.8rem; }

  .ui-intelligence-spine { margin-block: 0.5rem; border-radius: 15px; }
  .ui-intelligence-spine-head {
    grid-template-columns: 1fr;
    gap: 0.55rem;
    min-height: 0;
    padding: 0.75rem;
  }
  .ui-intelligence-heading > p {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    white-space: normal;
  }
  .ui-intelligence-head-actions { justify-content: flex-start; overflow-x: auto; }
  .ui-intelligence-freshness { margin-right: auto; }
  .ui-intelligence-details {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(82vw, 1fr);
    grid-template-columns: none;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scroll-snap-type: inline mandatory;
  }
  .ui-intelligence-panel { scroll-snap-align: start; }
  .ui-intelligence-domain-strip { grid-column: auto; align-content: flex-start; }

  .ui-dynamic-page[data-ui-density="compact"] :is(
    .workout-library-grid, .learn-catalog-list, #workout-library-grid,
    #nutrition-grocery-lists, .goals-list
  ) { max-height: 52vh; }
}

@media (prefers-reduced-motion: reduce) {
  .ui-density-surface,
  .ui-jump-chip,
  .ui-density-toggle,
  .ui-copy-toggle,
  .ui-intelligence-details,
  .ui-intelligence-toggle,
  .ui-intelligence-open,
  .ui-intelligence-panel button { transition: none; }
  .ui-density-surface:hover { transform: none; }
  .ui-intelligence-spine.has-attention::after { animation: none; display: none; }
}
/* Canonical Living Thesis / Make AP Smarter */
.lt-shell{max-width:1180px!important}
.lt-page{display:grid;gap:1rem;padding-bottom:2rem}
.lt-kicker{display:block;color:var(--gold);font-size:.68rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;margin-bottom:.45rem}
.lt-hero,.lt-compact{position:relative;overflow:hidden;border:1px solid rgba(var(--metal-rgb), .25);background:
  radial-gradient(circle at 85% 12%,rgba(var(--metal-rgb), .2),transparent 32%),
  linear-gradient(135deg,rgba(30,27,22,.98),rgba(14,14,15,.95));border-radius:18px;padding:clamp(1.1rem,3vw,2rem);box-shadow:0 18px 50px rgba(0,0,0,.2)}
.lt-hero{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2rem;align-items:center}
.lt-hero h1{font-family:var(--font-display);font-size:clamp(2rem,5vw,3.7rem);line-height:1;margin:.1rem 0 .75rem;color:var(--text-primary)}
.lt-hero p,.lt-compact p,.lt-section-head p{max-width:760px;color:var(--text-secondary);line-height:1.65;margin:.25rem 0}
.lt-actions{display:flex;gap:.55rem;align-items:center;flex-wrap:wrap;margin-top:1rem}
.lt-orbit>div{width:150px;aspect-ratio:1;border-radius:50%;display:grid;place-content:center;text-align:center;background:
  radial-gradient(circle closest-side,var(--bg-primary) 72%,transparent 74% 99%),
  conic-gradient(var(--gold) var(--lt-progress),rgba(255,255,255,.08) 0);box-shadow:0 0 35px rgba(var(--metal-rgb), .14)}
.lt-orbit strong{font-size:1.7rem;color:var(--gold)}.lt-orbit span{font-size:.68rem;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted)}
.lt-metrics,.lt-compact-metrics{display:grid;grid-template-columns:repeat(5,minmax(130px,1fr));gap:.65rem}
.lt-metric{min-width:0;border:1px solid var(--border);background:var(--card-surface);border-radius:13px;padding:.85rem;display:grid;gap:.18rem}
.lt-metric span,.lt-metric small{color:var(--text-muted);font-size:.68rem}.lt-metric strong{color:var(--text-primary);font-size:1.35rem}
.lt-tabs{position:sticky;top:0;z-index:4;display:flex;gap:.3rem;overflow-x:auto;padding:.4rem;border:1px solid var(--border);border-radius:13px;background:color-mix(in srgb,var(--bg-primary) 88%,transparent);backdrop-filter:blur(14px)}
.lt-tabs button{white-space:nowrap;border:0;border-radius:9px;background:transparent;color:var(--text-secondary);padding:.65rem .9rem;cursor:pointer}
.lt-tabs button.active{background:rgba(var(--metal-rgb), .15);color:var(--gold)}.lt-tabs b{font-size:.65rem;margin-left:.25rem}
.lt-panel{display:none;border:1px solid var(--border);border-radius:16px;background:var(--card-surface);padding:1rem}.lt-panel.active{display:block;animation:fadeIn .22s ease}
.lt-section-head{display:flex;justify-content:space-between;gap:1rem;align-items:flex-end;margin-bottom:.9rem}.lt-section-head h2{font-size:1.05rem;margin:0;color:var(--text-primary)}.lt-section-head p{max-width:520px;font-size:.8rem;text-align:right}
.lt-category-strip{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(220px,25%);gap:.7rem;overflow-x:auto;overscroll-behavior-inline:contain;scroll-snap-type:inline mandatory;padding-bottom:.5rem}
.lt-category-card{scroll-snap-align:start;text-align:left;display:grid;gap:.38rem;min-height:155px;border:1px solid var(--border);border-radius:13px;background:linear-gradient(145deg,rgba(255,255,255,.035),rgba(var(--metal-rgb), .04));color:var(--text-secondary);padding:.9rem;cursor:pointer}
.lt-category-card:hover{border-color:rgba(var(--metal-rgb), .5);transform:translateY(-2px)}.lt-category-card strong{color:var(--text-primary)}.lt-category-card>span{font-size:.7rem}.lt-category-icon{color:var(--gold)!important;font-size:1rem!important}.lt-category-card small{font-size:.65rem;color:var(--text-muted)}
.lt-mini-bar{height:4px;border-radius:999px;background:rgba(255,255,255,.07);overflow:hidden}.lt-mini-bar i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--gold),var(--gold-bright))}
.lt-review-grid,.lt-gap-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:.7rem}.lt-review-card,.lt-gap-card,.lt-history-list article,.lt-control-grid article{border:1px solid var(--border);border-radius:13px;background:rgba(255,255,255,.025);padding:.9rem}
.lt-review-card p,.lt-gap-card p,.lt-history-list p,.lt-control-grid p{color:var(--text-secondary);font-size:.8rem;line-height:1.5}.lt-review-top,.lt-gap-card>div,.lt-history-list article>div{display:flex;justify-content:space-between;gap:.7rem;align-items:center;font-size:.68rem;color:var(--text-muted)}
.lt-status{border-radius:999px;padding:.25rem .5rem}.lt-status-pending{color:var(--gold-bright);background:rgba(var(--metal-rgb), .12)}.lt-danger{color:#dc7777!important}
.lt-history-list{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(260px,34%);gap:.7rem;overflow-x:auto;padding-bottom:.45rem}.lt-history-list article{min-height:150px}
.lt-control-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.65rem}.lt-control-grid strong{color:var(--gold)}
.lt-insight-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:.7rem;margin-top:.8rem}.lt-insight-grid>article{min-width:0;border:1px solid var(--border);border-radius:13px;padding:.85rem;background:rgba(255,255,255,.018)}
.lt-micro-strip{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(175px,45%);gap:.55rem;overflow-x:auto;padding-bottom:.35rem}.lt-micro-strip>div,.lt-lens-list>div{display:grid;gap:.2rem;border-radius:10px;background:rgba(255,255,255,.03);padding:.65rem}.lt-micro-strip strong,.lt-lens-list strong{font-size:.75rem;color:var(--text-primary)}.lt-micro-strip span,.lt-lens-list span{font-size:.68rem;color:var(--gold)}.lt-micro-strip small,.lt-lens-list small{font-size:.63rem;line-height:1.4;color:var(--text-muted)}
.lt-lens-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem;max-height:245px;overflow:auto}
.lt-evidence-columns{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}.lt-evidence-columns h3{font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;color:var(--gold)}.lt-evidence-list{display:grid;gap:.55rem;max-height:480px;overflow:auto;padding-right:.25rem}.lt-evidence-list article{display:grid;gap:.45rem;border:1px solid var(--border);border-radius:11px;background:rgba(255,255,255,.02);padding:.7rem}.lt-evidence-list article>div{display:flex;justify-content:space-between;align-items:center}.lt-evidence-list p{font-size:.76rem;line-height:1.45;color:var(--text-secondary);margin:0}.lt-evidence-list small{font-size:.62rem;color:var(--text-muted)}
.lt-permission-strip{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(215px,25%);gap:.55rem;overflow-x:auto;padding-bottom:.4rem}.lt-permission-strip article{display:grid;gap:.45rem;border:1px solid var(--border);border-radius:11px;background:rgba(255,255,255,.02);padding:.7rem}.lt-permission-strip strong{font-size:.75rem;color:var(--text-primary)}.lt-permission-strip span{font-size:.65rem;color:var(--text-muted)}.lt-permission-strip article>div{display:flex;gap:.35rem;flex-wrap:wrap}
.lt-disclosure,.lt-empty{border:1px dashed var(--border);border-radius:12px;color:var(--text-muted);padding:1rem;font-size:.78rem}.lt-error{text-align:center}.lt-error h2{color:var(--text-primary)}
.lt-compact{display:grid;grid-template-columns:minmax(220px,1.2fr) minmax(300px,1fr);gap:1rem;margin-bottom:1rem}.lt-compact h2{margin:.2rem 0;font-size:1.25rem;color:var(--text-primary)}.lt-compact .lt-actions{grid-column:1/-1;margin-top:0}.lt-compact-metrics{grid-template-columns:repeat(3,1fr)}
.lt-loading{display:grid;grid-template-columns:2fr 1fr 1fr;gap:.7rem;margin-bottom:1rem}.lt-loading span{height:90px;border-radius:14px;background:linear-gradient(90deg,var(--card-surface),rgba(var(--metal-rgb), .1),var(--card-surface));background-size:200% 100%;animation:ltShimmer 1.4s infinite}@keyframes ltShimmer{to{background-position:-200% 0}}
@media(max-width:820px){.lt-hero{grid-template-columns:1fr}.lt-orbit{display:none}.lt-metrics{grid-template-columns:repeat(2,1fr)}.lt-compact,.lt-insight-grid,.lt-evidence-columns{grid-template-columns:1fr}.lt-section-head{align-items:flex-start;flex-direction:column}.lt-section-head p{text-align:left}.lt-category-strip{grid-auto-columns:minmax(210px,75%)}.lt-control-grid{grid-template-columns:repeat(2,1fr)}.lt-history-list{grid-auto-columns:82%}.lt-evidence-list{max-height:360px}}
@media(max-width:480px){.lt-metrics,.lt-compact-metrics,.lt-control-grid{grid-template-columns:1fr 1fr}.lt-hero,.lt-panel,.lt-compact{border-radius:13px}.lt-category-strip{grid-auto-columns:88%}}
.lt-current-self{display:flex;justify-content:space-between;gap:1rem;align-items:center;border:1px solid rgba(var(--metal-rgb), .34);border-radius:14px;padding:.9rem;background:linear-gradient(110deg,rgba(var(--metal-rgb), .1),rgba(255,255,255,.015));margin-bottom:.7rem}
.lt-current-self h3,.lt-self-card h3{margin:.35rem 0;color:var(--text-primary)}.lt-current-self p{max-width:650px;color:var(--text-secondary);font-size:.78rem;line-height:1.5}
.lt-self-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.65rem}.lt-self-card{display:flex;min-width:0;flex-direction:column;border:1px solid var(--border);border-radius:14px;padding:.85rem;background:radial-gradient(circle at 90% 5%,rgba(var(--metal-rgb), .12),transparent 35%),rgba(255,255,255,.02)}.lt-self-card p{color:var(--text-secondary);font-size:.75rem;line-height:1.5;flex:1}.lt-self-card small{color:var(--text-muted);font-size:.62rem;line-height:1.45}
.lt-council-list{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(280px,38%);gap:.65rem;overflow-x:auto;margin-top:.9rem;padding-bottom:.45rem}.lt-council-list article{display:grid;gap:.55rem;border:1px solid var(--border);border-radius:14px;padding:.85rem;background:linear-gradient(145deg,rgba(255,255,255,.03),rgba(var(--metal-rgb), .04))}.lt-council-list article>div{display:flex;justify-content:space-between;gap:.6rem;align-items:center}.lt-council-list p{margin:0;color:var(--text-secondary);font-size:.76rem;line-height:1.5}.lt-council-list small{color:var(--text-muted);font-size:.64rem}
@media(max-width:900px){.lt-self-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.lt-council-list{grid-auto-columns:70%}}
@media(max-width:560px){.lt-current-self{align-items:flex-start;flex-direction:column}.lt-self-grid{grid-template-columns:1fr}.lt-council-list{grid-auto-columns:90%}}
/* Grocery planning presents one reconciled procurement view instead of a raw JSON list. */
.grocery-procurement-card { border: 1px solid var(--border); border-radius: 16px; background: var(--surface); padding: 1rem; display: grid; gap: .85rem; }
.grocery-procurement-card > header { display: flex; justify-content: space-between; gap: .8rem; align-items: center; }
.grocery-procurement-card > header div { display: grid; gap: .15rem; }
.grocery-procurement-card > header span { color: var(--text-muted); font-size: .68rem; text-transform: uppercase; letter-spacing: .1em; }
.grocery-procurement-card > header strong { font-size: 1.08rem; }
.grocery-procurement-card > header small,.grocery-pricing-notice { color: var(--text-muted); font-size: .7rem; }
.grocery-pricing-notice { margin: 0; padding: .55rem .65rem; background: rgba(var(--metal-rgb), .06); border-radius: 8px; }
.grocery-category-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: .7rem; max-height: 420px; overflow: auto; }
.grocery-category-grid section { border: 1px solid var(--border); border-radius: 12px; padding: .7rem; }
.grocery-category-grid h4,.grocery-retailers h4,.grocery-coupons h4 { margin: 0 0 .55rem; color: var(--gold-primary); font-size: .7rem; text-transform: capitalize; letter-spacing: .06em; }
.grocery-item-row,.grocery-retailers > div,.grocery-coupons > div { display: flex; justify-content: space-between; gap: .6rem; align-items: center; border-top: 1px solid var(--border); padding: .5rem 0; }
.grocery-item-row:first-of-type { border-top: 0; }
.grocery-item-row span,.grocery-retailers span,.grocery-coupons span { display: grid; gap: .14rem; }
.grocery-item-row b,.grocery-retailers b,.grocery-coupons b { font-size: .75rem; text-transform: capitalize; }
.grocery-item-row small,.grocery-retailers small,.grocery-coupons small { color: var(--text-muted); font-size: .62rem; }
.grocery-item-row em,.grocery-retailers em { color: var(--text-secondary); font-size: .68rem; font-style: normal; white-space: nowrap; }
.grocery-item-row.owned { opacity: .64; }
.grocery-item-row.owned b { text-decoration: line-through; }
.grocery-warning { padding: .65rem; border: 1px solid rgba(224,122,95,.35); border-radius: 9px; background: rgba(224,122,95,.08); }
.grocery-warning p,.grocery-recommendation { margin: 0; color: var(--text-secondary); font-size: .72rem; line-height: 1.5; }
.grocery-coupon-empty { color: var(--text-muted); font-size: .68rem; padding: .6rem; border: 1px dashed var(--border); border-radius: 9px; }
.grocery-coupons a { color: var(--gold-primary); font-size: .68rem; }
@media (max-width: 640px) { .grocery-procurement-card > header { align-items: flex-start; flex-direction: column; } .grocery-category-grid { grid-template-columns: 1fr; max-height: 380px; } }
.nutrition-mode-note { display:flex; gap:.65rem; align-items:flex-start; margin:.75rem 0; padding:.7rem .8rem; border-radius:11px; border:1px solid var(--border); background:rgba(var(--metal-rgb),.05); }
.nutrition-mode-note strong { color:var(--gold-primary); font-size:.72rem; white-space:nowrap; }
.nutrition-mode-note span { color:var(--text-secondary); font-size:.7rem; line-height:1.45; }
.nutrition-favorite-strip { display:flex; align-items:center; gap:.45rem; overflow-x:auto; padding:.35rem 0 .75rem; }
.nutrition-favorite-strip > strong { font-size:.68rem; text-transform:uppercase; color:var(--text-muted); white-space:nowrap; }
.nutrition-favorite-strip > span { padding:.35rem .55rem; border-radius:999px; border:1px solid rgba(var(--metal-rgb),.28); color:var(--text-secondary); font-size:.66rem; white-space:nowrap; }
.nutrition-favorite-strip > small { color:var(--text-muted); font-size:.67rem; }
@media(max-width:640px){.nutrition-mode-note{display:grid}.nutrition-mode-note strong{white-space:normal}}
:root[data-theme="light"] #app .form-input,
:root[data-theme="light"] #app .form-control,
:root[data-theme="light"] #app .ls-input,
:root[data-theme="light"] #app .ls-select,
:root[data-theme="light"] #app input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),
:root[data-theme="light"] #app textarea,
:root[data-theme="light"] #app select {
  background:linear-gradient(180deg,#fff,#f7f4ed) !important;
  color:var(--text-primary) !important;
  border-color:rgba(var(--metal-rgb),.25) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 6px 18px rgba(61,48,31,.06) !important;
  color-scheme:light;
}
:root[data-theme="light"] #app input::placeholder,
:root[data-theme="light"] #app textarea::placeholder,
:root[data-theme="light"] #app .form-input::placeholder { color:var(--text-muted) !important; }
.fi-transactions-last { margin-top:1.25rem; border-top:2px solid rgba(var(--metal-rgb),.2); }
@media(max-width:640px){.fi-overview-grid{grid-template-columns:1fr !important}.fi-transactions-last{margin-top:.85rem}}

/* Progress hybrid: a living becoming journey with real evidence, not a data sheet. */
.progress-experience-page { --progress-gap: clamp(.85rem, 1.5vw, 1.25rem); }
.progress-kicker { display:block; color:var(--gold-primary); font-size:.65rem; font-weight:750; text-transform:uppercase; letter-spacing:.14em; }
.progress-experience-header { display:flex; align-items:flex-end; justify-content:space-between; gap:1rem; margin-bottom:var(--progress-gap); }
.progress-experience-header h1 { margin:.2rem 0 .35rem; font-size:clamp(1.75rem,3vw,2.45rem); }
.progress-experience-header p { max-width:720px; margin:0; color:var(--text-secondary); font-size:.82rem; line-height:1.55; }
.progress-header-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:.5rem; }
.progress-hybrid-stage { display:grid; grid-template-columns:minmax(300px,.9fr) minmax(340px,1.25fr); gap:clamp(1rem,2.5vw,2.25rem); align-items:stretch; padding:clamp(1.1rem,2.4vw,2rem); border:1px solid rgba(var(--metal-rgb),.24); border-radius:24px; background:radial-gradient(circle at 22% 38%,rgba(123,104,238,.12),transparent 31%),radial-gradient(circle at 88% 5%,rgba(var(--metal-rgb),.14),transparent 30%),linear-gradient(145deg,var(--bg-surface),var(--bg-deep)); box-shadow:0 24px 70px rgba(0,0,0,.2); overflow:hidden; }
.progress-becoming-visual { display:grid; justify-items:center; align-content:center; min-width:0; text-align:center; }
.progress-becoming-visual h2 { max-width:400px; margin:.6rem 0 .35rem; font-size:clamp(1.15rem,2vw,1.55rem); text-transform:capitalize; }
.progress-becoming-visual > p { max-width:420px; margin:0; color:var(--text-secondary); font-size:.75rem; line-height:1.5; }
.progress-identity-orbit { position:relative; display:grid; place-items:center; width:300px; height:300px; margin:.55rem auto; }
.progress-identity-orbit::before,.progress-identity-orbit::after { content:''; position:absolute; border-radius:50%; pointer-events:none; }
.progress-identity-orbit::before { inset:21px; border:1px solid rgba(var(--metal-rgb),.13); background:conic-gradient(from 210deg,rgba(var(--metal-rgb),.03),rgba(var(--metal-rgb),.19),rgba(123,104,238,.12),rgba(var(--metal-rgb),.03)); animation:progress-orbit-turn 42s linear infinite; }
.progress-identity-orbit::after { inset:58px; border:1px dashed rgba(var(--metal-rgb),.2); animation:progress-orbit-turn 58s linear infinite reverse; }
.progress-orbit-glow { position:absolute; inset:42px; border-radius:50%; background:radial-gradient(circle,rgba(123,104,238,.18),rgba(var(--metal-rgb),.07) 42%,transparent 70%); filter:blur(9px); animation:progress-orbit-breathe 5s ease-in-out infinite alternate; }
.progress-core-orb { position:relative; z-index:3; display:grid; place-content:center; width:142px; height:142px; border:1px solid rgba(var(--metal-rgb),.4); border-radius:50%; background:linear-gradient(145deg,var(--bg-elevated),var(--bg-surface)); box-shadow:0 0 0 8px rgba(var(--metal-rgb),.035),0 0 48px rgba(var(--metal-rgb),.2),inset 0 0 28px rgba(var(--metal-rgb),.07); }
.progress-core-orb::before { content:''; position:absolute; inset:-8px; z-index:-1; border-radius:inherit; background:conic-gradient(var(--gold-primary) calc(var(--progress) * 1%),rgba(var(--metal-rgb),.1) 0); mask:radial-gradient(farthest-side,transparent calc(100% - 4px),#000 0); -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 4px),#000 0); }
.progress-core-orb small,.progress-core-orb span { color:var(--text-muted); font-size:.58rem; font-family:'JetBrains Mono',monospace; letter-spacing:.1em; text-transform:uppercase; }
.progress-core-orb strong { margin:.12rem 0; color:var(--gold-primary); font-family:'Syne',sans-serif; font-size:3.15rem; line-height:1; }
.progress-facet-ring { position:absolute; inset:21px; z-index:4; }
.progress-facet { position:absolute; display:grid; place-items:center; width:43px; height:43px; border:1px solid var(--border); border-radius:13px; background:var(--bg-surface); color:var(--text-muted); box-shadow:0 10px 28px rgba(0,0,0,.25); opacity:.56; }
.progress-facet > span { filter:saturate(.45); }
.progress-facet.is-lit { border-color:rgba(var(--metal-rgb),.65); color:var(--gold-bright); opacity:1; box-shadow:0 0 18px rgba(var(--metal-rgb),.22),0 10px 28px rgba(0,0,0,.25); }
.progress-facet.is-lit > span { filter:none; }
.progress-facet[data-slot="1"]{left:50%;top:0;transform:translate(-50%,-50%)}
.progress-facet[data-slot="2"]{right:8%;top:25%;transform:translate(50%,-50%)}
.progress-facet[data-slot="3"]{right:8%;bottom:25%;transform:translate(50%,50%)}
.progress-facet[data-slot="4"]{left:50%;bottom:0;transform:translate(-50%,50%)}
.progress-facet[data-slot="5"]{left:8%;bottom:25%;transform:translate(-50%,50%)}
.progress-facet[data-slot="6"]{left:8%;top:25%;transform:translate(-50%,-50%)}
.progress-guidance-panel { display:grid; grid-template-rows:1fr auto; gap:.8rem; min-width:0; }
.progress-ap-perspective,.progress-next-move { border:1px solid var(--border); border-radius:18px; padding:clamp(1rem,2vw,1.4rem); background:rgba(255,255,255,.025); }
.progress-ap-perspective { display:flex; flex-direction:column; align-items:flex-start; justify-content:center; }
.progress-ap-perspective h2 { max-width:650px; margin:.32rem 0 .55rem; font-size:clamp(1.25rem,2.5vw,2rem); }
.progress-ap-perspective p { max-width:680px; margin:0 0 .9rem; color:var(--text-secondary); font-size:.88rem; line-height:1.65; }
.progress-next-move { border-color:rgba(123,104,238,.32); background:linear-gradient(135deg,rgba(123,104,238,.1),rgba(255,255,255,.02)); }
.progress-next-move h3 { margin:.28rem 0; font-size:1rem; }
.progress-next-move p { margin:0 0 .75rem; color:var(--text-secondary); font-size:.77rem; line-height:1.5; }
.progress-life-pulse { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.7rem; margin-top:var(--progress-gap); }
.progress-life-pulse article { min-width:0; padding:1rem; border:1px solid var(--border); border-radius:16px; background:linear-gradient(145deg,rgba(var(--metal-rgb),.055),rgba(255,255,255,.018)); }
.progress-life-pulse article > small,.progress-life-pulse article > p { display:block; margin:.55rem 0 0; color:var(--text-muted); font-size:.67rem; line-height:1.45; }
.progress-pulse-heading { display:flex; align-items:center; justify-content:space-between; gap:.5rem; }
.progress-pulse-heading strong { color:var(--text-primary); font-size:.73rem; }
.progress-momentum-trail { position:relative; display:flex; align-items:center; justify-content:space-between; margin:.85rem .15rem .55rem; }
.progress-momentum-trail::before { content:''; position:absolute; left:0; right:0; height:1px; background:rgba(var(--metal-rgb),.12); }
.progress-momentum-trail i { position:relative; width:8px; height:8px; border:2px solid var(--bg-surface); border-radius:50%; background:var(--text-muted); opacity:.42; }
.progress-momentum-trail i.is-active { background:var(--gold-primary); opacity:1; box-shadow:0 0 10px rgba(var(--metal-rgb),.65); }
.progress-energy-pulse { display:flex; align-items:flex-end; gap:5px; height:38px; margin:.65rem 0 .35rem; }
.progress-energy-pulse i { width:5px; height:calc(var(--energy) * 1%); min-height:4px; border-radius:3px 3px 1px 1px; background:linear-gradient(to top,var(--ai-deep),var(--ai-primary)); box-shadow:0 0 8px rgba(123,104,238,.16); }
.progress-energy-pulse i.is-empty { background:var(--text-muted); box-shadow:none; opacity:.24; }
.progress-evidence-story { margin-top:var(--progress-gap); padding:1rem; border:1px solid var(--border); border-radius:19px; background:rgba(255,255,255,.015); }
.progress-section-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:.7rem; margin-bottom:.85rem; }
.progress-section-heading h2 { margin:.16rem 0 0; font-size:1rem; }
.progress-text-action { border:0; padding:.25rem 0; background:transparent; color:var(--gold-primary); font:inherit; font-size:.67rem; cursor:pointer; }
.progress-evidence-rail { display:flex; gap:.7rem; max-width:100%; overflow-x:auto; padding:.1rem .1rem .45rem; scroll-snap-type:x mandatory; scrollbar-width:thin; scrollbar-color:rgba(var(--metal-rgb),.3) transparent; }
.progress-evidence-card { flex:0 0 min(300px,82vw); min-height:170px; padding:1rem; border:1px solid var(--border); border-left:2px solid rgba(var(--metal-rgb),.6); border-radius:15px; background:linear-gradient(145deg,var(--bg-surface),rgba(255,255,255,.018)); scroll-snap-align:start; }
.progress-evidence-card.is-identity { border-left-color:var(--ai-primary); }
.progress-evidence-card.is-forming { border-style:dashed; border-left-color:rgba(var(--metal-rgb),.35); }
.progress-evidence-card > div { display:flex; justify-content:space-between; gap:.65rem; color:var(--text-muted); font-size:.6rem; font-weight:700; letter-spacing:.09em; text-transform:uppercase; }
.progress-evidence-card > div strong { color:var(--gold-primary); }
.progress-evidence-card h3 { margin:.65rem 0 .4rem; font-size:.9rem; line-height:1.25; }
.progress-evidence-card p { display:-webkit-box; margin:0; overflow:hidden; color:var(--text-secondary); font-size:.72rem; line-height:1.5; -webkit-box-orient:vertical; -webkit-line-clamp:3; }
.progress-evidence-card small { display:block; margin-top:.8rem; color:var(--text-muted); font-size:.62rem; }
.progress-evidence-card .btn { margin-top:.85rem; }
.progress-system-details { display:grid; gap:.55rem; margin-top:var(--progress-gap); }
.progress-detail-card { overflow:hidden; margin:0; border:1px solid var(--border); border-radius:14px; background:linear-gradient(145deg,var(--bg-surface),rgba(255,255,255,.014)); }
.progress-detail-card > summary { display:flex; align-items:center; justify-content:space-between; min-height:48px; padding:.8rem 1rem; list-style:none; cursor:pointer; font-size:.8rem; font-weight:650; }
.progress-detail-card > summary::-webkit-details-marker { display:none; }
.progress-detail-card > summary::after { content:'+'; margin-left:auto; padding-left:.7rem; color:var(--gold-primary); }
.progress-detail-card[open] > summary::after { content:'\2212'; }
.progress-detail-card > summary span { margin-left:.6rem; color:var(--text-muted); font-size:.65rem; font-weight:400; }
.progress-detail-body { padding:1rem; border-top:1px solid var(--border); }
.progress-detail-body .chart-bars { min-height:120px; }
.progress-detail-intro { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; margin-bottom:.85rem; }
.progress-detail-intro h3 { margin:0 0 .28rem; font-size:.95rem; }
.progress-detail-intro p,.progress-forming-copy { margin:0; color:var(--text-secondary); font-size:.75rem; line-height:1.5; }
.progress-identity-summary { display:grid; grid-template-columns:repeat(auto-fit,minmax(185px,1fr)); gap:.55rem; }
.progress-identity-summary article { display:grid; gap:.2rem; padding:.75rem; border:1px solid var(--border); border-radius:11px; background:rgba(255,255,255,.02); }
.progress-identity-summary strong { font-size:.78rem; }
.progress-identity-summary span { color:var(--text-muted); font-size:.66rem; }
.progress-domain-rails { display:grid; gap:.7rem; }
.progress-domain-row { display:grid; grid-template-columns:26px minmax(88px,.55fr) minmax(100px,2fr) 28px; align-items:center; gap:.55rem; }
.progress-domain-row strong { font-size:.73rem; text-transform:capitalize; }
.progress-domain-row > div { height:7px; overflow:hidden; border-radius:999px; background:rgba(var(--metal-rgb),.1); }
.progress-domain-row i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--gold-primary),var(--gold-bright)); }
.progress-domain-row em { color:var(--text-muted); font-size:.68rem; font-style:normal; text-align:right; }
@keyframes progress-orbit-turn { to { transform:rotate(360deg); } }
@keyframes progress-orbit-breathe { to { opacity:.58; transform:scale(1.05); } }
@media (prefers-reduced-motion:reduce) { .progress-identity-orbit::before,.progress-identity-orbit::after,.progress-orbit-glow { animation:none; } }
@media (max-width:900px) { .progress-hybrid-stage { grid-template-columns:1fr; }.progress-guidance-panel { grid-template-columns:1fr 1fr; grid-template-rows:auto; }.progress-ap-perspective { justify-content:flex-start; } }
@media (max-width:640px) {
  .progress-experience-header { align-items:stretch; flex-direction:column; }
  .progress-header-actions { justify-content:stretch; }
  .progress-header-actions .btn { flex:1 1 9rem; min-height:44px; }
  .progress-hybrid-stage { padding:1rem .75rem; border-radius:19px; }
  .progress-identity-orbit { width:258px; height:258px; }
  .progress-facet-ring { inset:18px; }
  .progress-core-orb { width:126px; height:126px; }
  .progress-core-orb strong { font-size:2.7rem; }
  .progress-guidance-panel { grid-template-columns:1fr; }
  .progress-life-pulse { display:flex; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:.35rem; }
  .progress-life-pulse article { flex:0 0 82%; scroll-snap-align:start; }
  .progress-section-heading { align-items:flex-start; flex-direction:column; }
  .progress-detail-intro { flex-direction:column; }
  .progress-detail-card > summary { align-items:flex-start; }
  .progress-detail-card > summary span { display:block; }
  .progress-domain-row { grid-template-columns:24px 78px minmax(70px,1fr) 24px; gap:.38rem; }
}

.ascension-hub-page {
  --hub-glow: rgba(var(--metal-rgb), .2);
}

.ascension-hub-hero {
  display: flex;
  justify-content: space-between;
  gap: 1.5rem;
  align-items: end;
  padding: clamp(1.25rem, 3vw, 2.25rem);
  margin-bottom: 1rem;
  border: 1px solid rgba(var(--metal-rgb), .24);
  border-radius: 22px;
  background:
    radial-gradient(circle at 82% 12%, rgba(var(--metal-rgb), .18), transparent 34%),
    linear-gradient(135deg, rgba(19, 25, 34, .96), rgba(7, 10, 15, .98));
  overflow: hidden;
}

.ascension-hub-eyebrow,
.ascension-hub-zone header small,
.ascension-hub-object-head small {
  color: var(--gold-primary);
  font-size: .67rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.ascension-hub-hero h1 {
  margin: .35rem 0 .5rem;
  font: 800 clamp(2rem, 5vw, 4rem)/1 Syne, sans-serif;
  letter-spacing: -.045em;
}

.ascension-hub-hero p {
  max-width: 680px;
  color: var(--text-secondary);
  line-height: 1.65;
}

.ascension-hub-actions {
  display: flex;
  gap: .65rem;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.ascension-hub-world {
  display: grid;
  gap: 1rem;
}

.ascension-hub-loading,
.ascension-hub-empty {
  min-height: 320px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .8rem;
  text-align: center;
  padding: 2rem;
  border: 1px solid var(--border);
  border-radius: 20px;
  background: var(--card-surface);
}

.ascension-hub-empty > span {
  font-size: 2.5rem;
  color: var(--gold-primary);
}

.ascension-hub-empty p {
  max-width: 570px;
  color: var(--text-secondary);
}

.ascension-hub-zone {
  position: relative;
  padding: 1.1rem;
  border: 1px solid var(--border);
  border-radius: 20px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.025), transparent),
    var(--card-surface);
  overflow: hidden;
}

.ascension-hub-zone-surrounding_environment {
  background:
    linear-gradient(180deg, rgba(83, 135, 115, .15), transparent 58%),
    var(--card-surface);
}

.ascension-hub-zone-exterior {
  background:
    linear-gradient(180deg, rgba(74, 111, 149, .16), transparent 58%),
    var(--card-surface);
}

.ascension-hub-zone-bedroom {
  background:
    linear-gradient(180deg, rgba(112, 82, 133, .16), transparent 58%),
    var(--card-surface);
}

.ascension-hub-zone header {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 1rem;
  margin-bottom: .9rem;
}

.ascension-hub-zone header h2 {
  margin: .2rem 0 0;
  font-size: 1.1rem;
}

.ascension-hub-zone header p {
  max-width: 480px;
  color: var(--text-muted);
  font-size: .76rem;
  text-align: right;
}

.ascension-hub-zone-track {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
  gap: .85rem;
}

.ascension-hub-object {
  min-width: 0;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 15px;
  background: rgba(5, 8, 13, .72);
  overflow: hidden;
  box-shadow: 0 16px 36px rgba(0,0,0,.18);
}

.ascension-hub-object-visual {
  position: relative;
  min-height: 175px;
  background:
    radial-gradient(circle at 50% 42%, var(--hub-glow), transparent 28%),
    linear-gradient(145deg, #121923, #080b10);
}

.ascension-hub-object-visual img {
  width: 100%;
  height: 210px;
  display: block;
  object-fit: cover;
}

.ascension-hub-object-placeholder {
  min-height: 175px;
  display: grid;
  place-content: center;
  gap: .35rem;
  text-align: center;
  color: var(--text-muted);
}

.ascension-hub-object-placeholder span {
  color: var(--gold-primary);
  font-size: 1.75rem;
}

.ascension-hub-placement {
  position: absolute;
  left: .7rem;
  bottom: .65rem;
  padding: .3rem .55rem;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 999px;
  background: rgba(0,0,0,.72);
  color: #fff;
  font-size: .62rem;
  text-transform: capitalize;
  backdrop-filter: blur(8px);
}

.ascension-hub-object-copy {
  padding: .9rem;
}

.ascension-hub-object-head {
  display: flex;
  justify-content: space-between;
  gap: .75rem;
}

.ascension-hub-object-head h3 {
  margin: .2rem 0 0;
  font-size: 1rem;
}

.ascension-hub-alignment {
  align-self: start;
  padding: .24rem .45rem;
  border: 1px solid rgba(var(--metal-rgb), .35);
  border-radius: 999px;
  color: var(--gold-primary);
  font-size: .62rem;
}

.ascension-hub-object-copy > p {
  margin: .55rem 0;
  color: var(--text-secondary);
  font-size: .75rem;
  line-height: 1.45;
}

.ascension-hub-progress {
  display: flex;
  justify-content: space-between;
  gap: .5rem;
  flex-wrap: wrap;
  margin-top: .7rem;
  color: var(--text-muted);
  font-size: .67rem;
}

.ascension-hub-progress > div {
  width: 100%;
  height: 5px;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
  overflow: hidden;
}

.ascension-hub-progress i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--gold-primary);
}

.ascension-hub-object-meta {
  display: flex;
  justify-content: space-between;
  gap: .65rem;
  margin-top: .75rem;
  color: var(--text-muted);
  font-size: .62rem;
}

.ascension-hub-object-meta a {
  color: var(--gold-primary);
}

@media (max-width: 760px) {
  .ascension-hub-hero,
  .ascension-hub-zone header {
    align-items: flex-start;
    flex-direction: column;
  }
  .ascension-hub-zone header p {
    text-align: left;
  }
  .ascension-hub-actions {
    justify-content: flex-start;
  }
}
.asp-wishlist-overlay {
  position: fixed;
  inset: 0;
  z-index: 10040;
  display: grid;
  place-items: center;
  padding: 1rem;
  background: rgba(2, 4, 8, .78);
  backdrop-filter: blur(12px);
}

.asp-wishlist-modal {
  width: min(760px, 100%);
  max-height: min(88vh, 900px);
  overflow: auto;
  border: 1px solid rgba(var(--metal-rgb), .28);
  border-radius: 20px;
  background: var(--card-surface, #11151d);
  box-shadow: 0 28px 90px rgba(0,0,0,.48);
}

.asp-wishlist-modal-head {
  position: sticky;
  top: 0;
  z-index: 2;
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.15rem 1.2rem;
  border-bottom: 1px solid var(--border);
  background: color-mix(in srgb, var(--card-surface, #11151d) 94%, transparent);
  backdrop-filter: blur(12px);
}

.asp-wishlist-modal-head span {
  color: var(--gold-primary);
  font-size: .65rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.asp-wishlist-modal-head h2 { margin: .2rem 0; font-size: 1.2rem; }
.asp-wishlist-modal-head p { margin: 0; color: var(--text-muted); font-size: .74rem; }
.asp-wishlist-close {
  width: 34px;
  height: 34px;
  flex: 0 0 auto;
  border: 1px solid var(--border);
  border-radius: 50%;
  background: transparent;
  color: var(--text);
  font-size: 1.2rem;
  cursor: pointer;
}
.asp-wishlist-body { padding: 1.15rem; }
.asp-wishlist-loading { min-height: 280px; display: grid; place-content: center; justify-items: center; gap: .75rem; color: var(--text-muted); }
.asp-wishlist-field { display: grid; gap: .35rem; margin-bottom: .8rem; color: var(--text-secondary); font-size: .73rem; font-weight: 600; }
.asp-wishlist-field input,
.asp-wishlist-field textarea,
.asp-wishlist-options select,
.asp-wishlist-link input {
  width: 100%;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: var(--bg-secondary);
  color: var(--text);
  padding: .68rem .75rem;
  font: inherit;
}
.asp-wishlist-items { display: grid; gap: .55rem; max-height: 310px; overflow: auto; margin: 1rem 0; padding: .75rem; border: 1px solid var(--border); border-radius: 12px; }
.asp-wishlist-items legend { padding: 0 .4rem; color: var(--text); font-size: .76rem; font-weight: 700; }
.asp-wishlist-item-choice { display: grid; grid-template-columns: auto 48px 1fr; align-items: center; gap: .65rem; padding: .5rem; border: 1px solid transparent; border-radius: 10px; cursor: pointer; }
.asp-wishlist-item-choice:has(input:checked) { border-color: rgba(var(--metal-rgb), .38); background: rgba(var(--metal-rgb), .08); }
.asp-wishlist-item-choice img,
.asp-wishlist-item-placeholder { width: 48px; height: 48px; border-radius: 8px; object-fit: cover; background: var(--bg-secondary); }
.asp-wishlist-item-placeholder { display: grid; place-content: center; color: var(--gold-primary); }
.asp-wishlist-item-choice span:last-child { display: grid; gap: .15rem; min-width: 0; }
.asp-wishlist-item-choice strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .78rem; }
.asp-wishlist-item-choice small { color: var(--text-muted); font-size: .65rem; text-transform: capitalize; }
.asp-wishlist-options { display: flex; align-items: center; gap: .8rem 1.1rem; flex-wrap: wrap; margin: .85rem 0; color: var(--text-secondary); font-size: .7rem; }
.asp-wishlist-options label { display: flex; align-items: center; gap: .35rem; }
.asp-wishlist-options select { width: auto; padding: .35rem .5rem; }
.asp-wishlist-privacy { margin: .8rem 0; padding: .7rem; border-left: 3px solid var(--gold-primary); border-radius: 7px; background: rgba(var(--metal-rgb), .07); color: var(--text-secondary); font-size: .69rem; line-height: 1.45; }
.asp-wishlist-error { min-height: 1.2rem; margin-bottom: .35rem; color: var(--zone-critical, #f87171); font-size: .72rem; }
.asp-wishlist-existing { margin-top: 1.3rem; padding-top: 1rem; border-top: 1px solid var(--border); }
.asp-wishlist-existing h3 { margin: 0 0 .65rem; font-size: .85rem; }
.asp-wishlist-existing-row { display: flex; justify-content: space-between; align-items: center; gap: .7rem; padding: .65rem 0; border-bottom: 1px solid var(--border); }
.asp-wishlist-existing-row.inactive { opacity: .5; }
.asp-wishlist-existing-row > div:first-child { display: grid; gap: .15rem; }
.asp-wishlist-existing-row small { color: var(--text-muted); font-size: .63rem; }
.asp-wishlist-existing-row > div:last-child { display: flex; gap: .35rem; }
.asp-wishlist-created,
.asp-wishlist-empty { min-height: 280px; display: grid; place-content: center; justify-items: center; gap: .65rem; text-align: center; }
.asp-wishlist-created > span,
.asp-wishlist-empty > span { color: var(--gold-primary); font-size: 2rem; }
.asp-wishlist-created h3,
.asp-wishlist-empty h3 { margin: 0; }
.asp-wishlist-created p,
.asp-wishlist-empty p { margin: 0; color: var(--text-muted); }
.asp-wishlist-link { width: min(560px, 100%); display: grid; grid-template-columns: 1fr auto; gap: .45rem; margin: .45rem 0; }

@media (max-width: 640px) {
  .asp-wishlist-overlay { padding: 0; align-items: end; }
  .asp-wishlist-modal { max-height: 94vh; border-radius: 18px 18px 0 0; }
  .asp-wishlist-existing-row { align-items: flex-start; flex-direction: column; }
}

/* Ascension ecosystem: distinct operating environments on one foundation. */
.ecosystem-page { max-width: 1500px; overflow-x: clip; }
.ecosystem-hero { position:relative; display:grid; grid-template-columns:minmax(0,1.25fr) minmax(260px,.75fr); gap:1.25rem; align-items:end; min-height:250px; margin-bottom:1rem; padding:clamp(1.35rem,4vw,3rem); border:1px solid var(--border-glass); border-radius:24px; overflow:hidden; background:linear-gradient(145deg,rgba(var(--metal-rgb),.13),rgba(12,13,20,.94) 58%); }
.ecosystem-hero::after { content:''; position:absolute; width:310px; aspect-ratio:1; right:-90px; top:-120px; border-radius:50%; background:radial-gradient(circle,rgba(var(--metal-rgb),.2),transparent 68%); pointer-events:none; }
.ecosystem-sprout { background:linear-gradient(145deg,rgba(67,160,104,.18),rgba(12,18,17,.95) 60%); }
.ecosystem-nexus { background:linear-gradient(145deg,rgba(94,112,220,.2),rgba(10,12,24,.96) 62%); }
.ecosystem-kicker { display:block; margin-bottom:.55rem; color:var(--gold-primary); font-size:.68rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
.ecosystem-hero h1 { margin:0 0 .75rem; font-size:clamp(2rem,5vw,4.2rem); line-height:.95; letter-spacing:-.055em; }
.ecosystem-hero p { max-width:720px; margin:0; color:var(--text-secondary); font-size:clamp(.92rem,1.5vw,1.08rem); line-height:1.65; }
.ecosystem-boundary { position:relative; z-index:1; display:grid; gap:.4rem; padding:1rem; border:1px solid rgba(var(--metal-rgb),.18); border-radius:14px; background:rgba(0,0,0,.26); }
.ecosystem-boundary strong { font-size:.82rem; }
.ecosystem-boundary span { color:var(--text-muted); font-size:.72rem; line-height:1.5; }
.ecosystem-module-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.75rem; margin-bottom:1rem; }
.ecosystem-module { min-width:0; padding:1rem; border:1px solid var(--border); border-radius:15px; background:var(--card-surface); }
.ecosystem-module span { color:var(--text-primary); font-size:.82rem; font-weight:750; }
.ecosystem-module p { margin:.45rem 0 0; color:var(--text-muted); font-size:.7rem; line-height:1.5; }
.ecosystem-workspace { padding:clamp(1rem,3vw,1.75rem); }
.ecosystem-workspace-head { display:flex; align-items:flex-end; justify-content:space-between; gap:1rem; margin-bottom:1rem; }
.ecosystem-workspace-head h2 { margin:0; font-size:clamp(1.15rem,2vw,1.65rem); }
.ecosystem-space-card { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.9rem 0; border-bottom:1px solid var(--border); }
.ecosystem-space-card > div { min-width:0; }
.ecosystem-space-card strong,.ecosystem-space-card span { display:block; }
.ecosystem-space-card span { margin-top:.18rem; color:var(--gold-primary); font-size:.64rem; }
.ecosystem-space-card p { margin:.38rem 0 0; color:var(--text-muted); font-size:.72rem; line-height:1.45; }
.ecosystem-empty { display:grid; justify-items:start; gap:.35rem; padding:1rem; border:1px dashed var(--border); border-radius:12px; color:var(--text-muted); font-size:.74rem; }
.ecosystem-empty strong { color:var(--text-primary); }
.ecosystem-error { border-color:rgba(220,80,80,.35); }
.ecosystem-create-form { display:grid; grid-template-columns:1fr 1.5fr auto; gap:.75rem; align-items:end; margin-top:1rem; }
.ecosystem-create-form label { min-width:0; }
.ecosystem-create-form label > span { display:block; margin-bottom:.4rem; color:var(--text-muted); font-size:.65rem; font-weight:700; }
.ecosystem-nexus-note { display:flex; gap:.6rem 1rem; flex-wrap:wrap; margin-top:1rem; padding:.8rem 1rem; border-left:2px solid var(--gold-primary); color:var(--text-muted); font-size:.7rem; line-height:1.45; }
.ecosystem-nexus-note strong { color:var(--text-primary); }
.ecosystem-form-explain { align-self:center; color:var(--text-muted); font-size:.7rem; line-height:1.5; }
.ecosystem-form-explain strong { color:var(--gold-primary); }
.nexus-invite-form { display:grid; grid-template-columns:minmax(180px,260px) auto; gap:.45rem; }

/* Paid ecosystem discovery keeps pricing honest while preserving a useful preview. */
.ecosystem-paywall { position:relative; min-height:min(720px,calc(100dvh - 120px)); display:flex; flex-direction:column; justify-content:center; align-items:flex-start; overflow:hidden; padding:clamp(1.5rem,6vw,5rem); border:1px solid var(--border-glass); border-radius:28px; background:radial-gradient(circle at 85% 14%,rgba(var(--metal-rgb),.2),transparent 30%),linear-gradient(145deg,var(--card-surface),var(--background)); }
.ecosystem-paywall::after { content:''; position:absolute; right:-8%; bottom:-35%; width:55%; aspect-ratio:1; border:1px solid rgba(var(--metal-rgb),.14); border-radius:50%; box-shadow:0 0 0 42px rgba(var(--metal-rgb),.025),0 0 0 84px rgba(var(--metal-rgb),.018); pointer-events:none; }
.ecosystem-paywall h1 { max-width:840px; margin:.2rem 0 1rem; font-size:clamp(2.4rem,7vw,6rem); line-height:.92; letter-spacing:-.065em; }
.ecosystem-paywall > p { max-width:760px; color:var(--text-secondary); font-size:clamp(.95rem,1.8vw,1.15rem); line-height:1.65; }
.ecosystem-paywall-benefits { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.6rem 1rem; max-width:860px; width:100%; margin:1.5rem 0; }
.ecosystem-paywall-benefits div { display:flex; align-items:center; gap:.65rem; padding:.7rem .85rem; border:1px solid var(--border); border-radius:12px; background:rgba(var(--metal-rgb),.035); font-size:.8rem; }
.ecosystem-paywall-benefits i { display:grid; place-items:center; width:22px; height:22px; border-radius:50%; color:var(--background); background:var(--gold-primary); font-style:normal; font-size:.65rem; font-weight:900; }
.ecosystem-paywall-actions { display:flex; flex-wrap:wrap; gap:.7rem; margin-bottom:1rem; }
.ecosystem-paywall > small { max-width:700px; color:var(--text-muted); line-height:1.5; }
.ecosystem-pending { margin-top:1rem; padding:.65rem .85rem; border:1px solid rgba(var(--metal-rgb),.25); border-radius:10px; color:var(--gold-primary); font-size:.72rem; }
.sprout-paywall { background:radial-gradient(circle at 86% 12%,rgba(88,205,160,.22),transparent 30%),radial-gradient(circle at 70% 85%,rgba(107,174,255,.14),transparent 28%),linear-gradient(145deg,var(--card-surface),var(--background)); }

/* SproutOS is intentionally its own child-facing tablet shell. */
.sprout-app-shell { background:transparent; }
.sprout-os-page { max-width:1600px; min-height:100dvh; overflow-x:clip; color:#18243a; background:linear-gradient(180deg,#f8fdff 0%,#eefaff 46%,#fff8e9 100%); border-radius:26px; padding:clamp(1rem,2.5vw,2.25rem) !important; }
.sprout-topbar { display:flex; align-items:center; justify-content:space-between; gap:1.2rem; padding:.5rem .2rem 1.2rem; }
.sprout-overline { color:#4773a7; font-size:.66rem; font-weight:900; letter-spacing:.13em; text-transform:uppercase; }
.sprout-topbar h1 { margin:.25rem 0 .35rem; color:#17233b; font-size:clamp(1.7rem,4vw,3.7rem); line-height:.98; letter-spacing:-.045em; }
.sprout-topbar p { max-width:650px; margin:0; color:#53637c; font-size:.85rem; line-height:1.55; }
.sprout-top-actions { display:flex; align-items:center; gap:.65rem; }
.sprout-pill { border:1px solid rgba(40,72,110,.16); border-radius:999px; padding:.65rem .9rem; color:#254264; background:rgba(255,255,255,.82); font:700 .7rem var(--font-body); cursor:pointer; }
.sprout-companion { display:grid; grid-template-columns:auto auto; align-items:center; gap:.5rem; border:0; border-radius:18px; padding:.5rem .75rem .5rem .5rem; color:white; background:linear-gradient(145deg,#477dff,#7c55e8); box-shadow:0 12px 28px rgba(71,125,255,.25); cursor:pointer; }
.sprout-companion span { display:grid; place-items:center; width:34px; height:34px; border-radius:13px; background:rgba(255,255,255,.2); font-weight:900; }
.sprout-companion small { font-weight:800; }
.sprout-world-rail { display:flex; gap:1rem; overflow-x:auto; padding:.5rem .15rem 1rem; scroll-snap-type:x mandatory; scrollbar-width:none; overscroll-behavior-inline:contain; }
.sprout-world-rail::-webkit-scrollbar { display:none; }
.sprout-world-card { --sprout-card:#6ed5ff; position:relative; flex:0 0 clamp(220px,23vw,335px); min-height:260px; display:flex; flex-direction:column; align-items:flex-start; justify-content:flex-end; overflow:hidden; padding:1.2rem; border:3px solid transparent; border-radius:32px; color:#18243a; background:linear-gradient(150deg,color-mix(in srgb,var(--sprout-card) 72%,white),color-mix(in srgb,var(--sprout-card) 38%,white)); box-shadow:0 16px 30px rgba(41,72,109,.12); scroll-snap-align:start; cursor:pointer; text-align:left; transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease; }
.sprout-world-card::before,.sprout-world-card::after { content:''; position:absolute; border-radius:50%; background:rgba(255,255,255,.25); }
.sprout-world-card::before { width:180px; height:180px; right:-45px; top:-55px; }
.sprout-world-card::after { width:75px; height:75px; right:24px; top:68px; }
.sprout-world-card:hover,.sprout-world-card:focus-visible,.sprout-world-card.active { transform:translateY(-5px) scale(1.01); border-color:rgba(23,35,59,.22); box-shadow:0 20px 38px rgba(41,72,109,.2); outline:none; }
.sprout-world-card b { position:absolute; z-index:1; left:1.2rem; top:1.2rem; display:grid; place-items:center; min-width:64px; height:64px; padding:0 .6rem; border-radius:22px; color:#fff; background:rgba(24,36,58,.78); font-size:1rem; letter-spacing:.04em; box-shadow:0 8px 18px rgba(24,36,58,.2); }
.sprout-world-card span { position:relative; z-index:1; font-size:clamp(1.35rem,2.6vw,2rem); font-weight:900; letter-spacing:-.04em; }
.sprout-world-card small { position:relative; z-index:1; margin-top:.3rem; color:#30425d; font-weight:650; }
.sprout-sun{--sprout-card:#ffd166}.sprout-berry{--sprout-card:#ff7eb6}.sprout-sky{--sprout-card:#6ed5ff}.sprout-leaf{--sprout-card:#70e1a1}.sprout-violet{--sprout-card:#b39cff}.sprout-orange{--sprout-card:#ffad66}.sprout-rose{--sprout-card:#ff9b9b}.sprout-gold{--sprout-card:#ffe28a}
.sprout-rail-controls { display:flex; align-items:center; justify-content:flex-end; gap:.6rem; margin:-.35rem .2rem .8rem; color:#60708a; font-size:.65rem; font-weight:700; }
.sprout-rail-controls button { width:34px; height:34px; border:1px solid rgba(42,73,111,.13); border-radius:50%; color:#254264; background:white; cursor:pointer; }
.sprout-stage { min-height:340px; padding:clamp(1rem,2vw,1.7rem); border:1px solid rgba(42,73,111,.12); border-radius:28px; background:rgba(255,255,255,.8); box-shadow:0 16px 38px rgba(48,80,115,.08); }
.sprout-stage-head { display:flex; align-items:flex-end; justify-content:space-between; gap:1rem; margin-bottom:1rem; }
.sprout-stage-head span { color:#4773a7; font-size:.66rem; font-weight:900; letter-spacing:.1em; text-transform:uppercase; }
.sprout-stage-head h2 { margin:.25rem 0 0; color:#17233b; font-size:clamp(1.35rem,3vw,2.2rem); }
.sprout-stage-head > small { color:#60708a; }
.sprout-domain-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.8rem; }
.sprout-domain { min-width:0; padding:1rem; border:1px solid color-mix(in srgb,var(--sprout-domain) 45%,#d9e4ec); border-radius:22px; background:linear-gradient(160deg,color-mix(in srgb,var(--sprout-domain) 14%,white),white); }
.sprout-domain > b { display:grid; place-items:center; width:42px; height:42px; border-radius:14px; color:#17233b; background:var(--sprout-domain); font-size:.72rem; }
.sprout-domain h3 { margin:.8rem 0 .3rem; color:#17233b; }
.sprout-domain p { min-height:54px; margin:0 0 .8rem; color:#60708a; font-size:.7rem; line-height:1.5; }
.sprout-lesson { width:100%; display:grid; gap:.2rem; padding:.7rem; border:0; border-radius:13px; color:#1b2d48; background:rgba(34,58,91,.055); text-align:left; cursor:pointer; }
.sprout-lesson span { font-weight:800; }.sprout-lesson small { color:#687890; }
.sprout-safe-empty,.sprout-world-preview,.sprout-setup-card { display:grid; justify-items:start; gap:.7rem; padding:clamp(1.2rem,4vw,3rem); border:2px dashed rgba(50,84,125,.16); border-radius:24px; color:#53637c; background:rgba(236,247,255,.75); }
.sprout-guardian-copy { max-width:760px; color:#60708a; line-height:1.6; }
.sprout-household-access { display:flex; justify-content:space-between; align-items:center; gap:1rem; margin-bottom:1rem; padding:1rem; border:1px solid rgba(42,73,111,.13); border-radius:20px; background:linear-gradient(135deg,rgba(71,125,255,.1),rgba(102,206,140,.11)); }
.sprout-household-access>div:first-child { display:grid; gap:.25rem; }.sprout-household-access strong{color:#17233b}.sprout-household-access span{color:#60708a;font-size:.75rem}
.sprout-guardian-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:.8rem; }
.sprout-guardian-card { display:grid; gap:1rem; padding:1rem; border:1px solid rgba(42,73,111,.13); border-radius:20px; background:#fff; }
.sprout-guardian-card div:first-child { display:grid; gap:.25rem; }.sprout-guardian-card strong{color:#17233b;font-size:1rem}.sprout-guardian-card span{color:#60708a;font-size:.7rem}
.sprout-guardian-card-actions { display:flex; flex-wrap:wrap; gap:.5rem; }
.sprout-code-reveal { margin-top:1rem; padding:1.1rem; border:2px solid #70e1a1; border-radius:20px; background:#effff5; color:#30425d; }
.sprout-code-reveal span,.sprout-code-reveal strong { display:block; }.sprout-code-reveal span{font-size:.66rem;text-transform:uppercase;font-weight:900;letter-spacing:.08em}.sprout-code-reveal strong{margin:.35rem 0;color:#17233b;font-size:clamp(1.1rem,3vw,1.65rem);letter-spacing:.08em}
.sprout-add-child { display:flex; justify-content:space-between; align-items:center; gap:1rem; margin-top:1rem; padding:1rem; border-radius:18px; background:rgba(71,125,255,.07); color:#53637c; }
.sprout-add-child-form { display:grid; grid-template-columns:1fr 1fr auto; gap:.6rem; margin-top:.8rem; }.sprout-add-child-form input{min-width:0;min-height:48px;border:1px solid rgba(42,73,111,.17);border-radius:13px;padding:.7rem;background:#fff;color:#17233b;font:inherit}
.sprout-safe-empty strong,.sprout-world-preview strong,.sprout-setup-card h2 { color:#17233b; font-size:clamp(1.3rem,3vw,2rem); }
.sprout-setup-form { display:grid; grid-template-columns:1fr 1fr 1fr auto; gap:.6rem; width:100%; }
.sprout-setup-form input { min-width:0; min-height:48px; border:1px solid rgba(42,73,111,.17); border-radius:13px; padding:.7rem; color:#17233b; background:white; font:inherit; }
.sprout-growth-world { display:grid; grid-template-columns:minmax(220px,.65fr) minmax(0,1.35fr); gap:1.5rem; align-items:center; }
.sprout-tree { position:relative; min-height:250px; display:grid; place-items:center; overflow:hidden; border-radius:28px; background:linear-gradient(180deg,#dff6ff,#dff5d8); }
.sprout-tree span { position:absolute; bottom:35px; width:32px; height:115px; border-radius:22px; background:#8c613d; }
.sprout-tree i { position:absolute; bottom:105px; width:160px; height:130px; border-radius:50%; background:#64c985; box-shadow:-55px 22px 0 -20px #72d894,55px 22px 0 -20px #72d894; }
.sprout-tree b { position:relative; z-index:1; display:grid; place-items:center; width:86px; height:86px; border-radius:50%; color:white; background:#477dff; box-shadow:0 10px 24px rgba(71,125,255,.3); }.sprout-tree b small{display:block;font-size:.55rem}.sprout-growth-copy h3{color:#17233b}.sprout-growth-copy p{color:#60708a;line-height:1.6}

/* FamilyOS reads like an institutional command center, not a consumer dashboard. */
.family-os-page { max-width:1500px; overflow-x:clip; }
.family-command-hero { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:end; gap:1.5rem; padding:clamp(1.4rem,4vw,3.2rem); border:1px solid var(--border-glass); border-radius:24px; background:radial-gradient(circle at 82% 18%,rgba(var(--metal-rgb),.16),transparent 28%),linear-gradient(145deg,var(--card-surface),rgba(11,13,20,.96)); }
.family-command-hero h1 { max-width:900px; margin:.3rem 0 .7rem; font-size:clamp(2rem,5vw,4.6rem); line-height:.94; letter-spacing:-.06em; }
.family-command-hero p { max-width:760px; color:var(--text-secondary); line-height:1.6; }
.family-space-switcher { display:flex; justify-content:space-between; gap:1rem; align-items:center; margin:1rem 0 .7rem; padding:.7rem .9rem; border:1px solid var(--border); border-radius:12px; background:var(--card-surface); }
.family-space-switcher label { display:flex; align-items:center; gap:.6rem; color:var(--text-muted); font-size:.68rem; font-weight:700; }.family-space-switcher select{min-height:38px;border:1px solid var(--border);border-radius:9px;padding:.4rem .7rem;color:var(--text-primary);background:var(--surface)}.family-space-switcher>span{color:var(--text-muted);font-size:.67rem}
.family-module-nav { display:flex; gap:.35rem; overflow-x:auto; padding:.2rem 0 .8rem; scrollbar-width:none; }.family-module-nav::-webkit-scrollbar{display:none}.family-module-nav button{flex:0 0 auto;min-height:42px;padding:.6rem .9rem;border:1px solid var(--border);border-radius:999px;color:var(--text-muted);background:var(--card-surface);font:700 .7rem var(--font-body);cursor:pointer}.family-module-nav button.active{border-color:rgba(var(--metal-rgb),.45);color:var(--background);background:var(--gold-primary)}
.family-sponsored-access { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin:-.35rem 0 .9rem; padding:.75rem .9rem; border:1px solid rgba(var(--metal-rgb),.24); border-radius:14px; background:rgba(var(--metal-rgb),.07); }
.family-sponsored-access strong,.family-sponsored-access span { display:block; }.family-sponsored-access span{margin-top:.2rem;color:var(--text-muted);font-size:.76rem}
.family-invitation-stage { width:min(760px,100%); margin:8vh auto 0; padding:clamp(1rem,4vw,2rem); border:1px solid rgba(var(--metal-rgb),.3); border-radius:24px; background:linear-gradient(145deg,rgba(var(--metal-rgb),.1),var(--surface)); }
.family-invitation-stage h1 { margin:.45rem 0 .6rem; }.family-invitation-stage>p{color:var(--text-muted);max-width:62ch}
.family-invitation-card { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-top:1rem; padding:.9rem; border:1px solid var(--border); border-radius:14px; background:var(--card-surface); }
.family-invitation-card strong,.family-invitation-card span{display:block}.family-invitation-card span{margin-top:.25rem;color:var(--text-muted);font-size:.76rem}
.family-resource-rail { display:grid; grid-auto-flow:column; grid-auto-columns:minmax(260px,32%); gap:.75rem; overflow-x:auto; overscroll-behavior-inline:contain; padding:.2rem 0 .75rem; scroll-snap-type:x proximity; }
.family-resource-card { min-height:230px; display:flex; flex-direction:column; gap:.65rem; padding:1rem; border:1px solid var(--border); border-radius:18px; background:linear-gradient(145deg,rgba(var(--metal-rgb),.08),var(--surface)); scroll-snap-align:start; }
.family-resource-card h3,.family-resource-card p { margin:0; }.family-resource-card p{color:var(--text-muted);font-size:.82rem;line-height:1.5}
.family-resource-card-top,.family-resource-proof { display:flex; align-items:center; justify-content:space-between; gap:.5rem; }
.family-resource-card-top span { color:var(--accent); font-size:.65rem; font-weight:800; letter-spacing:.09em; text-transform:uppercase; }
.family-resource-card-top small,.family-resource-proof span { color:var(--text-muted); font-size:.68rem; }
.family-resource-proof { margin-top:auto; padding-top:.6rem; border-top:1px solid var(--border); align-items:flex-start; flex-direction:column; }
#family-stage { min-height:360px; padding:clamp(1rem,3vw,1.7rem); border:1px solid var(--border); border-radius:20px; background:var(--card-surface); }
.family-overview-grid { display:grid; grid-template-columns:2fr repeat(3,1fr); gap:.75rem; }.family-overview-grid article{min-height:160px;display:flex;flex-direction:column;justify-content:space-between;padding:1rem;border:1px solid var(--border);border-radius:16px;background:var(--surface)}.family-overview-grid article>span,.family-section-head span,.family-create-card>span{color:var(--gold-primary);font-size:.64rem;font-weight:850;letter-spacing:.1em;text-transform:uppercase}.family-overview-grid article>b{font-size:2.4rem}.family-overview-grid article small{color:var(--text-muted);line-height:1.45}.family-overview-grid .family-focus{background:linear-gradient(145deg,rgba(var(--metal-rgb),.1),var(--surface))}.family-focus h2{margin:.55rem 0 1rem;font-size:clamp(1.2rem,2.4vw,2rem);line-height:1.15}
.family-nexus-brief { margin-top:.75rem;padding:1rem;border-left:3px solid var(--gold-primary);background:rgba(var(--metal-rgb),.035)}.family-nexus-brief p{margin:.35rem 0 0;color:var(--text-muted);font-size:.72rem;line-height:1.55}
.family-chat-signal{width:8px;height:8px;border-radius:50%;background:var(--danger,#f87171);box-shadow:0 0 0 3px rgba(248,113,113,.14),0 0 12px rgba(248,113,113,.75);display:none}.family-chat-signal.visible{display:block}
.family-chat-mode{min-height:0;height:100%;display:grid;grid-template-rows:auto minmax(0,1fr);padding:clamp(.8rem,2vw,1.4rem);gap:.8rem;overflow:hidden;background:radial-gradient(circle at 88% 4%,rgba(var(--metal-rgb),.1),transparent 28%)}
.family-chat-mode-head{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;padding:clamp(1rem,2vw,1.5rem);border:1px solid var(--border-glass);border-radius:20px;background:linear-gradient(145deg,var(--card-surface),rgba(11,13,20,.94))}.family-chat-mode-head h1{margin:.25rem 0;font-size:clamp(1.65rem,4vw,2.8rem);letter-spacing:-.04em}.family-chat-mode-head p{max-width:760px;margin:.3rem 0 0;color:var(--text-secondary);line-height:1.55}
#family-chat-mode-content{min-height:0;display:grid;grid-template-rows:auto auto auto minmax(0,1fr) auto;gap:.65rem;overflow:hidden}.family-chat-toolbar{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.7rem .85rem;border:1px solid var(--border-glass);border-radius:14px;background:var(--card-surface)}.family-chat-toolbar label{display:flex;align-items:center;gap:.6rem;color:var(--text-muted);font-size:.72rem}.family-chat-toolbar select{min-height:38px;border:1px solid var(--border-glass);border-radius:10px;padding:.45rem .7rem;color:var(--text-primary);background:var(--bg-surface)}.family-chat-toolbar>span{color:var(--text-muted);font-size:.72rem}
.family-chat-topic-rail,.family-topic-cards{display:flex;gap:.55rem;overflow-x:auto;scroll-snap-type:x proximity}.family-chat-topic-rail button,.family-topic-cards button{flex:0 0 230px;scroll-snap-align:start;min-height:78px;border:1px solid rgba(var(--metal-rgb),.18);border-radius:14px;padding:.75rem;color:var(--text-primary);background:linear-gradient(145deg,rgba(var(--metal-rgb),.08),var(--card-surface));text-align:left;cursor:pointer}.family-chat-topic-rail strong,.family-chat-topic-rail small,.family-topic-cards strong,.family-topic-cards small{display:block}.family-chat-topic-rail small,.family-topic-cards small{margin-top:.3rem;color:var(--text-muted);line-height:1.35}
.family-chat-people{display:flex;gap:.5rem;overflow-x:auto;scroll-snap-type:x proximity}.family-chat-people button{flex:0 0 145px;min-height:74px;display:grid;grid-template-columns:34px 1fr;grid-template-rows:auto auto;align-items:center;column-gap:.5rem;border:1px solid var(--border-glass);border-radius:14px;padding:.6rem;color:var(--text-primary);background:var(--card-surface);text-align:left;cursor:pointer}.family-chat-people button.active{border-color:var(--gold-primary);background:rgba(var(--metal-rgb),.09)}.family-chat-people button>span{grid-row:1/3;width:34px;height:34px;display:grid;place-items:center;border-radius:50%;color:var(--bg-primary);background:linear-gradient(135deg,var(--metal-highlight),var(--gold-primary));font-weight:900}.family-chat-people strong,.family-chat-people small{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.family-chat-people small{color:var(--text-muted);font-size:.62rem}
.direct-chat-people{width:min(900px,100%);margin:1.1rem auto 0;padding:1rem;border:1px solid var(--border-glass);border-radius:18px;background:linear-gradient(145deg,rgba(var(--metal-rgb),.045),var(--card-surface))}.direct-chat-people-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:.7rem}.direct-chat-people-head span,.direct-chat-people-head strong{display:block}.direct-chat-people-head span{color:var(--gold-primary);font-size:.62rem;font-weight:800;text-transform:uppercase;letter-spacing:.1em}.direct-chat-people-rail{display:flex;gap:.55rem;overflow-x:auto}.direct-chat-people-rail>button{flex:0 0 230px;display:grid;grid-template-columns:40px minmax(0,1fr) auto;align-items:center;gap:.6rem;border:1px solid var(--border-glass);border-radius:14px;padding:.65rem;color:var(--text-primary);background:var(--bg-surface);text-align:left;cursor:pointer}.direct-chat-avatar{width:40px;height:40px;display:grid;place-items:center;overflow:hidden;border-radius:50%;color:var(--bg-primary);background:linear-gradient(135deg,var(--metal-highlight),var(--gold-primary));font-weight:900}.direct-chat-avatar img{width:100%;height:100%;object-fit:cover}.direct-chat-people-rail strong,.direct-chat-people-rail small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.direct-chat-people-rail small{margin-top:.2rem;color:var(--text-muted);font-size:.65rem}.direct-chat-people-rail>button>b{min-width:22px;padding:.2rem .35rem;border-radius:999px;color:#fff;background:var(--danger,#e45f5f);font-size:.62rem;text-align:center}.direct-chat-people-empty{padding:.8rem;border:1px dashed var(--border-glass);border-radius:13px;color:var(--text-muted)}.direct-chat-people-empty p{margin:0 0 .6rem}
.family-chat-thread{min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:.55rem;padding:.2rem}.family-chat-thread article{max-width:min(78%,720px);padding:.75rem .9rem;border:1px solid var(--border-glass);border-radius:15px;background:var(--card-surface)}.family-chat-thread article.nexus{border-color:rgba(var(--metal-rgb),.28);background:linear-gradient(145deg,rgba(var(--metal-rgb),.09),var(--card-surface))}.family-chat-thread article>div{display:flex;align-items:center;gap:.5rem}.family-chat-thread article>div span{padding:.18rem .4rem;border-radius:999px;color:var(--gold-primary);background:rgba(var(--metal-rgb),.09);font-size:.6rem;font-weight:800;text-transform:uppercase}.family-chat-thread p{margin:.35rem 0;white-space:pre-wrap;line-height:1.5}.family-chat-thread time{color:var(--text-muted);font-size:.62rem}
.family-chat-composer{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.55rem;padding:.7rem;border:1px solid var(--border-glass);border-radius:16px;background:var(--card-surface)}.family-chat-composer textarea{grid-column:1/-1;min-height:70px;max-height:150px;resize:vertical;border:0;outline:0;color:var(--text-primary);background:transparent}.family-chat-composer label,.family-invite-nexus{display:flex;align-items:center;gap:.45rem;color:var(--gold-primary);font-size:.7rem}.family-chat-empty{align-self:center;justify-self:center;width:min(620px,100%);padding:clamp(1.2rem,4vw,2.5rem);border:1px solid var(--border-glass);border-radius:20px;background:linear-gradient(145deg,rgba(var(--metal-rgb),.08),var(--card-surface));text-align:center}.family-chat-empty.compact{margin:auto}.family-chat-empty>span{color:var(--gold-primary);font-size:.65rem;font-weight:800;text-transform:uppercase;letter-spacing:.12em}.family-chat-empty h2{margin:.5rem 0}.family-chat-empty p{color:var(--text-muted);line-height:1.5}
@media(max-width:640px){.family-chat-mode{padding:.55rem}.family-chat-mode-head{align-items:stretch;flex-direction:column}.family-chat-mode-head .btn{width:100%}.family-chat-toolbar{align-items:stretch;flex-direction:column}.family-chat-toolbar label{justify-content:space-between}.family-chat-thread article{max-width:92%}.family-chat-composer{grid-template-columns:1fr}.family-chat-composer .btn{width:100%}}
.family-section-head { display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;margin-bottom:1rem}.family-section-head h2{margin:.3rem 0 0;font-size:clamp(1.3rem,2.8vw,2.2rem)}
.family-document,.family-create-card { padding:clamp(1.2rem,4vw,2.6rem);border:1px solid var(--border);border-radius:17px;background:linear-gradient(145deg,rgba(var(--metal-rgb),.055),var(--surface))}.family-document strong{font-size:1.2rem}.family-document p{max-width:850px;color:var(--text-secondary);line-height:1.65}.family-document small{color:var(--text-muted)}
.family-record-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem}.family-record-grid article{display:grid;gap:.45rem;padding:1rem;border:1px solid var(--border);border-radius:14px;background:var(--surface)}.family-record-grid b{font-size:1.4rem}.family-record-grid small{color:var(--text-muted)}
.family-record-list { display:grid;gap:.5rem;margin-top:1rem}.family-record-list article{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.8rem .9rem;border:1px solid var(--border);border-radius:12px;background:var(--surface)}.family-record-list strong,.family-record-list small{display:block}.family-record-list small{margin-top:.25rem;color:var(--text-muted)}
.family-quick-form,.family-create-card form { display:grid;grid-template-columns:180px 1fr auto;gap:.6rem}.family-quick-form input,.family-quick-form select,.family-create-card input{min-width:0;min-height:46px;border:1px solid var(--border);border-radius:11px;padding:.65rem .75rem;color:var(--text-primary);background:var(--surface);font:inherit}
.family-timeline { position:relative;display:grid;gap:.8rem}.family-timeline::before{content:'';position:absolute;left:62px;top:10px;bottom:10px;width:1px;background:var(--border)}.family-timeline article{position:relative;display:grid;grid-template-columns:48px 1fr;gap:1.5rem}.family-timeline time{color:var(--gold-primary);font:800 .7rem var(--font-mono)}.family-timeline article>div{padding:.85rem 1rem;border:1px solid var(--border);border-radius:12px;background:var(--surface)}.family-timeline p{margin:.35rem 0;color:var(--text-muted);font-size:.72rem;line-height:1.5}.family-timeline small{color:var(--gold-primary);font-size:.61rem;text-transform:uppercase}.family-empty{padding:1rem;border:1px dashed var(--border);border-radius:12px;color:var(--text-muted);font-size:.75rem}

/* NexusHome co-parenting keeps child coordination compact and household-private. */
.coparenting-page{max-width:1500px;overflow-x:clip}.coparenting-hero{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1.2rem;align-items:end;padding:clamp(1.2rem,3.5vw,2.5rem);border:1px solid var(--border-glass);border-radius:24px;background:radial-gradient(circle at 88% 10%,rgba(var(--metal-rgb),.16),transparent 30%),linear-gradient(145deg,var(--card-surface),var(--surface))}.coparenting-hero h1{margin:.3rem 0 .55rem;font-size:clamp(1.9rem,5vw,4rem);letter-spacing:-.055em;line-height:.96}.coparenting-hero p{max-width:790px;margin:0;color:var(--text-secondary);line-height:1.55}.coparenting-hero-actions{display:flex;gap:.55rem;flex-wrap:wrap;justify-content:flex-end}.coparenting-tabs{position:sticky;z-index:5;top:calc(var(--topbar-height) + .35rem);display:flex;gap:.4rem;overflow-x:auto;margin:.8rem 0;padding:.45rem;border:1px solid var(--border-glass);border-radius:999px;background:color-mix(in srgb,var(--surface) 91%,transparent);backdrop-filter:blur(18px);scrollbar-width:none}.coparenting-tabs::-webkit-scrollbar{display:none}.coparenting-tabs button{flex:0 0 auto;min-height:40px;border:0;border-radius:999px;padding:.55rem .82rem;color:var(--text-muted);background:transparent;font:750 .69rem var(--font-body);cursor:pointer}.coparenting-tabs button.active{color:var(--bg-primary);background:var(--gold-primary)}.coparenting-stage{min-height:380px}.coparenting-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}.coparenting-panel{min-width:0;padding:clamp(.9rem,2vw,1.3rem);border:1px solid var(--border-glass);border-radius:19px;background:linear-gradient(145deg,rgba(var(--metal-rgb),.045),var(--card-surface));box-shadow:0 14px 34px rgba(0,0,0,.08)}.coparenting-panel.wide{grid-column:1/-1}.coparenting-panel h2{margin:.35rem 0 .45rem;font-size:clamp(1.15rem,2.4vw,1.8rem)}.coparenting-panel>p{margin:.35rem 0 .8rem;color:var(--text-muted);font-size:.76rem;line-height:1.55}.coparenting-panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem}.coparenting-boundary{display:grid;gap:.55rem}.coparenting-boundary div{display:grid;grid-template-columns:32px minmax(0,1fr);gap:.65rem;align-items:start;padding:.7rem;border:1px solid var(--border);border-radius:13px;background:var(--surface)}.coparenting-boundary b{display:grid;place-items:center;width:30px;height:30px;border-radius:10px;color:var(--bg-primary);background:var(--gold-primary)}.coparenting-boundary strong,.coparenting-boundary span{display:block}.coparenting-boundary span{margin-top:.2rem;color:var(--text-muted);font-size:.7rem;line-height:1.4}.coparenting-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;margin:.65rem 0}.coparenting-metrics div{padding:.7rem;border:1px solid var(--border);border-radius:13px;background:var(--surface)}.coparenting-metrics b,.coparenting-metrics span{display:block}.coparenting-metrics b{font-size:1.45rem}.coparenting-metrics span{color:var(--text-muted);font-size:.62rem}.coparenting-form,.coparenting-child-form,.coparenting-invite-form{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem;margin:.7rem 0}.coparenting-form.four{grid-template-columns:repeat(4,minmax(0,1fr))}.coparenting-form textarea{grid-column:1/-1;min-height:82px;resize:vertical}.coparenting-form input,.coparenting-form select,.coparenting-form textarea,.coparenting-child-form input,.coparenting-invite-form input{min-width:0;min-height:44px;border:1px solid var(--border);border-radius:11px;padding:.62rem .7rem;color:var(--text-primary);background:var(--surface);font:inherit}.coparenting-child-rail{display:flex;gap:.65rem;overflow-x:auto;padding:.2rem 0 .45rem;scroll-snap-type:x proximity}.coparenting-child-rail>article{flex:0 0 min(300px,80vw);scroll-snap-align:start;padding:.85rem;border:1px solid var(--border);border-radius:15px;background:var(--surface)}.coparenting-child-rail strong,.coparenting-child-rail span,.coparenting-child-rail small{display:block}.coparenting-child-rail span,.coparenting-child-rail small{margin-top:.25rem;color:var(--text-muted);font-size:.68rem}.coparenting-list,.coparenting-card-list{display:grid;gap:.5rem;max-height:min(54dvh,620px);overflow-y:auto;padding-right:.15rem}.coparenting-list>article,.coparenting-card-list>article{display:flex;justify-content:space-between;gap:1rem;padding:.8rem;border:1px solid var(--border);border-radius:14px;background:var(--surface)}.coparenting-list strong,.coparenting-list span,.coparenting-card-list strong,.coparenting-card-list span{display:block}.coparenting-list span,.coparenting-card-list span{margin-top:.2rem;color:var(--text-muted);font-size:.68rem}.coparenting-card-list p{margin:.35rem 0 0;color:var(--text-secondary);font-size:.73rem;line-height:1.45}.coparenting-actions{display:flex;align-items:center;justify-content:flex-end;gap:.35rem;flex-wrap:wrap}.coparenting-actions em{padding:.2rem .42rem;border-radius:999px;color:var(--gold-primary);background:rgba(var(--metal-rgb),.08);font-size:.62rem;font-style:normal;text-transform:capitalize}.coparenting-timeline{display:grid;gap:.5rem;max-height:min(56dvh,650px);overflow-y:auto}.coparenting-timeline article{display:grid;grid-template-columns:130px minmax(0,1fr) auto;gap:.7rem;align-items:center;padding:.75rem;border:1px solid var(--border);border-radius:13px;background:var(--surface)}.coparenting-timeline time{color:var(--gold-primary);font:750 .67rem var(--font-mono)}.coparenting-timeline strong,.coparenting-timeline span{display:block}.coparenting-timeline span{margin-top:.2rem;color:var(--text-muted);font-size:.68rem}.coparenting-timeline em{color:var(--text-muted);font-size:.62rem;font-style:normal;text-transform:capitalize}.coparenting-chat-layout{height:min(70dvh,760px);display:grid;grid-template-columns:minmax(250px,.42fr) minmax(0,1fr);gap:.75rem}.coparenting-chat-layout>.coparenting-panel.wide{grid-column:auto;min-height:0;display:grid;grid-template-rows:minmax(0,1fr) auto}.coparenting-nexus-cards{display:grid;gap:.45rem}.coparenting-nexus-cards button{padding:.75rem;border:1px solid rgba(var(--metal-rgb),.22);border-radius:13px;color:var(--text-primary);background:rgba(var(--metal-rgb),.06);text-align:left;cursor:pointer}.coparenting-messages{min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:.45rem;padding:.15rem}.coparenting-messages>div{align-self:flex-start;max-width:82%;padding:.65rem .78rem;border:1px solid var(--border);border-radius:14px;background:var(--surface)}.coparenting-messages>div.nexus{border-color:rgba(var(--metal-rgb),.3);background:linear-gradient(145deg,rgba(var(--metal-rgb),.1),var(--surface))}.coparenting-messages span{color:var(--text-muted);font-size:.6rem}.coparenting-messages p{margin:.25rem 0 0;white-space:pre-wrap;line-height:1.5}.coparenting-message-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.5rem;margin-top:.55rem}.coparenting-message-form textarea{min-height:62px;max-height:130px;resize:vertical;border:1px solid var(--border);border-radius:13px;padding:.7rem;color:var(--text-primary);background:var(--surface);font:inherit}.coparenting-empty{display:grid;justify-items:start;gap:.5rem;padding:1rem;border:1px dashed var(--border);border-radius:14px;color:var(--text-muted);background:var(--surface)}
@media(max-width:900px){.coparenting-form.four{grid-template-columns:repeat(2,minmax(0,1fr))}.coparenting-chat-layout{grid-template-columns:1fr;height:auto}.coparenting-chat-layout>.coparenting-panel:first-child{display:none}.coparenting-chat-layout>.coparenting-panel.wide{height:min(68dvh,680px)}}
@media(max-width:600px){.coparenting-hero{grid-template-columns:1fr;border-radius:18px}.coparenting-hero-actions,.coparenting-hero-actions .btn{width:100%}.coparenting-tabs{top:calc(var(--topbar-height) + env(safe-area-inset-top,0px) + .2rem);margin-inline:-.15rem;border-radius:16px}.coparenting-grid{grid-template-columns:1fr}.coparenting-form,.coparenting-form.four,.coparenting-child-form,.coparenting-invite-form{grid-template-columns:1fr}.coparenting-list>article,.coparenting-card-list>article{align-items:flex-start;flex-direction:column}.coparenting-actions{justify-content:flex-start}.coparenting-timeline article{grid-template-columns:1fr}.coparenting-message-form{grid-template-columns:1fr}.coparenting-message-form .btn{width:100%}.coparenting-messages>div{max-width:92%}}

/* Contextual opportunity delivery */
.live-opportunity-list{display:grid;gap:.7rem;margin-top:.55rem}
.live-opportunity-card{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1rem;align-items:center;padding:1rem 1.05rem;border:1px solid var(--border);border-radius:14px;background:linear-gradient(135deg,rgba(var(--metal-rgb),.075),rgba(255,255,255,.018));box-shadow:0 12px 32px rgba(0,0,0,.08)}
.live-opportunity-copy{min-width:0}.live-opportunity-meta{display:flex;gap:.55rem;flex-wrap:wrap;color:var(--gold-primary);font-size:.65rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.live-opportunity-copy h3{margin:.35rem 0;font-size:1rem;color:var(--text-primary)}.live-opportunity-copy p{margin:0;color:var(--text-secondary);font-size:.8rem;line-height:1.5}.live-opportunity-copy small{display:block;margin-top:.35rem;color:var(--text-muted,#81786e);font-size:.68rem}
.live-opportunity-actions{display:flex;gap:.4rem;flex-wrap:wrap;justify-content:flex-end;max-width:330px}.live-opportunity-card.opportunity-accepted{border-color:rgba(74,222,128,.55);background:linear-gradient(135deg,rgba(74,222,128,.09),rgba(var(--metal-rgb),.055))}
@media(max-width:720px){.live-opportunity-card{grid-template-columns:1fr}.live-opportunity-actions{justify-content:flex-start;max-width:none}.live-opportunity-actions .btn{flex:1 1 calc(50% - .4rem)}}

/* iPhone/PWA fitting and reliable touch targets. */
@media (max-width: 480px) {
  :root {
    --ap-terminal-clearance: 10rem;
  }
}

html, body, #app { width:100%; max-width:100%; overflow-x:hidden; }
button, [role="button"], .btn, a { touch-action:manipulation; }
@supports (-webkit-touch-callout: none) {
  input:not([type="checkbox"]):not([type="radio"]), textarea, select { font-size:16px !important; }
  .lux-topbar { padding-top:env(safe-area-inset-top, 0px); height:calc(var(--topbar-height) + env(safe-area-inset-top, 0px)); }
  .app-content { margin-top:calc(var(--topbar-height) + env(safe-area-inset-top, 0px)); min-height:calc(100dvh - var(--topbar-height) - env(safe-area-inset-top, 0px)); }
  .nav-mobile-menu { padding-top:env(safe-area-inset-top, 0px); padding-bottom:env(safe-area-inset-bottom, 0px); }
  .modal-overlay { padding:max(.75rem, env(safe-area-inset-top, 0px)) max(.75rem, env(safe-area-inset-right, 0px)) max(.75rem, env(safe-area-inset-bottom, 0px)) max(.75rem, env(safe-area-inset-left, 0px)); }
  .modal-content { max-height:calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 1.5rem); }
}

@media (max-width: 900px) {
  .ecosystem-module-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ecosystem-create-form { grid-template-columns:1fr 1fr; }
  .ecosystem-create-form button { grid-column:1 / -1; width:100%; min-height:48px; }
  .sprout-domain-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .family-overview-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width: 560px) {
  .ecosystem-page { padding-left:max(.75rem,env(safe-area-inset-left,0px)) !important; padding-right:max(.75rem,env(safe-area-inset-right,0px)) !important; }
  .ecosystem-hero { grid-template-columns:1fr; min-height:0; padding:1.2rem; border-radius:17px; }
  .ecosystem-module-grid { display:flex; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:.3rem; }
  .ecosystem-module { flex:0 0 84%; scroll-snap-align:start; }
  .ecosystem-workspace-head,.ecosystem-space-card { align-items:flex-start; flex-direction:column; }
  .ecosystem-create-form { grid-template-columns:1fr; }
  .ecosystem-create-form button { grid-column:auto; }
  .ecosystem-space-card .btn { width:100%; min-height:44px; }
  .nexus-invite-form { width:100%; grid-template-columns:1fr; }
  .ecosystem-paywall-benefits { grid-template-columns:1fr; }
  .ecosystem-paywall-actions,.ecosystem-paywall-actions .btn { width:100%; }
  .sprout-os-page { border-radius:0; }
  .sprout-topbar { align-items:flex-start; flex-direction:column; }
  .sprout-top-actions { width:100%; justify-content:space-between; }
  .sprout-world-card { flex-basis:78vw; min-height:235px; }
  .sprout-domain-grid { display:flex; overflow-x:auto; scroll-snap-type:x mandatory; }
  .sprout-domain { flex:0 0 84%; scroll-snap-align:start; }
  .sprout-stage-head { align-items:flex-start; flex-direction:column; }
  .sprout-setup-form { grid-template-columns:1fr; }
  .sprout-household-access,.sprout-add-child,.sprout-add-child-form { grid-template-columns:1fr; flex-direction:column; align-items:stretch; }
  .sprout-growth-world { grid-template-columns:1fr; }
  .family-command-hero { grid-template-columns:1fr; }
  .family-command-hero .btn { width:100%; }
  .family-space-switcher { align-items:flex-start; flex-direction:column; }
  .family-overview-grid { display:flex; overflow-x:auto; scroll-snap-type:x mandatory; }
  .family-overview-grid article { flex:0 0 82%; scroll-snap-align:start; }
  .family-record-grid { grid-template-columns:1fr; }
  .family-section-head { align-items:flex-start; flex-direction:column; }
  .family-section-head .btn { width:100%; }
  .family-quick-form,.family-create-card form { grid-template-columns:1fr; }
  .family-record-list article { align-items:flex-start; flex-direction:column; }
  .family-sponsored-access { align-items:flex-start; flex-direction:column; }
  .family-invitation-card { align-items:flex-start; flex-direction:column; }
  .family-resource-rail { grid-auto-columns:86%; }
}

.app-shell.creation-studio-shell{padding:0!important;overflow:hidden!important;max-width:none!important;width:100%!important}
@media(max-width:680px){.app-shell.creation-studio-shell{overflow:auto!important}}

/* Creation seed inbox: passive AP-chat ideas become deliberate saved workspaces. */
.creation-rail-section-head{display:flex;align-items:center;justify-content:space-between;padding:.65rem .35rem .35rem;color:var(--gold-primary);font-size:.58rem;font-weight:800;letter-spacing:.14em}.creation-rail-section-head b{min-width:20px;padding:.12rem .35rem;border:1px solid rgba(var(--metal-rgb),.24);border-radius:999px;background:rgba(var(--metal-rgb),.07);text-align:center;font-size:.56rem}.creation-seed-inbox{min-height:0;max-height:38%;display:flex;flex-direction:column;border-bottom:1px solid rgba(var(--metal-rgb),.12)}.creation-seed-list{min-height:0;overflow:auto;padding:0 0 .55rem}.creation-seed-item{display:grid;gap:.45rem;padding:.58rem .62rem;margin:.25rem 0;border:1px solid rgba(var(--metal-rgb),.12);border-radius:10px;background:linear-gradient(120deg,rgba(var(--metal-rgb),.06),transparent)}.creation-seed-item>div>span{display:block;margin-bottom:.2rem;color:var(--gold-primary);font-size:.52rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase}.creation-seed-item p{display:-webkit-box;overflow:hidden;margin:0;color:#948c80;font-size:.65rem;line-height:1.42;-webkit-box-orient:vertical;-webkit-line-clamp:3}.creation-seed-item button{justify-self:start;padding:.3rem .48rem;border:1px solid rgba(var(--metal-rgb),.3);border-radius:7px;background:rgba(var(--metal-rgb),.08);color:var(--gold-primary);font-size:.57rem;font-weight:800;cursor:pointer}.creation-seed-item.started{opacity:.72}.creation-seed-item.started button{color:#938b80}.creation-seed-item button:disabled{opacity:.45;cursor:wait}.creation-seed-empty{padding:.75rem .55rem;color:#756e64;text-align:left}.creation-seed-empty strong{color:#a49b8e;font-size:.68rem}.creation-seed-empty p{margin:.25rem 0 0;font-size:.61rem;line-height:1.45}.creation-workspace-label{padding-top:.6rem}
@media(max-width:680px){.creation-seed-inbox{max-height:none;border-bottom:0}.creation-seed-list{display:flex;gap:.4rem;overflow-x:auto;padding:0 0 .5rem}.creation-seed-item{flex:0 0 210px;margin:0}.creation-seed-empty{min-width:260px}.creation-workspace-label{padding:.35rem .2rem}.creation-project-list{padding-bottom:.15rem}}

/* Contextual program composer: many real variations from verified foundations. */
.workout-program-builder{margin:1rem 0;padding:1.2rem;border:1px solid rgba(var(--metal-rgb),.24);border-top:3px solid var(--gold);border-radius:18px;background:radial-gradient(circle at 92% 0,rgba(var(--metal-rgb),.15),transparent 38%),linear-gradient(145deg,rgba(18,18,20,.98),rgba(7,7,9,.96));box-shadow:0 22px 55px rgba(0,0,0,.25)}
html[data-theme="light"] .workout-program-builder{background:radial-gradient(circle at 92% 0,rgba(var(--metal-rgb),.13),transparent 38%),linear-gradient(145deg,#fff,#f2f3f5)}
.workout-program-heading,.workout-program-result-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem}.workout-program-heading h2,.workout-program-result h3{margin:.18rem 0 .35rem;color:var(--text-primary)}.workout-program-heading p,.workout-program-result p{max-width:720px;margin:0;color:var(--text-secondary);line-height:1.5}.workout-option-count{display:grid;min-width:128px;padding:.7rem .9rem;border:1px solid rgba(var(--metal-rgb),.25);border-radius:14px;background:rgba(var(--metal-rgb),.08);text-align:right}.workout-option-count strong{color:var(--gold);font-size:1.25rem}.workout-option-count span{color:var(--text-muted);font-size:.68rem;text-transform:uppercase;letter-spacing:.08em}.workout-program-controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem;margin:1rem 0}.workout-program-controls label{display:grid;gap:.35rem}.workout-program-controls label>span{color:var(--text-muted);font-size:.7rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.workout-program-actions{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap}.workout-program-loading{display:flex;gap:.65rem;align-items:center;padding:1rem;color:var(--text-secondary)}.workout-program-result{margin-top:1rem;padding:1rem;border:1px solid rgba(var(--metal-rgb),.24);border-radius:15px;background:rgba(var(--metal-rgb),.055)}.workout-readiness-pill{padding:.35rem .6rem;border:1px solid rgba(var(--metal-rgb),.28);border-radius:999px;color:var(--gold);font-size:.72rem;white-space:nowrap}.workout-program-evidence{display:grid;gap:.18rem;margin:.8rem 0;padding:.65rem .75rem;border-left:2px solid var(--gold);background:rgba(var(--metal-rgb),.05)}.workout-program-evidence strong{color:var(--text-primary);font-size:.8rem}.workout-program-evidence span,.workout-program-contract{color:var(--text-muted);font-size:.72rem}.workout-program-exercises{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem;margin:.8rem 0}.workout-program-exercises>div{display:flex;gap:.55rem;align-items:center;padding:.55rem;border:1px solid rgba(var(--metal-rgb),.13);border-radius:10px;background:rgba(0,0,0,.12)}.workout-program-exercises>div>span{display:grid;place-items:center;width:25px;height:25px;border-radius:50%;background:rgba(var(--metal-rgb),.12);color:var(--gold);font-weight:800}.workout-program-exercises p{display:grid;margin:0!important}.workout-program-exercises small{color:var(--text-muted)}.workout-program-caution{margin:.6rem 0!important;padding:.65rem;border-radius:10px;background:rgba(218,157,52,.1);color:var(--text-secondary)!important}.workout-program-contract{display:block;margin-top:.65rem}.workout-program-error{display:flex;justify-content:space-between;align-items:center;gap:1rem}
@media(max-width:760px){.workout-program-heading,.workout-program-result-head,.workout-program-error{flex-direction:column}.workout-option-count{width:100%;text-align:left}.workout-program-controls{grid-template-columns:repeat(2,minmax(0,1fr))}.workout-program-exercises{grid-template-columns:1fr}}
@media(max-width:430px){.workout-program-builder{padding:.9rem;border-radius:14px}.workout-program-controls{grid-template-columns:1fr}.workout-program-actions .btn{width:100%}}