:root{
  --bg:#f8fafc;
  --paper:#ffffff;
  --ink:#0f172a;
  --muted:#64748b;
  --line:rgba(0,0,0,0.06);
  --accent:#0284c7;
  --accent-light:#38bdf8;
  --dark:#090a0f;
  --density:1;
}

:root[data-theme=dark], html.mobile-mode[data-theme=dark], body[data-theme=dark]{
  color-scheme:dark;
  --bg:#090a0f;
  --paper:#0f121b;
  --ink:#f8fafc;
  --muted:#94a3b8;
  --line:rgba(255,255,255,0.06);
  --accent:#38bdf8;
  --accent-light:#7dd3fc;
  --dark:#050608;
  --density:1;
}

*{box-sizing:border-box}

html,body{
  width:100%;
  max-width:100vw;
  height:100%;
  max-height:100dvh;
  overflow:hidden;
  overscroll-behavior:none;
  touch-action:pan-x pan-y;
  margin:0;
  padding:0;
  background:var(--bg);
  color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Inter,system-ui,sans-serif;
  font-size:14px;
  -webkit-font-smoothing:antialiased;
}

[data-theme=dark] body{
  background:#090a0f;
  background-image:radial-gradient(ellipse 90% 50% at 50% -10%,rgba(56,189,248,0.08),transparent 70%),radial-gradient(ellipse 60% 40% at 100% 60%,rgba(99,102,241,0.04),transparent 60%);
}

button,input,textarea,select{font:inherit}
button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}
button{
  cursor:pointer;
  color:inherit;
  background:rgba(255,255,255,0.04);
  border:1px solid var(--line);
  border-radius:10px;
  padding:8px 12px;
  transition:all .18s cubic-bezier(.16,1,.3,1);
}
button:hover{background:rgba(255,255,255,0.07)}
button:active{transform:translateY(1px) scale(.99)}
button:disabled{opacity:.45;cursor:wait}
a{color:inherit;text-decoration:none}
input,textarea,select{
  color:inherit;
  border:1px solid var(--line);
  border-radius:10px;
  padding:10px 12px;
  background:rgba(255,255,255,0.02);
  outline:none;
}
input:focus,textarea:focus,select:focus{
  border-color:var(--accent);
  box-shadow:0 0 0 3px rgba(56,189,248,0.18);
}
[hidden]{display:none!important}

/* AutoBox & Titanium Buttons */
.autobox-btn,.\33 d-btn,.primary{
  background:linear-gradient(135deg,#38bdf8 0%,#2563eb 100%)!important;
  color:#ffffff!important;
  border:none!important;
  font-weight:600;
  box-shadow:0 4px 16px rgba(56,189,248,0.25),inset 0 1px 0 rgba(255,255,255,0.3)!important;
}
.autobox-btn:hover,.\33 d-btn:hover,.primary:hover{
  filter:brightness(1.08);
  box-shadow:0 6px 20px rgba(56,189,248,0.35),inset 0 1px 0 rgba(255,255,255,0.4)!important;
}
.autobox-btn:active,.\33 d-btn:active,.primary:active{
  transform:translateY(1px) scale(.98)!important;
  box-shadow:0 2px 8px rgba(56,189,248,0.25)!important;
}
.small{font-size:12px;padding:6px 10px}
.muted{color:var(--muted);line-height:1.6}

/* AutoBox Visual Eyebrow & Status Dots */
.studio-eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:9.5px;
  font-weight:700;
  letter-spacing:0.16em;
  color:#64748b;
  text-transform:uppercase;
  margin-bottom:8px;
}
.pulse-dot{
  width:6px;
  height:6px;
  border-radius:50%;
  background:#38bdf8;
  box-shadow:0 0 8px #38bdf8;
  display:inline-block;
  animation:glow-pulse 2.2s infinite;
}
@keyframes glow-pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.25)}}

