:root {
      --bg: #090907;
      --panel: #15130f;
      --panel-2: #1e1a13;
      --card: #f7f1e4;
      --card-2: #efe3cf;
      --ink: #fff9ee;
      --muted: rgba(255,249,238,.64);
      --soft: rgba(255,249,238,.12);
      --line: rgba(255,249,238,.14);
      --gold: #d7b46a;
      --gold-2: #f2d58b;
      --rose: #d88a9d;
      --green: #9bc7a4;
      --blue: #8fb4d9;
      --shadow: 0 18px 48px rgba(0,0,0,.26);
      --shadow-soft: 0 10px 28px rgba(0,0,0,.18);
      --radius: 10px;
      --radius-soft: 14px;
    }

    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; }
    html[data-initial-route="content-workbench"] #desk,
    html[data-initial-route="xhs-workbench"] #desk,
    html[data-initial-route="image-workbench"] #desk { display: none !important; }
    html[data-initial-route="content-workbench"] #content,
    html[data-initial-route="xhs-workbench"] #content,
    html[data-initial-route="image-workbench"] #images { display: block !important; }
    html[data-initial-route] body { background-color: #090907; }
    .workbench-first-paint-shell[hidden] { display: none !important; }
    .workbench-first-paint-shell { width: min(100%, 1480px); min-height: 560px; margin: 0 auto; padding: 28px 32px; color: #f8f2e7; background: #090907; }
    .workbench-skeleton-hero { display: grid; grid-template-columns: minmax(0,1fr) repeat(3,minmax(112px,148px)); gap: 14px; align-items: end; min-height: 176px; padding: 26px; border: 1px solid rgba(216,179,106,.13); border-radius: 22px; background: radial-gradient(circle at 75% 0,rgba(216,179,106,.08),transparent 34%),#11100e; }
    .workbench-skeleton-copy { display: grid; gap: 12px; align-self: center; }
    .workbench-skeleton-line,.workbench-skeleton-stat,.workbench-skeleton-card { background: linear-gradient(100deg,rgba(255,249,238,.055),rgba(216,179,106,.095),rgba(255,249,238,.055)); background-size: 220% 100%; }
    .workbench-skeleton-line { display:block; width:min(420px,72%); height:14px; border-radius:999px; }
    .workbench-skeleton-line.title { width:min(520px,88%); height:28px; }
    .workbench-skeleton-stat { height:92px; border:1px solid rgba(216,179,106,.1); border-radius:15px; }
    .workbench-skeleton-quick { margin-top:18px; padding:20px; border:1px solid rgba(216,179,106,.1); border-radius:22px; background:#0e0e0c; }
    .workbench-skeleton-heading { width:180px; height:18px; margin-bottom:16px; border-radius:999px; background:rgba(216,179,106,.09); }
    .workbench-skeleton-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
    .workbench-skeleton-card { height:230px; border:1px solid rgba(216,179,106,.1); border-radius:18px; }
    .workbench-load-error { display:grid; align-content:center; min-height:420px; }
    .workbench-load-error > div { padding:28px; border:1px solid rgba(229,205,154,.11); border-radius:20px; background:#151411; }
    .workbench-load-error span { color:#d8b36a; font-size:10px; letter-spacing:.17em; }
    .workbench-load-error h2 { margin:10px 0 8px; font-size:clamp(24px,3vw,34px); }
    .workbench-load-error p { margin:0; color:#aaa294; line-height:1.6; }
    .workbench-first-paint-shell button { width: max-content; min-height: 44px; margin-top: 18px; padding: 9px 16px; border: 1px solid #d8b36a; border-radius: 12px; color: #17130b; background: #d8b36a; }
    .workbench-first-paint-shell .secondary { margin-left:10px; color:#d8b36a; background:transparent; }
    @media (prefers-reduced-motion:no-preference) { .workbench-first-paint-shell:not([hidden]) .workbench-skeleton-line,.workbench-first-paint-shell:not([hidden]) .workbench-skeleton-stat,.workbench-first-paint-shell:not([hidden]) .workbench-skeleton-card { animation:workbench-skeleton-shift 1.8s ease-in-out infinite; } }
    @keyframes workbench-skeleton-shift { to { background-position:-120% 0; } }
    @media (max-width:700px) { .workbench-first-paint-shell{min-height:520px;padding:16px}.workbench-skeleton-hero{grid-template-columns:repeat(3,1fr);min-height:210px;padding:18px}.workbench-skeleton-copy{grid-column:1/-1}.workbench-skeleton-stat{height:58px}.workbench-skeleton-grid{grid-template-columns:1fr}.workbench-skeleton-card{height:150px}.workbench-skeleton-card:nth-child(n+2){display:none} }
    body {
      margin: 0;
      min-height: 100vh;
      color: var(--ink);
      background:
        radial-gradient(circle at 78% 0%, rgba(215,180,106,.12), transparent 34%),
        linear-gradient(135deg, #080806 0%, #130f0b 48%, #090807 100%);
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      letter-spacing: 0;
    }

    button, input, textarea, select { font: inherit; }
    button { cursor: pointer; }
    a { color: inherit; }

    .app {
      min-height: 100vh;
      display: grid;
      grid-template-columns: 92px minmax(0, 1fr);
    }

    .sidebar {
      position: sticky;
      top: 0;
      height: 100vh;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 14px;
      padding: 18px 10px;
      border-right: 1px solid var(--line);
      background: rgba(10,9,7,.88);
      backdrop-filter: blur(24px);
      z-index: 10;
    }

    .brand {
      width: 54px;
      height: 54px;
      display: grid;
      place-items: center;
      border: 0;
      border-radius: 18px;
      background: transparent;
      box-shadow: 0 14px 30px rgba(0,0,0,.28);
      overflow: hidden;
    }

    .brand img {
      width: 100%;
      height: 100%;
      display: block;
      object-fit: cover;
    }

    .brand-mini {
      width: 38px;
      height: 38px;
    }

    .nav {
      display: grid;
      gap: 8px;
      width: 100%;
      margin-top: 12px;
    }

    .nav button, .mobile-tabbar button {
      border: 0;
      color: var(--muted);
      background: transparent;
    }

    .nav button {
      width: 100%;
      min-height: 62px;
      display: grid;
      place-items: center;
      gap: 5px;
      border-radius: 14px;
      transition: .18s ease;
    }

    .nav i {
      font-style: normal;
      font-size: 19px;
      color: var(--gold-2);
    }

    .nav span {
      font-size: 12px;
      white-space: nowrap;
    }

    .nav button.active {
      color: var(--ink);
      background: rgba(255,249,238,.12);
      box-shadow: inset 0 0 0 1px rgba(255,249,238,.12);
    }

    main {
      min-width: 0;
      padding: 24px;
    }

    .topbar {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 14px;
      margin-bottom: 18px;
    }

    .topbar h1 {
      margin: 0;
      font-size: 19px;
      letter-spacing: .02em;
    }

    .topbar p {
      margin: 5px 0 0;
      color: var(--muted);
      font-size: 13px;
    }

    .site-notice {
      display: flex;
      align-items: center;
      gap: 12px;
      margin: -2px 0 18px;
      padding: 12px 14px;
      border: 1px solid rgba(222,186,83,.38);
      border-radius: 12px;
      background: linear-gradient(90deg, rgba(222,186,83,.13), rgba(55,43,19,.28));
      color: rgba(255,249,238,.84);
      box-shadow: inset 0 1px rgba(255,255,255,.03);
    }

    .site-notice-mark {
      flex: 0 0 auto;
      color: var(--gold-2);
      font-size: 11px;
      font-weight: 800;
      letter-spacing: .08em;
    }

    .site-notice-copy { min-width: 0; flex: 1; font-size: 13px; line-height: 1.55; }
    .site-notice-copy b { color: var(--ink); margin-right: 8px; }
    .site-notice-action { flex: 0 0 auto; color: var(--gold-2); font-size: 12px; font-weight: 700; white-space: nowrap; }
    .site-notice-close {
      flex: 0 0 auto;
      width: 44px;
      height: 44px;
      border: 0;
      border-radius: 8px;
      background: transparent;
      color: rgba(255,249,238,.65);
      cursor: pointer;
      font-size: 20px;
      line-height: 1;
    }
    .site-notice-close:hover { color: var(--ink); background: rgba(255,255,255,.07); }

    .compliance-bar {
      display: flex; align-items: center; gap: 10px; margin: -4px 0 18px; padding: 10px 14px;
      border: 1px solid rgba(255,249,238,.12); border-radius: 10px; background: rgba(255,249,238,.035);
      color: var(--muted); font-size: 12px; line-height: 1.55;
    }
    .compliance-bar strong { color: var(--gold-2); white-space: nowrap; }
    .compliance-bar button { margin-left: auto; flex: 0 0 auto; }
    .legal-modal { width: min(760px, calc(100vw - 28px)); max-height: min(760px, calc(100vh - 36px)); overflow: auto; }
    .legal-tabs { display: flex; gap: 8px; flex-wrap: wrap; padding-bottom: 12px; border-bottom: 1px solid var(--line); }
    .legal-policy { padding: 16px; border: 1px solid var(--line); border-radius: 10px; background: rgba(255,249,238,.025); line-height: 1.85; color: var(--muted); white-space: pre-wrap; }
    .legal-policy h4 { margin: 0 0 8px; color: var(--ink); font-size: 17px; }
    .legal-callout { padding: 13px 14px; border-left: 3px solid var(--gold); border-radius: 8px; background: rgba(222,186,83,.10); color: var(--ink); line-height: 1.7; font-size: 13px; }
    .ai-origin-label { display: inline-flex; align-items: center; gap: 5px; margin: 10px 0 2px; padding: 5px 8px; border: 1px solid rgba(222,186,83,.35); border-radius: 999px; color: var(--gold-2); background: rgba(222,186,83,.08); font-size: 11px; font-weight: 700; }

    .pill {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      min-height: 32px;
      padding: 7px 11px;
      border: 1px solid var(--line);
      border-radius: 12px;
      color: var(--muted);
      background: rgba(255,249,238,.045);
      font-size: 12px;
      white-space: nowrap;
    }

    .page { display: none; }
    .page.active { display: block; }

    body.admin-entry .sidebar,
    body.admin-entry .topbar,
    body.admin-entry .mobile-topbar,
    body.admin-entry .mobile-tabbar {
      display: none !important;
    }

    body.admin-entry .app {
      grid-template-columns: 1fr;
    }

    body.admin-entry main {
      width: min(1180px, calc(100vw - 36px));
      margin: 0 auto;
      padding-top: 28px;
    }

    .auth-overlay {
      position: fixed;
      inset: 0;
      z-index: 78;
      display: grid;
      place-items: center;
      padding: 18px;
      background: rgba(5, 4, 3, .48);
      backdrop-filter: blur(18px) saturate(1.12);
      -webkit-backdrop-filter: blur(18px) saturate(1.12);
    }

    body.auth-modal-open { overflow: hidden; }

    .auth-overlay::before {
      content: "";
      position: absolute;
      inset: 0;
      background:
        radial-gradient(circle at 50% 10%, rgba(215,180,106,.16), transparent 34%),
        linear-gradient(180deg, rgba(0,0,0,.12), rgba(0,0,0,.46));
      pointer-events: none;
    }

    .auth-modal {
      position: relative;
      z-index: 1;
      width: min(420px, calc(100vw - 32px));
      max-height: calc(100vh - 36px);
      overflow: auto;
      box-shadow: 0 26px 70px rgba(0,0,0,.48);
    }

    .account-summary {
      display: grid;
      gap: 12px;
      padding: 14px;
      border: 1px solid rgba(215,180,106,.2);
      border-radius: 14px;
      background: rgba(215,180,106,.08);
    }

    .account-summary strong {
      color: var(--gold-2);
      font-size: 22px;
      line-height: 1.15;
    }

    .account-summary span,
    .account-tip li {
      color: var(--muted);
      font-size: 12px;
      line-height: 1.65;
    }

    .account-tip {
      margin: 0;
      padding-left: 18px;
    }

    .recharge-card-box {
      display: grid;
      gap: 10px;
      padding: 14px;
      border: 1px solid rgba(215,180,106,.24);
      border-radius: 14px;
      background: linear-gradient(135deg, rgba(215,180,106,.12), rgba(255,249,238,.025));
    }

    .recharge-card-box h3 {
      margin: 0;
      color: var(--gold-2);
      font-size: 16px;
    }

    .recharge-card-box p {
      margin: 0;
      color: var(--muted);
      font-size: 12px;
      line-height: 1.65;
    }

    .recharge-card-box input {
      letter-spacing: .08em;
      text-transform: uppercase;
    }

    .referral-rule-box {
      display: none;
      gap: 10px;
      padding: 14px;
      border: 1px solid rgba(215,180,106,.22);
      border-radius: 14px;
      background: rgba(215,180,106,.07);
    }

    .referral-rule-box.show {
      display: grid;
    }

    .referral-rule-box strong {
      color: var(--gold-2);
      font-size: 15px;
    }

    .invite-card {
      display: grid;
      grid-template-columns: 124px minmax(0, 1fr);
      gap: 14px;
      align-items: center;
      padding: 14px;
      border: 1px solid rgba(215,180,106,.22);
      border-radius: 14px;
      background:
        linear-gradient(135deg, rgba(215,180,106,.12), rgba(255,249,238,.045)),
        rgba(255,249,238,.035);
    }

    .invite-qr {
      width: 112px;
      height: 112px;
      padding: 8px;
      border-radius: 12px;
      background: #fff;
      object-fit: contain;
    }

    .invite-copy {
      display: grid;
      gap: 8px;
      min-width: 0;
    }

    .invite-copy strong {
      color: rgba(255,249,238,.94);
      font-size: 15px;
      line-height: 1.35;
    }

    .invite-copy span {
      color: rgba(255,249,238,.58);
      font-size: 12px;
      line-height: 1.6;
    }

    .invite-copy code {
      max-width: 100%;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .invite-entry-btn {
      border-color: rgba(215,180,106,.44);
      color: #17110b;
      background: linear-gradient(135deg, #fff1bd, #d7b46a);
      box-shadow: 0 12px 30px rgba(215,180,106,.14);
    }

    .referral-dashboard {
      display: grid;
      gap: 14px;
      margin-top: 14px;
    }

    .referral-stats {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 10px;
    }

    .referral-stat,
    .referral-friend {
      border: 1px solid rgba(215,180,106,.18);
      border-radius: 14px;
      background: rgba(255,249,238,.035);
      padding: 12px;
    }

    .referral-stat strong {
      display: block;
      color: var(--gold-2);
      font-size: 20px;
      line-height: 1.2;
    }

    .referral-stat span,
    .referral-friend span {
      color: var(--muted);
      font-size: 12px;
      line-height: 1.55;
    }

    .referral-list {
      display: grid;
      gap: 10px;
    }

    .referral-friend {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 10px;
      align-items: center;
    }

    .referral-friend strong {
      color: rgba(255,249,238,.92);
      font-size: 14px;
    }

    .referral-friend em {
      font-style: normal;
      color: var(--gold-2);
      font-size: 12px;
    }

    .auth-tabs {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 6px;
      padding: 6px;
      border: 1px solid rgba(215,180,106,.24);
      border-radius: 999px;
      background: rgba(0,0,0,.26);
      box-shadow: inset 0 0 0 1px rgba(255,249,238,.035);
    }

    .auth-tab {
      min-height: 44px;
      border-radius: 999px;
      border: 0;
      color: rgba(255,249,238,.48);
      background: rgba(255,249,238,.035);
      font-weight: 800;
      transition: .18s ease;
    }

    .auth-tab.active {
      color: #17110b;
      background: linear-gradient(135deg, #fff1bd, #d7b46a);
      font-weight: 800;
      box-shadow: 0 10px 28px rgba(215,180,106,.2);
    }

    .auth-tab:not(.active):hover {
      color: rgba(255,249,238,.82);
      background: rgba(255,249,238,.07);
    }

    .auth-register-fields {
      display: none;
      gap: 12px;
    }

    .auth-register-only {
      display: none;
    }

    .auth-modal.register-mode .auth-register-fields {
      display: grid;
    }

    .auth-modal.register-mode .auth-register-only {
      display: block;
    }

    #authStatus:empty {
      display: none;
    }

    .hero {
      min-height: 360px;
      display: grid;
      grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr);
      gap: 18px;
      margin-bottom: 18px;
    }

    .hero-copy, .visual-card, .panel {
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: rgba(255,249,238,.062);
      box-shadow: var(--shadow);
    }

    .hero-copy {
      position: relative;
      overflow: hidden;
      padding: clamp(24px, 4vw, 48px);
      display: flex;
      flex-direction: column;
      justify-content: space-between;
    }

    .hero-copy::before {
      content: "";
      position: absolute;
      inset: 0;
      background:
        linear-gradient(90deg, rgba(0,0,0,.72), rgba(0,0,0,.2)),
        url("https://images.unsplash.com/photo-1522335789203-aabd1fc54bc9?auto=format&fit=crop&w=1500&q=82") center / cover;
      opacity: .56;
      z-index: -1;
    }

    .kicker {
      display: inline-flex;
      width: fit-content;
      padding: 7px 10px;
      border: 1px solid rgba(215,180,106,.36);
      border-radius: 12px;
      color: var(--gold-2);
      background: rgba(0,0,0,.24);
      font-size: 11px;
      text-transform: uppercase;
    }

    .hero h2 {
      max-width: 720px;
      margin: 22px 0 14px;
      font-size: clamp(30px, 4vw, 48px);
      line-height: 1.14;
      font-weight: 700;
    }

    .hero p, .lead {
      max-width: 700px;
      color: rgba(255,249,238,.78);
      line-height: 1.8;
      font-size: 15px;
    }

    .hero-actions, .row {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      align-items: center;
    }

    .hero-actions {
      margin-top: 30px;
      padding-top: 22px;
      border-top: 1px solid rgba(255,249,238,.1);
    }

    .hero-actions .btn {
      min-width: 168px;
      min-height: 48px;
      padding-inline: 22px;
    }

    .hero-actions .btn,
    .hero-actions .btn.primary,
    .hero-actions .btn.ghost {
      border-color: rgba(255,249,238,.16);
      color: rgba(255,249,238,.9);
      background: rgba(255,249,238,.055);
      box-shadow: none;
    }

    .hero-actions .btn:hover,
    .hero-actions .btn:focus-visible {
      border-color: rgba(215,180,106,.6);
      color: #130f09;
      background: linear-gradient(135deg, #fff0bd, #d0a44f);
      box-shadow: 0 14px 30px rgba(215,180,106,.2);
    }

    .btn {
      min-height: 42px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      padding: 10px 15px;
      border: 1px solid var(--line);
      border-radius: 999px;
      color: var(--ink);
      background: rgba(255,249,238,.06);
      transition: .18s ease;
      font-size: 13px;
      font-weight: 600;
    }

    .btn.primary {
      border-color: rgba(215,180,106,.52);
      color: #130f09;
      background: linear-gradient(135deg, #fff0bd, #d0a44f);
      font-weight: 700;
      box-shadow: 0 10px 24px rgba(215,180,106,.16);
    }

    .btn.ghost { color: var(--muted); background: rgba(255,249,238,.035); }
    .btn:hover { transform: translateY(-1px); }
    .btn:disabled { opacity: .55; cursor: not-allowed; transform: none; }

    .visual-card {
      overflow: hidden;
      min-height: 360px;
      background:
        linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.72)),
        url("https://images.unsplash.com/photo-1596462502278-27bfdc403348?auto=format&fit=crop&w=1100&q=82") center / cover;
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
      padding: 18px;
    }

    .mini-board {
      display: grid;
      gap: 10px;
      padding: 14px;
      border: 1px solid rgba(255,255,255,.16);
      border-radius: var(--radius);
      background: rgba(8,7,5,.66);
      backdrop-filter: blur(16px);
    }

    .mini-board strong { font-size: 15px; }
    .mini-board span { color: var(--muted); font-size: 12px; line-height: 1.6; }

    .luxury-hero {
      min-height: 520px;
      grid-template-columns: minmax(0, 1fr);
    }

    .hero-copy.luxury {
      min-height: 520px;
      max-width: none;
      background:
        linear-gradient(135deg, rgba(255,249,238,.08), rgba(215,180,106,.06)),
        rgba(255,249,238,.045);
    }

    .hero-copy.luxury::before {
      background:
        linear-gradient(90deg, rgba(7,6,5,.82), rgba(7,6,5,.44)),
        url("https://images.unsplash.com/photo-1512316609839-ce289d3eba0a?auto=format&fit=crop&w=1600&q=84") center / cover;
      opacity: .48;
    }

    .hero-copy.luxury h2 {
      max-width: 760px;
      font-size: clamp(32px, 3.6vw, 48px);
      line-height: 1.12;
      margin-top: 24px;
    }

    .hero-title {
      max-width: 760px;
      margin: 24px 0 14px;
    }

    .hero-title span {
      display: block;
      color: rgba(255,249,238,.78);
      font-size: clamp(20px, 2.1vw, 30px);
      font-weight: 700;
      line-height: 1.25;
    }

    .hero-title strong {
      display: block;
      margin-top: 6px;
      color: rgba(255,249,238,.98);
      font-size: clamp(38px, 4.2vw, 56px);
      font-weight: 800;
      line-height: 1;
      white-space: nowrap;
    }

    .hero-title.brand-platform-title {
      margin-bottom: 18px;
    }

    .hero-title.brand-platform-title span {
      color: rgba(255,241,206,.9);
      font-size: clamp(19px, 1.7vw, 26px);
      font-weight: 650;
    }

    .hero-title.brand-platform-title strong {
      margin-top: 8px;
      font-size: clamp(46px, 4.7vw, 66px);
      font-weight: 800;
      line-height: .98;
    }

    .hero-subtitle {
      max-width: 620px;
      display: grid;
      gap: 12px;
      margin: 10px 0 0;
      color: rgba(255,249,238,.8);
    }

    .hero-subtitle p {
      max-width: 560px;
      margin: 0;
      font-size: 15px;
      line-height: 1.9;
      color: rgba(255,249,238,.82);
    }

    .hero-subtitle p strong {
      color: var(--gold-2);
      font-weight: 700;
    }

    .hero-subtitle.brand-platform-slogan {
      gap: 14px;
      margin-top: 0;
    }

    .hero-subtitle.brand-platform-slogan p {
      max-width: 640px;
      padding-left: 14px;
      border-left: 2px solid rgba(224,190,108,.72);
      font-size: 16px;
      line-height: 1.7;
    }

    .hero-subtitle.brand-platform-slogan p strong {
      font-size: 18px;
      letter-spacing: 0;
    }

    .hero-subtitle-tags {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
    }

    .hero-subtitle-tags span {
      display: inline-flex;
      align-items: center;
      min-height: 30px;
      padding: 6px 10px;
      border: 1px solid rgba(215,180,106,.28);
      border-radius: 999px;
      color: rgba(255,249,238,.78);
      background: rgba(0,0,0,.24);
      font-size: 12px;
      white-space: nowrap;
    }

    .hero-note {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 14px;
      margin: 34px 0 0;
    }

    .hero-note span {
      min-height: 92px;
      padding: 18px;
      border: 1px solid rgba(255,249,238,.12);
      border-radius: 14px;
      background: rgba(8,7,5,.34);
      color: rgba(255,249,238,.7);
      font-size: 13px;
      line-height: 1.7;
      backdrop-filter: blur(16px);
    }

    .hero-note b {
      display: block;
      margin-bottom: 8px;
      color: rgba(255,249,238,.94);
      font-size: 15px;
    }

    .hero-showcase {
      position: relative;
      min-height: 520px;
      overflow: hidden;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background:
        linear-gradient(135deg, rgba(255,249,238,.075), rgba(215,180,106,.055)),
        rgba(8,7,5,.76);
      box-shadow: var(--shadow);
    }

    .showcase-photo {
      position: absolute;
      inset: 18px 18px 148px;
      overflow: hidden;
      border-radius: var(--radius-soft);
      border: 1px solid rgba(255,249,238,.14);
      background:
        linear-gradient(180deg, rgba(0,0,0,.02), rgba(0,0,0,.42)),
        url("https://images.unsplash.com/photo-1524504388940-b1c1722653e1?auto=format&fit=crop&w=1300&q=84") center top / cover;
    }

    .showcase-photo::after {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(180deg, transparent 42%, rgba(7,6,5,.88));
    }

    .showcase-card {
      position: absolute;
      left: 34px;
      right: 34px;
      bottom: 28px;
      display: grid;
      gap: 12px;
      padding: 16px;
      border: 1px solid rgba(255,249,238,.16);
      border-radius: var(--radius-soft);
      background: rgba(9,8,6,.72);
      backdrop-filter: blur(22px);
      box-shadow: 0 22px 50px rgba(0,0,0,.32);
    }

    .showcase-card h3 {
      margin: 0;
      font-size: 18px;
    }

    .showcase-card p {
      margin: 0;
      color: rgba(255,249,238,.66);
      font-size: 12px;
      line-height: 1.6;
    }

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

    .workflow-ribbon span {
      padding: 9px 8px;
      border: 1px solid rgba(215,180,106,.22);
      border-radius: 10px;
      background: rgba(215,180,106,.08);
      color: rgba(255,249,238,.78);
      font-size: 11px;
      text-align: center;
    }

    .home-product-intro {
      display: grid;
      grid-template-columns: minmax(420px, .98fr) minmax(480px, 1.02fr);
      min-height: 560px;
      overflow: hidden;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background:
        radial-gradient(circle at 68% 22%, rgba(224,190,108,.16), transparent 30%),
        linear-gradient(135deg, rgba(255,249,238,.065), rgba(215,180,106,.025)),
        #100f0c;
      box-shadow: var(--shadow);
    }

    .home-product-copy {
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      padding: clamp(30px, 4vw, 62px);
      border-right: 1px solid rgba(255,249,238,.1);
    }

    .home-product-copy h2 {
      max-width: 640px;
      margin: 22px 0 18px;
      color: rgba(255,249,238,.98);
      font-size: clamp(38px, 3.25vw, 54px);
      line-height: 1.1;
      letter-spacing: 0;
    }

    .home-product-copy h2 span {
      display: block;
      margin-bottom: 12px;
      color: var(--gold-2);
      font-size: clamp(17px, 1.55vw, 23px);
      font-weight: 700;
      line-height: 1.2;
    }

    .home-product-copy .lead {
      max-width: 500px;
      margin: 0;
      color: rgba(255,249,238,.72);
      font-size: 15px;
      line-height: 1.85;
    }

    .home-product-flow {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 8px;
      margin-top: 30px;
    }

    .home-product-flow span {
      min-height: 78px;
      padding: 13px 12px;
      border: 1px solid rgba(255,249,238,.12);
      border-radius: 10px;
      background: rgba(255,249,238,.035);
      color: rgba(255,249,238,.68);
      font-size: 12px;
      line-height: 1.55;
    }

    .home-product-flow b {
      display: block;
      margin-bottom: 5px;
      color: rgba(255,249,238,.96);
      font-size: 13px;
    }

    .home-product-route {
      display: flex;
      align-items: center;
      gap: 11px;
      margin-top: 28px;
      color: rgba(255,249,238,.62);
      font-size: 14px;
      font-weight: 650;
    }

    .home-product-route b { color: rgba(255,249,238,.95); }
    .home-product-route i {
      color: var(--gold);
      font-size: 18px;
      font-style: normal;
    }

    .home-product-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      margin-top: 30px;
    }

    .home-product-actions .btn { min-height: 42px; }

    .home-product-visual {
      position: relative;
      min-height: 560px;
      padding: 28px;
      background:
        linear-gradient(110deg, rgba(9,8,6,.18), rgba(9,8,6,.66)),
        url("/assets/playbooks/lifestyle-cover.png") center / cover;
    }

    .home-product-visual::before {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(180deg, rgba(8,7,5,.08), rgba(8,7,5,.76));
    }

    .visual-eyebrow,
    .home-result-stack {
      position: relative;
      z-index: 1;
    }

    .visual-eyebrow {
      display: inline-flex;
      align-items: center;
      min-height: 28px;
      padding: 0 11px;
      border: 1px solid rgba(255,249,238,.25);
      border-radius: 999px;
      color: rgba(255,249,238,.88);
      background: rgba(9,8,6,.38);
      font-size: 11px;
      letter-spacing: .08em;
    }

    .home-result-stack {
      position: absolute;
      right: clamp(22px, 4vw, 54px);
      bottom: 34px;
      left: clamp(22px, 4vw, 54px);
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 10px;
    }

    .home-result-card {
      min-height: 136px;
      padding: 16px;
      border: 1px solid rgba(255,249,238,.18);
      border-radius: 12px;
      background: rgba(15,13,10,.75);
      backdrop-filter: blur(18px);
      box-shadow: 0 18px 32px rgba(0,0,0,.24);
    }

    .home-result-card em {
      display: block;
      margin-bottom: 18px;
      color: var(--gold-2);
      font-size: 11px;
      font-style: normal;
      letter-spacing: .06em;
    }

    .home-result-card b {
      display: block;
      color: rgba(255,249,238,.98);
      font-size: 15px;
      line-height: 1.35;
    }

    .home-result-card span {
      display: block;
      margin-top: 7px;
      color: rgba(255,249,238,.62);
      font-size: 12px;
      line-height: 1.55;
    }

    .home-usecases {
      margin-top: 18px;
    }

    .home-usecase-head {
      display: flex;
      align-items: end;
      justify-content: space-between;
      gap: 18px;
      margin: 0 0 12px;
    }

    .home-usecase-head h3 {
      margin: 0;
      color: rgba(255,249,238,.96);
      font-size: 20px;
    }

    .home-usecase-head p {
      margin: 5px 0 0;
      color: var(--muted);
      font-size: 13px;
    }

    .home-usecase-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 14px;
    }

    .home-usecase-card {
      position: relative;
      min-height: 290px;
      overflow: hidden;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: #171511;
      color: var(--ink);
      text-align: left;
      box-shadow: var(--shadow-soft);
    }

    .home-usecase-card img,
    .home-usecase-card video {
      width: 100%;
      height: 188px;
      display: block;
      object-fit: cover;
      background: #15130f;
    }

    .home-usecase-card > div {
      padding: 15px 16px 17px;
    }

    .home-usecase-card small {
      color: var(--gold-2);
      font-size: 11px;
      letter-spacing: .06em;
    }

    .home-usecase-card h4 {
      margin: 7px 0 6px;
      color: rgba(255,249,238,.96);
      font-size: 17px;
    }

    .home-usecase-card p {
      margin: 0;
      color: rgba(255,249,238,.62);
      font-size: 12px;
      line-height: 1.65;
    }

    .home-scene-grid {
      display: grid;
      grid-template-columns: 1.18fr .82fr;
      gap: 16px;
      align-items: stretch;
    }

    .home-feature-card {
      position: relative;
      min-height: 280px;
      overflow: hidden;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      color: var(--ink);
      text-align: left;
      background:
        linear-gradient(90deg, rgba(7,6,5,.86), rgba(7,6,5,.32)),
        url("https://images.unsplash.com/photo-1487412947147-5cebf100ffc2?auto=format&fit=crop&w=1400&q=84") center / cover;
      box-shadow: var(--shadow-soft);
    }

    .home-feature-card > div {
      position: absolute;
      left: 22px;
      right: 22px;
      bottom: 22px;
      max-width: 520px;
    }

    .home-feature-card h3 {
      margin: 10px 0 8px;
      color: rgba(255,249,238,.96);
      font-size: 24px;
      line-height: 1.25;
    }

    .home-feature-card p {
      margin: 0 0 16px;
      color: rgba(255,249,238,.72);
      font-size: 13px;
      line-height: 1.75;
    }

    .home-side-stack {
      display: grid;
      gap: 12px;
    }

    .home-side-card {
      min-height: 134px;
      display: grid;
      align-content: space-between;
      padding: 16px;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      color: var(--ink);
      text-align: left;
      background:
        linear-gradient(135deg, rgba(255,249,238,.075), rgba(215,180,106,.045)),
        rgba(255,249,238,.045);
      box-shadow: var(--shadow-soft);
    }

    .home-side-card h3 {
      margin: 8px 0 6px;
      color: rgba(255,249,238,.94);
      font-size: 17px;
    }

    .home-side-card p {
      margin: 0;
      color: rgba(255,249,238,.64);
      font-size: 12px;
      line-height: 1.65;
    }

    .grid {
      display: grid;
      gap: 14px;
    }

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

    .card, .tool-card {
      min-width: 0;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: rgba(255,249,238,.075);
      color: var(--ink);
      text-align: left;
      box-shadow: var(--shadow-soft);
    }

    .card { padding: 16px; }
    .tool-card {
      min-height: 210px;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      padding: 16px;
      transition: .18s ease;
    }

    .tool-card:hover {
      transform: translateY(-3px);
      border-color: rgba(215,180,106,.48);
      background: rgba(255,249,238,.085);
    }

    .tool-demo {
      display: grid;
      grid-template-columns: 58px 1fr;
      gap: 10px;
      align-items: center;
      margin: 12px 0 4px;
      padding: 10px;
      border: 1px solid rgba(255,249,238,.1);
      border-radius: var(--radius);
      background: linear-gradient(135deg, rgba(255,249,238,.075), rgba(215,180,106,.06));
    }

    .demo-thumb {
      width: 58px;
      height: 58px;
      border-radius: var(--radius);
      position: relative;
      overflow: hidden;
      background:
        radial-gradient(circle at 50% 28%, rgba(255,232,204,.95) 0 15%, transparent 16%),
        radial-gradient(circle at 50% 58%, rgba(214,166,136,.95) 0 30%, transparent 31%),
        linear-gradient(145deg, rgba(255,249,238,.18), rgba(174,130,68,.32));
    }

    .demo-thumb::before, .demo-thumb::after {
      content: "";
      position: absolute;
      inset: auto 10px 11px;
      height: 9px;
      border-radius: 999px;
      background: rgba(255,249,238,.58);
    }

    .demo-thumb::after {
      inset: 12px 13px auto;
      height: 18px;
      background: linear-gradient(90deg, rgba(33,25,19,.55), rgba(255,249,238,.14), rgba(33,25,19,.55));
    }

    .demo-thumb.content { background: linear-gradient(145deg, rgba(255,249,238,.2), rgba(215,180,106,.26)); }
    .demo-thumb.content::before { inset: 12px 9px auto; height: 7px; box-shadow: 0 14px rgba(255,249,238,.45), 0 28px rgba(255,249,238,.28); }
    .demo-thumb.fusion { background: radial-gradient(circle at 35% 42%, rgba(255,225,195,.95) 0 20%, transparent 21%), radial-gradient(circle at 67% 42%, rgba(255,210,170,.85) 0 18%, transparent 19%), linear-gradient(145deg, rgba(96,63,49,.6), rgba(215,180,106,.3)); }
    .demo-thumb.risk { background: linear-gradient(90deg, rgba(255,249,238,.18) 0 50%, rgba(98,63,58,.42) 50%), radial-gradient(circle at 50% 38%, rgba(255,225,195,.9) 0 24%, transparent 25%); }
    .demo-thumb.video::before { inset: 18px 20px auto; width: 0; height: 0; border-top: 10px solid transparent; border-bottom: 10px solid transparent; border-left: 16px solid rgba(255,249,238,.82); background: transparent; }

    .demo-copy strong {
      display: block;
      font-size: 12px;
      color: rgba(255,249,238,.88);
      margin-bottom: 3px;
    }

    .demo-copy span {
      display: block;
      font-size: 12px;
      color: var(--muted);
      line-height: 1.45;
    }

    .tool-top {
      display: flex;
      justify-content: space-between;
      gap: 10px;
      margin-bottom: 16px;
    }

    .icon {
      width: 42px;
      height: 42px;
      display: grid;
      place-items: center;
      border-radius: 13px;
      color: #111;
      background: linear-gradient(135deg, #fff1c0, #c69a45);
      font-weight: 800;
    }

    .tag {
      height: fit-content;
      padding: 6px 9px;
      border-radius: 999px;
      color: var(--gold-2);
      background: rgba(215,180,106,.12);
      font-size: 12px;
      white-space: nowrap;
    }

    h3, h4 { margin: 0; }
    .card h3, .tool-card h3, .panel h3 {
      font-size: 17px;
      margin-bottom: 7px;
      line-height: 1.35;
    }

    .card p, .tool-card p, .panel p {
      margin: 0;
      color: var(--muted);
      line-height: 1.7;
      font-size: 13px;
    }

    .info-card {
      box-shadow: none;
      border-color: rgba(215,180,106,.18);
      background: linear-gradient(135deg, rgba(215,180,106,.1), rgba(255,249,238,.045));
    }

    .info-card.soft {
      background: linear-gradient(135deg, rgba(255,249,238,.062), rgba(215,180,106,.035));
    }

    .refresh-label {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
    }

    .refresh-label .btn {
      padding: 8px 12px;
      font-size: 12px;
    }

    .content-guide-card {
      margin-bottom: 16px;
    }

    .content-guide-card h3 {
      margin-bottom: 12px;
    }

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

    .content-guide-item {
      padding: 12px;
      border: 1px solid rgba(255,249,238,.1);
      border-radius: var(--radius);
      background: rgba(0,0,0,.14);
    }

    .content-guide-item strong {
      display: block;
      margin-bottom: 5px;
      color: rgba(255,249,238,.92);
      font-size: 13px;
    }

    .content-guide-item span {
      display: block;
      color: var(--muted);
      font-size: 12px;
      line-height: 1.65;
    }

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

    .collapsible-guide {
      border: 1px solid rgba(215,180,106,.28);
      border-radius: var(--radius);
      background: rgba(215,180,106,.065);
      overflow: hidden;
    }

    .collapsible-guide summary {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      padding: 13px 16px;
      cursor: pointer;
      color: rgba(255,249,238,.9);
      font-weight: 800;
      list-style: none;
    }

    .collapsible-guide summary::-webkit-details-marker {
      display: none;
    }

    .collapsible-guide summary::after {
      content: "展开";
      flex: 0 0 auto;
      padding: 6px 10px;
      border: 1px solid rgba(215,180,106,.35);
      border-radius: 999px;
      color: var(--gold-1);
      font-size: 12px;
      font-weight: 700;
      background: rgba(0,0,0,.18);
    }

    .collapsible-guide[open] summary::after {
      content: "收起";
    }

    .collapsible-guide-body {
      display: grid;
      gap: 12px;
      padding: 0 16px 16px;
    }

    .collapsible-guide-body .card {
      margin: 0;
    }

    .text-result-block {
      text-align: left;
      line-height: 1.9;
      color: rgba(255,249,238,.82);
      white-space: pre-wrap;
    }

    .copy-result-list {
      display: grid;
      gap: 12px;
      text-align: left;
    }

    .copy-result-toolbar {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      margin-bottom: 12px;
    }

    .copy-result-toolbar span {
      color: var(--muted);
      font-size: 12px;
    }

    .copy-section-card {
      overflow: hidden;
      border: 1px solid rgba(255,249,238,.11);
      border-radius: 14px;
      background:
        linear-gradient(135deg, rgba(255,249,238,.052), rgba(215,180,106,.035)),
        rgba(4,3,2,.18);
    }

    .copy-section-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      padding: 10px 12px;
      border-bottom: 1px solid rgba(255,249,238,.08);
      background: rgba(215,180,106,.055);
    }

    .copy-section-head strong {
      color: rgba(255,249,238,.92);
      font-size: 14px;
    }

    .copy-section-body {
      padding: 12px;
      color: rgba(255,249,238,.78);
      font-size: 13px;
      line-height: 1.85;
      white-space: pre-wrap;
      word-break: break-word;
    }

    .copy-section-head .btn,
    .copy-result-toolbar .btn {
      min-height: 32px;
      padding: 0 12px;
      font-size: 12px;
    }

    .result-label {
      margin-bottom: 12px;
      text-align: left;
    }

    .result-label.fallback {
      margin-top: 12px;
    }

    .section-head {
      display: flex;
      justify-content: space-between;
      align-items: end;
      gap: 14px;
      margin: 24px 0 12px;
    }

    .section-head h2 {
      margin: 0;
      font-size: 22px;
      font-weight: 700;
    }

    .workspace-hero-head {
      position: relative;
      overflow: hidden;
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
      gap: 18px;
      align-items: end;
      margin: 0 0 18px;
      padding: 22px;
      border: 1px solid rgba(255,249,238,.13);
      border-radius: var(--radius);
      background:
        linear-gradient(135deg, rgba(255,249,238,.075), rgba(215,180,106,.045)),
        rgba(9,8,6,.68);
      box-shadow: var(--shadow-soft);
    }

    .workspace-hero-head::before {
      content: "";
      position: absolute;
      inset: 0;
      background:
        radial-gradient(circle at 90% 8%, rgba(215,180,106,.2), transparent 30%),
        linear-gradient(90deg, rgba(0,0,0,.18), transparent);
      pointer-events: none;
    }

    .workspace-hero-head > * {
      position: relative;
      z-index: 1;
    }

    .workspace-hero-head.video-hero {
      grid-template-columns: minmax(0, 1fr) minmax(360px, 520px);
      align-items: center;
    }

    .workspace-title-row {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 12px;
      margin-bottom: 12px;
    }

    .workspace-title-row h2 {
      margin: 0;
      color: rgba(255,249,238,.96);
      font-size: 28px;
      line-height: 1.2;
    }

    .workspace-hero-head .lead {
      max-width: 620px;
      margin: 0;
      color: rgba(255,249,238,.72);
      font-size: 14px;
      line-height: 1.75;
    }

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

    .workspace-flow span {
      min-height: 54px;
      display: grid;
      place-items: center;
      padding: 10px 8px;
      border: 1px solid rgba(215,180,106,.22);
      border-radius: 12px;
      color: rgba(255,249,238,.8);
      background: rgba(215,180,106,.075);
      font-size: 12px;
      text-align: center;
    }

    .workspace-image-explainer {
      display: grid;
      grid-template-columns: 78px 18px minmax(0, 1fr);
      gap: 10px;
      align-items: center;
      min-height: 128px;
      padding: 10px;
      border: 1px solid rgba(215,180,106,.22);
      border-radius: 14px;
      background: rgba(215,180,106,.055);
    }

    .image-explainer-input {
      position: relative;
      height: 106px;
      overflow: hidden;
      border-radius: 11px;
      border: 1px solid rgba(255,249,238,.16);
      background: #1b1914;
    }

    .image-explainer-input img {
      width: 100%;
      height: 100%;
      display: block;
      object-fit: cover;
    }

    .image-explainer-input span {
      position: absolute;
      right: 5px;
      bottom: 5px;
      padding: 3px 6px;
      border-radius: 999px;
      background: rgba(9,8,6,.78);
      color: rgba(255,249,238,.9);
      font-size: 10px;
    }

    .image-explainer-arrow {
      color: var(--gold);
      font-size: 18px;
      text-align: center;
    }

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

    .image-explainer-result div {
      min-width: 0;
      overflow: hidden;
      border: 1px solid rgba(255,249,238,.13);
      border-radius: 9px;
      background: rgba(9,8,6,.42);
    }

    .image-explainer-result img {
      width: 100%;
      height: 70px;
      display: block;
      object-fit: cover;
    }

    .image-explainer-result span {
      display: block;
      padding: 6px 4px;
      overflow: hidden;
      color: rgba(255,249,238,.82);
      font-size: 10px;
      text-align: center;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .workspace-side-actions {
      display: grid;
      gap: 10px;
    }

    .workspace-side-actions .mini-line {
      min-height: 46px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      padding: 10px 12px;
      border: 1px solid rgba(215,180,106,.2);
      border-radius: 12px;
      background: rgba(215,180,106,.07);
      color: rgba(255,249,238,.76);
      font-size: 12px;
      line-height: 1.5;
    }

    .workspace-video-demo {
      display: grid;
      grid-template-columns: minmax(300px, 1.35fr) minmax(230px, .85fr);
      gap: 20px;
      align-items: center;
      width: 100%;
      max-width: 100%;
      margin: 0;
      padding: 14px;
      border: 1px solid rgba(215,180,106,.26);
      border-radius: 18px;
      background:
        linear-gradient(135deg, rgba(215,180,106,.16), rgba(255,249,238,.045) 58%, rgba(0,0,0,.08)),
        rgba(0,0,0,.12);
      box-shadow: 0 14px 34px rgba(0,0,0,.18);
    }

    .workspace-video-demo-media {
      width: 100%;
      aspect-ratio: 16 / 9;
      overflow: hidden;
      border-radius: 14px;
      border: 1px solid rgba(255,249,238,.12);
      background: rgba(0,0,0,.3);
      box-shadow: 0 16px 34px rgba(0,0,0,.3);
    }

    .workspace-video-demo video {
      width: 100%;
      height: 100%;
      display: block;
      object-fit: cover;
    }

    .workspace-video-demo-copy {
      display: grid;
      gap: 8px;
      padding: 2px 0;
    }

    .workspace-video-demo strong {
      display: block;
      color: rgba(255,249,238,.92);
      font-size: 17px;
      line-height: 1.45;
    }

    .workspace-video-demo span {
      display: block;
      color: var(--muted);
      font-size: 12px;
      line-height: 1.55;
      max-width: 320px;
    }

    .workspace-video-demo .pill-row {
      display: flex;
      flex-wrap: wrap;
      gap: 7px;
    }

    .workspace-video-demo .pill-row b {
      padding: 5px 8px;
      border-radius: 999px;
      color: var(--gold-2);
      background: rgba(215,180,106,.14);
      font-size: 11px;
      font-weight: 600;
    }

    .toolbar {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      margin-bottom: 14px;
    }

    .chip {
      border: 1px solid var(--line);
      border-radius: 12px;
      padding: 8px 12px;
      color: var(--muted);
      background: rgba(255,249,238,.045);
    }

    .chip.active {
      color: #17110b;
      border-color: transparent;
      background: linear-gradient(135deg, #f4d98d, #d4ad58);
      font-weight: 700;
    }

    .studio {
      display: grid;
      grid-template-columns: minmax(260px, .62fr) minmax(460px, 1.38fr);
      gap: 18px;
      align-items: start;
    }

    .tool-rail {
      position: sticky;
      top: 22px;
      padding: 14px;
      border: 1px solid rgba(255,249,238,.1);
      border-radius: var(--radius);
      background:
        linear-gradient(180deg, rgba(255,249,238,.035), rgba(255,249,238,.015)),
        rgba(7,6,5,.58);
      box-shadow: none;
    }

    .tool-rail .panel-head {
      margin-bottom: 12px;
      padding-bottom: 10px;
      border-bottom: 1px solid rgba(255,249,238,.08);
    }

    .tool-rail .panel-head h3 {
      margin: 0;
      font-size: 15px;
    }

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

    .tool-nav-card {
      width: 100%;
      min-height: auto;
      display: grid;
      grid-template-columns: 36px minmax(0, 1fr);
      gap: 10px;
      align-items: center;
      padding: 11px;
      border: 1px solid rgba(255,249,238,.08);
      border-radius: 12px;
      color: rgba(255,249,238,.72);
      background: rgba(255,249,238,.035);
      text-align: left;
      box-shadow: none;
      transition: .16s ease;
    }

    .tool-nav-card:hover {
      transform: none;
      border-color: rgba(215,180,106,.28);
      background: rgba(215,180,106,.06);
    }

    .tool-nav-card.active {
      color: rgba(255,249,238,.96);
      border-color: rgba(215,180,106,.42);
      background:
        linear-gradient(135deg, rgba(215,180,106,.17), rgba(255,249,238,.055)),
        rgba(215,180,106,.055);
    }

    .tool-nav-icon {
      width: 36px;
      height: 36px;
      display: grid;
      place-items: center;
      border-radius: 11px;
      color: #17110b;
      background: linear-gradient(135deg, rgba(255,241,192,.92), rgba(198,154,69,.92));
      font-weight: 800;
      font-size: 14px;
    }

    .tool-nav-copy {
      min-width: 0;
    }

    .tool-nav-copy strong {
      display: block;
      color: inherit;
      font-size: 14px;
      line-height: 1.35;
    }

    .tool-nav-copy span {
      display: block;
      margin-top: 3px;
      color: rgba(255,249,238,.5);
      font-size: 11px;
      line-height: 1.45;
    }

    .tool-panel-shell {
      min-width: 0;
    }

    .asset-overview {
      position: relative;
      overflow: hidden;
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(220px, 300px);
      gap: 18px;
      align-items: center;
      margin-bottom: 18px;
      padding: 22px;
      border: 1px solid rgba(255,249,238,.12);
      border-radius: var(--radius);
      background:
        linear-gradient(135deg, rgba(255,249,238,.07), rgba(215,180,106,.04)),
        rgba(8,7,5,.72);
      box-shadow: var(--shadow-soft);
    }

    .asset-overview h2 {
      margin: 6px 0 8px;
      font-size: 26px;
      color: rgba(255,249,238,.95);
    }

    .asset-overview p {
      max-width: 660px;
      margin: 0;
      color: rgba(255,249,238,.7);
      font-size: 14px;
      line-height: 1.75;
    }

    .asset-quick {
      display: grid;
      gap: 8px;
    }

    .asset-quick span {
      display: block;
      padding: 10px 12px;
      border: 1px solid rgba(215,180,106,.2);
      border-radius: 12px;
      color: rgba(255,249,238,.76);
      background: rgba(215,180,106,.075);
      font-size: 12px;
      line-height: 1.45;
    }

    .asset-layout {
      display: grid;
      grid-template-columns: minmax(0, 1.22fr) minmax(260px, .78fr);
      gap: 18px;
      align-items: start;
      margin-bottom: 22px;
    }

    .asset-register-card {
      border: 1px solid rgba(215,180,106,.18);
      background:
        linear-gradient(135deg, rgba(255,249,238,.06), rgba(215,180,106,.04)),
        rgba(8,7,5,.8);
    }

    .asset-guide-card {
      padding: 16px;
      border: 1px solid rgba(255,249,238,.09);
      border-radius: var(--radius);
      background: rgba(255,249,238,.035);
    }

    .asset-guide-card h3 {
      margin-bottom: 10px;
      font-size: 15px;
    }

    .asset-guide-card p {
      padding-left: 12px;
      border-left: 2px solid rgba(215,180,106,.35);
      color: rgba(255,249,238,.62);
      font-size: 12px;
      line-height: 1.75;
    }

    .admin-overview {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(240px, 340px);
      gap: 18px;
      align-items: center;
      margin-bottom: 18px;
      padding: 22px;
      border: 1px solid rgba(255,249,238,.12);
      border-radius: var(--radius);
      background:
        linear-gradient(135deg, rgba(255,249,238,.068), rgba(215,180,106,.038)),
        rgba(8,7,5,.74);
      box-shadow: var(--shadow-soft);
    }

    .admin-overview h2 {
      margin: 6px 0 8px;
      font-size: 26px;
      color: rgba(255,249,238,.95);
    }

    .admin-overview p {
      max-width: 680px;
      margin: 0;
      color: rgba(255,249,238,.68);
      font-size: 14px;
      line-height: 1.75;
    }

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

    .admin-wallet-card {
      display: grid;
      grid-template-columns: minmax(0, 1fr);
      gap: 16px;
      align-items: center;
      margin-bottom: 16px;
      padding: 18px;
      border: 1px solid rgba(250,222,157,.36);
      border-radius: 18px;
      background: linear-gradient(135deg, rgba(250,222,157,.16), rgba(215,180,106,.06));
      box-shadow: 0 18px 45px rgba(0,0,0,.2);
    }

    .admin-wallet-card h3 {
      margin: 6px 0 4px;
      color: rgba(255,249,238,.96);
      font-size: 18px;
    }

    .admin-wallet-card p {
      margin: 0;
      color: rgba(255,249,238,.58);
      font-size: 12px;
      line-height: 1.7;
    }

    .admin-wallet-value {
      min-width: 0;
      text-align: left;
      color: var(--gold-2);
      font-size: 14px;
      font-weight: 700;
      line-height: 1.55;
      white-space: normal;
    }

    .admin-metric {
      min-height: 72px;
      padding: 12px;
      border: 1px solid rgba(215,180,106,.18);
      border-radius: 13px;
      background: rgba(215,180,106,.07);
    }

    .admin-metric strong {
      display: block;
      color: rgba(255,249,238,.94);
      font-size: 18px;
      line-height: 1.2;
    }

    .admin-metric span {
      display: block;
      margin-top: 5px;
      color: rgba(255,249,238,.55);
      font-size: 11px;
      line-height: 1.45;
    }

    .admin-layout {
      display: grid;
      grid-template-columns: minmax(260px, .72fr) minmax(520px, 1.28fr);
      gap: 18px;
      align-items: start;
    }

    .admin-login-card {
      position: sticky;
      top: 22px;
      border: 1px solid rgba(215,180,106,.2);
      background:
        linear-gradient(135deg, rgba(255,249,238,.058), rgba(215,180,106,.04)),
        rgba(8,7,5,.82);
    }

    .admin-data-card {
      min-height: 280px;
      border: 1px solid rgba(255,249,238,.11);
      background: rgba(255,249,238,.04);
    }

    body.admin-entry main { width: min(1280px, calc(100vw - 40px)); }
    .admin-layout.admin-authenticated { grid-template-columns: 1fr; }
    .admin-layout.admin-authenticated .admin-login-card { position: static; padding: 12px 16px; }
    .admin-session-bar { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
    .admin-session-bar strong { color: var(--ink); }
    .admin-session-bar span { color: var(--muted); font-size: 13px; }
    .admin-session-bar .btn { min-height: 38px; }
    .admin-data-card { width: 100%; }

    .admin-ia-shell { display: grid; grid-template-columns: 230px minmax(0,1fr); gap: 18px; align-items: start; }
    .admin-primary-nav { position: sticky; top: 18px; display: grid; gap: 7px; padding: 12px; border: 1px solid rgba(255,249,238,.1); border-radius: 16px; background: rgba(8,7,5,.55); }
    .admin-primary-nav h3 { margin: 6px 8px 10px; font-size: 15px; }
    .admin-primary-nav button { width: 100%; min-height: 43px; padding: 10px 12px; border: 0; border-radius: 10px; background: transparent; color: var(--muted); text-align: left; font-weight: 700; cursor: pointer; }
    .admin-primary-nav button:hover { background: rgba(255,249,238,.06); color: var(--ink); }
    .admin-primary-nav button.active { background: rgba(215,180,106,.17); color: var(--gold-2); box-shadow: inset 0 0 0 1px rgba(215,180,106,.26); }
    .admin-content-column { min-width: 0; }
    .admin-content-head { margin-bottom: 15px; padding: 16px 18px; border: 1px solid rgba(255,249,238,.1); border-radius: 15px; background: rgba(255,249,238,.035); }
    .admin-breadcrumb { color: var(--muted); font-size: 12px; }
    .admin-content-head h2 { margin: 7px 0 0; font-size: 23px; }
    .admin-secondary-nav { display: flex; gap: 8px; margin-top: 14px; overflow-x: auto; padding-bottom: 2px; }
    .admin-secondary-nav[hidden], .admin-module-panel[hidden] { display: none !important; }
    .admin-secondary-nav button { flex: 0 0 auto; min-height: 38px; padding: 8px 13px; border: 1px solid rgba(255,249,238,.12); border-radius: 999px; background: rgba(255,249,238,.035); color: var(--muted); cursor: pointer; }
    .admin-secondary-nav button.active { border-color: rgba(215,180,106,.45); background: rgba(215,180,106,.16); color: var(--gold-2); }
    .admin-module-stage { min-width: 0; }
    .admin-module-panel { min-width: 0; animation: admin-panel-in .18s ease; }
    .admin-module-panel > .section-head:first-child, .admin-module-panel > .panel-head:first-child { margin-top: 0; }
    .simple-playbook-manager { display: grid; grid-template-columns: minmax(250px,300px) minmax(0,1fr); gap: 18px; align-items: start; }
    .simple-playbook-sidebar, .simple-playbook-editor { border: 1px solid rgba(255,249,238,.1); border-radius: 18px; background: rgba(8,7,5,.48); padding: 16px; min-width: 0; }
    .simple-playbook-editor { padding-bottom: 104px; }
    .simple-playbook-toolbar { display: grid; gap: 10px; position: sticky; top: 12px; }
    .simple-playbook-summary { display: flex; justify-content: space-between; gap: 8px; color: var(--muted); font-size: 13px; }
    .simple-playbook-filters { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
    .simple-playbook-list { display: grid; gap: 8px; max-height: 68vh; overflow: auto; padding-right: 3px; }
    .simple-playbook-list-item { display: grid; gap: 6px; padding: 6px; border: 1px solid rgba(255,249,238,.07); border-radius: 14px; }
    .simple-playbook-list-actions { display: flex; gap: 6px; justify-content: flex-end; }
    .simple-playbook-list-actions .btn { min-height: 30px; padding: 4px 9px; font-size: 12px; }
    .simple-playbook-card { width: 100%; display: grid; grid-template-columns: 54px minmax(0,1fr); gap: 10px; text-align: left; align-items: center; border: 1px solid rgba(255,249,238,.09); border-radius: 13px; padding: 9px; background: rgba(255,249,238,.035); color: inherit; cursor: pointer; }
    .simple-playbook-card.active { border-color: rgba(215,180,106,.8); background: rgba(215,180,106,.12); }
    .simple-playbook-card img, .simple-playbook-cover-placeholder { width: 54px; height: 54px; border-radius: 10px; object-fit: cover; background: linear-gradient(135deg,#343024,#17140f); display: grid; place-items: center; color: var(--gold-2); font-weight: 700; }
    .simple-playbook-card span { min-width: 0; display: grid; gap: 3px; }
    .simple-playbook-card strong { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .simple-playbook-card small { color: var(--muted); }
    .simple-playbook-status { color: #8fd3a8 !important; }
    .simple-playbook-status.off { color: #e2a0a0 !important; }
    .simple-playbook-editor-head { display: flex; justify-content: space-between; gap: 14px; align-items: center; margin-bottom: 14px; }
    .simple-playbook-form { display: grid; gap: 18px; }
    .simple-playbook-form .field { margin: 0; }
    .simple-playbook-form .field > span { display: block; margin-bottom: 7px; color: var(--ink); font-size: 14px; font-weight: 750; }
    .simple-playbook-form input, .simple-playbook-form select { min-height: 46px; }
    .simple-playbook-form textarea { min-height: 110px; line-height: 1.65; }
    .simple-playbook-form textarea.prompt { min-height: 300px; width: 100%; }
    .simple-playbook-cover-row { display: grid; grid-template-columns: 120px minmax(0,1fr); gap: 14px; align-items: center; }
    .simple-playbook-cover-preview { width: 120px; height: 150px; border-radius: 14px; overflow: hidden; background: rgba(255,249,238,.05); display: grid; place-items: center; color: var(--muted); }
    .simple-playbook-cover-preview img { width: 100%; height: 100%; object-fit: cover; display: block; }
    .simple-playbook-actions { position: fixed; left: var(--simple-playbook-action-left,auto); right: var(--simple-playbook-action-right,24px); bottom: 16px; z-index: 70; width: auto; display: flex; align-items: center; justify-content: flex-end; gap: 10px; padding: 12px 16px; border: 1px solid rgba(215,180,106,.34); border-radius: 15px; background: rgba(12,10,7,.97); box-shadow: 0 12px 34px rgba(0,0,0,.42); backdrop-filter: blur(14px); }
    .simple-playbook-save-state { margin-right: auto; color: var(--muted); font-size: 13px; }
    .simple-playbook-more { border: 1px solid rgba(255,249,238,.1); border-radius: 15px; background: rgba(255,249,238,.025); }
    .simple-playbook-more > summary { padding: 14px 16px; cursor: pointer; font-weight: 750; }
    .simple-playbook-more-content { display: grid; gap: 16px; padding: 4px 16px 16px; }
    .simple-playbook-new-note { padding: 13px 15px; border: 1px solid rgba(215,180,106,.3); border-radius: 13px; background: rgba(215,180,106,.1); line-height: 1.65; }
    .simple-upload-rules { display: grid; gap: 12px; padding: 15px; border: 1px solid rgba(255,249,238,.1); border-radius: 14px; }
    .simple-upload-switches { display: flex; flex-wrap: wrap; gap: 12px 20px; }
    .simple-playbook-preview { display: grid; grid-template-columns: 132px minmax(0,1fr); gap: 16px; padding: 16px; border: 1px solid rgba(215,180,106,.23); border-radius: 16px; background: rgba(255,249,238,.035); }
    .simple-playbook-preview img, .simple-preview-cover-empty { width: 132px; height: 166px; border-radius: 13px; object-fit: cover; background: linear-gradient(135deg,#343024,#17140f); display: grid; place-items: center; color: var(--gold-2); }
    .simple-playbook-workspace-head { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; padding-bottom:18px; border-bottom:1px solid rgba(255,249,238,.09); }
    .simple-playbook-workspace-head h3 { margin:4px 0 6px; font-size:24px; }
    .simple-playbook-workspace-head p { margin:0; color:var(--muted); }
    .simple-playbook-steps { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); margin:18px 0 26px; border-bottom:1px solid rgba(255,249,238,.1); }
    .simple-playbook-step { position:relative; display:grid; justify-items:center; gap:8px; min-height:88px; padding:8px 10px 18px; border:0; background:transparent; color:var(--muted); cursor:pointer; }
    .simple-playbook-step::after { content:""; position:absolute; left:10%; right:10%; bottom:-1px; height:3px; background:transparent; }
    .simple-playbook-step b { display:grid; place-items:center; width:36px; height:36px; border:1px solid rgba(255,249,238,.14); border-radius:50%; color:var(--ink); font-size:17px; }
    .simple-playbook-step.active { color:var(--ink); }
    .simple-playbook-step.active::after { background:var(--gold-2); }
    .simple-playbook-step.active b { border-color:var(--gold-2); background:var(--gold-2); color:#171109; }
    .simple-playbook-step-panel { display:none; gap:18px; }
    .simple-playbook-step-panel.active { display:grid; }
    .simple-playbook-panel-intro { display:flex; align-items:flex-end; justify-content:space-between; gap:18px; padding-bottom:14px; border-bottom:1px solid rgba(255,249,238,.08); }
    .simple-playbook-panel-intro h3 { margin:0 0 5px; }
    .simple-playbook-panel-intro p { margin:0; color:var(--muted); }
    .simple-playbook-placement-list { display:grid; border:1px solid rgba(255,249,238,.12); border-radius:15px; overflow:hidden; }
    .simple-playbook-placement-choice { display:grid; grid-template-columns:auto minmax(0,1fr) minmax(150px,220px); gap:14px; align-items:center; padding:18px; background:rgba(255,249,238,.025); }
    .simple-playbook-placement-choice + .simple-playbook-placement-choice { border-top:1px solid rgba(255,249,238,.1); }
    .simple-playbook-placement-choice > span { display:grid; gap:4px; }
    .simple-playbook-placement-choice small { color:var(--muted); }
    .simple-playbook-placement-choice input[type="checkbox"] { width:20px; height:20px; accent-color:var(--gold-2); }
    .simple-playbook-presentation-grid { display:grid; grid-template-columns:1fr; gap:22px; align-items:start; }
    .simple-playbook-visibility-toggles { display:grid; grid-template-columns:repeat(2,minmax(0,max-content)); gap:10px 22px; align-items:center; padding:8px 10px; }
    .simple-playbook-visibility-toggles label { display:flex; align-items:center; gap:9px; min-height:28px; cursor:pointer; }
    .simple-playbook-visibility-toggles input[type="checkbox"] { appearance:none; position:relative; flex:0 0 34px; width:34px !important; height:20px !important; min-width:34px; min-height:20px !important; margin:0; padding:0; border:1px solid rgba(255,249,238,.24); border-radius:999px; background:rgba(255,249,238,.09); transition:.16s ease; }
    .simple-playbook-visibility-toggles input[type="checkbox"]::after { content:""; position:absolute; top:3px; left:3px; width:12px; height:12px; border-radius:50%; background:rgba(255,249,238,.72); transition:.16s ease; }
    .simple-playbook-visibility-toggles input[type="checkbox"]:checked { border-color:rgba(215,180,106,.82); background:rgba(215,180,106,.3); }
    .simple-playbook-visibility-toggles input[type="checkbox"]:checked::after { left:17px; background:var(--gold-2); }
    .simple-playbook-release-checks { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
    .simple-playbook-release-checks span { padding:13px; border:1px solid rgba(255,249,238,.1); border-radius:12px; color:var(--muted); }
    .simple-playbook-release-checks strong { display:block; margin-bottom:4px; color:var(--ink); }
    .simple-playbook-editor .up-field-actions { flex-wrap:wrap; justify-content:flex-end; }
    #admin:has([data-admin-module="image.playbooks"]:not([hidden])) > .admin-overview,
    #admin:has([data-admin-module="image.playbooks"]:not([hidden])) .admin-login-card,
    #admin:has([data-admin-module="image.playbooks"]:not([hidden])) .admin-content-head { display:none; }
    #admin:has([data-admin-module="image.playbooks"]:not([hidden])) .admin-layout { margin-top:0; }
    #admin:has([data-admin-module="image.playbooks"]:not([hidden])) .admin-data-card { padding-top:16px; }
    .simple-playbook-manager { height:min(780px,calc(100vh - 150px)); min-height:600px; grid-template-rows:minmax(0,1fr); overflow:hidden; align-items:stretch; }
    .simple-playbook-sidebar, .simple-playbook-editor { height:auto; min-height:0; max-height:100%; }
    .simple-playbook-toolbar { height:100%; grid-template-rows:auto auto auto minmax(0,1fr); }
    .simple-playbook-list { min-height:0; max-height:none; }
    .simple-playbook-editor { overflow-y:auto; padding-bottom:16px; scrollbar-gutter:stable; }
    .simple-playbook-form { min-height:calc(100% - 128px); padding-bottom:0; }
    .simple-playbook-editor .simple-playbook-actions { position:fixed; left:var(--simple-playbook-action-left,auto); right:var(--simple-playbook-action-right,24px); bottom:16px; z-index:75; width:auto; margin-top:12px; background:#0c0a07; box-shadow:0 -1px rgba(215,180,106,.24); backdrop-filter:none; }
    .simple-playbook-list-item { padding:0; border:0; border-bottom:1px solid rgba(255,249,238,.08); border-radius:0; }
    .simple-playbook-card { border-color:transparent; border-radius:10px; }
    .simple-playbook-list-actions { display:none; }
    .simple-preview-body { display: grid; gap: 10px; align-content: start; }
    .simple-preview-body h4, .simple-preview-body p { margin: 0; }
    .simple-preview-body p, .simple-preview-upload small { color: var(--muted); line-height: 1.55; }
    .simple-preview-upload { padding: 12px; border: 1px dashed rgba(215,180,106,.35); border-radius: 12px; }
    .simple-preview-input { min-height: 42px; padding: 10px 12px; border-radius: 10px; background: rgba(255,249,238,.07); color: var(--muted); }
    .simple-cover-meta { display: grid; gap: 8px; color: var(--muted); font-size: 12px; word-break: break-all; }
    .universal-section > summary { display:flex; align-items:center; justify-content:space-between; gap:12px; }
    .universal-section > summary span { color:var(--muted); font-size:12px; font-weight:500; }
    [data-universal-list] { display:grid; gap:10px; }
    .universal-config-card { border:1px solid rgba(255,249,238,.1); border-radius:13px; background:rgba(8,7,5,.34); }
    .universal-config-card > summary { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 14px; cursor:pointer; }
    .universal-config-card > summary span { color:var(--muted); font-size:12px; }
    .universal-config-body { display:none; gap:13px; padding:18px 20px 92px; overflow-y:auto; overflow-x:hidden; min-width:0; min-height:0; overscroll-behavior:contain; touch-action:pan-y; -webkit-overflow-scrolling:touch; scrollbar-gutter:stable; }
    body.universal-item-modal-open { overflow:hidden; }
    body.universal-item-modal-open::before { content:""; position:fixed; inset:0; z-index:180; background:rgba(0,0,0,.72); backdrop-filter:blur(3px); }
    .universal-config-card[open] { position:fixed; z-index:190; inset:5vh max(24px,8vw); width:min(960px,calc(100vw - 48px)); height:min(90vh,860px); max-height:90vh; margin:auto; display:flex; flex-direction:column; overflow:hidden; border-color:rgba(215,180,106,.48); border-radius:18px; background:#15120d; box-shadow:0 28px 90px rgba(0,0,0,.65); }
    .universal-config-card[open] > summary { flex:0 0 auto; min-height:68px; padding:14px 20px; border-bottom:1px solid rgba(255,249,238,.1); background:#1b1711; cursor:default; }
    .universal-config-card[open] > summary::after { content:none; }
    .universal-config-card[open] > .universal-config-body { position:absolute; top:68px; right:0; bottom:0; left:0; display:grid; height:auto; }
    .universal-dialog-head-state { margin-left:auto; color:var(--muted); font-size:12px; }
    .universal-dialog-close { flex:0 0 auto; min-width:38px; min-height:36px; padding:6px 10px; }
    .universal-dialog-actions { position:absolute; left:0; right:0; bottom:0; z-index:3; min-height:70px; display:flex; align-items:center; justify-content:flex-end; gap:10px; padding:12px 20px; border-top:1px solid rgba(255,249,238,.12); background:rgba(18,15,11,.98); }
    .universal-dialog-actions span { margin-right:auto; color:var(--muted); font-size:12px; }
    .universal-dialog-actions .btn[disabled] { opacity:.45; }
    .universal-batch-add { display:grid; gap:8px; padding:12px; border:1px dashed rgba(215,180,106,.25); border-radius:12px; }
    .universal-batch-add textarea { min-height:110px; }
    .universal-option-manager { display:grid; gap:10px; }
    .universal-option-manager-head { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px; }
    .universal-option-scroll-hint { position:sticky; top:0; z-index:2; padding:7px 10px; border-radius:9px; background:rgba(215,180,106,.14); color:var(--gold-2); font-size:12px; text-align:center; transition:opacity .18s; }
    .universal-option-scroll-hint[hidden] { display:none; }
    .universal-option-list { display:grid; gap:8px; }
    .universal-option-card { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; align-items:center; padding:11px 12px; border:1px solid rgba(255,249,238,.1); border-radius:11px; background:rgba(255,249,238,.035); }
    .universal-option-card strong, .universal-option-card small { display:block; }
    .universal-option-card small { margin-top:4px; color:var(--muted); line-height:1.5; }
    .universal-option-card-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:6px; }
    .universal-option-card-actions .btn { min-height:34px; padding:6px 9px; }
    .universal-option-dialog { position:fixed; z-index:210; inset:9vh max(32px,13vw); width:min(760px,calc(100vw - 48px)); height:min(82vh,720px); margin:auto; display:grid; grid-template-rows:auto minmax(0,1fr) auto; overflow:hidden; border:1px solid rgba(215,180,106,.55); border-radius:17px; background:#17130e; box-shadow:0 30px 100px rgba(0,0,0,.72); }
    .universal-option-dialog::before { content:""; position:fixed; inset:0; z-index:-1; background:rgba(0,0,0,.52); }
    .universal-option-dialog-head, .universal-option-dialog-foot { display:flex; align-items:center; gap:10px; padding:14px 18px; background:#1d1812; }
    .universal-option-dialog-head { border-bottom:1px solid rgba(255,249,238,.1); }
    .universal-option-dialog-head span { margin-left:auto; color:var(--muted); font-size:12px; }
    .universal-option-dialog-body { display:grid; align-content:start; gap:13px; min-width:0; min-height:0; overflow-y:auto; overflow-x:hidden; overscroll-behavior:contain; touch-action:pan-y; -webkit-overflow-scrolling:touch; padding:18px; }
    .universal-option-dialog-foot { justify-content:flex-end; border-top:1px solid rgba(255,249,238,.1); }
    .universal-option-dialog .technical { margin-top:4px; }
    body.universal-option-modal-open .universal-config-card[open] > summary,
    body.universal-option-modal-open .universal-config-card[open] > .universal-config-body { opacity:.34; filter:saturate(.45); pointer-events:none; }
    body.universal-option-modal-open .universal-config-card[open] > .universal-dialog-actions { opacity:0; pointer-events:none; }
    body.universal-option-modal-open .universal-option-dialog { opacity:1; filter:none; pointer-events:auto; }
    .universal-option-draft-badge { display:inline-flex; margin-left:7px; padding:3px 7px; border-radius:999px; background:rgba(215,180,106,.16); color:var(--gold-2); font-size:11px; font-weight:600; }
    .universal-batch-stats { display:flex; flex-wrap:wrap; gap:8px; }
    .universal-batch-stats span { padding:5px 8px; border-radius:999px; background:rgba(255,249,238,.055); color:var(--muted); font-size:12px; }
    .universal-card-technical { margin-top:4px; }
    .universal-card-technical > summary { color:var(--muted); font-size:12px; }
    .universal-prompt-summary { display:flex; flex-wrap:wrap; align-items:center; gap:8px; padding:12px; border-radius:12px; background:rgba(215,180,106,.07); }
    .universal-prompt-summary span { color:var(--muted); font-size:12px; }
    .universal-prompt-preview-dialog { width:min(820px,calc(100vw - 32px)); max-height:86vh; padding:0; overflow:hidden; border:1px solid rgba(215,180,106,.42); border-radius:18px; background:#15120d; color:var(--ink); }
    .universal-prompt-preview-dialog::backdrop { background:rgba(0,0,0,.72); }
    .universal-prompt-preview-dialog header, .universal-prompt-preview-dialog footer { display:flex; align-items:center; gap:10px; padding:14px 18px; background:#1b1711; }
    .universal-prompt-preview-dialog header { border-bottom:1px solid rgba(255,249,238,.1); }
    .universal-prompt-preview-dialog footer { justify-content:flex-end; border-top:1px solid rgba(255,249,238,.1); }
    .universal-prompt-preview-body { max-height:calc(86vh - 132px); overflow:auto; padding:18px; white-space:pre-wrap; line-height:1.7; }
    body.universal-item-modal-open .simple-playbook-actions { opacity:0; pointer-events:none; }
    .universal-toggle-row, .universal-placement-grid { display:flex; flex-wrap:wrap; gap:10px 18px; padding:10px 12px; border-radius:11px; background:rgba(255,249,238,.035); }
    .universal-item-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px; }
    .universal-preview-extras { display:grid; gap:9px; }
    .universal-preview-extras > div { display:flex; flex-wrap:wrap; align-items:center; gap:7px; }
    .universal-preview-extras span { padding:5px 8px; border-radius:999px; background:rgba(215,180,106,.11); color:var(--muted); font-size:12px; }
    .universal-live-preview { align-items:start; }
    .admin-workbench-actions { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; margin: 16px 0; }
    .admin-workbench-actions button { min-height: 54px; text-align: left; }
    .admin-module-note { padding: 18px; border: 1px dashed rgba(215,180,106,.25); border-radius: 14px; color: var(--muted); line-height: 1.7; }
    @keyframes admin-panel-in { from { opacity: .45; transform: translateY(4px); } to { opacity: 1; transform: none; } }

    @media (max-width: 980px) {
      .admin-ia-shell { grid-template-columns: 1fr; }
      .simple-playbook-manager { grid-template-columns: 1fr; height:auto; min-height:0; }
      .simple-playbook-toolbar { position: static; }
      .simple-playbook-list { max-height: 360px; }
      .simple-playbook-sidebar, .simple-playbook-editor { height:auto; }
      .simple-playbook-editor { overflow:visible; }
      .simple-playbook-form { padding-bottom:0; }
      .simple-playbook-editor .simple-playbook-actions { position:static; margin-top:4px; box-shadow:none; backdrop-filter:none; }
      .simple-playbook-actions { left: 16px !important; right: 16px !important; bottom: 12px; width: auto; }
      .admin-primary-nav { position: static; grid-template-columns: repeat(3,minmax(0,1fr)); }
      .admin-primary-nav h3 { grid-column: 1 / -1; }
    }

    .admin-wallet-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
      gap: 14px;
      margin-bottom: 16px;
    }

    .admin-wallet-grid .admin-wallet-card {
      margin-bottom: 0;
    }

    .admin-wallet-value {
      display: grid;
      gap: 6px;
    }

    .admin-wallet-value strong {
      color: var(--gold-2);
      font-size: 24px;
    }

    .admin-wallet-value span {
      color: rgba(255,249,238,.72);
      font-size: 12px;
    }

    .admin-wallet-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      margin-top: 6px;
    }
    @media (max-width: 760px) {
      .simple-playbook-sidebar, .simple-playbook-editor { padding:13px; border-radius:14px; }
      .simple-playbook-workspace-head, .simple-playbook-panel-intro { align-items:flex-start; flex-direction:column; }
      .simple-playbook-workspace-head .up-field-actions { justify-content:flex-start; }
      .simple-playbook-steps { grid-template-columns:repeat(4,1fr); overflow-x:auto; }
      .simple-playbook-step { min-width:76px; padding-inline:4px; font-size:12px; }
      .simple-playbook-step b { width:31px; height:31px; font-size:14px; }
      .simple-playbook-placement-choice { grid-template-columns:auto minmax(0,1fr); }
      .simple-playbook-placement-choice .field { grid-column:1 / -1; }
      .simple-playbook-presentation-grid, .simple-playbook-release-checks { grid-template-columns:1fr; }
    }
    @media (max-width: 640px) {
      #admin:has(.admin-layout.admin-authenticated) > .admin-overview { display: none; }
      .admin-primary-nav { display: flex; gap: 7px; overflow-x: auto; padding: 9px; scrollbar-width: thin; }
      .admin-primary-nav h3 { display: none; }
      .admin-primary-nav button { flex: 0 0 auto; width: auto; min-height: 42px; white-space: nowrap; }
      .admin-content-head { padding: 13px 14px; }
      .admin-data-card { padding: 12px; }
      .admin-workbench-actions { grid-template-columns: 1fr; }
      .simple-playbook-preview, .simple-playbook-cover-row { grid-template-columns: 1fr; }
      .simple-playbook-visibility-toggles { grid-template-columns:1fr; gap:6px; }
      .simple-playbook-actions { justify-content: stretch; }
      .simple-playbook-actions .btn { flex: 1; }
      .universal-config-card[open] { inset:0; width:100vw; height:100dvh; max-height:none; border-radius:0; }
      .universal-config-card[open] > summary { padding:12px 14px; }
      .universal-config-body { padding:14px 14px 88px; }
      .universal-dialog-actions { padding:10px 12px max(10px,env(safe-area-inset-bottom)); }
      .universal-option-card { grid-template-columns:1fr; }
      .universal-option-card-actions { justify-content:flex-start; }
      .universal-option-dialog { inset:0; width:100vw; height:100dvh; max-height:none; border-radius:0; }
    }

    .up-admin { display: grid; gap: 18px; margin: 8px 0 28px; }
    .up-status-card { display: grid; grid-template-columns: minmax(260px, 1.4fr) repeat(4, minmax(130px, .75fr)); gap: 14px; padding: 22px; border: 1px solid rgba(215,180,106,.34); border-radius: 18px; background: linear-gradient(120deg, rgba(215,180,106,.16), rgba(255,249,238,.045)); }
    .up-status-card h2 { margin: 5px 0 6px; font-size: clamp(23px, 2vw, 32px); }
    .up-status-card p { margin: 0; color: var(--muted); line-height: 1.55; }
    .up-status-item { padding: 12px 14px; border-radius: 13px; background: rgba(8,7,5,.42); }
    .up-status-item span { display: block; margin-bottom: 6px; color: var(--muted); font-size: 11px; }
    .up-status-item strong { color: var(--ink); font-size: 15px; }
    .up-unsaved { grid-column: 1 / -1; display: none; padding: 10px 13px; border-radius: 10px; background: rgba(215,151,55,.16); color: #ffd895; }
    .up-unsaved.show { display: block; }

    .up-workspace { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, .42fr); gap: 18px; align-items: start; }
    .up-detail-tabs { display:flex; gap:8px; margin:18px 0; padding:7px; overflow-x:auto; border:1px solid rgba(255,249,238,.1); border-radius:16px; background:rgba(255,249,238,.025); }
    .up-detail-tabs button { flex:0 0 auto; min-height:40px; padding:9px 14px; border:1px solid transparent; border-radius:11px; color:var(--muted); background:transparent; }
    .up-detail-tabs button.active { color:#17130b; border-color:var(--gold); background:var(--gold-2); font-weight:800; }
    .up-admin [data-up-detail-panel] { display:none !important; }
    .up-admin[data-active-tab="overview"] [data-up-detail-panel="overview"], .up-admin[data-active-tab="fields"] [data-up-detail-panel="fields"], .up-admin[data-active-tab="capabilities"] [data-up-detail-panel="capabilities"], .up-admin[data-active-tab="prompts"] [data-up-detail-panel="prompts"], .up-admin[data-active-tab="images"] [data-up-detail-panel="images"], .up-admin[data-active-tab="presentation"] [data-up-detail-panel="presentation"], .up-admin[data-active-tab="release"] [data-up-detail-panel="release"] { display:block !important; }
    .up-admin .up-workspace { display:block; }
    .up-admin .up-side { display:contents; }
    .up-library-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
    .up-library-card { padding:15px; border:1px solid rgba(255,249,238,.11); border-radius:14px; background:rgba(255,249,238,.035); }
    .up-library-card h4 { margin:0 0 7px; }
    .up-library-card p { margin:6px 0; color:var(--muted); line-height:1.55; }
    .up-source-summary { margin-top:12px; padding:12px 14px; border-left:3px solid var(--gold); background:rgba(215,180,106,.08); }
    .up-steps { display: grid; gap: 16px; }
    .up-step, .up-side-card, .up-settings { padding: 20px; border: 1px solid rgba(255,249,238,.12); border-radius: 16px; background: rgba(255,249,238,.035); }
    .up-step-head { display: flex; align-items: flex-start; gap: 13px; margin-bottom: 16px; }
    .up-step-number { display: grid; place-items: center; flex: 0 0 34px; width: 34px; height: 34px; border-radius: 50%; background: var(--gold); color: #171008; font-weight: 900; }
    .up-step-head h3 { margin: 0 0 4px; font-size: 19px; }
    .up-step-head p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.55; }
    .up-field-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; }
    .up-field-grid .wide { grid-column: 1 / -1; }
    .up-field-label { display: grid; gap: 7px; color: var(--muted); font-size: 12px; }
    .up-cover-editor { display: grid; grid-template-columns: 116px 1fr; gap: 14px; align-items: center; }
    .up-cover-editor img { width: 116px; height: 86px; border-radius: 12px; object-fit: cover; border: 1px solid var(--line); background: rgba(255,255,255,.04); }
    .up-cover-actions { display: flex; gap: 9px; flex-wrap: wrap; }

    .up-option-groups, .up-rule-groups { display: grid; gap: 14px; }
    .up-option-groups { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .up-option-group, .up-rule-group { padding: 14px; border: 1px solid rgba(255,249,238,.1); border-radius: 13px; background: rgba(8,7,5,.24); }
    .up-option-title { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 10px; }
    .up-option-title strong { color: var(--ink); }
    .up-option-title small { color: var(--muted); }
    .up-option-list { display: grid; gap: 8px; }
    .up-option-row { display: grid; grid-template-columns: 32px minmax(120px,1fr) auto auto auto auto; gap: 7px; align-items: center; }
    .up-option-row input[type="text"] { min-width: 0; }
    .up-option-row .btn { min-height: 34px; padding: 7px 9px; font-size: 12px; }
    .up-default-label { display: inline-flex; align-items: center; gap: 5px; color: var(--muted); font-size: 12px; white-space: nowrap; }
    .up-add-row { margin-top: 9px; }
    .up-option-meta { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.5fr); gap: 9px; }
    .up-option-textarea { min-height: 142px; max-height: 190px; resize: vertical; overflow-y: auto; line-height: 1.65; }
    .up-option-default { margin-top: 10px; }
    .up-option-notice { display: none; margin-top: 8px; color: #f2ce83; font-size: 12px; }
    .up-option-notice.show { display: block; }
    .up-step-head .up-step-action { margin-left: auto; flex: 0 0 auto; }
    .up-field-actions, .up-field-switches { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
    .up-field-actions .btn { min-height: 34px; padding: 7px 10px; }
    .up-field-switches { margin-top: 11px; padding-top: 10px; border-top: 1px solid rgba(255,249,238,.08); }
    .up-field-wizard { width: min(720px, calc(100vw - 28px)); max-height: calc(100vh - 40px); overflow-y: auto; padding: 22px; border: 1px solid rgba(215,180,106,.38); border-radius: 18px; color: var(--ink); background: #17140f; box-shadow: 0 28px 80px rgba(0,0,0,.55); }
    .up-field-wizard::backdrop { background: rgba(0,0,0,.72); backdrop-filter: blur(4px); }
    .up-field-wizard form { display: grid; gap: 14px; }
    .up-field-wizard [hidden] { display: none !important; }
    #upCapabilityEditor { width:min(920px,calc(100vw - 28px)); height:min(780px,calc(100dvh - 32px)); max-height:calc(100dvh - 32px); padding:0; overflow:hidden; }
    #upCapabilityEditor form { height:100%; min-height:0; display:grid; grid-template-rows:auto minmax(0,1fr) auto; gap:0; }
    .up-capability-head,.up-capability-actions { position:relative; z-index:2; padding:16px 20px; background:#17140f; }
    .up-capability-head { border-bottom:1px solid rgba(215,180,106,.22); }
    .up-capability-actions { border-top:1px solid rgba(215,180,106,.22); display:flex; align-items:center; justify-content:space-between; gap:12px; padding-bottom:max(16px,env(safe-area-inset-bottom)); }
    .up-capability-scroll { min-height:0; overflow-y:auto; overscroll-behavior:contain; padding:18px 20px 24px; display:grid; gap:16px; }
    .up-capability-section { border:1px solid rgba(215,180,106,.2); border-radius:14px; padding:16px; background:rgba(255,255,255,.025); }
    .up-capability-section h4 { margin:0 0 4px; }
    .up-capability-section > p { margin:0 0 14px; color:var(--muted); }
    .up-icon-preview { display:inline-grid; place-items:center; min-width:38px; height:38px; border-radius:10px; margin-top:6px; background:rgba(215,180,106,.14); font-size:20px; }
    .up-trigger-rule { display:grid; grid-template-columns:1.1fr 1fr 1.2fr auto; gap:8px; margin-top:8px; align-items:end; }
    .up-technical-details { border-top:1px dashed rgba(215,180,106,.25); padding-top:10px; }
    #upCapabilityEditor[data-dirty="true"] #upCapabilityEditorStatus { color:#ffd27c; }
    #upSaveCapability:disabled { opacity:.48; cursor:not-allowed; }
    @media(max-width:640px){ #upCapabilityEditor { width:100vw; height:100dvh; max-height:100dvh; border-radius:0; } .up-capability-head,.up-capability-scroll,.up-capability-actions{padding-left:14px;padding-right:14px}.up-capability-actions{flex-wrap:wrap}.up-capability-actions .up-field-actions{width:100%;display:grid;grid-template-columns:1fr 1fr}.up-trigger-rule{grid-template-columns:1fr}.up-trigger-rule button{width:100%} }
    .up-public-multi, .up-public-single { display: grid; grid-template-columns: repeat(auto-fit,minmax(145px,1fr)); gap: 8px; margin-top: 9px; }
    .up-public-multi label, .up-public-single label { display: flex; align-items: center; gap: 9px; min-height: 40px; padding: 8px 10px; border: 1px solid rgba(255,249,238,.12); border-radius: 9px; color: var(--ink); background: rgba(255,255,255,.025); cursor: pointer; }
    .up-public-multi label:has(input:checked), .up-public-single label:has(input:checked) { border-color: rgba(215,180,106,.64); background: rgba(215,180,106,.14); }
    .up-public-multi input[type="checkbox"], .up-public-single input[type="radio"] { appearance: auto; flex: 0 0 17px; width: 17px !important; height: 17px !important; min-width: 17px; min-height: 17px !important; max-height: 17px; margin: 0; padding: 0; accent-color: var(--gold); }
    .up-public-multi label span, .up-public-single label span { line-height: 1.35; }
    .up-choice-field { min-width: 0; padding: 13px; border: 1px solid rgba(255,249,238,.12); border-radius: 12px; }
    .up-choice-field legend { padding: 0 5px; color: var(--ink); font-weight: 800; }
    .up-choice-field > small { display: block; margin-top: 2px; color: var(--muted); }
    .up-choice-kind { display: inline-block; margin-top: 7px; color: #e8cc91; font-size: 12px; }
    .up-choice-error { display: block; margin-top: 8px; color: #ffc1ae; font-size: 12px; }

    .up-progress { display: grid; grid-template-columns: repeat(7,1fr); gap: 8px; margin-bottom: 15px; }
    .up-progress span { padding: 10px; border-radius: 10px; text-align: center; color: var(--muted); background: rgba(255,255,255,.04); font-size: 12px; }
    .up-progress span.done { color: #dff7d8; background: rgba(90,150,85,.17); }
    .up-progress span.current { color: #1a1208; background: var(--gold); font-weight: 800; }
    .up-action-stack { display: grid; gap: 10px; }
    .up-action-stack .btn { width: 100%; min-height: 46px; }
    .up-impact { padding: 12px; border-radius: 11px; color: var(--muted); background: rgba(215,180,106,.08); font-size: 12px; line-height: 1.6; }
    .up-test-result { display: none; margin-top: 12px; padding: 14px; border-radius: 12px; background: rgba(82,139,77,.13); }
    .up-test-result.show { display: grid; gap: 7px; }
    .up-test-result strong { color: #dff7d8; }
    .up-publish-result { display: grid; gap: 12px; margin-top: 15px; padding: 16px; border: 1px solid rgba(215,180,106,.3); border-radius: 13px; background: rgba(215,180,106,.08); }
    .up-publish-result h4 { margin: 0; color: var(--ink); font-size: 17px; }
    .up-publish-facts { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
    .up-publish-facts span { padding: 9px; border-radius: 8px; background: rgba(0,0,0,.18); color: var(--muted); font-size: 12px; }
    .up-publish-facts strong { display: block; margin-top: 4px; color: var(--ink); }
    .up-runtime-actions, .up-test-links { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
    .up-runtime-actions .btn.active { border-color: var(--gold); color: #171008; background: var(--gold); }
    .up-test-links small { color: #f0cf8d; }
    .up-mock-form { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
    .up-mock-form .field:last-child { grid-column: 1 / -1; }
    .up-side { display: grid; gap: 16px; position: sticky; top: 18px; }
    .up-settings summary, .up-danger summary, .legacy-playbook-management summary { cursor: pointer; color: var(--ink); font-weight: 800; }
    .up-settings[open] summary, .up-danger[open] summary, .legacy-playbook-management[open] summary { margin-bottom: 16px; }
    .up-danger { border-color: rgba(192,83,63,.38); background: rgba(112,34,25,.09); }
    .up-danger-actions { display: grid; gap: 11px; }
    .up-danger .btn { min-height: 42px; }
    .up-tech-note { margin: 8px 0 14px; padding: 10px; border-radius: 9px; color: #ffc7b5; background: rgba(150,56,40,.14); }
    .legacy-playbook-management { margin: 26px 0; padding: 18px; border: 1px dashed rgba(255,249,238,.18); border-radius: 16px; }
    .legacy-playbook-management > summary small { display: block; margin-top: 5px; color: var(--muted); font-weight: 400; }

    @media (max-width: 1180px) {
      .up-status-card { grid-template-columns: repeat(2,minmax(0,1fr)); }
      .up-status-main { grid-column: 1 / -1; }
      .up-workspace { grid-template-columns: 1fr; }
      .up-library-grid { grid-template-columns:1fr; }
      .up-side { position: static; grid-template-columns: repeat(2,minmax(0,1fr)); }
      .up-side > :first-child { grid-column: 1 / -1; }
    }
    @media (max-width: 720px) {
      body.admin-entry main { width: min(100% - 20px, 1280px); }
      .up-status-card, .up-field-grid, .up-mock-form, .up-side, .up-option-groups, .up-option-meta, .up-publish-facts { grid-template-columns: 1fr; }
      .up-status-main, .up-field-grid .wide, .up-mock-form .field:last-child, .up-side > :first-child { grid-column: auto; }
      .up-option-row { grid-template-columns: 28px minmax(0,1fr) auto; }
      .up-option-row .up-move, .up-option-row .up-default-label { grid-row: 2; }
      .up-cover-editor { grid-template-columns: 1fr; }
      .up-progress { grid-template-columns: 1fr; }
    }

    .admin-empty {
      min-height: 220px;
      display: grid;
      place-items: center;
      padding: 22px;
      border: 1px dashed rgba(215,180,106,.24);
      border-radius: var(--radius);
      color: rgba(255,249,238,.58);
      text-align: center;
      line-height: 1.7;
    }

    .sales-kit-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 12px; }
    .sales-kit-card { display: grid; gap: 10px; padding: 15px; border: 1px solid rgba(215,180,106,.2); border-radius: 12px; background: rgba(255,249,238,.028); }
    .sales-kit-card strong { font-size: 16px; color: var(--ink); }
    .sales-kit-card p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.65; }
    .sales-kit-card .btn { justify-self: start; }

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

    .panel.dark { background: rgba(8,7,5,.78); }

    .playbook-intro {
      display: flex;
      justify-content: space-between;
      align-items: end;
      gap: 18px;
      padding: 18px;
      border: 1px solid rgba(215,180,106,.3);
      border-radius: var(--radius);
      background: linear-gradient(110deg, rgba(215,180,106,.14), rgba(255,249,238,.035));
    }

    .playbook-intro h4 { margin: 7px 0 5px; font-size: 20px; }
    .playbook-intro p { margin: 0; max-width: 680px; color: var(--muted); }
    .playbook-categories { display: flex; flex-wrap: wrap; gap: 8px; }
    .playbook-categories button { white-space: nowrap; }
    .playbook-workspace { display: grid; grid-template-columns: minmax(260px, 340px) minmax(0, 1fr); gap: 18px; align-items: start; }
    .playbook-library { min-width: 0; padding: 14px; border: 1px solid rgba(255,249,238,.09); border-radius: var(--radius); background: rgba(9,8,6,.42); }
    .playbook-library-head { display: grid; gap: 10px; margin-bottom: 10px; }
    .playbook-library-head strong { font-size: 15px; }
    .playbook-library-head input { width: 100%; min-height: 40px; }
    .category-nav { position: relative; min-width: 0; }
    .category-scroll { overflow-x: auto; overflow-y: hidden; scrollbar-width: none; -ms-overflow-style: none; scroll-behavior: smooth; overscroll-behavior-x: contain; cursor: grab; touch-action: pan-x; }
    .category-scroll::-webkit-scrollbar { display: none; width: 0; height: 0; }
    .category-scroll.dragging { cursor: grabbing; scroll-behavior: auto; user-select: none; }
    .category-nav::before, .category-nav::after { content: ""; position: absolute; z-index: 2; top: 0; bottom: 0; width: 38px; opacity: 0; pointer-events: none; transition: opacity .16s ease; }
    .category-nav::before { left: 0; background: linear-gradient(90deg, #0d0b08 18%, rgba(13,11,8,0)); }
    .category-nav::after { right: 0; background: linear-gradient(270deg, #0d0b08 18%, rgba(13,11,8,0)); }
    .category-nav.can-scroll-left::before, .category-nav.can-scroll-right::after { opacity: 1; }
    .category-arrow { position: absolute; z-index: 3; top: 50%; display: grid; width: 26px; height: 26px; place-items: center; padding: 0; border: 1px solid rgba(215,180,106,.46); border-radius: 50%; color: var(--gold-2); background: rgba(13,11,8,.94); box-shadow: 0 4px 14px rgba(0,0,0,.28); opacity: 0; pointer-events: none; transform: translateY(-50%); transition: opacity .16s ease, border-color .16s ease; }
    .category-arrow:hover { border-color: var(--gold-2); }
    .category-prev { left: 2px; }
    .category-next { right: 2px; }
    .category-nav.can-scroll-left .category-prev, .category-nav.can-scroll-right .category-next { opacity: 1; pointer-events: auto; }
    .category-nav:not(.has-overflow) .category-arrow { display: none; }
    .playbook-library .playbook-categories { flex-wrap: nowrap; width: max-content; min-width: 100%; margin: 0; padding: 0 30px 4px; }
    .playbook-library .quick-chip { flex: 0 0 auto; min-height: 32px; padding: 5px 10px; }
    .playbook-grid { display: grid; gap: 7px; max-height: calc(100vh - 230px); min-height: 220px; overflow: auto; padding-right: 4px; overscroll-behavior: contain; }
    .playbook-card {
      position: relative; display: grid; grid-template-columns: 54px minmax(0,1fr); align-items: center; overflow: hidden; text-align: left; padding: 7px;
      border: 1px solid rgba(255,249,238,.11); border-radius: 14px; color: var(--ink);
      background: rgba(255,249,238,.035); cursor: pointer; transition: .18s ease;
    }
    .playbook-card:hover, .playbook-card.active { transform: none; border-color: rgba(234,197,104,.75); box-shadow: 0 8px 20px rgba(0,0,0,.18); }
    .playbook-cover { width: 54px; height: 64px; position: relative; overflow: hidden; border-radius: 10px; background: linear-gradient(135deg, #403522, #17130e 65%, #5c4820); }
    .playbook-cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
    .playbook-cover-fallback { display: grid; align-content: end; height: 100%; padding: 6px; background: radial-gradient(circle at 78% 18%, rgba(252,224,154,.38), transparent 28%), linear-gradient(135deg, #514221, #16110c 72%); }
    .playbook-cover-fallback span { font-family: Georgia, serif; color: rgba(255,244,214,.92); font-size: 10px; line-height: 1.15; }
    .playbook-card-copy { min-width: 0; padding: 3px 5px; display: grid; gap: 4px; }
    .playbook-card-copy strong { overflow: hidden; font-size: 14px; white-space: nowrap; text-overflow: ellipsis; }
    .playbook-card-copy p { margin: 0; overflow: hidden; color: var(--muted); font-size: 11px; line-height: 1.4; white-space: nowrap; text-overflow: ellipsis; }
    .playbook-card-copy .playbook-meta span:nth-child(n+3) { display: none; }
    .playbook-meta { display: flex; flex-wrap: wrap; gap: 6px; }
    .playbook-meta span { padding: 4px 7px; border-radius: 999px; color: var(--gold-2); background: rgba(215,180,106,.11); font-size: 11px; }
    .playbook-composer { position: sticky; top: 18px; min-width: 0; padding: 18px; border: 1px solid rgba(215,180,106,.28); border-radius: var(--radius); background: linear-gradient(145deg, rgba(255,249,238,.075), rgba(15,12,8,.76)); }
    .playbook-composer h4 { margin: 4px 0 4px; font-size: 20px; }
    .playbook-composer > p { margin: 0 0 14px; color: var(--muted); line-height: 1.55; }
    .playbook-empty { min-height: 280px; display: grid; place-items: center; padding: 24px; border: 1px dashed rgba(215,180,106,.25); border-radius: 14px; color: var(--muted); text-align: center; }

    @media (max-width: 860px) {
      .playbook-intro { display: grid; align-items: start; }
      .playbook-workspace { grid-template-columns: 1fr; }
      .playbook-composer { position: static; }
    }

    @media (max-width: 560px) {
      .playbook-grid { grid-template-columns: 1fr; }
      .playbook-cover { width: 54px; height: 64px; }
    }

    .panel-head {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 12px;
      margin-bottom: 14px;
    }

    .panel-head > div {
      display: grid;
      gap: 10px;
      min-width: 0;
    }

    .video-panel-head {
      align-items: flex-start;
      margin-bottom: 22px;
    }

    .video-panel-title {
      display: grid;
      gap: 10px;
    }

    .video-panel-title h3 {
      line-height: 1.2;
    }

    .form {
      display: grid;
      gap: 14px;
    }

    .field {
      display: grid;
      gap: 7px;
    }

    .field label {
      color: rgba(255,249,238,.78);
      font-size: 13px;
    }

    .image-base-settings {
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 10px;
      align-items: start;
    }

    .image-base-settings .field {
      gap: 5px;
    }

    .image-base-settings select {
      min-height: 38px;
      padding: 0 10px;
      font-size: 12.5px;
      border-radius: 11px;
    }

    .image-base-settings small {
      min-height: 18px;
      font-size: 10.5px;
      line-height: 1.35;
      color: rgba(255,249,238,.46);
    }

    input, textarea, select {
      width: 100%;
      border: 1px solid var(--line);
      border-radius: 12px;
      color: var(--ink);
      background: rgba(255,249,238,.065);
      outline: none;
      transition: border-color .18s ease, background .18s ease, box-shadow .18s ease;
    }

    input, select { min-height: 42px; padding: 0 12px; }
    .checkbox-row {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      min-height: 32px;
      color: rgba(255,249,238,.76);
      font-size: 13px;
      line-height: 1.5;
    }
    .checkbox-row > input[type="checkbox"] {
      appearance: auto;
      -webkit-appearance: auto;
      flex: 0 0 18px;
      width: 18px;
      min-width: 18px;
      height: 18px;
      min-height: 18px;
      margin: 0;
      padding: 0;
      border-radius: 5px;
      accent-color: var(--gold);
    }
    .consent-row {
      display: flex;
      align-items: center;
      flex-wrap: wrap;
      gap: 8px;
      margin-top: 12px;
      padding: 11px 13px;
      border: 1px solid rgba(215,180,106,.24);
      border-radius: 10px;
      background: rgba(255,249,238,.025);
      color: rgba(255,249,238,.78);
      font-size: 13px;
      line-height: 1.5;
    }
    .consent-check {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      cursor: pointer;
      color: var(--ink);
      font-weight: 650;
      white-space: nowrap;
    }
    .consent-check input {
      position: absolute;
      width: 1px;
      height: 1px;
      min-height: 0;
      padding: 0;
      margin: -1px;
      overflow: hidden;
      clip: rect(0, 0, 0, 0);
      white-space: nowrap;
      border: 0;
    }
    .consent-box {
      display: grid;
      place-items: center;
      width: 18px;
      height: 18px;
      border: 1px solid rgba(215,180,106,.62);
      border-radius: 5px;
      background: rgba(255,249,238,.05);
      transition: .18s ease;
    }
    .consent-box::after {
      content: "";
      width: 8px;
      height: 4px;
      border-left: 2px solid #1b1408;
      border-bottom: 2px solid #1b1408;
      transform: rotate(-45deg) scale(0);
      transition: transform .16s ease;
    }
    .consent-check input:checked + .consent-box {
      border-color: var(--gold);
      background: var(--gold);
    }
    .consent-check input:checked + .consent-box::after { transform: rotate(-45deg) scale(1); }
    .consent-check input:focus-visible + .consent-box { outline: 2px solid #fff0b3; outline-offset: 2px; }
    .consent-links { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 5px; color: rgba(255,249,238,.55); }
    .consent-link {
      padding: 0;
      border: 0;
      background: transparent;
      color: var(--gold-2);
      font: inherit;
      font-weight: 700;
      text-decoration: underline;
      text-underline-offset: 3px;
    }
    .consent-link:hover { color: #fff0b3; }
    .legal-modal #acceptCompliance { width: 100%; margin-top: 10px; }
    textarea {
      min-height: 132px;
      padding: 12px;
      resize: vertical;
      font-size: 12px;
      line-height: 1.7;
      color: rgba(255,249,238,.82);
    }

    textarea[id$="Prompt"],
    #copyInput {
      min-height: 150px;
      padding: 13px 14px;
      font-size: 11.5px;
      line-height: 1.78;
      color: rgba(255,249,238,.74);
      background:
        linear-gradient(135deg, rgba(255,249,238,.052), rgba(215,180,106,.035)),
        rgba(6,5,4,.22);
      border-color: rgba(255,249,238,.12);
    }

    textarea[id$="Prompt"]:focus,
    #copyInput:focus {
      color: rgba(255,249,238,.88);
      background:
        linear-gradient(135deg, rgba(255,249,238,.065), rgba(215,180,106,.045)),
        rgba(8,7,5,.36);
    }

    .voice-control-grid {
      display: grid;
      grid-template-columns: minmax(180px, .36fr) minmax(0, 1fr);
      gap: 10px;
      align-items: stretch;
    }

    .voice-control-grid select {
      min-height: 46px;
    }

    #videoAudioControls[hidden],
    #liveAudioControls[hidden],
    #firstFrameUploadWrap[hidden],
    #lastFrameUploadWrap[hidden],
    #liveLastFrameWrap[hidden] {
      display: none !important;
    }

    .prefixed-input {
      min-height: 42px;
      display: grid;
      grid-template-columns: auto minmax(0, 1fr);
      align-items: center;
      gap: 8px;
      padding: 0 12px;
      border: 1px solid var(--line);
      border-radius: 12px;
      background: rgba(255,249,238,.055);
      color: rgba(255,249,238,.9);
      transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
    }

    .prefixed-input:focus-within {
      border-color: rgba(215,180,106,.62);
      box-shadow: 0 0 0 3px rgba(215,180,106,.12);
      background-color: rgba(14,12,9,.92);
    }

    .prefixed-input span {
      color: var(--gold-2);
      font-size: 13px;
      font-weight: 800;
      white-space: nowrap;
    }

    .prefixed-input input {
      min-height: 40px;
      padding: 0;
      border: 0;
      background: transparent;
      box-shadow: none;
    }

    .prefixed-input input:focus {
      border-color: transparent;
      box-shadow: none;
      background: transparent;
    }

    #videoSpeech {
      min-height: 46px;
      max-height: 92px;
      padding: 10px 12px;
      line-height: 1.55;
      font-size: 12px;
    }

    input::placeholder, textarea::placeholder { color: rgba(255,249,238,.38); }

    select {
      color-scheme: dark;
      cursor: pointer;
      background:
        linear-gradient(135deg, rgba(255,249,238,.1), rgba(215,180,106,.08)),
        rgba(10,9,7,.92);
      border-color: rgba(215,180,106,.28);
      color: rgba(255,249,238,.9);
    }

    select:focus, input:focus, textarea:focus {
      border-color: rgba(215,180,106,.62);
      box-shadow: 0 0 0 3px rgba(215,180,106,.12);
      background-color: rgba(14,12,9,.92);
    }

    select option {
      color: rgba(255,249,238,.92);
      background: #14110d;
    }

    select option:checked {
      color: #1c1407;
      background: #d7b46a;
    }

    .lux-select {
      position: relative;
      width: 100%;
      z-index: 5;
    }

    .lux-select.open {
      z-index: 80;
    }

    .lux-select-trigger {
      width: 100%;
      min-height: 42px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      padding: 0 12px;
      border: 1px solid rgba(215,180,106,.34);
      border-radius: 12px;
      color: rgba(255,249,238,.92);
      background:
        linear-gradient(135deg, rgba(255,249,238,.1), rgba(215,180,106,.08)),
        rgba(10,9,7,.92);
      cursor: pointer;
      text-align: left;
      transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
    }

    .lux-select-trigger::after {
      content: "";
      width: 8px;
      height: 8px;
      flex: 0 0 auto;
      border-right: 2px solid rgba(255,249,238,.78);
      border-bottom: 2px solid rgba(255,249,238,.78);
      transform: rotate(45deg) translateY(-2px);
      transition: transform .18s ease;
    }

    .lux-select.open .lux-select-trigger {
      border-color: rgba(250,222,157,.7);
      box-shadow: 0 0 0 3px rgba(215,180,106,.12);
      background:
        linear-gradient(135deg, rgba(250,222,157,.13), rgba(215,180,106,.09)),
        rgba(12,10,7,.96);
    }

    .lux-select.open .lux-select-trigger::after {
      transform: rotate(225deg) translate(-2px, -1px);
    }

    .lux-select-menu {
      position: absolute;
      left: 0;
      right: 0;
      top: calc(100% + 7px);
      display: none;
      max-height: 236px;
      overflow: auto;
      padding: 6px;
      border: 1px solid rgba(250,222,157,.34);
      border-radius: 14px;
      background:
        linear-gradient(135deg, rgba(28,22,14,.98), rgba(10,9,7,.98)),
        #100d09;
      box-shadow: 0 22px 48px rgba(0,0,0,.42);
    }

    .lux-select.open .lux-select-menu {
      display: grid;
      gap: 4px;
    }

    .lux-select-option {
      width: 100%;
      min-height: 36px;
      padding: 8px 10px;
      border: 0;
      border-radius: 10px;
      color: rgba(255,249,238,.82);
      background: transparent;
      text-align: left;
      cursor: pointer;
    }

    .lux-select-option:hover,
    .lux-select-option.active {
      color: #1c1407;
      background: linear-gradient(135deg, #f9e9ad, #d3aa4f);
    }

    select.lux-native {
      position: absolute !important;
      width: 1px !important;
      height: 1px !important;
      min-height: 0 !important;
      padding: 0 !important;
      opacity: 0 !important;
      pointer-events: none !important;
    }

    .field small {
      display: block;
      color: rgba(232,214,174,.62);
      font-size: 12px;
      line-height: 1.65;
      margin-top: -2px;
    }

    .two { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
    .three { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }

    .cost-note {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      align-items: center;
      padding: 10px 12px;
      border: 1px solid rgba(215,180,106,.24);
      border-radius: var(--radius);
      color: rgba(255,249,238,.76);
      background: rgba(215,180,106,.075);
      font-size: 12px;
      line-height: 1.55;
    }

    .cost-note strong {
      color: var(--gold-2);
      font-weight: 700;
    }

    .cost-note span {
      color: var(--muted);
    }

    .cost-chip {
      width: fit-content;
      display: inline-flex;
      align-items: center;
      gap: 4px;
      margin-top: 10px;
      padding: 5px 8px;
      border: 1px solid rgba(215,180,106,.22);
      border-radius: 999px;
      color: var(--gold-2);
      background: rgba(215,180,106,.1);
      font-size: 11px;
      line-height: 1.2;
    }

    .status {
      min-height: 44px;
      padding: 12px 13px;
      border: 1px solid var(--line);
      border-radius: 12px;
      color: rgba(255,249,238,.76);
      background: rgba(215,180,106,.085);
      line-height: 1.6;
      font-size: 13px;
    }

    .project-item .status {
      min-height: auto;
      flex: 0 0 auto;
      padding: 4px 9px;
      border-radius: 999px;
      font-size: 12px;
      white-space: nowrap;
    }

    .project-item .status.success {
      color: #dff4dc;
      border-color: rgba(160, 216, 150, .42);
      background: rgba(86, 135, 83, .24);
    }

    .project-item .status.error {
      color: #ffd1c8;
      border-color: rgba(255, 142, 118, .34);
      background: rgba(140, 54, 40, .24);
    }

    .preview {
      min-height: 420px;
      display: grid;
      place-items: center;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background:
        linear-gradient(135deg, rgba(255,249,238,.065), rgba(255,249,238,.025)),
        rgba(0,0,0,.12);
      color: var(--muted);
      text-align: center;
      padding: 16px;
      overflow: hidden;
    }

    .preview img, .preview video {
      max-width: 100%;
      max-height: 520px;
      border-radius: var(--radius);
      object-fit: contain;
      background: #000;
    }

    .inline-status {
      display: inline-flex;
      width: fit-content;
      max-width: 100%;
      align-items: center;
      gap: 8px;
      margin: 14px 0 16px;
      padding: 8px 13px;
      border: 1px solid rgba(215,180,106,.22);
      border-radius: 999px;
      background: rgba(215,180,106,.08);
      color: rgba(255,249,238,.62);
      font-size: 13px;
      line-height: 1.45;
    }

    .list-empty {
      display: grid;
      place-items: center;
      min-height: 148px;
      padding: 24px;
      border: 1px dashed rgba(215,180,106,.24);
      border-radius: var(--radius);
      background: rgba(255,249,238,.035);
      color: rgba(255,249,238,.58);
      text-align: center;
      line-height: 1.75;
    }

    .result-grid {
      width: 100%;
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 12px;
    }

    .result-card {
      overflow: hidden;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: rgba(0,0,0,.28);
    }

    .result-card img {
      width: 100%;
      aspect-ratio: 1 / 1;
      object-fit: cover;
      display: block;
      cursor: zoom-in;
    }

    .result-card a, .asset-item a {
      display: block;
      padding: 10px 12px;
      color: var(--gold-2);
      text-decoration: none;
      font-size: 13px;
    }

    .result-actions {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 1px;
      background: rgba(255,249,238,.08);
    }

    .result-actions a,
    .result-actions button {
      border: 0;
      padding: 10px 8px;
      color: var(--gold-2);
      background: rgba(0,0,0,.25);
      text-decoration: none;
      font: inherit;
      font-size: 12px;
      cursor: pointer;
      text-align: center;
    }

    .result-actions a:hover,
    .result-actions button:hover {
      background: rgba(215,180,106,.16);
    }

    .image-lightbox {
      position: fixed;
      inset: 0;
      z-index: 80;
      display: grid;
      place-items: center;
      padding: 24px;
      background: rgba(12,8,5,.82);
      backdrop-filter: blur(16px);
    }

    .image-lightbox[hidden] {
      display: none;
    }

    .image-lightbox-inner {
      width: min(1100px, 96vw);
      max-height: 92vh;
      display: grid;
      gap: 12px;
    }

    .image-lightbox-bar {
      display: flex;
      justify-content: flex-end;
      gap: 10px;
    }

    .image-lightbox img {
      width: 100%;
      max-height: calc(92vh - 58px);
      object-fit: contain;
      border: 1px solid rgba(255,249,238,.16);
      border-radius: var(--radius-soft);
      background: rgba(0,0,0,.38);
      box-shadow: 0 30px 80px rgba(0,0,0,.45);
    }

    .video-lightbox video {
      width: 100%;
      max-height: calc(92vh - 58px);
      display: block;
      background: #050505;
      border: 1px solid rgba(255,249,238,.16);
      border-radius: var(--radius-soft);
      box-shadow: 0 30px 80px rgba(0,0,0,.45);
    }

    .output-actions {
      width: 100%;
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 10px;
      margin-top: 14px;
    }

    .output-actions.start {
      justify-content: flex-start;
    }

    .task-item-head {
      display: flex;
      justify-content: space-between;
      gap: 10px;
      align-items: flex-start;
    }

    .inline-error {
      color: #ffb6a9;
    }

    .task-cost-row {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
    }

    .task-cost-row span {
      width: fit-content;
      padding: 5px 8px;
      border: 1px solid rgba(215,180,106,.18);
      border-radius: 999px;
      color: var(--gold-2);
      background: rgba(215,180,106,.08);
      font-size: 11px;
      line-height: 1.35;
    }

    .status.spaced {
      margin-top: 12px;
    }

    .admin-help {
      margin-top: 8px;
      color: rgba(255,249,238,.66);
      line-height: 1.7;
    }

    .check-line {
      min-height: 46px;
      display: flex;
      align-items: center;
      gap: 9px;
      padding: 0 14px;
      border: 1px solid rgba(215,180,106,.2);
      border-radius: 8px;
      color: rgba(255,249,238,.82);
      background: rgba(255,255,255,.025);
      font-size: 13px;
    }

    .check-line input { width: 16px; height: 16px; accent-color: var(--gold); }
    .text-link { color: var(--gold-2); font-size: 13px; text-decoration: none; }
    .text-link:hover { color: #fff0b3; }
    .image-engine-note { display: block; margin-top: -2px; color: rgba(255,249,238,.58); line-height: 1.6; }

    .quick-chips {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
    }

    .quick-chip {
      border: 1px solid rgba(215,180,106,.28);
      border-radius: 12px;
      padding: 8px 10px;
      color: rgba(255,249,238,.82);
      background: rgba(215,180,106,.085);
      font-size: 12px;
      line-height: 1.35;
      transition: .16s ease;
    }

    .quick-chip.active {
      color: #17110b;
      border-color: transparent;
      background: linear-gradient(135deg, #f4d98d, #d4ad58);
      font-weight: 700;
    }

    .beauty-project-box {
      display: grid;
      gap: 12px;
      padding: 14px;
      border: 1px solid rgba(215,180,106,.28);
      border-radius: var(--radius);
      background: linear-gradient(135deg, rgba(215,180,106,.11), rgba(255,249,238,.045));
    }

    .beauty-project-box .field {
      margin: 0;
    }

    .beauty-project-note {
      border-left: 2px solid rgba(244,217,141,.72);
      padding-left: 11px;
      color: rgba(255,249,238,.72);
      font-size: 12px;
      line-height: 1.65;
    }

    .realism-boost {
      display: grid;
      gap: 8px;
      padding: 13px;
      border: 1px solid rgba(215,180,106,.36);
      border-radius: var(--radius);
      background: linear-gradient(135deg, rgba(215,180,106,.16), rgba(255,249,238,.06));
    }

    .realism-boost label {
      margin: 0;
    }

    .realism-boost .quick-chip {
      width: fit-content;
      padding: 10px 14px;
      border-color: rgba(215,180,106,.52);
      background: rgba(215,180,106,.18);
      font-weight: 700;
    }

    .realism-boost .realism-toggle {
      display: inline-flex;
      align-items: center;
      gap: 9px;
    }

    .realism-boost .realism-toggle.active {
      color: #17110b;
      border-color: transparent;
      background: linear-gradient(135deg, #f4d98d, #d4ad58);
      box-shadow: 0 7px 18px rgba(215,180,106,.2);
    }

    .realism-toggle-state {
      padding-left: 9px;
      border-left: 1px solid currentColor;
      font-size: 11px;
      font-weight: 800;
      opacity: .78;
    }

    .realism-boost .realism-toggle:not(.active) .realism-toggle-state {
      color: var(--gold-2);
      opacity: 1;
    }

    .upload-box {
      position: relative;
      display: grid;
      grid-template-columns: 54px minmax(0, 1fr);
      column-gap: 14px;
      row-gap: 4px;
      align-items: center;
      min-height: 104px;
      padding: 16px;
      border: 1px dashed rgba(215,180,106,.46);
      border-radius: var(--radius-soft);
      background:
        linear-gradient(135deg, rgba(255,249,238,.09), rgba(215,180,106,.07)),
        rgba(255,249,238,.04);
      transition: .18s ease;
      overflow: hidden;
    }

    .upload-box:hover {
      border-color: rgba(255,220,150,.78);
      background:
        linear-gradient(135deg, rgba(255,249,238,.13), rgba(215,180,106,.11)),
        rgba(255,249,238,.055);
    }

    .upload-box::before {
      content: "+";
      width: 54px;
      height: 54px;
      display: grid;
      place-items: center;
      border-radius: 14px;
      color: #17110b;
      background: linear-gradient(135deg, #fff1c0, #c69a45);
      font-size: 30px;
      font-family: inherit;
      line-height: 1;
      box-shadow: 0 14px 36px rgba(0,0,0,.22);
      grid-row: 1 / span 2;
      align-self: center;
    }

    .upload-box label {
      display: block;
      grid-column: 2;
      min-width: 0;
      margin: 2px 0 0;
      color: rgba(255,249,238,.92);
      font-size: 15px;
      font-weight: 700;
      line-height: 1.35;
    }

    .upload-box small {
      display: block;
      grid-column: 2;
      min-width: 0;
      color: var(--muted);
      font-size: 12px;
      line-height: 1.55;
    }

    .upload-box input[type="file"] {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      opacity: 0;
      cursor: pointer;
    }

    .tool-note {
      padding: 12px 14px;
      border: 1px solid rgba(215,180,106,.26);
      border-radius: var(--radius);
      color: rgba(255,249,238,.78);
      background: rgba(255,249,238,.045);
      font-size: 13px;
      line-height: 1.7;
    }

    .tool-note strong {
      color: rgba(255,249,238,.94);
      font-weight: 700;
    }

    .tool-note-title {
      margin-bottom: 10px;
      color: rgba(255,249,238,.94);
      font-weight: 700;
    }

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

    .tool-note-options span,
    .tool-note-options .tool-note-choice {
      display: block;
      padding: 10px 11px;
      border: 1px solid rgba(255,249,238,.1);
      border-radius: var(--radius);
      background: rgba(0,0,0,.13);
      color: var(--muted);
      font-size: 12px;
      line-height: 1.55;
    }

    .tool-note-options .tool-note-choice {
      width: 100%;
      font: inherit;
      text-align: left;
      cursor: pointer;
      transition: border-color .18s ease, background .18s ease, transform .18s ease;
    }

    .tool-note-options .tool-note-choice:hover {
      border-color: rgba(215,180,106,.48);
      transform: translateY(-1px);
    }

    .tool-note-options .tool-note-choice.active {
      border-color: rgba(215,180,106,.72);
      background: linear-gradient(135deg, rgba(215,180,106,.2), rgba(50,40,22,.44));
      color: #fff9ee;
    }

    .tool-note-options b {
      display: block;
      margin-bottom: 4px;
      color: rgba(255,249,238,.9);
      font-size: 12px;
      font-weight: 700;
    }

    .upload-box.has-preview {
      align-items: start;
    }

    .upload-box.has-preview::before {
      content: "✓";
      font-family: inherit;
      font-size: 24px;
      font-weight: 800;
      align-self: start;
    }

    .upload-preview {
      grid-column: 1 / -1;
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      margin-top: 2px;
      padding-top: 10px;
      border-top: 1px solid rgba(255,249,238,.12);
    }

    .upload-preview-item {
      width: 84px;
      min-width: 84px;
    }

    .upload-preview-item img,
    .upload-preview-item video {
      width: 84px;
      height: 84px;
      display: block;
      object-fit: cover;
      border-radius: 12px;
      border: 1px solid rgba(215,180,106,.36);
      background: rgba(0,0,0,.26);
      box-shadow: 0 14px 28px rgba(0,0,0,.24);
    }

    .upload-preview-item span {
      display: block;
      margin-top: 6px;
      color: rgba(255,249,238,.72);
      font-size: 11px;
      line-height: 1.35;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .agree-line {
      display: grid;
      grid-template-columns: 18px minmax(0, 1fr);
      gap: 9px;
      align-items: start;
      color: rgba(255,249,238,.72);
      font-size: 12px;
      line-height: 1.7;
    }

    .agree-line input {
      width: 18px;
      min-height: 18px;
      margin-top: 2px;
      accent-color: var(--gold);
    }

    .asset-list, .project-list { display: grid; gap: 10px; }

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

    .market-toolbar {
      display: grid;
      grid-template-columns: minmax(220px, 1.15fr) minmax(170px, .7fr) minmax(170px, .7fr) auto;
      gap: 10px;
      align-items: end;
      margin: 14px 0;
    }

    .market-toolbar label {
      display: grid;
      gap: 7px;
      color: var(--muted);
      font-size: 12px;
    }

    .market-card {
      overflow: hidden;
      border: 1px solid rgba(255,249,238,.11);
      border-radius: var(--radius);
      background: rgba(255,249,238,.052);
      box-shadow: 0 14px 30px rgba(0,0,0,.16);
      display: grid;
    }

    .market-thumb {
      width: 100%;
      aspect-ratio: 4 / 3;
      display: block;
      object-fit: cover;
      background: rgba(0,0,0,.24);
    }

    .market-card-body {
      display: grid;
      gap: 9px;
      padding: 13px;
    }

    .market-card-body strong {
      color: rgba(255,249,238,.94);
      font-size: 15px;
    }

    .market-card-body span {
      color: var(--muted);
      font-size: 12px;
      line-height: 1.6;
    }

    .market-card-body code {
      max-height: 72px;
      overflow: auto;
    }

    .market-meta {
      display: flex;
      flex-wrap: wrap;
      gap: 7px;
      align-items: center;
    }

    .market-tag {
      width: fit-content;
      padding: 4px 8px;
      border: 1px solid rgba(215,180,106,.28);
      border-radius: 999px;
      color: var(--gold-2);
      background: rgba(215,180,106,.08);
      font-size: 11px;
    }

    .market-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      margin-top: 2px;
    }

    .market-modal {
      position: fixed;
      inset: 0;
      z-index: 92;
      display: grid;
      place-items: center;
      padding: 18px;
      background: rgba(0,0,0,.58);
      backdrop-filter: blur(10px);
    }

    .market-modal-card {
      width: min(780px, 100%);
      max-height: min(760px, calc(100vh - 36px));
      overflow: auto;
      border: 1px solid rgba(215,180,106,.24);
      border-radius: var(--radius-lg);
      background: rgba(14,12,9,.96);
      box-shadow: 0 30px 90px rgba(0,0,0,.5);
      padding: 18px;
      display: grid;
      gap: 14px;
    }

    .market-detail-layout {
      display: grid;
      grid-template-columns: minmax(220px, .8fr) 1fr;
      gap: 16px;
      align-items: start;
    }

    .asset-item, .project-item {
      display: grid;
      gap: 10px;
      padding: 14px;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: rgba(255,249,238,.052);
    }

    .asset-item strong, .project-item strong { display: block; }
    .asset-item span, .project-item span, code {
      display: block;
      color: var(--muted);
      font-size: 12px;
      line-height: 1.7;
      word-break: break-all;
    }

    .asset-hero {
      display: grid;
      grid-template-columns: minmax(0, 1fr);
      gap: 14px;
      align-items: stretch;
      margin-bottom: 16px;
    }

    .asset-hero-main {
      min-height: 0;
      padding: 22px 26px;
      border: 1px solid rgba(215,180,106,.18);
      border-radius: var(--radius);
      background:
        radial-gradient(circle at 88% 12%, rgba(215,180,106,.18), transparent 32%),
        linear-gradient(135deg, rgba(255,249,238,.075), rgba(215,180,106,.045)),
        rgba(9,8,6,.68);
      display: grid;
      align-content: start;
      gap: 12px;
      box-shadow: var(--shadow-soft);
    }

    .asset-hero-main h2 {
      max-width: 680px;
      font-size: 30px;
      line-height: 1.2;
    }

    .asset-hero-main .lead {
      max-width: 720px;
      color: rgba(255,249,238,.72);
      font-size: 14px;
      line-height: 1.75;
    }

    .asset-hero-main .hero-actions {
      margin-top: 4px;
      padding-top: 14px;
      border-top: 1px solid rgba(255,249,238,.1);
    }

    .asset-hero-side {
      padding: 18px 20px;
      border: 1px solid rgba(215,180,106,.16);
      border-radius: var(--radius-lg);
      background:
        linear-gradient(135deg, rgba(215,180,106,.08), rgba(255,249,238,.025)),
        rgba(8,7,5,.5);
      display: grid;
      gap: 12px;
      margin-bottom: 16px;
    }

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

    .asset-metric {
      padding: 13px;
      border-radius: 14px;
      border: 1px solid rgba(215,180,106,.18);
      background: rgba(255,249,238,.055);
    }

    .asset-metric strong {
      display: block;
      color: var(--gold-2);
      font-size: 22px;
      line-height: 1.1;
    }

    .asset-metric span {
      color: rgba(255,249,238,.58);
      font-size: 11px;
    }

    .asset-library-tabs {
      display: flex;
      flex-wrap: wrap;
      gap: 9px;
      margin: 12px 0 16px;
    }

    .asset-library-tabs .quick-chip {
      padding-inline: 16px;
    }

    .asset-workflow-grid {
      display: grid;
      grid-template-columns: minmax(320px, .42fr) minmax(0, 1fr);
      gap: 14px;
      align-items: start;
    }

    .asset-add-card {
      position: sticky;
      top: 14px;
      border: 1px solid rgba(215,180,106,.2);
      background:
        linear-gradient(155deg, rgba(215,180,106,.1), rgba(255,249,238,.035)),
        rgba(8,7,5,.62);
    }

    .asset-kind-grid {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 9px;
    }

    .asset-kind-card {
      padding: 12px;
      border-radius: 14px;
      border: 1px solid rgba(255,249,238,.1);
      background: rgba(255,249,238,.045);
      display: grid;
      gap: 6px;
    }

    .asset-kind-card strong {
      color: rgba(255,249,238,.92);
      font-size: 13px;
    }

    .asset-kind-card span {
      color: rgba(255,249,238,.55);
      font-size: 11px;
      line-height: 1.55;
    }

    .material-grid {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 12px;
    }

    .asset-task-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 12px;
      width: 100%;
      min-width: 0;
    }

    .asset-task-grid .project-item {
      min-width: 0;
      max-width: 100%;
      overflow: hidden;
      align-content: start;
      padding: 12px;
    }

    .generation-record-card > *,
    .task-technical-details,
    .task-technical-details div { min-width: 0; max-width: 100%; }
    .generation-record-card span,
    .generation-record-card strong,
    .generation-record-card code,
    .task-technical-details pre { overflow-wrap: anywhere; word-break: break-word; white-space: pre-wrap; }
    .generation-record-card > .status,
    .generation-record-card .task-cost-row { white-space: normal; overflow-wrap: anywhere; word-break: break-word; }
    .generation-record-card > .status {
      min-height: 44px;
      padding: 12px 13px;
      border-radius: 12px;
      font-size: 13px;
    }
    .generation-record-meta, .generation-filters { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; }
    .generation-record-meta span { padding: 4px 8px; border: 1px solid rgba(215,180,106,.2); border-radius: 999px; color: rgba(255,249,238,.66); font-size: 11px; }
    .generation-history-notice { margin: 0 0 14px; }
    .generation-asset-shell { display: grid; min-width: 0; }
    [data-generation-asset][hidden], .generation-asset-error[hidden] { display: none !important; }
    .generation-asset-error { padding: 14px; border: 1px dashed rgba(255,255,255,.24); border-radius: 12px; color: var(--muted); overflow-wrap: anywhere; }
    .generation-history-filter-region { margin: 0 0 14px; padding: 2px 0; min-width: 0; }
    .generation-filters { margin: 0; }
    .generation-filters > span { margin-left: auto; color: rgba(255,249,238,.58); font-size: 13px; }
    .task-technical-details { border-top: 1px solid rgba(255,249,238,.1); padding-top: 9px; }
    .task-technical-details summary { cursor: pointer; color: var(--gold-2); font-size: 12px; }
    .task-technical-details > div { display: grid; gap: 7px; margin-top: 8px; }
    .task-technical-details code { display: block; width: 100%; }
    .task-technical-details pre { margin: 0; color: #f1b9ae; font: 11px/1.55 ui-monospace, monospace; }

    .asset-task-grid .task-item-head {
      align-items: center;
    }

    .asset-task-grid .record-media {
      grid-template-columns: 1fr;
      margin-top: 0;
    }

    .asset-task-grid .record-media img,
    .asset-task-grid .record-media video {
      aspect-ratio: 4 / 3;
    }

    .asset-task-grid code {
      display: none;
    }

    .asset-task-grid .output-actions {
      justify-content: flex-start;
      gap: 6px;
    }

    .asset-task-grid .output-actions .btn {
      min-height: 32px;
      padding: 0 10px;
      font-size: 11px;
    }

    .material-card {
      overflow: hidden;
      border: 1px solid rgba(255,249,238,.1);
      border-radius: var(--radius);
      background:
        linear-gradient(180deg, rgba(255,249,238,.055), rgba(255,249,238,.025)),
        rgba(10,8,6,.52);
      display: grid;
      min-width: 0;
    }

    .material-thumb {
      aspect-ratio: 4 / 3;
      background:
        radial-gradient(circle at 70% 15%, rgba(215,180,106,.18), transparent 34%),
        rgba(255,249,238,.055);
      display: grid;
      place-items: center;
      overflow: hidden;
    }

    .material-thumb img,
    .material-thumb video {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
    }

    .material-thumb span {
      color: rgba(255,249,238,.62);
      font-size: 13px;
    }

    .material-body {
      display: grid;
      gap: 8px;
      padding: 13px;
    }

    .material-body strong {
      color: rgba(255,249,238,.94);
      font-size: 15px;
      line-height: 1.35;
      overflow-wrap: anywhere;
      word-break: break-word;
    }

    .material-body p {
      margin: 0;
      color: rgba(255,249,238,.58);
      font-size: 12px;
      line-height: 1.65;
      overflow-wrap: anywhere;
      word-break: break-word;
    }

    .material-card > *, .material-body > * { min-width: 0; max-width: 100%; }

    .material-meta {
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
    }

    .material-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      margin-top: 2px;
    }

    .material-actions .btn {
      min-height: 34px;
      padding: 0 12px;
      font-size: 12px;
    }

    code {
      width: fit-content;
      max-width: 100%;
      margin-top: 8px;
      padding: 5px 8px;
      border-radius: 10px;
      background: rgba(0,0,0,.22);
      color: var(--gold-2);
      user-select: all;
    }

    .record-media {
      margin-top: 12px;
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(120px, 180px));
      gap: 10px;
    }

    .task-pagination {
      display: flex;
      align-items: center;
      justify-content: center;
      flex-wrap: wrap;
      gap: 8px;
      margin: 18px 0 8px;
    }

    .task-pagination .btn {
      min-width: 42px;
      padding-inline: 12px;
    }

    .task-pagination-summary {
      margin-right: 4px;
      color: rgba(255,249,238,.58);
      font-size: 13px;
    }

    .record-media img,
    .record-media video {
      width: 100%;
      aspect-ratio: 1 / 1;
      object-fit: cover;
      border: 1px solid rgba(255,249,238,.14);
      border-radius: var(--radius);
      background: rgba(0,0,0,.26);
      cursor: zoom-in;
    }

    .record-video-preview {
      position: relative;
      display: block;
      width: 100%;
      padding: 0;
      overflow: hidden;
      border: 0;
      border-radius: var(--radius);
      background: rgba(0,0,0,.26);
      cursor: pointer;
      text-align: left;
    }

    .record-video-preview::after {
      content: "点击播放";
      position: absolute;
      left: 12px;
      bottom: 12px;
      padding: 7px 10px;
      border: 1px solid rgba(255,249,238,.24);
      border-radius: 999px;
      color: var(--cream);
      background: rgba(8,6,4,.72);
      font-size: 13px;
      font-weight: 700;
      pointer-events: none;
    }

    .record-video-preview:hover video {
      transform: scale(1.02);
    }

    .record-video-preview video {
      display: block;
      transition: transform .2s ease;
    }

    .prompt-details {
      margin-top: 10px;
      border: 1px solid rgba(255,249,238,.1);
      border-radius: 14px;
      background: rgba(0,0,0,.18);
      overflow: hidden;
    }

    .prompt-details summary {
      padding: 10px 12px;
      cursor: pointer;
      color: var(--gold-2);
      font-size: 13px;
      list-style: none;
    }

    .prompt-details summary::-webkit-details-marker {
      display: none;
    }

    .prompt-details .reference-help {
      margin: 0 12px 12px;
      color: var(--muted);
      font-size: 12px;
      line-height: 1.6;
    }

    .upload-preview-item audio {
      width: 84px;
      height: 32px;
      margin-top: 26px;
    }

    .prompt-details pre {
      margin: 0;
      padding: 0 12px 12px;
      color: rgba(255,249,238,.74);
      font: inherit;
      font-size: 12px;
      line-height: 1.7;
      white-space: pre-wrap;
      word-break: break-word;
    }

    .vip-prompt-lock {
      margin-top: 8px;
      padding: 16px;
      border: 1px solid rgba(224,188,86,.44);
      border-radius: 12px;
      background: linear-gradient(135deg, rgba(214,173,63,.16), rgba(20,16,10,.48));
    }

    .vip-prompt-lock strong { display: block; color: var(--cream); font-size: 15px; }
    .vip-prompt-lock p { margin: 6px 0 12px; color: var(--muted); font-size: 13px; line-height: 1.65; }
    .vip-prompt-lock .pill { display: inline-flex; margin: 0 0 8px; }
    textarea.vip-prompt-hidden { display: none !important; }
    .prompt-vip-record { margin-top: 10px; padding: 11px 12px; border: 1px solid rgba(224,188,86,.3); border-radius: 12px; color: var(--muted); background: rgba(214,173,63,.07); font-size: 13px; }
    .prompt-vip-record strong { color: var(--gold-2); }
    .recharge-purchase-box { transition: box-shadow .25s ease, border-color .25s ease; }
    .recharge-purchase-box.highlight { border-color: var(--gold-2); box-shadow: 0 0 0 4px rgba(224,188,86,.15); }
    .recharge-purchase-box small { display: block; margin-top: 10px; color: var(--muted); line-height: 1.55; }
    .recharge-steps { margin: 12px 0 14px; }
    .recharge-entry-btn { box-shadow: 0 8px 22px rgba(214,173,63,.17); }
    .feature-unavailable { min-height: 360px; display: grid; place-items: center; text-align: center; padding: 28px; border: 1px dashed rgba(215,180,106,.28); border-radius: var(--radius); background: rgba(255,249,238,.025); }
    .feature-unavailable h2 { margin: 10px 0 8px; }
    .feature-unavailable p { max-width: 440px; margin: 0; color: var(--muted); line-height: 1.7; }

    .mobile-topbar, .mobile-tabbar { display: none; }

    @media (max-width: 1020px) {
      .hero, .studio { grid-template-columns: 1fr; }
      .luxury-hero { grid-template-columns: 1fr; }
      .home-product-intro { grid-template-columns: 1fr; }
      .home-product-copy { border-right: 0; border-bottom: 1px solid rgba(255,249,238,.1); }
      .home-product-route { flex-wrap: wrap; }
      .home-product-visual { min-height: 450px; }
      .home-scene-grid { grid-template-columns: 1fr; }
      .home-usecase-grid { grid-template-columns: 1fr; }
      .workspace-hero-head { grid-template-columns: 1fr; }
      .workspace-hero-head.video-hero { grid-template-columns: 1fr; }
      .workspace-video-demo { max-width: 540px; }
      .content-guide-grid { grid-template-columns: 1fr; }
      .tool-rail { position: static; }
      .asset-overview, .asset-layout { grid-template-columns: 1fr; }
      .asset-hero, .asset-workflow-grid { grid-template-columns: 1fr; }
      .asset-add-card { position: static; }
      .asset-kind-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .material-grid, .asset-task-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
      .admin-overview, .admin-layout { grid-template-columns: 1fr; }
      .admin-login-card { position: static; }
      .grid.cols-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    }

    @media (max-width: 880px) {
      .material-grid, .asset-task-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    }

    @media (max-width: 760px) {
      .app { grid-template-columns: 1fr; }
      .sidebar { display: none; }
      main { padding: 76px 14px calc(132px + env(safe-area-inset-bottom, 0px)); }
      .mobile-topbar {
        position: fixed;
        inset: 0 0 auto 0;
        z-index: 20;
        height: 58px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 10px 14px;
        border-bottom: 1px solid var(--line);
        background: rgba(10,9,7,.9);
        backdrop-filter: blur(20px);
      }
      .mobile-account {
        display: flex;
        align-items: center;
        gap: 8px;
        min-width: 0;
      }
      .mobile-account .pill {
        max-width: 112px;
        overflow: hidden;
        text-overflow: ellipsis;
      }
      .mobile-account .btn {
        min-height: 34px;
        padding: 8px 11px;
        font-size: 12px;
        white-space: nowrap;
      }
      .invite-card {
        grid-template-columns: 1fr;
      }
      .asset-hero-main {
        min-height: auto;
        padding: 18px;
      }
      .asset-hero-main h2 {
        font-size: 28px;
      }
      .asset-metrics, .asset-kind-grid, .material-grid, .asset-task-grid {
        grid-template-columns: 1fr;
      }
      .material-actions .btn {
        flex: 1 1 120px;
      }
      .invite-qr {
        width: 132px;
        height: 132px;
        justify-self: center;
      }
      .referral-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
      .referral-friend {
        grid-template-columns: 1fr;
      }
      .mobile-tabbar {
        position: fixed;
        inset: auto 10px calc(10px + env(safe-area-inset-bottom, 0px)) 10px;
        z-index: 20;
        display: grid;
        grid-template-columns: repeat(5, 1fr);
        gap: 6px;
        padding: 8px;
        border: 1px solid var(--line);
        border-radius: 22px;
        background: rgba(10,9,7,.9);
        backdrop-filter: blur(20px);
      }
      .page.active::after {
        content: "";
        display: block;
        height: 28px;
      }
      .mobile-tabbar button {
        display: grid;
        gap: 2px;
        place-items: center;
        min-height: 48px;
        border-radius: 16px;
      }
      .mobile-tabbar button.active {
        color: var(--ink);
        background: rgba(255,249,238,.1);
      }
      .mobile-tabbar b { color: var(--gold-2); }
      .mobile-tabbar span { font-size: 11px; }
      .topbar { display: none; }
      .site-notice { margin: -4px 0 14px; padding: 10px 11px; gap: 8px; border-radius: 10px; }
      .site-notice-mark { display: none; }
      .site-notice-copy { font-size: 12px; }
      .site-notice-copy b { display: block; margin: 0 0 2px; }
      .site-notice-action { font-size: 11px; }
      .hero { min-height: auto; }
      .hero-copy, .visual-card { min-height: 330px; }
      .hero-copy.luxury { min-height: auto; padding: 24px; gap: 26px; }
      .hero h2 { font-size: 36px; }
      .hero-copy.luxury h2 { font-size: 38px; }
      .hero-title span { font-size: 22px; }
      .hero-title strong { font-size: 42px; line-height: 1.08; white-space: normal; }
      .hero-subtitle p { font-size: 14px; line-height: 1.75; }
      .hero-subtitle-tags { gap: 7px; }
      .hero-subtitle-tags span { min-height: 28px; padding: 6px 9px; font-size: 11.5px; }
      .hero-note { grid-template-columns: 1fr; margin-top: 24px; gap: 12px; }
      .hero-note span { min-height: auto; padding: 14px; }
      .hero-actions { margin-top: 24px; padding-top: 18px; gap: 10px; }
      .hero-actions .btn { width: 100%; }
      .hero-showcase { min-height: 460px; }
      .home-product-copy { padding: 26px 20px; }
      .home-product-copy h2 { margin: 18px 0 14px; font-size: 38px; }
      .home-product-copy .lead { font-size: 14px; }
      .home-product-flow { margin-top: 22px; }
      .home-product-flow span { min-height: 72px; padding: 11px 9px; font-size: 11px; }
      .home-product-actions { margin-top: 22px; }
      .home-product-actions .btn { flex: 1 1 100%; }
      .home-product-visual { min-height: 400px; padding: 18px; }
      .home-result-stack { right: 16px; bottom: 18px; left: 16px; gap: 7px; }
      .home-result-card { min-height: 124px; padding: 12px 10px; }
      .home-result-card em { margin-bottom: 12px; font-size: 10px; }
      .home-result-card b { font-size: 13px; }
      .home-result-card span { font-size: 10.5px; }
      .home-usecase-head { align-items: start; }
      .home-usecase-head h3 { font-size: 18px; }
      .home-usecase-card { min-height: 0; }
      .home-usecase-card img, .home-usecase-card video { height: 210px; }
      .showcase-photo { inset: 14px 14px 142px; }
      .showcase-card { left: 16px; right: 16px; bottom: 16px; }
      .workflow-ribbon { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .home-feature-card { min-height: 300px; }
      .workspace-hero-head { padding: 18px; }
      .workspace-title-row h2 { font-size: 24px; }
      .workspace-flow { grid-template-columns: 1fr; }
      .workspace-flow span { min-height: 42px; }
      .workspace-video-demo { grid-template-columns: 1fr; }
      .workspace-video-demo-media { max-width: 100%; }
      .tool-note-options { grid-template-columns: 1fr; }
      .voice-control-grid { grid-template-columns: 1fr; gap: 8px; }
      #videoSpeech { min-height: 58px; }
      .tool-list { grid-template-columns: 1fr; }
      .market-grid { grid-template-columns: 1fr; }
      .market-toolbar, .market-detail-layout { grid-template-columns: 1fr; }
      .grid.cols-3, .grid.cols-2, .two, .three, .result-grid { grid-template-columns: 1fr; }
      .image-base-settings { grid-template-columns: 1fr; }
      .video-settings-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
      .video-settings-grid select { min-height: 46px; padding: 0 10px; font-size: 13px; }
      .form { gap: 16px; }
      .form > .btn,
      .form > .two + .btn,
      .form > .field + .btn {
        margin-top: 4px;
      }
      .form > .btn,
      .project-item > .btn,
      .project-item > button.btn {
        width: 100%;
      }
      .project-item { gap: 12px; padding: 15px; }
      .project-item .two { gap: 12px; margin-top: 2px; }
      .project-item .two + .btn,
      .project-item .two + button {
        margin-top: 4px;
      }
      .admin-data-card .project-list { gap: 14px; }
      .sales-kit-grid { grid-template-columns: 1fr; }
      .admin-wallet-card { grid-template-columns: 1fr; }
      .admin-wallet-value { text-align: left; font-size: 28px; }
      .admin-data-card .project-item [data-adjust-submit] {
        min-height: 44px;
      }
      .section-head { align-items: start; flex-direction: column; }
      .upload-box { grid-template-columns: 46px minmax(0, 1fr); min-height: 96px; padding: 14px; column-gap: 12px; }
      .upload-box::before { width: 46px; height: 46px; font-size: 26px; }
      .upload-box label { font-size: 14px; }
      .upload-box small { font-size: 11px; line-height: 1.5; }
      textarea { font-size: 12px; }
      textarea[id$="Prompt"], #copyInput { font-size: 11.5px; min-height: 140px; }
    }
    .universal-preview-devices{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(320px,.65fr);gap:20px;align-items:start;margin:18px 0}.universal-preview-devices>section{min-width:0}.universal-preview-devices>section>header{display:flex;justify-content:space-between;gap:12px;margin-bottom:8px}.universal-preview-shell{border:1px solid var(--line);border-radius:20px;background:var(--panel);padding:22px;box-shadow:var(--shadow)}.universal-preview-shell.mobile{max-width:390px;margin:auto;padding:16px;border-radius:26px}.universal-preview-form{display:grid;gap:14px}.universal-preview-field,.universal-preview-upload{border:1px solid var(--line);border-radius:14px;padding:14px;background:var(--soft)}.universal-preview-field>div:first-child{display:flex;justify-content:space-between;gap:10px}.universal-preview-field p,.universal-preview-upload p{margin:5px 0 10px;color:var(--muted);font-size:13px}.universal-preview-choices{display:grid;grid-template-columns:repeat(auto-fit,minmax(135px,1fr));gap:8px}.universal-preview-choices label{display:flex;align-items:center;gap:7px;padding:9px 10px;border:1px solid var(--line);border-radius:10px;background:#fff}.universal-preview-upload>div{border:1px dashed var(--line);border-radius:12px;padding:18px;text-align:center}.universal-preview-result{white-space:pre-wrap;word-break:break-word;max-height:520px;overflow:auto;background:#111827;color:#f8fafc;border-radius:14px;padding:16px;min-height:80px}.universal-preview-shell.mobile .universal-preview-choices{grid-template-columns:1fr}@media(max-width:900px){.universal-preview-devices{grid-template-columns:1fr}.universal-preview-shell.mobile{max-width:none}}