/* Loaded only for the selected mobile mode; automatic mode has a media gate. */
body[data-interface] { background:#f3f5fa; color:#172338; }
body[data-interface] .app-shell { display:block; min-height:100dvh; }
body[data-interface] .sidebar { position:relative; inset:auto; width:100%; height:auto; padding:18px 20px 10px; background:#fff; border:0; border-bottom:1px solid #e5e9f1; box-shadow:none; }
body[data-interface] .brand { margin:0; padding:0; color:#172338; }
body[data-interface] .brand strong { color:#172338; }
body[data-interface] .brand small { display:block; color:#607089; }
body[data-interface] .sidebar .menu a { color:#526078; background:#f4f5fa; }
body[data-interface] .sidebar .menu a.active { color:#5146cf; background:#eeecff; border-left:0; }
body[data-interface] .brand-mark { border-radius:13px; }
body[data-interface] .brand small { font-size:11px; }
body[data-interface] .sidebar .menu { display:flex; overflow:auto; gap:8px; margin:18px 0 0; padding:0 0 4px; scrollbar-width:thin; }
body[data-interface] .sidebar .menu a { flex:0 0 auto; padding:11px 16px; min-height:44px; border-radius:12px; white-space:nowrap; font-size:13px; }
body[data-interface] .sidebar-user { margin:12px 0 0; padding:10px 0 0; border-top:1px solid #edf0f5; }
body[data-interface] .sidebar-user .avatar { width:30px; height:30px; }
body[data-interface] .sidebar-user small { font-size:11px; }
body[data-interface] .content { margin:0 auto; width:100%; max-width:640px; min-width:0; padding:24px 16px calc(100px + env(safe-area-inset-bottom)); }
body[data-interface] h1 { font-size:26px; line-height:1.2; letter-spacing:-.7px; overflow-wrap:anywhere; }
body[data-interface] h2 { font-size:18px; }
body[data-interface] .page-header, body[data-interface] .tv-compact-header { display:flex; flex-wrap:wrap; gap:18px; align-items:flex-start; margin-bottom:22px; }
body[data-interface] .header-actions { display:flex; flex-wrap:wrap; gap:8px; width:100%; }
body[data-interface].tv-mobile-page .tv-compact-actions a.button { display:inline-flex !important; flex:1; justify-content:center; font-size:13px; }
body[data-interface].tv-mobile-page .tv-compact-actions .tv-desktop-only { display:none !important; }
body[data-interface] .button, body[data-interface] .mini-action, body[data-interface] .icon-action { min-height:44px; min-width:44px; border-radius:12px; font-size:13px; touch-action:manipulation; }
body[data-interface] .button.primary { background:#5146cf; border-color:#5146cf; color:#fff; }
body[data-interface] .button:focus-visible, body[data-interface] input:focus-visible, body[data-interface] select:focus-visible { outline:3px solid #aea6ff; outline-offset:2px; }
body[data-interface] .panel { border:1px solid #e5e9f1; border-radius:20px; box-shadow:0 4px 20px #18233c05; padding:18px; margin-bottom:18px; }
body[data-interface] input:not([type=checkbox]):not([type=hidden]):not([type=range]), body[data-interface] select, body[data-interface] textarea { min-height:46px; font-size:16px; border-radius:12px; max-width:100%; }
body[data-interface] input[type=checkbox] { width:20px; height:20px; accent-color:#5146cf; }
body[data-interface] input[type=file] { width:100%; min-width:0; }
body[data-interface] input[type=file]::file-selector-button { padding:12px; border:0; border-radius:10px; color:#5146cf; background:#eeecff; margin-right:10px; }
body[data-interface] .form-grid, body[data-interface] .two-columns, body[data-interface] .detail-layout, body[data-interface] .tv-media-actions-grid, body[data-interface] .tv-audio-layout, body[data-interface] .tv-audio-layout-refined, body[data-interface] .services-grid { display:grid; grid-template-columns:minmax(0,1fr); gap:16px; }
body[data-interface] .detail-main, body[data-interface] .detail-sidebar, body[data-interface] .tv-media-column, body[data-interface] .tv-audio-layout>main, body[data-interface] .tv-audio-layout>aside { width:100%; min-width:0; }
body[data-interface] .tv-settings-column { order:1; min-width:0; }
body[data-interface] .tv-media-column { order:0; }
body[data-interface] .field { min-width:0; }
body[data-interface] .tv-summary-strip { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; padding:0; margin:0 0 20px; border:0; background:none; }
body[data-interface] .tv-summary-strip article { min-width:0; border:1px solid #e5e9f1; background:#fff; border-radius:14px; padding:12px; }
body[data-interface] .tv-summary-strip article:last-child { grid-column:1/-1; }
body[data-interface] .tv-desktop-helper, body[data-interface] .tv-desktop-only, body[data-interface] .tv-desktop-save { display:none; }
body[data-interface] .tv-tool-tabs { width:100%; display:flex; gap:8px; }
body[data-interface] .tv-tool-tab { flex:1; min-height:44px; border-radius:12px; }
body[data-interface] .tv-compact-upload-form { display:flex; flex-direction:column; align-items:stretch; gap:16px; }
body[data-interface] .tv-compact-upload-form .field { width:100%; }
body[data-interface] .tv-compact-upload-form [data-upload-submit] { width:100%; background:#5146cf; color:white; }
body[data-interface] .tv-media-panel-compact { padding:16px; }
body[data-interface] .tv-media-row-card { display:grid; grid-template-columns:minmax(0,1fr); gap:14px; padding:14px; border:1px solid #e5e9f1; border-radius:16px; background:#fff; margin-bottom:14px; }
body[data-interface] .tv-media-row-thumb { width:100%; height:190px; border-radius:12px; background:#eef1f7; overflow:hidden; }
body[data-interface] .tv-media-row-thumb img, body[data-interface] .tv-media-row-thumb video { width:100%; height:100%; object-fit:contain; }
body[data-interface] .tv-media-row-content { min-width:0; }
body[data-interface] .tv-media-row-title strong { white-space:normal; overflow-wrap:anywhere; font-size:15px; }
body[data-interface] .tv-media-inline-edit { display:flex; flex-wrap:wrap; gap:10px; align-items:end; }
body[data-interface] .tv-media-inline-edit .field { flex:1; }
body[data-interface] .tv-media-row-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px; margin-top:12px; }
body[data-interface] .tv-mobile-sticky-actions { display:flex; position:fixed; bottom:0; left:0; right:0; z-index:30; justify-content:center; gap:10px; padding:12px 16px calc(12px + env(safe-area-inset-bottom)); background:#ffffffef; border-top:1px solid #e5e9f1; backdrop-filter:blur(12px); }
body[data-interface] .tv-mobile-sticky-actions .button { flex:1; max-width:290px; }
body[data-interface] .tv-quick-create-panel, body[data-interface] .tv-quick-create-form, body[data-interface] .tv-inline-link-form { display:flex; flex-direction:column; align-items:stretch; gap:14px; }
body[data-interface] .tv-campaign-list-item { display:grid; grid-template-columns:36px minmax(0,1fr); padding:16px; gap:12px; border-radius:16px; }
body[data-interface] .tv-campaign-list-actions { grid-column:1/-1; display:flex; justify-content:flex-end; flex-wrap:wrap; gap:8px; }
body[data-interface] .tv-campaign-list-title { display:flex; flex-wrap:wrap; gap:8px; }
body[data-interface] .tv-campaign-list-title strong { font-size:16px; white-space:normal; overflow-wrap:anywhere; }
body[data-interface] .tv-screen-card, body[data-interface] .tv-screen-item { display:flex; flex-direction:column; align-items:stretch; gap:14px; padding:16px; }
body[data-interface] .tv-screen-meta, body[data-interface] .tv-screen-actions { display:flex; flex-wrap:wrap; gap:8px; }
body[data-interface] .days-grid { display:flex; flex-wrap:wrap; gap:8px; }
body[data-interface] .days-grid label { min-width:42px; min-height:44px; }
body[data-interface] .tv-audio-track { display:flex; flex-wrap:wrap; gap:12px; }
body[data-interface] .tv-audio-track-info { min-width:0; flex:1; }
body[data-interface] .tv-audio-track-info strong { white-space:normal; overflow-wrap:anywhere; }
body[data-interface] .tv-audio-track audio { width:100%; max-width:100%; }
body[data-interface] .tv-audio-track-actions { display:flex; margin-left:auto; gap:8px; }
body[data-interface] .tv-audio-dropzone-clean { min-height:120px; }
body[data-interface] .tv-audio-settings-panel { padding:18px; }
body[data-interface] .tv-audio-target-row { min-height:64px; }
body[data-interface] .switch-row { margin-top:12px; }
body[data-interface] .switch-row input, body[data-interface] .tv-mini-switch input { width:20px; height:20px; }
body[data-interface] .table-wrap { overflow-x:auto; }
body[data-interface] .client-company-card { padding:18px; border-radius:20px; }

/* Keep long company names within narrow phone screens. */
body[data-interface] .tv-compact-title { min-width:0; width:100%; }
body[data-interface] .tv-compact-title > div { min-width:0; }
body[data-interface] .tv-compact-title h1, body[data-interface] .eyebrow { white-space:normal; overflow-wrap:anywhere; }
body[data-interface] .tv-small-avatar { flex-shrink:0; }
body[data-interface] .sidebar-user { display:flex; color:#26334b; padding:8px 16px; gap:10px; }
body[data-interface] .sidebar-user .logout { color:#26334b; min-width:44px; min-height:44px; }
