/* Product layout. Visual identity lives in tokens.css and theme-sherlock.css. */
.os-shell { min-height: 100dvh; position: relative; isolation: isolate; }
.os-header { min-height: var(--header-height); display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 1rem; padding: .9rem clamp(1.25rem, 3vw, 3rem); position: relative; z-index: 20; }
.header-brand { width: max-content; border: 0; background: none; padding: 0; }
.header-center { justify-self: center; }
.global-state { display: inline-flex; align-items: center; gap: .55rem; padding: .5rem .85rem; border: 1px solid var(--stroke); background: var(--glass); border-radius: var(--radius-pill); color: var(--text-muted); font-size: .8rem; backdrop-filter: blur(10px); }
.state-light { display: inline-block; width: .45rem; height: .45rem; border-radius: 50%; background: var(--success); box-shadow: 0 0 10px var(--success); }
.global-state.attention .state-light { background: var(--accent-strong); box-shadow: 0 0 10px var(--accent-strong); }
.global-state.degraded .state-light { background: var(--danger); box-shadow: 0 0 10px var(--danger); }
.header-tools { justify-self: end; display: flex; align-items: center; gap: .55rem; }
.notification-trigger { position: relative; }
.notification-dot { position: absolute; width: .5rem; height: .5rem; top: .35rem; right: .35rem; background: var(--accent-strong); border-radius: 50%; box-shadow: 0 0 10px var(--accent-strong); }

.natural-view { display: flex; flex-direction: column; min-height: calc(100dvh - var(--header-height)); padding: .25rem clamp(1.25rem, 3vw, 3rem) 1.4rem; }
.natural-composition { width: min(100%, 1480px); margin: auto; flex: 1; min-height: 420px; display: grid; grid-template-columns: minmax(170px, 1fr) minmax(260px, 1.5fr) minmax(175px, 1fr); align-items: center; gap: 1.5rem; }
.natural-welcome { max-width: 255px; align-self: center; padding: 1rem 0; text-shadow: 0 2px 20px var(--background); }
.natural-welcome p { margin: .7rem 0 0; font-family: var(--font-display); font-size: clamp(1.22rem, 2vw, 1.85rem); line-height: 1.42; font-style: italic; }
.presence-center { align-self: center; display: flex; flex-direction: column; align-items: center; min-width: 0; }
.living-watson { position: relative; display: grid; place-items: center; width: clamp(250px, 31vw, 430px); aspect-ratio: 1; padding: 0; background: none; border: 0; border-radius: 50%; isolation: isolate; transition: transform var(--motion-normal); }
.living-watson:hover { transform: scale(1.025); }
.living-watson:active { transform: scale(.985); }
.living-watson img { width: 100%; height: 100%; object-fit: contain; position: relative; z-index: 1; user-select: none; }
.presence-caption { min-height: 3.4rem; display: flex; flex-direction: column; gap: .22rem; text-align: center; text-shadow: 0 2px 16px var(--background); }
.presence-caption strong { font-family: var(--font-display); font-size: clamp(1.2rem, 1.8vw, 1.6rem); font-weight: 500; }
.presence-caption span { color: var(--text-muted); font-size: .85rem; }
.natural-actions { display: flex; flex-direction: column; gap: .62rem; justify-self: end; width: min(100%, 210px); }
.glass-action { min-height: 50px; display: flex; align-items: center; gap: .72rem; padding: .7rem 1rem; background: var(--glass); color: var(--text); border: 1px solid var(--stroke); border-radius: var(--radius-pill); backdrop-filter: blur(12px); text-align: left; transition: background var(--motion-fast), border-color var(--motion-fast), transform var(--motion-fast); }
.glass-action .ui-icon { color: var(--accent-strong); font-size: 1.15rem; }
.glass-action:hover { background: var(--glass-light); border-color: var(--stroke-strong); transform: translateX(-3px); }
.mobile-quick-actions { display: none; }
.natural-activity { width: min(100%, 1370px); margin: .1rem auto 0; padding: 1rem 1.3rem .75rem; background: var(--glass); border: 1px solid var(--stroke); border-radius: var(--radius-panel); box-shadow: var(--shadow); backdrop-filter: blur(20px); }
.activity-heading { display: flex; justify-content: space-between; align-items: end; gap: .8rem; }
.activity-heading h2 { font-family: var(--font-display); font-size: 1.18rem; font-weight: 500; margin: .18rem 0 .6rem; }
.count-badge { display: inline-grid; place-items: center; min-width: 1.3rem; height: 1.3rem; padding: 0 .2rem; border: 1px solid var(--stroke-strong); color: var(--accent-strong); border-radius: 50%; font: 700 .7rem var(--font-ui); vertical-align: middle; }
.activity-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
.activity-row { min-width: 0; width: 100%; display: flex; align-items: center; gap: .8rem; padding: .68rem .8rem; color: var(--text); background: var(--glass-light); border: 1px solid var(--stroke); border-radius: var(--radius-control); text-align: left; }
.activity-row:hover { border-color: var(--stroke-strong); }
.activity-row .ui-icon { color: var(--accent-strong); font-size: 1.15rem; }
.activity-row-main { display: flex; flex-direction: column; gap: .16rem; min-width: 0; flex: 1; }
.activity-row-main strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 650; font-size: .88rem; }
.activity-row-main small { color: var(--text-muted); font-size: .75rem; }
.activity-empty { padding: .75rem .25rem; color: var(--text-muted); font-size: .84rem; }
.activity-attention { color: var(--accent-strong); }

