body[data-ui-mode="app"] .topbar{
  min-height:72px;
  padding:12px 16px;
  gap:12px;
  flex-wrap:nowrap;
}

body[data-ui-mode="app"] .builder-intelligence{
  display:grid;
  gap:14px;
  padding:16px 18px 14px;
  border-top:1px solid rgba(173,156,133,.14);
  border-bottom:1px solid rgba(173,156,133,.14);
  background:linear-gradient(180deg,rgba(255,251,246,.92),rgba(249,244,236,.72));
}

body[data-ui-mode="app"] .builder-intelligence-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}

body[data-ui-mode="app"] .insight-block{
  display:grid;
  gap:6px;
  min-width:0;
  padding:14px 15px;
  border-radius:18px;
  border:1px solid rgba(173,156,133,.16);
  background:rgba(255,255,255,.62);
}

body[data-ui-mode="app"] .insight-block strong{
  font-size:14px;
  line-height:1.25;
  color:var(--um-ink);
}

body[data-ui-mode="app"] .insight-block p{
  margin:0;
  font-size:12px;
  line-height:1.5;
  color:var(--um-muted);
}

body[data-ui-mode="app"] .insight-label,
body[data-ui-mode="app"] .insight-row-label{
  font-size:11px;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#8a7d6a;
}

body[data-ui-mode="app"] .builder-intelligence-rows{
  display:grid;
  gap:10px;
}

body[data-ui-mode="app"] .insight-row{
  display:grid;
  gap:7px;
}

body[data-ui-mode="app"] .insight-tags{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

body[data-ui-mode="app"] .insight-tag{
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:0 11px;
  border-radius:999px;
  background:rgba(255,255,255,.84);
  border:1px solid rgba(173,156,133,.16);
  color:#355850;
  font-size:12px;
  font-weight:700;
  line-height:1;
}

body[data-ui-mode="app"] .insight-tag.muted{
  color:#867b6c;
  font-weight:600;
}

body[data-ui-mode="app"] .builder-meta-strip-v2{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

@media (max-width: 1180px){
  body[data-ui-mode="app"] .builder-intelligence-grid{
    grid-template-columns:1fr;
  }
}

@media (max-width: 720px){
  body[data-ui-mode="app"] .builder-intelligence{
    padding:12px 12px 10px;
  }

  body[data-ui-mode="app"] .insight-block{
    padding:12px;
    border-radius:14px;
  }
}

/* concept-16 desktop compaction */
@media (min-width: 1181px){
  body[data-ui-mode="app"] .sidebar{
    width:224px !important;
  }

  body[data-ui-mode="app"] .sidebar.collapsed{
    width:84px !important;
  }

  body[data-ui-mode="app"] .logo-badge{
    width:52px !important;
    height:52px !important;
    border-radius:16px !important;
  }

  body[data-ui-mode="app"] .shell-brand .font-black{
    font-size:1.45rem !important;
  }

  body[data-ui-mode="app"] .nav-item{
    min-height:46px !important;
    padding:0 14px !important;
    font-size:14px !important;
  }

  body[data-ui-mode="app"] .topbar-v2{
    min-height:82px !important;
    padding:14px 18px !important;
  }

  body[data-ui-mode="app"] .topbar-title{
    font-size:36px !important;
    letter-spacing:-.05em !important;
  }

  body[data-ui-mode="app"] .topbar-subtitle{
    font-size:14px !important;
  }

  body[data-ui-mode="app"] .shell-topbar-actions-v2 .btn,
  body[data-ui-mode="app"] .shell-mode-select-v2{
    min-height:42px !important;
    height:42px !important;
    font-size:13px !important;
  }

  body[data-ui-mode="app"] .workspace{
    padding:22px 22px 28px !important;
  }

  body[data-ui-mode="app"] .workspace-home-title{
    font-size:58px !important;
    max-width:760px !important;
  }

  body[data-ui-mode="app"] .workspace-home-text{
    max-width:620px !important;
    font-size:16px !important;
  }

  body[data-ui-mode="app"] .workspace-side-metric strong{
    font-size:28px !important;
  }

  body[data-ui-mode="app"] .workspace-band-title{
    font-size:28px !important;
  }

  body[data-ui-mode="app"] .builder-v2{
    grid-template-columns:minmax(300px,340px) minmax(0,1fr) !important;
    gap:18px !important;
  }

  body[data-ui-mode="app"] .panel-head-v2,
  body[data-ui-mode="app"] .preview-toolbar-v2{
    min-height:58px !important;
    padding:13px 15px !important;
  }

  body[data-ui-mode="app"] .panel-head-copy b,
  body[data-ui-mode="app"] .preview-toolbar-title{
    font-size:18px !important;
  }

  body[data-ui-mode="app"] .builder-textarea{
    min-height:132px !important;
    font-size:14px !important;
  }

  body[data-ui-mode="app"] .preview-frame-wrap{
    min-height:700px !important;
    padding:14px !important;
    border-radius:22px !important;
  }

  body[data-ui-mode="app"] .preview-frame.desktop{
    min-height:672px !important;
  }
}

@media (min-width: 1100px){
  body[data-ui-mode="app"]{
    font-size:14px;
  }

  body[data-ui-mode="app"] .app-shell{
    grid-template-columns:236px minmax(0,1fr) !important;
  }

  body[data-ui-mode="app"] .sidebar{
    width:236px !important;
    padding:20px 16px 18px !important;
    border-right:1px solid rgba(161,145,120,.14) !important;
    background:linear-gradient(180deg,rgba(246,240,231,.92),rgba(241,235,226,.86)) !important;
    box-shadow:none !important;
  }

  body[data-ui-mode="app"] .sidebar-inner{
    gap:0 !important;
  }

  body[data-ui-mode="app"] .shell-brand{
    gap:10px !important;
    margin-bottom:18px !important;
  }

  body[data-ui-mode="app"] .logo-badge{
    width:50px !important;
    height:50px !important;
    border-radius:14px !important;
    font-size:18px !important;
  }

  body[data-ui-mode="app"] .shell-section{
    margin:16px 0 8px !important;
    font-size:10px !important;
    letter-spacing:.16em !important;
  }

  body[data-ui-mode="app"] .nav-item.nav-item-v2{
    min-height:44px !important;
    padding:0 12px !important;
    border-radius:12px !important;
    font-size:13px !important;
    gap:10px !important;
  }

  body[data-ui-mode="app"] .nav-item.nav-item-v2 i{
    font-size:14px !important;
  }

  body[data-ui-mode="app"] .shell-footnote{
    margin-top:18px !important;
    padding:10px 12px !important;
    border-radius:14px !important;
  }

  body[data-ui-mode="app"] .main{
    padding:18px 22px 22px !important;
  }

  body[data-ui-mode="app"] .topbar-v2{
    min-height:74px !important;
    padding:14px 18px !important;
    border-radius:18px !important;
  }

  body[data-ui-mode="app"] .topbar-title{
    font-size:28px !important;
    letter-spacing:-.05em !important;
  }

  body[data-ui-mode="app"] .topbar-subtitle{
    font-size:12px !important;
  }

  body[data-ui-mode="app"] .shell-topbar-actions-v2{
    gap:8px !important;
  }

  body[data-ui-mode="app"] .shell-mode-select-v2,
  body[data-ui-mode="app"] .shell-topbar-actions-v2 .btn{
    height:38px !important;
    min-height:38px !important;
    border-radius:12px !important;
    font-size:12px !important;
    padding:0 12px !important;
  }

  body[data-ui-mode="app"] .workspace{
    padding-top:16px !important;
  }

  body[data-ui-mode="app"] .workspace-home{
    gap:18px !important;
  }

  body[data-ui-mode="app"] .workspace-home-hero{
    grid-template-columns:minmax(0,1.25fr) 240px !important;
    gap:22px !important;
    padding:2px 0 18px !important;
  }

  body[data-ui-mode="app"] .workspace-home-title{
    font-size:40px !important;
    line-height:.96 !important;
    max-width:700px !important;
  }

  body[data-ui-mode="app"] .workspace-home-text{
    max-width:560px !important;
    margin-top:12px !important;
    font-size:14px !important;
    line-height:1.55 !important;
  }

  body[data-ui-mode="app"] .workspace-home-actions{
    margin-top:18px !important;
    gap:10px !important;
  }

  body[data-ui-mode="app"] .workspace-side-metric{
    padding:10px 0 !important;
    font-size:13px !important;
  }

  body[data-ui-mode="app"] .workspace-side-metric strong{
    font-size:26px !important;
  }

  body[data-ui-mode="app"] .workspace-band-title{
    font-size:24px !important;
  }

  body[data-ui-mode="app"] .workspace-band-note{
    max-width:360px !important;
    font-size:12px !important;
    line-height:1.55 !important;
  }

  body[data-ui-mode="app"] .workspace-project-list{
    gap:0 !important;
  }

  body[data-ui-mode="app"] .workspace-project-row{
    grid-template-columns:52px minmax(0,1fr) auto !important;
    gap:14px !important;
    padding:14px 0 !important;
  }

  body[data-ui-mode="app"] .workspace-project-icon{
    width:38px !important;
    height:38px !important;
    border-radius:10px !important;
    font-size:16px !important;
  }

  body[data-ui-mode="app"] .workspace-project-title{
    font-size:18px !important;
  }

  body[data-ui-mode="app"] .workspace-project-meta,
  body[data-ui-mode="app"] .workspace-project-summary{
    font-size:12px !important;
  }

  body[data-ui-mode="app"] .workspace-project-actions{
    gap:8px !important;
  }

  body[data-ui-mode="app"] .workspace-project-actions .btn{
    height:34px !important;
    min-height:34px !important;
    padding:0 12px !important;
    font-size:12px !important;
  }

  body[data-ui-mode="app"] .builder-v2{
    grid-template-columns:minmax(300px,334px) minmax(0,1fr) !important;
    gap:14px !important;
    align-items:stretch !important;
  }

  body[data-ui-mode="app"] .chat-panel-v2,
  body[data-ui-mode="app"] .preview-panel-v2{
    background:rgba(255,251,245,.5) !important;
    border:1px solid rgba(161,145,120,.14) !important;
    border-radius:18px !important;
    overflow:hidden !important;
  }

  body[data-ui-mode="app"] .panel-head-v2,
  body[data-ui-mode="app"] .preview-toolbar-v2{
    padding:10px 12px !important;
    min-height:50px !important;
  }

  body[data-ui-mode="app"] .panel-head-copy b,
  body[data-ui-mode="app"] .preview-toolbar-title{
    font-size:14px !important;
  }

  body[data-ui-mode="app"] .mode-chip{
    min-height:28px !important;
    padding:0 10px !important;
    font-size:11px !important;
  }

  body[data-ui-mode="app"] .chat-list{
    padding:8px 12px !important;
    gap:8px !important;
  }

  body[data-ui-mode="app"] .chat-message.ai,
  body[data-ui-mode="app"] .chat-message.user{
    font-size:12px !important;
    line-height:1.5 !important;
  }

  body[data-ui-mode="app"] .chat-message.ai{
    padding:10px 12px !important;
    border-radius:14px !important;
  }

  body[data-ui-mode="app"] .chat-message.user{
    padding:10px 12px !important;
    border-radius:14px !important;
  }

  body[data-ui-mode="app"] .prompt-box-v2{
    padding:10px 12px 12px !important;
    border-top:1px solid rgba(161,145,120,.12) !important;
  }

  body[data-ui-mode="app"] .chip-row-v2{
    gap:8px !important;
    margin-bottom:8px !important;
  }

  body[data-ui-mode="app"] .chip-v2{
    min-height:30px !important;
    padding:0 10px !important;
    font-size:10px !important;
    border-radius:999px !important;
  }

  body[data-ui-mode="app"] .builder-textarea{
    min-height:92px !important;
    padding:10px !important;
    font-size:12px !important;
    line-height:1.5 !important;
    border-radius:14px !important;
  }

  body[data-ui-mode="app"] .preview-toolbar-actions .btn{
    height:32px !important;
    min-height:32px !important;
    padding:0 9px !important;
    font-size:12px !important;
  }

  body[data-ui-mode="app"] .builder-meta-strip-v2{
    display:none !important;
  }

  body[data-ui-mode="app"] .preview-stage{
    padding:12px !important;
  }

  body[data-ui-mode="app"] .preview-frame-wrap{
    min-height:560px !important;
    padding:8px !important;
    border-radius:18px !important;
    background:linear-gradient(180deg,#e4dfd7,#efebe4 58%,#e5eaeb) !important;
  }

  body[data-ui-mode="app"] .preview-viewport.desktop{
    max-width:none !important;
    width:100% !important;
  }
}

/* Desktop-first workspace refinement */
.platform-credit-pill{
  display:inline-flex;
  flex-direction:column;
  justify-content:center;
  min-width:96px;
  height:48px;
  padding:0 14px;
  border-radius:18px;
  background:rgba(255,255,255,.74);
  border:1px solid rgba(137,124,104,.18);
  box-shadow:0 10px 24px rgba(22,30,44,.06);
}

.platform-credit-label{
  font-size:10px;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#8f7d67;
}

.platform-credit-value{
  font-size:18px;
  font-weight:900;
  line-height:1.1;
  color:#172033;
}

.admin-surface{
  max-width:1080px;
  margin:0 auto;
}

.admin-form-card{
  padding:26px;
  border-radius:28px;
  background:linear-gradient(180deg,rgba(255,253,248,.98),rgba(246,240,231,.98));
  border:1px solid rgba(142,126,102,.16);
  box-shadow:0 14px 30px rgba(20,27,38,.05);
}

.admin-form-title{
  margin:0 0 18px;
  font-size:30px;
  font-weight:900;
  letter-spacing:-.04em;
  color:#172033;
}

.admin-form-grid{
  display:grid;
  grid-template-columns:minmax(0,1.2fr) 180px auto;
  gap:12px;
  align-items:center;
}

@media (min-width: 901px){
  .dashboard-v2,
  .workspace-home{
    gap:34px !important;
  }

  .hero-strip,
  .blank-workspace-card,
  .surface-card,
  .stat-card{
    border-radius:0 !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
  }

  .hero-strip{
    padding:0 0 26px !important;
    border-bottom:1px solid rgba(133,120,101,.14) !important;
  }

  .project-stats-grid-v2{
    gap:0 !important;
    border-top:1px solid rgba(133,120,101,.12);
    border-bottom:1px solid rgba(133,120,101,.12);
  }

  .project-stats-grid-v2 .stat-card{
    padding:18px 0 !important;
    min-height:auto !important;
  }

  .project-stats-grid-v2 .stat-card + .stat-card{
    border-left:1px solid rgba(133,120,101,.12);
    padding-left:28px !important;
    margin-left:28px;
  }

  .project-grid{
    grid-template-columns:1fr !important;
    gap:0 !important;
    border-top:1px solid rgba(133,120,101,.12);
  }

  .project-card-v2{
    display:grid !important;
    grid-template-columns:84px minmax(0,1fr) auto;
    align-items:center;
    gap:22px;
    padding:24px 0 !important;
    border-radius:0 !important;
    background:transparent !important;
    border:0 !important;
    border-bottom:1px solid rgba(133,120,101,.12) !important;
    box-shadow:none !important;
  }

  .project-card-v2:nth-child(3n+1),
  .project-card-v2:nth-child(3n+2),
  .project-card-v2:nth-child(3n+3){
    background:transparent !important;
  }

  .project-card-v2:hover{
    transform:none !important;
    border-color:rgba(84,114,196,.24) !important;
    background:rgba(255,255,255,.28) !important;
  }

  .project-card-icon{
    width:62px !important;
    height:62px !important;
    border-radius:18px !important;
    font-size:24px !important;
  }

  .project-card-title{
    font-size:30px !important;
    line-height:1.05 !important;
  }

  .project-card-meta{
    font-size:15px !important;
  }

  .project-card-actions{
    padding-left:20px;
    justify-content:flex-end !important;
  }

  .preview-panel-v2 .preview-toolbar-v2{
    row-gap:10px;
  }

  .preview-panel-v2 .preview-chip,
  .preview-panel-v2 .preview-meta-chip,
  .preview-panel-v2 .preview-provider-chip{
    display:none !important;
  }
}

@media (max-width: 900px){
  .admin-form-grid{
    grid-template-columns:1fr;
  }
}

body[data-ui-mode="app"] .topbar > div{
  min-width:0;
}

body[data-ui-mode="app"] .workspace{
  padding:0;
  overflow:auto !important;
}

body[data-ui-mode="app"] .dashboard{
  padding:18px;
}

body[data-ui-mode="app"] .builder{
  display:grid;
  grid-template-columns:minmax(320px,400px) minmax(0,1fr);
  gap:12px;
  padding:12px;
  min-height:calc(100dvh - 72px);
  align-items:stretch;
}

body[data-ui-mode="app"] .chat-panel,
body[data-ui-mode="app"] .preview-panel{
  min-height:0;
}

body[data-ui-mode="app"] .chat-panel{
  display:flex;
  flex-direction:column;
}

body[data-ui-mode="app"] .chat-list{
  flex:1 1 auto;
  min-height:220px;
  max-height:none !important;
  padding:14px;
  overflow:auto;
}

body[data-ui-mode="app"] .chat-message{
  position:relative;
  z-index:1;
  padding:14px 16px;
  border-radius:22px;
  font-size:14px;
  line-height:1.55;
  max-width:92%;
}

body[data-ui-mode="app"] .prompt-box{
  position:sticky;
  bottom:0;
  z-index:3;
  margin-top:auto;
  padding:14px;
  background:linear-gradient(180deg,rgba(11,15,34,.78),rgba(8,11,24,.96));
  backdrop-filter:blur(18px);
  border-top:1px solid rgba(255,255,255,.08);
}

body[data-ui-mode="app"] .chip-row{
  display:none;
}

body[data-ui-mode="app"] #clearChatBtn{
  display:none;
}

body[data-ui-mode="app"] .prompt-box .grid.grid-cols-\[1fr_auto\]{
  grid-template-columns:1fr;
}

body[data-ui-mode="app"] .preview-shell{
  display:grid;
  grid-template-rows:auto auto 1fr;
}

body[data-ui-mode="app"] .preview-toolbar{
  padding:0 14px;
  min-height:58px;
}

body[data-ui-mode="app"] .preview-toolbar .flex.gap-2{
  gap:8px;
}

body[data-ui-mode="app"] .preview-toolbar #exportBtn{
  width:42px;
  min-width:42px;
  padding:0;
}

body[data-ui-mode="app"] .preview-toolbar #exportBtn .fa-download{
  margin:0;
}

