:root {
  --vibe-hue: var(--orbita-personal-hue, 174);
  --vibe-mint: hsl(var(--vibe-hue) 88% 70%);
  --vibe-cyan: hsl(calc(var(--vibe-hue) + 38) 90% 70%);
  --vibe-amber: #ffc878;
  --vibe-ink: #effffd;
  --vibe-muted: rgba(211, 235, 233, .58);
  --vibe-surface: rgba(4, 15, 20, .72);
  --vibe-font: "Manrope", "Noto Sans SC", sans-serif;
  --vibe-mono: "IBM Plex Mono", monospace;
}

.orbita-vibe-launcher {
  position: fixed;
  z-index: 118;
  left: max(20px, env(safe-area-inset-left));
  bottom: max(22px, env(safe-area-inset-bottom));
  display: flex;
  align-items: center;
  gap: 11px;
  min-width: 190px;
  padding: 9px 14px 9px 9px;
  border: 0;
  border-radius: 999px;
  color: var(--vibe-ink);
  background: linear-gradient(112deg, rgba(10, 34, 36, .78), rgba(4, 12, 19, .64));
  box-shadow: inset 0 1px rgba(255, 255, 255, .16), inset 0 -1px rgba(116, 246, 227, .08), 0 18px 50px rgba(0, 0, 0, .34);
  -webkit-backdrop-filter: blur(24px) saturate(150%);
  backdrop-filter: blur(24px) saturate(150%);
  cursor: pointer;
  transition: transform .35s cubic-bezier(.2, .8, .2, 1), background .35s ease, opacity .3s ease;
}