.desk-view { min-height: calc(100dvh - var(--header-height)); display: grid; grid-template-columns: 86px minmax(0, 1fr); }
.desk-rail { display: flex; flex-direction: column; gap: .2rem; align-items: stretch; padding: 1rem .38rem; border-right: 1px solid var(--stroke); background: var(--glass); backdrop-filter: blur(14px); }
.rail-item { display: flex; flex-direction: column; align-items: center; gap: .24rem; padding: .65rem .15rem; color: var(--text-muted); background: none; border: 1px solid transparent; border-radius: var(--radius-control); font-size: .68rem; }
.rail-item .ui-icon { font-size: 1.25rem; }
.rail-item:hover, .rail-item.active { background: var(--glass-light); border-color: var(--stroke); color: var(--accent-strong); }
.desk-area { padding: 1rem 1.4rem 5.5rem; position: relative; min-width: 0; }
.desk-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; max-width: 1450px; margin: 0 auto; }
.desk-heading h1 { margin: .2rem 0 .5rem; font-family: var(--font-display); font-size: 1.6rem; font-weight: 500; }
.search-invite { display: inline-flex; align-items: center; gap: .65rem; min-width: min(360px, 38vw); padding: .65rem .75rem; background: var(--glass); border: 1px solid var(--stroke); border-radius: var(--radius-control); color: var(--text-muted); text-align: left; font-size: .8rem; }
.search-invite .ui-icon { color: var(--accent-strong); }
.search-invite kbd { margin-left: auto; color: var(--text-faint); font-size: .72rem; }
.window-stage { position: relative; width: min(100%, 1450px); height: calc(100dvh - 220px); min-height: 400px; margin: 0 auto; }
.app-window { position: absolute; display: flex; flex-direction: column; width: min(520px, 48vw); height: min(470px, 57vh); min-width: 320px; min-height: 250px; overflow: auto; resize: both; background: var(--glass-strong); border: 1px solid var(--stroke-strong); border-radius: var(--radius-panel); box-shadow: var(--shadow); backdrop-filter: blur(22px); }
.app-window.focused { border-color: var(--accent); }
.app-window.maximized { top: 0 !important; left: 0 !important; width: 100% !important; height: 100% !important; resize: none; }
.app-window.minimized { display: none; }
.window-titlebar { flex: none; display: flex; align-items: center; gap: .7rem; min-height: 44px; padding: .4rem .6rem .4rem .9rem; background: var(--glass-light); border-bottom: 1px solid var(--stroke); user-select: none; touch-action: none; cursor: grab; }
.window-titlebar:active { cursor: grabbing; }
.window-titlebar strong { flex: 1; font-size: .88rem; font-weight: 650; }
.window-titlebar .ui-icon { color: var(--accent-strong); }
.window-actions { display: flex; gap: .2rem; }
.window-actions button { width: 28px; height: 28px; display: grid; place-items: center; background: none; color: var(--text-muted); border: 0; border-radius: 6px; }
.window-actions button:hover { color: var(--text); background: var(--glass); }
.window-body { flex: 1; min-width: 0; overflow: auto; overflow-x: hidden; padding: 1rem; scrollbar-color: var(--stroke) transparent; }
.app-window[data-app="actions"] { width: min(640px, 62vw); height: min(620px, 72vh); }
.desk-dock { position: fixed; z-index: 25; display: flex; align-items: center; gap: .35rem; left: 50%; bottom: 1rem; transform: translateX(-50%); padding: .48rem; background: var(--glass-strong); border: 1px solid var(--stroke-strong); border-radius: var(--radius-panel); box-shadow: var(--shadow); backdrop-filter: blur(20px); }
.dock-item { display: grid; justify-items: center; gap: .13rem; min-width: 64px; padding: .35rem .4rem; border: 1px solid transparent; border-radius: var(--radius-control); background: none; color: var(--text-muted); font-size: .62rem; }
.dock-item .ui-icon { font-size: 1.35rem; }
.dock-item:hover, .dock-item.active { color: var(--accent-strong); background: var(--glass-light); border-color: var(--stroke); }
.desk-launcher { display: none; }
.watson-companion { position: fixed; z-index: 28; right: 1.4rem; bottom: 7rem; display: grid; justify-items: center; width: 105px; padding: 0; background: none; border: 0; border-radius: 50%; touch-action: none; cursor: grab; }
.watson-companion:active { cursor: grabbing; }
.watson-companion img { width: 100%; aspect-ratio: 1; object-fit: contain; }
.companion-caption { margin-top: -.2rem; padding: .16rem .55rem; background: var(--glass); border: 1px solid var(--stroke); border-radius: var(--radius-pill); color: var(--text); font-size: .65rem; }