body[data-ui-mode="app"] .preview-toolbar #exportBtn{
  font-size:0;
}

body[data-ui-mode="app"] .preview-toolbar #exportBtn i{
  font-size:14px;
}

body[data-ui-mode="app"] .builder-meta-strip{
  padding:4px 14px 8px;
  gap:6px;
}

body[data-ui-mode="app"] .builder-meta-pill{
  min-height:20px;
  padding:3px 8px;
  font-size:10px;
  max-width:180px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  opacity:.72;
}

body[data-ui-mode="app"] .preview-stage{
  min-height:0;
  height:100%;
  overflow:hidden;
}

body[data-ui-mode="app"] .preview-frame-wrap{
  width:100%;
  height:100%;
  min-height:0;
  display:grid;
  place-items:center;
  padding:10px;
  background:linear-gradient(180deg,#edf2ff,#e8eef9);
  border-radius:20px;
  overflow:hidden;
}

body[data-ui-mode="app"] .preview-viewport{
  position:relative;
  display:grid;
  place-items:center;
  width:100%;
  height:100%;
  min-height:0;
}

body[data-ui-mode="app"] .preview-viewport.desktop{
  align-items:stretch;
  width:100%;
}

body[data-ui-mode="app"] .preview-frame.desktop{
  display:block;
  width:100%;
  height:100%;
  min-height:100%;
  border:0;
  border-radius:20px;
  box-shadow:0 18px 48px rgba(15,23,42,.14);
}

body[data-ui-mode="app"] .preview-frame.mobile{
  display:block;
  width:min(390px,100%);
  height:min(844px,100%);
  max-height:100%;
  border:0;
  border-radius:32px;
  box-shadow:0 18px 48px rgba(15,23,42,.22);
}

body[data-ui-mode="app"] .project-grid,
body[data-ui-mode="app"] .card-grid,
body[data-ui-mode="app"] .template-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
  gap:16px;
}

@media(max-width:1050px){
  body[data-ui-mode="app"] .topbar{
    min-height:64px;
    padding:10px 12px;
    flex-wrap:wrap;
    align-items:flex-start;
  }

  body[data-ui-mode="app"] .builder{
    grid-template-columns:1fr !important;
    gap:12px;
    padding:12px;
    min-height:calc(100dvh - 64px);
  }

  body[data-ui-mode="app"] .chat-panel{
    min-height:460px;
  }

  body[data-ui-mode="app"] .chat-list{
    min-height:220px;
  }

  body[data-ui-mode="app"] .dashboard{
    padding:14px;
  }

  body[data-ui-mode="app"] .preview-frame-wrap{
    padding:8px;
  }

  body[data-ui-mode="app"] .preview-frame.mobile{
    height:min(760px,100%);
  }
}

