/* WormHole / Orbit 02. All surfaces and motion are scoped to the app sidebar. */
.wh-sidebar.wh-orbit-sidebar {
  --orbit-ink: #f2f9fc;
  --orbit-muted: #9caeb5;
  --orbit-line: #ffffff12;
  --orbit-cyan: #9de9ef;
  --orbit-accent: #b1dcee;
  width: 256px;
  --orbit-aurora-primary: #4fa9bd36;
  --orbit-aurora-secondary: #718ca62b;
  --orbit-star: #b8eaf6;
  color-scheme: dark;
  color: var(--orbit-ink);
  background: radial-gradient(ellipse at 0 0, #31464f75, transparent 48%), linear-gradient(165deg, #192028 0%, #141a20 62%, #1c2229 100%);
  border-right: 1px solid #3a464b;
  box-shadow: 8px 0 32px #171e2608;
  isolation: isolate;
}
.wh-orbit-sidebar ~ .wh-main { margin-left: 256px; }
.wh-orbit-sidebar::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; opacity: .22; background-image: radial-gradient(#b9d4e0 0.6px, transparent 0.6px); background-size: 23px 23px; mask-image: linear-gradient(#000, transparent 40%); }
.wh-orbit-sidebar .wh-orbit-brand { display: block; height: auto; flex-shrink: 0; padding: 22px 23px 21px; text-decoration: none; }
.wh-orbit-brand-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 17px; }
.wh-orbit-eyebrow { color: #a4bac4; font-size: 8px; font-weight: 600; letter-spacing: 1.7px; }
.wh-orbit-edition { color: #bee2f1; border: 1px solid #a3d6ec40; border-radius: 4px; padding: 1px 4px; font-size: 9px; line-height: 13px; font-family: ui-monospace, monospace; }
.wh-orbit-sidebar .wh-brand { gap: 11px; font-size: 24px; font-weight: 650; letter-spacing: -1px; color: #f3fafd; }
.wh-orbit-sidebar .wh-brand-icon { position: relative; width: 39px; height: 39px; border-radius: 13px; background: linear-gradient(145deg, #96c6db, #6898ac); box-shadow: 0 0 24px #8ecce725, inset 0 1px 0 #ffffff60; transform: rotate(-7deg); transition: transform .6s cubic-bezier(.16,1,.3,1), box-shadow .4s; }
.wh-orbit-sidebar .wh-brand-icon svg { color: white; transform: rotate(7deg); }
.wh-orbit-sidebar .wh-brand-icon::after { content: ""; position: absolute; inset: -5px; border: 1px solid #b3ddef3b; border-radius: 17px; transform: rotate(13deg); transition: transform .7s cubic-bezier(.16,1,.3,1); }
.wh-orbit-sidebar .wh-brand-period { color: var(--orbit-cyan); }
.wh-orbit-brand:hover .wh-brand-icon { transform: rotate(3deg); box-shadow: 0 0 30px #8ecce750, inset 0 1px 0 #ffffff60; }
.wh-orbit-brand:hover .wh-brand-icon::after { transform: rotate(-12deg); }
.wh-orbit-brand-caption { display: flex; align-items: center; gap: 6px; margin: 12px 0 0 2px; color: #a2b1b7; font-size: 10px; letter-spacing: .7px; }
.wh-orbit-status-dot { width: 4px; height: 4px; border-radius: 50%; background: var(--orbit-cyan); box-shadow: 0 0 8px #9de9ef70; }
.wh-orbit-tools { flex-shrink: 0; padding: 0 18px 12px; }
.wh-orbit-search { display: flex; align-items: center; gap: 8px; height: 37px; padding: 0 11px; background: #0c121970; border: 1px solid #afc7d123; border-radius: 10px; color: #90a4ad; transition: border-color .25s, box-shadow .25s, background .25s; }
.wh-orbit-search:focus-within { border-color: #acdaee8a; background: #1c2229; box-shadow: 0 0 0 3px #a6d7ec12; }
.wh-orbit-search > svg { flex-shrink: 0; }
.wh-orbit-search input { width: 0; flex: 1; min-width: 0; padding: 0; border: 0; outline: 0; background: transparent; color: #edf7fb; box-shadow: none; font-size: 11px; line-height: 35px; }
.wh-orbit-search input::placeholder { color: #a1afb5; }
.wh-orbit-search input::-webkit-search-cancel-button { display: none; }
.wh-orbit-search kbd { flex-shrink: 0; color: #9cacb3; border: 1px solid #bdd3dc26; border-radius: 4px; padding: 1px 4px; font-size: 8px; line-height: 13px; font-family: inherit; }
.wh-orbit-search-clear { color: #c7dbe4; font-size: 20px; line-height: 20px; padding: 0 2px; }
.wh-orbit-create { --wh-tilt-x: 0deg; --wh-tilt-y: 0deg; --wh-glow-x: 60%; --wh-glow-y: 20%; display: flex; align-items: center; gap: 12px; min-height: 76px; position: relative; margin-top: 13px; padding: 13px; overflow: hidden; color: #f3fafd; border-radius: 15px; border: 1px solid #afdbee5c; background: radial-gradient(ellipse at var(--wh-glow-x) var(--wh-glow-y), #acdaee47, transparent 68%), linear-gradient(115deg, #394d55, #2f3b49); box-shadow: inset 0 1px 0 #ffffff18, 0 10px 25px #00000020; transform: perspective(650px) rotateX(var(--wh-tilt-x)) rotateY(var(--wh-tilt-y)); transition: border-color .3s, box-shadow .3s; transform-style: preserve-3d; }
.wh-orbit-create::before { content: ""; position: absolute; width: 90px; height: 140px; top: -45px; right: -32px; border: 1px solid #b6def022; border-radius: 50%; transform: rotate(-35deg); }
.wh-orbit-create::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(110deg, transparent 30%, #dceff71f 48%, transparent 66%); transform: translateX(-140%); }
.wh-orbit-create:hover { border-color: #cde8f4a1; box-shadow: inset 0 1px 0 #ffffff25, 0 10px 30px #89cae620; }
.wh-orbit-create:hover::after { animation: wh-orbit-sweep 950ms cubic-bezier(.22,1,.36,1) both; }
.wh-orbit-portal { position: relative; display: grid; place-items: center; flex-shrink: 0; width: 36px; height: 42px; }
.wh-orbit-portal i { position: absolute; width: 28px; height: 36px; border: 1.5px solid #c7e6f3; border-radius: 50%; transform: rotate(35deg); box-shadow: 0 0 12px #aedbee33, inset 0 0 8px #aedbee33; transition: transform .8s cubic-bezier(.16,1,.3,1); }
.wh-orbit-ring-secondary i { border-color: #a3e7ef9c; transform: rotate(-35deg); }
.wh-orbit-portal > .wh-orbit-portal-core { color: white; font-size: 21px; font-weight: 300; z-index: 1; transition: transform .6s cubic-bezier(.16,1,.3,1); }
.wh-orbit-create:hover .wh-orbit-ring-primary i { transform: rotate(115deg) scale(1.06); }
.wh-orbit-create:hover .wh-orbit-ring-secondary i { transform: rotate(-115deg) scale(1.06); }
.wh-orbit-create:hover .wh-orbit-portal > .wh-orbit-portal-core { transform: rotate(90deg); }
.wh-orbit-create-copy { display: flex; flex-direction: column; gap: 5px; position: relative; }
.wh-orbit-create-copy small { color: #c0d8e2; font-size: 8px; font-weight: 500; letter-spacing: 1.4px; }
.wh-orbit-create-copy strong { font-size: 12px; letter-spacing: .3px; font-weight: 600; }
.wh-orbit-create-arrow { flex-shrink: 0; margin-left: auto; color: #b7e3f0; transition: transform .5s cubic-bezier(.16,1,.3,1); }
.wh-orbit-create:hover .wh-orbit-create-arrow { transform: translate(2px,-3px); }
.wh-orbit-sidebar nav.wh-orbit-nav { position: relative; min-height: 0; overflow-x: hidden; padding: 0 18px 18px; scrollbar-width: thin; scrollbar-color: #4f5e64 transparent; scroll-behavior: auto; }
.wh-orbit-nav::-webkit-scrollbar { width: 3px; }
.wh-orbit-nav::-webkit-scrollbar-thumb { background: #4f5e64; border-radius: 8px; }
.wh-orbit-sidebar .wh-nav-caption { display: flex; align-items: center; justify-content: space-between; padding: 14px 11px 9px; color: #abbac1; font-size: 10px; font-weight: 500; letter-spacing: 1px; }
.wh-orbit-sidebar .wh-nav-caption small { color: #788a92; font-size: 8px; letter-spacing: 1.2px; }
.wh-orbit-sidebar nav a.wh-orbit-link { position: relative; z-index: 1; gap: 11px; min-height: 41px; margin: 3px 0; padding: 9px 11px; border: 1px solid transparent; border-radius: 10px; color: #bac8ce; font-size: 12px; font-weight: 400; line-height: 20px; transition: color .25s, background .25s, border-color .25s; }
.wh-orbit-sidebar nav a.wh-orbit-link > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wh-orbit-sidebar nav a.wh-orbit-link > svg:first-child { color: #8d9fa6; transition: color .25s, transform .45s cubic-bezier(.16,1,.3,1); }
.wh-orbit-sidebar nav a.wh-orbit-link:hover { background: #b4ddef0b; color: #f0f8fc; }
.wh-orbit-sidebar nav a.wh-orbit-link:hover > svg:first-child { color: #bfe3f2; transform: translateY(-1px) rotate(-6deg); }
.wh-orbit-sidebar nav a.wh-orbit-link[data-current="true"] { color: #eef7fb; background: linear-gradient(110deg, #9cd3ea2b, #a5d7ec12); border-color: #a8d8ed30; box-shadow: none; font-weight: 550; }
.wh-orbit-sidebar[data-motion-ready="true"] nav a.wh-orbit-link[data-current="true"] { background: transparent; border-color: transparent; }
.wh-orbit-sidebar nav a.wh-orbit-link[data-current="true"] > svg:first-child { color: #b6deef; }
.wh-orbit-active-track { position: absolute; top: 0; left: 0; pointer-events: none; z-index: 0; opacity: 0; border-radius: 10px; background: linear-gradient(110deg, #9cd3ea2b, #a5d7ec12); border: 1px solid #a8d8ed38; box-shadow: inset 0 1px 0 #ffffff0a; will-change: transform; transition: opacity .16s; }
.wh-orbit-active-track::before { content: ""; position: absolute; top: 11px; bottom: 11px; left: -1px; width: 3px; background: linear-gradient(#bfe3f2, #97e5ee); border-radius: 2px; box-shadow: 0 0 10px #b7dff070; }
.wh-orbit-active-track i { position: absolute; inset: 0; overflow: hidden; border-radius: inherit; }
.wh-orbit-active-track i::before { content: ""; position: absolute; top: 0; left: 20%; height: 1px; width: 45%; background: linear-gradient(90deg, transparent, #d0eaf580, transparent); }
.wh-orbit-link-arrow { flex-shrink: 0; margin-left: auto; color: #aec9d5; opacity: 0; transform: translateX(-6px); transition: opacity .25s, transform .5s cubic-bezier(.16,1,.3,1); }
.wh-orbit-link:hover .wh-orbit-link-arrow, .wh-orbit-link[data-current="true"] .wh-orbit-link-arrow { opacity: 1; transform: translateX(0); }
.wh-orbit-groups { margin-top: 19px; padding-top: 13px; border-top: 1px solid var(--orbit-line); }
.wh-orbit-group { margin: 4px 0; }
.wh-orbit-group-toggle { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 41px; padding: 9px 11px; border: 1px solid transparent; border-radius: 10px; color: #aebdc4; background: transparent; text-align: left; font-size: 11px; line-height: 20px; transition: background .25s, color .25s; }
.wh-orbit-group-toggle > svg:first-child { flex-shrink: 0; color: #879ba4; }
.wh-orbit-group-toggle > span:first-of-type { flex: 1; }
.wh-orbit-group-toggle:hover { color: #e3f2f9; background: #b5deef08; }
.wh-orbit-group.is-open > .wh-orbit-group-toggle { color: #d8e3e8; }
.wh-orbit-group.has-current > .wh-orbit-group-toggle > svg:first-child { color: var(--orbit-cyan); }
.wh-orbit-group-toggle:disabled { opacity: 1; cursor: default; }
.wh-orbit-count { color: #a7b9c1; font-family: ui-monospace, monospace; font-size: 9px; line-height: 16px; padding: 0 4px; border: 1px solid #b0c9d41c; border-radius: 4px; }
.wh-orbit-chevron { color: #879ba4; transition: transform .55s cubic-bezier(.2,.9,.2,1.2); }
.wh-orbit-group.is-open .wh-orbit-chevron { transform: rotate(180deg); }
.wh-orbit-panel { display: grid; grid-template-rows: 0fr; opacity: 0; transition: grid-template-rows .52s cubic-bezier(.2,.8,.2,1), opacity .3s; }
.wh-orbit-group.is-open > .wh-orbit-panel { grid-template-rows: 1fr; opacity: 1; }
.wh-orbit-panel-inner { min-height: 0; overflow: hidden; }
.wh-orbit-subnav { position: relative; margin: 3px 0 7px 19px; padding-left: 11px; border-left: 1px solid #b2cdd926; }
.wh-orbit-sidebar nav a.wh-orbit-nested { min-height: 36px; padding: 6px 8px; gap: 9px; font-size: 11px; }
.wh-orbit-sidebar nav a.wh-orbit-nested > svg:first-child { width: 15px; height: 15px; }
.wh-orbit-sidebar nav a.wh-orbit-docs { display: flex; align-items: center; gap: 9px; min-height: 44px; margin: 22px 0 0; padding: 11px; border: 1px solid #9de9ef23; border-radius: 11px; color: #b7d8e4; background: linear-gradient(110deg, #79c4e30c, #79c4e303); font-size: 11px; font-weight: 400; transition: border-color .25s, background .25s; }
.wh-orbit-sidebar nav a.wh-orbit-docs > svg { color: #91bfce; }
.wh-orbit-sidebar nav a.wh-orbit-docs:hover { background: #9de9ef0a; border-color: #9de9ef55; }
.wh-orbit-docs-arrow { margin-left: auto; color: #8ab9d0; transition: transform .4s cubic-bezier(.16,1,.3,1); }
.wh-orbit-docs:hover .wh-orbit-docs-arrow { transform: translate(2px,-2px); }
.wh-orbit-empty { padding: 30px 5px; color: var(--orbit-muted); text-align: center; }
.wh-orbit-empty strong { display: block; margin-bottom: 8px; color: #d5e2e8; font-size: 12px; font-weight: 500; }
.wh-orbit-empty > span { font-size: 10px; }
.wh-orbit-sidebar .wh-orbit-bottom { --wallet-ink: #e2f2f9; --wallet-muted: #99adb7; --wallet-accent: #a2d9e5; --wallet-wash: #89cddd12; flex-shrink: 0; padding: 15px 4px 12px; margin: 0 18px; border-color: var(--orbit-line); }
.wh-orbit-wallet { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 0 0 14px; border-bottom: 1px dashed var(--orbit-line); }
.wh-orbit-wallet-copy { min-width: 0; }
.wh-orbit-wallet small { display: flex; align-items: center; gap: 6px; color: var(--wallet-muted); font-size: 9px; letter-spacing: .7px; }
.wh-orbit-wallet small i { display: block; width: 5px; height: 5px; flex-shrink: 0; border: 1px solid var(--wallet-accent); transform: rotate(45deg); }
.wh-orbit-wallet strong { display: flex; align-items: baseline; gap: 5px; margin-top: 5px; color: var(--wallet-ink); font-size: clamp(18px, 1.7vw, 25px); line-height: 30px; letter-spacing: -.6px; font-weight: 500; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.wh-orbit-currency { color: var(--wallet-muted); font-size: 12px; font-weight: 400; letter-spacing: 0; }
.wh-orbit-recharge { display: flex; flex-shrink: 0; flex-direction: column; align-items: center; gap: 4px; min-width: 42px; padding: 3px; color: var(--wallet-accent); font-size: 9px; line-height: 13px; }
.wh-orbit-recharge-mark { display: grid; place-items: center; width: 31px; height: 31px; border: 1px solid currentColor; border-radius: 50%; background: var(--wallet-wash); transition: transform .5s cubic-bezier(.16,1,.3,1), background .25s, box-shadow .25s; }
.wh-orbit-recharge:hover .wh-orbit-recharge-mark { transform: translateY(-2px) rotate(90deg); box-shadow: 0 0 0 4px var(--wallet-wash); }
.wh-orbit-user { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 38px; margin: 6px -4px -3px; padding: 5px 4px; color: var(--wallet-muted); border-radius: 5px; transition: background .25s, color .25s; }
.wh-orbit-user:hover { color: var(--wallet-accent); background: var(--wallet-wash); }
.wh-orbit-user-copy { min-width: 0; display: flex; align-items: center; gap: 8px; }
.wh-orbit-user strong { min-width: 0; color: var(--wallet-ink); font-size: 10px; font-weight: 500; line-height: 20px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.wh-orbit-user small { flex-shrink: 0; padding-left: 8px; border-left: 1px solid var(--orbit-line); color: var(--wallet-muted); font-size: 9px; line-height: 12px; }
.wh-orbit-user > svg { flex-shrink: 0; transition: transform .6s cubic-bezier(.16,1,.3,1); }
.wh-orbit-user:hover > svg { transform: rotate(40deg); }
.wh-orbit-sidebar :is(a,button,input):focus-visible { outline: 2px solid var(--orbit-cyan); outline-offset: 3px; }
.wh-orbit-sidebar input:focus-visible { outline: none; }
/* Ambient choreography: only six stars and two soft gradient surfaces.
   No canvas, timer, layout animation or animated blur is used for these loops. */
.wh-orbit-atmosphere { position: absolute; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; border-radius: inherit; }
.wh-orbit-aurora { position: absolute; display: block; width: 330px; height: 360px; left: -135px; top: -95px; background: radial-gradient(ellipse at center, var(--orbit-aurora-primary), transparent 68%); animation: wh-orbit-aurora-drift 23s ease-in-out infinite alternate; }
.wh-orbit-aurora-b { width: 270px; height: 390px; left: 60px; top: auto; bottom: -80px; background: radial-gradient(ellipse at center, var(--orbit-aurora-secondary), transparent 68%); animation-name: wh-orbit-aurora-return; animation-duration: 31s; animation-delay: -14s; }
.wh-orbit-star { position: absolute; width: 2px; height: 2px; border-radius: 50%; background: var(--orbit-star); box-shadow: 0 0 5px var(--orbit-star); opacity: .12; animation: wh-orbit-star-breathe 10s ease-in-out infinite; }
.wh-orbit-star:nth-of-type(3n) { width: 3px; height: 3px; }
.wh-orbit-ring { position: absolute; inset: 0; display: grid; place-items: center; animation: wh-orbit-precession 18s linear infinite; }
.wh-orbit-ring-secondary { animation-duration: 27s; animation-direction: reverse; animation-delay: -8s; }
.wh-orbit-orbiting-dot { position: absolute; display: block; width: 3px; height: 3px; top: -2px; left: calc(50% - 1.5px); border-radius: 50%; color: var(--orbit-star); background: currentColor; box-shadow: 0 0 5px currentColor; }
@supports (offset-path: ellipse(14px 18px at 50% 50%)) {
  .wh-orbit-orbiting-dot { top: 0; left: 0; offset-path: ellipse(14px 18px at 50% 50%); offset-rotate: 0deg; animation: wh-orbit-satellite 9s linear infinite; }
  .wh-orbit-ring-secondary .wh-orbit-orbiting-dot { animation-duration: 13s; animation-direction: reverse; animation-delay: -4s; }
}
.wh-orbit-active-track i::after { content: ""; position: absolute; inset: -25% -15%; background: linear-gradient(110deg, transparent 35%, var(--orbit-scan, #c2ecff26) 50%, transparent 65%); transform: translateX(-140%); opacity: 0; animation: wh-orbit-idle-scan 10s ease-in-out infinite; }
.wh-orbit-sidebar[data-ambient-paused="true"] :is(.wh-orbit-aurora, .wh-orbit-star, .wh-orbit-ring, .wh-orbit-orbiting-dot),
.wh-orbit-sidebar[data-ambient-paused="true"] .wh-orbit-active-track i::after { animation-play-state: paused; }
@keyframes wh-orbit-aurora-drift { from { transform: translate3d(-18px, -12px, 0) rotate(-12deg) scale(.92); opacity: .55; } to { transform: translate3d(65px, 75px, 0) rotate(16deg) scale(1.12); opacity: .95; } }
@keyframes wh-orbit-aurora-return { from { transform: translate3d(32px, 35px, 0) rotate(10deg) scale(1.12); opacity: .8; } to { transform: translate3d(-55px, -90px, 0) rotate(-20deg) scale(.9); opacity: .45; } }
@keyframes wh-orbit-star-breathe { 0%, 100% { opacity: .08; transform: scale(.7); } 45% { opacity: .5; transform: scale(1.15); } 65% { opacity: .16; transform: scale(.9); } }
@keyframes wh-orbit-precession { from { transform: rotate(-12deg); } to { transform: rotate(348deg); } }
@keyframes wh-orbit-satellite { from { offset-distance: 0%; } to { offset-distance: 100%; } }
@keyframes wh-orbit-idle-scan { 0%, 68% { transform: translateX(-140%); opacity: 0; } 73% { opacity: .8; } 92% { transform: translateX(140%); opacity: .8; } 100% { transform: translateX(140%); opacity: 0; } }
/* The existing website toggles .dark on <html>. No separate sidebar setting:
   the original palette above is the dark variant, these are the light paints.
   Geometry, spring motion and pointer effects are shared between both modes. */
:root:not(.dark) .wh-sidebar.wh-orbit-sidebar {
  --orbit-aurora-primary: #bd97e54d;
  --orbit-aurora-secondary: #8bd9e947;
  --orbit-star: #9c75c5;
  --orbit-scan: #ffffffb3;
  --orbit-ink: #302944;
  --orbit-muted: #756d8d;
  --orbit-line: #e5dfee;
  --orbit-cyan: #247d94;
  --orbit-accent: #805ac3;
  color-scheme: light;
  background: radial-gradient(ellipse at 0 0, #e7dcff80, transparent 47%), linear-gradient(165deg, #fcfaff 0%, #f8f9ff 58%, #f1f8fb 100%);
  border-right-color: #e3deef;
  box-shadow: 8px 0 32px #624b8a06;
}
:root:not(.dark) .wh-orbit-sidebar::before { opacity: .3; background-image: radial-gradient(#a796c4 .6px, transparent .6px); }
:root:not(.dark) .wh-orbit-eyebrow { color: #806a9f; }
:root:not(.dark) .wh-orbit-edition { color: #7851b7; border-color: #9675ce40; background: #ffffff80; }
:root:not(.dark) .wh-orbit-sidebar .wh-brand { color: #302443; }
:root:not(.dark) .wh-orbit-sidebar .wh-brand-icon { background: linear-gradient(145deg, #9784ed, #6656be); box-shadow: 0 0 24px #9176ff25, inset 0 1px 0 #ffffff60; }
:root:not(.dark) .wh-orbit-sidebar .wh-brand-icon::after { border-color: #b8a3ff3b; }
:root:not(.dark) .wh-orbit-brand:hover .wh-brand-icon { box-shadow: 0 0 30px #9176ff50, inset 0 1px 0 #ffffff60; }
:root:not(.dark) .wh-orbit-brand-caption { color: #756a8a; }
:root:not(.dark) .wh-orbit-status-dot { box-shadow: 0 0 8px #399cb030; }
:root:not(.dark) .wh-orbit-search { background: #ffffffd9; border-color: #e1daed; color: #847694; }
:root:not(.dark) .wh-orbit-search:focus-within { background: #fff; border-color: #ab8cd5; box-shadow: 0 0 0 3px #9671d512; }
:root:not(.dark) .wh-orbit-search input { color: #39304e; }
:root:not(.dark) .wh-orbit-search input::placeholder { color: #7c728d; }
:root:not(.dark) .wh-orbit-search kbd { color: #7b6e90; background: #f7f4fc; border-color: #e5ddee; }
:root:not(.dark) .wh-orbit-search-clear { color: #7959a8; }
:root:not(.dark) .wh-orbit-create {
  color: #493064;
  border-color: #cab3e7;
  background: radial-gradient(ellipse at var(--wh-glow-x) var(--wh-glow-y), #ffffffb3, transparent 68%), linear-gradient(115deg, #ede2fc, #dff3fa);
  box-shadow: inset 0 1px 0 #ffffffd9, 0 8px 22px #8864b514;
}
:root:not(.dark) .wh-orbit-create::before { border-color: #8570b426; }
:root:not(.dark) .wh-orbit-create::after { background: linear-gradient(110deg, transparent 30%, #ffffffa6 48%, transparent 66%); }
:root:not(.dark) .wh-orbit-create:hover { border-color: #a383cf; box-shadow: inset 0 1px 0 #ffffffeb, 0 10px 28px #8864b523; }
:root:not(.dark) .wh-orbit-portal i { border-color: #9366cb; box-shadow: 0 0 12px #ab81d52b, inset 0 0 8px #ab81d51f; }
:root:not(.dark) .wh-orbit-ring-secondary i { border-color: #368aa3b3; }
:root:not(.dark) .wh-orbit-portal > .wh-orbit-portal-core { color: #6a468f; }
:root:not(.dark) .wh-orbit-create-copy small { color: #7d6597; }
:root:not(.dark) .wh-orbit-create-arrow { color: #397e98; }
:root:not(.dark) .wh-orbit-sidebar nav.wh-orbit-nav { scrollbar-color: #c9bddc transparent; }
:root:not(.dark) .wh-orbit-nav::-webkit-scrollbar-thumb { background: #c9bddc; }
:root:not(.dark) .wh-orbit-sidebar .wh-nav-caption { color: #796989; }
:root:not(.dark) .wh-orbit-sidebar .wh-nav-caption small { color: #82758f; }
:root:not(.dark) .wh-orbit-sidebar nav a.wh-orbit-link { color: #625570; }
:root:not(.dark) .wh-orbit-sidebar nav a.wh-orbit-link > svg:first-child { color: #88749f; }
:root:not(.dark) .wh-orbit-sidebar nav a.wh-orbit-link:hover { background: #a57adc0d; color: #49315f; }
:root:not(.dark) .wh-orbit-sidebar nav a.wh-orbit-link:hover > svg:first-child { color: #8554b9; }
:root:not(.dark) .wh-orbit-sidebar nav a.wh-orbit-link[data-current="true"] { color: #623b8e; background: linear-gradient(110deg, #b98ae52b, #8fcde51f); border-color: #b58ad53d; }
:root:not(.dark) .wh-orbit-sidebar[data-motion-ready="true"] nav a.wh-orbit-link[data-current="true"] { background: transparent; border-color: transparent; }
:root:not(.dark) .wh-orbit-sidebar nav a.wh-orbit-link[data-current="true"] > svg:first-child { color: #8251b7; }
:root:not(.dark) .wh-orbit-active-track { background: linear-gradient(110deg, #b98ae52b, #8fcde51f); border-color: #b58ad54d; box-shadow: inset 0 1px 0 #ffffffbf; }
:root:not(.dark) .wh-orbit-active-track::before { background: linear-gradient(#a473cf, #4ba5ba); box-shadow: 0 0 10px #a473cf38; }
:root:not(.dark) .wh-orbit-active-track i::before { background: linear-gradient(90deg, transparent, #ffffffeb, transparent); }
:root:not(.dark) .wh-orbit-link-arrow { color: #9270b3; }
:root:not(.dark) .wh-orbit-group-toggle { color: #72637e; }
:root:not(.dark) .wh-orbit-group-toggle > svg:first-child { color: #8b78a0; }
:root:not(.dark) .wh-orbit-group-toggle:hover { color: #513766; background: #a57adc0d; }
:root:not(.dark) .wh-orbit-group.is-open > .wh-orbit-group-toggle { color: #53405f; }
:root:not(.dark) .wh-orbit-group.has-current > .wh-orbit-group-toggle > svg:first-child { color: var(--orbit-cyan); }
:root:not(.dark) .wh-orbit-count { color: #82708f; border-color: #dfd5e9; background: #ffffff80; }
:root:not(.dark) .wh-orbit-chevron { color: #8b78a0; }
:root:not(.dark) .wh-orbit-subnav { border-color: #ddd1e9; }
:root:not(.dark) .wh-orbit-sidebar nav a.wh-orbit-docs { color: #3b7387; border-color: #b7d8e4; background: linear-gradient(110deg, #e5f3f9b3, #f7fbff80); }
:root:not(.dark) .wh-orbit-sidebar nav a.wh-orbit-docs > svg { color: #528c9f; }
:root:not(.dark) .wh-orbit-sidebar nav a.wh-orbit-docs:hover { background: #e3f1f7; border-color: #8cbfce; }
:root:not(.dark) .wh-orbit-docs-arrow { color: #598fa3; }
:root:not(.dark) .wh-orbit-empty strong { color: #675074; }
:root:not(.dark) .wh-orbit-sidebar .wh-orbit-bottom { --wallet-ink: #3d3656; --wallet-muted: #79718c; --wallet-accent: #3a8294; --wallet-wash: #76c1d319; }
@keyframes wh-orbit-sweep { to { transform: translateX(140%); } }
@media (min-width: 1001px) and (max-width: 1200px) {
  .wh-sidebar.wh-orbit-sidebar { width: 232px; }
  .wh-orbit-sidebar ~ .wh-main { margin-left: 232px; }
  .wh-orbit-sidebar .wh-orbit-brand { padding-left: 20px; padding-right: 20px; }
  .wh-orbit-sidebar .wh-brand { font-size: 21px; }
  .wh-orbit-eyebrow { font-size: 7px; letter-spacing: 1.3px; }
  .wh-orbit-create { padding-left: 10px; gap: 8px; }
}
@media (max-width: 1000px) {
  .wh-sidebar.wh-orbit-sidebar { width: min(272px, calc(100vw - 38px)); box-shadow: 15px 0 45px #080c2350; transition: transform .48s cubic-bezier(.16,1,.3,1); }
  .wh-orbit-sidebar ~ .wh-main { margin-left: 0; }
}
@media (max-height: 760px) {
  .wh-orbit-sidebar .wh-orbit-brand { padding-top: 16px; padding-bottom: 15px; }
  .wh-orbit-brand-top { margin-bottom: 11px; }
  .wh-orbit-create { min-height: 65px; }
  .wh-orbit-sidebar .wh-orbit-bottom { padding-top: 10px; padding-bottom: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .wh-sidebar.wh-orbit-sidebar, .wh-orbit-sidebar *, .wh-orbit-sidebar *::before, .wh-orbit-sidebar *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
  .wh-orbit-create { transform: none; }
}

/* Orbit top navigation: light by default, matching the app's .dark theme. */
.wh-topbar.wh-orbit-topbar {
  --bar-ink: #38324c;
  --bar-muted: #82788e;
  --bar-line: #e7e1ee;
  --bar-surface: #ffffffc9;
  --bar-wash: #f3eff9;
  --bar-accent: #587e91;
  --bar-violet: #8663b2;
  height: 82px; padding: 0 30px; gap: 20px;
  color: var(--bar-ink); background: linear-gradient(110deg, #fcfaffee, #fafcffee 72%, #f4fafbee);
  border-bottom: 1px solid var(--bar-line);
  -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px);
}
.dark .wh-topbar.wh-orbit-topbar { --bar-ink: #e1edf3; --bar-muted: #93a7b1; --bar-line: #b0d6e518; --bar-surface: #ffffff06; --bar-wash: #8acbdf0c; --bar-accent: #9dcedf; --bar-violet: #99cadd; background: linear-gradient(110deg, #192028f2, #171e27f2 72%, #1b2932f2); }
.wh-orbit-topbar::after { content: ""; position: absolute; bottom: -1px; left: 30px; width: 94px; height: 1px; background: linear-gradient(90deg, var(--bar-violet), #7bbdce80, transparent); pointer-events: none; }
.wh-orbit-heading { display: flex; align-items: center; gap: 13px; min-width: 0; }
.wh-orbit-page-icon { position: relative; display: grid; place-items: center; width: 38px; height: 38px; flex-shrink: 0; color: var(--bar-violet); background: var(--bar-wash); border: 1px solid var(--bar-line); border-radius: 12px 12px 12px 4px; }
.wh-orbit-heading-copy { min-width: 0; }
.wh-orbit-breadcrumb { display: flex; align-items: center; gap: 6px; margin-bottom: 3px; color: var(--bar-muted); font-size: 9px; line-height: 14px; white-space: nowrap; }
.wh-orbit-breadcrumb a { color: inherit; letter-spacing: .3px; transition: color .2s; }
.wh-orbit-breadcrumb a:hover { color: var(--bar-violet); }
.wh-orbit-breadcrumb > span { overflow: hidden; text-overflow: ellipsis; }
.wh-orbit-breadcrumb > svg { flex-shrink: 0; opacity: .65; }
.wh-orbit-page-title { display: block; color: var(--bar-ink); font-size: 16px; line-height: 22px; font-weight: 600; letter-spacing: .3px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; animation: wh-orbit-title-arrive .42s cubic-bezier(.16,1,.3,1) both; }
.wh-orbit-topbar-actions { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.wh-orbit-jump { display: flex; align-items: center; gap: 7px; height: 34px; padding: 0 9px; color: var(--bar-muted); background: var(--bar-surface); border: 1px solid var(--bar-line); border-radius: 8px; font-size: 10px; transition: border-color .25s, box-shadow .25s, color .25s; }
.wh-orbit-jump:hover { color: var(--bar-violet); border-color: var(--bar-violet); box-shadow: 0 2px 10px #8069a00c; }
.wh-orbit-jump kbd { color: var(--bar-muted); font-size: 8px; line-height: 16px; padding: 0 4px; margin-left: 4px; background: var(--bar-wash); border: 1px solid var(--bar-line); border-radius: 4px; font-family: inherit; }
.wh-orbit-topbar-balance { display: flex; align-items: center; gap: 6px; padding: 7px 3px; color: var(--bar-accent); font-size: 12px; line-height: 18px; font-weight: 500; font-variant-numeric: tabular-nums; transition: color .2s; }
.wh-orbit-topbar-balance:hover { color: var(--bar-violet); }
.wh-orbit-topbar-divider { width: 1px; height: 20px; background: var(--bar-line); margin: 0 2px; }
.wh-orbit-notices > div > button, .wh-orbit-signout, .wh-orbit-topbar .wh-orbit-menu { display: inline-flex; justify-content: center; align-items: center; flex-shrink: 0; width: 34px; height: 34px; color: var(--bar-muted); border: 1px solid transparent; border-radius: 9px; background: transparent; transition: color .25s, background .25s, border-color .25s, transform .35s cubic-bezier(.16,1,.3,1); }
.wh-orbit-notices > div > button:hover, .wh-orbit-signout:hover, .wh-orbit-topbar .wh-orbit-menu:hover { color: var(--bar-accent); background: var(--bar-wash); border-color: var(--bar-line); transform: translateY(-1px); }
.wh-orbit-signout:hover { color: #af6575; }
.wh-orbit-theme { position: relative; display: flex; align-items: center; justify-content: space-between; width: 63px; height: 34px; padding: 0 9px; border: 1px solid var(--bar-line); border-radius: 20px; background: var(--bar-wash); flex-shrink: 0; }
.wh-orbit-theme-thumb { position: absolute; top: 3px; left: 3px; width: 26px; height: 26px; border-radius: 50%; background: #fff; box-shadow: 0 1px 4px #5d46741a; transition: transform .5s cubic-bezier(.22,.85,.25,1.15), background .3s, box-shadow .3s; }
.wh-orbit-theme.is-dark .wh-orbit-theme-thumb { transform: translateX(29px); background: #344b59; box-shadow: 0 1px 6px #0003, inset 0 0 0 1px #b6e1ed20; }
.wh-orbit-theme > svg { position: relative; z-index: 1; transition: transform .55s cubic-bezier(.16,1,.3,1), color .3s, opacity .3s; }
.wh-orbit-theme-sun { color: #ae8057; }
.wh-orbit-theme-moon { color: var(--bar-muted); opacity: .65; transform: rotate(-20deg); }
.wh-orbit-theme.is-dark .wh-orbit-theme-sun { opacity: .5; transform: rotate(75deg); color: var(--bar-muted); }
.wh-orbit-theme.is-dark .wh-orbit-theme-moon { opacity: 1; transform: rotate(0); color: #c0e2ef; }
.wh-orbit-topbar :is(a,button):focus-visible { outline: 2px solid var(--bar-accent); outline-offset: 3px; }
.wh-orbit-topbar .wh-orbit-menu { display: none; }
@keyframes wh-orbit-title-arrive { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width: 1200px) { .wh-topbar.wh-orbit-topbar { padding: 0 24px; gap: 15px; } .wh-orbit-topbar-actions { gap: 7px; } .wh-orbit-jump kbd { display: none; } }
@media (max-width: 1000px) { .wh-topbar.wh-orbit-topbar { height: 68px; padding: 0 16px; gap: 12px; } .wh-orbit-topbar .wh-orbit-menu { display: inline-flex; } .wh-orbit-heading { gap: 9px; } .wh-orbit-page-icon { display: none; } .wh-orbit-page-title { font-size: 14px; line-height: 20px; } }
@media (max-width: 680px) { .wh-orbit-topbar-balance, .wh-orbit-topbar-divider { display: none; } .wh-orbit-jump { width: 32px; padding: 0; justify-content: center; background: transparent; border-color: transparent; } .wh-orbit-jump > span { display: none; } .wh-orbit-topbar-actions { gap: 4px; } }
@media (max-width: 520px) { .wh-orbit-jump { display: none; } .wh-topbar.wh-orbit-topbar { padding: 0 12px; gap: 8px; } .wh-orbit-heading { gap: 5px; } .wh-orbit-topbar-actions { gap: 2px; } .wh-orbit-breadcrumb { font-size: 8px; gap: 4px; } }
@media (prefers-reduced-motion: reduce) { .wh-orbit-topbar *, .wh-orbit-topbar *::before, .wh-orbit-topbar *::after { animation: none !important; transition: none !important; } }

.wh-orbit-dashboard {
  --dash-ink: #39324d; --dash-muted: #80758e; --dash-line: #e8e1ef; --dash-surface: #ffffff;
  --dash-wash: #f7f3fb; --dash-accent: #8867b4; --dash-cyan: #4d8d9f; --dash-shadow: #644c8c08;
  display: flex; flex-direction: column; gap: 25px; padding-bottom: 8px; color: var(--dash-ink);
}
.dark .wh-orbit-dashboard { --dash-ink: #e0edf2; --dash-muted: #96aab4; --dash-line: #b5d5e51c; --dash-surface: #1b252f; --dash-wash: #22313d; --dash-accent: #8fc6d9; --dash-cyan: #9acdc7; --dash-shadow: #00000012; }
.wh-orbit-dash-intro { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 4px 0 2px; }
.wh-orbit-dash-kicker { display: block; margin-bottom: 8px; color: var(--dash-muted); font-size: 8px; font-weight: 500; line-height: 13px; letter-spacing: 1.7px; }
.wh-orbit-dash-intro h1 { font-size: clamp(20px,2.1vw,29px); line-height: 1.55; letter-spacing: -.5px; overflow-wrap: anywhere; }
.wh-orbit-dash-intro h1 > span { color: var(--dash-accent); font-weight: 300; }
.wh-orbit-dash-intro p { color: var(--dash-muted); font-size: 11px; line-height: 19px; margin-top: 5px; letter-spacing: .4px; }
.wh-orbit-dash-refresh { display: flex; flex-shrink: 0; align-items: center; gap: 13px; color: var(--dash-muted); font-size: 10px; }
.wh-orbit-dash-refresh button { display: flex; align-items: center; gap: 6px; min-height: 32px; padding: 0 10px; border: 1px solid var(--dash-line); border-radius: 8px; background: var(--dash-surface); transition: border-color .25s,color .25s; }
.wh-orbit-dash-refresh button:hover { color: var(--dash-accent); border-color: var(--dash-accent); }
.wh-orbit-dash-refresh button:disabled { opacity: .6; cursor: wait; }
.wh-orbit-metrics { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 16px; }
.wh-orbit-metric { --metric-accent: var(--dash-accent); position: relative; padding: 18px 19px 16px; border: 1px solid var(--dash-line); border-radius: 13px; background: linear-gradient(135deg,var(--dash-surface) 65%,var(--dash-wash)); box-shadow: 0 4px 18px var(--dash-shadow); min-width: 0; animation: wh-orbit-dash-arrive .6s cubic-bezier(.16,1,.3,1) var(--metric-delay) backwards; transition: border-color .3s,transform .4s cubic-bezier(.16,1,.3,1); }
.wh-orbit-metric:nth-child(2) { --metric-accent: var(--dash-cyan); }
.wh-orbit-metric:nth-child(4) { --metric-accent: #a47f51; }
.wh-orbit-metric:hover { border-color: var(--metric-accent); transform: translateY(-2px); }
.wh-orbit-metric-label { display: flex; align-items: center; gap: 7px; color: var(--dash-muted); font-size: 10px; line-height: 18px; }
.wh-orbit-metric-label > svg { flex-shrink: 0; color: var(--metric-accent); }
.wh-orbit-metric-label > small { margin-left: auto; opacity: .6; font-family: ui-monospace,monospace; font-size: 8px; }
.wh-orbit-metric-value { display: block; min-width: 0; margin: 15px 0 11px; color: var(--dash-ink); font-size: clamp(22px,2vw,29px); line-height: 35px; font-weight: 500; letter-spacing: -.7px; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; animation: wh-orbit-number-arrive .55s cubic-bezier(.16,1,.3,1) both; }
.wh-orbit-metric-note { display: flex; align-items: center; gap: 5px; color: var(--dash-muted); font-size: 9px; line-height: 16px; }
a.wh-orbit-metric-note:hover { color: var(--metric-accent); }
.wh-orbit-dash-grid { display: grid; grid-template-columns: minmax(0,1.7fr) minmax(250px,1fr); gap: 20px; }
.wh-orbit-dash-panel { min-width: 0; border: 1px solid var(--dash-line); border-radius: 15px; background: var(--dash-surface); box-shadow: 0 5px 22px var(--dash-shadow); padding: 23px; animation: wh-orbit-dash-arrive .65s cubic-bezier(.16,1,.3,1) .12s backwards; }
.wh-orbit-panel-heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 21px; }
.wh-orbit-panel-heading .wh-orbit-dash-kicker { font-size: 7px; line-height: 11px; margin-bottom: 5px; letter-spacing: 1.5px; }
.wh-orbit-panel-heading h2 { font-size: 15px; line-height: 22px; letter-spacing: .3px; }
.wh-orbit-segment { display: flex; gap: 2px; padding: 3px; border: 1px solid var(--dash-line); border-radius: 8px; background: var(--dash-wash); flex-shrink: 0; }
.wh-orbit-segment button { padding: 5px 7px; border-radius: 5px; color: var(--dash-muted); font-size: 9px; line-height: 14px; transition: color .25s,background .25s; }
.wh-orbit-segment button.active { color: var(--dash-accent); background: var(--dash-surface); box-shadow: 0 1px 4px var(--dash-shadow); }
.wh-orbit-chart-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.wh-orbit-chart-total strong { display: block; color: var(--dash-ink); font-weight: 500; font-size: 21px; line-height: 29px; letter-spacing: -.4px; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.wh-orbit-chart-total small { display: block; margin-top: 2px; color: var(--dash-muted); font-size: 9px; line-height: 15px; }
.wh-orbit-chart-mode { display: flex; gap: 13px; flex-shrink: 0; }
.wh-orbit-chart-mode button { font-size: 10px; color: var(--dash-muted); padding: 5px 0; border-bottom: 2px solid transparent; transition: border-color .25s,color .25s; }
.wh-orbit-chart-mode button.active { color: var(--dash-accent); border-color: var(--dash-accent); }
.wh-orbit-chart-visual { position: relative; height: 228px; }
.wh-orbit-chart-visual > svg { width: 100%; height: 100%; display: block; overflow: visible; }
.wh-orbit-chart-visual > svg text { display: none; }
.wh-orbit-chart-visual > svg path, .wh-orbit-chart-visual > svg line { vector-effect: non-scaling-stroke; }
.wh-orbit-chart-line { stroke-dasharray: 1; stroke-dashoffset: 1; animation: wh-orbit-line-draw 1.15s cubic-bezier(.22,1,.36,1) forwards; }
.wh-orbit-chart-area { animation: wh-orbit-chart-fill .9s ease .2s both; }
.wh-orbit-chart-axis-label { position: absolute; pointer-events: none; color: var(--dash-muted); font-size: 9px; line-height: 13px; font-variant-numeric: tabular-nums; }
.wh-orbit-chart-axis-y { left: 0; width: 5%; text-align: right; transform: translateY(-50%); }
.wh-orbit-chart-axis-x { top: 94%; transform: translateX(-50%); white-space: nowrap; }
.wh-orbit-chart-axis-x:first-of-type { transform: none; }
.wh-orbit-chart-hitareas { display: flex; position: absolute; left: 6.315%; right: 3.157%; top: 12%; bottom: 17%; }
.wh-orbit-chart-hitareas button { flex: 1; min-width: 0; border-radius: 3px; cursor: crosshair; }
.wh-orbit-chart-hitareas button:first-child, .wh-orbit-chart-hitareas button:last-child { flex: .5; }
.wh-orbit-chart-hitareas button:focus-visible { outline-offset: -2px; }
.wh-orbit-chart-dot { position: absolute; width: 9px; height: 9px; background: var(--dash-surface); border: 2px solid var(--dash-accent); border-radius: 50%; transform: translate(-50%,-50%); pointer-events: none; }
.wh-orbit-chart-tooltip { position: absolute; top: 4px; transform: translateX(-50%); max-width: min(220px,90%); padding: 9px 12px; border: 1px solid var(--dash-line); border-radius: 9px; background: var(--dash-surface); box-shadow: 0 5px 20px var(--dash-shadow); pointer-events: none; z-index: 2; }
.wh-orbit-chart-tooltip strong, .wh-orbit-chart-tooltip span, .wh-orbit-chart-tooltip small { display: block; }
.wh-orbit-chart-tooltip strong { color: var(--dash-muted); font-size: 9px; font-weight: 400; }
.wh-orbit-chart-tooltip span { color: var(--dash-accent); font-size: 13px; line-height: 24px; font-variant-numeric: tabular-nums; }
.wh-orbit-chart-tooltip small { color: var(--dash-muted); font-size: 8px; white-space: nowrap; }
.wh-orbit-chart-note { color: var(--dash-muted); font-size: 9px; line-height: 17px; margin-top: 13px; }
.wh-orbit-chart-state { min-height: 228px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 11px; color: var(--dash-muted); font-size: 11px; text-align: center; }
.wh-orbit-chart-state > svg { color: var(--dash-accent); }
.wh-orbit-chart-state strong { font-weight: 500; color: var(--dash-ink); font-size: 13px; }
.wh-orbit-chart-state > span { font-size: 10px; }
.wh-orbit-shortcuts { display: flex; flex-direction: column; gap: 12px; }
.wh-orbit-shortcuts .wh-orbit-panel-heading { margin-bottom: 8px; }
.wh-orbit-launch { --launch-accent: var(--dash-accent); display: flex; align-items: center; gap: 12px; padding: 17px 13px; border: 1px solid var(--dash-line); border-radius: 11px; background: linear-gradient(115deg,var(--dash-wash),var(--dash-surface)); transition: transform .45s cubic-bezier(.16,1,.3,1),border-color .25s; }
.wh-orbit-launch.is-image { --launch-accent: var(--dash-cyan); }
.wh-orbit-launch:hover { border-color: var(--launch-accent); transform: translateX(3px); }
.wh-orbit-launch-icon { display: grid; place-items: center; width: 38px; height: 38px; flex-shrink: 0; color: var(--launch-accent); border: 1px solid var(--dash-line); border-radius: 12px 12px 12px 4px; background: var(--dash-surface); }
.wh-orbit-launch > span:nth-child(2) { flex: 1; min-width: 0; }
.wh-orbit-launch strong { display: block; font-size: 12px; line-height: 22px; color: var(--dash-ink); font-weight: 500; }
.wh-orbit-launch small { display: block; color: var(--dash-muted); font-size: 9px; line-height: 17px; }
.wh-orbit-launch > svg { color: var(--launch-accent); flex-shrink: 0; transition: transform .35s; }
.wh-orbit-launch:hover > svg { transform: translate(2px,-2px); }
.wh-orbit-utility-links { display: flex; flex-direction: column; gap: 2px; margin-top: auto; padding-top: 5px; }
.wh-orbit-utility-links a { display: flex; align-items: center; gap: 10px; min-height: 41px; color: var(--dash-muted); font-size: 10px; border-bottom: 1px solid var(--dash-line); transition: color .25s; }
.wh-orbit-utility-links a:last-child { border-bottom: 0; }
.wh-orbit-utility-links a > span { flex: 1; }
.wh-orbit-utility-links a:hover { color: var(--dash-accent); }
.wh-orbit-activity { padding-bottom: 14px; }
.wh-orbit-all-activity { display: flex; align-items: center; gap: 5px; font-size: 10px; color: var(--dash-accent); }
.wh-orbit-activity-scroll { overflow-x: auto; }
.wh-orbit-activity table { width: 100%; border-collapse: collapse; text-align: left; white-space: nowrap; }
.wh-shell .wh-orbit-activity table th { background: var(--dash-wash); color: var(--dash-muted); font-size: 9px; font-weight: 400; padding: 11px 13px; }
.wh-shell .wh-orbit-activity table td { padding: 15px 13px; border-bottom: 1px solid var(--dash-line); font-size: 10px; color: var(--dash-muted); font-variant-numeric: tabular-nums; }
.wh-orbit-activity td:first-child { color: var(--dash-ink) !important; }
.wh-orbit-activity td:first-child i { display: inline-block; width: 5px; height: 5px; border: 1px solid var(--dash-accent); border-radius: 2px; margin-right: 8px; transform: rotate(45deg); }
.wh-orbit-activity th:last-child, .wh-orbit-activity td:last-child { text-align: right; }
.wh-orbit-activity tr:last-child td { border-bottom: 0; }
.wh-orbit-activity-empty { min-height: 165px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; color: var(--dash-muted); }
.wh-orbit-activity-empty > svg { color: var(--dash-accent); }
.wh-orbit-activity-empty strong { color: var(--dash-ink); font-size: 12px; font-weight: 500; }
.wh-orbit-activity-empty p { font-size: 10px; text-align: center; line-height: 18px; }
.wh-orbit-updated { display: block; text-align: right; margin-top: 10px; color: var(--dash-muted); font-size: 8px; line-height: 14px; }
.wh-orbit-dash-message { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 9px; padding: 12px; border: 1px solid var(--dash-line); border-radius: 9px; color: var(--dash-muted); background: var(--dash-wash); font-size: 10px; line-height: 18px; }
.wh-orbit-dash-message button { color: var(--dash-accent); text-decoration: underline; text-underline-offset: 3px; }
.wh-orbit-dashboard :is(button,a):focus-visible { outline: 2px solid var(--dash-accent); outline-offset: 3px; }
@keyframes wh-orbit-dash-arrive { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
@keyframes wh-orbit-number-arrive { from { opacity: .1; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }
@keyframes wh-orbit-line-draw { to { stroke-dashoffset: 0; } }
@keyframes wh-orbit-chart-fill { from { opacity: 0; } to { opacity: 1; } }
@media (max-width: 1200px) { .wh-orbit-dash-grid { grid-template-columns: minmax(0,1fr); } .wh-orbit-shortcuts { display: grid; grid-template-columns: 1fr 1fr; align-items: start; } .wh-orbit-shortcuts .wh-orbit-panel-heading { grid-column: 1/-1; margin-bottom: 0; } .wh-orbit-utility-links { grid-column: 1/-1; flex-direction: row; gap: 25px; margin-top: 0; } .wh-orbit-utility-links a { flex: 1; border-bottom: 0; } }
@media (max-width: 1100px) { .wh-orbit-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 680px) { .wh-orbit-dashboard { gap: 18px; } .wh-orbit-dash-intro { align-items: flex-start; gap: 10px; } .wh-orbit-dash-refresh { flex-direction: column; align-items: flex-end; gap: 8px; font-size: 9px; } .wh-orbit-dash-refresh > span { white-space: nowrap; } .wh-orbit-dash-intro .wh-orbit-dash-kicker { font-size: 7px; letter-spacing: 1px; } .wh-orbit-metrics { gap: 10px; } .wh-orbit-metric { padding: 14px 13px; } .wh-orbit-metric-value { font-size: 23px; line-height: 29px; margin-top: 12px; } .wh-orbit-dash-panel { padding: 17px; } .wh-orbit-chart-tooltip small { font-size: 8px; } }
@media (max-width: 430px) { .wh-orbit-dash-refresh > span { display: none; } .wh-orbit-shortcuts { grid-template-columns: 1fr; } .wh-orbit-utility-links { grid-column: auto; gap: 15px; } .wh-orbit-utility-links a { font-size: 9px; gap: 7px; } .wh-orbit-panel-heading { gap: 8px; } .wh-orbit-segment button { font-size: 8px; padding: 5px; } }
@media (prefers-reduced-motion: reduce) { .wh-orbit-dashboard *, .wh-orbit-dashboard *::before, .wh-orbit-dashboard *::after { animation: none !important; transition: none !important; } .wh-orbit-chart-line { stroke-dashoffset: 0; } }

/* Orbit: shared surfaces across the existing business pages. No layout or
   visibility overrides for permissions, provider widgets, iframes or QR codes. */
body.wh-orbit-ui {
  --page-bg: #f7f6fa;
  --page-surface: #fff;
  --page-soft: #f4f1f8;
  --page-inset: #f9f8fc;
  --page-ink: #39334b;
  --page-muted: #776f86;
  --page-line: #e7e2ed;
  --page-accent: #7f62a6;
  --page-accent-strong: #725393;
  --page-cyan: #427f91;
  --page-tint: #efebf6;
  --page-glow: #8c70ad12;
  --page-shadow: 0 5px 24px #55427306, 0 1px 3px #55427304;
  --page-focus: #8b6bac69;
  --page-ease: cubic-bezier(.16,1,.3,1);
  --wh-bg: var(--page-bg);
  --wh-surface: var(--page-surface);
  --wh-ink: var(--page-ink);
  --wh-muted: var(--page-muted);
  --wh-line: var(--page-line);
  --wh-blue: var(--page-accent);
  --wh-nav: var(--page-soft);
  background: var(--page-bg);
  color: var(--page-ink);
}
.dark body.wh-orbit-ui {
  --page-bg: #151f29;
  --page-surface: #1b2732;
  --page-soft: #23333f;
  --page-inset: #18232d;
  --page-ink: #e0edf2;
  --page-muted: #9db0bb;
  --page-line: #b5d5e523;
  --page-accent: #9acbdb;
  --page-accent-strong: #b0d9e5;
  --page-cyan: #93c9c5;
  --page-tint: #293f4e;
  --page-glow: #78bdd510;
  --page-shadow: 0 6px 24px #0000000d, 0 1px 3px #00000009;
  --page-focus: #9acbdb70;
  color-scheme: dark;
}
.wh-orbit-ui .wh-main { background: var(--page-bg); }
.wh-orbit-ui .wh-orbit-pages { color: var(--page-ink); min-width: 0; }
.wh-orbit-ui .wh-orbit-pages:not(.wh-content-studio) {
  background: radial-gradient(ellipse 50% 190px at 4% 0, var(--page-glow), transparent);
}
.wh-orbit-ui :is(.wh-content, .wh-orbit-public, .wh-auth, .wh-orbit-overlay) {
  accent-color: var(--page-accent);
  scrollbar-color: var(--page-line) transparent;
}
/* Standard business components, including their teleported dialogs. */
.wh-orbit-ui .card:not([class*="bg-red-"]):not([class*="bg-emerald-"]):not([class*="bg-green-"]):not([class*="bg-amber-"]):not([class*="bg-primary-"]) {
  background: var(--page-surface);
  box-shadow: var(--page-shadow);
}
.wh-orbit-ui .card:not([class*="border-primary-"]):not([class*="border-red-"]):not([class*="border-rose-"]):not([class*="border-green-"]):not([class*="border-blue-"]):not([class*="border-emerald-"]):not([class*="border-amber-"]) { border-color: var(--page-line); }
.wh-orbit-ui .card:is(.border-primary-500, .border-primary-400, .border-primary-300, [aria-selected="true"]) { border-color: var(--page-accent); box-shadow: 0 0 0 2px var(--page-glow); }
.wh-orbit-ui .card {
  border-radius: 16px;
  transition: border-color .25s ease, box-shadow .35s ease;
}
.wh-orbit-ui :is(.card-header, .card-footer) { border-color: var(--page-line); }
.wh-orbit-ui :is(.input, .select, .textarea) {
  background-color: var(--page-inset);
  color: var(--page-ink);
  border-color: var(--page-line);
  box-shadow: 0 1px 2px #00000002;
  transition: border-color .22s, box-shadow .22s, background-color .22s;
}
.wh-orbit-ui :is(.input, .select, .textarea):hover:not(:disabled) { border-color: color-mix(in srgb, var(--page-accent) 48%, var(--page-line)); }
.wh-orbit-ui :is(.input, .select, .textarea):focus {
  background-color: var(--page-surface);
  border-color: var(--page-accent);
  --tw-ring-color: var(--page-focus);
  box-shadow: 0 0 0 3px var(--page-glow);
}
.wh-orbit-ui .input-label { color: var(--page-muted); letter-spacing: .15px; }
.wh-orbit-ui .input::placeholder { color: var(--page-muted); opacity: .7; }
.wh-orbit-ui .input:is([aria-invalid="true"], .border-red-500, .border-red-300, .border-rose-500) { border-color: #d96770; }
.dark .wh-orbit-ui .input:is([aria-invalid="true"], .border-red-500, .border-red-300, .border-rose-500) { border-color: #f19198; }
.wh-orbit-ui :is(.input-hint, .input-help) { color: var(--page-muted); }
.wh-orbit-ui .btn {
  border-radius: 10px;
  transition: background-color .22s, border-color .22s, color .22s, box-shadow .25s, translate .3s var(--page-ease);
}
.wh-orbit-ui .btn-primary {
  background: linear-gradient(120deg, var(--page-accent), var(--page-accent-strong));
  color: #fff;
  border-color: transparent;
  box-shadow: 0 3px 10px var(--page-glow), inset 0 1px #ffffff24;
}
.dark .wh-orbit-ui .btn-primary { color: #132a38; }
.wh-orbit-ui .btn-primary:hover:not(:disabled) { box-shadow: 0 5px 17px var(--page-focus); translate: 0 -1px; }
.wh-orbit-ui .btn-primary:active:not(:disabled) { translate: 0 0; }
.wh-orbit-ui .btn-secondary { background: var(--page-surface); border-color: var(--page-line); box-shadow: 0 1px 3px #00000003; }
.wh-orbit-ui .btn-secondary:not([class*="text-red-"]):not([class*="text-rose-"]) { color: var(--page-ink); }
.wh-orbit-ui .btn-secondary:hover:not(:disabled) { background: var(--page-soft); border-color: var(--page-accent); }
.wh-orbit-ui .btn-ghost:hover:not(:disabled) { background-color: var(--page-soft); }
.wh-orbit-ui :is(button, a, input, select, textarea):focus-visible { outline-color: var(--page-focus); }
.wh-orbit-ui :is(button, a, input, select, textarea):disabled { translate: none; }
.wh-orbit-ui :is(.wh-content, .wh-auth, .wh-orbit-public, .wh-orbit-overlay) :is(.text-primary-500, .text-primary-600, .text-primary-700) { color: var(--page-accent); }
/* Typography and data surfaces. Status/error/success colors retain their meaning. */
.wh-orbit-ui :is(.wh-orbit-pages, .wh-auth, .wh-orbit-public, .wh-orbit-overlay) :is(.text-gray-900, .text-gray-950, .text-gray-800) { color: var(--page-ink); }
.wh-orbit-ui :is(.wh-orbit-pages, .wh-auth, .wh-orbit-public, .wh-orbit-overlay) :is(.text-gray-500, .text-gray-400) { color: var(--page-muted); }
.wh-orbit-ui :is(.wh-orbit-pages, .wh-auth, .wh-orbit-public, .wh-orbit-overlay) .bg-white { background-color: var(--page-surface); }
.wh-orbit-ui :is(.wh-orbit-pages, .wh-auth, .wh-orbit-public, .wh-orbit-overlay) :is(.bg-gray-50, .bg-gray-100) { background-color: var(--page-soft); }
.wh-orbit-ui :is(.wh-orbit-pages, .wh-auth, .wh-orbit-public, .wh-orbit-overlay) :is(.border-gray-100, .border-gray-200, .border-gray-300) { border-color: var(--page-line); }
.wh-orbit-ui .wh-orbit-pages :is(h1, h2, h3) { text-wrap: pretty; }
.wh-orbit-ui .wh-orbit-pages > :is(.space-y-6, .space-y-8) > :first-child h1 { font-weight: 550; letter-spacing: -.5px; }
.wh-orbit-ui .wh-orbit-pages :is(.table-page-layout, .wh-feedback) { min-width: 0; }
.wh-orbit-ui .wh-orbit-pages .layout-section-fixed {
  padding: 14px 16px;
  background: var(--page-surface);
  border: 1px solid var(--page-line);
  border-radius: 13px;
  box-shadow: var(--page-shadow);
}
.wh-orbit-ui .wh-orbit-pages .layout-section-fixed > .card { border: 0; box-shadow: none; }
.wh-orbit-ui .wh-orbit-pages .table-scroll-container { border-radius: 15px; }
.wh-orbit-ui :is(.wh-orbit-pages, .wh-orbit-public) table { border-collapse: separate; border-spacing: 0; }
.wh-orbit-ui :is(.wh-orbit-pages, .wh-orbit-public) thead { background: var(--page-inset); }
.wh-orbit-ui :is(.wh-orbit-pages, .wh-orbit-public) thead :is(tr, th) {
  background-color: var(--page-inset);
  color: var(--page-muted);
  border-color: var(--page-line);
  font-weight: 500;
  letter-spacing: .35px;
}
.wh-orbit-ui :is(.wh-orbit-pages, .wh-orbit-public) tbody tr { transition: background-color .2s; }
.wh-orbit-ui :is(.wh-orbit-pages, .wh-orbit-public) tbody tr:hover { background-color: var(--page-glow); }
.wh-orbit-ui :is(.wh-orbit-pages, .wh-orbit-public) tbody :is(td, th) { border-color: var(--page-line); }
.wh-orbit-ui :is(.wh-orbit-pages, .wh-orbit-public) td { font-variant-numeric: tabular-nums; }
.wh-orbit-ui :is(.wh-orbit-pages, .wh-orbit-public) nav[aria-label="Pagination"] { gap: 4px; box-shadow: none; }
.wh-orbit-ui :is(.wh-orbit-pages, .wh-orbit-public) nav[aria-label="Pagination"] > button { margin-left: 0; border-radius: 8px; }
.wh-orbit-ui :is(.wh-orbit-pages, .wh-orbit-public) nav[aria-label="Pagination"] > button[aria-current="page"] {
  background: var(--page-tint); border-color: var(--page-accent); color: var(--page-accent);
  box-shadow: inset 0 1px #ffffff12;
}
.wh-orbit-ui :is(.wh-orbit-pages, .wh-orbit-public) [role="tablist"] { border-color: var(--page-line); }
.wh-orbit-ui :is(.wh-orbit-pages, .wh-orbit-public) [role="tab"][aria-selected="true"] { color: var(--page-accent); border-color: var(--page-accent); }
/* Shared feedback, audit and forms. */
.wh-orbit-ui .wh-orbit-pages :is(.wh-feedback-card, .wh-audit-block, .card-recharge-frame-wrap) {
  background: var(--page-surface); border-color: var(--page-line); border-radius: 16px; box-shadow: var(--page-shadow);
}
.wh-orbit-ui .wh-orbit-pages :is(.wh-feedback-field input, .wh-feedback-field select, .wh-feedback-field textarea, .wh-feedback-toolbar input, .wh-feedback-toolbar select, .wh-audit-filters input, .wh-audit-filters select) {
  background: var(--page-inset); color: var(--page-ink); border-color: var(--page-line);
  transition: border-color .22s, box-shadow .22s;
}
.wh-orbit-ui .wh-orbit-pages :is(.wh-feedback-field input, .wh-feedback-field select, .wh-feedback-field textarea):focus { border-color: var(--page-accent); box-shadow: 0 0 0 3px var(--page-glow); }
.wh-orbit-ui .wh-orbit-pages .wh-feedback-primary:not(.wh-feedback-danger-fill) { background: var(--page-accent); border-color: var(--page-accent); color: #fff; }
.dark .wh-orbit-ui .wh-orbit-pages .wh-feedback-primary:not(.wh-feedback-danger-fill) { color: #132a38; }
.wh-orbit-ui .wh-orbit-pages :is(.wh-feedback-secondary, .card-recharge-refresh, .card-recharge-open) { background: var(--page-surface); border-color: var(--page-line); color: var(--page-ink); }
.wh-orbit-ui .wh-orbit-pages :is(.wh-feedback-kicker, .card-recharge-kicker) { color: var(--page-cyan); letter-spacing: 2px; }
/* Creation pages: keep full-height chat, image sizing and model controls. */
.wh-orbit-ui .wh-orbit-pages .wh-chat-workspace { background: var(--page-bg); }
.wh-orbit-ui .wh-orbit-pages .wh-conversations { background: var(--page-inset); }
.wh-orbit-ui .wh-orbit-pages :is(.wh-chat-toolbar, .wh-chat-settings) { background: var(--page-surface); border-color: var(--page-line); }
.wh-orbit-ui .wh-orbit-pages .wh-chat-scroll { background: radial-gradient(ellipse 65% 220px at 50% 0, var(--page-glow), transparent); }
.wh-orbit-ui .wh-orbit-pages .wh-empty-mark {
  color: var(--page-accent); border: 1px solid var(--page-line); border-radius: 22px;
  background: linear-gradient(140deg, var(--page-surface), var(--page-tint)); box-shadow: var(--page-shadow);
  animation: wh-orbit-emblem 9s ease-in-out infinite;
}
.wh-orbit-ui .wh-orbit-pages .wh-prompt-grid > button { border: 1px solid var(--page-line); background: var(--page-surface); border-radius: 13px; transition: border-color .25s, translate .35s var(--page-ease); }
.wh-orbit-ui .wh-orbit-pages .wh-prompt-grid > button:hover { border-color: var(--page-accent); translate: 0 -2px; }
.wh-orbit-ui .wh-orbit-pages .wh-composer {
  background: var(--page-surface); border: 1px solid var(--page-line); box-shadow: 0 6px 30px var(--page-glow);
  transition: border-color .25s, box-shadow .25s;
}
.wh-orbit-ui .wh-orbit-pages .wh-composer:focus-within { border-color: var(--page-accent); box-shadow: 0 6px 28px var(--page-glow), 0 0 0 3px var(--page-glow); }
.wh-orbit-ui .wh-orbit-pages .wh-send:not(:disabled) { background: var(--page-accent); color: #fff; }
.dark .wh-orbit-ui .wh-orbit-pages .wh-send:not(:disabled) { color: #132a38; }
.wh-orbit-ui .wh-orbit-pages .wh-user-text { background: var(--page-tint); color: var(--page-ink); border: 1px solid var(--page-line); }
.wh-orbit-ui .wh-orbit-pages :is(.wh-image-form, .wh-image-canvas, .wh-gallery figure, .wh-request-preview) { background: var(--page-surface); border: 1px solid var(--page-line); border-radius: 17px; box-shadow: var(--page-shadow); }
.wh-orbit-ui .wh-orbit-pages .wh-image-form { background: linear-gradient(160deg, var(--page-surface) 70%, var(--page-inset)); }
.wh-orbit-ui .wh-orbit-pages .wh-image-canvas { background: radial-gradient(ellipse at 50% 40%, var(--page-glow), transparent 65%), var(--page-surface); }
.wh-orbit-ui .wh-orbit-pages .wh-segmented { border: 1px solid var(--page-line); background: var(--page-soft); }
.wh-orbit-ui .wh-orbit-pages .wh-segmented button.active { color: var(--page-accent); background: var(--page-surface); box-shadow: 0 2px 7px var(--page-glow); }
.wh-orbit-ui .wh-orbit-pages .wh-field :is(input, textarea, select) { background: var(--page-inset); border-color: var(--page-line); color: var(--page-ink); }
.wh-orbit-ui .wh-orbit-pages .wh-field :is(input, textarea, select):focus { border-color: var(--page-accent); }
.wh-orbit-ui .wh-orbit-pages .wh-gallery-preview { background: var(--page-inset); }
.wh-orbit-ui .wh-orbit-pages .wh-prompt-chips button { background: var(--page-soft); color: var(--page-muted); border-color: var(--page-line); }
.wh-orbit-ui .wh-orbit-pages .wh-prompt-chips button:hover { color: var(--page-accent); border-color: var(--page-accent); }
/* Billing, subscriptions, account and docs get the same quiet surfaces. */
.wh-orbit-ui .wh-orbit-pages[data-orbit-page="/profile"] .card:first-child { border-color: color-mix(in srgb, var(--page-accent) 30%, var(--page-line)); }
.wh-orbit-ui .wh-orbit-pages:is([data-orbit-page="/profile"], [data-orbit-page="/redeem"]) .card[class*="from-primary-"] { background: linear-gradient(120deg, var(--page-tint), var(--page-surface) 65%, var(--page-glow)); }
.wh-orbit-ui .wh-orbit-pages[data-orbit-page="/purchase"] .card { border-radius: 17px; }
.wh-orbit-ui .wh-orbit-pages[data-orbit-page="/subscriptions"] .card { border-color: var(--page-line); box-shadow: var(--page-shadow); }
.wh-orbit-ui .wh-orbit-pages[data-orbit-page="/model-plaza"] .glass { background: color-mix(in srgb, var(--page-surface) 96%, transparent); border-color: var(--page-line); }
/* Public/auth pages also follow the same existing html.dark theme state. */
.wh-orbit-ui :is(.wh-orbit-public, .wh-auth) { background-color: var(--page-bg); color: var(--page-ink); }
.wh-orbit-ui .wh-auth {
  background-image: radial-gradient(ellipse 600px 450px at 14% 25%, var(--page-glow), transparent), radial-gradient(ellipse 600px 450px at 88% 80%, #6aaab00b, transparent);
}
.wh-orbit-ui .wh-auth-main {
  position: relative; width: min(440px, calc(100% - 36px)); margin: 42px auto 65px;
  padding: 32px 32px 27px; border: 1px solid var(--page-line); border-radius: 22px;
  background: var(--page-surface); box-shadow: 0 12px 60px var(--page-glow);
}
.wh-orbit-ui .wh-auth-main::before {
  content: ""; position: absolute; pointer-events: none; top: -1px; left: 22%; right: 22%; height: 1px;
  background: linear-gradient(90deg, transparent, var(--page-accent), var(--page-cyan), transparent);
}
.wh-orbit-ui .wh-auth-logo .wh-brand-icon {
  position: relative; isolation: isolate; overflow: visible;
  color: var(--page-accent); background: var(--page-soft); border: 1px solid var(--page-line);
}
.wh-orbit-ui .wh-auth-logo .wh-brand-icon::after {
  content: ""; position: absolute; inset: -7px; border: 1px dashed var(--page-line); border-radius: 23px;
  pointer-events: none; animation: wh-orbit-auth-orbit 40s linear infinite;
}
.wh-orbit-ui .wh-auth-form h2 { color: var(--page-ink); font-size: 25px; letter-spacing: -.6px; }
.wh-orbit-ui .wh-auth-form .input { border-radius: 10px; }
.wh-orbit-ui .wh-auth-footer { border-top: 1px dashed var(--page-line); padding-top: 21px; }
.wh-orbit-ui :is(.wh-public-nav, .wh-public-footer) { border-color: var(--page-line); }
.wh-orbit-ui .wh-public-nav { background: color-mix(in srgb, var(--page-surface) 90%, transparent); }
.wh-orbit-ui .wh-nav-cta { background: var(--page-accent); border-radius: 9px; color: white; }
.dark .wh-orbit-ui .wh-nav-cta { color: #132a38; }
.wh-orbit-ui .wh-orbit-public.wh-home { background: var(--page-bg); }
.wh-orbit-ui .wh-home-feature { background: var(--page-surface); border: 1px solid var(--page-line); border-radius: 20px; box-shadow: var(--page-shadow); }
.wh-orbit-ui .wh-home-feature:not(.wh-feature-image) { background: linear-gradient(145deg, var(--page-surface) 65%, var(--page-soft)); }
.wh-orbit-ui .wh-api-band { background: var(--page-surface); border: 1px solid var(--page-line); border-radius: 20px; }
.wh-orbit-ui .wh-home-faq details { border-color: var(--page-line); }
.wh-orbit-ui .wh-orbit-public:not(.wh-home) {
  background-image: radial-gradient(ellipse 80% 340px at 50% 0, var(--page-glow), transparent);
}
.wh-orbit-ui .wh-orbit-public > header { background-color: var(--page-surface); border-color: var(--page-line); }
/* Runtime marks Vue teleported surfaces; no backdrop/position/z-index changes. */
.wh-orbit-ui .wh-orbit-overlay { --tw-ring-color: var(--page-line); color: var(--page-ink); }
.wh-orbit-ui .wh-orbit-overlay.bg-white { background-color: var(--page-surface); }
.wh-orbit-ui .wh-orbit-overlay .btn-primary { background: linear-gradient(120deg, var(--page-accent), var(--page-accent-strong)); }
.wh-orbit-ui .wh-orbit-overlay [role="dialog"] { border-color: var(--page-line); }
@keyframes wh-orbit-emblem { 0%, 100% { translate: 0 0; rotate: -2deg; } 50% { translate: 0 -4px; rotate: 2deg; } }
@keyframes wh-orbit-auth-orbit { to { rotate: 360deg; } }
/* Pause ambient elements in background tabs. Entry animations use WAAPI and
   are separately paused/cancelled by the lifecycle controller. */
.wh-orbit-ui[data-orbit-paused="true"] :is(.wh-empty-mark, .wh-auth-logo .wh-brand-icon)::after,
.wh-orbit-ui[data-orbit-paused="true"] .wh-empty-mark { animation-play-state: paused; }
@media (max-width: 767px) {
  .wh-orbit-ui .wh-orbit-pages .layout-section-fixed { padding: 12px; border-radius: 12px; }
  .wh-orbit-ui .wh-orbit-pages nav[aria-label="Pagination"] { gap: 2px; }
  .wh-orbit-ui .wh-orbit-pages nav[aria-label="Pagination"] > button { padding-left: 10px; padding-right: 10px; }
  .wh-orbit-ui .wh-auth-main { margin-top: 26px; padding: 27px 23px 24px; border-radius: 18px; }
  .wh-orbit-ui .wh-auth-form h2 { font-size: 23px; }
}
@media (prefers-reduced-motion: reduce) {
  .wh-orbit-ui .wh-empty-mark, .wh-orbit-ui .wh-auth-logo .wh-brand-icon::after { animation: none; }
  .wh-orbit-ui :is(.btn, .input, .select, .textarea, .card, .wh-composer, .wh-prompt-grid > button) { transition: none; }
  .wh-orbit-ui .wh-prompt-grid > button:hover, .wh-orbit-ui .btn-primary:hover:not(:disabled) { translate: none; }
}

.wh-orbit-ui .wh-image-reference-panel { margin-top: 18px; padding: 13px; border: 1px solid var(--page-line); border-radius: 12px; background: var(--page-inset); }
.wh-orbit-ui .wh-image-reference-selected { display: flex; align-items: center; gap: 10px; min-width: 0; }
.wh-orbit-ui .wh-image-reference-selected > img { width: 58px; height: 58px; object-fit: cover; border-radius: 9px; flex-shrink: 0; border: 1px solid var(--page-line); }
.wh-orbit-ui .wh-image-reference-selected > div { flex: 1; min-width: 0; }
.wh-orbit-ui .wh-image-reference-selected :is(strong,span,small) { display: block; }
.wh-orbit-ui .wh-image-reference-selected strong { font-size: 11px; color: var(--page-accent); }
.wh-orbit-ui .wh-image-reference-selected span { font-size: 9px; color: var(--page-muted); margin-top: 4px; overflow-wrap: anywhere; }
.wh-orbit-ui .wh-image-reference-selected small { font-size: 9px; color: var(--page-muted); white-space: nowrap; text-overflow: ellipsis; overflow: hidden; margin-top: 3px; }
.wh-orbit-ui .wh-image-reference-selected > button { align-self: flex-start; width: 25px; height: 25px; border-radius: 7px; color: var(--page-muted); }
.wh-orbit-ui .wh-image-reference-selected > button:hover { color: var(--page-accent); background: var(--page-soft); }
.wh-orbit-ui .wh-image-reference-actions { display: flex; justify-content: space-between; align-items: center; gap: 9px; margin-top: 8px; }
.wh-orbit-ui .wh-image-reference-actions .wh-reference-input { margin: 0; font-size: 10px; }
.wh-orbit-ui .wh-image-reference-actions > button { font-size: 10px; color: var(--page-accent); padding: 5px 0; }
.wh-orbit-ui :is(.wh-image-reference-note,.wh-image-task-hint) { font-size: 10px; line-height: 1.8; color: var(--page-muted); margin-top: 10px; }
.wh-orbit-ui .wh-image-task-hint { margin: -7px 0 18px; }
.wh-orbit-ui .wh-image-reference-error { font-size: 11px; line-height: 1.8; color: #b84650; margin-top: 9px; }
.dark .wh-orbit-ui .wh-image-reference-error { color: #ef9ca3; }
.wh-orbit-ui .wh-image-continue { position: absolute; left: 10px; bottom: 10px; display: inline-flex; min-height: 31px; align-items: center; padding: 0 12px; border: 1px solid var(--page-line); border-radius: 9px; background: var(--page-surface); color: var(--page-accent); box-shadow: var(--page-shadow); font-size: 11px; transition: translate .25s var(--page-ease),border-color .25s; }
.wh-orbit-ui .wh-image-continue:hover:not(:disabled) { translate: 0 -2px; border-color: var(--page-accent); }
.wh-orbit-ui .wh-image-continue-options { display: flex; flex-wrap: wrap; gap: 6px; margin: 12px 0 5px; }
.wh-orbit-ui .wh-image-continue-history { display: inline-flex; align-items: center; gap: 5px; min-height: 30px; padding: 4px 8px; border-radius: 8px; background: var(--page-soft); border: 1px solid var(--page-line); color: var(--page-accent); font-size: 10px; }
.wh-orbit-ui .wh-image-continue-history img { width: 23px; height: 23px; border-radius: 4px; object-fit: cover; }
.wh-orbit-ui .wh-image-version { display: block; margin-top: 6px; font-size: 9px; color: var(--page-cyan); letter-spacing: .3px; }
.wh-orbit-ui .wh-status.uncertain { background: #fff0d2; color: #825d28; }
.dark .wh-orbit-ui .wh-status.uncertain { background: #483b28; color: #e4c699; }
@media (prefers-reduced-motion: reduce) { .wh-orbit-ui .wh-image-continue { transition: none; } .wh-orbit-ui .wh-image-continue:hover:not(:disabled) { translate: none; } }