.conversation-surface { position: fixed; inset: 0; z-index: 60; display: grid; place-items: center; padding: 1rem; background: rgba(3, 9, 15, .68); backdrop-filter: blur(12px); }
.surface-shell { width: min(1100px, 96vw); height: min(810px, 90dvh); min-height: 420px; display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--stroke-strong); border-radius: var(--radius-panel); background: var(--glass-strong); box-shadow: var(--shadow); }
.surface-header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .95rem 1.25rem; border-bottom: 1px solid var(--stroke); }
.surface-header h2, .drawer-header h2 { margin: .2rem 0 0; font: 500 1.45rem var(--font-display); }
.surface-controls { display: flex; align-items: center; gap: .5rem; }
.conversation-layout { min-height: 0; display: grid; grid-template-columns: 220px minmax(0, 1fr); flex: 1; }
.conversation-history { min-height: 0; overflow: auto; padding: 1rem .7rem; border-right: 1px solid var(--stroke); }
.conversation-history h3 { margin: 0 .5rem .7rem; color: var(--text-muted); font-size: .73rem; text-transform: uppercase; letter-spacing: .12em; }
.conversation-history button { display: block; width: 100%; padding: .65rem .55rem; color: var(--text-muted); background: none; border: 1px solid transparent; border-radius: var(--radius-control); text-align: left; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .83rem; }
.conversation-history button:hover, .conversation-history button.active { color: var(--text); border-color: var(--stroke); background: var(--glass-light); }
.conversation-main { display: flex; flex-direction: column; min-width: 0; min-height: 0; }
.conversation-messages { display: flex; flex-direction: column; gap: .9rem; min-height: 0; flex: 1; overflow: auto; padding: 1.4rem; }
.conversation-empty { margin: auto; max-width: 380px; text-align: center; color: var(--text-muted); line-height: 1.6; }
.conversation-empty img { display: block; width: 90px; height: 90px; object-fit: contain; margin: 0 auto .3rem; }
.message { max-width: 82%; padding: .88rem 1rem; border: 1px solid var(--stroke); border-radius: var(--radius-panel); background: var(--glass-light); overflow-wrap: anywhere; white-space: pre-wrap; line-height: 1.52; }
.message.user { align-self: flex-end; background: var(--glass); border-color: var(--stroke-strong); }
.message.assistant { align-self: flex-start; }
.message small { display: block; color: var(--accent); font-size: .7rem; margin-bottom: .4rem; }
.conversation-mission { padding: .7rem 1.2rem; border-top: 1px solid var(--stroke); background: var(--glass-light); }
.conversation-footer { padding: .72rem 1.15rem; border-top: 1px solid var(--stroke); }
.voice-controls { display: inline-flex; align-items: center; flex-wrap: wrap; gap: .55rem; color: var(--text-muted); font-size: .75rem; }
.voice-controls .text-link { font-size: .75rem; }
#show-composer { float: right; }
.composer { clear: both; padding-top: .75rem; }
.composer textarea { display: block; width: 100%; min-height: 76px; max-height: 175px; resize: vertical; padding: .75rem; color: var(--text); background: var(--glass); border: 1px solid var(--stroke-strong); border-radius: var(--radius-control); outline: 0; }
.composer textarea:focus { border-color: var(--accent); }
.composer-actions { display: flex; align-items: center; justify-content: space-between; gap: .7rem; margin-top: .55rem; }
.demo-option { color: var(--text-muted); font-size: .75rem; }
.demo-option input { accent-color: var(--accent); }
.mission-inline { display: flex; align-items: center; justify-content: space-between; gap: .7rem; }
.mission-inline strong { font-size: .85rem; }
.mission-inline small { display: block; color: var(--text-muted); margin-top: .2rem; }