body[data-ui-mode="auth"]{
  background:
    radial-gradient(circle at 18% 10%, rgba(255,255,255,.05), transparent 22%),
    radial-gradient(circle at 82% 0%, rgba(255,255,255,.03), transparent 18%),
    linear-gradient(180deg,#07090d 0%,#0d1016 100%);
}

.app-shell{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  min-height:100dvh;
}

.shell-brand{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:24px;
}

.shell-section{
  margin:22px 0 10px;
  color:#7f8ba7;
  font-size:11px;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.sidebar-stack{
  display:grid;
  gap:10px;
}

.shell-footnote{
  margin-top:24px;
  padding:12px 14px;
  border-radius:16px;
  background:rgba(255,255,255,.025);
  border:1px solid rgba(255,255,255,.05);
}

.shell-footnote-value{
  color:#e8ecf8;
  font-size:13px;
  font-weight:700;
  line-height:1.4;
  word-break:break-word;
}

.shell-topbar-main{
  min-width:0;
  display:flex;
  align-items:center;
  gap:12px;
}

.shell-topbar-actions{
  display:flex;
  align-items:center;
  gap:8px;
}

.shell-mode-select{
  width:110px;
  min-width:110px;
  padding:8px 10px;
  font-size:11px;
  font-weight:700;
}

.shell-kicker{
  color:#8ea0bf;
  font-size:11px;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.topbar-copy{
  display:grid;
  gap:2px;
}

.workspace-hero{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:16px;
  margin-bottom:18px;
}

.workspace-lead{
  max-width:720px;
}

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

.mini-stat{
  padding:14px 16px;
  border-radius:18px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.055);
}

.project-card{
  padding:18px;
  border-radius:20px;
  background:linear-gradient(180deg, rgba(255,255,255,.032), rgba(255,255,255,.018));
  border:1px solid rgba(255,255,255,.06);
  cursor:pointer;
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}

.project-card:hover{
  transform:translateY(-2px);
  border-color:rgba(255,255,255,.12);
  box-shadow:0 18px 40px rgba(0,0,0,.18);
}

.project-card-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin-bottom:18px;
}

.project-card-icon{
  width:40px;
  height:40px;
  border-radius:14px;
  display:grid;
  place-items:center;
  font-size:18px;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(255,255,255,.055);
}

.project-card-meta{
  color:#9dadc5;
}

.empty-state-shell{
  display:grid;
  place-items:center;
  min-height:100%;
}

.empty-state-card{
  width:min(720px,100%);
  padding:30px;
  border-radius:24px;
  text-align:center;
}

body[data-ui-mode="app"] .sidebar{
  width:286px;
  padding:18px;
  background:linear-gradient(180deg,rgba(8,10,15,.96),rgba(11,13,18,.92));
}

body[data-ui-mode="app"] .sidebar.collapsed{
  width:0;
  padding-left:0;
  padding-right:0;
}

body[data-ui-mode="app"] .sidebar-inner{
  width:250px;
}

body[data-ui-mode="app"] .nav-item{
  min-height:42px;
  margin-bottom:6px;
  border:1px solid transparent;
  color:#9da6b7;
  background:transparent;
  border-radius:12px;
  font-size:13px;
}

body[data-ui-mode="app"] .nav-item:hover{
  background:rgba(255,255,255,.03);
  border-color:rgba(255,255,255,.06);
}

body[data-ui-mode="app"] .nav-item.active{
  color:#fff;
  background:rgba(255,255,255,.06);
  border-color:rgba(255,255,255,.1);
}

body[data-ui-mode="app"] .topbar{
  min-height:70px;
  padding:12px 16px;
  background:rgba(10,12,18,.94);
}

body[data-ui-mode="app"] .dashboard{
  padding:18px;
}

body[data-ui-mode="app"] .builder{
  grid-template-columns:minmax(320px,360px) minmax(0,1fr);
  gap:12px;
  padding:12px;
}

body[data-ui-mode="app"] .panel{
  border-radius:20px;
  background:rgba(12,14,20,.94);
}

body[data-ui-mode="app"] .panel-head{
  height:50px;
  padding:0 14px;
  font-size:14px;
}

body[data-ui-mode="app"] .chat-list{
  padding:12px;
}

body[data-ui-mode="app"] .chat-message{
  max-width:86%;
  border-radius:16px;
  font-size:13px;
  padding:12px 14px;
}

body[data-ui-mode="app"] .chip{
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.06);
  background:rgba(255,255,255,.03);
  color:#c7cfde;
  font-size:11px;
  font-weight:700;
}

body[data-ui-mode="app"] .chip-row{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-bottom:8px;
}

body[data-ui-mode="app"] .prompt-box{
  padding:12px;
  background:linear-gradient(180deg,rgba(11,13,19,.7),rgba(9,11,16,.98));
}

body[data-ui-mode="app"] .preview-toolbar{
  min-height:54px;
}

body[data-ui-mode="app"] .preview-frame-wrap{
  padding:12px;
  background:linear-gradient(180deg,#cfd5de,#bcc4cf);
}

body[data-ui-mode="app"] .preview-frame.desktop{
  border-radius:14px;
}

body[data-ui-mode="app"] .builder-meta-strip{
  background:transparent;
  border-bottom:1px solid rgba(255,255,255,.06);
  padding:0 16px 10px;
}

body[data-ui-mode="app"] .builder-meta-pill{
  background:rgba(0,0,0,.18);
  border-color:rgba(255,255,255,.08);
  color:#ccd3df;
  opacity:1;
}

body[data-ui-mode="app"] #exportBtn{
  min-width:80px;
  font-size:11px;
}

body[data-ui-mode="app"] .btn{
  border-radius:12px;
  padding:9px 12px;
  font-size:13px;
  font-weight:800;
}

body[data-ui-mode="app"] .btn-primary{
  background:#f3f4f6;
  color:#0b0d12;
  border:1px solid rgba(255,255,255,.22);
}

body[data-ui-mode="app"] .btn-soft,
body[data-ui-mode="app"] .btn-cyan,
body[data-ui-mode="app"] .btn-green,
body[data-ui-mode="app"] .btn-red{
  background:rgba(255,255,255,.035);
  color:#edf1f7;
  border:1px solid rgba(255,255,255,.08);
}

body[data-ui-mode="app"] .btn-mini{
  padding:7px 10px;
  font-size:12px;
  border-radius:10px;
}

body[data-ui-mode="app"] .input{
  background:rgba(255,255,255,.025);
  border:1px solid rgba(255,255,255,.08);
  color:#f5f7fb;
  border-radius:14px;
  padding:11px 12px;
}

body[data-ui-mode="app"] .input:focus{
  border-color:rgba(255,255,255,.16);
  box-shadow:0 0 0 3px rgba(255,255,255,.04);
}

body[data-ui-mode="app"] .logo-badge{
  width:38px;
  height:38px;
  border-radius:12px;
  background:#f3f4f6;
  color:#0b0d12;
  box-shadow:none;
}

body[data-ui-mode="auth"] .logo-badge{
  width:44px;
  height:44px;
  border-radius:14px;
  background:#f3f4f6;
  color:#0b0d12;
  box-shadow:none;
}

body[data-ui-mode="auth"] .login-card{
  background:rgba(12,14,20,.92);
  border:1px solid rgba(255,255,255,.08);
}

body[data-ui-mode="auth"] .card{
  background:rgba(255,255,255,.025);
  border:1px solid rgba(255,255,255,.055);
}

body[data-ui-mode="auth"] .btn-primary{
  background:#f3f4f6;
  color:#0b0d12;
}

body[data-ui-mode="auth"] .btn-soft{
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.08);
}

body[data-ui-mode="app"] .status-dot{
  width:8px;
  height:8px;
  border-radius:999px;
  background:#b7c0cf;
  box-shadow:none;
}

body[data-ui-mode="app"] .preview-shell .small,
body[data-ui-mode="app"] .dashboard .small{
  color:#94a0b4;
}

@media(max-width:1050px){
  .workspace-hero{
    flex-direction:column;
    align-items:flex-start;
  }

  .project-stats-grid{
    grid-template-columns:1fr;
  }

  body[data-ui-mode="app"] .builder{
    grid-template-columns:1fr !important;
  }

  .hide-mobile-label{
    display:none;
  }
}

/* Premium light rebuild */
body[data-ui-mode="app"]{
  background:#eef2f6 !important;
  color:#101828 !important;
}

body[data-ui-mode="app"] .main{
  background:#eef2f6;
}

body[data-ui-mode="app"] .sidebar{
  background:linear-gradient(180deg,#ffffff,#f7f9fc) !important;
  border-right:1px solid #d9e1ea;
  box-shadow:0 10px 30px rgba(15,23,42,.04);
}

body[data-ui-mode="app"] .shell-section{
  color:#7a8699;
}

body[data-ui-mode="app"] .shell-footnote{
  background:#f6f8fb;
  border:1px solid #e1e7ef;
}

body[data-ui-mode="app"] .shell-footnote-value{
  color:#0f172a;
}

body[data-ui-mode="app"] .nav-item{
  color:#526072;
}

body[data-ui-mode="app"] .nav-item:hover{
  background:#f3f6fa;
  border-color:#e1e7ef;
}

body[data-ui-mode="app"] .nav-item.active{
  background:#111827;
  border-color:#111827;
  color:#fff;
}

body[data-ui-mode="app"] .topbar{
  background:rgba(255,255,255,.82) !important;
  border-bottom:1px solid #dce4ee;
  backdrop-filter:blur(18px);
}

body[data-ui-mode="app"] .shell-kicker{
  color:#7c8798;
}

body[data-ui-mode="app"] #projectTitle{
  color:#0f172a;
}

body[data-ui-mode="app"] #statusText{
  color:#718096;
}

body[data-ui-mode="app"] .dashboard{
  background:#eef2f6;
}

body[data-ui-mode="app"] .mini-stat,
body[data-ui-mode="app"] .project-card,
body[data-ui-mode="app"] .panel,
body[data-ui-mode="app"] .empty-state-card{
  background:#ffffff !important;
  border:1px solid #dde5ee !important;
  box-shadow:0 10px 30px rgba(15,23,42,.05);
}

body[data-ui-mode="app"] .project-card:hover{
  border-color:#cfd8e3 !important;
  box-shadow:0 14px 34px rgba(15,23,42,.08);
}

body[data-ui-mode="app"] .project-card-icon{
  background:#f5f7fa;
  border:1px solid #e3e8ef;
  color:#0f172a;
}

body[data-ui-mode="app"] .chat-panel,
body[data-ui-mode="app"] .preview-panel{
  background:#ffffff !important;
}

body[data-ui-mode="app"] .panel-head{
  border-bottom:1px solid #e6ebf2;
  color:#0f172a;
}

body[data-ui-mode="app"] .chat-list{
  background:#ffffff;
}

body[data-ui-mode="app"] .chat-message.ai{
  background:#f6f8fb;
  border:1px solid #e3e8ef;
  color:#162031;
}

body[data-ui-mode="app"] .chat-message.user{
  background:#111827;
  color:#ffffff;
}

