/* Obsidian glass. Surfaces, type and motion share a small set of tokens. */
:root {
  --bg: #08090f;
  --ink: #f5f0fc;
  --muted: #b5acc6;
  --line: rgba(199,181,239,.13);
  --accent: #be9aff;
  --surface-edge: rgba(214,195,255,.2);
  --surface-shadow: 0 16px 40px #00000028, inset 0 1px 0 #fff5ff0b;
  --ease-out: cubic-bezier(.22,1,.36,1);
}
html { color-scheme: dark; scroll-padding-top: 90px; }
body {
  background: #08090f;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
::selection { background: #a67aff55; color: #fff; }
.ambient {
  position: fixed; inset: 0; pointer-events: none; overflow: hidden;
  background: radial-gradient(ellipse at 93% 7%,#7847af26,transparent 47%),
    radial-gradient(ellipse at 0 43%,#483b7621,transparent 49%),
    radial-gradient(ellipse at 55% 100%,#382d6221,transparent 52%);
  opacity: 1; filter: none;
}
.ambient::after {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background-image: radial-gradient(#e0cfff0b .6px,transparent .6px);
  background-size: 5px 5px;
  mask-image: linear-gradient(#0008,transparent 70%);
}
.layout { position: relative; }
.topbar {
  height: 76px; isolation: isolate; border-bottom: 1px solid #d4b9ff0a;
  background: #0c0b14d9;
  -webkit-backdrop-filter: blur(20px) saturate(145%);
  backdrop-filter: blur(20px) saturate(145%);
}
.topbar::after {
  content: ''; position: absolute; bottom: -1px; left: 22%; right: 10%; height: 1px;
  background: linear-gradient(90deg,transparent,#d2b4ff28,transparent); pointer-events: none;
}
.brand { font-weight: 600; letter-spacing: .2px; color: #eee7f8; }
.brand-mark {
  background: linear-gradient(145deg,#a484d03b,#3622476b);
  border: 1px solid #d8baff45;
  box-shadow: inset 1px 1px 0 #fff3ff23,inset -1px -1px 0 #d3abff0c,0 5px 20px #0005;
  text-shadow: 0 1px 14px #dfbcff44;
}
.menu-trigger,.account-trigger,.page-back,.sheet-back,.icon-btn {
  border-color: #d1b7ed29;
  background: linear-gradient(145deg,#ded0f00c,#b99bdb03);
  box-shadow: inset 0 1px 0 #f5e8ff0a,0 4px 12px #00000017;
}
.menu-trigger { border-radius: 16px; }
.menu-trigger>span:not(.surface-ripple-layer) { background: #dac7ff; box-shadow: 0 0 7px #be8eff22; }
.account-trigger { font-size: 14px; }
.page-back { border-radius: 12px; }
.page-back span { font-size: 15px; }
.brand-divider { opacity: .6; }

/* A stable, luminous four-pillar study is the focal point of the home screen. */
.home-view { padding-top: 4px; }
.start-card {
  border: 1px solid transparent; border-radius: 30px;
  background: radial-gradient(ellipse at 52% 53%,#57377b35,transparent 63%) padding-box,
    linear-gradient(155deg,#21192ce8,#100e1bdc 56%,#11101bea) padding-box,
    linear-gradient(145deg,#c6a3ff55,#d1b9ff13 36%,#cdbbfa0d 68%,#ad8fe634) border-box;
  box-shadow: 0 24px 60px #0000003b,inset 0 1px 0 #f7e9ff0b;
  padding-top: 28px;
}
.start-card::before {
  background: radial-gradient(ellipse at 88% 0,#c194ed18,transparent 43%),
    repeating-linear-gradient(90deg,transparent 0,transparent 61px,#cab0ff04 62px);
  mask-image: linear-gradient(#000,transparent 80%);
}
.start-card::after {
  left: 16%; right: 16%; height: 1px;
  background: linear-gradient(90deg,transparent,#ead5ff9e,transparent);
  box-shadow: 0 2px 14px #c2a1ff33;
}
.start-eyebrow { color: #b19bc5; font-size: 11px; letter-spacing: 3px; margin-bottom: 13px; }
.start-card h1 {
  font-size: 38px; font-weight: 600; letter-spacing: 3px;
  color: #f9f3ff; text-shadow: 0 2px 24px #d5aaff17;
}
.start-subtitle { font-size: 16px; line-height: 1.7; color: #bfb0d0; margin-top: 10px; }
.start-card .mg-home { margin-top: 5px; margin-bottom: 17px; }
.mg-glass-pillar {
  opacity: 1; animation: glass-pillar-enter 1.1s var(--ease-out) both;
  animation-delay: calc(var(--mg-delay,0)*.65s);
}
.mg-home-label { fill: #d5c1e7; }
.mg-home-glyph { fill: #f8edff; }
.mg-home-svg linearGradient[id$='-glass'] stop:first-child { stop-color: #d9bcff; stop-opacity: .25; }
.mg-home-svg linearGradient[id$='-glass'] stop:nth-child(2) { stop-color: #9873d3; stop-opacity: .11; }
.mg-home-svg linearGradient[id$='-glass'] stop:last-child { stop-color: #b893f0; stop-opacity: .19; }
.mg-home-svg linearGradient[id$='-edge'] stop:first-child { stop-color: #f2e2ff; stop-opacity: .85; }
.mg-home-svg linearGradient[id$='-edge'] stop:last-child { stop-opacity: .52; }
.mg-home-svg radialGradient[id$='-halo'] stop:first-child { stop-color: #a478ee; stop-opacity: .3; }
.mg-home-grid { opacity: .6; }
.mg-pulse-path { animation: glass-path-flow 8s ease-in-out infinite; }
.mg-origin-ring { animation-duration: 8s; }
.mg-card-light { animation-duration: 4.8s; }
.mg-star { animation-duration: 5.5s; }
.mg-glass-sheen { opacity: .7; }
.mg-orbit-trace { transform-origin: 180px 238px; animation: glass-orbit-breathe 7s ease-in-out infinite; }

/* One primary action; secondary surfaces stay calm. */
.primary-btn,.start-cta {
  position: relative; isolation: isolate; overflow: hidden;
  color: #fffaff;
  background: radial-gradient(ellipse at 50% 0,#eed5ff12,transparent 65%),linear-gradient(105deg,#8552c8 0%,#8150c7 45%,#7440be 100%);
  border: 1px solid #e8cfff42;
  box-shadow: inset 0 1px 0 #fff6ff30,inset 0 -2px 4px #55308e28,0 8px 23px #7e43d52a;
  text-shadow: 0 1px 2px #4f2a832a;
}
.start-cta { height: 57px; border-radius: 17px; font-size: 18px; font-weight: 500; gap: 20px; }
.start-cta::before {
  left: -70%; top: 0; width: 38%; height: 1px;
  background: linear-gradient(90deg,transparent,#fff4ffb3,transparent);
  animation: glass-cta-sweep 9s ease-in-out infinite;
}
.start-cta .icon { transition: transform .35s var(--ease-out); }
.start-meta { color: #b8a3cb; font-size: 13px; margin-top: 16px; }
.home-shortcuts { gap: 9px; margin-top: 19px; }
.home-shortcut {
  border-radius: 20px; min-height: 85px; gap: 11px; font-size: 13px;
  background: linear-gradient(145deg,#211b2bba,#13111bb3);
  border-color: #cdb7e724;
  box-shadow: inset 0 1px 0 #faf0ff0a,0 8px 20px #0000001f;
  color: #d8cce5;
}
.home-shortcut .icon { color: #c9adef; stroke-width: 1.55; width: 23px; height: 23px; }
.home-shortcut::before { background: radial-gradient(ellipse at 50% 0,#ba8eff25,transparent 80%); }
.secondary-btn,.rd-route-card,.bp-apply {
  background: linear-gradient(135deg,#b39ad611,#8f71b407);
  border-color: #c5a7ea2c; color: #e0d0f0;
  box-shadow: inset 0 1px 0 #fff3ff08;
}
button,a,summary { -webkit-tap-highlight-color: transparent; touch-action: manipulation; }
button,a { transition: background-color .2s,border-color .2s,box-shadow .2s,color .2s,transform .2s var(--ease-out); }
:is(button,a,summary):focus-visible { outline: 2px solid #d3b6ff; outline-offset: 4px; }
button:disabled { filter: saturate(.55); cursor: wait; }
.primary-btn:disabled { opacity: .6; }
:is(.primary-btn,.start-cta,.secondary-btn,.home-shortcut,.menu-entry,.term-tile,.rd-fact,.archive,.material,.mg-next,.bp-apply):not(:disabled):active {
  transform: translateY(1px) scale(.986);
}
@media(hover:hover) and (pointer:fine) {
  :is(.home-shortcut,.menu-entry,.rd-fact,.archive,.material,.term-tile,.rd-relation-card,.rd-route-card):hover {
    border-color: #ccb0f74d; background-color: #b894ff09; box-shadow: var(--surface-shadow),0 0 22px #9c70cc09;
    transform: translateY(-2px);
  }
  .primary-btn:hover,.start-cta:hover { box-shadow: inset 0 1px 0 #fff7ff40,0 10px 30px #9b63ed3d; }
  .start-cta:hover .icon { transform: translate(2px,-2px); }
}

/* Reading surfaces: stable dark panels, brighter nested facts, quiet separators. */
.card,.rd-panel,.mg-basics,.fold-panel,.rd-pro-panel {
  background: linear-gradient(150deg,#1b1623ed,#111018f5);
  border-color: #c9b3e527; box-shadow: var(--surface-shadow);
}
.rd-panel,.mg-basics,.fold-panel,.rd-pro-panel { border-radius: 24px; }
.page-heading h1,.rd-report-heading h1 { font-weight: 600; color: #f5eefb; letter-spacing: .3px; }
.page-heading .subtitle,.rd-keynote p { color: #bcb0cb; }
.rd-chart-profile { padding: 6px 1px 3px; }
.avatar { border: 1px solid #d7b4f12c; background: linear-gradient(145deg,#6f4c8f60,#291c3c)!important; box-shadow: inset 0 1px 0 #eedfff12; }
.pill { border-color: #ceb3ed26; background: #ceb3ed07; line-height: 1.5; }
.pill.green { border-color: #acd0bb24; background: #acd0bb07; }
.rd-segment,.mg-tabs,.bp-tabs {
  background: #0b0911b3; border-color: #bfa4e41b;
  box-shadow: inset 0 2px 5px #00000030,0 1px 0 #ede0ff08;
}
.rd-segment { padding: 5px; border-radius: 18px; }
.rd-segment button.active,.mg-tab.mg-active,.bp-tab.bp-active {
  background: linear-gradient(135deg,#8062a449,#b691d924);
  box-shadow: inset 0 1px 0 #f0d6ff24,inset 0 0 0 1px #c7a7e825,0 3px 10px #0003;
  color: #f1e6ff;
}
.rd-topics button { background: #1c172344; border-color: #baa3d319; color: #bcb0c9; }
.rd-topics button.active {
  background: linear-gradient(135deg,#8c61bc40,#6d469e27);
  box-shadow: inset 0 1px 0 #e8caff20,0 4px 13px #0002;
  border-color: #c09ae755; color: #f0ddff;
}
.rd-pillar-panel { padding-top: 16px; }
.rd-pillar-panel .pillars {
  border-color: #c3a6dd1f; border-radius: 18px;
  background: linear-gradient(155deg,#120e1b70,#0b0a10cc);
  box-shadow: inset 0 1px 12px #00000035;
}
.pillar { border-color: #bea5d911; }
.pillar.day {
  background: linear-gradient(180deg,#aa7bd119,#b594e407 65%,transparent);
  box-shadow: inset 1px 0 0 #c3a4e21a,inset -1px 0 0 #c3a4e21a;
}
.pillar.day::before { background: linear-gradient(90deg,transparent,#e0bbff88,transparent); }
.rd-pillar-panel .god-btn { color: #d7baf8; }
.hanzi { text-shadow: 0 1px 16px #ceb8ff0b; }
.rd-pillar-panel .pillar-label { color: #b3a2c3; }
.rd-pillar-panel .hidden-label { color: #a493b4; }
.rd-pillar-panel .stage { color: #b1a4bf; }
.rd-tap-hint { color: #b7a4c9; }
.rd-fact,.rd-question-card,.rd-action-card,.rd-root-list>button,.rd-relation-card,.year-cell {
  border-color: #c1a5dd22; background: linear-gradient(145deg,#221b2b99,#15111dc9);
  box-shadow: inset 0 1px 0 #f5e8ff09,0 6px 18px #00000015;
}
.rd-fact strong { color: #ecdcff; font-weight: 500; }
.rd-fact-more { color: #b39ac7; }
.rd-keynote { padding-top: 7px; }
.rd-keynote h2 { color: #f3eafa; font-weight: 500; }
.rd-keynote-line { height: 2px; width: 46px; border-radius: 2px; background: #bd92ea33; }
.rd-keynote-line i { background: #d1b3ee; }
.rd-keynote-label>span:last-child { color: #aa8cbd; }
.rd-analogy-card {
  background: radial-gradient(ellipse at 100% 0,#c099ea12,transparent 70%),linear-gradient(135deg,#2d213cba,#191322);
  border-color: #ba8ed338; box-shadow: inset 0 1px 0 #ecd8ff13,0 12px 28px #0000001a;
}
.rd-analogy-card p { color: #e4d5ee; }
.rd-quote-mark { color: #cda6f112; }
.rd-fold { border-color: #c8b0df19; }
.rd-fold summary { color: #e0d2eb; }
.rd-fold summary small { color: #b29ac3; }
.rd-fold[open]>summary { color: #eddaff; }
.rd-fold-plus { color: #c4a0e5; }
.rd-fold[open]>.rd-complete-text,.rd-fold[open]>.rd-evidence-list { animation: surface-reveal .3s var(--ease-out) both; }
.rd-yun-current {
  background: radial-gradient(ellipse at 100% 15%,#a474dc23,transparent 65%),linear-gradient(145deg,#281b35,#181120);
  border-color: #c092ea44; box-shadow: inset 0 1px 0 #f6dfff16,0 16px 30px #00000022;
}
.rd-yun-current p,.rd-yun-current small,.rd-caption { color: #b49dc5; }
.yun-item { border-color: #bfa5df24; background: linear-gradient(155deg,#21182b77,#15101caa); }
.yun-item.current { border-color: #c09ee65c; box-shadow: inset 0 1px 0 #efd8ff1a; }
.rd-yun-panel .yun-year { font-size: 13px; letter-spacing: -.15px; }
.year-cell.current-year { border-color: #c8a4fa65; background: linear-gradient(145deg,#68419042,#39245036); }
.rd-bar-space { background: #dbbaff09; }
.rd-bar-space>span { box-shadow: inset 0 1px 0 #ffffff40,inset -2px 0 5px #ffffff18; opacity: .85; }
.rd-section { margin-block: 32px; }
.rd-action-card>span { background: #c39aee0a; border-color: #ceb1f13b; color: #dec6f6; }

/* Floating glass lives on navigation and overlays, not behind long paragraphs. */
dialog {
  color: var(--ink); background: linear-gradient(145deg,#292033ed,#15121ef5);
  border: 1px solid #d6b4f642;
  box-shadow: 0 28px 100px #00000080,inset 0 1px 0 #fff2ff16;
  -webkit-backdrop-filter: blur(28px) saturate(135%);
  backdrop-filter: blur(28px) saturate(135%);
  scrollbar-color: #9876b96b transparent;
}
dialog::backdrop {
  background: #05050b9e;
  -webkit-backdrop-filter: blur(7px); backdrop-filter: blur(7px);
  animation: surface-backdrop .25s ease both;
}
dialog[open] { animation: surface-sheet .38s var(--ease-out) both; }
dialog.menu-sheet { background: linear-gradient(145deg,#30253bed,#17131ff2); animation: surface-menu .28s var(--ease-out) both; }
.sheet-heading {
  background: linear-gradient(180deg,#292130f5,#231b2bef);
  border-bottom-color: #e2c1ff1a;
  -webkit-backdrop-filter: blur(18px) saturate(150%);
  backdrop-filter: blur(18px) saturate(150%);
  box-shadow: 0 12px 18px -16px #000000b3;
}
.sheet-handle { width: 32px; height: 3px; background: #bca4d15c; box-shadow: 0 1px 0 #efddff12; }
.sheet-heading .eyebrow { color: #c0a5d3; }
.sheet-heading .close-sheet { border-radius: 14px; font-weight: 300; color: #dac7e9; }
.sheet-back { color: #e4d2f2; background: #d8c1ee0a; }
#sheet-title { font-weight: 600; letter-spacing: .2px; line-height: 1.4; }
.sheet-subtitle { color: #baa3cc; }
.sheet-context { border-color: #c4a3e21f; background: #c7a4ed08; color: #d0b9e2; }
.menu-entry { border-color: #cdb1e91e; background: #e0c8ff05; min-height: 58px; }
.menu-entry.current,.menu-home { background: linear-gradient(135deg,#a476d223,#c6a4f00a); border-color: #c09be92f; }
.menu-grid+.menu-entry { margin-top: 12px; margin-bottom: 0; }
.menu-footer { color: #ad94bd; letter-spacing: 2px; padding-top: 4px; }
.term-node,.mg-god-card,.mg-mini-pillar.mg-current {
  background: linear-gradient(145deg,#ad82d22e,#5b367018 70%);
  border-color: #cfaff04a; box-shadow: inset 0 1px 0 #f3daff20,0 8px 25px #00000021;
}
.term-node span,.mg-card-kicker,.mg-card-foot,.mg-copy p { color: #bca8cf; }
.mg-god-result strong { color: #ebd8ff; }
.mg-play,.mg-next { border-color: #c1a0e536; min-height: 44px; }
.mg-count { color: #b8a0ca; }
.term-grid { gap: 10px; }
.term-tile { background: #d3b1ec06; border-color: #c1a0dd24; min-height: 50px; }
.term-tile strong { color: #d9c5eb; }
.compact-lesson,.basics-entry button { background: linear-gradient(145deg,#21182ac2,#15101cbb); box-shadow: inset 0 1px 0 #eee2ff09; }

/* Inputs feel inset; focused fields use an outline rather than flashing glow. */
input,select,textarea {
  background-color: #0d0a1480; border-color: #bfa4dc30;
  box-shadow: inset 0 2px 7px #0000001c;
  transition: border-color .2s,box-shadow .2s,background-color .2s;
}
input::placeholder,textarea::placeholder { color: #9a89ac; }
.field label,.ac-field label { color: #d6c7e3; }
input:focus,select:focus,textarea:focus {
  border-color: #c3a1ee85; box-shadow: 0 0 0 3px #b88dea0e,inset 0 2px 7px #0000001c;
}
.searchbox { background: #17111e80; border-color: #cab0e82a; box-shadow: inset 0 1px 5px #00000014; }
.searchbox input { box-shadow: none; }
.searchbox:focus-within { border-color: #c7a1f16b; box-shadow: 0 0 0 3px #b88dea0c; }
.bp-picker { background: linear-gradient(145deg,#d1a9f00a,#0b07114f); border-color: #ccb0e62f; box-shadow: inset 0 1px 0 #f0deff0a; }
.bp-picker select,.bp-text-panel input,.bp-quick-body textarea { background-color: #120c1c; border-color: #c7a7e435; }
.bp-complete .bp-confirm { background: #a173d012; border-color: #c09de247; }
.bp-confirm strong { color: #e0c9f1; }
.bp-confirm small,.input-mode-note,.form-note { color: #b3a0c2; }
.birth-form-actions { background: linear-gradient(transparent,#1a1424f5 22%); }
.ac-emblem,.ac-avatar { box-shadow: inset 0 1px 0 #f6ddff29,0 12px 30px #00000024; }
.ac-field input { background: #0d0916a6; border-color: #c8aae635; }
.ac-field-note,.ac-footnote { color: #b49dc5; }
.ac-local-entry { border-color: #d0ace42c; background: #c7a0ed07; }
.chat-composer {
  background: #241c30eb; border-color: #cfacf05c;
  -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px);
  box-shadow: 0 12px 30px #0005,inset 0 1px 0 #f0ddff16;
}
.chat-composer textarea { box-shadow: none; }
.chat-composer button { background: linear-gradient(145deg,#bd91f5,#8c60c3); box-shadow: inset 0 1px 0 #fff4ff2b; }
.chat-context { background: linear-gradient(145deg,#241a3099,#17111f99); border-color: #c1a0dc2e; }
.bubble { border-color: #c4a9e126; background: #20172be8; font-size: 16px; }
.bubble.user { background: linear-gradient(145deg,#5c397d55,#40285666); }
.stat { background: #c9a0ed05; border-color: #c8a8e322; }
.stat strong { color: #ddc6f8; font-weight: 500; }
.archive { text-align: left; }
.archive-head h3 { font-size: 17px; line-height: 1.65; }
.archive-gz { color: #e0c9f1; letter-spacing: 5px; }
.material { border-color: #bba0d427; }
.material h3 { font-size: 18px; color: #e7daef; font-weight: 500; }
.material-source { color: #b09ac2; }
.source-text { color: #dcd0e7; }
.empty,.chart-gate { border-color: #bfa3da34; background: radial-gradient(ellipse at 50% 0,#a97bda0c,transparent 70%); }
.toast {
  background: #30243feb; border-color: #dbb8ff42; color: #f0defc;
  -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
  box-shadow: 0 12px 35px #0006,inset 0 1px 0 #f5ddff13;
}

/* View transitions are brief and never hold content invisible. */
.view { animation: surface-view .42s var(--ease-out) both; }
.home-shortcut { animation: surface-reveal .5s var(--ease-out) both; }
.home-shortcut:nth-child(2) { animation-delay: .05s; }
.home-shortcut:nth-child(3) { animation-delay: .1s; }
.home-shortcut:nth-child(4) { animation-delay: .15s; }
.rd-chart-content { animation: surface-reveal .35s var(--ease-out) both; }
@keyframes glass-pillar-enter { from { opacity: .62; translate: 0 9px; } to { opacity: 1; translate: 0 0; } }
@keyframes glass-path-flow { 0%,100% { opacity: .38; stroke-dashoffset: 0; } 45% { opacity: .78; stroke-dashoffset: 0; } }
@keyframes glass-orbit-breathe { 0%,100% { opacity: .3; } 50% { opacity: .65; } }
@keyframes glass-cta-sweep { 0%,72% { transform: translateX(0); } 92%,100% { transform: translateX(580%); } }
@keyframes surface-view { from { opacity: .55; transform: translateY(7px); } to { opacity: 1; transform: none; } }
@keyframes surface-reveal { from { opacity: .65; transform: translateY(5px); } to { opacity: 1; transform: none; } }
@keyframes surface-sheet { from { opacity: .35; translate: 0 16px; } to { opacity: 1; translate: 0 0; } }
@keyframes surface-menu { from { opacity: .35; translate: 0 -7px; } to { opacity: 1; translate: 0 0; } }
@keyframes surface-backdrop { from { opacity: 0; } to { opacity: 1; } }

.surface-feedback-static { position: relative; }
.surface-feedback-host>.surface-ripple-layer[aria-hidden='true'] { position: absolute; inset: 0; display:block; width:auto; height:auto; padding:0; margin:0; overflow:hidden; border:0; border-radius:inherit; pointer-events:none; z-index:2; background:none; box-shadow:none; transform:none; }
.surface-ripple {
  position: absolute; display: block; border-radius: 50%; pointer-events: none;
  background: radial-gradient(circle,#ebd8ff80 0%,#c191ff35 40%,transparent 70%);
  transform: translate(-50%,-50%) scale(.08); opacity: 0;
  will-change: transform,opacity;
}

@media(max-width:680px) {
  .topbar { position: sticky; top: 0; padding-inline: 18px; height: 73px; }
  main { padding-top: 16px; }
  .home-view { padding-top: 0; }
  .start-card { padding: 27px 20px 23px; }
  .start-card h1 { font-size: 37px; }
  .start-card .mg-home-svg { max-height: 245px; }
  .start-card .mg-home { margin-top: 4px; margin-bottom: 18px; }
  .rd-chart-profile .profile-date { font-size: 13px; }
  .rd-chart-profile .profile-line .icon-btn { width: 44px; height: 44px; }
  .rd-panel { border-radius: 22px; }
  .rd-topics { gap: 7px; }
  .rd-report-heading>span { color: #b39cc4; }
  dialog { border-radius: 28px 28px 0 0; border-bottom: 0; }
  dialog.menu-sheet { border-radius: 24px; border-bottom: 1px solid #d6b4f642; }
  .sheet-heading { top: -20px; }
  .bp-picker select,.bp-text-panel input { font-size: 16px; }
  .rd-tap-hint { font-size: 13px; }
}
@media(max-width:365px) {
  .topbar { padding-inline: 12px; gap: 7px; }
  .brand { font-size: 15px; }
  .brand-divider { display: none; }
  .account-trigger { min-width: 52px; padding-inline: 8px; }
  .page-back { padding-inline: 7px; }
  .start-card { padding-inline: 18px; }
  .start-card h1 { font-size: 35px; }
  .start-subtitle { font-size: 15px; }
  .start-eyebrow { letter-spacing: 2.3px; }
  .home-shortcuts { gap: 7px; }
  .home-shortcut { font-size: 13px; }
  .rd-pillar-panel { padding-inline: 10px; }
}
@media(max-width:680px) and (max-height:740px) {
  .start-card { padding-top: 23px; padding-bottom: 20px; }
  .start-card .mg-home-svg { max-height: 202px; }
  .start-card .mg-home { margin-top: 0; margin-bottom: 12px; }
  .home-shortcuts { margin-top: 17px; }
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
  .topbar { background: #100d18; }
  dialog,.sheet-heading,.chat-composer,.toast { background: #241b30; }
}
body[data-page-active='false'] *,body[data-page-active='false'] *::before,body[data-page-active='false'] *::after {
  animation-play-state: paused!important;
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation: none!important; transition: none!important; scroll-behavior: auto!important; }
  .mg-glass-pillar { opacity: 1; translate: none; }
  .mg-pulse-path { opacity: .6; stroke-dashoffset: 0; }
  .surface-ripple-layer { display: none!important; }
}

/* Floating controls leave the canvas continuous from top to bottom. */
.floating-controls {
  position: fixed; inset: 0 0 auto; z-index: 20;
  display: flex; align-items: center; gap: 10px;
  max-width: 1136px; margin-inline: auto;
  padding: calc(12px + env(safe-area-inset-top,0px))
    max(16px,env(safe-area-inset-right,0px)) 0
    max(16px,env(safe-area-inset-left,0px));
  pointer-events: none;
}
.floating-controls > button {
  pointer-events: auto; min-height: 44px; flex-shrink: 0;
  background: linear-gradient(145deg,#282032e0,#110e1be6);
  border: 1px solid #d1b7ed38;
  box-shadow: inset 0 1px 0 #f5e8ff12,0 6px 22px #00000030;
  -webkit-backdrop-filter: blur(16px) saturate(140%);
  backdrop-filter: blur(16px) saturate(140%);
}
.floating-controls .account-trigger { margin-left: auto; min-width: 66px; font-size: 15px; }
.floating-controls .menu-trigger { width: 44px; height: 44px; }
main { padding-top: calc(78px + env(safe-area-inset-top,0px)); padding-bottom: calc(20px + env(safe-area-inset-bottom,0px)); }
body[data-route='home'] main { padding: 0; }
body[data-route='home'] .home-view {
  display: flex; flex-direction: column; min-height: 100svh; padding: 0;
}
.home-view .start-card {
  display: flex; flex-direction: column; flex: 1;
  border-top: 0; border-radius: 0 0 30px 30px;
  padding: calc(78px + env(safe-area-inset-top,0px))
    max(24px,env(safe-area-inset-right,0px)) 23px
    max(24px,env(safe-area-inset-left,0px));
}
.home-view .start-card::after { display: none; }
.home-view .start-card .mg-home { flex: 1; display: flex; align-items: center; margin-top: 10px; margin-bottom: 20px; }
.home-view .start-card .mg-home-svg { height: clamp(180px,30svh,290px); max-height: none; }
.home-view .start-cta { flex-shrink: 0; }
.home-view .home-shortcuts {
  grid-template-columns: repeat(3,minmax(0,1fr));
  flex-shrink: 0;
  margin: 16px max(18px,env(safe-area-inset-right,0px))
    calc(14px + env(safe-area-inset-bottom,0px)) max(18px,env(safe-area-inset-left,0px));
}
dialog.menu-sheet { margin-top: calc(68px + env(safe-area-inset-top,0px)); }
.chat-composer { bottom: calc(12px + env(safe-area-inset-bottom,0px)); }
.toast { bottom: calc(23px + env(safe-area-inset-bottom,0px)); }
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
  .floating-controls > button { background: #21192c; }
}