.side-drawer { position: fixed; z-index: 70; inset: 0 0 0 auto; width: min(420px, 100vw); padding: 1rem; background: var(--glass-strong); border-left: 1px solid var(--stroke-strong); box-shadow: var(--shadow); backdrop-filter: blur(22px); }
.drawer-header { display: flex; align-items: center; justify-content: space-between; gap: .8rem; padding: .4rem .2rem 1rem; border-bottom: 1px solid var(--stroke); }
.drawer-content { max-height: calc(100dvh - 120px); overflow: auto; padding-top: .7rem; }
.drawer-item { display: flex; gap: .8rem; padding: .85rem .4rem; border-bottom: 1px solid var(--stroke); }
.drawer-item .ui-icon { color: var(--accent-strong); }
.drawer-item strong { display: block; margin-bottom: .2rem; font-size: .88rem; }
.drawer-item p { margin: 0 0 .3rem; color: var(--text-muted); font-size: .8rem; }
.drawer-item small { color: var(--text-faint); }
.drawer-item.unread strong { color: var(--accent-strong); }
.drawer-empty { color: var(--text-muted); padding: 1.2rem .3rem; }
.search-dialog { width: min(640px, calc(100vw - 1.5rem)); max-height: 75dvh; margin: 10dvh auto auto; padding: 0; color: var(--text); background: var(--glass-strong); border: 1px solid var(--stroke-strong); border-radius: var(--radius-panel); box-shadow: var(--shadow); backdrop-filter: blur(22px); }
.search-dialog::backdrop { background: rgba(3, 9, 15, .72); backdrop-filter: blur(8px); }
.search-head { display: flex; align-items: center; gap: .65rem; padding: .6rem; border-bottom: 1px solid var(--stroke); }
.search-head > .ui-icon { margin-left: .55rem; color: var(--accent); }
.search-head input { flex: 1; min-width: 0; height: 42px; color: var(--text); background: none; border: 0; outline: 0; }
.search-results { max-height: 55dvh; overflow: auto; padding: .55rem; }
.search-results button { display: flex; align-items: center; gap: .75rem; width: 100%; padding: .75rem; color: var(--text); background: none; border: 1px solid transparent; border-radius: var(--radius-control); text-align: left; }
.search-results button:hover { border-color: var(--stroke); background: var(--glass-light); }
.search-results small { color: var(--text-muted); }
.toast { position: fixed; z-index: 100; left: 50%; bottom: 1.3rem; transform: translateX(-50%); max-width: min(480px, 92vw); padding: .7rem 1rem; color: var(--text); background: var(--glass-strong); border: 1px solid var(--stroke-strong); border-radius: var(--radius-control); box-shadow: var(--shadow); text-align: center; }