.orbita-vibe-launcher[hidden] { display: none !important; }
.orbita-vibe-launcher:hover { transform: translateY(-4px); background: linear-gradient(112deg, rgba(15, 54, 54, .86), rgba(5, 18, 28, .72)); }
.orbita-vibe-launcher-mark { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; color: #02110f; background: linear-gradient(145deg, var(--vibe-mint), var(--vibe-cyan)); box-shadow: 0 0 30px hsl(var(--vibe-hue) 88% 62% / .28); }
.orbita-vibe-launcher svg { width: 18px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.orbita-vibe-launcher > span:nth-child(2) { display: grid; text-align: left; }
.orbita-vibe-launcher small { color: rgba(220, 246, 241, .45); font: 500 8px/1.3 var(--vibe-mono); letter-spacing: .15em; }
.orbita-vibe-launcher b { margin-top: 2px; font: 650 12px/1.3 var(--vibe-font); }
.orbita-vibe-launcher > i { width: 6px; height: 6px; margin-left: auto; border-radius: 50%; background: var(--vibe-mint); box-shadow: 0 0 14px var(--vibe-mint); }
.orbita-vibe-launcher.is-building > i { animation: vibe-pulse .8s infinite alternate; }
.orbita-vibe-launcher.has-session::after { content: ""; position: absolute; inset: -3px; border: 1px solid hsl(var(--vibe-hue) 80% 70% / .25); border-radius: inherit; animation: vibe-ring 2.8s infinite; }

.agent-vibe-entry {
  display: grid;
  grid-template-columns: 28px 1fr 18px;
  align-items: center;
  gap: 10px;
  width: calc(100% - 24px);
  margin: 0 12px 9px;
  padding: 10px 12px;
  border: 0;
  border-radius: 16px;
  color: rgba(235, 255, 251, .92);
  background: linear-gradient(110deg, hsl(var(--vibe-hue) 46% 18% / .74), rgba(6, 16, 24, .48));
  box-shadow: inset 0 1px rgba(255, 255, 255, .1);
  cursor: pointer;
  text-align: left;
}
.agent-vibe-entry svg { width: 18px; fill: none; stroke: var(--vibe-mint); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.agent-vibe-entry > span { display: grid; }
.agent-vibe-entry b { font: 650 12px/1.3 var(--vibe-font); }
.agent-vibe-entry small { color: rgba(211, 235, 233, .48); font: 9px/1.4 var(--vibe-font); }

.orbita-vibe-studio {
  position: fixed;
  z-index: 310;
  inset: 0;
  isolation: isolate;
  display: grid;
  grid-template-rows: 72px 1fr;
  overflow: hidden;
  color: var(--vibe-ink);
  background:
    radial-gradient(circle at 14% 18%, hsl(var(--vibe-hue) 80% 48% / .13), transparent 27%),
    radial-gradient(circle at 84% 74%, hsl(calc(var(--vibe-hue) + 55) 82% 55% / .11), transparent 28%),
    linear-gradient(145deg, rgba(1, 8, 12, .94), rgba(2, 11, 17, .88) 48%, rgba(1, 7, 12, .96));
  font-family: var(--vibe-font);
  -webkit-backdrop-filter: blur(34px) saturate(135%);
  backdrop-filter: blur(34px) saturate(135%);
}
.orbita-vibe-studio[hidden] { display: none !important; }
.orbita-vibe-studio::before { content: ""; position: absolute; z-index: -1; inset: 0; opacity: .23; pointer-events: none; background-image: linear-gradient(rgba(160, 248, 232, .075) 1px, transparent 1px), linear-gradient(90deg, rgba(160, 248, 232, .055) 1px, transparent 1px); background-size: 64px 64px; mask-image: linear-gradient(to bottom, black, transparent 84%); }
.vibe-atmosphere, .vibe-atmosphere i, .vibe-atmosphere span { position: absolute; pointer-events: none; }
.vibe-atmosphere { z-index: -1; inset: 0; overflow: hidden; }
.vibe-atmosphere i { width: 46vw; aspect-ratio: 1; border-radius: 50%; filter: blur(70px); opacity: .1; background: var(--vibe-mint); animation: vibe-drift 18s ease-in-out infinite alternate; }
.vibe-atmosphere i:nth-child(1) { left: -18vw; top: -20vw; }
.vibe-atmosphere i:nth-child(2) { right: -20vw; bottom: -22vw; background: var(--vibe-cyan); animation-delay: -8s; }
.vibe-atmosphere i:nth-child(3) { width: 20vw; left: 48%; top: 25%; opacity: .06; background: var(--vibe-amber); animation-delay: -12s; }
.vibe-atmosphere span { inset: 0; background: linear-gradient(115deg, transparent 35%, rgba(197, 255, 243, .04) 49%, transparent 62%); transform: translateX(-100%); animation: vibe-scan 12s linear infinite; }

.vibe-topbar {
  display: flex;
  align-items: center;
  gap: 24px;
  padding: 0 22px;
  background: linear-gradient(180deg, rgba(8, 23, 28, .58), rgba(4, 12, 17, .2));
  box-shadow: inset 0 -1px rgba(214, 255, 246, .065);
  -webkit-backdrop-filter: blur(24px);
  backdrop-filter: blur(24px);
}
.vibe-identity { display: flex; align-items: center; gap: 11px; min-width: 280px; }
.vibe-symbol { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 14px; color: #031310; background: linear-gradient(145deg, var(--vibe-mint), var(--vibe-cyan)); box-shadow: 0 0 35px hsl(var(--vibe-hue) 88% 64% / .18); }
.vibe-symbol svg, .vibe-window-actions svg, .vibe-stage-tools svg, .vibe-generate svg, .vibe-library-head svg, .vibe-inspector-actions svg, .vibe-empty-orbit svg { width: 18px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.vibe-identity > div { display: grid; }
.vibe-identity small { color: rgba(212, 239, 235, .42); font: 500 8px/1.4 var(--vibe-mono); letter-spacing: .16em; }
.vibe-identity strong { margin-top: 2px; font-size: 14px; letter-spacing: -.02em; }
.vibe-runtime-pill { display: flex; align-items: center; gap: 8px; margin-left: auto; padding: 8px 12px; border-radius: 999px; background: rgba(7, 24, 28, .5); box-shadow: inset 0 1px rgba(255, 255, 255, .08); }
.vibe-runtime-pill > i { width: 6px; height: 6px; border-radius: 50%; background: var(--vibe-mint); box-shadow: 0 0 12px var(--vibe-mint); }
.vibe-runtime-pill span { font-size: 10px; color: rgba(231, 252, 248, .78); }
.vibe-runtime-pill b { color: rgba(210, 235, 231, .32); font: 500 8px/1 var(--vibe-mono); letter-spacing: .08em; }
.vibe-window-actions { display: flex; align-items: center; gap: 4px; }
.vibe-window-actions button, .vibe-stage-tools > button { display: grid; place-items: center; width: 36px; height: 36px; border: 0; border-radius: 50%; color: rgba(231, 250, 247, .64); background: transparent; cursor: pointer; transition: color .2s, background .2s, transform .2s; }
.vibe-window-actions button:hover, .vibe-stage-tools > button:hover { color: white; background: rgba(255, 255, 255, .08); transform: translateY(-1px); }

.vibe-layout { min-height: 0; display: grid; grid-template-columns: minmax(280px, 22vw) minmax(460px, 1fr) minmax(260px, 20vw); }
.vibe-brief-rail, .vibe-library-rail, .vibe-stage { min-width: 0; min-height: 0; }
.vibe-brief-rail, .vibe-library-rail { overflow: auto; scrollbar-width: thin; scrollbar-color: rgba(116, 238, 220, .2) transparent; }
.vibe-brief-rail { padding: clamp(22px, 2.4vw, 38px); background: linear-gradient(135deg, rgba(9, 28, 31, .42), rgba(3, 12, 17, .26)); box-shadow: inset -1px 0 rgba(210, 255, 246, .055); }
.vibe-library-rail { padding: clamp(20px, 2vw, 30px); background: linear-gradient(225deg, rgba(9, 24, 31, .36), rgba(3, 10, 15, .24)); box-shadow: inset 1px 0 rgba(210, 255, 246, .055); }
.vibe-rail-intro > span, .vibe-library-head > span { color: var(--vibe-mint); font: 500 8px/1 var(--vibe-mono); letter-spacing: .18em; }
.vibe-rail-intro h2, .vibe-library-head h2 { margin: 12px 0; font-size: clamp(24px, 2.2vw, 37px); line-height: .98; letter-spacing: -.055em; font-weight: 650; }
.vibe-rail-intro p { max-width: 350px; margin: 0; color: var(--vibe-muted); font-size: 12px; line-height: 1.72; }
.vibe-template-heading { display: flex; align-items: end; justify-content: space-between; margin: 30px 0 10px; }
.vibe-template-heading strong { font-size: 11px; }
.vibe-template-heading small { color: rgba(213, 237, 233, .35); font-size: 8px; }
.vibe-template-list { display: grid; gap: 3px; }
.vibe-template { display: grid; grid-template-columns: 36px 1fr; align-items: center; gap: 10px; width: 100%; padding: 10px 8px; border: 0; border-radius: 14px; color: rgba(226, 247, 244, .66); background: transparent; text-align: left; cursor: pointer; transition: background .25s, color .25s, transform .25s; }
.vibe-template:hover { color: white; transform: translateX(3px); background: rgba(255, 255, 255, .035); }
.vibe-template.is-active { color: white; background: linear-gradient(90deg, hsl(var(--vibe-hue) 56% 35% / .22), transparent); box-shadow: inset 2px 0 var(--vibe-mint); }
.vibe-template > span { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 11px; color: var(--vibe-mint); background: rgba(136, 245, 225, .07); font: 600 8px/1 var(--vibe-mono); letter-spacing: .05em; }
.vibe-template > div { display: grid; gap: 2px; }
.vibe-template strong { font-size: 11px; font-weight: 620; }
.vibe-template small { color: rgba(204, 229, 225, .36); font-size: 8px; line-height: 1.35; }
.vibe-compose { margin-top: 24px; }
.vibe-mode-switch, .vibe-viewport-switch { display: grid; grid-template-columns: 1fr 1fr; padding: 3px; border-radius: 999px; background: rgba(1, 8, 12, .48); box-shadow: inset 0 0 0 1px rgba(214, 255, 247, .055); }
.vibe-mode-switch button, .vibe-viewport-switch button { border: 0; border-radius: 999px; padding: 7px 8px; color: rgba(215, 239, 235, .38); background: transparent; font: 500 8px/1.2 var(--vibe-font); cursor: pointer; }
.vibe-mode-switch button.is-active, .vibe-viewport-switch button.is-active { color: #eafff9; background: rgba(115, 225, 207, .12); box-shadow: inset 0 1px rgba(255, 255, 255, .08); }
.vibe-compose > label { display: block; margin: 16px 0 7px; color: rgba(226, 247, 244, .58); font-size: 9px; }
.vibe-compose textarea { width: 100%; min-height: 124px; resize: vertical; border: 0; border-radius: 18px; padding: 14px; color: var(--vibe-ink); background: rgba(2, 10, 15, .56); box-shadow: inset 0 0 0 1px rgba(213, 255, 246, .075), inset 0 12px 36px rgba(0, 0, 0, .18); outline: none; font: 11px/1.68 var(--vibe-font); transition: box-shadow .25s; }
.vibe-compose textarea:focus { box-shadow: inset 0 0 0 1px hsl(var(--vibe-hue) 76% 66% / .42), 0 0 34px hsl(var(--vibe-hue) 82% 52% / .08); }
.vibe-compose textarea::placeholder { color: rgba(207, 230, 227, .24); }
.vibe-quality-contract { display: flex; flex-wrap: wrap; gap: 5px; margin: 9px 0 12px; }
.vibe-quality-contract span { padding: 4px 7px; border-radius: 999px; color: rgba(199, 231, 226, .45); background: rgba(128, 225, 209, .055); font: 500 7px/1 var(--vibe-mono); letter-spacing: .04em; }
.vibe-generate { display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 9px 10px 9px 14px; border: 0; border-radius: 999px; color: #031511; background: linear-gradient(110deg, var(--vibe-mint), hsl(calc(var(--vibe-hue) + 24) 88% 70%)); box-shadow: 0 12px 35px hsl(var(--vibe-hue) 75% 42% / .17), inset 0 1px rgba(255, 255, 255, .52); cursor: pointer; }
.vibe-generate:disabled { opacity: .55; cursor: wait; }
.vibe-generate > span { display: flex; align-items: center; gap: 8px; }
.vibe-generate b { font-size: 10px; }
.vibe-generate > i { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: rgba(2, 18, 15, .13); }

.vibe-stage { display: grid; grid-template-rows: auto 1fr auto; padding: 20px clamp(14px, 2vw, 30px) 14px; background: radial-gradient(circle at 50% 5%, hsl(var(--vibe-hue) 60% 50% / .055), transparent 36%); }
.vibe-stage-head { display: flex; align-items: end; justify-content: space-between; gap: 20px; min-height: 82px; padding: 0 3px 16px; }
.vibe-stage-head > div:first-child { min-width: 0; }
.vibe-stage-head small { color: var(--vibe-mint); font: 500 8px/1 var(--vibe-mono); letter-spacing: .15em; }
.vibe-stage-head h2 { overflow: hidden; margin: 7px 0 3px; max-width: 700px; font-size: clamp(20px, 2.2vw, 34px); line-height: 1.05; font-weight: 620; letter-spacing: -.045em; text-overflow: ellipsis; white-space: nowrap; }
.vibe-stage-head p { overflow: hidden; max-width: 720px; margin: 0; color: rgba(207, 232, 229, .42); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.vibe-stage-tools { display: flex; align-items: center; gap: 5px; flex: none; }
.vibe-viewport-switch { grid-template-columns: repeat(3, 1fr); min-width: 145px; }
.vibe-execution-field { position: relative; min-height: 0; display: grid; place-items: center; overflow: hidden; border-radius: 26px; background: linear-gradient(145deg, rgba(4, 16, 23, .78), rgba(1, 7, 12, .92)); box-shadow: inset 0 1px rgba(255, 255, 255, .09), inset 0 0 0 1px rgba(210, 255, 246, .04), 0 25px 100px rgba(0, 0, 0, .28); }
.vibe-execution-field::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(circle at 50% 0, hsl(var(--vibe-hue) 90% 65% / .06), transparent 34%), linear-gradient(120deg, transparent 43%, rgba(255, 255, 255, .018) 50%, transparent 57%); }
.vibe-execution-field iframe { position: relative; z-index: 1; display: block; width: 100%; height: 100%; min-height: 430px; border: 0; border-radius: inherit; background: #071018; transition: width .4s cubic-bezier(.2, .8, .2, 1), border-radius .4s, box-shadow .4s; }
.vibe-execution-field iframe[hidden] { display: none; }
.vibe-execution-field[data-viewport="tablet"] iframe { width: min(760px, 86%); border-radius: 22px; box-shadow: 0 0 0 1px rgba(255, 255, 255, .1), 0 20px 70px rgba(0, 0, 0, .5); }
.vibe-execution-field[data-viewport="mobile"] iframe { width: min(390px, 72%); border-radius: 30px; box-shadow: 0 0 0 1px rgba(255, 255, 255, .12), 0 24px 80px rgba(0, 0, 0, .6); }
.vibe-empty-state { position: relative; z-index: 1; width: min(520px, 82%); text-align: center; }
.vibe-empty-state[hidden] { display: none; }
.vibe-empty-orbit { position: relative; display: grid; place-items: center; width: 112px; height: 112px; margin: 0 auto 20px; }
.vibe-empty-orbit::before, .vibe-empty-orbit::after, .vibe-empty-orbit i { content: ""; position: absolute; inset: 8px; border: 1px solid hsl(var(--vibe-hue) 70% 70% / .16); border-radius: 50%; transform: rotate(22deg) scaleY(.44); animation: vibe-orbit 7s linear infinite; }
.vibe-empty-orbit::after { inset: 22px; transform: rotate(-38deg) scaleY(.55); animation-duration: 5s; animation-direction: reverse; }
.vibe-empty-orbit i:nth-child(2) { inset: 0; opacity: .45; transform: rotate(76deg) scaleY(.32); animation-duration: 10s; }
.vibe-empty-orbit span { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; color: var(--vibe-mint); background: rgba(92, 219, 199, .1); box-shadow: 0 0 34px hsl(var(--vibe-hue) 82% 55% / .12); }
.vibe-empty-state > small, .vibe-build-state > small { color: var(--vibe-mint); font: 500 8px/1 var(--vibe-mono); letter-spacing: .18em; }
.vibe-empty-state h3, .vibe-build-state h3 { margin: 10px 0 7px; font-size: clamp(22px, 3vw, 38px); letter-spacing: -.05em; }
.vibe-empty-state p { margin: auto; max-width: 460px; color: var(--vibe-muted); font-size: 11px; line-height: 1.7; }
.vibe-build-state { position: absolute; z-index: 4; inset: 0; display: grid; place-content: center; justify-items: center; padding: 30px; text-align: center; background: rgba(2, 10, 15, .82); -webkit-backdrop-filter: blur(30px); backdrop-filter: blur(30px); }
.vibe-build-state[hidden] { display: none; }
.vibe-build-core { position: relative; display: grid; place-items: center; width: 104px; height: 104px; margin-bottom: 15px; }
.vibe-build-core > i { position: absolute; inset: 0; border: 1px solid hsl(var(--vibe-hue) 86% 70% / .24); border-radius: 38% 62% 58% 42%; animation: vibe-morph 3.2s ease-in-out infinite alternate, vibe-orbit 8s linear infinite; }
.vibe-build-core > i:nth-child(2) { inset: 15px; border-color: hsl(calc(var(--vibe-hue) + 42) 90% 70% / .28); animation-duration: 2.4s, 5s; animation-direction: alternate, reverse; }
.vibe-build-core span { display: grid; place-items: center; width: 42px; height: 42px; color: #031410; border-radius: 50%; background: var(--vibe-mint); box-shadow: 0 0 40px hsl(var(--vibe-hue) 90% 65% / .3); }
.vibe-build-steps { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin-top: 16px; }
.vibe-build-steps span { padding: 5px 8px; border-radius: 999px; color: rgba(219, 242, 238, .38); background: rgba(255, 255, 255, .04); font-size: 8px; animation: vibe-step 2.4s infinite; }
.vibe-build-steps span:nth-child(2) { animation-delay: .4s; }.vibe-build-steps span:nth-child(3) { animation-delay: .8s; }.vibe-build-steps span:nth-child(4) { animation-delay: 1.2s; }
.vibe-stage-foot { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px; min-height: 42px; padding: 10px 5px 0; }
.vibe-stage-foot > span { display: flex; align-items: center; gap: 7px; }
.vibe-stage-foot > span i { width: 6px; height: 6px; border-radius: 50%; background: var(--vibe-mint); box-shadow: 0 0 11px var(--vibe-mint); }
.vibe-stage-foot b { font-size: 8px; font-weight: 600; color: rgba(225, 247, 243, .7); }
.vibe-stage-foot p { overflow: hidden; margin: 0; color: rgba(204, 228, 225, .32); font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.vibe-stage-foot button { border: 0; color: rgba(219, 243, 239, .48); background: transparent; font-size: 8px; cursor: pointer; }

.vibe-library-head h2 { font-size: clamp(22px, 2vw, 31px); }
.vibe-library-head label { display: flex; align-items: center; gap: 8px; margin-top: 20px; padding: 9px 11px; border-radius: 999px; color: rgba(210, 236, 232, .35); background: rgba(2, 10, 14, .48); box-shadow: inset 0 0 0 1px rgba(215, 255, 247, .055); }
.vibe-library-head label svg { width: 14px; }
.vibe-library-head input { min-width: 0; width: 100%; border: 0; outline: 0; color: var(--vibe-ink); background: transparent; font: 9px/1.3 var(--vibe-font); }
.vibe-library-head input::placeholder { color: rgba(205, 231, 227, .27); }
.vibe-project-list { display: grid; gap: 3px; margin-top: 17px; }
.vibe-project-list[data-loading="true"] { opacity: .45; }
.vibe-project-list-empty { padding: 22px 4px; color: rgba(207, 233, 229, .38); font-size: 10px; line-height: 1.7; }
.vibe-project-card { display: grid; width: 100%; padding: 12px 10px; border: 0; border-radius: 15px; color: rgba(224, 246, 242, .66); background: transparent; text-align: left; cursor: pointer; transition: background .25s, color .25s, transform .25s; }
.vibe-project-card:hover { color: white; transform: translateX(-2px); background: rgba(255, 255, 255, .035); }
.vibe-project-card.is-active { color: white; background: linear-gradient(270deg, hsl(var(--vibe-hue) 56% 34% / .2), transparent); box-shadow: inset -2px 0 var(--vibe-mint); }
.vibe-project-card-top { display: flex; align-items: center; justify-content: space-between; }
.vibe-project-card-top i { width: 6px; height: 6px; border-radius: 50%; background: rgba(215, 236, 233, .3); }
.vibe-project-card-top i[data-status="active"] { background: var(--vibe-mint); box-shadow: 0 0 10px var(--vibe-mint); }
.vibe-project-card-top i[data-status="archived"] { background: var(--vibe-amber); }
.vibe-project-card-top small { color: rgba(206, 232, 228, .31); font: 500 7px/1 var(--vibe-mono); }
.vibe-project-card strong { overflow: hidden; margin-top: 7px; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.vibe-project-card p { display: -webkit-box; overflow: hidden; margin: 4px 0 7px; color: rgba(201, 227, 223, .37); font-size: 8px; line-height: 1.45; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.vibe-project-card-meta { color: rgba(197, 222, 218, .25); font: 500 7px/1.3 var(--vibe-mono); }
.vibe-project-inspector { margin-top: 20px; padding-top: 18px; box-shadow: inset 0 1px rgba(215, 255, 247, .06); }
.vibe-project-inspector[hidden] { display: none; }
.vibe-project-inspector > small { color: var(--vibe-mint); font: 500 7px/1 var(--vibe-mono); letter-spacing: .14em; }
.vibe-project-inspector label { display: grid; gap: 5px; margin-top: 12px; color: rgba(211, 237, 233, .4); font-size: 8px; }
.vibe-project-inspector input, .vibe-project-inspector select { width: 100%; border: 0; border-radius: 11px; padding: 8px 10px; color: rgba(239, 255, 252, .82); background: rgba(2, 9, 14, .55); box-shadow: inset 0 0 0 1px rgba(213, 255, 247, .06); outline: none; font: 9px/1.3 var(--vibe-font); }
.vibe-project-facts { display: grid; grid-template-columns: 1fr 1fr; margin-top: 13px; }
.vibe-project-facts span { display: grid; gap: 2px; color: rgba(203, 229, 225, .3); font-size: 7px; }
.vibe-project-facts b { color: rgba(233, 251, 248, .74); font: 600 11px/1.2 var(--vibe-mono); }
.vibe-inspector-actions { display: flex; gap: 6px; margin-top: 13px; }
.vibe-inspector-actions button { display: flex; align-items: center; justify-content: center; gap: 5px; flex: 1; border: 0; border-radius: 999px; padding: 8px; color: rgba(231, 251, 247, .66); background: rgba(255, 255, 255, .05); font-size: 8px; cursor: pointer; }
.vibe-inspector-actions svg { width: 13px; }
.vibe-inspector-actions button:last-child { color: rgba(255, 190, 179, .7); }
.vibe-safety-note { display: flex; gap: 10px; margin-top: 22px; padding: 14px 0; box-shadow: inset 0 1px rgba(214, 255, 247, .055); }
.vibe-safety-note > i { flex: none; width: 6px; height: 6px; margin-top: 4px; border-radius: 50%; background: var(--vibe-amber); box-shadow: 0 0 10px rgba(255, 200, 120, .48); }
.vibe-safety-note strong { color: rgba(231, 249, 246, .58); font: 600 8px/1 var(--vibe-mono); letter-spacing: .05em; }
.vibe-safety-note p { margin: 5px 0 0; color: rgba(203, 227, 223, .32); font-size: 8px; line-height: 1.55; }
.vibe-toast { position: fixed; z-index: 5; left: 50%; bottom: max(24px, env(safe-area-inset-bottom)); max-width: min(540px, calc(100vw - 40px)); padding: 11px 16px; border-radius: 999px; color: #eafff9; background: rgba(7, 30, 31, .88); box-shadow: inset 0 1px rgba(255, 255, 255, .15), 0 18px 60px rgba(0, 0, 0, .45); opacity: 0; transform: translate(-50%, 20px); pointer-events: none; transition: opacity .3s, transform .3s; -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); font-size: 10px; text-align: center; }
.vibe-toast.is-visible { opacity: 1; transform: translate(-50%, 0); }
.vibe-mobile-nav { display: none; }

@keyframes vibe-drift { to { transform: translate(12vw, 9vw) scale(1.18); opacity: .16; } }
@keyframes vibe-scan { 0% { transform: translateX(-100%); } 45%, 100% { transform: translateX(100%); } }
@keyframes vibe-orbit { to { rotate: 360deg; } }
@keyframes vibe-morph { to { border-radius: 64% 36% 42% 58%; transform: scale(1.08); } }
@keyframes vibe-step { 0%, 100% { color: rgba(219, 242, 238, .3); background: rgba(255, 255, 255, .035); } 35% { color: #eafff9; background: hsl(var(--vibe-hue) 62% 36% / .25); } }
@keyframes vibe-pulse { to { transform: scale(1.6); opacity: .45; } }
@keyframes vibe-ring { 0%, 100% { opacity: 0; transform: scale(.97); } 35% { opacity: 1; } 70% { opacity: 0; transform: scale(1.07); } }

@media (max-width: 1180px) and (min-width: 861px) {
  .vibe-layout { grid-template-columns: 270px minmax(420px, 1fr) 230px; }
  .vibe-brief-rail, .vibe-library-rail { padding: 22px 18px; }
  .vibe-template { padding-inline: 5px; }
  .vibe-stage-head p { max-width: 430px; }
}

@media (max-width: 860px) {
  .orbita-vibe-launcher { left: 14px; bottom: max(14px, env(safe-area-inset-bottom)); min-width: 0; padding-right: 11px; }
  .orbita-vibe-launcher > span:nth-child(2) { display: none; }
  .orbita-vibe-studio { grid-template-rows: 62px 42px 1fr; }
  .vibe-topbar { padding: 0 12px; gap: 10px; }
  .vibe-identity { min-width: 0; flex: 1; }
  .vibe-identity small, .vibe-runtime-pill b { display: none; }
  .vibe-runtime-pill { margin-left: 0; padding: 7px 9px; }
  .vibe-runtime-pill span { max-width: 92px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .vibe-window-actions button { width: 32px; height: 32px; }
  .vibe-window-actions button[data-vibe-minimize], .vibe-window-actions button[data-vibe-expand] { display: none; }
  .vibe-mobile-nav { display: grid; grid-template-columns: repeat(3, 1fr); padding: 4px 12px; background: rgba(3, 12, 17, .58); box-shadow: inset 0 -1px rgba(213, 255, 247, .05); }
  .vibe-mobile-nav button { border: 0; border-radius: 999px; color: rgba(211, 238, 233, .38); background: transparent; font: 500 9px/1 var(--vibe-font); }
  .vibe-mobile-nav button.is-active { color: #effffc; background: rgba(112, 226, 208, .1); }
  .vibe-layout { display: block; min-height: 0; overflow: hidden; }
  .vibe-brief-rail, .vibe-library-rail, .vibe-stage { display: none; height: 100%; }
  .orbita-vibe-studio[data-mobile-view="brief"] .vibe-brief-rail,
  .orbita-vibe-studio[data-mobile-view="stage"] .vibe-stage,
  .orbita-vibe-studio[data-mobile-view="library"] .vibe-library-rail { display: grid; }
  .vibe-brief-rail, .vibe-library-rail { overflow: auto; padding: 22px max(18px, env(safe-area-inset-left)) calc(30px + env(safe-area-inset-bottom)); }
  .vibe-brief-rail { display: block !important; }
  .orbita-vibe-studio:not([data-mobile-view="brief"]) .vibe-brief-rail { display: none !important; }
  .vibe-library-rail { display: block !important; }
  .orbita-vibe-studio:not([data-mobile-view="library"]) .vibe-library-rail { display: none !important; }
  .vibe-stage { grid-template-rows: auto 1fr auto; padding: 12px 10px max(7px, env(safe-area-inset-bottom)); }
  .vibe-stage-head { min-height: 68px; padding: 0 2px 10px; }
  .vibe-stage-head h2 { max-width: 52vw; font-size: 20px; }
  .vibe-stage-head p, .vibe-viewport-switch { display: none; }
  .vibe-execution-field { border-radius: 19px; }
  .vibe-execution-field iframe { min-height: 0; border-radius: 19px; }
  .vibe-execution-field[data-viewport="tablet"] iframe, .vibe-execution-field[data-viewport="mobile"] iframe { width: 100%; border-radius: 19px; }
  .vibe-stage-foot { grid-template-columns: auto 1fr; }
  .vibe-stage-foot > button { display: none; }
  .vibe-empty-state { width: 88%; }
  .vibe-empty-orbit { width: 94px; height: 94px; }
  .vibe-template-list { grid-template-columns: 1fr 1fr; }
  .vibe-template { grid-template-columns: 32px 1fr; }
  .vibe-compose textarea { min-height: 150px; }
}

@media (max-width: 520px) {
  .vibe-symbol { width: 34px; height: 34px; border-radius: 12px; }
  .vibe-identity strong { font-size: 12px; }
  .vibe-runtime-pill { display: none; }
  .vibe-template-list { grid-template-columns: 1fr; }
  .vibe-stage-head h2 { max-width: 56vw; }
  .vibe-stage-tools > button[data-vibe-download] { display: none; }
  .vibe-empty-state p { font-size: 10px; }
}

@media (prefers-reduced-motion: reduce) {
  .orbita-vibe-studio *, .orbita-vibe-launcher * { animation-duration: .001ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; }
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .orbita-vibe-studio { background: #020b10; }
  .orbita-vibe-launcher, .vibe-topbar, .vibe-build-state { background: rgba(4, 17, 22, .96); }
}