/* AutoBox Brand */
.autobox-logo{display:flex;align-items:center;gap:10px;text-decoration:none}
.brand-orb{
  width:34px;
  height:34px;
  border-radius:10px;
  background:radial-gradient(circle at 35% 35%,#7dd3fc 0%,#38bdf8 45%,#1e3a8a 95%);
  display:grid;
  place-items:center;
  color:#ffffff;
  font-size:18px;
  font-weight:700;
  box-shadow:0 4px 14px rgba(56,189,248,0.35),inset 0 1px 1px rgba(255,255,255,0.6);
  flex-shrink:0;
}
.brand-orb.mini{width:26px;height:26px;border-radius:8px;font-size:14px}
.autobox-brand-type{display:flex;flex-direction:column;font-size:18px;font-weight:700;letter-spacing:-.5px;line-height:1;color:var(--ink)}
.autobox-brand-type small{font-size:7px;letter-spacing:1.8px;font-weight:600;color:#38bdf8;margin-top:3px}

/* Application Shell - Strictly Contained Within 100vw */
#workspace{
  width:100%;
  max-width:100vw;
  height:var(--app-height,100dvh);
  max-height:100dvh;
  position:fixed;
  inset:0;
  overflow:hidden;
  display:flex;
  box-sizing:border-box;
}

.sidebar{
  position:absolute;
  inset:0 auto 0 0;
  width:240px;
  padding:28px 18px;
  background:#0c0e14;
  border-right:1px solid var(--line);
  display:flex;
  flex-direction:column;
  height:100%;
  z-index:2;
}
.workspace-label{
  display:flex;
  gap:10px;
  align-items:center;
  margin:24px 0 20px;
  padding:10px 12px;
  border-radius:10px;
  font-size:12px;
  background:rgba(255,255,255,0.025);
}
.workspace-label small{display:block;color:var(--muted);font-size:10px;margin-top:2px}
.avatar{background:#1e293b;border-radius:7px;padding:6px 8px;font-weight:600;color:#38bdf8}
.online{display:inline-block;width:6px;height:6px;border-radius:50%;background:#38bdf8;box-shadow:0 0 6px #38bdf8}
.workspace-label>.online{margin-left:auto}

nav button{
  display:flex;
  align-items:center;
  width:100%;
  gap:10px;
  text-align:left;
  border:0;
  background:transparent;
  margin:3px 0;
  padding:9px 12px;
  border-radius:8px;
  color:#94a3b8;
  font-size:13px;
  font-weight:500;
}
nav button>span{font-size:16px;width:18px}
.selected{background:rgba(56,189,248,0.12)!important;color:#38bdf8!important;font-weight:600}
.agent-pill,.net-pill{margin-left:auto;font-size:8.5px;padding:2px 6px;border-radius:999px;font-weight:600}
.agent-pill{background:rgba(56,189,248,0.15);color:#38bdf8}
.net-pill{background:rgba(129,140,248,0.15);color:#818cf8}
.sidebar-bottom{margin-top:auto}
.model-card{padding:12px;font-size:10px;background:rgba(255,255,255,0.025);border-radius:10px}
.model-card-header{display:flex;align-items:center;gap:6px;margin-bottom:4px}
.model-card p{color:#94a3b8;margin:2px 0 4px}
.model-card small{font-size:8.5px;color:#64748b;line-height:1.4;display:block}
.text-button{background:none;border:none;padding:5px 0;font-size:11px;color:#94a3b8}

/* Main Content Area */
main{
  margin-left:240px;
  height:100%;
  width:calc(100vw - 240px);
  max-width:calc(100vw - 240px);
  display:flex;
  flex-direction:column;
  min-height:0;
  flex:1;
  overflow:hidden;
  position:relative;
  box-sizing:border-box;
}

header{
  height:58px;
  border-bottom:1px solid var(--line);
  padding:0 24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  background:rgba(9,10,15,0.85);
  backdrop-filter:blur(16px);
  flex-shrink:0;
}
.breadcrumb{font-size:12px;color:#64748b}
.breadcrumb span{margin:0 8px;color:#334155}
.breadcrumb strong{color:#e2e8f0;font-weight:600}
.header-right{display:flex;align-items:center;gap:14px}
.autolink-btn{
  font-size:11px;
  padding:5px 10px;
  border-radius:7px;
  background:rgba(56,189,248,0.1);
  border:1px solid rgba(56,189,248,0.25);
  color:#38bdf8;
  font-weight:600;
  display:flex;
  align-items:center;
  gap:4px;
}
.autolink-btn:hover{background:rgba(56,189,248,0.18)}
.sync{font-size:10px;color:#64748b;display:flex;gap:5px;align-items:center}
.sync i{width:5px;height:5px;border-radius:50%;background:#38bdf8;box-shadow:0 0 5px #38bdf8}

/* Pages - Contained */
.page{
  width:100%;
  max-width:100%;
  height:100%;
  min-height:0;
  overflow-y:auto;
  overscroll-behavior:contain;
  padding:24px 32px 18px;
  margin:0 auto;
  box-sizing:border-box;
}

/* Chat Page - Contained and Non-Scrollable Shell */
#chat{
  max-width:960px;
  height:100%;
  max-height:100%;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  padding:16px 24px 8px;
  flex:1;
  min-height:0;
  box-sizing:border-box;
}
.chat-toolbar{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  padding:8px 12px;
  border-radius:10px;
  background:rgba(255,255,255,0.025);
  border-bottom:1px solid var(--line);
  flex-shrink:0;
  margin-bottom:10px;
}
.chat-picker-pill{
  display:flex;
  align-items:center;
  gap:6px;
  font-size:12.5px;
  font-weight:600;
  border:0;
  background:transparent;
  padding:3px 0;
  color:#f8fafc;
}
.chat-picker-pill span{white-space:nowrap;text-overflow:ellipsis;overflow:hidden;max-width:240px}
.chat-toolbar>div{display:flex;gap:6px;align-items:center}
.memory-badge{
  font-size:10px;
  font-weight:600;
  padding:3px 8px;
  border-radius:999px;
  background:rgba(56,189,248,0.1);
  color:#38bdf8;
}
.tool-btn{
  font-size:14px;
  padding:4px 8px;
  min-width:30px;
  border-radius:7px;
  border:0;
  background:rgba(255,255,255,0.04);
}

#chat-scroll{
  flex:1 1 0;
  min-height:0;
  overflow-y:auto;
  overscroll-behavior-y:contain;
  -webkit-overflow-scrolling:touch;
  padding:2px 0;
  box-sizing:border-box;
}

/* AutoBox Visual Heading & Elements (Borderless) */
.studio-heading{
  margin-bottom:18px;
}
.studio-heading h1{
  font-size:32px;
  line-height:1.15;
  letter-spacing:-0.045em;
  font-weight:600;
  margin:0 0 8px;
  color:#f8fafc;
}
.studio-heading h1 span{color:#94a3b8;font-weight:400}
.studio-subtext{font-size:13px;color:#94a3b8;line-height:1.55;margin:0}

/* AutoBox Split Summary Bar (Borderless stats with hairline divider) */
.studio-summary{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  padding:14px 0;
  border-top:1px solid rgba(255,255,255,0.07);
  border-bottom:1px solid rgba(255,255,255,0.07);
  margin-bottom:18px;
}
.studio-summary>div{
  display:flex;
  flex-direction:column;
  gap:4px;
  padding-left:14px;
  border-left:1px solid rgba(255,255,255,0.07);
}
.studio-summary>div:first-child{padding-left:0;border:0}
.studio-summary strong{
  font-size:22px;
  letter-spacing:-0.04em;
  font-weight:600;
  color:#f8fafc;
}
.studio-summary span{font-size:9.5px;color:#94a3b8;text-transform:uppercase;letter-spacing:0.06em}

/* AutoBox Animated Action Rows (Borderless interactive widgets) */
.studio-actions-list{
  display:grid;
  gap:6px;
  margin-bottom:22px;
}
.studio-action-row{
  display:flex;
  align-items:center;
  gap:12px;
  text-align:left;
  padding:12px 14px;
  border:none;
  background:rgba(255,255,255,0.025);
  border-radius:10px;
  transition:all .18s ease;
  width:100%;
}
.studio-action-row:hover{
  background:rgba(255,255,255,0.05);
  transform:translateX(2px);
}
.action-icon{
  width:32px;
  height:32px;
  border-radius:8px;
  background:rgba(56,189,248,0.12);
  color:#38bdf8;
  display:grid;
  place-items:center;
  font-size:15px;
  flex-shrink:0;
}
.action-info{flex:1;min-width:0}
.action-info strong{display:block;font-size:13px;font-weight:600;color:#f8fafc}
.action-info small{display:block;font-size:10.5px;color:#94a3b8;margin-top:2px}
.action-arrow{color:#64748b;font-size:14px;margin-left:auto}

/* Borderless Recent Notes */
.studio-section-label{
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-size:9.5px;
  letter-spacing:.12em;
  color:#64748b;
  margin:18px 0 10px;
  text-transform:uppercase;
  font-weight:700;
}
.studio-recent-list{display:grid;gap:2px}
.recent-row{
  display:flex;
  align-items:center;
  gap:10px;
  padding:9px 10px;
  border:0;
  background:transparent;
  border-radius:8px;
  text-align:left;
  width:100%;
}
.recent-row:hover{background:rgba(255,255,255,0.03)}
.note-icon{
  font-size:13px;
  color:#38bdf8;
  padding:4px 6px;
  border-radius:6px;
  background:rgba(56,189,248,0.08);
}
.recent-row strong{font-size:12.5px;font-weight:550;color:#f8fafc}
.recent-row small{margin-left:auto;font-size:9.5px;color:#64748b}

.is-composing #chat-widgets{display:none}

/* Message Stream */
#messages{display:grid;gap:14px;padding:8px 0}
.message{
  max-width:88%;
  line-height:1.55;
  font-size:13.5px;
  padding:12px 16px;
  border-radius:14px;
}
.message.user{
  margin-left:auto;
  background:rgba(30,41,59,0.85);
  color:#f8fafc;
  border-bottom-right-radius:4px;
}
.message.assistant{
  margin-right:auto;
  background:rgba(255,255,255,0.025);
  color:#e2e8f0;
  border-bottom-left-radius:4px;
}
.message-label{font-size:9px;font-weight:700;letter-spacing:1px;color:#38bdf8;margin-bottom:6px}

/* Agent Action Receipts */
.agent-action-card{
  margin-top:10px;
  padding:12px;
  background:rgba(15,23,42,0.8);
  border-left:2px solid #38bdf8;
  border-radius:8px;
}
.agent-action-header{display:flex;align-items:center;gap:6px;margin-bottom:4px}
.agent-action-icon{color:#38bdf8;font-size:13px}
.agent-action-type{font-size:11px;font-weight:700;color:#38bdf8}
.agent-action-badge{font-size:9px;color:#64748b;margin-left:auto}
.agent-action-title{font-size:13px;font-weight:600;color:#f8fafc;margin:3px 0 6px}
.agent-action-links{font-size:10px;color:#94a3b8;margin-bottom:8px}
.link-pill{color:#7dd3fc;background:rgba(56,189,248,0.1);padding:2px 5px;border-radius:4px;display:inline-block;margin-right:4px}
.agent-action-buttons{display:flex;gap:8px}
.action-btn{
  font-size:10.5px;
  padding:5px 9px;
  border-radius:6px;
  background:rgba(56,189,248,0.12);
  border:0;
  color:#7dd3fc;
  font-weight:600;
}
.action-btn:hover{background:rgba(56,189,248,0.22)}

.source-chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}
.source-chips button{
  font-size:10px;
  padding:4px 8px;
  border-radius:6px;
  background:rgba(255,255,255,0.035);
  border:0;
  color:#94a3b8;
  display:inline-flex;
  align-items:center;
  gap:4px;
}

/* Composer - Contained Pinned Dock */
.composer{
  margin-top:8px;
  padding:8px 12px;
  border-radius:12px;
  background:rgba(15,20,30,0.95);
  backdrop-filter:blur(20px);
  border:1px solid rgba(255,255,255,0.06);
  flex-shrink:0;
  box-sizing:border-box;
}
.composer textarea{
  width:100%;
  border:none;
  background:transparent;
  color:#f8fafc;
  resize:none;
  padding:4px 2px;
  min-height:36px;
  max-height:120px;
  outline:none;
  font-size:14px;
  line-height:1.4;
  box-sizing:border-box;
}
.composer-controls{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:8px;
  margin-top:4px;
}
.composer-meta{display:flex;gap:8px;align-items:center;font-size:10px;color:#64748b}
.route-tag{font-weight:600;color:#38bdf8}
.autobox-send-btn,.send{
  width:32px;
  height:32px;
  padding:0;
  border-radius:50%;
  border:0;
  background:linear-gradient(135deg,#38bdf8 0%,#2563eb 100%);
  color:#ffffff;
  display:grid;
  place-items:center;
  font-size:16px;
  font-weight:700;
  box-shadow:0 2px 10px rgba(56,189,248,0.3);
}
.composer-foot{
  font-size:9px;
  color:#475569;
  text-align:center;
  margin:4px 0 0;
  line-height:1.2;
}

/* 3D Knowledge Net - Full Width Stage */
.graph-page{
  padding:0;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  position:relative;
  width:100%;
  max-width:100vw;
  box-sizing:border-box;
}
.graph-top-overlay{
  position:absolute;
  top:12px;
  left:14px;
  right:14px;
  z-index:20;
  display:flex;
  flex-direction:column;
  gap:8px;
  pointer-events:none;
}
.graph-top-overlay>*{pointer-events:auto}
.graph-search-wrap{
  position:relative;
  width:100%;
  max-width:420px;
}
.graph-search-wrap .search-icon{
  position:absolute;
  left:12px;
  top:50%;
  transform:translateY(-50%);
  color:#64748b;
  font-size:13px;
  pointer-events:none;
}
.graph-search-wrap input{
  width:100%;
  padding:8px 12px 8px 32px;
  border-radius:20px;
  background:rgba(15,20,30,0.85);
  backdrop-filter:blur(16px);
  border:1px solid rgba(255,255,255,0.08);
  color:#f8fafc;
  font-size:12.5px;
}
.graph-filter-bar{
  display:flex;
  gap:6px;
  overflow-x:auto;
  scrollbar-width:none;
  padding:2px 0;
}
.filter-pill{
  font-size:11px;
  padding:5px 11px;
  border-radius:16px;
  background:rgba(15,20,30,0.85);
  backdrop-filter:blur(16px);
  border:1px solid rgba(255,255,255,0.06);
  color:#94a3b8;
  white-space:nowrap;
  flex-shrink:0;
}
.filter-pill.active{
  background:rgba(56,189,248,0.15);
  color:#38bdf8;
  border-color:rgba(56,189,248,0.3);
  font-weight:600;
}

.graph-stage{
  flex:1;
  width:100%;
  max-width:100vw;
  height:100%;
  position:relative;
  overflow:hidden;
  background:#07080d;
}
#brain-graph{
  display:block;
  width:100%!important;
  height:100%!important;
  position:absolute;
  inset:0;
  touch-action:none;
  cursor:grab;
  z-index:1;
}

/* Borderless HUD Controls */
.borderless-hud-controls{
  position:absolute;
  right:14px;
  bottom:16px;
  display:flex;
  flex-direction:column;
  gap:6px;
  z-index:20;
}
.borderless-hud-controls button{
  width:34px;
  height:34px;
  border-radius:50%;
  padding:0;
  display:grid;
  place-items:center;
  font-size:14px;
  background:rgba(15,20,30,0.85);
  backdrop-filter:blur(16px);
  border:1px solid rgba(255,255,255,0.08);
  color:#f8fafc;
  box-shadow:0 4px 14px rgba(0,0,0,0.5);
}
.graph-stats-hud{
  position:absolute;
  left:14px;
  bottom:16px;
  font-size:10px;
  font-weight:600;
  color:#64748b;
  background:rgba(15,20,30,0.85);
  backdrop-filter:blur(16px);
  padding:4px 9px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,0.06);
  z-index:20;
  pointer-events:none;
}

/* Borderless Bottom Inspector Sheet */
.graph-bottom-inspector{
  position:absolute;
  bottom:0;
  left:0;
  right:0;
  max-height:45vh;
  overflow-y:auto;
  background:rgba(15,20,30,0.95);
  backdrop-filter:blur(24px);
  border-top:1px solid rgba(255,255,255,0.08);
  border-radius:18px 18px 0 0;
  padding:16px 18px 20px;
  z-index:100;
  box-shadow:0 -10px 40px rgba(0,0,0,0.8);
  box-sizing:border-box;
}
.graph-bottom-inspector h3{
  font-size:17px;
  font-weight:600;
  color:#f8fafc;
  margin:6px 0 4px;
}
.graph-bottom-inspector p{
  font-size:11px;
  color:#94a3b8;
  margin:0 0 12px;
}
.inspector-actions{display:flex;gap:8px;margin-bottom:12px}
.inspector-btn{
  flex:1;
  padding:9px;
  font-size:12px;
  border-radius:8px;
  font-weight:600;
  text-align:center;
}
.graph-neighbor-chips{display:flex;flex-wrap:wrap;gap:6px}
.graph-neighbor-chips button{
  font-size:10.5px;
  padding:4px 8px;
  border-radius:6px;
  background:rgba(255,255,255,0.04);
  border:0;
  color:#94a3b8;
}
.graph-detail-close{
  position:absolute;
  right:12px;
  top:12px;
  background:transparent;
  border:0;
  color:#64748b;
  font-size:14px;
}
.graph-node-list-hidden{display:none}

/* Library Page Grid */
.note-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(240px,1fr));
  gap:12px;
  margin-top:14px;
}
.note-card{
  padding:14px;
  background:rgba(255,255,255,0.025);
  border-radius:12px;
  text-align:left;
  border:1px solid var(--line);
}
.note-card:hover{
  background:rgba(255,255,255,0.05);
  border-color:rgba(56,189,248,0.25);
}
.note-card h3{font-size:14px;font-weight:600;margin:4px 0;color:#f8fafc}
.note-card p{font-size:11px;color:#94a3b8;margin:4px 0 8px;line-height:1.4}
.tags{font-size:9.5px;color:#38bdf8}

/* Dialogs & Mobile Modals */
dialog{
  background:#0f121b;
  color:#f8fafc;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:16px 16px 0 0;
  padding:0 18px 20px;
  width:100%;
  max-width:100vw;
  box-sizing:border-box;
}
dialog::backdrop{background:rgba(0,0,0,0.75);backdrop-filter:blur(6px)}
.sheet-tab{display:flex;justify-content:center;padding:10px 0;position:relative}
.sheet-grip{width:36px;height:4px;border-radius:2px;background:#334155}
.sheet-expand{position:absolute;right:0;top:6px;background:none;border:none;color:#64748b}
.editor-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.editor-top h2{font-size:18px;margin:0}

/* Mobile Navigation Bar */
.mobile-nav{
  display:none;
}

/* ========================================================= */
/* STRICT MOBILE & PWA LAYOUT (Zero Horizontal Overflow)     */
/* ========================================================= */
@media (max-width: 880px), (display-mode: standalone), (pointer: coarse) and (max-width: 1024px), html.mobile-mode body {
  :root{--density:1!important}
  
  html,body{
    width:100%!important;
    max-width:100vw!important;
    overflow-x:hidden!important;
    zoom:1!important;
  }
  
  .sidebar{display:none!important}
  
  #workspace{
    zoom:1!important;
    width:100%!important;
    max-width:100vw!important;
    height:100dvh!important;
    position:fixed!important;
    inset:0!important;
    overflow:hidden!important;
  }
  
  #workspace main{
    margin-left:0!important;
    width:100%!important;
    max-width:100vw!important;
    padding-bottom:calc(58px + env(safe-area-inset-bottom))!important;
    overflow:hidden!important;
  }
  
  header{
    height:50px!important;
    padding:0 14px!important;
  }
  .header-right .autolink-btn{display:none}
  
  .page{
    width:100%!important;
    max-width:100vw!important;
    padding:12px 14px 6px!important;
    box-sizing:border-box!important;
  }
  
  #chat{
    width:100%!important;
    max-width:100vw!important;
    padding:8px 12px 4px!important;
    box-sizing:border-box!important;
  }
  
  .chat-toolbar{
    padding:6px 10px!important;
    margin-bottom:6px!important;
  }
  .chat-toolbar>div>.memory-badge{display:none}
  
  .studio-heading h1{
    font-size:24px!important;
    letter-spacing:-0.035em!important;
  }
  .studio-subtext{font-size:11.5px!important}
  
  .studio-summary strong{font-size:18px!important}
  .studio-summary span{font-size:8.5px!important}
  
  .studio-action-row{padding:10px 12px!important}
  .action-icon{width:28px!important;height:28px!important;font-size:13px!important}
  .action-info strong{font-size:12px!important}
  .action-info small{font-size:9.5px!important}
  
  .recent-row strong{font-size:11.5px!important}
  .recent-row small{font-size:8.5px!important}
  
  .composer{
    margin-top:6px!important;
    padding:6px 10px!important;
    border-radius:12px!important;
  }
  .composer textarea{
    min-height:32px!important;
    height:32px!important;
    font-size:15px!important;
  }
  
  /* Mobile Floating 3D Navigation Dock */
  .mobile-nav{
    display:flex!important;
    position:absolute!important;
    bottom:0!important;
    left:0!important;
    right:0!important;
    height:calc(56px + env(safe-area-inset-bottom))!important;
    padding:4px 12px calc(4px + env(safe-area-inset-bottom))!important;
    background:rgba(12,15,22,0.96)!important;
    backdrop-filter:blur(20px)!important;
    -webkit-backdrop-filter:blur(20px)!important;
    border-top:1px solid rgba(255,255,255,0.06)!important;
    z-index:40!important;
    justify-content:space-around!important;
    align-items:center!important;
    box-sizing:border-box!important;
  }
  .mobile-nav button{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:2px!important;
    padding:4px 6px!important;
    margin:0!important;
    border:0!important;
    background:transparent!important;
    font-size:17px!important;
    color:#64748b!important;
    border-radius:8px!important;
    flex:1!important;
  }
  .mobile-nav button.selected{
    color:#38bdf8!important;
    background:rgba(56,189,248,0.1)!important;
  }
  .mobile-nav button small{
    font-size:8px!important;
    font-weight:600!important;
    letter-spacing:.2px!important;
  }
  
  dialog,#more-menu,#editor,#widget-modal{
    width:100%!important;
    max-width:100vw!important;
    border-radius:16px 16px 0 0!important;
    padding:0 14px calc(14px + env(safe-area-inset-bottom))!important;
  }
}