.login-screen { min-height: 100dvh; display: grid; place-items: center; padding: 1.2rem; }
.login-panel { width: min(100%, 440px); padding: clamp(1.5rem, 4vw, 2.6rem); background: var(--glass-strong); border: 1px solid var(--stroke-strong); border-radius: var(--radius-panel); box-shadow: var(--shadow); backdrop-filter: blur(22px); }
.login-panel .brand-lockup { margin-bottom: 2.3rem; }
.login-panel h1 { margin: .55rem 0; font: 500 clamp(2rem, 5vw, 2.8rem)/1.1 var(--font-display); }
.login-description { color: var(--text-muted); line-height: 1.55; }
.login-panel form { margin-top: 1.5rem; }
.login-panel label { display: block; margin: .85rem 0 .35rem; font-size: .83rem; font-weight: 650; }
.login-panel input { width: 100%; height: 44px; padding: 0 .8rem; color: var(--text); background: var(--glass); border: 1px solid var(--stroke); border-radius: var(--radius-control); }
.login-panel input:focus { border-color: var(--accent); }
.login-submit { width: 100%; margin-top: 1.5rem; }
.login-footnote { margin: 1.2rem 0 0; color: var(--text-faint); font-size: .73rem; text-align: center; }

.app-content h2 { margin: 0 0 .8rem; font: 500 1.22rem var(--font-display); }
.app-content p { color: var(--text-muted); line-height: 1.55; }
.app-content .section-label { display: block; margin: 1.1rem 0 .4rem; color: var(--accent); font-size: .69rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.item-list { display: grid; gap: .45rem; }
.list-item { display: flex; align-items: start; gap: .7rem; width: 100%; padding: .7rem .5rem; color: var(--text); background: var(--glass-light); border: 1px solid var(--stroke); border-radius: var(--radius-control); text-align: left; }
.list-item:hover { border-color: var(--stroke-strong); }
.list-item .ui-icon { color: var(--accent-strong); margin-top: .1rem; }
.list-item-main { min-width: 0; width: 0; flex: 1 1 0; }
.list-item strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .86rem; }
.list-item small { display: block; margin-top: .17rem; color: var(--text-muted); font-size: .73rem; }
.detail-card { margin-top: .85rem; padding: .85rem; border: 1px solid var(--stroke); border-radius: var(--radius-control); background: var(--glass-light); }
.detail-card pre { white-space: pre-wrap; overflow-wrap: anywhere; font: .75rem/1.5 ui-monospace, Consolas, monospace; }
.detail-card form, .detail-card label { display: block; }
.detail-card form label { margin: .6rem 0 .25rem; color: var(--text-muted); font-size: .76rem; }
.detail-card input, .detail-card textarea { width: 100%; padding: .5rem; color: var(--text); background: var(--glass); border: 1px solid var(--stroke-strong); border-radius: var(--radius-control); }
.detail-card dl { display: grid; grid-template-columns: 95px 1fr; gap: .5rem; font-size: .8rem; }
.detail-card dt { color: var(--text-muted); }
.detail-card dd { margin: 0; overflow-wrap: anywhere; }
.detail-actions { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: .8rem; }
.detail-actions .button { min-height: 36px; padding: .45rem .7rem; font-size: .78rem; }
.status-tag { display: inline-block; padding: .18rem .45rem; border: 1px solid var(--stroke-strong); border-radius: var(--radius-pill); color: var(--text-muted); font-size: .68rem; }
.status-tag.waiting_hitl { color: var(--accent-strong); }
.status-tag.completed { color: var(--success); }
.status-tag.failed, .status-tag.cancelled { color: var(--danger); }
.progress-list { margin: .8rem 0; padding-left: 1.3rem; color: var(--text-muted); font-size: .78rem; line-height: 1.6; }
.muted-copy { color: var(--text-muted); font-size: .85rem; }
.empty-state { padding: 1rem .2rem; color: var(--text-muted); font-size: .85rem; line-height: 1.55; }
.empty-state strong { display: block; color: var(--text); margin-bottom: .2rem; }
.setting-row { display: flex; align-items: center; justify-content: space-between; gap: .7rem; padding: .65rem 0; border-bottom: 1px solid var(--stroke); }
.setting-row small { display: block; color: var(--text-muted); margin-top: .2rem; }
.window-body .button { font-size: .78rem; }
.loading-bar { height: 2px; background: var(--accent); animation: loading 1.3s ease-in-out infinite alternate; }
.drawing-canvas { display: block; width: 100%; height: 290px; margin: .7rem 0; background: var(--glass-light); border: 1px solid var(--stroke); border-radius: var(--radius-control); touch-action: none; }
@keyframes loading { from { width: 20%; opacity: .3; } to { width: 85%; opacity: .85; } }
.mobile-navigation { display: none; }

