    :root {
      color-scheme: dark;
      --bg: #050505;
      --bg-raised: #090909;
      --surface: #111111;
      --surface-2: #151515;
      --surface-3: #1b1b1b;
      --text: #f2f0ea;
      --text-strong: #fffdf6;
      --muted: #8f908b;
      --muted-2: #62635f;
      --line: rgba(255, 255, 255, 0.14);
      --line-strong: rgba(255, 255, 255, 0.28);
      --accent: #ff3b1f;
      --accent-2: #ff6a4f;
      --accent-dark: #3a100b;
      --font: "SF Pro Display", "SF Pro Text", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
      --mono: "IBM Plex Mono", "JetBrains Mono", "SF Mono", "Cascadia Code", ui-monospace, Consolas, monospace;
      --ease: cubic-bezier(0.16, 1, 0.3, 1);
      --ease-mech: cubic-bezier(0.2, 0.82, 0.16, 1);
      --page-pad: 28px;
    }

    * {
      box-sizing: border-box;
    }

    html {
      min-height: 100%;
      background: var(--bg);
      scroll-behavior: smooth;
    }

    body {
      position: relative;
      min-height: 100dvh;
      margin: 0;
      overflow-x: hidden;
      color: var(--text);
      background:
        radial-gradient(circle at 72% 36%, rgba(255, 59, 31, 0.1), transparent 28%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.025), transparent 210px),
        var(--bg);
      font-family: var(--font);
      font-weight: 400;
      letter-spacing: -0.01em;
      text-rendering: geometricPrecision;
    }

    body.drawer-open {
      overflow: hidden;
    }

    body::before,
    body::after {
      content: "";
      position: fixed;
      inset: 0;
      pointer-events: none;
    }

    body::before {
      z-index: 0;
      background:
        linear-gradient(rgba(255, 255, 255, 0.055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.042) 1px, transparent 1px);
      background-size: 80px 80px;
      mask-image: radial-gradient(circle at 66% 38%, black 0 38%, transparent 76%);
      opacity: 0.55;
    }

    body::after {
      z-index: 50;
      opacity: 0.045;
      background-image:
        linear-gradient(90deg, rgba(255, 255, 255, 0.24) 1px, transparent 1px),
        linear-gradient(rgba(255, 255, 255, 0.2) 1px, transparent 1px);
      background-size: 3px 3px, 17px 17px;
      mix-blend-mode: screen;
    }

    button,
    textarea {
      font: inherit;
    }

    button {
      color: inherit;
      cursor: pointer;
    }

    button:focus-visible,
    textarea:focus-visible,
    summary:focus-visible {
      outline: 2px solid var(--accent);
      outline-offset: 3px;
    }

    .skip-link {
      position: fixed;
      left: 16px;
      top: 12px;
      z-index: 80;
      transform: translateY(-140%);
      border: 1px solid var(--line-strong);
      padding: 10px 12px;
      color: var(--text);
      background: #080808;
      text-decoration: none;
      transition: transform 260ms var(--ease);
    }

    .skip-link:focus {
      transform: translateY(0);
    }

    .page {
      position: relative;
      z-index: 10;
      min-height: 100dvh;
      padding: var(--page-pad);
    }

    .industrial-frame {
      position: relative;
      min-height: calc(100dvh - var(--page-pad) * 2);
      border: 1px solid var(--line);
      background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.035) 1px, transparent 1px),
        linear-gradient(rgba(255, 255, 255, 0.026) 1px, transparent 1px),
        rgba(9, 9, 9, 0.82);
      background-size: 160px 100%, 100% 92px, auto;
      overflow: hidden;
    }

    .industrial-frame::before,
    .industrial-frame::after {
      content: "";
      position: absolute;
      z-index: 1;
      pointer-events: none;
      background: var(--accent);
    }

    .industrial-frame::before {
      left: 0;
      top: 0;
      width: 112px;
      height: 4px;
      opacity: 0.58;
    }

    .industrial-frame::after {
      right: 0;
      bottom: 0;
      width: 4px;
      height: 112px;
      opacity: 0.58;
    }

    .top-rail {
      position: relative;
      z-index: 20;
      display: grid;
      grid-template-columns: minmax(260px, 1fr) auto minmax(260px, 1fr);
      align-items: stretch;
      min-height: 64px;
      border-bottom: 1px solid var(--line);
      background: rgba(8, 8, 8, 0.86);
    }

    .brand-block,
    .rail-center,
    .rail-actions {
      display: flex;
      align-items: center;
    }

    .brand-block {
      min-width: 0;
      border-right: 1px solid var(--line);
    }

    .mark-button,
    .new-button,
    .context-button,
    .close-button,
    .send-button,
    .suggestion-chip,
    .drawer-link,
    .drawer-session,
    .inline-context-button {
      border: 0;
      appearance: none;
      background: transparent;
    }

    .menu-button,
    .mark-button,
    .new-button {
      position: relative;
      display: grid;
      place-items: center;
      width: 64px;
      height: 64px;
      border: 0;
      border-right: 1px solid var(--line);
      background: transparent;
      appearance: none;
      transition: background 260ms var(--ease), color 260ms var(--ease);
    }

    .menu-button span {
      position: absolute;
      left: 21px;
      right: 21px;
      height: 1px;
      background: currentColor;
      transition: transform 360ms var(--ease), opacity 360ms var(--ease);
    }

    .menu-button span:nth-child(1) {
      top: 25px;
    }

    .menu-button span:nth-child(2) {
      top: 32px;
    }

    .menu-button span:nth-child(3) {
      top: 39px;
    }

    .menu-button.is-open span:nth-child(1) {
      transform: translateY(7px) rotate(45deg);
    }

    .menu-button.is-open span:nth-child(2) {
      opacity: 0;
    }

    .menu-button.is-open span:nth-child(3) {
      transform: translateY(-7px) rotate(-45deg);
    }

    .mark-button {
      color: var(--accent);
      font-family: var(--mono);
      font-size: 13px;
      font-weight: 760;
    }

    .new-button::before,
    .new-button::after {
      content: "";
      position: absolute;
      background: var(--text);
    }

    .new-button::before {
      width: 16px;
      height: 1px;
    }

    .new-button::after {
      width: 1px;
      height: 16px;
    }

    .menu-button:hover,
    .mark-button:hover,
    .new-button:hover {
      color: var(--accent);
      background: rgba(255, 59, 31, 0.08);
    }

    .brand-copy {
      min-width: 0;
      padding: 0 18px;
    }

    .brand-name {
      display: block;
      overflow: hidden;
      margin: 0;
      color: var(--text-strong);
      font-size: 15px;
      font-weight: 620;
      letter-spacing: -0.018em;
      text-overflow: ellipsis;
      white-space: nowrap;
      text-transform: none;
    }

    .brand-sub {
      display: block;
      margin-top: 4px;
      color: var(--muted);
      font-family: var(--font);
      font-size: 11px;
      letter-spacing: -0.006em;
      text-transform: none;
    }

    .rail-center {
      gap: 0;
      justify-content: center;
      border-right: 1px solid var(--line);
      color: var(--muted);
    }

    .rail-item {
      min-height: 64px;
      padding: 16px 18px 12px;
      border-right: 1px solid var(--line);
      font-family: var(--mono);
      font-size: 11px;
      line-height: 1.35;
      text-transform: uppercase;
      white-space: nowrap;
    }

    .rail-item:last-child {
      border-right: 0;
    }

    .rail-item strong {
      display: block;
      margin-bottom: 3px;
      color: var(--text);
      font-family: var(--font);
      font-size: 12px;
      font-weight: 560;
      text-transform: none;
    }

    .rail-actions {
      justify-content: flex-end;
    }

    .context-button {
      min-height: 64px;
      padding: 0 22px;
      border-left: 1px solid var(--line);
      color: var(--text);
      font-family: var(--mono);
      font-size: 12px;
      text-transform: uppercase;
      transition: background 260ms var(--ease), color 260ms var(--ease);
    }

    .context-button:hover,
    .context-button[aria-expanded="true"] {
      color: #050505;
      background: var(--accent);
    }

    .hero-grid {
      position: relative;
      z-index: 5;
      display: grid;
      grid-template-columns: repeat(12, minmax(0, 1fr));
      grid-template-rows: minmax(620px, 1fr) auto auto auto;
      min-height: calc(100dvh - 94px);
      gap: 0;
    }

    .hero-copy {
      grid-column: 1 / span 5;
      grid-row: 1 / span 1;
      align-self: start;
      padding: 62px 34px 38px 46px;
    }

    .system-label {
      display: inline-flex;
      align-items: center;
      min-height: 30px;
      margin-bottom: 26px;
      border-left: 4px solid var(--accent);
      padding-left: 12px;
      color: var(--muted);
      font-family: var(--font);
      font-size: 13px;
      font-weight: 500;
      text-transform: none;
    }

    .hero-title {
      margin: 0;
      color: var(--text-strong);
      font-size: 58px;
      font-weight: 540;
      line-height: 1.02;
      letter-spacing: -0.045em;
      text-transform: none;
      text-wrap: balance;
    }

    .hero-title span {
      display: block;
    }

    .hero-title-secondary {
      margin-top: 2px;
      color: #d6d2c8;
      font-size: 0.82em;
      font-weight: 430;
    }

    .hero-subtitle {
      max-width: 420px;
      margin: 20px 0 0;
      color: #c7c5bd;
      font-size: 17px;
      line-height: 1.48;
    }

    .section-index {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      max-width: 410px;
      margin-top: 26px;
      border: 1px solid var(--line);
      background: rgba(255, 255, 255, 0.02);
    }

    .index-cell {
      min-height: 58px;
      padding: 13px 12px;
      border-right: 1px solid var(--line);
      color: var(--muted);
      font-family: var(--mono);
      font-size: 11px;
      line-height: 1.35;
      text-transform: uppercase;
    }

    .index-cell:last-child {
      border-right: 0;
    }

    .index-cell strong {
      display: block;
      color: var(--text);
      font-family: var(--font);
      font-size: 13px;
      font-weight: 620;
      text-transform: none;
    }

    .geometry-stage {
      position: relative;
      grid-column: 6 / span 7;
      grid-row: 1 / span 1;
      min-height: 640px;
      border-left: 1px solid var(--line);
      overflow: hidden;
      background:
        radial-gradient(circle at 56% 50%, rgba(255, 59, 31, 0.13), transparent 34%),
        linear-gradient(135deg, rgba(255, 59, 31, 0.07), transparent 28%),
        radial-gradient(circle at 44% 44%, rgba(255, 255, 255, 0.08), transparent 32%),
        rgba(14, 14, 14, 0.44);
      cursor: crosshair;
      touch-action: none;
    }

    .industrial-geometry-hero {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      opacity: 1;
      pointer-events: none;
      z-index: 2;
    }

    .industrial-robot-poster {
      position: absolute;
      left: 50%;
      top: 45%;
      z-index: 1;
      width: min(820px, 66vw);
      aspect-ratio: 1.58;
      transform: translate3d(-50%, -50%, 0);
      transform-origin: 50% 50%;
      pointer-events: none;
      opacity: 0;
      filter: saturate(1.08) contrast(1.06);
      transition: opacity 220ms var(--ease-mech);
    }

    .geometry-stage.show-robot-poster .industrial-robot-poster {
      opacity: 0.92;
    }

    .poster-board,
    .poster-rail,
    .poster-post,
    .poster-bot {
      position: absolute;
      transform-style: preserve-3d;
    }

    .poster-board {
      left: 10%;
      right: 8%;
      top: 28%;
      height: 50%;
      border: 1px solid rgba(210, 222, 238, 0.14);
      border-radius: 4px;
      background:
        linear-gradient(90deg, rgba(222, 230, 245, 0.12) 1px, transparent 1px),
        linear-gradient(rgba(222, 230, 245, 0.1) 1px, transparent 1px),
        linear-gradient(135deg, rgba(24, 32, 43, 0.9), rgba(7, 9, 12, 0.98));
      background-size: 54px 54px, 54px 54px, auto;
      box-shadow:
        0 46px 72px rgba(0, 0, 0, 0.44),
        inset 0 0 34px rgba(170, 194, 230, 0.08);
      transform: skewY(17deg) rotateX(54deg) rotateZ(-25deg);
    }

    .poster-board::before {
      content: "";
      position: absolute;
      inset: 13% 16%;
      border: 2px solid rgba(219, 230, 246, 0.14);
      border-radius: 3px;
      box-shadow:
        78px 28px 0 -20px rgba(219, 230, 246, 0.16),
        -84px 46px 0 -22px rgba(219, 230, 246, 0.13);
    }

    .poster-rail {
      left: 9%;
      width: 86%;
      height: 18px;
      border-radius: 3px;
      background: linear-gradient(90deg, #03070d, #101a2a 40%, #04070d);
      box-shadow: 0 12px 22px rgba(0, 0, 0, 0.55);
      transform: skewY(17deg) rotateZ(22deg);
    }

    .poster-rail-back {
      top: 20%;
    }

    .poster-rail-front {
      top: 62%;
    }

    .poster-post {
      width: 72px;
      height: 230px;
      border-radius: 2px;
      background: linear-gradient(90deg, #030406, #070a0e 70%, #131923);
      box-shadow: 0 18px 36px rgba(0, 0, 0, 0.5);
    }

    .poster-post-left {
      left: 8%;
      top: 16%;
    }

    .poster-post-right {
      right: 7%;
      top: 51%;
      height: 88px;
    }

    .poster-bot {
      left: 47%;
      top: 42%;
      width: 118px;
      height: 92px;
      border-radius: 24px;
      background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.42), transparent 30%),
        linear-gradient(135deg, #e2dccd, #b8ad9e);
      box-shadow:
        26px 18px 0 rgba(90, 66, 51, 0.72),
        0 24px 42px rgba(0, 0, 0, 0.45);
      transform: translate3d(-50%, -50%, 0) skewY(6deg);
    }

    .poster-bot::after {
      content: "";
      position: absolute;
      right: -38px;
      top: 38px;
      width: 38px;
      height: 28px;
      border-radius: 5px;
      background: #080a0d;
      box-shadow: 8px 4px 0 rgba(70, 70, 72, 0.55);
    }

    .poster-bot-face {
      position: absolute;
      left: 15px;
      top: 20px;
      width: 82px;
      height: 52px;
      border-radius: 12px;
      background: linear-gradient(145deg, #030607, #101416);
      box-shadow:
        inset 0 0 0 3px rgba(255, 255, 255, 0.08),
        inset 0 0 20px rgba(93, 255, 216, 0.08);
    }

    .poster-bot-face span {
      position: absolute;
      top: 24px;
      width: 24px;
      height: 6px;
      border-radius: 6px;
      background: #9fffe7;
      box-shadow: 0 0 12px rgba(159, 255, 231, 0.42);
    }

    .poster-bot-face span:first-child {
      left: 18px;
      transform: rotate(24deg);
    }

    .poster-bot-face span:last-child {
      right: 14px;
      transform: rotate(-12deg);
    }

    .stage-overlay {
      position: absolute;
      inset: 0;
      z-index: 3;
      pointer-events: none;
      background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.08) 1px, transparent 1px),
        linear-gradient(rgba(255, 255, 255, 0.055) 1px, transparent 1px);
      background-size: 96px 96px;
      mask-image: radial-gradient(circle at 52% 48%, black, transparent 72%);
      opacity: 0.2;
    }

    .stage-metadata {
      position: absolute;
      top: 22px;
      right: 22px;
      display: grid;
      grid-template-columns: auto auto;
      gap: 1px;
      border: 1px solid var(--line);
      background: var(--line);
      font-family: var(--mono);
      font-size: 11px;
      text-transform: uppercase;
    }

    .stage-metadata span {
      min-width: 116px;
      padding: 10px 11px;
      color: var(--muted);
      background: rgba(9, 9, 9, 0.8);
    }

    .stage-metadata strong {
      display: block;
      color: var(--text);
      font-family: var(--mono);
      font-weight: 640;
    }

    .command-zone {
      grid-column: 2 / span 9;
      grid-row: 1 / span 1;
      align-self: end;
      position: relative;
      isolation: isolate;
      z-index: 16;
      width: min(100%, 980px);
      margin: 0 0 38px;
    }

    .command-zone::before,
    .command-zone::after {
      content: "";
      position: absolute;
      z-index: -1;
      pointer-events: none;
    }

    .command-zone::before {
      left: -16%;
      right: -16%;
      top: 24%;
      height: 66%;
      border-radius: 999px;
      background:
        radial-gradient(ellipse at 50% 56%, rgba(255, 59, 31, 0.26), rgba(255, 96, 61, 0.08) 36%, transparent 72%),
        linear-gradient(90deg, transparent, rgba(255, 235, 224, 0.13) 20%, rgba(255, 59, 31, 0.18) 50%, rgba(255, 235, 224, 0.13) 80%, transparent);
      filter: blur(24px);
      opacity: 0.78;
      transform: translate3d(0, 18px, 0);
    }

    .command-zone::after {
      left: -11%;
      right: -11%;
      top: 50%;
      height: 2px;
      background: linear-gradient(90deg, transparent, rgba(255, 238, 226, 0.56), rgba(255, 59, 31, 0.32), rgba(255, 238, 226, 0.56), transparent);
      box-shadow:
        0 0 22px rgba(255, 106, 79, 0.3),
        0 0 74px rgba(255, 59, 31, 0.16);
      opacity: 0.44;
    }

    .command-module {
      position: relative;
      min-height: 264px;
      border: 1px solid rgba(255, 255, 255, 0.2);
      border-radius: 26px;
      background:
        radial-gradient(circle at 88% 0%, rgba(255, 255, 255, 0.12), transparent 30%),
        radial-gradient(circle at 8% 18%, rgba(255, 59, 31, 0.12), transparent 34%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.11), rgba(255, 255, 255, 0.035) 42%, rgba(36, 18, 14, 0.22)),
        rgba(11, 11, 11, 0.82);
      -webkit-backdrop-filter: blur(22px) saturate(135%);
      backdrop-filter: blur(22px) saturate(135%);
      box-shadow:
        0 34px 130px rgba(0, 0, 0, 0.66),
        0 0 62px rgba(255, 59, 31, 0.13),
        inset 0 1px 0 rgba(255, 255, 255, 0.2),
        inset 0 -1px 0 rgba(255, 255, 255, 0.08);
      overflow: hidden;
    }

    .command-module:focus-within {
      border-color: rgba(255, 106, 79, 0.42);
      box-shadow:
        0 34px 130px rgba(0, 0, 0, 0.68),
        0 0 80px rgba(255, 59, 31, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.22),
        inset 0 -1px 0 rgba(255, 255, 255, 0.08);
    }

    .command-module::before {
      content: "";
      position: absolute;
      left: 0;
      top: 0;
      width: 100%;
      height: 1px;
      background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.58), rgba(255, 106, 79, 0.32), transparent);
    }

    .command-module::after {
      content: "";
      position: absolute;
      inset: 0;
      pointer-events: none;
      border-radius: inherit;
      background:
        radial-gradient(circle at 12% 0%, rgba(255, 255, 255, 0.18), transparent 22%),
        radial-gradient(circle at 92% 100%, rgba(255, 59, 31, 0.12), transparent 26%);
      opacity: 0.66;
    }

    .command-head {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      border-bottom: 1px solid rgba(255, 255, 255, 0.11);
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.02));
    }

    .command-head span {
      min-height: 58px;
      padding: 17px 20px;
      color: rgba(242, 240, 234, 0.66);
      font-size: 12.5px;
      line-height: 1.35;
      text-transform: none;
    }

    .deck-label {
      color: var(--text) !important;
      font-size: 13px !important;
      font-weight: 650;
      letter-spacing: -0.012em;
    }

    .deck-context {
      border-left: 1px solid rgba(255, 255, 255, 0.1);
      color: rgba(242, 240, 234, 0.66) !important;
      white-space: nowrap;
    }

    .command-body {
      position: relative;
      display: grid;
      grid-template-columns: minmax(0, 1fr) 168px;
      gap: 0;
      align-items: stretch;
      min-height: 206px;
    }

    .command-body::before {
      content: "";
      position: absolute;
      left: 18px;
      right: 188px;
      bottom: 18px;
      height: 1px;
      background: linear-gradient(90deg, rgba(255, 255, 255, 0.04), rgba(255, 106, 79, 0.34), rgba(255, 255, 255, 0.04));
      opacity: 0.46;
      pointer-events: none;
    }

    .command-input {
      display: block;
      width: 100%;
      min-height: 206px;
      max-height: 320px;
      border: 0;
      margin: 0;
      padding: 34px 34px 42px 34px;
      resize: none;
      outline: 0;
      color: var(--text-strong);
      background: transparent;
      font-size: 20px;
      font-weight: 430;
      line-height: 1.46;
    }

    .command-input::placeholder {
      color: rgba(242, 240, 234, 0.43);
    }

    .command-actions {
      display: grid;
      grid-template-rows: 1fr auto;
      min-width: 168px;
      border-left: 1px solid rgba(255, 255, 255, 0.1);
    }

    .attach-button {
      border: 0;
      border-bottom: 1px solid rgba(255, 255, 255, 0.1);
      color: var(--muted);
      background: transparent;
      font-size: 12.5px;
      font-weight: 500;
      text-transform: none;
      white-space: nowrap;
      transition: color 240ms var(--ease), background 240ms var(--ease);
    }

    .attach-button:hover {
      color: var(--text);
      background: rgba(255, 255, 255, 0.04);
    }

    .send-button {
      position: relative;
      min-height: 92px;
      padding: 0 22px;
      color: #080808;
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.28), transparent 34%),
        var(--accent);
      font-size: 14px;
      font-weight: 720;
      text-transform: none;
      white-space: nowrap;
      box-shadow:
        inset 0 2px 0 rgba(255, 255, 255, 0.34),
        inset 0 -5px 0 rgba(0, 0, 0, 0.32),
        0 0 28px rgba(255, 59, 31, 0.18),
        -1px 0 0 rgba(255, 255, 255, 0.16);
      transition: transform 220ms var(--ease), filter 220ms var(--ease), box-shadow 220ms var(--ease);
    }

    .send-button:hover {
      filter: brightness(1.05);
      box-shadow:
        inset 0 2px 0 rgba(255, 255, 255, 0.42),
        inset 0 -5px 0 rgba(0, 0, 0, 0.3),
        0 0 36px rgba(255, 59, 31, 0.26);
    }

    .send-button:active {
      transform: translateY(1px);
    }

    .suggestions {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      padding: 12px 8px 0;
      border: 0;
      background: transparent;
    }

    .suggestion-chip {
      min-height: 36px;
      border: 1px solid rgba(255, 255, 255, 0.14);
      border-radius: 999px;
      padding: 0 15px;
      color: rgba(242, 240, 234, 0.72);
      background: rgba(8, 8, 8, 0.68);
      -webkit-backdrop-filter: blur(14px);
      backdrop-filter: blur(14px);
      font-size: 12px;
      font-weight: 500;
      text-transform: none;
      transition: color 240ms var(--ease), border-color 240ms var(--ease), background 240ms var(--ease), transform 240ms var(--ease);
    }

    .suggestion-chip:hover {
      color: var(--text);
      border-color: rgba(255, 106, 79, 0.42);
      background: rgba(255, 59, 31, 0.12);
    }

    .suggestion-chip:active {
      transform: translateY(1px);
    }

    .module-strip {
      grid-column: 1 / span 12;
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 1px;
      margin-top: 48px;
      border-top: 1px solid var(--line);
      background: var(--line);
    }

    .capability-module {
      min-height: 112px;
      padding: 16px 20px;
      background: rgba(12, 12, 12, 0.94);
    }

    .module-code {
      display: block;
      margin-bottom: 14px;
      color: var(--accent);
      font-family: var(--mono);
      font-size: 11px;
      text-transform: uppercase;
    }

    .capability-module h3 {
      margin: 0;
      color: var(--text);
      font-size: 16px;
      font-weight: 780;
      text-transform: uppercase;
      letter-spacing: 0;
    }

    .capability-module p {
      max-width: 35ch;
      margin: 10px 0 0;
      color: var(--muted);
      font-size: 13px;
      line-height: 1.45;
    }

    .module-meta {
      display: block;
      margin-top: 12px;
      color: #c4c1b8;
      font-family: var(--mono);
      font-size: 11px;
      text-transform: uppercase;
    }

    .drawer-backdrop {
      position: fixed;
      inset: 0;
      z-index: 40;
      pointer-events: none;
      background: rgba(0, 0, 0, 0.52);
      opacity: 0;
      transition: opacity 360ms var(--ease);
    }

    .drawer-backdrop.is-visible {
      pointer-events: auto;
      opacity: 1;
    }

    .drawer {
      position: fixed;
      top: 28px;
      bottom: 28px;
      z-index: 60;
      display: flex;
      width: min(440px, calc(100vw - 56px));
      flex-direction: column;
      overflow: hidden;
      border: 1px solid var(--line-strong);
      background: #0b0b0b;
      opacity: 0;
      transition: transform 460ms var(--ease), opacity 460ms var(--ease);
    }

    .drawer-left {
      left: 28px;
      transform: translateX(calc(-100% - 32px));
    }

    .drawer-right {
      right: 28px;
      transform: translateX(calc(100% + 32px));
    }

    .drawer.is-open {
      transform: translateX(0);
      opacity: 1;
    }

    .drawer-header {
      display: grid;
      grid-template-columns: minmax(0, 1fr) 56px;
      border-bottom: 1px solid var(--line);
    }

    .drawer-title-group {
      padding: 18px;
    }

    .drawer-kicker {
      margin: 0 0 8px;
      color: var(--accent);
      font-family: var(--mono);
      font-size: 11px;
      text-transform: uppercase;
    }

    .drawer-title {
      margin: 0;
      color: var(--text);
      font-size: 22px;
      font-weight: 860;
      text-transform: uppercase;
    }

    .drawer-subtitle {
      margin: 9px 0 0;
      color: var(--muted);
      font-size: 14px;
      line-height: 1.5;
    }

    .close-button {
      position: relative;
      border-left: 1px solid var(--line);
    }

    .close-button::before,
    .close-button::after {
      content: "";
      position: absolute;
      left: 18px;
      right: 18px;
      top: 28px;
      height: 1px;
      background: var(--text);
    }

    .close-button::before {
      transform: rotate(45deg);
    }

    .close-button::after {
      transform: rotate(-45deg);
    }

    .drawer-scroll {
      min-height: 0;
      overflow-y: auto;
    }

    .drawer-section {
      padding: 18px;
      border-bottom: 1px solid var(--line);
    }

    .drawer-section:last-child {
      border-bottom: 0;
    }

    .section-title {
      margin: 0 0 12px;
      color: var(--text);
      font-size: 13px;
      font-weight: 780;
      text-transform: uppercase;
    }

    .drawer-list {
      display: grid;
      gap: 8px;
    }

    .drawer-link,
    .drawer-session,
    .material-row,
    .tool-row,
    .privacy-row {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 14px;
      align-items: center;
      min-height: 42px;
      border: 1px solid var(--line);
      padding: 10px;
      color: #d8d5cc;
      background: rgba(255, 255, 255, 0.025);
      text-align: left;
      transition: border-color 240ms var(--ease), background 240ms var(--ease), color 240ms var(--ease);
    }

    .drawer-link:hover,
    .drawer-session:hover,
    .material-row:hover,
    .tool-row:hover {
      color: var(--text);
      border-color: var(--accent);
      background: rgba(255, 59, 31, 0.08);
    }

    .session-title {
      display: block;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .session-meta,
    .item-meta,
    .material-type,
    .tool-state {
      color: var(--muted);
      font-family: var(--mono);
      font-size: 11px;
      text-transform: uppercase;
    }

    .session-meta {
      margin-top: 3px;
    }

    .param-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 8px;
    }

    .param-card {
      min-height: 82px;
      border: 1px solid var(--line);
      padding: 12px;
      background: rgba(255, 255, 255, 0.025);
    }

    .param-label {
      color: var(--muted);
      font-size: 12px;
      text-transform: uppercase;
    }

    .param-value {
      margin-top: 9px;
      color: var(--text);
      font-family: var(--mono);
      font-size: 20px;
      font-variant-numeric: tabular-nums;
    }

    .unit {
      margin-left: 4px;
      color: var(--muted);
      font-size: 11px;
    }

    .privacy-row {
      grid-template-columns: 9px minmax(0, 1fr);
      justify-content: start;
    }

    .privacy-indicator {
      width: 8px;
      height: 8px;
      background: var(--accent);
    }

    @keyframes loaderScan {
      from {
        transform: scaleX(0.24);
        opacity: 0.5;
      }
      to {
        transform: scaleX(1);
        opacity: 1;
      }
    }

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

    @media (prefers-reduced-motion: reduce) {
      *,
      *::before,
      *::after {
        animation-duration: 1ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: 1ms !important;
      }
    }

    @media (max-width: 1120px) {
      :root {
        --page-pad: 18px;
      }

      .top-rail {
        grid-template-columns: minmax(0, 1fr) auto;
      }

      .rail-center {
        display: none;
      }

      .hero-copy {
        grid-column: 1 / span 5;
      }

      .geometry-stage {
        grid-column: 7 / span 6;
      }

      .hero-title {
        font-size: 52px;
      }

      .command-zone {
        grid-column: 1 / span 11;
      }

      .command-zone {
        margin-left: 22px;
      }
    }

    @media (max-width: 820px) {
      :root {
        --page-pad: 12px;
      }

      .industrial-frame {
        min-height: calc(100dvh - 24px);
      }

      .top-rail {
        grid-template-columns: 1fr auto;
        min-height: auto;
      }

      .brand-copy {
        padding: 0 12px;
      }

      .brand-name {
        font-size: 13px;
      }

      .context-button {
        min-height: 56px;
        padding: 0 14px;
      }

      .menu-button,
      .mark-button,
      .new-button {
        width: 56px;
        height: 56px;
      }

      .hero-grid {
        display: block;
        min-height: auto;
      }

      .hero-copy {
        padding: 42px 18px 24px;
      }

      .system-label {
        margin-bottom: 18px;
      }

      .hero-title {
        font-size: 39px;
        line-height: 1.04;
      }

      .hero-subtitle {
        font-size: 15px;
      }

      .section-index {
        grid-template-columns: 1fr;
      }

      .index-cell {
        border-right: 0;
        border-bottom: 1px solid var(--line);
      }

      .index-cell:last-child {
        border-bottom: 0;
      }

      .geometry-stage {
        min-height: 420px;
        border-left: 0;
        border-top: 1px solid var(--line);
      }

      .stage-metadata {
        left: 14px;
        right: 14px;
        top: 14px;
        grid-template-columns: 1fr 1fr;
      }

      .stage-metadata span {
        min-width: 0;
      }

      .command-zone {
        margin: -34px 12px 0;
        width: auto;
      }

      .command-head,
      .command-body {
        grid-template-columns: 1fr;
      }

      .deck-context,
      .command-actions {
        border-left: 0;
        border-top: 1px solid var(--line);
      }

      .deck-context {
        white-space: normal;
      }

      .command-actions {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: auto;
        min-width: 0;
      }

      .attach-button {
        min-height: 56px;
        border-bottom: 0;
        border-right: 1px solid var(--line);
      }

      .command-input {
        min-height: 150px;
        padding: 20px 18px;
        font-size: 17px;
      }

      .command-body::before {
        right: 18px;
        bottom: 14px;
      }

      .send-button {
        min-height: 64px;
      }

      .suggestions {
        margin: 0;
      }

      .module-strip {
        grid-template-columns: 1fr;
        margin-top: 28px;
      }

      .drawer {
        top: 12px;
        bottom: 12px;
        width: calc(100vw - 24px);
      }

      .drawer-left {
        left: 12px;
      }

      .drawer-right {
        right: 12px;
      }
    }

    .app-shell {
      display: grid;
      grid-template-columns: 224px minmax(0, 1fr);
      min-height: calc(100dvh - var(--page-pad) * 2);
      border-radius: 28px;
      background:
        radial-gradient(circle at 58% 18%, rgba(255, 59, 31, 0.12), transparent 28%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.035), transparent 34%),
        rgba(6, 6, 6, 0.92);
      box-shadow:
        0 38px 110px rgba(0, 0, 0, 0.62),
        inset 0 1px 0 rgba(255, 255, 255, 0.12);
    }

    .app-shell::before,
    .app-shell::after {
      display: none;
    }

    .app-sidebar {
      position: relative;
      z-index: 30;
      display: flex;
      min-width: 0;
      flex-direction: column;
      gap: 18px;
      border-right: 1px solid rgba(255, 255, 255, 0.11);
      padding: 14px;
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.035), transparent 42%),
        rgba(3, 3, 3, 0.9);
    }

    .sidebar-brand-row {
      display: grid;
      grid-template-columns: 38px 44px minmax(0, 1fr);
      gap: 8px;
      align-items: center;
      min-height: 42px;
    }

    .app-sidebar .menu-button,
    .app-sidebar .mark-button {
      width: 38px;
      height: 38px;
      border: 1px solid transparent;
      border-radius: 12px;
    }

    .app-sidebar .mark-button {
      width: 44px;
      font-size: 12px;
      background: rgba(255, 59, 31, 0.08);
    }

    .app-sidebar .menu-button span {
      left: 11px;
      right: 11px;
    }

    .app-sidebar .menu-button span:nth-child(1) {
      top: 14px;
    }

    .app-sidebar .menu-button span:nth-child(2) {
      top: 19px;
    }

    .app-sidebar .menu-button span:nth-child(3) {
      top: 24px;
    }

    .sidebar-copy {
      min-width: 0;
    }

    .sidebar-new {
      min-height: 38px;
      border: 1px solid rgba(255, 255, 255, 0.12);
      border-radius: 12px;
      color: var(--text);
      background: rgba(255, 255, 255, 0.06);
      font-size: 13px;
      font-weight: 560;
      text-align: left;
      padding: 0 12px;
      transition: background 240ms var(--ease), border-color 240ms var(--ease), transform 240ms var(--ease);
    }

    .sidebar-new:hover {
      border-color: rgba(255, 106, 79, 0.38);
      background: rgba(255, 59, 31, 0.1);
    }

    .side-group {
      display: grid;
      gap: 6px;
    }

    .side-label {
      margin: 0 0 4px;
      color: var(--muted);
      font-size: 11px;
      font-weight: 520;
    }

    .side-link {
      display: flex;
      align-items: center;
      justify-content: space-between;
      min-height: 32px;
      border: 0;
      border-radius: 10px;
      padding: 0 10px;
      color: #c8c4bb;
      background: transparent;
      font-size: 12.5px;
      text-align: left;
      transition: color 220ms var(--ease), background 220ms var(--ease);
    }

    .side-link:hover,
    .side-link.is-active {
      color: var(--text-strong);
      background: rgba(255, 255, 255, 0.07);
    }

    .side-link.is-active {
      box-shadow: inset 2px 0 0 var(--accent);
    }

    .sidebar-status {
      margin-top: auto;
      border: 1px solid rgba(255, 255, 255, 0.1);
      border-radius: 16px;
      padding: 14px;
      background:
        radial-gradient(circle at 80% 0%, rgba(255, 59, 31, 0.16), transparent 42%),
        rgba(255, 255, 255, 0.045);
    }

    .status-title {
      margin: 0;
      color: var(--text);
      font-size: 13px;
      font-weight: 620;
      letter-spacing: -0.01em;
    }

    .status-copy {
      margin: 8px 0 12px;
      color: var(--muted);
      font-size: 11.5px;
      line-height: 1.45;
    }

    .status-metrics {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 6px;
    }

    .status-metric {
      min-height: 46px;
      border-radius: 10px;
      padding: 8px;
      background: rgba(0, 0, 0, 0.34);
      color: var(--muted);
      font-size: 10px;
    }

    .status-metric strong {
      display: block;
      color: var(--text);
      font-family: var(--mono);
      font-size: 13px;
      font-variant-numeric: tabular-nums;
    }

    .app-workspace {
      position: relative;
      z-index: 5;
      min-width: 0;
      overflow: hidden;
      background:
        radial-gradient(circle at 50% 26%, rgba(255, 59, 31, 0.14), transparent 30%),
        radial-gradient(circle at 50% 56%, rgba(255, 255, 255, 0.045), transparent 36%),
        rgba(12, 12, 12, 0.62);
    }

    .workspace-rail {
      position: relative;
      z-index: 24;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      min-height: 60px;
      padding: 12px 18px;
    }

    .model-pills {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      min-width: 0;
    }

    .model-pill,
    .workspace-rail .context-button {
      min-height: 34px;
      border: 1px solid rgba(255, 255, 255, 0.12);
      border-radius: 999px;
      padding: 0 12px;
      color: #d8d5cc;
      background: rgba(0, 0, 0, 0.46);
      -webkit-backdrop-filter: blur(12px);
      backdrop-filter: blur(12px);
      font-family: var(--font);
      font-size: 12px;
      font-weight: 540;
      text-transform: none;
    }

    .model-pill.is-active {
      color: var(--text);
      border-color: rgba(255, 106, 79, 0.36);
      background: rgba(255, 59, 31, 0.12);
    }

    .workspace-rail .context-button:hover,
    .workspace-rail .context-button[aria-expanded="true"] {
      color: #080808;
      background: var(--accent);
    }

    .app-workspace .hero-grid {
      grid-template-rows: minmax(clamp(500px, calc(100dvh - 180px), 620px), auto) auto auto;
      min-height: calc(100dvh - var(--page-pad) * 2 - 60px);
      padding: 0 28px 20px;
    }

    .app-workspace .geometry-stage {
      grid-column: 1 / span 12;
      grid-row: 1 / span 1;
      min-height: clamp(500px, calc(100dvh - 180px), 620px);
      border: 0;
      background:
        radial-gradient(circle at 50% 45%, rgba(255, 59, 31, 0.16), transparent 28%),
        radial-gradient(circle at 50% 58%, rgba(255, 255, 255, 0.05), transparent 34%);
      mask-image: radial-gradient(ellipse at 50% 52%, black 0 58%, transparent 84%);
    }

    .app-workspace.has-ask-response .geometry-stage,
    body.has-ask-response .app-workspace .geometry-stage {
      opacity: 0 !important;
      visibility: hidden !important;
      pointer-events: none !important;
    }

    .app-workspace .industrial-geometry-hero {
      transform: translate3d(0, -8px, 0) scale(1.08);
      transform-origin: 50% 42%;
    }

    .app-workspace .industrial-robot-poster {
      top: 44%;
      width: min(900px, 62vw);
    }

    .app-workspace .stage-metadata {
      display: none;
    }

    .app-workspace .hero-copy {
      grid-column: 1 / span 12;
      grid-row: 1 / span 1;
      align-self: start;
      justify-self: center;
      width: min(100%, 720px);
      padding: 44px 20px 0;
      text-align: center;
    }

    .app-workspace .system-label {
      min-height: 0;
      margin-bottom: 18px;
      border-left: 0;
      border-radius: 999px;
      padding: 7px 12px;
      background: rgba(255, 255, 255, 0.055);
      color: #d8d5cc;
      -webkit-backdrop-filter: blur(12px);
      backdrop-filter: blur(12px);
      font-size: 12px;
    }

    .app-workspace .hero-title {
      font-size: clamp(32px, 4.8vw, 52px);
      font-weight: 520;
      line-height: 1.05;
      letter-spacing: -0.046em;
    }

    .app-workspace .hero-subtitle {
      max-width: 620px;
      margin: 14px auto 0;
      color: #bdb9af;
      font-size: 15.5px;
      line-height: 1.5;
    }

    .app-workspace .section-index {
      display: none;
    }

    .app-workspace .command-zone {
      grid-column: 3 / span 8;
      grid-row: 1 / span 1;
      align-self: end;
      justify-self: center;
      width: min(100%, 760px);
      margin: 0 0 8px;
      transform: translate3d(0, 0, 0);
    }

    .app-workspace .command-zone::before {
      top: 12%;
      height: 96%;
      opacity: 0.5;
      filter: blur(22px);
    }

    .app-workspace .command-zone::after {
      display: none;
    }

    .app-workspace .suggestions {
      justify-content: center;
      padding: 12px 0 0;
    }

    .app-workspace .suggestion-chip {
      min-height: 30px;
      font-size: 11.5px;
      background: rgba(0, 0, 0, 0.56);
    }

    .app-workspace .command-module {
      min-height: 134px;
      border-radius: 16px;
      background:
        radial-gradient(circle at 12% 12%, rgba(255, 255, 255, 0.1), transparent 34%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.02)),
        rgba(13, 12, 13, 0.9);
      -webkit-backdrop-filter: blur(18px) saturate(122%);
      backdrop-filter: blur(18px) saturate(122%);
      box-shadow:
        0 24px 80px rgba(0, 0, 0, 0.52),
        0 0 42px rgba(255, 59, 31, 0.1),
        inset 0 1px 0 rgba(255, 255, 255, 0.16);
    }

    .app-workspace .command-head {
      display: none;
    }

    .app-workspace .command-body {
      display: grid;
      grid-template-columns: 1fr;
      min-height: 134px;
    }

    .app-workspace .command-body::before {
      display: none;
    }

    .app-workspace .command-input {
      min-height: 78px;
      padding: 22px 24px 6px;
      font-size: 15px;
      line-height: 1.5;
    }

    .app-workspace .command-actions {
      display: flex;
      align-items: center;
      gap: 8px;
      min-width: 0;
      border-left: 0;
      padding: 8px 14px 14px;
    }

    .app-workspace .attach-button,
    .app-workspace .inline-context-button {
      min-height: 30px;
      border: 1px solid rgba(255, 255, 255, 0.1);
      border-radius: 999px;
      padding: 0 10px;
      color: var(--muted);
      background: rgba(0, 0, 0, 0.24);
      font-size: 11.5px;
      font-weight: 520;
    }

    .app-workspace .attach-button:hover,
    .app-workspace .inline-context-button:hover {
      color: var(--text);
      background: rgba(255, 255, 255, 0.06);
    }

    .app-workspace .send-button {
      min-height: 34px;
      margin-left: auto;
      border-radius: 999px;
      padding: 0 14px;
      font-size: 12px;
    }

    .app-workspace .module-strip {
      grid-column: 3 / span 8;
      width: min(100%, 760px);
      justify-self: center;
    }

    .app-workspace .module-strip {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 10px;
      margin: 0 auto 24px;
      border: 0;
      background: transparent;
    }

    .app-workspace .capability-module {
      min-height: 126px;
      border: 1px solid rgba(255, 255, 255, 0.1);
      border-radius: 16px;
      padding: 14px;
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.018)),
        rgba(0, 0, 0, 0.48);
      -webkit-backdrop-filter: blur(14px);
      backdrop-filter: blur(14px);
    }

    .app-workspace .module-code {
      margin-bottom: 14px;
      color: #aaa59a;
      font-family: var(--font);
      font-size: 11px;
      font-weight: 540;
      text-transform: none;
    }

    .app-workspace .capability-module h3 {
      font-size: 14px;
      font-weight: 620;
      letter-spacing: -0.012em;
      text-transform: none;
    }

    .app-workspace .capability-module p {
      margin-top: 8px;
      font-size: 12px;
      line-height: 1.42;
    }

    .app-workspace .module-meta {
      color: var(--accent-2);
      font-family: var(--font);
      font-size: 11px;
      text-transform: none;
    }

    @media (max-width: 1120px) {
      .app-shell {
        grid-template-columns: 196px minmax(0, 1fr);
      }

      .app-workspace .command-zone,
      .app-workspace .module-strip {
        grid-column: 2 / span 10;
      }
    }

    @media (max-width: 860px) {
      .app-shell {
        display: block;
        border-radius: 20px;
      }

      .app-sidebar {
        display: none;
      }

      .workspace-rail {
        min-height: auto;
        align-items: flex-start;
        flex-direction: column;
      }

      .app-workspace .hero-grid {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: auto auto auto auto;
        min-height: auto;
        padding: 0 12px 16px;
      }

      .app-workspace .geometry-stage,
      .app-workspace .hero-copy,
      .app-workspace .command-zone,
      .app-workspace .module-strip {
        grid-column: 1;
        grid-row: auto;
        width: 100%;
      }

      .app-workspace .geometry-stage {
        min-height: 330px;
      }

      .app-workspace .hero-copy {
        padding: 30px 8px 0;
      }

      .app-workspace .command-zone {
        margin: 12px 0 20px;
        transform: none;
      }

      .app-workspace .command-actions {
        flex-wrap: wrap;
      }

      .app-workspace .send-button {
        margin-left: 0;
      }

      .app-workspace .module-strip {
        grid-template-columns: 1fr;
      }
    }

    :root {
      --radius-industrial: 10px;
      --radius-shell: 10px;
      --warm-accent: #ff3b1f;
      --warm-accent-soft: rgba(255, 88, 50, 0.34);
      --graphite-panel: rgba(12, 12, 12, 0.94);
      --graphite-panel-strong: rgba(7, 7, 7, 0.98);
      --quiet-line: rgba(255, 255, 255, 0.105);
      --sidebar-plate: #b7b9b2;
      --sidebar-plate-dark: #8d9089;
      --sidebar-ink: #121411;
    }

    @keyframes commandBorderTravel {
      0% { background-position: 0 0, 0 0, 0% 50%; }
      50% { background-position: 0 0, 0 0, 100% 50%; }
      100% { background-position: 0 0, 0 0, 0% 50%; }
    }

    @keyframes commandGlowBreath {
      0%, 100% {
        opacity: 0.72;
        filter: saturate(1.05);
      }
      50% {
        opacity: 0.98;
        filter: saturate(1.24);
      }
    }

    .app-shell *,
    .drawer,
    .drawer * {
      -webkit-backdrop-filter: none !important;
      backdrop-filter: none !important;
    }

    .app-shell,
    .app-sidebar .menu-button,
    .app-sidebar .mark-button,
    .sidebar-new,
    .side-link,
    .sidebar-status,
    .status-metric,
    .model-pill,
    .workspace-rail .context-button,
    .app-workspace .system-label,
    .app-workspace .command-module,
    .app-workspace .suggestion-chip,
    .app-workspace .capability-module,
    .app-workspace .attach-button,
    .app-workspace .inline-context-button,
    .app-workspace .send-button,
    .drawer,
    .drawer-link,
    .drawer-session,
    .material-row,
    .tool-row,
    .privacy-row,
    .param-card {
      border-radius: var(--radius-industrial) !important;
    }

    .app-shell {
      border: 1px solid rgba(255, 255, 255, 0.13) !important;
      border-radius: var(--radius-shell) !important;
      background:
        radial-gradient(circle at 56% 24%, rgba(255, 59, 31, 0.12), transparent 31%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.034), transparent 34%),
        rgba(6, 6, 6, 0.94) !important;
      box-shadow:
        0 38px 110px rgba(0, 0, 0, 0.62),
        inset 0 1px 0 rgba(255, 255, 255, 0.11) !important;
    }

    .app-sidebar {
      gap: 14px !important;
      padding: 12px !important;
      color: var(--sidebar-ink) !important;
      border-right: 1px solid rgba(255, 255, 255, 0.18) !important;
      background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.18), transparent 34%),
        linear-gradient(180deg, var(--sidebar-plate), var(--sidebar-plate-dark)) !important;
      box-shadow:
        inset -1px 0 0 rgba(0, 0, 0, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.38);
    }

    .sidebar-brand-row {
      grid-template-columns: 34px 38px minmax(0, 1fr) !important;
      gap: 7px !important;
      min-height: 38px !important;
    }

    .app-sidebar .menu-button,
    .app-sidebar .mark-button {
      width: 34px !important;
      height: 34px !important;
      border: 1px solid rgba(0, 0, 0, 0.13) !important;
      color: var(--sidebar-ink) !important;
      background: rgba(255, 255, 255, 0.22) !important;
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.45),
        0 8px 18px rgba(0, 0, 0, 0.08);
    }

    .app-sidebar .mark-button {
      width: 38px !important;
      color: #f8f5ee !important;
      background:
        linear-gradient(180deg, rgba(32, 32, 30, 0.94), rgba(8, 8, 8, 0.94)) !important;
    }

    .app-sidebar .menu-button span {
      background: rgba(12, 14, 12, 0.82) !important;
    }

    .app-sidebar .brand-name,
    .app-sidebar .status-title {
      color: rgba(14, 16, 14, 0.94) !important;
      letter-spacing: -0.02em !important;
    }

    .app-sidebar .brand-sub,
    .app-sidebar .side-label,
    .app-sidebar .status-copy,
    .app-sidebar .status-metric {
      color: rgba(18, 20, 17, 0.58) !important;
    }

    .sidebar-new,
    .side-link,
    .sidebar-status,
    .status-metric {
      border: 1px solid rgba(0, 0, 0, 0.12) !important;
      color: rgba(16, 18, 15, 0.84) !important;
      background: rgba(255, 255, 255, 0.2) !important;
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.36) !important;
    }

    .side-link:hover,
    .side-link.is-active,
    .sidebar-new:hover {
      color: rgba(8, 9, 8, 0.98) !important;
      background: rgba(255, 255, 255, 0.34) !important;
    }

    .side-link.is-active {
      box-shadow:
        inset 2px 0 0 rgba(255, 59, 31, 0.9),
        inset 0 1px 0 rgba(255, 255, 255, 0.42) !important;
    }

    .status-metric strong {
      color: rgba(10, 11, 10, 0.95) !important;
    }

    .model-pill,
    .workspace-rail .context-button,
    .app-workspace .system-label,
    .app-workspace .suggestion-chip,
    .app-workspace .attach-button,
    .app-workspace .inline-context-button,
    .app-workspace .capability-module,
    .drawer-link,
    .drawer-session,
    .material-row,
    .tool-row,
    .privacy-row,
    .param-card {
      border: 1px solid var(--quiet-line) !important;
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.052), rgba(255, 255, 255, 0.018)),
        rgba(8, 8, 8, 0.78) !important;
      color: rgba(242, 240, 234, 0.72) !important;
      box-shadow: none !important;
      animation: none !important;
      transition:
        color 240ms var(--ease-mech),
        border-color 240ms var(--ease-mech),
        background 240ms var(--ease-mech),
        transform 240ms var(--ease-mech) !important;
    }

    .model-pill:hover,
    .workspace-rail .context-button:hover,
    .workspace-rail .context-button[aria-expanded="true"],
    .app-workspace .suggestion-chip:hover,
    .app-workspace .attach-button:hover,
    .app-workspace .inline-context-button:hover,
    .drawer-link:hover,
    .drawer-session:hover,
    .material-row:hover,
    .tool-row:hover,
    .privacy-row:hover {
      color: var(--text-strong) !important;
      border-color: rgba(255, 95, 54, 0.36) !important;
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.064), rgba(255, 255, 255, 0.024)),
        rgba(20, 14, 12, 0.86) !important;
    }

    .model-pill.is-active,
    .workspace-rail .context-button[aria-expanded="true"] {
      color: rgba(255, 253, 246, 0.94) !important;
      border-color: rgba(255, 95, 54, 0.42) !important;
      background:
        linear-gradient(180deg, rgba(255, 59, 31, 0.14), rgba(255, 59, 31, 0.052)),
        rgba(8, 8, 8, 0.84) !important;
    }

    .app-workspace .capability-module,
    .drawer {
      border: 1px solid rgba(255, 255, 255, 0.1) !important;
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.046), rgba(255, 255, 255, 0.014)),
        rgba(8, 8, 8, 0.9) !important;
      box-shadow:
        0 22px 70px rgba(0, 0, 0, 0.46),
        inset 0 1px 0 rgba(255, 255, 255, 0.065) !important;
      animation: none !important;
    }

    .app-workspace .command-zone::before {
      background:
        radial-gradient(ellipse at 50% 54%, rgba(255, 71, 36, 0.19), rgba(255, 96, 61, 0.07) 36%, transparent 72%),
        linear-gradient(90deg, transparent, rgba(255, 235, 224, 0.12) 20%, rgba(255, 59, 31, 0.15) 50%, rgba(255, 235, 224, 0.1) 80%, transparent) !important;
      opacity: 0.68 !important;
      filter: blur(26px) !important;
    }

    .app-workspace .command-module {
      position: relative !important;
      isolation: isolate !important;
      min-height: 134px !important;
      border: 3px solid transparent !important;
      background:
        radial-gradient(circle at 86% 0%, rgba(255, 255, 255, 0.08), transparent 31%) padding-box,
        linear-gradient(180deg, rgba(20, 20, 22, 0.97), rgba(10, 10, 11, 0.98)) padding-box,
        linear-gradient(90deg, #2b1711, #ff4a24, #ff8a35, #9f2b1c, #ff5a2f, #2b1711) border-box !important;
      background-size: auto, auto, 340% 100% !important;
      box-shadow:
        0 30px 92px rgba(0, 0, 0, 0.64),
        0 0 52px rgba(255, 77, 41, 0.14),
        inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
      animation: commandBorderTravel 10s var(--ease-mech) infinite !important;
      overflow: visible !important;
    }

    .app-workspace .command-module::before {
      content: "" !important;
      position: absolute !important;
      inset: -11px !important;
      z-index: -1 !important;
      pointer-events: none !important;
      border-radius: calc(var(--radius-industrial) + 9px) !important;
      background:
        linear-gradient(90deg, #2b1711, #ff4a24, #ff8a35, #9f2b1c, #ff5a2f, #2b1711) !important;
      background-size: 340% 100% !important;
      filter: blur(13px) !important;
      box-shadow:
        0 0 22px rgba(255, 74, 36, 0.28),
        0 0 34px rgba(255, 99, 45, 0.28),
        0 0 78px rgba(255, 59, 31, 0.14) !important;
      animation:
        commandBorderTravel 10s var(--ease-mech) infinite,
        commandGlowBreath 5.5s var(--ease-mech) infinite !important;
    }

    .app-workspace .command-module::after {
      content: "" !important;
      position: absolute !important;
      inset: 0 !important;
      z-index: 0 !important;
      pointer-events: none !important;
      border-radius: inherit !important;
      border: 1px solid rgba(255, 255, 255, 0.16) !important;
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.072), transparent 46%) !important;
      opacity: 0.62 !important;
    }

    .app-workspace .command-body,
    .app-workspace .command-input,
    .app-workspace .command-actions {
      position: relative !important;
      z-index: 1 !important;
    }

    .app-workspace .command-input {
      color: rgba(255, 253, 246, 0.94) !important;
    }

    .app-workspace .command-input::placeholder {
      color: rgba(242, 240, 234, 0.48) !important;
    }

    .app-workspace .command-actions {
      padding: 8px 12px 12px !important;
    }

    .app-workspace .send-button {
      display: grid !important;
      place-items: center !important;
      flex: 0 0 34px !important;
      width: 34px !important;
      min-width: 34px !important;
      height: 34px !important;
      min-height: 34px !important;
      margin-left: auto !important;
      padding: 0 !important;
      border: 1px solid rgba(255, 255, 255, 0.22) !important;
      border-radius: 50% !important;
      color: #fff !important;
      background:
        radial-gradient(circle at 34% 22%, rgba(255, 255, 255, 0.38), transparent 33%),
        linear-gradient(135deg, #ffb15d 0%, #ff6b33 46%, #e13a20 100%) !important;
      box-shadow:
        0 0 20px rgba(255, 74, 36, 0.28),
        0 10px 20px rgba(0, 0, 0, 0.34),
        inset 0 1px 0 rgba(255, 255, 255, 0.38),
        inset 0 -1px 0 rgba(0, 0, 0, 0.2) !important;
      transition:
        transform 220ms var(--ease-mech),
        box-shadow 220ms var(--ease-mech),
        filter 220ms var(--ease-mech) !important;
    }

    .app-workspace .send-button:hover {
      filter: brightness(1.08) !important;
      transform: translate3d(0, -1px, 0) !important;
      box-shadow:
        0 0 28px rgba(255, 74, 36, 0.36),
        0 12px 24px rgba(0, 0, 0, 0.36),
        inset 0 1px 0 rgba(255, 255, 255, 0.44) !important;
    }

    .app-workspace .send-button:active {
      transform: translate3d(0, 1px, 0) scale(0.96) !important;
    }

    .send-arrow {
      position: relative;
      display: block;
      width: 14px;
      height: 14px;
    }

    .send-arrow::before,
    .send-arrow::after {
      content: "";
      position: absolute;
      left: 50%;
      background: currentColor;
      border-radius: 2px;
      transform-origin: center;
    }

    .send-arrow::before {
      top: 2px;
      width: 9px;
      height: 9px;
      border-top: 2px solid currentColor;
      border-left: 2px solid currentColor;
      background: transparent;
      transform: translateX(-50%) rotate(45deg);
    }

    .send-arrow::after {
      top: 4px;
      width: 2px;
      height: 10px;
      transform: translateX(-50%);
    }

    .app-workspace .suggestion-chip {
      min-height: 30px !important;
      padding: 0 12px !important;
      font-size: 11.5px !important;
    }

    .app-workspace .capability-module {
      min-height: 118px !important;
      padding: 13px !important;
    }

    .app-workspace .module-code,
    .app-workspace .module-meta,
    .drawer-kicker {
      color: rgba(255, 106, 79, 0.82) !important;
    }

    .drawer {
      top: 24px !important;
      bottom: 24px !important;
      width: min(420px, calc(100vw - 48px)) !important;
      border-color: rgba(255, 255, 255, 0.12) !important;
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.044), rgba(255, 255, 255, 0.014)),
        rgba(8, 8, 8, 0.96) !important;
    }

    .drawer-left {
      left: 24px !important;
    }

    .drawer-right {
      right: 24px !important;
    }

    .drawer-left {
      color: var(--sidebar-ink) !important;
      border-color: rgba(0, 0, 0, 0.16) !important;
      background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.2), transparent 34%),
        linear-gradient(180deg, var(--sidebar-plate), var(--sidebar-plate-dark)) !important;
      box-shadow:
        0 28px 76px rgba(0, 0, 0, 0.48),
        inset 0 1px 0 rgba(255, 255, 255, 0.36) !important;
    }

    .drawer-left .drawer-header,
    .drawer-left .drawer-section,
    .drawer-left .close-button {
      border-color: rgba(0, 0, 0, 0.12) !important;
    }

    .drawer-left .drawer-kicker,
    .drawer-left .drawer-title,
    .drawer-left .section-title {
      color: rgba(12, 14, 12, 0.94) !important;
    }

    .drawer-left .drawer-subtitle,
    .drawer-left .session-meta,
    .drawer-left .item-meta {
      color: rgba(18, 20, 17, 0.58) !important;
    }

    .drawer-left .drawer-link,
    .drawer-left .drawer-session {
      border-color: rgba(0, 0, 0, 0.12) !important;
      color: rgba(16, 18, 15, 0.84) !important;
      background: rgba(255, 255, 255, 0.22) !important;
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.34) !important;
    }

    .drawer-left .drawer-link:hover,
    .drawer-left .drawer-session:hover {
      color: rgba(8, 9, 8, 0.98) !important;
      border-color: rgba(255, 59, 31, 0.38) !important;
      background: rgba(255, 255, 255, 0.34) !important;
    }

    .drawer-left .close-button::before,
    .drawer-left .close-button::after {
      background: rgba(12, 14, 12, 0.84) !important;
    }

    .drawer-header,
    .drawer-section,
    .close-button {
      border-color: rgba(255, 255, 255, 0.08) !important;
    }

    .drawer-title {
      font-size: 20px !important;
      font-weight: 650 !important;
      text-transform: none !important;
    }

    .drawer-link,
    .drawer-session,
    .material-row,
    .tool-row,
    .privacy-row {
      min-height: 40px !important;
      padding: 9px 10px !important;
    }

    .drawer-backdrop {
      background:
        radial-gradient(circle at 52% 40%, rgba(255, 59, 31, 0.06), transparent 34%),
        rgba(0, 0, 0, 0.62) !important;
    }

    @media (prefers-reduced-motion: reduce) {
      .app-workspace .command-module::before {
        animation: none !important;
      }
    }

    @media (max-width: 860px) {
      .drawer {
        top: 12px !important;
        bottom: 12px !important;
        width: calc(100vw - 24px) !important;
      }

      .drawer-left {
        left: 12px !important;
      }

      .drawer-right {
        right: 12px !important;
      }
    }

    :root {
      --radius-industrial: 10px;
      --radius-shell: 10px;
      --warm-accent: #ff4a24;
      --warm-accent-2: #ff8a35;
      --warm-accent-3: #d2331d;
      --graphite-0: #050505;
      --graphite-1: #0a0a0a;
      --graphite-2: #10100f;
      --graphite-3: #171715;
      --graphite-4: #21211e;
      --industrial-text: #f3efe7;
      --industrial-muted: rgba(243, 239, 231, 0.58);
      --industrial-line: rgba(255, 246, 232, 0.105);
    }

    @keyframes commandBorderTravel {
      0% { background-position: 0 0, 0 0, 0% 50%; }
      50% { background-position: 0 0, 0 0, 100% 50%; }
      100% { background-position: 0 0, 0 0, 0% 50%; }
    }

    body {
      background:
        radial-gradient(circle at 70% 34%, rgba(255, 74, 36, 0.105), transparent 30%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.018), transparent 220px),
        var(--graphite-0) !important;
    }

    .app-shell,
    .drawer {
      border-radius: var(--radius-shell) !important;
    }

    .app-shell {
      border: 1px solid rgba(255, 246, 232, 0.12) !important;
      background:
        radial-gradient(circle at 58% 24%, rgba(255, 74, 36, 0.1), transparent 32%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.028), transparent 36%),
        linear-gradient(180deg, rgba(12, 12, 12, 0.96), rgba(5, 5, 5, 0.97)) !important;
      box-shadow:
        0 34px 96px rgba(0, 0, 0, 0.62),
        inset 0 1px 0 rgba(255, 246, 232, 0.08) !important;
    }

    .app-workspace {
      background:
        radial-gradient(circle at 50% 24%, rgba(255, 74, 36, 0.12), transparent 31%),
        radial-gradient(circle at 50% 58%, rgba(255, 244, 226, 0.035), transparent 36%),
        linear-gradient(180deg, rgba(14, 14, 13, 0.76), rgba(7, 7, 7, 0.78)) !important;
    }

    .app-sidebar,
    .drawer-left {
      color: var(--industrial-text) !important;
      border-color: rgba(255, 246, 232, 0.08) !important;
      background:
        linear-gradient(180deg, rgba(255, 246, 232, 0.042), transparent 44%),
        linear-gradient(180deg, #191916 0%, #10100f 52%, #0a0a09 100%) !important;
      box-shadow:
        inset -1px 0 0 rgba(255, 246, 232, 0.045),
        inset 1px 0 0 rgba(0, 0, 0, 0.46) !important;
    }

    .sidebar-brand-row {
      grid-template-columns: 34px 38px minmax(0, 1fr) !important;
      gap: 8px !important;
      align-items: center !important;
    }

    .app-sidebar .brand-name,
    .drawer-left .drawer-title,
    .app-sidebar .status-title,
    .drawer-left .section-title {
      color: rgba(246, 242, 233, 0.94) !important;
      font-weight: 620 !important;
      letter-spacing: -0.025em !important;
    }

    .app-sidebar .brand-sub,
    .app-sidebar .side-label,
    .app-sidebar .status-copy,
    .drawer-left .drawer-subtitle,
    .drawer-left .session-meta,
    .drawer-left .item-meta {
      color: var(--industrial-muted) !important;
    }

    .app-sidebar .menu-button,
    .app-sidebar .mark-button,
    .sidebar-new,
    .sidebar-search,
    .side-link,
    .sidebar-status,
    .status-metric,
    .model-pill,
    .workspace-rail .context-button,
    .app-workspace .system-label,
    .app-workspace .suggestion-chip,
    .app-workspace .attach-button,
    .app-workspace .inline-context-button,
    .app-workspace .capability-module,
    .drawer-link,
    .drawer-session,
    .material-row,
    .tool-row,
    .privacy-row,
    .param-card {
      border-radius: var(--radius-industrial) !important;
      border: 1px solid var(--industrial-line) !important;
      background:
        linear-gradient(180deg, rgba(255, 246, 232, 0.064), rgba(255, 246, 232, 0.018)),
        rgba(13, 13, 12, 0.82) !important;
      color: rgba(246, 242, 233, 0.78) !important;
      box-shadow: none !important;
      animation: none !important;
      -webkit-backdrop-filter: none !important;
      backdrop-filter: none !important;
    }

    .app-sidebar .menu-button,
    .app-sidebar .mark-button {
      width: 34px !important;
      height: 34px !important;
      min-height: 34px !important;
      padding: 0 !important;
      background:
        linear-gradient(145deg, rgba(255, 138, 53, 0.18), rgba(255, 74, 36, 0.05)),
        rgba(18, 18, 16, 0.94) !important;
    }

    .app-sidebar .mark-button {
      width: 38px !important;
      color: rgba(255, 232, 214, 0.94) !important;
      font-weight: 650 !important;
    }

    .app-sidebar .menu-button span {
      background: rgba(246, 242, 233, 0.74) !important;
    }

    .sidebar-new {
      min-height: 38px !important;
      padding: 0 12px !important;
      color: rgba(255, 226, 209, 0.94) !important;
      background:
        linear-gradient(135deg, rgba(255, 138, 53, 0.22), rgba(255, 74, 36, 0.08)),
        rgba(17, 17, 15, 0.92) !important;
    }

    .sidebar-search {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      align-items: center;
      min-height: 38px;
      padding: 0 11px;
      color: rgba(246, 242, 233, 0.5) !important;
      font-size: 12px;
    }

    .search-key {
      color: rgba(255, 138, 53, 0.78);
      font-family: var(--font);
      font-size: 10.5px;
      font-weight: 580;
    }

    .side-group {
      gap: 7px !important;
    }

    .side-label {
      margin: 0 0 2px !important;
      font-size: 11px !important;
      font-weight: 600 !important;
      text-transform: none !important;
    }

    .side-link,
    .drawer-left .drawer-link,
    .drawer-left .drawer-session {
      min-height: 36px !important;
      padding: 0 11px !important;
      background:
        linear-gradient(180deg, rgba(255, 246, 232, 0.07), rgba(255, 246, 232, 0.018)),
        rgba(24, 24, 22, 0.86) !important;
    }

    .side-link span:first-child {
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .side-link span:last-child,
    .item-meta,
    .material-type,
    .tool-state {
      color: rgba(255, 138, 53, 0.74) !important;
      font-size: 10.5px !important;
      font-weight: 600 !important;
      text-transform: none !important;
    }

    .side-link:hover,
    .side-link.is-active,
    .sidebar-new:hover,
    .drawer-left .drawer-link:hover,
    .drawer-left .drawer-session:hover,
    .model-pill:hover,
    .workspace-rail .context-button:hover,
    .app-workspace .suggestion-chip:hover,
    .app-workspace .attach-button:hover,
    .app-workspace .inline-context-button:hover {
      color: rgba(255, 248, 238, 0.96) !important;
      border-color: rgba(255, 138, 53, 0.32) !important;
      background:
        linear-gradient(135deg, rgba(255, 138, 53, 0.16), rgba(255, 74, 36, 0.052)),
        rgba(25, 25, 23, 0.94) !important;
      transform: translate3d(0, -1px, 0);
    }

    .side-link.is-active {
      box-shadow: inset 2px 0 0 rgba(255, 88, 42, 0.9) !important;
    }

    .sidebar-status {
      padding: 13px !important;
      background:
        linear-gradient(145deg, rgba(255, 138, 53, 0.12), rgba(255, 74, 36, 0.035)),
        rgba(18, 18, 16, 0.92) !important;
    }

    .status-metric {
      min-height: 42px !important;
      padding: 7px !important;
      background:
        linear-gradient(180deg, rgba(255, 246, 232, 0.055), rgba(255, 246, 232, 0.014)),
        rgba(8, 8, 7, 0.62) !important;
      color: rgba(246, 242, 233, 0.54) !important;
    }

    .status-metric strong {
      color: rgba(255, 236, 224, 0.95) !important;
    }

    .model-pill.is-active,
    .workspace-rail .context-button[aria-expanded="true"] {
      border-color: rgba(255, 138, 53, 0.38) !important;
      color: rgba(255, 244, 235, 0.96) !important;
      background:
        linear-gradient(135deg, rgba(255, 138, 53, 0.18), rgba(255, 74, 36, 0.064)),
        rgba(14, 14, 13, 0.88) !important;
    }

    .app-workspace .capability-module,
    .drawer {
      border-color: rgba(255, 246, 232, 0.095) !important;
      background:
        linear-gradient(180deg, rgba(255, 246, 232, 0.044), rgba(255, 246, 232, 0.012)),
        rgba(8, 8, 8, 0.91) !important;
      box-shadow: 0 20px 64px rgba(0, 0, 0, 0.42) !important;
    }

    .app-workspace .command-zone::before {
      background:
        radial-gradient(ellipse at 50% 54%, rgba(255, 74, 36, 0.2), rgba(255, 138, 53, 0.07) 38%, transparent 72%),
        linear-gradient(90deg, transparent, rgba(255, 180, 126, 0.12) 20%, rgba(255, 74, 36, 0.16) 50%, rgba(255, 180, 126, 0.1) 80%, transparent) !important;
    }

    .app-workspace .command-module {
      border: 3px solid transparent !important;
      background:
        radial-gradient(circle at 86% 0%, rgba(255, 246, 232, 0.074), transparent 31%) padding-box,
        linear-gradient(180deg, rgba(21, 21, 20, 0.98), rgba(8, 8, 8, 0.99)) padding-box,
        linear-gradient(90deg, #2b1711, #ff4a24, #ff8a35, #9f2b1c, #ff5a2f, #2b1711) border-box !important;
      background-size: auto, auto, 360% 100% !important;
      box-shadow:
        0 28px 84px rgba(0, 0, 0, 0.62),
        0 0 44px rgba(255, 74, 36, 0.15),
        inset 0 1px 0 rgba(255, 246, 232, 0.09) !important;
      animation: commandBorderTravel 12s var(--ease-mech) infinite !important;
    }

    .app-workspace .command-module::before {
      background:
        linear-gradient(90deg, #2b1711, #ff4a24, #ff8a35, #9f2b1c, #ff5a2f, #2b1711) !important;
      background-size: 360% 100% !important;
      box-shadow:
        0 0 22px rgba(255, 74, 36, 0.26),
        0 0 52px rgba(255, 138, 53, 0.16) !important;
      animation:
        commandBorderTravel 12s var(--ease-mech) infinite,
        commandGlowBreath 6s var(--ease-mech) infinite !important;
    }

    .app-workspace .send-button {
      border: 1px solid rgba(255, 180, 126, 0.38) !important;
      color: #160b07 !important;
      background:
        linear-gradient(135deg, #ffb15d 0%, #ff6b33 46%, #e13a20 100%) !important;
      box-shadow:
        0 0 20px rgba(255, 74, 36, 0.28),
        0 10px 22px rgba(0, 0, 0, 0.28) !important;
    }

    .app-workspace .send-button:hover {
      box-shadow:
        0 0 28px rgba(255, 74, 36, 0.36),
        0 12px 24px rgba(0, 0, 0, 0.32) !important;
    }

    .drawer-left .drawer-header,
    .drawer-left .drawer-section,
    .drawer-left .close-button {
      border-color: rgba(255, 246, 232, 0.085) !important;
    }

    .drawer-left .drawer-kicker,
    .drawer-left .drawer-title,
    .drawer-left .section-title {
      color: rgba(246, 242, 233, 0.94) !important;
    }

    .drawer-left .drawer-subtitle,
    .drawer-left .session-meta,
    .drawer-left .item-meta {
      color: var(--industrial-muted) !important;
    }

    .drawer-left .close-button::before,
    .drawer-left .close-button::after {
      background: rgba(246, 242, 233, 0.82) !important;
    }

    @media (prefers-reduced-motion: reduce) {
      .app-workspace .command-module,
      .app-workspace .command-module::before {
        animation: none !important;
      }
    }

    @keyframes commandWarmAura {
      0%, 100% {
        box-shadow:
          0 28px 84px rgba(0, 0, 0, 0.62),
          0 0 34px rgba(255, 72, 32, 0.14),
          0 0 84px rgba(92, 18, 10, 0.1),
          inset 0 1px 0 rgba(255, 246, 232, 0.09);
        filter: saturate(1);
      }
      42% {
        box-shadow:
          0 28px 84px rgba(0, 0, 0, 0.62),
          0 0 46px rgba(255, 91, 37, 0.24),
          0 0 118px rgba(255, 166, 57, 0.13),
          inset 0 1px 0 rgba(255, 246, 232, 0.12);
        filter: saturate(1.1);
      }
      68% {
        box-shadow:
          0 28px 84px rgba(0, 0, 0, 0.62),
          0 0 38px rgba(141, 30, 18, 0.22),
          0 0 90px rgba(255, 72, 32, 0.1),
          inset 0 1px 0 rgba(255, 246, 232, 0.1);
        filter: saturate(1.04);
      }
    }

    @keyframes commandHaloBreath {
      0%, 100% {
        opacity: 0.5;
        transform: scale(0.985);
      }
      50% {
        opacity: 0.92;
        transform: scale(1.025);
      }
    }

    .app-sidebar {
      overflow: hidden !important;
    }

    .app-sidebar .side-group {
      gap: 3px !important;
      min-width: 0 !important;
    }

    .app-sidebar .side-link {
      display: grid !important;
      grid-template-columns: minmax(0, 1fr) auto !important;
      gap: 10px !important;
      width: 100% !important;
      max-width: 100% !important;
      min-width: 0 !important;
      min-height: 34px !important;
      border: 0 !important;
      padding: 0 10px !important;
      color: rgba(246, 242, 233, 0.72) !important;
      background: transparent !important;
      box-shadow: none !important;
      transform: none !important;
    }

    .app-sidebar .side-link span:first-child {
      display: block !important;
      min-width: 0 !important;
      overflow: hidden !important;
      text-overflow: ellipsis !important;
      white-space: nowrap !important;
    }

    .app-sidebar .side-link span:last-child {
      min-width: max-content !important;
      color: rgba(246, 242, 233, 0.42) !important;
      font-size: 10.5px !important;
      font-weight: 590 !important;
      text-align: right !important;
    }

    .app-sidebar .side-link:hover {
      border: 0 !important;
      color: rgba(246, 242, 233, 0.88) !important;
      background: rgba(255, 246, 232, 0.035) !important;
      box-shadow: none !important;
      transform: none !important;
    }

    .app-sidebar .side-link.is-active {
      border: 0 !important;
      color: rgba(255, 248, 238, 0.96) !important;
      background:
        linear-gradient(135deg, rgba(255, 138, 53, 0.16), rgba(255, 74, 36, 0.075)),
        rgba(23, 20, 18, 0.92) !important;
      box-shadow: inset 2px 0 0 rgba(255, 74, 36, 0.92) !important;
    }

    .app-sidebar .side-link.is-active span:last-child {
      color: rgba(255, 138, 53, 0.82) !important;
    }

    .app-workspace .command-module {
      background:
        radial-gradient(circle at 86% 0%, rgba(255, 246, 232, 0.074), transparent 31%) padding-box,
        linear-gradient(180deg, rgba(21, 21, 20, 0.98), rgba(8, 8, 8, 0.99)) padding-box,
        linear-gradient(105deg, #3b0d08, #b32014 17%, #ff4a24 33%, #ffb03f 50%, #7f1911 66%, #e63a1d 82%, #3b0d08) border-box !important;
      background-size: auto, auto, 420% 100% !important;
      animation:
        commandBorderTravel 11s var(--ease-mech) infinite,
        commandWarmAura 5.2s var(--ease-mech) infinite !important;
    }

    .app-workspace .command-module::before {
      inset: -14px !important;
      background:
        linear-gradient(105deg, #3b0d08, #b32014 17%, #ff4a24 33%, #ffb03f 50%, #7f1911 66%, #e63a1d 82%, #3b0d08) !important;
      background-size: 420% 100% !important;
      filter: blur(17px) !important;
      box-shadow:
        0 0 24px rgba(255, 74, 36, 0.3),
        0 0 60px rgba(255, 176, 63, 0.13),
        0 0 92px rgba(127, 25, 17, 0.16) !important;
      animation:
        commandBorderTravel 11s var(--ease-mech) infinite,
        commandHaloBreath 4.8s var(--ease-mech) infinite !important;
    }

    .app-workspace .send-button,
    .app-sidebar .menu-button,
    .app-sidebar .mark-button,
    .sidebar-new {
      box-shadow: none !important;
    }

    .app-workspace .send-button {
      background:
        linear-gradient(135deg, #ffb03f 0%, #ff5b27 48%, #b32014 100%) !important;
    }

    .app-workspace .send-button:hover {
      box-shadow: 0 0 22px rgba(255, 91, 39, 0.26) !important;
    }

    .app-workspace .module-strip .capability-module:first-child {
      border-color: rgba(255, 176, 63, 0.36) !important;
      background:
        radial-gradient(circle at 12% 0%, rgba(255, 222, 154, 0.22), transparent 34%),
        linear-gradient(135deg, rgba(255, 138, 53, 0.9), rgba(255, 74, 36, 0.78) 54%, rgba(86, 18, 10, 0.96)) !important;
      color: rgba(255, 248, 238, 0.96) !important;
      box-shadow:
        0 20px 60px rgba(0, 0, 0, 0.4),
        0 0 30px rgba(255, 91, 39, 0.13) !important;
    }

    .app-workspace .module-strip .capability-module:first-child .module-code,
    .app-workspace .module-strip .capability-module:first-child .module-meta {
      color: rgba(45, 14, 8, 0.78) !important;
      font-weight: 680 !important;
    }

    .app-workspace .module-strip .capability-module:first-child h3 {
      color: rgba(255, 252, 244, 0.98) !important;
    }

    .app-workspace .module-strip .capability-module:first-child p {
      color: rgba(255, 245, 230, 0.74) !important;
    }

    @media (prefers-reduced-motion: reduce) {
      .app-workspace .command-module,
      .app-workspace .command-module::before {
        animation: none !important;
      }
    }

    @keyframes commandTypingHalo {
      0%, 100% {
        opacity: 0.62;
        transform: scale3d(0.985, 0.94, 1);
        filter: blur(18px) saturate(1.08);
      }
      45% {
        opacity: 1;
        transform: scale3d(1.035, 1.08, 1);
        filter: blur(23px) saturate(1.24);
      }
      72% {
        opacity: 0.78;
        transform: scale3d(1.01, 1.02, 1);
        filter: blur(20px) saturate(1.15);
      }
    }

    .app-workspace .command-input,
    .app-workspace .command-input:focus,
    .app-workspace .command-input:focus-visible {
      border: 0 !important;
      outline: 0 !important;
      box-shadow: none !important;
    }

    .app-workspace .command-input {
      caret-color: rgba(255, 196, 119, 0.92) !important;
    }

    .app-workspace .command-module {
      transition:
        box-shadow 280ms var(--ease-mech),
        filter 280ms var(--ease-mech) !important;
    }

    .app-workspace .command-module:focus-within {
      box-shadow:
        0 28px 84px rgba(0, 0, 0, 0.62),
        0 0 52px rgba(255, 74, 36, 0.25),
        0 0 126px rgba(255, 176, 63, 0.11),
        inset 0 1px 0 rgba(255, 246, 232, 0.12) !important;
    }

    .app-workspace .command-module.is-typing {
      box-shadow:
        0 30px 92px rgba(0, 0, 0, 0.66),
        0 0 64px rgba(255, 74, 36, 0.34),
        0 0 148px rgba(255, 176, 63, 0.15),
        0 0 86px rgba(127, 25, 17, 0.22),
        inset 0 1px 0 rgba(255, 246, 232, 0.14) !important;
    }

    .app-workspace .command-module.is-typing::before {
      inset: -22px !important;
      opacity: 1 !important;
      filter: blur(24px) saturate(1.2) !important;
      animation:
        commandBorderTravel 7.2s var(--ease-mech) infinite,
        commandTypingHalo 2.6s var(--ease-mech) infinite !important;
    }

    /* Final interaction polish: flat black command deck, rotating laser-active ring, and reduced boxed chrome. */
    .app-workspace .command-module {
      border: 2px solid transparent !important;
      background:
        linear-gradient(#070707, #070707) padding-box,
        conic-gradient(from 0deg, #32100a, #8f2115, #ff4a24, #ffb03f, #7f1911, #e63a1d, #32100a) border-box !important;
      background-size: auto !important;
      animation: none !important;
      box-shadow:
        0 28px 84px rgba(0, 0, 0, 0.68),
        0 0 38px rgba(255, 74, 36, 0.12) !important;
      overflow: visible !important;
    }

    .app-workspace .command-module::before {
      content: "" !important;
      position: absolute !important;
      inset: -7px !important;
      z-index: -1 !important;
      pointer-events: none !important;
      border-radius: calc(var(--radius-industrial) + 7px) !important;
      padding: 2px !important;
      background:
        conic-gradient(from 0deg, #2a0d08, #a32618, #ff4a24, #ffb03f, #7f1911, #ff5b27, #2a0d08) !important;
      opacity: 0.62 !important;
      filter: none !important;
      box-shadow:
        0 0 20px rgba(255, 74, 36, 0.2),
        0 0 42px rgba(255, 176, 63, 0.08) !important;
      -webkit-mask:
        linear-gradient(#000 0 0) content-box,
        linear-gradient(#000 0 0) !important;
      -webkit-mask-composite: xor !important;
      mask-composite: exclude !important;
      transform-origin: 50% 50% !important;
      animation: none !important;
    }

    .app-workspace .command-module.is-typing::before {
      inset: -8px !important;
      opacity: 0.92 !important;
      filter: none !important;
      animation:
        commandRingRotate 2.8s linear infinite,
        commandRingPulse 1.8s var(--ease-mech) infinite !important;
    }

    .app-workspace .command-module::after {
      background: transparent !important;
      border: 1px solid rgba(255, 246, 232, 0.1) !important;
      opacity: 1 !important;
    }

    .app-workspace .command-body,
    .app-workspace .command-input,
    .app-workspace .command-actions {
      background: #070707 !important;
    }

    .app-workspace .command-input {
      color: rgba(255, 253, 246, 0.94) !important;
    }

    .app-workspace .send-button {
      border: 0 !important;
      color: #120806 !important;
      background: #f15a2e !important;
      box-shadow: none !important;
      filter: none !important;
      transform: none !important;
      transition:
        background 180ms var(--ease-mech),
        transform 180ms var(--ease-mech) !important;
    }

    .app-workspace .send-button:hover {
      background: #ff6a33 !important;
      box-shadow: none !important;
      filter: none !important;
      transform: translate3d(0, -1px, 0) !important;
    }

    .app-workspace .send-button:active {
      background: #d94322 !important;
      transform: translate3d(0, 1px, 0) scale(0.98) !important;
    }

    .send-arrow {
      width: 13px !important;
      height: 13px !important;
    }

    .send-arrow::before {
      top: 2px !important;
      width: 8px !important;
      height: 8px !important;
      border-top: 2px solid currentColor !important;
      border-left: 2px solid currentColor !important;
      border-radius: 1px !important;
    }

    .send-arrow::after {
      top: 4px !important;
      width: 2px !important;
      height: 10px !important;
      border-radius: 1px !important;
    }

    .sidebar-new,
    .app-sidebar .side-link,
    .sidebar-status,
    .status-metric,
    .model-pill {
      border: 0 !important;
      background: transparent !important;
      box-shadow: none !important;
      -webkit-backdrop-filter: none !important;
      backdrop-filter: none !important;
    }

    .sidebar-new {
      min-height: 28px !important;
      padding: 0 2px !important;
      color: rgba(255, 229, 211, 0.9) !important;
    }

    .sidebar-new:hover {
      color: #ff8a35 !important;
      background: transparent !important;
    }

    .app-sidebar .side-link {
      min-height: 28px !important;
      padding: 0 2px !important;
      color: rgba(246, 242, 233, 0.62) !important;
    }

    .app-sidebar .side-link:hover,
    .app-sidebar .side-link.is-active {
      color: rgba(255, 248, 238, 0.95) !important;
      background: transparent !important;
      box-shadow: none !important;
    }

    .app-sidebar .side-link.is-active span:last-child,
    .app-sidebar .side-link:hover span:last-child {
      color: #ff8a35 !important;
    }

    .sidebar-search {
      border: 1px solid rgba(255, 246, 232, 0.14) !important;
      background: rgba(13, 13, 12, 0.82) !important;
      box-shadow: none !important;
    }

    .model-pill {
      min-height: 24px !important;
      padding: 0 4px !important;
      color: rgba(246, 242, 233, 0.58) !important;
      border-radius: 0 !important;
    }

    .model-pill:hover,
    .model-pill.is-active {
      color: rgba(255, 248, 238, 0.95) !important;
      background: transparent !important;
      border: 0 !important;
    }

    .model-pill.is-active {
      color: #ff8a35 !important;
    }

    @keyframes commandRingRotate {
      to {
        transform: rotate(1turn);
      }
    }

    @keyframes commandRingPulse {
      0%, 100% {
        opacity: 0.72;
        box-shadow:
          0 0 18px rgba(255, 74, 36, 0.18),
          0 0 36px rgba(255, 176, 63, 0.06);
      }
      50% {
        opacity: 1;
        box-shadow:
          0 0 28px rgba(255, 74, 36, 0.34),
          0 0 58px rgba(255, 176, 63, 0.13);
      }
    }

    .app-workspace .module-strip .capability-module:first-child {
      border-color: rgba(255, 176, 63, 0.26) !important;
      background: #c64a2a !important;
      color: rgba(255, 248, 238, 0.97) !important;
      box-shadow:
        0 18px 52px rgba(0, 0, 0, 0.38),
        0 0 22px rgba(198, 74, 42, 0.16) !important;
    }

    .app-workspace .module-strip .capability-module:first-child .module-code,
    .app-workspace .module-strip .capability-module:first-child .module-meta {
      color: rgba(47, 15, 8, 0.72) !important;
    }

    .app-workspace .module-strip .capability-module:first-child h3 {
      color: rgba(255, 251, 244, 0.98) !important;
    }

    .app-workspace .module-strip .capability-module:first-child p {
      color: rgba(255, 244, 230, 0.76) !important;
    }

    @media (prefers-reduced-motion: reduce) {
      .app-workspace .command-module.is-typing::before {
        animation: none !important;
      }
    }

    /* Final requested correction: pure black command surface, flat send control, and no boxed chrome except search. */
    .app-workspace .command-module,
    .app-workspace .command-module:focus-within,
    .app-workspace .command-module.is-typing {
      border: 1px solid rgba(255, 94, 48, 0.34) !important;
      border-radius: 14px !important;
      background: #030303 !important;
      -webkit-backdrop-filter: none !important;
      backdrop-filter: none !important;
      animation: none !important;
      box-shadow:
        0 24px 76px rgba(0, 0, 0, 0.7),
        0 0 26px rgba(255, 74, 36, 0.1) !important;
      overflow: hidden !important;
    }

    .app-workspace .command-module::before,
    .app-workspace .command-module::after,
    .app-workspace .command-module.is-typing::before {
      display: none !important;
      content: none !important;
      animation: none !important;
    }

    .app-workspace .command-body,
    .app-workspace .command-input,
    .app-workspace .command-actions {
      background: #030303 !important;
    }

    .app-workspace .command-input {
      color: rgba(255, 253, 246, 0.95) !important;
      caret-color: #ff6a33 !important;
    }

    .app-workspace .send-button {
      width: 32px !important;
      min-width: 32px !important;
      height: 32px !important;
      min-height: 32px !important;
      border: 0 !important;
      border-radius: 10px !important;
      color: #1a0b07 !important;
      background: #ff6330 !important;
      box-shadow: none !important;
      filter: none !important;
    }

    #promptForm .send-button {
      width: 44px !important;
      min-width: 44px !important;
      height: 44px !important;
      min-height: 44px !important;
      display: grid !important;
      place-items: center !important;
      flex: 0 0 44px !important;
    }

    .app-workspace .send-button:hover {
      background: #ff7546 !important;
      box-shadow: none !important;
      filter: none !important;
      transform: translate3d(0, -1px, 0) !important;
    }

    .app-workspace .send-button:active {
      background: #df4926 !important;
      transform: translate3d(0, 1px, 0) scale(0.98) !important;
    }

    .send-arrow {
      width: 12px !important;
      height: 12px !important;
    }

    .send-arrow::before {
      top: 2px !important;
      width: 8px !important;
      height: 8px !important;
      border-top-width: 2px !important;
      border-left-width: 2px !important;
      border-radius: 0 !important;
    }

    .send-arrow::after {
      top: 4px !important;
      height: 9px !important;
      border-radius: 0 !important;
    }

    .app-sidebar .menu-button,
    .app-sidebar .mark-button,
    .sidebar-new,
    .workspace-rail .context-button,
    .model-pill,
    .model-pill.is-active,
    .model-pill:hover {
      border: 0 !important;
      border-radius: 0 !important;
      background: transparent !important;
      box-shadow: none !important;
      -webkit-backdrop-filter: none !important;
      backdrop-filter: none !important;
    }

    .workspace-rail .context-button {
      min-height: auto !important;
      padding: 0 !important;
      color: rgba(246, 242, 233, 0.58) !important;
    }

    .workspace-rail .context-button:hover,
    .workspace-rail .context-button[aria-expanded="true"] {
      color: #ff8a35 !important;
      background: transparent !important;
    }

    .app-sidebar .menu-button {
      width: 44px !important;
      min-width: 44px !important;
      height: 44px !important;
    }

    .app-sidebar .mark-button {
      width: 58px !important;
      min-width: 58px !important;
      height: 44px !important;
      color: rgba(255, 248, 238, 0.86) !important;
    }

    .sidebar-new {
      min-height: 30px !important;
      padding: 0 !important;
      color: rgba(255, 229, 211, 0.88) !important;
    }

    .sidebar-new:hover {
      color: #ff8a35 !important;
    }

    .model-pills {
      gap: 18px !important;
    }

    .model-pill {
      min-height: auto !important;
      padding: 0 !important;
      color: rgba(246, 242, 233, 0.52) !important;
      font-size: 13px !important;
    }

    .model-pill.is-active {
      color: #ff8a35 !important;
    }

    .sidebar-search {
      border: 1px solid rgba(255, 246, 232, 0.16) !important;
      border-radius: 12px !important;
      background: rgba(13, 13, 12, 0.86) !important;
    }

    .floating-action-rail {
      position: fixed;
      right: 28px;
      bottom: 28px;
      z-index: 42;
      display: grid;
      gap: 10px;
      pointer-events: auto;
    }

    .floating-tool-button {
      width: 48px;
      height: 48px;
      display: grid;
      place-items: center;
      border: 0;
      border-radius: 15px;
      color: rgba(255, 249, 239, 0.72);
      background: #1a1917;
      box-shadow: none;
      transition:
        background 180ms var(--ease-mech),
        color 180ms var(--ease-mech),
        transform 180ms var(--ease-mech);
    }

    .floating-tool-button:hover {
      color: #1a0b07;
      background: #ff6330;
      transform: translate3d(0, -1px, 0);
    }

    .floating-tool-button:active {
      background: #df4926;
      transform: translate3d(0, 1px, 0) scale(0.98);
    }

    .floating-tool-button svg {
      width: 23px;
      height: 23px;
      stroke: currentColor;
      stroke-width: 2;
      stroke-linecap: round;
      stroke-linejoin: round;
      fill: none;
    }

    @media (max-width: 760px) {
      .floating-action-rail {
        right: 16px;
        bottom: 16px;
      }
    }

    /* Final grid alignment: quick-tool rail shares the workspace right edge and bottom module baseline. */
    .workspace-rail {
      align-items: flex-start !important;
      justify-content: space-between !important;
    }

    .workspace-tabs {
      display: flex !important;
      align-items: flex-start !important;
      gap: 0 !important;
      min-height: 48px !important;
      min-width: 0 !important;
    }

    .workspace-menu-button {
      display: none !important;
      position: relative !important;
      width: 28px !important;
      height: 20px !important;
      min-width: 28px !important;
      margin: -2px 16px 0 0 !important;
      border: 0 !important;
      border-radius: 0 !important;
      padding: 0 !important;
      background: transparent !important;
      box-shadow: none !important;
    }

    .workspace-menu-button span {
      position: absolute !important;
      left: 1px !important;
      right: 1px !important;
      height: 2px !important;
      border-radius: 1px !important;
      background: rgba(255, 249, 239, 0.82) !important;
      transition:
        transform 180ms var(--ease-mech),
        opacity 180ms var(--ease-mech),
        background 180ms var(--ease-mech) !important;
    }

    .workspace-menu-button span:nth-child(1) {
      top: 1px !important;
    }

    .workspace-menu-button span:nth-child(2) {
      top: 9px !important;
    }

    .workspace-menu-button span:nth-child(3) {
      top: 17px !important;
    }

    .workspace-menu-button.is-open span:nth-child(1) {
      transform: translateY(8px) rotate(45deg) !important;
    }

    .workspace-menu-button.is-open span:nth-child(2) {
      opacity: 0 !important;
    }

    .workspace-menu-button.is-open span:nth-child(3) {
      transform: translateY(-8px) rotate(-45deg) !important;
    }

    .workspace-tab {
      display: inline-flex !important;
      align-items: flex-start !important;
      min-height: 0 !important;
      border: 0 !important;
      border-radius: 0 !important;
      padding: 0 20px 0 0 !important;
      color: rgba(246, 242, 233, 0.58) !important;
      background: transparent !important;
      box-shadow: none !important;
      -webkit-backdrop-filter: none !important;
      backdrop-filter: none !important;
      font-family: var(--font) !important;
      font-size: 13px !important;
      font-weight: 650 !important;
      line-height: 1.25 !important;
      white-space: nowrap !important;
      cursor: pointer !important;
      transition: color 180ms var(--ease-mech) !important;
    }

    .workspace-tab:hover,
    .workspace-tab.active {
      color: #ff8a35 !important;
    }

    .workspace-tab:focus-visible,
    .workspace-menu-button:focus-visible,
    .workspace-mode-toggle:focus-visible,
    .workspace-token-button:focus-visible,
    .designer-nav-link:focus-visible,
    .drawer-link:focus-visible,
    .drawer .close-button:focus-visible,
    .drawer-left .close-button:focus-visible {
      outline: 0 !important;
      box-shadow: 0 0 0 1px rgba(255, 138, 53, 0.52) !important;
    }

    .workspace-status {
      display: flex !important;
      align-items: flex-start !important;
      justify-content: flex-end !important;
      gap: 16px !important;
      min-width: 0 !important;
      position: relative !important;
    }

    .model-pills {
      display: flex !important;
      align-items: flex-start !important;
      gap: 0 !important;
      min-height: 48px !important;
      padding-top: 1px !important;
    }

    .model-pill,
    .model-pill.is-active,
    .model-pill:hover {
      display: inline-flex !important;
      align-items: flex-start !important;
      min-height: 0 !important;
      border: 0 !important;
      border-radius: 0 !important;
      padding: 0 !important;
      color: rgba(246, 242, 233, 0.58) !important;
      background: transparent !important;
      box-shadow: none !important;
      -webkit-backdrop-filter: none !important;
      backdrop-filter: none !important;
      font-size: 13px !important;
      font-weight: 560 !important;
      line-height: 1.25 !important;
      white-space: nowrap !important;
    }

    .model-pill.is-active {
      color: #ff8a35 !important;
    }

    .status-divider {
      display: inline-flex !important;
      align-items: flex-start !important;
      padding: 0 14px !important;
      color: #ff8a35 !important;
      font-size: 13px !important;
      font-weight: 650 !important;
      line-height: 1.25 !important;
      opacity: 0.9 !important;
      pointer-events: none !important;
    }

    .workspace-rail .context-button,
    .workspace-rail .workspace-mode-toggle,
    .workspace-rail .workspace-token-button {
      min-height: 48px !important;
      padding: 0 18px !important;
      flex: 0 0 auto !important;
      border: 0 !important;
      border-radius: 15px !important;
      color: rgba(255, 249, 239, 0.76) !important;
      background: #1a1917 !important;
      box-shadow: none !important;
      -webkit-backdrop-filter: none !important;
      backdrop-filter: none !important;
      font-size: 13px !important;
      font-weight: 650 !important;
      letter-spacing: -0.012em !important;
      line-height: 48px !important;
      white-space: nowrap !important;
      transition:
        background 180ms var(--ease-mech),
        color 180ms var(--ease-mech),
        transform 180ms var(--ease-mech) !important;
    }

    .workspace-rail .workspace-mode-toggle.active {
      color: #1a0b07 !important;
      background: #ff8a35 !important;
    }

    .workspace-rail .workspace-token-button.has-token {
      color: #1a0b07 !important;
      background: #d8d2c5 !important;
    }

    .workspace-rail .context-button:hover,
    .workspace-rail .context-button[aria-expanded="true"],
    .workspace-rail .workspace-mode-toggle:hover,
    .workspace-rail .workspace-token-button:hover {
      color: #1a0b07 !important;
      background: #ff6330 !important;
      transform: translate3d(0, -1px, 0) !important;
    }

    .workspace-token-popover {
      position: absolute !important;
      top: calc(100% + 10px) !important;
      right: 0 !important;
      z-index: 45 !important;
      display: none !important;
      align-items: center !important;
      gap: 8px !important;
      width: min(320px, calc(100vw - 32px)) !important;
      padding: 10px !important;
      border: 1px solid rgba(246, 242, 233, 0.14) !important;
      border-radius: 12px !important;
      background: rgba(16, 15, 14, 0.96) !important;
      box-shadow: 0 18px 48px rgba(0, 0, 0, 0.42) !important;
    }

    .workspace-token-popover.is-open {
      display: flex !important;
    }

    .workspace-token-input {
      flex: 1 1 auto !important;
      min-width: 0 !important;
      height: 38px !important;
      border: 1px solid rgba(246, 242, 233, 0.14) !important;
      border-radius: 8px !important;
      padding: 0 11px !important;
      color: rgba(246, 242, 233, 0.92) !important;
      background: rgba(255, 255, 255, 0.045) !important;
      font: inherit !important;
      font-size: 13px !important;
      outline: 0 !important;
    }

    .workspace-token-input::placeholder {
      color: rgba(246, 242, 233, 0.42) !important;
    }

    .workspace-token-input:focus {
      border-color: rgba(255, 138, 53, 0.48) !important;
      box-shadow: 0 0 0 1px rgba(255, 138, 53, 0.18) !important;
    }

    .workspace-token-save {
      flex: 0 0 auto !important;
      height: 38px !important;
      border: 0 !important;
      border-radius: 8px !important;
      padding: 0 13px !important;
      color: #1a0b07 !important;
      background: #ff8a35 !important;
      font: inherit !important;
      font-size: 13px !important;
      font-weight: 650 !important;
      cursor: pointer !important;
    }

    .workspace-token-save:hover,
    .workspace-token-save:focus-visible {
      background: #ff6330 !important;
      outline: 0 !important;
    }

    .sidebar-search {
      grid-template-columns: minmax(0, 1fr) auto !important;
      gap: 10px !important;
    }

    .sidebar-search-input {
      width: 100% !important;
      min-width: 0 !important;
      border: 0 !important;
      outline: 0 !important;
      color: rgba(246, 242, 233, 0.9) !important;
      background: transparent !important;
      font: inherit !important;
      font-size: 12px !important;
      letter-spacing: -0.01em !important;
      appearance: none !important;
    }

    .sidebar-search-input::-webkit-search-decoration,
    .sidebar-search-input::-webkit-search-cancel-button {
      appearance: none !important;
      display: none !important;
    }

    .sidebar-search-input::placeholder {
      color: rgba(246, 242, 233, 0.42) !important;
    }

    .sidebar-search:focus-within {
      border-color: rgba(255, 138, 53, 0.34) !important;
      background: rgba(17, 15, 14, 0.94) !important;
    }

    .floating-action-rail {
      right: calc(var(--page-pad) + 18px) !important;
      bottom: calc(var(--page-pad) + 44px) !important;
    }

    @media (max-width: 860px) {
      .workspace-rail {
        gap: 10px !important;
      }

      .workspace-tabs {
        align-items: center !important;
      }

      .workspace-menu-button {
        display: inline-flex !important;
        flex: 0 0 auto !important;
      }

      .workspace-status {
        width: 100% !important;
        justify-content: space-between !important;
        gap: 10px !important;
      }

      .workspace-token-popover {
        left: auto !important;
        right: 0 !important;
        width: min(280px, calc(100vw - 24px)) !important;
      }

      .workspace-status .model-pills {
        flex: 1 1 auto !important;
        overflow: hidden !important;
      }

      .workspace-rail .context-button,
      .workspace-rail .workspace-mode-toggle,
      .workspace-rail .workspace-token-button {
        min-height: 40px !important;
        padding: 0 14px !important;
        min-width: 76px !important;
        line-height: 40px !important;
        text-align: center !important;
      }

      .floating-action-rail {
        right: calc(var(--page-pad) + 12px) !important;
        bottom: calc(var(--page-pad) + 16px) !important;
      }
    }

    /* Sidebar scale correction: keep the Figma-inspired header, restore compact app typography below it. */
    .app-shell {
      grid-template-columns: 272px minmax(0, 1fr) !important;
    }

    .app-sidebar {
      gap: 14px !important;
      padding: 18px 14px 16px !important;
      color: rgba(246, 242, 233, 0.94) !important;
      border-right: 1px solid rgba(246, 242, 233, 0.14) !important;
      background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.015), transparent 52%),
        #0d0d0c !important;
      box-shadow: none !important;
      overflow-x: hidden !important;
      overflow-y: auto !important;
      scrollbar-width: thin !important;
      scrollbar-color: rgba(246, 242, 233, 0.22) transparent !important;
    }

    .sidebar-brand-row {
      display: grid !important;
      grid-template-columns: 48px minmax(0, 1fr) 34px !important;
      gap: 10px !important;
      align-items: start !important;
      min-height: 52px !important;
      margin-bottom: 2px !important;
    }

    .sidebar-avatar {
      position: relative;
      width: 48px;
      height: 48px;
      border-radius: 50%;
      background:
        radial-gradient(circle at 50% 48%, rgba(255, 122, 45, 0.08), transparent 48%),
        #020202;
      box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.015),
        0 10px 22px rgba(0, 0, 0, 0.32);
      overflow: hidden;
    }

    .avatar-pixel-mark {
      position: absolute;
      left: 13px;
      top: 18px;
      width: 23px;
      height: 13px;
      background: #df7930;
      clip-path: polygon(
        0 34%, 12% 34%, 12% 14%, 26% 14%, 26% 0,
        74% 0, 74% 14%, 88% 14%, 88% 34%, 100% 34%,
        100% 100%, 0 100%
      );
      image-rendering: pixelated;
      filter: saturate(0.95);
    }

    .avatar-pixel-mark::before,
    .avatar-pixel-mark::after {
      content: "";
      position: absolute;
      top: 5px;
      width: 3px;
      height: 5px;
      background: #090909;
    }

    .avatar-pixel-mark::before {
      left: 6px;
    }

    .avatar-pixel-mark::after {
      right: 6px;
    }

    .sidebar-copy {
      min-width: 0 !important;
      padding: 0 !important;
    }

    .app-sidebar .brand-name {
      max-width: 100% !important;
      margin: 0 !important;
      overflow: hidden !important;
      color: rgba(255, 253, 246, 0.96) !important;
      font-size: 15px !important;
      font-weight: 660 !important;
      line-height: 18px !important;
      height: 18px !important;
      letter-spacing: -0.026em !important;
      text-overflow: ellipsis !important;
      white-space: nowrap !important;
    }

    .app-sidebar .brand-sub {
      display: block !important;
      margin-top: 4px !important;
      color: rgba(246, 242, 233, 0.72) !important;
      font-size: 12.5px !important;
      font-weight: 390 !important;
      line-height: 1.2 !important;
      letter-spacing: -0.018em !important;
    }

    .app-sidebar .menu-button {
      justify-self: end !important;
      align-self: start !important;
      width: 18px !important;
      min-width: 18px !important;
      height: 18px !important;
      min-height: 18px !important;
      margin: 0 !important;
      border: 0 !important;
      border-radius: 0 !important;
      color: rgba(255, 253, 246, 0.92) !important;
      background: transparent !important;
      box-shadow: none !important;
      transform: none !important;
    }

    .app-sidebar .menu-button span {
      left: 2px !important;
      right: 2px !important;
      height: 1.5px !important;
      border-radius: 2px !important;
      background: currentColor !important;
    }

    .app-sidebar .menu-button span:nth-child(1) {
      top: 4px !important;
    }

    .app-sidebar .menu-button span:nth-child(2) {
      top: 8px !important;
    }

    .app-sidebar .menu-button span:nth-child(3) {
      top: 12px !important;
    }

    .app-sidebar .menu-button.is-open span:nth-child(1) {
      transform: translateY(4px) rotate(45deg) !important;
    }

    .app-sidebar .menu-button.is-open span:nth-child(2) {
      opacity: 0 !important;
    }

    .app-sidebar .menu-button.is-open span:nth-child(3) {
      transform: translateY(-4px) rotate(-45deg) !important;
    }

    .app-sidebar .menu-button:hover {
      color: #ff8a35 !important;
      background: transparent !important;
    }

    .sidebar-new {
      display: grid !important;
      grid-template-columns: 22px minmax(0, 1fr) !important;
      align-items: center !important;
      gap: 8px !important;
      min-height: 40px !important;
      margin: 2px 0 0 !important;
      border: 0 !important;
      border-radius: 10px !important;
      padding: 0 12px !important;
      color: rgba(255, 229, 211, 0.9) !important;
      background: rgba(255, 99, 48, 0.09) !important;
      box-shadow: inset 0 0 0 1px rgba(255, 138, 53, 0.14) !important;
      font-size: 13px !important;
      font-weight: 620 !important;
      line-height: 1 !important;
      letter-spacing: -0.018em !important;
      text-align: left !important;
      transition:
        background 180ms var(--ease-mech),
        color 180ms var(--ease-mech) !important;
    }

    .sidebar-new:hover {
      color: rgba(255, 248, 238, 0.96) !important;
      background: rgba(255, 99, 48, 0.14) !important;
    }

    .new-icon {
      position: relative;
      display: grid !important;
      place-items: center !important;
      width: 18px !important;
      height: 18px !important;
      color: currentColor !important;
    }

    .new-icon::before,
    .new-icon::after {
      content: "";
      position: absolute;
      left: 50%;
      top: 50%;
      width: 14px;
      height: 2px;
      border-radius: 2px;
      background: currentColor;
      transform: translate(-50%, -50%);
    }

    .new-icon::after {
      transform: translate(-50%, -50%) rotate(90deg);
    }

    .sidebar-new-label {
      min-width: 0 !important;
      overflow: hidden !important;
      text-overflow: ellipsis !important;
      white-space: nowrap !important;
    }

    .sidebar-search {
      display: grid !important;
      grid-template-columns: 22px minmax(0, 1fr) auto !important;
      align-items: center !important;
      gap: 8px !important;
      min-height: 40px !important;
      margin: 2px 0 12px !important;
      padding: 0 12px !important;
      border: 1px solid rgba(246, 242, 233, 0.22) !important;
      border-radius: 12px !important;
      color: rgba(246, 242, 233, 0.38) !important;
      background: #0f0f0e !important;
      box-shadow: none !important;
      transition:
        border-color 180ms var(--ease-mech),
        background 180ms var(--ease-mech),
        color 180ms var(--ease-mech) !important;
    }

    .sidebar-search:hover,
    .sidebar-search:focus-within {
      border-color: rgba(255, 138, 53, 0.4) !important;
      color: rgba(246, 242, 233, 0.62) !important;
      background: #121211 !important;
    }

    .search-icon {
      display: grid;
      place-items: center;
      width: 18px;
      height: 18px;
      color: currentColor;
    }

    .search-icon svg {
      width: 18px;
      height: 18px;
      stroke: currentColor;
      stroke-width: 2;
      fill: none;
      stroke-linecap: round;
      stroke-linejoin: round;
    }

    .sidebar-search-input {
      min-width: 0 !important;
      width: 100% !important;
      border: 0 !important;
      outline: 0 !important;
      color: rgba(246, 242, 233, 0.92) !important;
      background: transparent !important;
      font-size: 13px !important;
      font-weight: 560 !important;
      line-height: 1 !important;
      letter-spacing: -0.012em !important;
      appearance: none !important;
    }

    .sidebar-search-input::placeholder {
      color: rgba(246, 242, 233, 0.34) !important;
      opacity: 1 !important;
    }

    .search-key {
      color: #df7930 !important;
      font-size: 12px !important;
      font-weight: 650 !important;
      line-height: 1 !important;
      letter-spacing: -0.01em !important;
    }

    .app-sidebar .side-group {
      display: grid !important;
      gap: 6px !important;
      min-width: 0 !important;
      padding: 0 0 12px !important;
    }

    .app-sidebar .side-group + .side-group {
      margin: 0 -14px !important;
      padding: 14px 14px 0 !important;
      border-top: 1px solid rgba(246, 242, 233, 0.12) !important;
    }

    .app-sidebar .side-label {
      margin: 0 4px 2px !important;
      color: rgba(246, 242, 233, 0.58) !important;
      font-size: 11px !important;
      font-weight: 660 !important;
      line-height: 1 !important;
      letter-spacing: 0.04em !important;
      text-transform: uppercase !important;
    }

    .app-sidebar .side-link {
      display: grid !important;
      grid-template-columns: minmax(0, 1fr) 16px !important;
      align-items: center !important;
      gap: 8px !important;
      width: 100% !important;
      min-height: 34px !important;
      border: 0 !important;
      border-radius: 10px !important;
      padding: 0 10px !important;
      color: rgba(246, 242, 233, 0.52) !important;
      background: transparent !important;
      box-shadow: none !important;
      transform: none !important;
      transition:
        color 180ms var(--ease-mech),
        background 180ms var(--ease-mech) !important;
    }

    .app-sidebar .side-link:hover {
      color: rgba(246, 242, 233, 0.78) !important;
      background: transparent !important;
      transform: none !important;
      box-shadow: none !important;
    }

    .app-sidebar .side-link.is-active {
      color: rgba(255, 253, 246, 0.97) !important;
      background: transparent !important;
      box-shadow: none !important;
    }

    .side-title-row {
      display: flex !important;
      align-items: baseline !important;
      min-width: 0 !important;
      gap: 6px !important;
      overflow: hidden !important;
    }

    .side-title {
      min-width: 0 !important;
      overflow: hidden !important;
      color: inherit !important;
      font-size: 12.8px !important;
      font-weight: 600 !important;
      line-height: 1.2 !important;
      letter-spacing: -0.018em !important;
      text-overflow: ellipsis !important;
      white-space: nowrap !important;
    }

    .side-date {
      flex: 0 0 auto !important;
      color: rgba(246, 242, 233, 0.28) !important;
      font-size: 10px !important;
      font-weight: 560 !important;
      line-height: 1 !important;
      letter-spacing: -0.01em !important;
    }

    .app-sidebar .side-link:hover .side-date,
    .app-sidebar .side-link.is-active .side-date {
      color: rgba(246, 242, 233, 0.48) !important;
    }

    .side-indicator {
      position: relative;
      display: block !important;
      width: 14px !important;
      height: 14px !important;
      border: 1.5px solid rgba(246, 242, 233, 0.52) !important;
      border-radius: 50% !important;
      background: transparent !important;
      box-shadow: none !important;
    }

    .side-indicator.is-hot::after {
      content: "";
      position: absolute;
      inset: 3px;
      border-radius: 50%;
      background: #df7930;
      box-shadow: 0 0 10px rgba(223, 121, 48, 0.24);
    }

    .app-sidebar .side-link.is-active .side-indicator {
      border-color: rgba(246, 242, 233, 0.72) !important;
    }

    .sidebar-status {
      display: block !important;
      margin-top: auto !important;
      border: 1px solid rgba(246, 242, 233, 0.11) !important;
      border-radius: 12px !important;
      padding: 12px !important;
      background:
        radial-gradient(circle at 82% 0%, rgba(255, 99, 48, 0.1), transparent 42%),
        rgba(255, 255, 255, 0.035) !important;
      box-shadow: none !important;
    }

    .sidebar-status .status-title {
      margin: 0 !important;
      color: rgba(246, 242, 233, 0.9) !important;
      font-size: 12.5px !important;
      font-weight: 630 !important;
      line-height: 1.2 !important;
      letter-spacing: -0.014em !important;
    }

    .sidebar-status .status-copy {
      margin: 6px 0 10px !important;
      color: rgba(246, 242, 233, 0.48) !important;
      font-size: 10.5px !important;
      line-height: 1.45 !important;
      letter-spacing: -0.006em !important;
    }

    .sidebar-status .status-metrics {
      display: grid !important;
      grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
      gap: 6px !important;
    }

    .sidebar-status .status-metric {
      min-height: 34px !important;
      border: 0 !important;
      border-radius: 9px !important;
      padding: 6px !important;
      color: rgba(246, 242, 233, 0.42) !important;
      background: rgba(255, 255, 255, 0.035) !important;
      font-size: 9.5px !important;
      line-height: 1.1 !important;
      text-align: center !important;
    }

    .sidebar-status .status-metric strong {
      display: block !important;
      margin-bottom: 2px !important;
      color: rgba(255, 248, 238, 0.9) !important;
      font-size: 13px !important;
      font-weight: 650 !important;
    }

    .workspace-rail .model-pill,
    .workspace-rail .context-button {
      font-size: 13px !important;
      line-height: 1.25 !important;
      letter-spacing: -0.012em !important;
    }

    .app-workspace .command-input {
      font-size: 18px !important;
      line-height: 1.35 !important;
      letter-spacing: -0.02em !important;
    }

    .app-workspace .command-input::placeholder {
      color: rgba(246, 242, 233, 0.5) !important;
    }

    .app-workspace .suggestion-chip,
    .app-workspace .attach-button,
    .app-workspace .inline-context-button {
      font-size: 12.5px !important;
      line-height: 1 !important;
      letter-spacing: -0.012em !important;
    }

    .app-workspace .capability-module h3 {
      font-size: 13.5px !important;
      line-height: 1.2 !important;
      letter-spacing: -0.018em !important;
    }

    .app-workspace .capability-module p {
      font-size: 11.5px !important;
      line-height: 1.45 !important;
      letter-spacing: -0.006em !important;
    }

    .stage-metadata,
    .app-workspace .module-code,
    .app-workspace .module-meta {
      font-size: 10.5px !important;
      line-height: 1.2 !important;
    }

    /* Unified drawer interaction model: same dark-to-orange behavior as the quick tool buttons. */
    .drawer,
    .drawer-left,
    .drawer-right {
      color: rgba(255, 249, 239, 0.78) !important;
      border-color: rgba(255, 246, 232, 0.1) !important;
      background:
        linear-gradient(180deg, rgba(255, 246, 232, 0.035), rgba(255, 246, 232, 0.01)),
        #0b0b0a !important;
      box-shadow:
        0 28px 76px rgba(0, 0, 0, 0.54),
        inset 0 1px 0 rgba(255, 246, 232, 0.045) !important;
    }

    .drawer-header,
    .drawer-section,
    .drawer .close-button,
    .drawer-left .drawer-header,
    .drawer-left .drawer-section,
    .drawer-left .close-button {
      border-color: rgba(255, 246, 232, 0.09) !important;
    }

    .drawer-header,
    .drawer-left .drawer-header {
      grid-template-columns: minmax(0, 1fr) 56px !important;
      align-items: start !important;
    }

    .drawer-title,
    .drawer-left .drawer-title,
    .drawer .section-title,
    .drawer-left .section-title {
      color: rgba(255, 249, 239, 0.92) !important;
      font-weight: 650 !important;
      letter-spacing: -0.018em !important;
    }

    .drawer-kicker,
    .drawer-left .drawer-kicker {
      color: #ff8a35 !important;
      font-family: var(--font) !important;
      font-size: 11px !important;
      font-weight: 650 !important;
      letter-spacing: 0.02em !important;
      text-transform: uppercase !important;
    }

    .drawer-subtitle,
    .drawer-left .drawer-subtitle {
      color: rgba(246, 242, 233, 0.52) !important;
      font-size: 12.5px !important;
      line-height: 1.48 !important;
    }

    .drawer-list {
      gap: 8px !important;
    }

    .drawer.is-open .stagger-enter {
      opacity: 1 !important;
    }

    .drawer .drawer-link,
    .drawer .drawer-session,
    .drawer .material-row,
    .drawer .tool-row,
    .drawer .privacy-row,
    .drawer .param-card,
    .drawer-left .drawer-link,
    .drawer-left .drawer-session {
      border: 0 !important;
      border-radius: 12px !important;
      color: rgba(255, 249, 239, 0.72) !important;
      background: #1a1917 !important;
      box-shadow: none !important;
      -webkit-backdrop-filter: none !important;
      backdrop-filter: none !important;
      transition:
        background 180ms var(--ease-mech),
        color 180ms var(--ease-mech),
        transform 180ms var(--ease-mech) !important;
    }

    .drawer .drawer-link,
    .drawer .drawer-session,
    .drawer .material-row,
    .drawer .tool-row,
    .drawer .privacy-row,
    .drawer-left .drawer-link,
    .drawer-left .drawer-session {
      min-height: 42px !important;
      padding: 10px 11px !important;
    }

    .drawer .param-card {
      min-height: 78px !important;
      padding: 12px !important;
    }

    .drawer .drawer-link:hover,
    .drawer .drawer-session:hover,
    .drawer .material-row:hover,
    .drawer .tool-row:hover,
    .drawer .privacy-row:hover,
    .drawer .param-card:hover,
    .drawer-left .drawer-link:hover,
    .drawer-left .drawer-session:hover {
      color: #1a0b07 !important;
      border-color: transparent !important;
      background: #ff6330 !important;
      box-shadow: none !important;
      transform: translate3d(0, -1px, 0) !important;
    }

    .drawer .drawer-link:active,
    .drawer .drawer-session:active,
    .drawer .material-row:active,
    .drawer .tool-row:active,
    .drawer .privacy-row:active,
    .drawer .param-card:active,
    .drawer-left .drawer-link:active,
    .drawer-left .drawer-session:active {
      background: #df4926 !important;
      transform: translate3d(0, 1px, 0) scale(0.99) !important;
    }

    .drawer .session-meta,
    .drawer .item-meta,
    .drawer .material-type,
    .drawer .tool-state,
    .drawer .param-label,
    .drawer .unit,
    .drawer-left .session-meta,
    .drawer-left .item-meta {
      color: rgba(255, 249, 239, 0.45) !important;
      font-family: var(--font) !important;
      font-size: 10.5px !important;
      font-weight: 600 !important;
      letter-spacing: -0.006em !important;
      text-transform: none !important;
      transition: color 180ms var(--ease-mech) !important;
    }

    .drawer .param-value {
      color: rgba(255, 249, 239, 0.88) !important;
      transition: color 180ms var(--ease-mech) !important;
    }

    .drawer :is(.drawer-link, .drawer-session, .material-row, .tool-row, .privacy-row, .param-card):hover :is(.session-meta, .item-meta, .material-type, .tool-state, .param-label, .param-value, .unit),
    .drawer-left :is(.drawer-link, .drawer-session):hover :is(.session-meta, .item-meta) {
      color: rgba(26, 11, 7, 0.72) !important;
    }

    .drawer .privacy-indicator {
      border-radius: 2px !important;
      background: #ff6330 !important;
      transition: background 180ms var(--ease-mech) !important;
    }

    .drawer .privacy-row:hover .privacy-indicator {
      background: #1a0b07 !important;
    }

    .drawer .close-button,
    .drawer-left .close-button {
      justify-self: end !important;
      align-self: start !important;
      width: 40px !important;
      height: 40px !important;
      min-width: 40px !important;
      min-height: 40px !important;
      margin: 12px 12px 0 0 !important;
      border: 0 !important;
      border-radius: 12px !important;
      color: rgba(255, 249, 239, 0.86) !important;
      background: transparent !important;
      box-shadow: none !important;
      transition:
        background 180ms var(--ease-mech),
        color 180ms var(--ease-mech),
        border-color 180ms var(--ease-mech) !important;
    }

    .drawer .close-button::before,
    .drawer .close-button::after,
    .drawer-left .close-button::before,
    .drawer-left .close-button::after {
      left: 11px !important;
      right: 11px !important;
      top: 19px !important;
      height: 1.6px !important;
      background: currentColor !important;
      transition: background 180ms var(--ease-mech) !important;
    }

    .drawer .close-button:hover,
    .drawer-left .close-button:hover {
      color: #1a0b07 !important;
      border-color: #ff6330 !important;
      background: #ff6330 !important;
    }

    .drawer .close-button:active,
    .drawer-left .close-button:active {
      background: #df4926 !important;
    }

    @keyframes closeMarkSpinBefore {
      from {
        transform: rotate(45deg);
      }
      to {
        transform: rotate(405deg);
      }
    }

    @keyframes closeMarkSpinAfter {
      from {
        transform: rotate(-45deg);
      }
      to {
        transform: rotate(315deg);
      }
    }

    .floating-tool-button.is-locked,
    .floating-tool-button[aria-expanded="true"] {
      color: #1a0b07 !important;
      background: #ff6330 !important;
      transform: translate3d(0, -1px, 0) !important;
    }

    .support-popover {
      position: fixed;
      right: calc(var(--page-pad) + 78px);
      bottom: calc(var(--page-pad) + 44px);
      z-index: 43;
      width: min(330px, calc(100vw - 128px));
      border: 1px solid rgba(255, 246, 232, 0.1);
      border-radius: 12px;
      color: rgba(255, 249, 239, 0.78);
      background:
        linear-gradient(180deg, rgba(255, 246, 232, 0.035), rgba(255, 246, 232, 0.01)),
        #0b0b0a;
      box-shadow:
        0 28px 76px rgba(0, 0, 0, 0.54),
        inset 0 1px 0 rgba(255, 246, 232, 0.045);
      opacity: 0;
      pointer-events: none;
      transform: translate3d(10px, 8px, 0) scale(0.985);
      transform-origin: right bottom;
      transition:
        opacity 180ms var(--ease-mech),
        transform 180ms var(--ease-mech);
      overflow: hidden;
    }

    .support-popover.is-open {
      opacity: 1;
      pointer-events: auto;
      transform: translate3d(0, 0, 0) scale(1);
    }

    .support-header {
      display: grid;
      grid-template-columns: minmax(0, 1fr) 48px;
      border-bottom: 1px solid rgba(255, 246, 232, 0.09);
    }

    .support-title-group {
      min-width: 0;
      padding: 14px;
    }

    .support-kicker {
      margin: 0 0 7px;
      color: #ff8a35;
      font-size: 11px;
      font-weight: 650;
      line-height: 1;
      letter-spacing: 0.02em;
      text-transform: uppercase;
    }

    .support-title {
      margin: 0;
      overflow: hidden;
      color: rgba(255, 249, 239, 0.92);
      font-size: 15px;
      font-weight: 650;
      line-height: 1.2;
      letter-spacing: -0.018em;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .support-close-button {
      position: relative;
      border: 0;
      border-left: 1px solid rgba(255, 246, 232, 0.09);
      color: rgba(255, 249, 239, 0.86);
      background: transparent;
      appearance: none;
      transition:
        background 180ms var(--ease-mech),
        color 180ms var(--ease-mech),
        border-color 180ms var(--ease-mech);
    }

    .support-close-button::before,
    .support-close-button::after {
      content: "";
      position: absolute;
      left: 15px;
      right: 15px;
      top: 23px;
      height: 1.6px;
      border-radius: 2px;
      background: currentColor;
    }

    .support-close-button::before {
      transform: rotate(45deg);
    }

    .support-close-button::after {
      transform: rotate(-45deg);
    }

    .support-close-button:hover {
      color: #1a0b07;
      border-color: #ff6330;
      background: #ff6330;
    }

    .support-close-button:active {
      background: #df4926;
    }

    .drawer .close-button::before,
    .drawer .close-button::after,
    .drawer-left .close-button::before,
    .drawer-left .close-button::after,
    .support-close-button::before,
    .support-close-button::after {
      transform-origin: 50% 50% !important;
      will-change: transform;
    }

    .drawer .close-button:hover::before,
    .drawer-left .close-button:hover::before,
    .support-close-button:hover::before {
      animation: closeMarkSpinBefore 460ms var(--ease-mech) 1 both;
    }

    .drawer .close-button:hover::after,
    .drawer-left .close-button:hover::after,
    .support-close-button:hover::after {
      animation: closeMarkSpinAfter 460ms var(--ease-mech) 1 both;
    }

    .support-body {
      display: grid;
      gap: 8px;
      padding: 12px;
    }

    .support-message,
    .support-action,
    .support-input-shell {
      border: 0;
      border-radius: 12px;
      color: rgba(255, 249, 239, 0.72);
      background: #1a1917;
      box-shadow: none;
    }

    .support-message {
      padding: 11px;
      font-size: 12.5px;
      line-height: 1.48;
      letter-spacing: -0.008em;
    }

    .support-message strong {
      display: block;
      margin-bottom: 5px;
      color: rgba(255, 249, 239, 0.9);
      font-size: 12.5px;
      font-weight: 650;
    }

    .support-action {
      min-height: 38px;
      padding: 0 11px;
      text-align: left;
      font-size: 12px;
      font-weight: 610;
      letter-spacing: -0.01em;
      transition:
        background 180ms var(--ease-mech),
        color 180ms var(--ease-mech),
        transform 180ms var(--ease-mech);
    }

    .support-action:hover {
      color: #1a0b07;
      background: #ff6330;
      transform: translate3d(0, -1px, 0);
    }

    .support-input-shell {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      align-items: center;
      gap: 8px;
      min-height: 42px;
      padding: 0 6px 0 11px;
    }

    .support-input-shell input {
      min-width: 0;
      border: 0;
      outline: 0;
      color: rgba(255, 249, 239, 0.86);
      background: transparent;
      font: inherit;
      font-size: 12.5px;
      letter-spacing: -0.01em;
    }

    .support-input-shell input::placeholder {
      color: rgba(255, 249, 239, 0.34);
    }

    .support-send-button {
      min-width: 50px;
      height: 30px;
      border: 0;
      border-radius: 9px;
      color: rgba(255, 249, 239, 0.72);
      background: #24221f;
      font-size: 11.5px;
      font-weight: 650;
      transition:
        background 180ms var(--ease-mech),
        color 180ms var(--ease-mech),
        transform 180ms var(--ease-mech);
    }

    .support-send-button:hover {
      color: #1a0b07;
      background: #ff6330;
      transform: translate3d(0, -1px, 0);
    }

    @media (max-width: 860px) {
      .support-popover {
        right: calc(var(--page-pad) + 72px);
        bottom: calc(var(--page-pad) + 16px);
        width: min(300px, calc(100vw - 104px));
      }
    }

    @media (prefers-reduced-motion: reduce) {
      .drawer .close-button:hover::before,
      .drawer .close-button:hover::after,
      .drawer-left .close-button:hover::before,
      .drawer-left .close-button:hover::after,
      .support-close-button:hover::before,
      .support-close-button:hover::after {
        animation: none !important;
      }
    }

    @media (max-width: 1120px) {
      .app-shell {
        grid-template-columns: 248px minmax(0, 1fr) !important;
      }

      .sidebar-brand-row {
        grid-template-columns: 42px minmax(0, 1fr) 32px !important;
        gap: 9px !important;
      }

      .sidebar-avatar {
        width: 42px;
        height: 42px;
      }

      .avatar-pixel-mark {
        left: 11px;
        top: 16px;
        transform: scale(0.88);
        transform-origin: left top;
      }

      .sidebar-search {
        margin-inline: 0 !important;
        padding-inline: 11px !important;
      }

      .app-sidebar .side-label {
        margin-inline: 4px !important;
      }

      .app-sidebar .side-link {
        padding-inline: 9px !important;
      }
    }

    /* Empty-state command hint and custom caret. */
    .app-workspace .pixel-prompt,
    .app-workspace .caret-mirror,
    .app-workspace .pixel-caret {
      position: absolute !important;
      pointer-events: none !important;
    }

    .app-workspace .pixel-prompt,
    .app-workspace .caret-mirror {
      left: 0 !important;
      right: 0 !important;
      top: 0 !important;
      min-height: 78px !important;
      box-sizing: border-box !important;
      padding: 22px 24px 6px !important;
      overflow: hidden !important;
      font-size: 18px !important;
      line-height: 1.35 !important;
      letter-spacing: -0.02em !important;
      white-space: pre-wrap !important;
      overflow-wrap: break-word !important;
      word-break: break-word !important;
    }

    .app-workspace .pixel-prompt {
      z-index: 3 !important;
      color: rgba(246, 242, 233, 0.5) !important;
      font-family: var(--font) !important;
      font-weight: 430 !important;
      opacity: 1 !important;
      text-shadow: none !important;
      filter: none !important;
      transition: opacity 120ms var(--ease-mech) !important;
    }

    .app-workspace .pixel-prompt.is-hidden {
      opacity: 0 !important;
    }

    .app-workspace .caret-mirror {
      z-index: -1 !important;
      visibility: hidden !important;
      color: transparent !important;
      background: transparent !important;
      font-family: var(--font) !important;
      font-weight: 430 !important;
      contain: layout paint style !important;
    }

    .app-workspace .pixel-caret {
      left: 0 !important;
      top: 0 !important;
      z-index: 4 !important;
      width: 2px !important;
      height: 24px;
      border-radius: 1px !important;
      background: #ff6a33 !important;
      box-shadow:
        0 0 0 1px rgba(255, 205, 128, 0.12),
        0 0 9px rgba(255, 106, 51, 0.46),
        0 0 18px rgba(255, 176, 63, 0.18) !important;
      opacity: 0;
      transform: translate3d(24px, 22px, 0);
      will-change: transform, opacity !important;
    }

    .app-workspace .pixel-caret.is-visible {
      opacity: 1;
      animation: pixelCaretPulse 940ms steps(2, end) infinite !important;
    }

    .app-workspace .command-input {
      caret-color: transparent !important;
    }

    @keyframes pixelCaretPulse {
      0%, 46% {
        opacity: 1;
      }
      47%, 100% {
        opacity: 0;
      }
    }

/* ===== VP-UI-030: Ask response area ===== */

#ask-response-area {
  margin-top: 20px;
  border-top: 1px solid var(--line);
  padding-top: 18px;
  position: relative;
  z-index: 28;
}

.response-card {
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 16px 18px;
  margin-bottom: 12px;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.035), rgba(255,255,255,0.015)),
    rgba(8, 8, 8, 0.94);
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.42);
  backdrop-filter: blur(12px);
}

.conversation-thread {
  display: grid;
  gap: 16px;
}

.conversation-question,
.conversation-answer {
  min-width: 0;
}

.conversation-question {
  border-left: 3px solid rgba(255, 138, 53, 0.72);
  padding: 12px 14px;
  background: rgba(255, 138, 53, 0.06);
}

.conversation-turn-label {
  margin-bottom: 7px;
  color: var(--muted-2, #62635f);
  font-size: 11px;
  font-weight: 650;
}

.conversation-question-body {
  color: var(--text, #f2f0ea);
  font-size: 14px;
  line-height: 1.55;
  white-space: pre-wrap;
}

.conversation-answer .response-card {
  margin-bottom: 0;
}

.conversation-pending .response-card {
  border-color: rgba(71, 230, 214, 0.34);
}

.response-card-thinking {
  border-color: rgba(71, 230, 214, 0.34);
  background: linear-gradient(180deg, rgba(71, 230, 214, 0.075), rgba(8, 8, 8, 0.94));
}

.thinking-question {
  margin-bottom: 12px;
  color: var(--muted, #aaa9a2);
  font-size: 13px;
  line-height: 1.55;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.thinking-state-line {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 14px;
}

.thinking-state-label,
.thinking-terminal-title {
  color: #d9fff8;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.45;
}

.thinking-state-elapsed {
  flex: 0 0 auto;
  color: var(--muted-2, #777871);
  font-size: 11px;
  white-space: nowrap;
}

.thinking-state-hint,
.thinking-terminal-detail {
  margin-top: 8px;
  color: var(--muted, #aaa9a2);
  font-size: 12px;
  line-height: 1.5;
}

.thinking-state-actions,
.thinking-terminal-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}

.thinking-stop-button,
.thinking-retry-button {
  min-height: 44px;
  min-width: 44px;
}

.thinking-stop-button:focus-visible,
.thinking-retry-button:focus-visible {
  outline: 2px solid rgba(71, 230, 214, 0.86);
  outline-offset: 2px;
}

.conversation-terminal-error .response-card {
  border-color: rgba(255, 138, 53, 0.48);
}

.conversation-terminal-cancelled .response-card {
  border-color: rgba(71, 230, 214, 0.38);
}

@media (max-width: 640px) {
  .thinking-state-line,
  .thinking-state-actions,
  .thinking-terminal-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .thinking-state-elapsed {
    white-space: normal;
  }

  .thinking-state-actions button,
  .thinking-terminal-actions button {
    width: 100%;
    min-height: 44px;
  }
}

/* VP-UI-049Z follow-up: cover the public Wiki and drawer interaction states. */
#designerNavMenuBtn,
#workspaceMenuButton,
#menuButton,
.app-sidebar .menu-button,
.designer-nav-link,
.drawer .close-button,
#side-close,
.drawer-link,
.wiki-nav-item,
.wiki-view-btn {
  box-sizing: border-box !important;
  min-width: 44px !important;
  min-height: 44px !important;
  height: 44px !important;
}

#sidebar-toggle-btn,
#drawer-toggle-btn,
#wiki-evidence-close,
.wiki-evidence-header .close-btn {
  box-sizing: border-box !important;
  min-width: 44px !important;
  min-height: 44px !important;
  width: 44px !important;
  height: 44px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

#designerNavMenuBtn,
#workspaceMenuButton,
#menuButton,
.app-sidebar .menu-button,
.designer-nav-link,
.drawer .close-button,
#side-close,
.drawer-link,
.wiki-nav-item,
.wiki-view-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.drawer-link,
.wiki-nav-item {
  width: 100% !important;
  padding-block: 0 !important;
  overflow-wrap: anywhere;
}

.wiki-layout,
.wiki-domain-nav,
.wiki-content,
.wiki-view-toggles {
  min-width: 0 !important;
  max-width: 100% !important;
}

@media (max-width: 640px) {
  #designerNavMenuBtn,
  #workspaceMenuButton,
  #menuButton,
  .app-sidebar .menu-button,
  .designer-nav-link,
  .drawer .close-button,
  #side-close,
  .drawer-link,
  .wiki-nav-item,
  .wiki-view-btn {
    flex: 0 1 auto !important;
  }

  .designer-nav-links,
  .wiki-view-toggles {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
  }
}

/* VP-UI-049Z containment: the sticky public rail and its menu target share an exact box. */
.designer-nav-rail {
  box-sizing: border-box !important;
  height: 44px !important;
  min-height: 44px !important;
  margin-top: 0 !important;
  top: 0 !important;
  align-items: stretch !important;
}

.designer-nav-rail .designer-nav-menu-btn {
  box-sizing: border-box !important;
  width: 44px !important;
  min-width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
  align-self: stretch !important;
  margin-block: 0 !important;
}

.wiki-layout,
.wiki-layout .wiki-evidence-drawer,
.wiki-layout .wiki-evidence-header {
  box-sizing: border-box !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

.wiki-layout .drawer-toggle-btn {
  box-sizing: border-box !important;
  flex: 0 0 44px !important;
  width: 44px !important;
  min-width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
  margin-inline-end: 0 !important;
}

.wiki-layout {
  width: 100% !important;
  grid-template-columns: minmax(0, 220px) minmax(0, 1fr) minmax(0, 380px) !important;
  overflow: hidden !important;
}

.wiki-layout.sidebar-collapsed {
  grid-template-columns: minmax(0, 56px) minmax(0, 1fr) minmax(0, 380px) !important;
}

.wiki-layout.drawer-collapsed {
  grid-template-columns: 220px minmax(0, calc(100% - 264px)) 44px !important;
}

.wiki-layout.sidebar-collapsed.drawer-collapsed {
  grid-template-columns: 56px minmax(0, calc(100% - 100px)) 44px !important;
}

#tab-wiki {
  box-sizing: border-box !important;
  width: 100vw !important;
  max-width: 100vw !important;
  min-width: 0 !important;
  overflow-x: hidden !important;
}

.wiki-layout.drawer-collapsed .wiki-evidence-drawer {
  width: 44px !important;
  max-width: 44px !important;
  min-width: 44px !important;
  transform: translateX(0) !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  overflow: hidden !important;
}

.wiki-layout.drawer-collapsed .wiki-evidence-header .close-btn {
  display: none !important;
}

.wiki-layout.drawer-collapsed #wiki-evidence-close {
  display: none !important;
}

.wiki-layout.drawer-collapsed .wiki-evidence-header > div {
  width: 44px !important;
  max-width: 44px !important;
  min-width: 44px !important;
}

.wiki-layout.drawer-collapsed .wiki-evidence-header {
  display: block !important;
  position: relative !important;
}

.wiki-layout.drawer-collapsed .wiki-evidence-header > div {
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
}

.wiki-layout .wiki-evidence-header {
  width: 100% !important;
  overflow: hidden !important;
}

/* VP-UI-049AA: do not animate layout geometry that can move touch targets off-screen. */
.wiki-layout,
.wiki-layout .wiki-domain-nav,
.wiki-layout .wiki-evidence-drawer {
  transition: none !important;
}

.wiki-layout .drawer-toggle-btn {
  transition: none !important;
}

@media (prefers-reduced-motion: reduce) {
  .conversation-pending,
  .conversation-pending .loading-dots,
  .conversation-pending .response-loading {
    animation: none;
  }
}

/* VP-UI-048A: local case workbench, separate from ask transport. */
.case-workbench{position:relative;z-index:6;display:grid;gap:16px;margin:22px auto 34px;width:min(1180px,calc(100% - 32px));color:var(--text,#f2f0ea)}
.case-workbench-head,.case-panel-heading,.case-mode-group,.case-plan-actions,.case-next-list{display:flex;align-items:center;gap:10px}.case-workbench-head{justify-content:space-between;gap:18px}.case-workbench-kicker{margin:0 0 4px;color:var(--accent,#47d7cf);font-size:11px;letter-spacing:.12em;text-transform:uppercase}.case-workbench h2,.case-workbench h3{margin:0}.case-workbench h2{font-size:clamp(20px,3vw,30px)}.case-workbench h3{font-size:14px}.case-workbench-boundary,.case-panel-note,.case-approval-boundary{margin:7px 0 0;color:var(--muted,#9da19a);font-size:12px;line-height:1.5}.case-local-badge,.case-panel-heading>span{color:var(--accent,#47d7cf);font-size:11px;white-space:nowrap}.case-mode-group{flex-wrap:wrap}.case-mode-button,.case-plan-actions button,.case-next-action{min-height:44px;border:1px solid rgba(71,215,207,.28);border-radius:4px;padding:9px 13px;color:var(--text,#f2f0ea);background:rgba(255,255,255,.04);cursor:pointer;font:inherit;font-size:12px}.case-mode-button.is-active,.case-plan-actions button[aria-pressed=true]{color:#071413;background:var(--accent,#47d7cf)}.case-mode-button:focus-visible,.case-plan-actions button:focus-visible,.case-next-action:focus-visible,#case-plan-text:focus-visible{outline:2px solid var(--accent,#47d7cf);outline-offset:2px}.case-workbench-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.case-panel,.case-next-actions{min-width:0;border:1px solid rgba(255,255,255,.1);border-radius:6px;padding:16px;background:rgba(10,15,20,.72)}.case-panel-heading{justify-content:space-between;margin-bottom:12px}.case-checklist{display:grid;gap:8px}.case-check-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;border-top:1px solid rgba(255,255,255,.08);padding-top:8px}.case-check-label{min-width:0;color:var(--text,#f2f0ea);font-size:13px}.case-check-select{min-height:44px;max-width:155px;border:1px solid rgba(255,255,255,.18);border-radius:4px;padding:7px;color:inherit;background:#151b20}.case-plan-label{display:block;margin-bottom:6px;color:var(--muted,#9da19a);font-size:11px}#case-plan-text{box-sizing:border-box;width:100%;min-height:104px;resize:vertical;border:1px solid rgba(255,255,255,.16);border-radius:4px;padding:10px;color:inherit;background:rgba(255,255,255,.04);font:inherit;line-height:1.5}.case-plan-actions{flex-wrap:wrap;margin-top:10px}.case-next-actions{display:grid;gap:10px}.case-next-list{flex-wrap:wrap}.case-next-action{display:inline-flex;align-items:center;text-align:left}
@media(max-width:820px){.case-workbench{width:min(calc(100% - 24px),620px);margin-top:12px}.case-workbench-grid{grid-template-columns:1fr}.app-workspace .hero-grid{grid-template-rows:auto minmax(0,1fr) auto!important}.app-workspace .hero-copy{grid-row:1!important}.app-workspace .geometry-stage{grid-row:2!important;max-height:220px;min-height:180px!important;opacity:.72}.app-workspace .command-zone{grid-row:3!important}.case-workbench-head{align-items:flex-start}.case-mode-group,.case-plan-actions,.case-next-list{align-items:stretch}.case-mode-button,.case-plan-actions button,.case-next-action{flex:1 1 145px}}
@media(prefers-reduced-motion:reduce){.case-mode-button,.case-plan-actions button,.case-next-action{transition:none!important;animation:none!important}}

.response-body.is-playing {
  min-height: 1.7em;
}

.response-body.is-playing::after {
  content: "";
  display: inline-block;
  width: 0.45em;
  height: 1em;
  margin-left: 0.12em;
  vertical-align: -0.1em;
  background: #ff8a35;
  animation: answerPlaybackCaret 820ms steps(2, end) infinite;
}

@keyframes answerPlaybackCaret {
  50% { opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .response-body.is-playing::after { animation: none; }
}

.deep-research-action {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 12px;
  color: var(--muted-2, #62635f);
  font-size: 11px;
}

.deep-research-button,
.deep-research-open {
  appearance: none;
  border: 1px solid rgba(255, 138, 53, 0.45);
  border-radius: 6px;
  padding: 6px 9px;
  color: rgba(255, 229, 211, 0.96);
  background: rgba(255, 138, 53, 0.1);
  cursor: pointer;
  font: inherit;
  font-weight: 650;
}

.deep-research-button:hover,
.deep-research-button:focus-visible,
.deep-research-open:hover,
.deep-research-open:focus-visible {
  border-color: rgba(255, 138, 53, 0.9);
  background: rgba(255, 138, 53, 0.2);
  outline: 0;
}

.deep-research-button:disabled {
  cursor: wait;
  opacity: 0.55;
}

.deep-research-status {
  min-width: 0;
  line-height: 1.4;
}

.workspace-help-button {
  width: 38px;
  height: 38px;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.05);
  color: var(--muted-2, #b7b5af);
  font: 700 18px/1 ui-sans-serif, system-ui, sans-serif;
  cursor: pointer;
}

.workspace-help-button:hover,
.workspace-help-button:focus-visible {
  border-color: var(--accent, #ff7a3d);
  color: var(--text, #f5f1ea);
  outline: 2px solid rgba(255, 122, 61, 0.55);
  outline-offset: 2px;
}

.driver-overlay {
  z-index: 12000 !important;
}

.driver-popover.chg-onboarding-popover {
  z-index: 12001 !important;
  width: min(320px, calc(100vw - 24px));
  max-width: calc(100vw - 24px);
  padding: 17px;
  border: 1px solid rgba(255, 122, 61, 0.62);
  border-radius: 7px;
  background: #121313;
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.48);
  color: var(--text, #f5f1ea);
}

.driver-popover.chg-onboarding-popover .driver-popover-title {
  margin: 0 34px 8px 0;
  color: #fff1e8;
  font-size: 16px;
  letter-spacing: 0;
}

.driver-popover.chg-onboarding-popover .driver-popover-description {
  color: var(--muted-2, #b7b5af);
  font-size: 13px;
  line-height: 1.6;
}

.driver-popover.chg-onboarding-popover .driver-popover-footer {
  align-items: center;
  margin-top: 14px;
}

.driver-popover.chg-onboarding-popover .driver-popover-progress-text {
  color: #d3a281;
  font-size: 11px;
}

.driver-popover.chg-onboarding-popover .driver-popover-footer-btn {
  min-width: 66px;
  min-height: 36px;
  border: 1px solid rgba(255, 122, 61, 0.6);
  border-radius: 5px;
  background: transparent;
  color: #ffe1cf;
  font-weight: 700;
}

.driver-popover.chg-onboarding-popover .driver-popover-next-btn {
  background: var(--accent, #ff7a3d);
  color: #16110e;
}

.driver-popover.chg-onboarding-popover .driver-popover-close-btn {
  color: #d3a281;
}

.driver-popover.chg-onboarding-popover button:focus-visible {
  outline: 2px solid #47d7cf;
  outline-offset: 2px;
}

.onboarding-dialog {
  width: min(430px, calc(100vw - 28px));
  margin: auto;
  padding: 0;
  border: 1px solid rgba(255, 122, 61, 0.65);
  border-radius: 7px;
  background: #121313;
  color: var(--text, #f5f1ea);
  box-shadow: 0 22px 64px rgba(0, 0, 0, 0.58);
}

.onboarding-dialog::backdrop {
  background: rgba(4, 6, 8, 0.7);
}

.onboarding-dialog-body {
  padding: 24px;
}

.onboarding-dialog h2 {
  margin: 2px 0 10px;
  color: #fff1e8;
  font-size: 21px;
  line-height: 1.3;
}

.onboarding-dialog p {
  margin: 0;
  color: var(--muted-2, #b7b5af);
  line-height: 1.65;
}

.onboarding-kicker {
  color: var(--accent, #ff7a3d) !important;
  font-size: 11px;
  font-weight: 800;
}

.onboarding-dialog-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  align-items: center;
  margin-top: 20px;
}

.onboarding-dialog-actions button,
.onboarding-tour-list button {
  min-height: 40px;
  border: 1px solid rgba(255, 122, 61, 0.62);
  border-radius: 5px;
  background: transparent;
  color: #ffe1cf;
  cursor: pointer;
  font: 700 13px/1 ui-sans-serif, system-ui, sans-serif;
}

.onboarding-dialog-actions [data-onboarding-start] {
  background: var(--accent, #ff7a3d);
  color: #16110e;
}

.onboarding-dialog-actions .onboarding-text-button {
  border-color: transparent;
  color: var(--muted-2, #b7b5af);
}

.onboarding-tour-list {
  display: grid;
  gap: 8px;
  margin-top: 16px;
}

.onboarding-tour-list button {
  display: grid;
  gap: 4px;
  padding: 13px;
  text-align: left;
}

.onboarding-tour-list span {
  color: var(--muted-2, #b7b5af);
  font-size: 12px;
  font-weight: 400;
  line-height: 1.45;
}

.onboarding-dialog button:focus-visible {
  outline: 2px solid #47d7cf;
  outline-offset: 2px;
}

@media (max-width: 680px) {
  .workspace-help-button {
    width: 36px;
    height: 36px;
  }

  .driver-popover.chg-onboarding-popover {
    width: min(300px, calc(100vw - 20px));
    max-width: calc(100vw - 20px);
    padding: 15px;
  }

  .driver-popover.chg-onboarding-popover .driver-popover-footer-btn {
    min-height: 40px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .driver-overlay,
  .driver-popover.chg-onboarding-popover,
  .onboarding-dialog {
    transition: none !important;
    animation: none !important;
  }
}

/* VP-UI-049P: keep visible interactive help/workflow controls usable on touch screens. */
#onboardingHelpButton,
.workspace-help-button,
.onboarding-dialog-actions button,
.onboarding-tour-list button,
.driver-popover.chg-onboarding-popover .driver-popover-footer-btn,
.deep-research-button,
.deep-research-open,
.thinking-stop-button,
.thinking-retry-button,
.thinking-state-actions button,
.thinking-terminal-actions button,
.response-workflow-button,
.case-mode-button,
.case-plan-actions button,
.case-next-action,
.workspace-rail .context-button,
.workspace-rail .workspace-token-button,
.app-workspace .attach-button,
.app-workspace .inline-context-button,
.app-workspace .send-button {
  min-width: 44px;
  min-height: 44px;
}

@media (max-width: 640px) {
  #promptForm .send-button {
    box-sizing: border-box !important;
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 44px !important;
    padding: 0 !important;
  }

  #promptForm .send-button .send-arrow {
    margin: 0 !important;
  }
}

.parametric-workbench {
  margin-top: 20px;
  padding: 20px 0 4px;
  border-top: 1px solid rgba(255, 255, 255, 0.14);
  color: var(--text, #f2f0ea);
}

.parametric-heading,
.parametric-footer,
.parametric-model-meta,
.parametric-control-inputs {
  display: flex;
  align-items: center;
}

.parametric-heading {
  justify-content: space-between;
  gap: 14px;
}

.parametric-heading h3 {
  margin: 2px 0 0;
  font-size: 18px;
}

.parametric-heading button {
  width: 30px;
  height: 30px;
  border: 1px solid var(--line);
  border-radius: 4px;
  color: var(--muted-2, #a4a49e);
  background: transparent;
  cursor: pointer;
  font-size: 20px;
}

.parametric-kicker,
.parametric-status,
.parametric-model-meta,
.parametric-workbench h4,
.parametric-control small,
.parametric-saved {
  color: var(--muted-2, #94958f);
  font-size: 11px;
}

.parametric-kicker {
  color: var(--cyan, #3dd9c5);
  font-weight: 700;
}

.parametric-model-meta {
  flex-wrap: wrap;
  gap: 7px 11px;
  margin: 10px 0 14px;
}

.parametric-model-meta span:last-child {
  overflow-wrap: anywhere;
}

.parametric-status {
  border: 1px solid rgba(242, 189, 90, 0.5);
  padding: 2px 6px;
  color: #f1c779;
}

.parametric-status.approved {
  border-color: rgba(101, 214, 146, 0.6);
  color: #8ee4ad;
}

.parametric-select-label {
  display: block;
  margin-bottom: 12px;
  color: var(--muted-2, #94958f);
  font-size: 12px;
}

.parametric-select-label select {
  width: 100%;
  min-height: 36px;
  margin-top: 5px;
  border: 1px solid var(--line);
  border-radius: 4px;
  padding: 6px 8px;
  color: var(--text, #f2f0ea);
  background: rgba(0, 0, 0, 0.35);
  font: inherit;
}

.parametric-plot-shell {
  position: relative;
  min-height: 280px;
  border: 1px solid rgba(71, 230, 214, 0.25);
  background: rgba(3, 8, 12, 0.62);
}

.parametric-plot {
  display: block;
  width: 100%;
  min-height: 280px;
}

.model-plot-axis { stroke: rgba(231, 222, 213, 0.56); stroke-width: 1; }
.model-plot-series { fill: none; stroke: #47e6d6; stroke-width: 3; stroke-linejoin: round; stroke-linecap: round; }
.model-plot-marker { stroke: #ff8a35; stroke-width: 3; }
.model-plot-unknown { stroke: #f2bd5a; stroke-width: 3; stroke-dasharray: 6 5; }
.model-plot-label { fill: #f2f0ea; font: 600 16px system-ui, sans-serif; }
.model-plot-axis-label { fill: #b9c4c8; font: 13px system-ui, sans-serif; }
.model-plot-tick { fill: #838985; font: 12px ui-monospace, monospace; }
.model-plot-unknown-text { fill: #f2bd5a; font: 12px system-ui, sans-serif; }

.parametric-result {
  position: absolute;
  top: 12px;
  right: 14px;
  max-width: 46%;
  padding: 5px 8px;
  color: #ffe9dc;
  background: rgba(5, 8, 11, 0.72);
  font-size: 12px;
}

.parametric-controls {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 12px;
  margin: 14px 0;
}

.parametric-control {
  display: grid;
  gap: 6px;
  min-width: 0;
  padding: 11px;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.025);
  font-size: 13px;
}

.parametric-control-inputs { gap: 8px; }
.parametric-control input[type="range"] { min-width: 0; flex: 1; accent-color: #ff8a35; }
.parametric-control input[type="number"] {
  width: 84px;
  min-height: 30px;
  border: 1px solid var(--line);
  border-radius: 3px;
  padding: 4px 6px;
  color: var(--text, #f2f0ea);
  background: rgba(0, 0, 0, 0.4);
  font: 12px var(--mono, monospace);
}

.parametric-detail-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  padding: 14px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.parametric-detail-grid h4 { margin: 0 0 5px; }
.parametric-detail-grid p,
.parametric-detail-grid ul { margin: 0; color: #c3c8c4; font-size: 12px; }
.parametric-detail-grid ul { padding-left: 18px; }
.parametric-detail-grid span { color: #777d79; }

.parametric-footer {
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  padding: 13px 0 16px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.parametric-footer p { max-width: 650px; margin: 0; color: #a8aaa5; font-size: 12px; }
.parametric-footer > div { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; }
.parametric-empty { margin: 14px 0; color: #aeb4ae; }

@media (max-width: 720px) {
  .parametric-detail-grid { grid-template-columns: 1fr; }
  .parametric-plot-shell,
  .parametric-plot { min-height: 230px; }
  .parametric-result { position: static; max-width: none; margin: 8px; }
}

.response-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted-2, #62635f);
  margin-bottom: 8px;
}

.response-body {
  font-size: 14px;
  line-height: 1.65;
  color: var(--text, #f2f0ea);
  white-space: pre-wrap;
}

.response-citations {
  margin-top: 12px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.citation-tag {
  display: inline-flex;
  align-items: center;
  padding: 3px 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  font-size: 11px;
  font-family: var(--mono, monospace);
  color: var(--muted-2, #62635f);
  background: rgba(255,255,255,0.04);
  cursor: pointer;
  transition: border-color 0.2s ease, color 0.2s ease;
}

.citation-tag:hover {
  border-color: var(--accent, #ff3b1f);
  color: var(--text, #f2f0ea);
}

.response-meta {
  margin-top: 10px;
  font-size: 11px;
  color: var(--muted-2, #62635f);
  display: flex;
  align-items: center;
  gap: 6px;
}

.meta-sep {
  color: var(--line);
}

.response-gated {
  border-left: 3px solid var(--accent, #ff3b1f);
  margin-top: 10px;
}

.response-error {
  border-left: 3px solid var(--accent, #ff3b1f);
}

.response-answer {
  border-left: 3px solid var(--cyan, #3dd9c5);
}

.response-sources {
  margin-top: 12px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: baseline;
}

.response-workflow {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.response-workflow-button {
  min-height: 30px;
  border: 1px solid rgba(255, 138, 53, 0.28);
  border-radius: 6px;
  padding: 5px 9px;
  color: #e7ded5;
  background: rgba(255, 255, 255, 0.035);
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  transition: border-color 180ms var(--ease), background 180ms var(--ease), color 180ms var(--ease);
}

.response-workflow-button:hover,
.response-workflow-button:focus-visible {
  border-color: rgba(255, 138, 53, 0.78);
  color: #fff4eb;
  background: rgba(255, 138, 53, 0.12);
  outline: 0;
}

.sources-label {
  font-size: 11px;
  color: var(--muted-2, #62635f);
  margin-right: 4px;
}

.source-tag {
  display: inline-flex;
  align-items: center;
  padding: 3px 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  font-size: 11px;
  font-family: var(--mono, monospace);
  color: var(--muted-2, #62635f);
  background: rgba(255,255,255,0.04);
}

.response-loading {
  display: flex;
  align-items: center;
  gap: 12px;
}

.loading-dots {
  display: flex;
  gap: 4px;
}

.loading-dots span {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--accent, #ff3b1f);
  animation: dotPulse 1.4s ease-in-out infinite;
}

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

@keyframes dotPulse {
  0%, 100% { opacity: 0.2; transform: scale(0.8); }
  50% { opacity: 1; transform: scale(1.2); }
}

/* ===== VP-UI-033: Visual-system unification ===== */

/* --- Public mode: hide legacy chrome --- */
body.public-mode .app-header,
body.public-mode .tab-bar {
  display: none;
}

/* Remove residual space when legacy chrome is collapsed */
body.public-mode #app {
  padding-top: 0;
}

body.public-mode .tab-content {
  margin-top: 0;
}

/* Ask has its own industrial shell header; suppress the duplicate global rail there. */
body.public-mode[data-active-tab="ask"] .designer-nav-rail {
  display: none;
}

/* --- Designer Global Nav Rail --- */
.designer-nav-rail {
  display: flex;
  align-items: center;
  gap: 12px;
  height: 44px;
  padding: 0 16px;
  background: var(--surface);
  border-bottom: 1px solid var(--line);
  position: sticky;
  top: 0;
  z-index: 60;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

/* Hidden in internal mode (old chrome takes over) */
body:not(.public-mode) .designer-nav-rail {
  display: none;
}

/* Ensure nav rail is above drawer backdrop (z-index: 70) */
.designer-nav-rail {
  z-index: 75;
}

.designer-nav-menu-btn {
  display: flex;
  flex-direction: column;
  gap: 4px;
  width: 32px;
  height: 32px;
  padding: 6px;
  background: none;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  align-items: center;
  justify-content: center;
}

.designer-nav-menu-btn:hover {
  background: var(--surface-2);
}

.designer-nav-menu-btn span {
  display: block;
  width: 18px;
  height: 2px;
  background: var(--text);
  border-radius: 1px;
  transition: transform var(--ease) 0.2s, opacity var(--ease) 0.2s;
}

.designer-nav-menu-btn.is-open span:nth-child(1) {
  transform: translateY(6px) rotate(45deg);
}

.designer-nav-menu-btn.is-open span:nth-child(2) {
  opacity: 0;
}

.designer-nav-menu-btn.is-open span:nth-child(3) {
  transform: translateY(-6px) rotate(-45deg);
}

.designer-nav-brand {
  font-size: 13px;
  font-weight: 600;
  color: var(--text-strong);
  letter-spacing: -0.01em;
  white-space: nowrap;
}

.designer-nav-links {
  display: flex;
  gap: 2px;
  margin-left: 8px;
}

.designer-nav-link {
  padding: 4px 12px;
  border: none;
  border-radius: 6px;
  background: none;
  color: var(--muted);
  font-size: 12px;
  font-family: var(--font);
  cursor: pointer;
  transition: color var(--ease) 0.15s, background var(--ease) 0.15s;
  text-decoration: none;
}

.designer-nav-link:hover {
  color: var(--text);
  background: var(--surface-2);
}

.designer-nav-link.active {
  color: var(--text-strong);
  background: var(--surface-3);
}

.designer-nav-status {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-left: auto;
  font-size: 11px;
  color: var(--muted);
}

.designer-nav-status .dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--accent);
}

/* --- App-level drawer z-index (above tab-content) --- */
.drawer-backdrop {
  z-index: 70;
}

.drawer {
  z-index: 80;
}

/* --- Glass-panel treatment for drawer panels --- */
#menuDrawer,
#contextDrawer {
  background: rgba(9, 9, 9, 0.92);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-color: var(--line);
}

/* --- Staggered entrance animation --- */
@keyframes fadeUpIn {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.stagger-enter {
  opacity: 0;
  animation: fadeUpIn 0.35s var(--ease) forwards;
}

/* --- AC2: Wiki/Evidence visual migration --- */

/* Wiki domain nav — glass panel + designer tokens */
.wiki-domain-nav {
  background: var(--surface);
  border-right: 1px solid var(--line);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.wiki-nav-header {
  border-bottom: 1px solid var(--line);
  padding: 14px 16px;
}

.wiki-nav-header h3 {
  font-family: var(--font);
  font-size: 13px;
  font-weight: 600;
  color: var(--text-strong);
  letter-spacing: 0.02em;
}

/* Wiki metric/term cards — glass treatment */
.wiki-metric-card,
.wiki-term-card {
  background: rgba(255, 255, 255, 0.03);
  backdrop-filter: blur(var(--glass-blur, 12px));
  -webkit-backdrop-filter: blur(var(--glass-blur, 12px));
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 10px;
  padding: 14px;
  transition: border-color var(--ease) 0.2s, transform var(--ease) 0.2s;
}

.wiki-metric-card:hover,
.wiki-term-card:hover {
  border-color: rgba(255, 255, 255, 0.10);
  transform: translateY(-1px);
}

.wiki-term-card h3,
.wiki-term-card h4 {
  font-family: var(--font);
  color: var(--text-strong);
}

.wiki-term-card p {
  color: var(--muted);
  font-size: 13px;
}

/* Evidence/source cards — glass treatment */
.source-card,
.evidence-card,
.citation-source {
  background: rgba(255, 255, 255, 0.03);
  backdrop-filter: blur(var(--glass-blur, 12px));
  -webkit-backdrop-filter: blur(var(--glass-blur, 12px));
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 10px;
  padding: 14px;
  transition: border-color var(--ease) 0.2s;
}

.source-card:hover,
.evidence-card:hover {
  border-color: rgba(255, 255, 255, 0.10);
}

/* Evidence/source card typography */
.source-card .source-label,
.evidence-card .evidence-label {
  font-family: var(--mono);
  font-size: 11px;
  color: var(--accent);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.source-card .source-text,
.evidence-card .evidence-text {
  font-family: var(--font);
  font-size: 13px;
  color: var(--text);
  line-height: 1.55;
}

/* CAD summary cards */
.cad-summary-card {
  background: rgba(255, 255, 255, 0.03);
  backdrop-filter: blur(var(--glass-blur, 12px));
  -webkit-backdrop-filter: blur(var(--glass-blur, 12px));
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 10px;
  padding: 14px;
  font-family: var(--font);
}

/* Citation detail — designer styling */
.citation-source {
  font-family: var(--font);
  font-size: 13px;
}

.citation-source .source-label {
  font-family: var(--mono);
  font-size: 11px;
  color: var(--accent);
  letter-spacing: 0.05em;
}

/* Wiki dashboard — designer surface */
.wiki-content {
  background: var(--bg);
}

.wiki-nav-list .wiki-nav-item {
  font-family: var(--font);
  font-size: 13px;
  color: var(--text);
  padding: 8px 16px;
  border-radius: 6px;
  transition: background var(--ease) 0.15s;
}

.wiki-nav-list .wiki-nav-item:hover {
  background: var(--surface-2);
}

.wiki-nav-list .wiki-nav-item.active {
  background: var(--surface-3);
  color: var(--text-strong);
}

/* Wiki evidence drawer — glass treatment */
.wiki-evidence-drawer {
  background: rgba(9, 9, 9, 0.92);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-left: 1px solid var(--line);
}

/* Reduced motion: disable animations */
@media (prefers-reduced-motion: reduce) {
  .stagger-enter {
    animation: none;
    opacity: 1;
    transform: none;
  }

  .wiki-metric-card:hover,
  .wiki-term-card:hover {
    transform: none;
  }
}

/* ===== VP-UI-035: Public usability and answer-trust hardening ===== */

.app-workspace .geometry-stage {
  isolation: isolate;
  contain: paint;
}

.app-workspace .industrial-geometry-hero {
  max-width: 100%;
}

.response-body {
  white-space: normal;
}

.response-body > :first-child {
  margin-top: 0;
}

.response-body > :last-child {
  margin-bottom: 0;
}

.response-body h2,
.response-body h3,
.response-body h4 {
  margin: 22px 0 10px;
  color: var(--text-strong, #f2f0ea);
  font-weight: 700;
  line-height: 1.32;
}

.response-body h2 { font-size: 18px; }
.response-body h3 { font-size: 16px; }
.response-body h4 { font-size: 14px; }

.response-body p,
.response-body ul,
.response-body ol,
.response-body blockquote {
  margin: 0 0 12px;
}

.response-body ul,
.response-body ol {
  padding-left: 22px;
}

.response-body li + li {
  margin-top: 5px;
}

.response-body blockquote {
  border-left: 2px solid rgba(255, 138, 53, 0.62);
  padding-left: 12px;
  color: rgba(242, 240, 234, 0.76);
}

.response-body code {
  border-radius: 4px;
  padding: 1px 4px;
  color: #ffd9bd;
  background: rgba(255, 138, 53, 0.12);
  font-family: var(--mono, monospace);
  font-size: 0.92em;
}

.source-tag {
  appearance: none;
  cursor: pointer;
  text-align: left;
  transition: border-color 160ms var(--ease), color 160ms var(--ease), background 160ms var(--ease);
}

.source-tag:hover,
.source-tag:focus-visible {
  border-color: rgba(255, 138, 53, 0.68);
  color: var(--text-strong, #f2f0ea);
  background: rgba(255, 138, 53, 0.12);
  outline: 0;
}

@media (min-width: 861px) {
  .app-sidebar .menu-button {
    display: none !important;
  }

  .app-sidebar .sidebar-brand-row {
    grid-template-columns: 48px minmax(0, 1fr) !important;
  }

  .app-workspace .hero-grid,
  .app-workspace .geometry-stage {
    min-height: clamp(360px, calc(100dvh - 300px), 500px);
  }
}

.app-workspace.has-ask-response .geometry-stage,
body.has-ask-response .app-workspace .geometry-stage {
  display: none !important;
}

.app-workspace.has-ask-response .hero-grid {
  grid-template-rows: auto auto;
  min-height: 0;
  padding-top: 12px;
}

.app-workspace.has-ask-response .command-zone {
  grid-row: 1;
  align-self: start;
  margin-top: 0;
}

.app-workspace.has-ask-response .module-strip {
  grid-row: 2;
}

@media (max-width: 860px) {
  .page {
    padding: 8px !important;
  }

  .industrial-frame.app-shell {
    min-height: 0 !important;
    border-radius: 8px !important;
  }

  .workspace-rail {
    padding: 12px !important;
  }

  .app-workspace .geometry-stage {
    min-height: 260px !important;
    border-radius: 6px;
  }

  .app-workspace .industrial-geometry-hero {
    inset: 0 !important;
    transform: none !important;
  }

  .app-workspace .command-zone {
    z-index: 16;
    margin: 12px 0 16px !important;
  }

  .app-workspace .module-strip {
    margin-bottom: 8px;
  }

  .drawer {
    top: 12px !important;
    bottom: 12px !important;
    width: calc(100vw - 24px) !important;
    max-width: none !important;
  }

  .drawer-left { left: 12px !important; }
  .drawer-right { right: 12px !important; }

  .drawer-header {
    grid-template-columns: minmax(0, 1fr) 48px !important;
  }

  .drawer .close-button,
  .drawer-left .close-button {
    width: 40px !important;
    height: 40px !important;
    align-self: start;
    margin: 4px !important;
    border: 1px solid rgba(246, 242, 233, 0.16) !important;
    border-radius: 8px !important;
  }
}

/* ===== Persona-scoped conversation history ===== */
.conversation-history {
  display: grid;
  min-height: 0;
  gap: 8px;
  margin-top: 14px;
}

.conversation-history-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: rgba(246, 242, 233, 0.56);
  font-size: 11px;
  font-weight: 650;
}

.conversation-account {
  max-width: 104px;
  overflow: hidden;
  color: rgba(255, 177, 125, 0.86);
  font-family: var(--mono, monospace);
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.conversation-list {
  display: grid;
  max-height: min(34dvh, 250px);
  gap: 4px;
  overflow-y: auto;
  padding-right: 2px;
}

.conversation-empty {
  margin: 0;
  color: rgba(246, 242, 233, 0.38);
  font-size: 11px;
  line-height: 1.45;
}

.conversation-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 36px;
  border: 1px solid transparent;
  border-radius: 6px;
  padding: 7px 8px;
  color: rgba(246, 242, 233, 0.7);
  background: rgba(255, 255, 255, 0.025);
  cursor: pointer;
  text-align: left;
}

.conversation-item:hover,
.conversation-item:focus-visible,
.conversation-item.is-active {
  border-color: rgba(255, 125, 65, 0.38);
  color: rgba(255, 248, 238, 0.94);
  background: rgba(255, 104, 55, 0.1);
  outline: 0;
}

.conversation-title {
  overflow: hidden;
  font-size: 11px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.conversation-title-wrap {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 6px;
}

.conversation-title-wrap .conversation-title {
  min-width: 0;
  flex: 1;
}

.conversation-report-badge {
  flex: 0 0 auto;
  border: 1px solid rgba(255, 138, 53, 0.42);
  border-radius: 4px;
  padding: 2px 4px;
  color: rgba(255, 193, 145, 0.9);
  font-size: 8px;
  line-height: 1;
}

.conversation-date {
  color: rgba(246, 242, 233, 0.34);
  font-family: var(--mono, monospace);
  font-size: 9px;
}

@media (max-width: 860px) {
  .conversation-history {
    display: none;
  }
}

@media (max-width: 640px) {
  .workspace-rail {
    gap: 12px !important;
  }

  .workspace-tabs {
    width: 100%;
    min-height: 28px !important;
    align-items: center !important;
    gap: 0 !important;
  }

  .workspace-menu-button {
    margin: 0 14px 0 0 !important;
  }

  .workspace-tab {
    flex: 0 0 auto;
    padding: 0 14px 0 0 !important;
    font-size: 14px !important;
  }

  .workspace-status {
    width: 100% !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 8px !important;
  }

  .workspace-status .model-pills {
    flex: 1 1 auto !important;
    overflow: hidden !important;
    gap: 8px !important;
  }

  .workspace-status .model-pill {
    display: none !important;
  }

  .workspace-status .model-pill.is-active {
    display: inline-flex !important;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .workspace-rail .workspace-mode-toggle,
  .workspace-rail .workspace-token-button,
  .workspace-rail .context-button {
    min-width: 0 !important;
    padding: 0 11px !important;
  }

  .workspace-token-button {
    font-size: 0 !important;
  }

  .workspace-token-button::before {
    content: "令";
    font-size: 13px;
  }

  .app-workspace .geometry-stage {
    min-height: 230px !important;
  }

  .app-workspace .command-input {
    min-height: 94px !important;
    padding: 18px 18px 6px !important;
  }

  .app-workspace .module-strip {
    gap: 8px;
  }

  .app-workspace .capability-module {
    min-height: 0;
  }

  #tab-wiki .wiki-layout {
    display: block !important;
    height: auto !important;
    overflow: visible !important;
  }

  #tab-wiki .wiki-domain-nav,
  #tab-wiki .wiki-evidence-drawer {
    display: none !important;
  }

  #tab-wiki .wiki-content {
    min-height: 0;
    overflow: visible;
    padding: 20px 16px 32px;
  }

  #tab-sources .sources-container {
    padding: 20px 16px 32px;
  }

  .designer-nav-rail {
    gap: 6px;
    padding: 0 10px;
    overflow: hidden;
  }

  .designer-nav-brand {
    display: none;
  }

  .designer-nav-links {
    flex: 1 1 auto;
    justify-content: space-between;
    gap: 0;
    margin-left: 0;
  }

  .designer-nav-link {
    padding: 10px 8px;
    font-size: 13px;
    white-space: nowrap;
  }

  .designer-nav-status {
    width: 8px;
    margin-left: 0;
    font-size: 0;
  }
}
/* VP-UI-049Q: final mobile geometry guard for the rendered shell. */
@media (max-width: 640px) {
  .app-shell {
    max-width: 100%;
    overflow-x: clip;
  }

  .app-shell button,
  .app-shell input,
  .app-shell select,
  .app-shell textarea,
  .app-shell a.workspace-tab,
  .onboarding-dialog button,
  .driver-popover.chg-onboarding-popover button {
    box-sizing: border-box;
    min-width: 44px !important;
    min-height: 44px !important;
  }

  .workspace-rail,
  .workspace-tabs,
  .workspace-status,
  .app-workspace .command-zone,
  .app-workspace .suggestions {
    box-sizing: border-box;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .designer-nav-rail,
  .designer-nav-links {
    box-sizing: border-box;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .designer-nav-menu-btn,
  .designer-nav-link {
    box-sizing: border-box;
    min-width: 44px !important;
    min-height: 44px !important;
  }

  .workspace-tabs {
    flex-wrap: wrap !important;
    row-gap: 6px !important;
  }

  .workspace-tabs > .workspace-tab {
    flex: 1 1 auto !important;
    justify-content: center !important;
    min-width: 44px !important;
    max-width: 100% !important;
    overflow-wrap: anywhere;
    padding-inline: 8px !important;
    text-align: center;
  }

  .workspace-menu-button {
    flex: 0 0 44px !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    margin-right: 4px !important;
  }

  .workspace-status {
    flex-wrap: wrap !important;
  }

  .app-workspace .suggestions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    overflow: hidden;
  }

  .app-workspace .suggestion-chip {
    max-width: 100%;
    overflow-wrap: anywhere;
    white-space: normal;
  }

  #workspace-live-mode-toggle,
  #topContextButton,
  #workspace-token-button {
    min-width: 44px !important;
    min-height: 44px !important;
    height: 44px !important;
  }

  #side-close,
  .drawer .close-button,
  .drawer-left .close-button {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
  }

  .drawer,
  .drawer-link {
    box-sizing: border-box;
    max-width: calc(100vw - 24px) !important;
  }

  #menuDrawer.drawer-left {
    box-sizing: border-box;
    left: 12px !important;
    width: calc(100vw - 24px) !important;
    max-width: calc(100vw - 24px) !important;
  }

  #menuDrawer.drawer-left:not(.is-open) {
    transform: translateX(calc(-100% - 32px)) !important;
  }

  #menuDrawer.drawer-left.is-open {
    transform: translateX(0) !important;
  }

  #menuDrawer .drawer-header,
  #menuDrawer .drawer-list {
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .drawer-link {
    width: 100%;
    min-width: 44px !important;
    min-height: 44px !important;
    overflow-wrap: anywhere;
  }
}

/* VP-UI-049X: the primary composer action is a stable touch target at every viewport. */
#promptForm .send-button {
  width: 44px !important;
  min-width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
  display: grid !important;
  place-items: center !important;
  flex: 0 0 44px !important;
}

/* VP-UI-049Z: keep visible workflow controls touchable at every viewport. */
#newProjectQuery,
.workspace-tabs > .workspace-tab,
.app-workspace .suggestion-chip,
.response-workflow-button,
.wiki-view-btn {
  box-sizing: border-box !important;
  min-width: 44px !important;
  min-height: 44px !important;
  height: 44px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1.2 !important;
}

.workspace-tabs,
.app-workspace .suggestions,
.response-workflow,
.wiki-view-toggles {
  min-width: 0 !important;
  max-width: 100% !important;
  flex-wrap: wrap !important;
}

.workspace-tabs > .workspace-tab,
.app-workspace .suggestion-chip,
.response-workflow-button,
.wiki-view-btn {
  padding-block: 0 !important;
  overflow-wrap: anywhere;
  white-space: normal;
}

@media (max-width: 640px) {
  .workspace-tabs > .workspace-tab,
  .app-workspace .suggestion-chip,
  .response-workflow-button,
  .wiki-view-btn {
    flex: 1 1 44px !important;
    max-width: 100% !important;
  }

  .app-workspace .suggestions,
  .response-workflow,
  .wiki-view-toggles {
    gap: 8px !important;
  }
}