body[data-ui-mode="app"] .chip{
  background:#f5f7fa;
  border:1px solid #e1e7ef;
  color:#445266;
}

body[data-ui-mode="app"] .prompt-box{
  background:linear-gradient(180deg,#ffffff,#fafbfd) !important;
  border-top:1px solid #e6ebf2;
}

body[data-ui-mode="app"] .preview-toolbar{
  background:#ffffff;
}

body[data-ui-mode="app"] .preview-frame-wrap{
  background:linear-gradient(180deg,#e8edf3,#dde5ee) !important;
}

body[data-ui-mode="app"] .builder-meta-pill{
  background:#f5f7fa;
  border-color:#dfe6ef;
  color:#5d6a7e;
}

body[data-ui-mode="app"] .btn-primary{
  background:#111827;
  color:#ffffff;
  border-color:#111827;
}

body[data-ui-mode="app"] .btn-soft,
body[data-ui-mode="app"] .btn-cyan,
body[data-ui-mode="app"] .btn-green,
body[data-ui-mode="app"] .btn-red{
  background:#ffffff;
  color:#111827;
  border:1px solid #d8e0ea;
}

body[data-ui-mode="app"] .btn:hover{
  opacity:1;
}

body[data-ui-mode="app"] .input,
body[data-ui-mode="app"] .shell-mode-select{
  background:#f8fafc;
  border:1px solid #dce3ec;
  color:#111827;
}

body[data-ui-mode="app"] .input::placeholder{
  color:#8b97a8;
}

body[data-ui-mode="app"] .input:focus{
  border-color:#c8d1dc;
  box-shadow:0 0 0 3px rgba(15,23,42,.05);
}

body[data-ui-mode="app"] .logo-badge{
  background:#111827;
  color:#ffffff;
}

body[data-ui-mode="auth"]{
  background:
    radial-gradient(circle at 12% 8%, rgba(15,23,42,.05), transparent 22%),
    linear-gradient(180deg,#f5f7fb 0%,#eef2f6 100%) !important;
  color:#0f172a;
}

body[data-ui-mode="auth"] .login-card{
  background:rgba(255,255,255,.94) !important;
  border:1px solid #dde5ee !important;
  box-shadow:0 24px 60px rgba(15,23,42,.08);
}

body[data-ui-mode="auth"] .card{
  background:#ffffff;
  border:1px solid #e3e9f0;
}

body[data-ui-mode="auth"] .small{
  color:#687588;
}

body[data-ui-mode="auth"] .btn-primary{
  background:#111827;
  color:#fff;
}

body[data-ui-mode="auth"] .btn-soft{
  background:#fff;
  color:#111827;
  border:1px solid #dce4ee;
}

body[data-ui-mode="auth"] .input{
  background:#f8fafc;
  color:#111827;
  border:1px solid #dce4ee;
}

body[data-ui-mode="auth"] .input::placeholder{
  color:#8b97a8;
}

/* Full concept rebuild */
html,body,#app{
  height:100%;
}

body[data-ui-mode="app"]{
  overflow:auto !important;
  background:
    radial-gradient(circle at 12% 10%, rgba(68,104,126,.16), transparent 24%),
    radial-gradient(circle at 88% 0%, rgba(170,117,77,.12), transparent 20%),
    linear-gradient(180deg,#f2ece3 0%,#ebe5db 100%) !important;
  color:#1c2430 !important;
}

body[data-ui-mode="app"] .workspace,
body[data-ui-mode="app"] .workspace-v3,
body[data-ui-mode="app"] .platform-stage,
body[data-ui-mode="app"] .dashboard{
  overflow:auto !important;
  min-height:0;
}

.platform-shell{
  min-height:100dvh;
  display:grid;
  grid-template-rows:auto auto minmax(0,1fr);
  gap:18px;
  padding:18px;
}

.platform-header{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  gap:18px;
  align-items:start;
  padding:18px 22px;
  border-radius:32px;
  background:rgba(255,250,243,.72);
  border:1px solid rgba(161,145,120,.24);
  backdrop-filter:blur(24px);
}

.platform-brand{
  display:flex;
  align-items:center;
  gap:14px;
  min-width:220px;
}

.brand-mark{
  width:54px;
  height:54px;
  border:0;
  border-radius:18px;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg,#2c5d57,#355f79);
  color:#fff;
  font-size:20px;
  box-shadow:0 14px 28px rgba(44,93,87,.20);
}

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

.brand-name{
  font-size:28px;
  font-weight:900;
  letter-spacing:-.05em;
  color:#1d2430;
}

.brand-meta{
  font-size:13px;
  color:#697487;
}

.platform-command{
  min-width:0;
}

.platform-project-chip{
  padding:6px 4px;
}

.platform-project-label{
  font-size:11px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.14em;
  color:#8a7b67;
  margin-bottom:8px;
}

.platform-project-title{
  font-size:42px;
  line-height:.98;
  font-weight:900;
  letter-spacing:-.06em;
  color:#1d2430;
}

.platform-project-meta{
  margin-top:8px;
  font-size:15px;
  color:#6d788b;
}

.platform-actions{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  justify-content:flex-end;
}

.platform-select{
  min-width:132px;
  height:48px;
  padding:0 16px;
  border-radius:18px;
  border:1px solid rgba(161,145,120,.24);
  background:rgba(255,255,255,.74);
  color:#263141;
  font-size:14px;
  font-weight:700;
}

.platform-btn{
  height:48px;
  padding:0 16px;
  border-radius:18px;
  border:1px solid rgba(161,145,120,.22);
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-size:14px;
  font-weight:800;
}

.platform-btn-soft{
  background:rgba(255,255,255,.74);
  color:#233041;
}

.platform-btn-strong{
  background:linear-gradient(135deg,#295d57,#355f79);
  border-color:transparent;
  color:#fff;
}

.platform-btn-ghost{
  width:48px;
  justify-content:center;
  background:rgba(255,255,255,.48);
  color:#233041;
}

.platform-rail{
  display:flex;
  gap:10px;
  overflow:auto;
  padding:2px;
}

.rail-tab{
  min-width:170px;
  height:58px;
  padding:0 18px;
  border-radius:20px;
  border:1px solid rgba(161,145,120,.16);
  background:rgba(255,248,239,.66);
  display:flex;
  align-items:center;
  gap:12px;
  color:#4f596c;
  font-size:15px;
  font-weight:800;
}

.rail-tab-kicker{
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.14em;
  color:#9c8b75;
}

.rail-tab.active{
  background:linear-gradient(135deg,#fffdf9,#f3ece2);
  color:#192230;
  border-color:rgba(161,145,120,.26);
  box-shadow:0 10px 24px rgba(34,42,56,.06);
}

.platform-stage{
  min-height:0;
}

.workspace-v3{
  min-height:calc(100dvh - 190px);
}

.dashboard-v2{
  padding:0 !important;
}

.hero-strip{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:18px;
  align-items:end;
  margin-bottom:18px;
  padding:6px 2px 4px;
}

.hero-title{
  margin:0;
  font-size:72px;
  line-height:.94;
  letter-spacing:-.07em;
  font-weight:900;
  color:#1d2430;
}

.hero-title-sm{
  font-size:48px;
}

.hero-text{
  margin:14px 0 0;
  max-width:720px;
  font-size:18px;
  line-height:1.6;
  color:#6f7888;
}

.project-stats-grid-v2{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
  margin-bottom:18px;
}

.stat-card{
  padding:18px 0 22px !important;
  border-radius:0 !important;
  background:transparent !important;
  border:0 !important;
  border-bottom:1px solid rgba(161,145,120,.24) !important;
  box-shadow:none !important;
}

.stat-card-accent{
  background:transparent !important;
}

.stat-card-soft{
  background:transparent !important;
}

.stat-label{
  font-size:13px;
  color:#8b7a66;
  margin-bottom:10px;
}

.stat-value{
  font-size:54px;
  line-height:1;
  font-weight:900;
  letter-spacing:-.05em;
  color:#1d2430;
}

.stat-value-sm{
  font-size:34px;
}

.project-grid{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:0 !important;
}

.project-card-v2{
  min-height:auto;
  padding:28px 0 !important;
  border-radius:0 !important;
  border:0 !important;
  border-bottom:1px solid rgba(161,145,120,.18) !important;
  box-shadow:none !important;
  display:grid;
  grid-template-columns:72px minmax(0,1fr) auto;
  gap:24px;
  align-items:center;
}

.project-card-v2:nth-child(3n+1){
  background:transparent !important;
}

.project-card-v2:nth-child(3n+2){
  background:transparent !important;
}

.project-card-v2:nth-child(3n+3){
  background:transparent !important;
}

.project-card-icon{
  width:46px;
  height:46px;
  border-radius:16px;
  display:grid;
  place-items:center;
  font-size:20px;
  background:rgba(255,255,255,.72);
  border:1px solid rgba(161,145,120,.12);
}

.project-id-chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:40px;
  padding:0 16px;
  border-radius:999px;
  background:rgba(255,255,255,.66);
  border:1px solid rgba(161,145,120,.14);
  color:#586173;
  font-size:14px;
  font-weight:800;
}

.project-card-title{
  margin:0 0 8px;
  font-size:34px;
  line-height:1.1;
  font-weight:900;
  letter-spacing:-.04em;
  color:#1d2430;
}

.project-card-meta{
  color:#7a8494 !important;
  font-size:14px;
}

.project-card-actions{
  display:flex;
  gap:10px;
  justify-content:flex-end;
  margin-top:0;
}

.builder-v2{
  display:grid;
  grid-template-columns:minmax(400px,460px) minmax(0,1fr);
  gap:18px;
  min-height:calc(100dvh - 230px);
}

.chat-panel-v2,
.preview-panel-v2{
  background:transparent !important;
  border:1px solid rgba(161,145,120,.18) !important;
  border-radius:24px !important;
  overflow:hidden;
  box-shadow:none !important;
}

.panel-head-v2{
  min-height:74px !important;
  padding:18px 20px !important;
  background:linear-gradient(180deg,rgba(255,253,248,.82),rgba(255,248,239,.42));
  border-bottom:1px solid rgba(161,145,120,.12) !important;
}

.panel-head-copy b{
  font-size:21px;
  color:#1d2430;
}

.mode-chip{
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:0 14px;
  border-radius:999px;
  background:rgba(53,95,121,.10);
  border:1px solid rgba(53,95,121,.14);
  color:#315169;
  font-size:12px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;
}

.chat-list{
  padding:16px !important;
  background:transparent !important;
}

.chat-message.ai{
  background:rgba(255,255,255,.72) !important;
  border:1px solid rgba(161,145,120,.12) !important;
  color:#213040 !important;
}

.chat-message.user{
  background:linear-gradient(135deg,#2c5d57,#355f79) !important;
  color:#fff !important;
}

.prompt-box-v2{
  position:sticky;
  bottom:0;
  padding:18px !important;
  background:linear-gradient(180deg,rgba(255,250,243,.72),rgba(248,241,231,.96)) !important;
  border-top:1px solid rgba(161,145,120,.12);
}

.builder-textarea{
  min-height:150px;
  border-radius:22px !important;
  background:rgba(255,255,255,.82) !important;
  border:1px solid rgba(161,145,120,.14) !important;
}

.preview-toolbar-v2{
  min-height:76px !important;
  padding:16px 20px !important;
  border-bottom:1px solid rgba(161,145,120,.12) !important;
  background:linear-gradient(180deg,rgba(255,253,248,.82),rgba(255,248,239,.42)) !important;
}

.preview-toolbar-title{
  font-size:22px;
  font-weight:900;
  color:#1d2430;
  letter-spacing:-.03em;
}

.preview-type-label{
  font-size:13px;
  color:#6d788b;
}

.preview-frame-wrap{
  background:linear-gradient(180deg,#d7d0c6,#ebe4da 58%, #dce5e1) !important;
  border-radius:22px !important;
  padding:14px !important;
}

.preview-frame.desktop{
  border-radius:24px !important;
}

.surface-card{
  padding:22px 0;
  border-radius:0;
  background:transparent;
  border:0;
  border-bottom:1px solid rgba(161,145,120,.18);
  box-shadow:none;
}

.surface-card-highlight{
  background:transparent;
}

.surface-card-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.status-badge{
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:0 10px;
  border-radius:999px;
  background:rgba(170,117,77,.10);
  border:1px solid rgba(170,117,77,.14);
  color:#9a6638;
  font-size:11px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;
}

.status-badge-ok{
  background:rgba(44,93,87,.10);
  border-color:rgba(44,93,87,.14);
  color:#295750;
}

.surface-link{
  color:#355f79;
  font-weight:700;
  text-decoration:none;
}

.blank-workspace{
  min-height:calc(100dvh - 260px);
  display:grid;
  place-items:center;
}

.blank-workspace-card{
  width:min(920px,100%);
  padding:30px 0 36px;
  border-radius:0;
  background:transparent;
  border:0;
  border-top:1px solid rgba(161,145,120,.18);
  border-bottom:1px solid rgba(161,145,120,.18);
  box-shadow:none;
}

.blank-workspace-kicker{
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.14em;
  font-weight:800;
  color:#8a7b67;
  margin-bottom:10px;
}

.blank-workspace-title{
  margin:0 0 12px;
  font-size:56px;
  line-height:.96;
  letter-spacing:-.06em;
  font-weight:900;
  color:#1d2430;
}

.blank-workspace-copy{
  margin:0 0 24px;
  font-size:17px;
  line-height:1.65;
  color:#6d788b;
}

.blank-workspace-actions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}

.platform-stage{
  padding-top:8px;
}

body[data-ui-mode="auth"]{
  overflow:auto !important;
  background:
    radial-gradient(circle at 10% 8%, rgba(68,104,126,.12), transparent 22%),
    radial-gradient(circle at 88% 0%, rgba(170,117,77,.10), transparent 18%),
    linear-gradient(180deg,#f3ede4 0%,#ece5db 100%) !important;
}

.auth-scene{
  min-height:100dvh;
  padding:22px;
}

.auth-stage{
  min-height:calc(100dvh - 44px);
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(380px,.9fr);
  gap:20px;
}

.auth-story,
.auth-card{
  border-radius:34px;
  border:1px solid rgba(161,145,120,.18);
  background:rgba(255,252,247,.82);
  backdrop-filter:blur(20px);
}

.auth-story{
  padding:34px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}

.auth-brandline{
  display:flex;
  align-items:center;
  gap:14px;
}

.auth-brandmark{
  width:56px;
  height:56px;
  border-radius:20px;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg,#2c5d57,#355f79);
  color:#fff;
  font-size:20px;
}

.auth-brandname{
  font-size:30px;
  font-weight:900;
  letter-spacing:-.05em;
  color:#1d2430;
}

.auth-brandmeta{
  font-size:13px;
  color:#6d788b;
}

.auth-copy{
  max-width:760px;
}

.auth-kicker{
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.14em;
  font-weight:800;
  color:#8a7b67;
  margin-bottom:14px;
}

.auth-title{
  margin:0;
  font-size:78px;
  line-height:.92;
  letter-spacing:-.08em;
  font-weight:900;
  color:#1d2430;
}

.auth-text{
  margin:18px 0 0;
  max-width:720px;
  font-size:18px;
  line-height:1.65;
  color:#6d788b;
}

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

.auth-panel{
  padding:18px;
  border-radius:24px;
  background:linear-gradient(180deg,rgba(255,255,255,.74),rgba(248,241,232,.88));
  border:1px solid rgba(161,145,120,.14);
}

.auth-panel-title{
  font-size:16px;
  font-weight:800;
  color:#1d2430;
  margin-bottom:8px;
}

.auth-panel-copy{
  font-size:14px;
  line-height:1.55;
  color:#6d788b;
}

.auth-card{
  padding:30px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.auth-card-title{
  font-size:32px;
  font-weight:900;
  letter-spacing:-.05em;
  color:#1d2430;
}

.auth-card-subtitle{
  margin-top:8px;
  color:#6d788b;
  font-size:14px;
  margin-bottom:24px;
}

@media(min-width:1051px){
  .dashboard-v2{
    max-width:1380px;
    margin:0 auto;
  }

  .hero-strip{
    border-bottom:1px solid rgba(161,145,120,.18);
    padding:8px 0 20px;
    margin-bottom:28px;
  }

  .builder-v2{
    max-width:1480px;
    margin:0 auto;
  }
}

@media(max-width:1200px){
  .platform-header{
    grid-template-columns:1fr;
  }

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

  .builder-v2{
    grid-template-columns:1fr;
  }

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

  .platform-project-title{
    font-size:32px;
  }

  .auth-stage{
    grid-template-columns:1fr;
  }

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

  .auth-panels{
    grid-template-columns:1fr;
  }
}

/* Fresh platform redesign */
:root{
  --um-bg:#f4efe7;
  --um-bg-soft:#ece6dc;
  --um-surface:#fffdf9;
  --um-surface-2:#f7f3ec;
  --um-border:#ddd3c6;
  --um-border-strong:#cabca9;
  --um-ink:#1d2430;
  --um-muted:#6e7686;
  --um-accent:#2f6d62;
  --um-accent-2:#b77946;
  --um-accent-3:#5d6fb3;
}

body[data-ui-mode="app"]{
  background:
    radial-gradient(circle at 10% 10%, rgba(183,121,70,.10), transparent 20%),
    radial-gradient(circle at 90% 0%, rgba(47,109,98,.08), transparent 18%),
    linear-gradient(180deg,var(--um-bg) 0%, #f1ece4 100%) !important;
  color:var(--um-ink) !important;
}

body[data-ui-mode="app"] .sidebar{
  width:300px;
  padding:22px 18px;
  background:rgba(255,250,243,.74) !important;
  backdrop-filter:blur(24px);
  border-right:1px solid rgba(173,156,133,.28);
  box-shadow:none;
}

body[data-ui-mode="app"] .sidebar-inner{
  width:264px;
  display:flex;
  flex-direction:column;
  height:100%;
}

.shell-brand-v2{
  padding:8px 6px 20px;
  border-bottom:1px solid rgba(173,156,133,.22);
}

.shell-wordmark{
  font-size:32px;
  line-height:1;
  font-weight:900;
  letter-spacing:-.04em;
  color:var(--um-ink);
}

.shell-submark{
  margin-top:8px;
  font-size:13px;
  color:var(--um-muted);
}

.shell-nav-group{
  display:grid;
  gap:8px;
  margin-top:18px;
}

.nav-item-v2{
  min-height:52px !important;
  padding:0 16px !important;
  border-radius:18px !important;
  background:transparent !important;
  border:1px solid transparent !important;
  color:#495466 !important;
  font-size:15px !important;
  font-weight:800 !important;
}

.nav-item-v2 i{
  width:18px;
  font-size:15px;
  color:#7d8797;
}

.nav-item-v2.active{
  background:linear-gradient(135deg,#21443f,#2f6d62) !important;
  border-color:transparent !important;
  color:#fff !important;
  box-shadow:0 14px 30px rgba(47,109,98,.20);
}

.nav-item-v2.active i{
  color:#fff;
}

.nav-item-v2:hover{
  background:rgba(255,255,255,.52) !important;
  border-color:rgba(173,156,133,.24) !important;
}

.shell-utility-card{
  margin-top:auto;
  padding:18px;
  border-radius:24px;
  background:linear-gradient(180deg,rgba(255,255,255,.78),rgba(246,240,231,.92));
  border:1px solid rgba(173,156,133,.24);
}

.shell-utility-kicker{
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.14em;
  font-weight:800;
  color:#8a7b67;
  margin-bottom:8px;
}

.shell-utility-title{
  font-size:18px;
  font-weight:800;
  color:var(--um-ink);
  margin-bottom:4px;
}

.shell-utility-copy{
  font-size:13px;
  line-height:1.5;
  color:var(--um-muted);
  margin-bottom:16px;
}

.topbar-v2{
  min-height:86px !important;
  padding:18px 24px !important;
  background:rgba(255,251,245,.58) !important;
  border-bottom:1px solid rgba(173,156,133,.22) !important;
  backdrop-filter:blur(24px);
}

.shell-topbar-main-v2{
  gap:18px;
}

.topbar-title{
  font-size:34px;
  line-height:1.02;
  font-weight:900;
  letter-spacing:-.05em;
  color:var(--um-ink);
}

.topbar-subtitle{
  font-size:14px;
  color:var(--um-muted);
}

.shell-kicker-v2{
  color:#8a7b67 !important;
  margin-bottom:3px;
}

.shell-topbar-actions-v2{
  gap:12px;
}

.shell-mode-select-v2{
  min-width:132px;
  border-radius:18px !important;
  background:rgba(255,255,255,.62) !important;
  border:1px solid rgba(173,156,133,.25) !important;
}

.btn-quiet{
  background:rgba(255,255,255,.58) !important;
}

.btn-strong{
  background:linear-gradient(135deg,#21443f,#2f6d62) !important;
  color:#fff !important;
  border-color:transparent !important;
  box-shadow:0 14px 26px rgba(47,109,98,.18);
}

.dashboard-v2{
  padding:26px !important;
}

.hero-strip{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:24px;
  align-items:end;
  margin-bottom:24px;
}

.hero-strip-compact{
  margin-bottom:18px;
}

.hero-title{
  margin:0;
  font-size:72px;
  line-height:.96;
  letter-spacing:-.07em;
  font-weight:900;
  color:var(--um-ink);
}

.hero-title-sm{
  font-size:48px;
}

.hero-text{
  margin:14px 0 0;
  max-width:760px;
  font-size:18px;
  line-height:1.6;
  color:var(--um-muted);
}

.hero-actions{
  display:flex;
  align-items:center;
  gap:12px;
}

.project-stats-grid-v2{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}

.stat-card{
  padding:22px 24px !important;
  border-radius:28px !important;
  background:linear-gradient(180deg,rgba(255,253,249,.95),rgba(247,242,234,.94)) !important;
  border:1px solid rgba(173,156,133,.18) !important;
  box-shadow:none !important;
}

.stat-card-accent{
  background:linear-gradient(135deg,rgba(93,111,179,.10),rgba(255,255,255,.94)) !important;
}

.stat-card-soft{
  background:linear-gradient(135deg,rgba(183,121,70,.08),rgba(255,255,255,.94)) !important;
}

.stat-label{
  font-size:13px;
  color:#867865;
  margin-bottom:12px;
}

.stat-value{
  font-size:56px;
  line-height:1;
  font-weight:900;
  letter-spacing:-.05em;
  color:var(--um-ink);
}

.stat-value-sm{
  font-size:34px;
}

.project-grid{
  grid-template-columns:repeat(auto-fill,minmax(360px,1fr)) !important;
  gap:18px !important;
}

.project-card-v2{
  min-height:300px;
  padding:26px !important;
  border-radius:32px !important;
  background:linear-gradient(180deg,rgba(255,252,247,.96),rgba(250,245,237,.98)) !important;
  border:1px solid rgba(173,156,133,.16) !important;
  box-shadow:none !important;
}

.project-card-v2:nth-child(3n+1){
  background:linear-gradient(180deg,rgba(255,252,247,.96),rgba(245,240,231,.98)) !important;
}

.project-card-v2:nth-child(3n+2){
  background:linear-gradient(180deg,rgba(248,252,251,.98),rgba(239,246,243,.98)) !important;
}

.project-card-v2:nth-child(3n+3){
  background:linear-gradient(180deg,rgba(249,249,255,.98),rgba(240,241,250,.98)) !important;
}

.project-id-chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  padding:0 16px;
  border-radius:999px;
  background:rgba(255,255,255,.74);
  border:1px solid rgba(173,156,133,.16);
  font-size:14px;
  font-weight:800;
  color:#596173;
}

.project-card-body{
  margin-top:18px;
}

.project-card-title{
  margin:0 0 12px;
  font-size:28px;
  line-height:1.12;
  font-weight:900;
  letter-spacing:-.04em;
  color:var(--um-ink);
}

.project-card-meta{
  font-size:14px;
  color:#7b8493 !important;
}

.project-card-actions{
  display:flex;
  gap:10px;
  margin-top:26px;
}

.builder-v2{
  grid-template-columns:minmax(380px,430px) minmax(0,1fr) !important;
  gap:18px !important;
  padding:18px !important;
}

.chat-panel-v2,
.preview-panel-v2{
  border-radius:28px !important;
  overflow:hidden;
}

.panel-head-v2{
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:72px !important;
  padding:18px 20px !important;
  background:linear-gradient(180deg,rgba(255,252,247,.82),rgba(255,250,243,.42));
}

.panel-head-copy{
  display:grid;
  gap:2px;
}

.panel-head-copy b{
  font-size:20px;
  letter-spacing:-.03em;
}

.mode-chip{
  display:inline-flex;
  align-items:center;
  min-height:36px;
  padding:0 14px;
  border-radius:999px;
  background:rgba(47,109,98,.10);
  border:1px solid rgba(47,109,98,.18);
  color:#29564e;
  font-size:12px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;
}

.prompt-box-v2{
  padding:18px !important;
  background:linear-gradient(180deg,rgba(255,252,247,.88),rgba(255,248,240,.96)) !important;
}

.chip-row-v2{
  display:flex !important;
}

.chip-v2{
  background:rgba(255,255,255,.8) !important;
  border-color:rgba(173,156,133,.18) !important;
  color:#5e6474 !important;
}

.builder-textarea{
  min-height:150px;
  border-radius:20px !important;
  background:rgba(255,255,255,.86) !important;
}

.preview-toolbar-v2{
  min-height:76px !important;
  padding:16px 20px !important;
  background:linear-gradient(180deg,rgba(255,252,247,.82),rgba(255,250,243,.36)) !important;
}

.preview-toolbar-copy{
  display:grid;
  gap:2px;
}

.preview-toolbar-title{
  font-size:22px;
  font-weight:900;
  letter-spacing:-.03em;
  color:var(--um-ink);
}

.preview-type-label{
  font-size:13px;
  color:var(--um-muted);
}

.preview-toolbar-actions{
  gap:10px !important;
}

.builder-meta-strip-v2{
  padding:0 20px 12px !important;
  border-bottom:0 !important;
}

.preview-frame-wrap{
  border-radius:30px !important;
  background:linear-gradient(180deg,#d7d1c7,#ebe4d9 56%, #dfe7e4) !important;
  padding:18px !important;
}

.preview-frame.desktop{
  border-radius:26px !important;
}

.surface-card{
  padding:22px;
  border-radius:24px;
  background:linear-gradient(180deg,rgba(255,252,247,.98),rgba(248,243,235,.98));
  border:1px solid rgba(173,156,133,.18);
  box-shadow:none;
}

.surface-card-highlight{
  background:linear-gradient(135deg,rgba(47,109,98,.12),rgba(255,253,248,.98));
}

.surface-card-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.status-badge{
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:0 10px;
  border-radius:999px;
  background:rgba(183,121,70,.10);
  border:1px solid rgba(183,121,70,.16);
  color:#976233;
  font-size:11px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;
}

.status-badge-ok{
  background:rgba(47,109,98,.10);
  border-color:rgba(47,109,98,.16);
  color:#29564e;
}

.surface-link{
  color:#2f6d62;
  font-weight:700;
  text-decoration:none;
}

.card-grid-v2{
  grid-template-columns:repeat(auto-fill,minmax(280px,1fr)) !important;
  gap:16px !important;
}

.empty-project-card{
  border-radius:28px !important;
  background:linear-gradient(180deg,rgba(255,252,247,.96),rgba(247,242,234,.98)) !important;
}

@media(max-width:1050px){
  body[data-ui-mode="app"] .sidebar{
    width:286px;
  }

  .hero-strip{
    grid-template-columns:1fr;
    align-items:start;
  }

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

  .topbar-title{
    font-size:26px;
  }

  .builder-v2{
    grid-template-columns:1fr !important;
  }

  .project-grid{
    grid-template-columns:1fr !important;
  }
}

@media(max-width:900px){
  .project-stats-grid-v2{
    grid-template-columns:1fr;
    gap:10px;
  }

  .stat-card{
    padding:16px 18px !important;
    border:1px solid rgba(161,145,120,.16) !important;
    border-radius:22px !important;
    background:linear-gradient(180deg,rgba(255,253,248,.96),rgba(248,242,232,.98)) !important;
  }

  .project-card-v2{
    grid-template-columns:1fr;
    gap:12px;
    padding:22px !important;
    border:1px solid rgba(161,145,120,.16) !important;
    border-radius:26px !important;
    background:linear-gradient(180deg,#fffdf9,#f4eee5) !important;
    box-shadow:0 10px 24px rgba(22,30,44,.04) !important;
  }

  .project-card-actions{
    justify-content:flex-start;
  }

  .surface-card{
    padding:20px;
    border:1px solid rgba(161,145,120,.16);
    border-radius:22px;
    background:linear-gradient(180deg,rgba(255,253,248,.96),rgba(248,242,232,.98));
  }

  .blank-workspace-card{
    padding:26px 22px 30px;
    border:1px solid rgba(161,145,120,.18);
    border-radius:28px;
    background:linear-gradient(180deg,rgba(255,253,248,.96),rgba(247,241,232,.98));
  }

  .blank-workspace-title{
    font-size:40px;
  }
}

/* Desktop premium refinement */
@media(min-width:1051px){
  .platform-shell{
    padding:22px 26px 28px;
    gap:22px;
  }

  .platform-header{
    grid-template-columns:280px minmax(0,1fr) auto;
    padding:20px 26px;
  }

  .platform-brand{
    align-self:center;
  }

  .platform-project-chip{
    padding:2px 0;
  }

  .platform-project-title{
    font-size:46px;
    letter-spacing:-.065em;
  }

  .platform-project-meta{
    font-size:14px;
  }

  .platform-rail{
    gap:14px;
    padding:0;
  }

  .rail-tab{
    min-width:0;
    width:auto;
    padding:0 22px;
    height:52px;
    border-radius:999px;
    background:rgba(255,249,241,.64);
  }

  .rail-tab.active{
    background:#fdfaf4;
  }

  .dashboard-v2{
    max-width:1460px;
  }

  .hero-strip{
    grid-template-columns:minmax(0,1fr) auto;
    gap:28px;
    margin-bottom:34px;
    padding:10px 0 22px;
  }

  .hero-title{
    font-size:84px;
    letter-spacing:-.08em;
  }

  .hero-text{
    max-width:820px;
    font-size:19px;
  }

  .project-stats-grid-v2{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:26px;
    margin-bottom:18px;
  }

  .stat-card{
    padding:16px 0 24px !important;
  }

  .stat-label{
    font-size:12px;
    text-transform:uppercase;
    letter-spacing:.12em;
  }

  .stat-value{
    font-size:68px;
  }

  .stat-value-sm{
    font-size:38px;
  }

  .project-grid{
    border-top:1px solid rgba(161,145,120,.18);
  }

  .project-row-v3{
    grid-template-columns:88px minmax(0,1fr) auto !important;
    gap:28px;
    padding:30px 0 !important;
  }

  .project-row-mark{
    display:flex;
    align-items:flex-start;
    justify-content:flex-start;
    padding-top:4px;
  }

  .project-card-icon{
    width:54px;
    height:54px;
    border-radius:18px;
    font-size:22px;
  }

  .project-row-main{
    min-width:0;
  }

  .project-row-titleline{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
  }

  .project-card-title{
    font-size:38px;
    margin:0;
  }

  .project-row-meta{
    display:flex;
    align-items:center;
    gap:14px;
    margin-top:12px;
  }

  .project-card-meta{
    font-size:15px;
  }

  .project-row-separator{
    width:4px;
    height:4px;
    border-radius:999px;
    background:rgba(117,108,96,.45);
  }

  .project-row-actions{
    align-self:center;
    padding-left:20px;
  }

  .builder-v2{
    grid-template-columns:minmax(360px,420px) minmax(0,1fr) !important;
    gap:22px !important;
    min-height:calc(100dvh - 250px);
  }

  .chat-panel-v2{
    background:rgba(252,247,239,.58) !important;
  }

  .preview-panel-v2{
    background:rgba(255,252,246,.5) !important;
  }

  .panel-head-v2{
    min-height:68px !important;
  }

  .chat-list{
    padding:18px !important;
  }

  .chat-message{
    max-width:88%;
  }

  .prompt-box-v2{
    padding:16px !important;
  }

  .builder-textarea{
    min-height:132px;
  }

  .preview-toolbar-v2{
    min-height:70px !important;
    padding:14px 18px !important;
  }

  .preview-toolbar-title{
    font-size:24px;
  }

  .preview-stage{
    padding:0 0 4px;
  }

  .preview-frame-wrap{
    min-height:720px;
    padding:18px !important;
  }

  .preview-frame.desktop{
    min-height:680px;
  }

  .surface-card{
    padding:24px 0;
  }
}

/* Final desktop pass: desktop = website/workspace, mobile = cards/panels */
@media (min-width: 1051px){
  body[data-ui-mode="app"]{
    overflow-y:auto !important;
  }

  body[data-ui-mode="app"] .workspace,
  body[data-ui-mode="app"] .platform-stage,
  body[data-ui-mode="app"] .workspace-v3,
  body[data-ui-mode="app"] .dashboard{
    overflow:visible !important;
  }

  .platform-shell{
    max-width:1720px;
    margin:0 auto;
    padding:18px 26px 34px !important;
    gap:18px !important;
  }

  .platform-header{
    grid-template-columns:220px minmax(0,1fr) auto !important;
    align-items:center !important;
    padding:18px 22px !important;
    border-radius:24px !important;
    background:rgba(255,252,247,.82) !important;
    border:1px solid rgba(173,156,133,.18) !important;
  }

  .brand-mark{
    width:46px !important;
    height:46px !important;
    border-radius:15px !important;
    font-size:17px !important;
  }

  .brand-name{
    font-size:24px !important;
  }

  .brand-meta{
    font-size:12px !important;
  }

  .platform-project-title{
    font-size:38px !important;
    line-height:1.02 !important;
  }

  .platform-project-meta{
    margin-top:6px !important;
    font-size:13px !important;
  }

  .platform-actions{
    gap:8px !important;
    flex-wrap:nowrap !important;
  }

  .platform-select,
  .platform-btn,
  .platform-credit-pill{
    height:42px !important;
    min-height:42px !important;
    border-radius:15px !important;
  }

  .platform-btn{
    padding:0 13px !important;
    font-size:13px !important;
  }

  .platform-btn span{
    white-space:nowrap;
  }

  .platform-credit-pill{
    min-width:84px !important;
    padding:0 12px !important;
    box-shadow:none !important;
  }

  .platform-credit-label{
    font-size:9px !important;
  }

  .platform-credit-value{
    font-size:16px !important;
  }

  .platform-rail{
    gap:10px !important;
    padding:0 !important;
  }

  .rail-tab{
    min-width:0 !important;
    width:auto !important;
    height:44px !important;
    padding:0 16px !important;
    border-radius:999px !important;
    font-size:13px !important;
  }

  .rail-tab-kicker{
    font-size:10px !important;
  }

  .dashboard-v2{
    max-width:1460px !important;
    margin:0 auto !important;
    padding:8px 2px 0 !important;
  }

  .hero-strip{
    display:grid !important;
    grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr) !important;
    align-items:end !important;
    gap:26px !important;
    margin-bottom:24px !important;
    padding:8px 0 22px !important;
    border-bottom:1px solid rgba(161,145,120,.16) !important;
    background:transparent !important;
    border-radius:0 !important;
    box-shadow:none !important;
  }

  .hero-title{
    font-size:74px !important;
    line-height:.94 !important;
    letter-spacing:-.075em !important;
    max-width:900px;
  }

  .hero-title-sm{
    font-size:42px !important;
  }

  .hero-text{
    max-width:760px !important;
    font-size:17px !important;
    line-height:1.55 !important;
  }

  .project-stats-grid-v2{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:0 !important;
    margin-bottom:12px !important;
    border-top:1px solid rgba(161,145,120,.16) !important;
    border-bottom:1px solid rgba(161,145,120,.16) !important;
  }

  .project-stats-grid-v2 .stat-card{
    border:0 !important;
    background:transparent !important;
    border-radius:0 !important;
    padding:18px 0 22px !important;
  }

  .project-stats-grid-v2 .stat-card + .stat-card{
    border-left:1px solid rgba(161,145,120,.16) !important;
    padding-left:26px !important;
    margin-left:26px !important;
  }

  .stat-label{
    font-size:11px !important;
    text-transform:uppercase !important;
    letter-spacing:.14em !important;
  }

  .stat-value{
    font-size:58px !important;
  }

  .stat-value-sm{
    font-size:32px !important;
  }

  .project-grid{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:0 !important;
    border-top:1px solid rgba(161,145,120,.16) !important;
  }

  .project-card-v2,
  .project-row-v3{
    display:grid !important;
    grid-template-columns:74px minmax(0,1fr) auto !important;
    align-items:center !important;
    gap:22px !important;
    min-height:0 !important;
    padding:24px 0 !important;
    border:0 !important;
    border-bottom:1px solid rgba(161,145,120,.16) !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }

  .project-card-v2:hover,
  .project-row-v3:hover{
    transform:none !important;
    background:rgba(255,255,255,.24) !important;
    border-color:rgba(96,112,161,.20) !important;
  }

  .project-row-mark{
    padding-top:2px !important;
  }

  .project-card-icon{
    width:52px !important;
    height:52px !important;
    border-radius:16px !important;
    font-size:21px !important;
  }

  .project-row-titleline{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:16px !important;
  }

  .project-card-title{
    font-size:34px !important;
    margin:0 !important;
    line-height:1.06 !important;
  }

  .project-row-meta{
    display:flex !important;
    align-items:center !important;
    gap:12px !important;
    margin-top:10px !important;
  }

  .project-card-meta{
    font-size:14px !important;
  }

  .project-card-actions,
  .project-row-actions{
    justify-content:flex-end !important;
    align-self:center !important;
    margin-top:0 !important;
    padding-left:18px !important;
  }

  .empty-project-card,
  .blank-workspace-card,
  .surface-card{
    border-radius:0 !important;
    border-left:0 !important;
    border-right:0 !important;
    border-top:0 !important;
    background:transparent !important;
    box-shadow:none !important;
  }

  .builder-v2{
    max-width:1460px !important;
    margin:0 auto !important;
    grid-template-columns:minmax(360px,410px) minmax(0,1fr) !important;
    gap:20px !important;
    padding:0 !important;
    min-height:calc(100dvh - 214px) !important;
  }

  .chat-panel-v2,
  .preview-panel-v2{
    border-radius:22px !important;
    border:1px solid rgba(161,145,120,.16) !important;
    background:rgba(255,252,247,.48) !important;
  }

  .panel-head-v2,
  .preview-toolbar-v2{
    min-height:62px !important;
    padding:14px 16px !important;
  }

  .panel-head-copy b,
  .preview-toolbar-title{
    font-size:19px !important;
  }

  .chip-row-v2{
    display:none !important;
  }

  .prompt-box-v2{
    padding:14px !important;
  }

  .builder-textarea{
    min-height:118px !important;
    border-radius:18px !important;
    font-size:14px !important;
  }

  .preview-toolbar-v2 .preview-chip,
  .preview-toolbar-v2 .preview-meta-chip,
  .preview-toolbar-v2 .preview-provider-chip{
    display:none !important;
  }

  .preview-frame-wrap{
    min-height:760px !important;
    padding:16px !important;
    border-radius:24px !important;
  }

  .preview-frame.desktop{
    min-height:724px !important;
    width:100% !important;
  }
}

/* Website-like desktop workspace */
.workspace-home{
  display:grid;
  gap:24px;
}

.workspace-home-hero{
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr);
  gap:28px;
  align-items:end;
  padding:10px 0 24px;
  border-bottom:1px solid rgba(161,145,120,.16);
}

.workspace-home-kicker,
.workspace-band-kicker,
.workspace-empty-kicker,
.blank-side-label{
  font-size:11px;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:#8a7b67;
}

.workspace-home-title{
  margin:8px 0 0;
  font-size:72px;
  line-height:.94;
  letter-spacing:-.08em;
  font-weight:900;
  color:#1d2430;
  max-width:940px;
}

.workspace-home-text{
  margin:16px 0 0;
  max-width:760px;
  font-size:18px;
  line-height:1.58;
  color:#697487;
}

.workspace-home-actions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:24px;
}

.workspace-home-side{
  display:grid;
  gap:12px;
  align-self:stretch;
  padding:10px 0 0;
}

.workspace-side-label{
  font-size:12px;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:#8a7b67;
}

.workspace-side-metric{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:16px;
  padding:14px 0;
  border-bottom:1px solid rgba(161,145,120,.14);
  color:#6d788b;
}

.workspace-side-metric strong{
  font-size:34px;
  line-height:1;
  letter-spacing:-.05em;
  font-weight:900;
  color:#1d2430;
}

.workspace-home-band{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:20px;
  align-items:end;
  padding:4px 0 12px;
}

.workspace-band-title{
  margin:6px 0 0;
  font-size:34px;
  line-height:1.08;
  letter-spacing:-.05em;
  font-weight:900;
  color:#1d2430;
}

.workspace-band-note{
  max-width:440px;
  font-size:14px;
  line-height:1.6;
  color:#7a8494;
}

.workspace-project-list{
  display:grid;
  border-top:1px solid rgba(161,145,120,.16);
}

.workspace-project-row{
  display:grid;
  grid-template-columns:74px minmax(0,1fr) auto;
  gap:22px;
  align-items:center;
  padding:24px 0;
  border-bottom:1px solid rgba(161,145,120,.16);
  cursor:pointer;
  transition:background-color .18s ease, border-color .18s ease;
}

.workspace-project-row:hover{
  background:rgba(255,255,255,.24);
  border-color:rgba(96,112,161,.20);
}

.workspace-project-mark{
  padding-top:2px;
}

.workspace-project-icon{
  width:52px;
  height:52px;
  display:grid;
  place-items:center;
  border-radius:16px;
  background:rgba(255,255,255,.74);
  border:1px solid rgba(161,145,120,.14);
  font-size:21px;
}

.workspace-project-main{
  min-width:0;
}

.workspace-project-topline{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
}

.workspace-project-title{
  margin:0;
  font-size:34px;
  line-height:1.06;
  letter-spacing:-.05em;
  font-weight:900;
  color:#1d2430;
}

.workspace-project-id{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:40px;
  padding:0 16px;
  border-radius:999px;
  background:rgba(255,255,255,.66);
  border:1px solid rgba(161,145,120,.14);
  color:#586173;
  font-size:14px;
  font-weight:800;
}

.workspace-project-meta{
  display:flex;
  align-items:center;
  gap:12px;
  margin-top:10px;
  color:#7a8494;
  font-size:14px;
}

.workspace-project-dot{
  width:4px;
  height:4px;
  border-radius:999px;
  background:rgba(117,108,96,.45);
}

.workspace-project-summary{
  margin:12px 0 0;
  max-width:720px;
  font-size:15px;
  line-height:1.6;
  color:#657084;
}

.workspace-project-actions{
  display:flex;
  gap:10px;
  justify-content:flex-end;
  padding-left:18px;
}

.workspace-empty-state,
.workspace-error-state{
  padding:30px 0 20px;
}

.workspace-empty-title{
  margin:8px 0 0;
  font-size:44px;
  line-height:1;
  letter-spacing:-.06em;
  font-weight:900;
  color:#1d2430;
}

.workspace-empty-text{
  max-width:680px;
  margin:14px 0 0;
  font-size:16px;
  line-height:1.6;
  color:#6d788b;
}

.workspace-empty-state .btn{
  margin-top:20px;
}

.blank-workspace-v2{
  min-height:calc(100dvh - 260px);
  display:grid;
  align-items:center;
}

.blank-workspace-card-v2{
  width:100%;
  display:grid;
  grid-template-columns:minmax(0,1.1fr) 320px;
  gap:36px;
  padding:26px 0 34px;
  border-top:1px solid rgba(161,145,120,.18);
  border-bottom:1px solid rgba(161,145,120,.18);
}

.blank-workspace-main{
  min-width:0;
}

.blank-workspace-side{
  display:grid;
  align-content:start;
}

.blank-side-block{
  display:grid;
  gap:10px;
  padding-top:12px;
}

.blank-side-item{
  padding:12px 0;
  border-bottom:1px solid rgba(161,145,120,.14);
  font-size:15px;
  color:#1f2937;
  font-weight:700;
}

@media (max-width: 1050px){
  .workspace-home-hero,
  .workspace-home-band,
  .blank-workspace-card-v2{
    grid-template-columns:1fr;
  }

  .workspace-home-title{
    font-size:48px;
  }

  .workspace-project-row{
    grid-template-columns:1fr;
    gap:12px;
    padding:22px 0;
  }

  .workspace-project-actions{
    justify-content:flex-start;
    padding-left:0;
  }
}

@media (max-width: 900px){
  .workspace-home{
    gap:16px;
  }

  .workspace-home-title{
    font-size:40px;
  }

  .workspace-home-text,
  .workspace-empty-text,
  .workspace-project-summary{
    font-size:15px;
  }

  .workspace-home-side{
    padding:0;
    border:1px solid rgba(161,145,120,.16);
    border-radius:22px;
    background:linear-gradient(180deg,rgba(255,253,248,.96),rgba(248,242,232,.98));
    padding:18px;
  }

  .workspace-home-band{
    gap:10px;
    padding:6px 0 0;
  }

  .workspace-band-title{
    font-size:28px;
  }

  .workspace-project-list{
    gap:12px;
    border-top:0;
  }

  .workspace-project-row{
    padding:20px;
    border:1px solid rgba(161,145,120,.16);
    border-radius:24px;
    background:linear-gradient(180deg,#fffdf9,#f4eee5);
    box-shadow:0 10px 24px rgba(22,30,44,.04);
  }

  .workspace-project-topline{
    align-items:flex-start;
    flex-direction:column;
    gap:10px;
  }

  .workspace-project-title{
    font-size:28px;
  }

  .blank-workspace-card-v2{
    gap:18px;
    padding:0;
    border:0;
  }

  .blank-workspace-side{
    border:1px solid rgba(161,145,120,.16);
    border-radius:22px;
    background:linear-gradient(180deg,rgba(255,253,248,.96),rgba(248,242,232,.98));
    padding:18px;
  }
}

/* Hard desktop de-card pass */
@media (min-width: 1051px){
  body[data-ui-mode="app"] .card,
  body[data-ui-mode="app"] .glass,
  body[data-ui-mode="app"] .panel,
  body[data-ui-mode="app"] .chat-panel,
  body[data-ui-mode="app"] .preview-shell,
  body[data-ui-mode="app"] .preview-panel,
  body[data-ui-mode="app"] .surface-card,
  body[data-ui-mode="app"] .template-card,
  body[data-ui-mode="app"] .mini-stat,
  body[data-ui-mode="app"] .stat-card,
  body[data-ui-mode="app"] .project-card,
  body[data-ui-mode="app"] .project-card-v2,
  body[data-ui-mode="app"] .workspace-project-row,
  body[data-ui-mode="app"] .blank-workspace-card,
  body[data-ui-mode="app"] .admin-form-card{
    border-radius:0 !important;
    box-shadow:none !important;
  }

  body[data-ui-mode="app"] .platform-header,
  body[data-ui-mode="app"] .chat-panel-v2,
  body[data-ui-mode="app"] .preview-panel-v2,
  body[data-ui-mode="app"] .admin-form-card{
    background:transparent !important;
    border-left:0 !important;
    border-right:0 !important;
  }

  .platform-shell{
    max-width:100% !important;
    padding:10px 20px 20px !important;
    gap:6px !important;
  }

  .platform-header{
    grid-template-columns:180px minmax(0,1fr) auto !important;
    padding:6px 0 10px !important;
    border-top:0 !important;
    border-left:0 !important;
    border-right:0 !important;
    border-bottom:1px solid rgba(161,145,120,.16) !important;
  }

  .platform-brand{
    min-width:0 !important;
    gap:10px !important;
  }

  .brand-mark{
    width:38px !important;
    height:38px !important;
    border-radius:10px !important;
  }

  .brand-name{
    font-size:16px !important;
  }

  .platform-project-label{
    margin-bottom:2px !important;
  }

  .platform-project-title{
    font-size:16px !important;
    max-width:900px;
  }

  .platform-actions{
    align-items:center !important;
    gap:6px !important;
  }

  .platform-select,
  .platform-btn,
  .platform-credit-pill{
    background:rgba(255,255,255,.48) !important;
    border:1px solid rgba(161,145,120,.14) !important;
    min-height:34px !important;
    height:34px !important;
    border-radius:10px !important;
    font-size:12px !important;
  }

  .platform-rail{
    padding:0 0 6px !important;
    border-bottom:1px solid rgba(161,145,120,.14);
  }

  .rail-tab{
    background:transparent !important;
    border:0 !important;
    border-bottom:2px solid transparent !important;
    border-radius:0 !important;
    padding:0 0 10px !important;
    height:auto !important;
    min-width:unset !important;
  }

  .rail-tab.active{
    background:transparent !important;
    box-shadow:none !important;
    border-bottom-color:#355f79 !important;
  }

  .rail-tab-kicker{
    display:none !important;
  }

  .platform-stage{
    padding-top:4px !important;
  }

  .dashboard-v2,
  .workspace-home,
  .builder-v2{
    max-width:100% !important;
    margin:0 !important;
  }

  .workspace-home{
    gap:12px !important;
  }

  .workspace-home-hero{
    grid-template-columns:minmax(0,1.45fr) minmax(260px,.55fr) !important;
    gap:40px !important;
    padding:4px 0 18px !important;
  }

  .workspace-home-title{
    font-size:42px !important;
    max-width:1100px !important;
  }

  .workspace-home-side{
    border-left:1px solid rgba(161,145,120,.14);
    padding-left:22px !important;
  }

  .workspace-home-band{
    padding:0 0 8px !important;
    border-bottom:1px solid rgba(161,145,120,.14);
  }

  .workspace-project-list{
    border-top:0 !important;
  }

  .workspace-project-row{
    grid-template-columns:60px minmax(0,1fr) auto !important;
    gap:14px !important;
    padding:14px 0 !important;
    background:transparent !important;
    border-left:0 !important;
    border-right:0 !important;
    border-top:0 !important;
  }

  .workspace-project-row:hover{
    background:rgba(255,255,255,.14) !important;
  }

  .workspace-project-icon{
    width:42px !important;
    height:42px !important;
    border-radius:12px !important;
  }

  .workspace-project-title{
    font-size:20px !important;
  }

  .workspace-project-summary{
    max-width:960px !important;
  }

  .blank-workspace-card-v2{
    grid-template-columns:minmax(0,1.3fr) 280px !important;
    gap:30px !important;
    padding:20px 0 28px !important;
  }

  .blank-workspace-title{
    font-size:34px !important;
  }

  .blank-workspace-side{
    border-left:1px solid rgba(161,145,120,.14);
    padding-left:22px !important;
  }

  .builder-v2{
    grid-template-columns:minmax(320px,360px) minmax(0,1fr) !important;
    gap:10px !important;
    min-height:calc(100dvh - 118px) !important;
  }

  .chat-panel-v2,
  .preview-panel-v2{
    border-top:1px solid rgba(161,145,120,.14) !important;
    border-bottom:1px solid rgba(161,145,120,.14) !important;
    border-left:0 !important;
    border-right:0 !important;
  }

  .panel-head-v2,
  .preview-toolbar-v2{
    background:transparent !important;
    border-bottom:1px solid rgba(161,145,120,.12) !important;
    padding:6px 0 !important;
    min-height:40px !important;
  }

  .chat-list{
    padding:4px 0 !important;
  }

  .chat-message.ai{
    background:transparent !important;
    border:0 !important;
    border-left:2px solid rgba(53,95,121,.28) !important;
    border-radius:0 !important;
    padding:7px 0 7px 10px !important;
    font-size:12px !important;
  }

  .chat-message.user{
    border-radius:18px !important;
    padding:9px 12px !important;
    font-size:12px !important;
  }

  .prompt-box-v2{
    background:transparent !important;
    border-top:1px solid rgba(161,145,120,.12) !important;
    padding:6px 0 0 !important;
  }

  .builder-textarea{
    min-height:72px !important;
    background:rgba(255,255,255,.6) !important;
    border-radius:12px !important;
    font-size:12px !important;
    padding:10px !important;
  }

  .panel-head-v2 .shell-kicker,
  .preview-toolbar-v2 .shell-kicker,
  .preview-type-label{
    display:none !important;
  }

  .panel-head-copy,
  .preview-toolbar-copy{
    gap:0 !important;
  }

  .panel-head-copy b,
  .preview-toolbar-title{
    font-size:12px !important;
    line-height:1.15 !important;
  }

  .mode-chip{
    min-height:24px !important;
    padding:0 8px !important;
    font-size:10px !important;
    letter-spacing:.05em !important;
  }

  .preview-toolbar-actions{
    gap:4px !important;
  }

  .preview-toolbar-actions .btn{
    min-width:0 !important;
    padding:0 9px !important;
    height:32px !important;
    min-height:32px !important;
    font-size:12px !important;
  }

  .preview-frame-wrap{
    background:linear-gradient(180deg,#ddd7cf,#ebe6df 54%,#e2e7e4) !important;
    border-radius:0 !important;
    min-height:560px !important;
    padding:6px !important;
  }

  .preview-frame.desktop{
    border-radius:0 !important;
    min-height:540px !important;
  }
}