@media (max-width: 950px) and (min-width: 761px) {
  .natural-composition { grid-template-columns: minmax(130px, 1fr) minmax(260px, 1.3fr) minmax(140px, 1fr); gap: .5rem; }
  .living-watson { width: clamp(240px, 34vw, 340px); }
  .natural-actions { width: 165px; }
  .glass-action { padding: .65rem; font-size: .82rem; }
}

@media (max-width: 760px) {
  :root { --header-height: 65px; }
  .os-header { min-height: var(--header-height); display: flex; justify-content: space-between; padding: .7rem 1rem; }
  .header-brand { font-size: 1.02rem; }
  .brand-seal { width: 30px; height: 30px; font-size: 1.2rem; }
  .header-center { display: none; }
  .header-tools { gap: .3rem; }
  .header-tools .icon-button { width: 35px; height: 35px; background: none; border: 0; }
  .natural-view { min-height: calc(100dvh - var(--header-height)); padding: .3rem .75rem calc(var(--mobile-nav-height) + env(safe-area-inset-bottom) + .55rem); }
  .natural-composition { min-height: 0; flex: 1; position: relative; display: block; width: 100%; }
  .natural-welcome { position: absolute; z-index: 3; top: 2%; left: 2%; max-width: 50%; padding: .65rem .75rem; background: var(--glass); border: 1px solid var(--stroke); border-radius: var(--radius-panel); backdrop-filter: blur(10px); }
  .natural-welcome .overline { display: none; }
  .natural-welcome p { margin: 0; font-size: clamp(.89rem, 3.6vw, 1.15rem); line-height: 1.35; }
  .presence-center { position: absolute; z-index: 1; left: 2%; top: 16%; width: 64%; }
  .living-watson { width: min(65vw, 340px); }
  .presence-caption { margin-top: -.4rem; }
  .presence-caption strong { font-size: 1.07rem; }
  .presence-caption span { font-size: .72rem; }
  .natural-actions { display: none; }
  .mobile-quick-actions { position: absolute; z-index: 4; top: 18%; right: 0; width: 32%; display: grid; gap: .42rem; }
  .mobile-quick-actions button { min-height: 43px; display: flex; align-items: center; gap: .35rem; padding: .32rem .45rem; background: var(--glass); border: 1px solid var(--stroke); border-radius: var(--radius-pill); color: var(--text); backdrop-filter: blur(12px); font-size: clamp(.66rem, 2.8vw, .78rem); text-align: left; }
  .mobile-quick-actions button .ui-icon { color: var(--accent-strong); font-size: 1.1rem; }
  .mobile-quick-actions button:hover { border-color: var(--stroke-strong); }
  .natural-activity { margin-top: .1rem; padding: .65rem .7rem .55rem; border-radius: var(--radius-panel); }
  .activity-heading h2 { font-size: 1rem; margin-bottom: .35rem; }
  .activity-heading .overline { display: none; }
  .activity-heading .text-link { font-size: .75rem; white-space: nowrap; }
  .activity-list { grid-template-columns: 1fr; gap: .3rem; }
  .activity-row { min-height: 43px; padding: .4rem .5rem; }
  .activity-row-main strong { font-size: .77rem; }
  .activity-row-main small { font-size: .68rem; }
  .activity-empty { padding: .3rem; font-size: .75rem; }
  .mobile-navigation { position: fixed; z-index: 40; bottom: 0; left: 0; right: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: .15rem; min-height: var(--mobile-nav-height); padding: .35rem .45rem calc(.35rem + env(safe-area-inset-bottom)); border-top: 1px solid var(--stroke-strong); background: var(--glass-strong); backdrop-filter: blur(18px); }
  .mobile-navigation button { position: relative; display: grid; justify-items: center; align-content: center; gap: .12rem; padding: .2rem; background: none; border: 1px solid transparent; border-radius: var(--radius-control); color: var(--text-muted); font-size: .68rem; }
  .mobile-navigation button .ui-icon { font-size: 1.4rem; }
  .mobile-navigation button.active { color: var(--accent-strong); background: var(--glass-light); border-color: var(--stroke); }
  .mobile-navigation .notification-dot { top: .5rem; right: 23%; }
  .desk-view { display: block; min-height: calc(100dvh - var(--header-height)); }
  .desk-rail, .desk-dock { display: none; }
  .desk-area { padding: .65rem .8rem calc(var(--mobile-nav-height) + 1rem); }
  .desk-heading h1 { font-size: 1.3rem; }
  .desk-heading .search-invite { display: none; }
  .desk-launcher { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; margin-top: 1.3rem; }
  .launcher-item { display: grid; justify-items: center; gap: .55rem; padding: 1rem .3rem; min-height: 98px; color: var(--text); background: var(--glass); border: 1px solid var(--stroke); border-radius: var(--radius-panel); backdrop-filter: blur(10px); font-size: .76rem; }
  .launcher-item .ui-icon { color: var(--accent-strong); font-size: 1.6rem; }
  .window-stage { position: static; height: auto; min-height: 0; }
  .app-window { display: none; position: fixed !important; z-index: 30 !important; top: var(--header-height) !important; bottom: calc(var(--mobile-nav-height) + env(safe-area-inset-bottom)) !important; left: 0 !important; width: 100vw !important; height: auto !important; min-width: 0; min-height: 0; resize: none; border-radius: 0; border-left: 0; border-right: 0; }
  .app-window.mobile-active { display: flex; }
  .window-titlebar { touch-action: auto; cursor: auto; }
  .watson-companion { right: .55rem; bottom: calc(var(--mobile-nav-height) + env(safe-area-inset-bottom) + .8rem); width: 68px; }
  .companion-caption { font-size: .55rem; }
  .conversation-surface { display: block; padding: 0; }
  .surface-shell { width: 100vw; height: 100dvh; border: 0; border-radius: 0; }
  .surface-header { padding: .65rem .8rem; }
  .surface-header h2 { font-size: 1.15rem; }
  .surface-controls .button { width: 37px; min-width: 37px; padding: 0; font-size: 0; }
  .surface-controls .button .ui-icon { font-size: 1rem; }
  .conversation-layout { display: flex; flex-direction: column; }
  .conversation-history { display: flex; align-items: center; gap: .35rem; flex: none; max-height: 48px; padding: .3rem .6rem; border-right: 0; border-bottom: 1px solid var(--stroke); overflow-x: auto; }
  .conversation-history h3 { display: none; }
  #conversation-list { display: flex; gap: .35rem; }
  .conversation-history button { width: auto; max-width: 150px; white-space: nowrap; padding: .35rem .55rem; }
  .conversation-messages { padding: .85rem; }
  .message { max-width: 93%; font-size: .88rem; }
  .conversation-footer { padding: .55rem .7rem calc(.65rem + env(safe-area-inset-bottom)); }
  .voice-controls { font-size: .7rem; }
  .demo-option { max-width: 55%; font-size: .69rem; }
  .side-drawer { padding-bottom: calc(var(--mobile-nav-height) + env(safe-area-inset-bottom)); }
  .search-dialog { margin-top: 5dvh; }
  .toast { bottom: calc(var(--mobile-nav-height) + env(safe-area-inset-bottom) + .65rem); }
  .login-panel { padding: 1.6rem; }
}

@media (max-width: 760px) and (max-height: 750px) {
  .natural-welcome { top: 0; }
  .presence-center { top: 12%; }
  .living-watson { width: min(50vw, 250px); }
  .mobile-quick-actions { top: 13%; }
}

@media (prefers-reduced-transparency: reduce) {
  .natural-activity, .glass-action, .mobile-quick-actions button, .app-window, .side-drawer, .surface-shell { backdrop-filter: none; background: var(--glass-strong); }
}
