.redesign { --accent-primary:#2e80ff; --accent-primary-hover:#4790ff; --radius-lg:16px; }
.redesign .btn-primary { color:white; }
.redesign .studio-main { max-width:1600px; padding-inline:clamp(16px,3vw,32px); }
.redesign .view-panel { min-width:0; }
.redesign .page-heading-actions { max-width:none; }
.redesign .page-heading>div { min-width:0; }
.redesign .studio-topbar .store-identity strong { overflow-wrap:anywhere; }
.redesign .library-toolbar { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:12px; margin:12px 0; }
.redesign .library-toolbar .search-field { min-width:0; width:100%; order:0; }
.redesign .library-toolbar>.btn { width:auto; order:0; }
.redesign .filter-tabs { grid-column:1/-1; order:1; width:100%; max-width:100%; min-width:0; overflow-x:auto; justify-content:flex-start; }
.redesign .filter-tabs button { flex:0 0 auto; white-space:nowrap; padding:10px 14px; font-size:14px; }
.library-filter-details { border:1px solid #2c3647; border-radius:10px; margin:12px 0; background:#121923; }
.library-filter-details>summary { padding:12px 16px; color:#bccbe2; font-size:14px; cursor:pointer; }
.redesign .library-filter-details .category-toolbar { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:start; gap:12px; padding:0 16px 16px; margin:0; }
.redesign .library-filter-details .category-toolbar label { min-width:0; width:100%; }
.redesign .library-filter-details .category-toolbar p { grid-column:1/-1; margin:0; max-width:none; }
.redesign .library-info { display:flex; justify-content:space-between; align-items:start; flex-wrap:wrap; gap:6px 16px; margin:16px 0; font-size:13px; line-height:1.5; }
.redesign .page-heading { margin-bottom:20px; }
.redesign .page-heading h1 { font-size:28px; line-height:1.25; }
.redesign .page-heading .eyebrow,.redesign .nav-caption,.redesign .sidebar-note,.redesign .sidebar-bottom { display:none; }
.redesign .page-heading p { font-size:16px; }
.redesign[data-current-view="overview"] .page-heading { display:none; }
.redesign .studio-topbar { margin-bottom:20px; }
.redesign .store-identity strong { font-size:23px; }
.redesign .home-operation { display:grid; gap:12px; }
.home-tv-card { width:100%; display:flex; align-items:center; gap:16px; padding:16px; background:#181e28; border:1px solid #2a313e; border-radius:14px; text-align:left; color:#f3f5f9; }
.home-tv-card>span:nth-child(2) { display:grid; gap:4px; flex:1; min-width:0; }
.home-tv-card strong { font-size:18px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.home-tv-card small { font-size:14px; color:#aab5c6; }
.home-tv-card #homeTvState { font-size:15px; }
.home-tv-card[data-state="connected"] #homeTvState { color:#5ad9a0; }
.home-tv-card[data-state="error"] #homeTvState { color:#ff9a9a; }
.home-tv-icon { width:54px; height:54px; flex:none; background:#233249; border-radius:12px; color:#79adff; }
.home-tv-icon svg { width:32px; height:32px; }
.redesign .home-publish { width:100%; min-height:56px; font-size:18px; }
.home-next-step { padding:12px 16px; background:#172234; border-radius:12px; font-size:15px; }
.home-next-step p { margin:0; color:#c1cee2; }
.redesign .studio-start { display:none; }
.redesign #overviewPanel { display:flex; flex-direction:column; gap:20px; }
.redesign #overviewPanel[hidden] { display:none; }
.redesign #overviewPanel>.section-title-row { order:2; margin:0; }
.redesign #overviewQueue { order:3; display:grid; gap:8px; grid-template-columns:1fr; }
.redesign #overviewPanel>.overview-grid { order:4; display:block; }
.redesign .overview-side { display:none; }
.redesign .live-preview-box { border-radius:14px; padding:16px; }
.redesign .preview-title { font-size:17px; }
.redesign .live-preview-box #playbackStatus { display:none; }
.redesign .preview-caption { align-items:center; flex-wrap:wrap; gap:8px; }
.redesign .preview-caption .eyebrow { letter-spacing:0; font-size:13px; }
.redesign #homeMore { order:5; }
.redesign #overviewPanel>.home-operation { order:1; }
.redesign #overviewPanel h2 { font-size:19px; }
.home-more { border:1px solid #2a313e; background:#171d27; border-radius:12px; padding:0 14px; }
.home-more summary { display:flex; align-items:center; gap:10px; padding:14px 0; cursor:pointer; min-height:48px; font-size:16px; }
.home-more summary::after { content:'⌄'; margin-left:auto; }
.home-more-actions { display:grid; grid-template-columns:1fr 1fr; gap:8px; padding-bottom:12px; }
.secondary-nav-item { display:flex; gap:8px; align-items:center; background:none; border:0; padding:10px; text-align:left; color:#c9d5ef; min-height:44px; }
.secondary-nav-item .nav-label-short { display:none; }
.home-content-row { display:flex; align-items:center; gap:12px; background:#181e28; padding:8px; border:1px solid #2a313e; border-radius:12px; min-width:0; }
.home-content-row .media-art { width:80px; height:54px; flex:none; border-radius:7px; overflow:hidden; }
.home-content-row .media-art img,.home-content-row .media-art video { width:100%; height:100%; object-fit:cover; }
.home-content-row .media-art .campaign-thumb { width:100%; height:100%; }
.home-content-info { flex:1; min-width:0; display:grid; gap:4px; }
.home-content-info strong { font-size:15px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.home-content-info small { color:#b5bed0; font-size:13px; }
.home-content-row .switch { flex:none; width:44px; min-height:44px; display:flex; align-items:center; }
.home-content-row .switch input { min-width:44px; min-height:44px; cursor:pointer; }
.home-content-row .switch .slider { top:9px; bottom:9px; }
.home-content-row .switch:focus-within { outline:2px solid #9cb1ff; outline-offset:3px; }
.home-content-row .switch input:checked+.slider { background:#2e80ff; }
.redesign #homeChangeFeedback { order:3; }
.redesign .banner-list { display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr)); gap:16px; align-items:start; }
.redesign .banner-item { display:flex; flex-direction:column; align-items:stretch; padding:0; gap:0; border-radius:14px; min-height:0; height:auto; }
.redesign .banner-item:hover { transform:none; }
.redesign .banner-item.inactive { opacity:1; }
.media-card-heading { display:flex; align-items:center; gap:12px; padding:12px 16px; }
.media-card-heading>div { min-width:0; flex:1; }
.redesign .media-card-heading .banner-name { color:#f2f5fb; font-size:16px; line-height:1.35; margin:4px 0 0; white-space:normal; overflow-wrap:anywhere; }
.media-position { color:#b5c1d4; font-size:12px; line-height:1.4; }
.media-select-control { display:grid; place-items:center; width:44px; height:44px; flex:none; border:1px solid #354052; border-radius:10px; cursor:pointer; }
.media-select-control input { width:20px; height:20px; accent-color:#438fff; cursor:pointer; }
.media-select-control:focus-within { outline:2px solid #abcaff; outline-offset:3px; }
.redesign .banner-item.selected .media-select-control { background:#233957; border-color:#7baeff; }
.media-preview-button { display:block; position:relative; width:100%; margin:0; padding:0; border:0; background:#080d15; cursor:pointer; flex:none; color:inherit; }
.media-preview-button:focus-visible { outline:3px solid #8db8ff; outline-offset:-3px; }
.redesign .media-preview-button>.media-art { display:block; width:100%; height:auto; aspect-ratio:16/9; margin:0; border-radius:0; overflow:hidden; }
.media-preview-button .media-art>img,.media-preview-button .media-art>video { display:block; width:100%; height:100%; object-fit:contain; }
.media-preview-button .campaign-thumb { width:100%; height:100%; }
.media-preview-button .notice-art strong { font-size:24px; }
.media-preview-button .notice-art p { font-size:16px; }
.media-card-info { padding:12px 16px 8px; min-width:0; }
.redesign .media-card-info .banner-meta { display:flex; flex-wrap:wrap; align-items:start; gap:4px 12px; margin:0; font-size:13px; line-height:1.5; }
.media-card-info .banner-meta>span { min-width:0; overflow-wrap:anywhere; }
.media-card-info .media-state { display:block; margin:6px 0 0; font-size:13px; line-height:1.5; }
.redesign .media-card-actions { display:grid; grid-template-columns:minmax(72px,1fr) 44px 44px 64px; align-items:center; gap:8px; padding:8px 16px 12px; }
.media-card-actions>.btn { justify-content:center; min-width:0; font-size:14px; padding:10px; }
.media-card-actions .btn-icon { width:44px; height:44px; }
.media-active-toggle { position:relative; display:block; flex:none; width:44px; height:44px; margin:0; }
.media-active-toggle input { width:44px; height:44px; cursor:pointer; }
.media-active-toggle .slider { top:10px; bottom:10px; }
.media-active-toggle .slider:before { width:18px; height:18px; bottom:3px; left:3px; }
.media-active-toggle input:checked+.slider { background:#2e80ff; }
.media-active-toggle input:checked+.slider:before { transform:translateX(20px); }
.media-active-toggle:focus-within { outline:2px solid #abcaff; outline-offset:3px; border-radius:6px; }
.media-more-btn { display:flex; align-items:center; justify-content:center; gap:4px; min-width:0; min-height:44px; padding:8px 4px; color:#c4d6f5; border:1px solid #354052; border-radius:10px; background:#1b2330; font-size:13px; }
.media-more-btn .icon { width:16px; height:16px; }
.media-more-btn[aria-expanded="true"] .icon { transform:rotate(180deg); }
.media-extra-actions { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:8px; margin:0; padding:12px 16px; border-top:1px solid #303b4e; background:#111925; }
.media-extra-actions .btn { min-width:0; justify-content:center; font-size:14px; padding:10px 8px; white-space:normal; }
.media-extra-actions>.push-btn { grid-column:1/-1; }
.media-order-controls { grid-column:1/-1; display:flex; align-items:center; justify-content:space-between; gap:8px; color:#aebdd4; font-size:13px; }
.media-order-controls>div { display:flex; gap:8px; }
.publish-type-list { display:grid; gap:14px; }
.publish-type-card { display:flex; align-items:center; gap:16px; padding:20px 16px; background:#191f29; border:1px solid #303847; border-radius:14px; text-align:left; color:#f3f5f9; width:100%; }
.publish-type-card>span:nth-child(2) { display:grid; gap:6px; flex:1; min-width:0; }
.publish-type-card strong { font-size:18px; }
.publish-type-card small { font-size:15px; color:#b2bdd0; }
.type-icon { color:#bba2ff; background:#352653; padding:16px; border-radius:12px; }
.publish-type-card:nth-child(2) .type-icon { color:#ffca66; background:#493b23; }
.publish-type-card:nth-child(3) .type-icon { color:#6fdfae; background:#203e33; }
.publish-step-label { font-size:14px; color:#9fc1ff; margin:0 0 16px; }
.redesign .media-editor-nav { display:none; }
.redesign .media-editor-intro { display:none; }
.redesign #addBannerModal .media-editor-layout { grid-template-columns: minmax(0,.95fr) minmax(0,1.05fr); }
.redesign .media-editor-preview-panel { position:static; }
.redesign .media-editor-step { margin:0; }
.redesign #addBannerModal[data-step="prepare"] #mediaStepDelivery,
.redesign #addBannerModal[data-step="delivery"] #mediaStepContent,
.redesign #addBannerModal[data-step="delivery"] #mediaStepOffer,
.redesign #addBannerModal[data-step="review"] #mediaStepContent,
.redesign #addBannerModal[data-step="review"] #mediaStepOffer,
.redesign #addBannerModal[data-step="review"] #mediaStepDelivery { display:none; }
.redesign #addBannerModal[data-kind="notice"] #mediaStepContent,
.redesign #addBannerModal[data-kind="notice"] #mediaStepOffer { display:none; }
.redesign #addBannerModal:not([data-step="prepare"]) #noticeEditor { display:none; }
.redesign #mediaStepDelivery>.media-step-heading { display:none; }
.redesign #publishDelivery { margin-bottom:24px; }
.publish-timing { display:flex; padding:5px; border:1px solid #303847; background:#101722; border-radius:12px; margin:12px 0; }
.publish-timing button { flex:1; min-height:48px; border:0; border-radius:8px; background:none; color:#c2cde0; font-size:16px; }
.publish-timing button[aria-pressed="true"] { background:#2e80ff; color:white; }
.publish-days,.publish-destinations { border:0; padding:0; margin:20px 0; }
.publish-days { display:flex; flex-wrap:wrap; gap:8px; }
.publish-days legend,.publish-destinations legend { margin-bottom:12px; font-size:16px; font-weight:600; }
.publish-days label { display:flex; align-items:center; gap:6px; padding:8px; min-height:44px; background:#1c2534; border-radius:8px; }
.tv-choice-toolbar { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:4px 12px; margin-bottom:12px; }
.tv-choice-toolbar>div { display:flex; flex-wrap:wrap; gap:4px; }
.tv-choice-toolbar .text-button { font-size:14px; padding:8px; }
.tv-choice-count { color:#b7c5db; font-size:14px; }
.tv-choice-grid { display:grid; grid-template-columns:minmax(0,1fr); gap:10px; }
.tv-destination-choice { display:flex; align-items:center; gap:12px; padding:16px; min-height:88px; margin:0; background:#171e29; border:1px solid #354052; border-radius:12px; cursor:pointer; transition:background .15s,border-color .15s; }
.tv-destination-choice:hover { border-color:#7699c8; }
.tv-destination-choice.is-selected { background:#182c49; border-color:#609dff; box-shadow:inset 0 0 0 1px #609dff; }
.tv-destination-choice:focus-within { outline:2px solid #abcaff; outline-offset:3px; }
.tv-choice-icon { display:grid; place-items:center; width:44px; height:44px; flex:none; border-radius:10px; background:#24334a; color:#88b9ff; }
.tv-choice-icon .icon { width:26px; height:26px; }
.tv-choice-copy { display:grid; gap:5px; flex:1; min-width:0; }
.tv-choice-copy strong { color:#f4f7ff; font-size:16px; line-height:1.35; overflow-wrap:anywhere; }
.tv-choice-location { font-size:14px; color:#b7c5db; overflow-wrap:anywhere; }
.tv-choice-status { display:flex; align-items:center; gap:6px; font-size:13px; line-height:1.4; color:#c4b995; }
.tv-choice-status>span { width:7px; height:7px; flex:none; border-radius:50%; background:currentColor; }
.tv-destination-choice[data-state="connected"] .tv-choice-status { color:#79dfb1; }
.tv-destination-choice[data-state="error"] .tv-choice-status { color:#ffa7a7; }
.tv-destination-choice input[type="checkbox"] { appearance:auto; -webkit-appearance:checkbox; width:22px; height:22px; min-width:22px; margin:0; flex:none; accent-color:#438fff; cursor:pointer; }
.tv-choice-empty { padding:16px; color:#b7c5db; background:#171e29; border:1px dashed #354052; border-radius:12px; line-height:1.5; }
#publishScheduleFields label { display:block; font-size:15px; }
#publishScheduleFields .form-input { margin-top:8px; }
#publishReviewSummary { display:grid; gap:14px; margin-top:18px; }
#publishReviewSummary div { display:grid; gap:4px; border-bottom:1px solid #303847; padding-bottom:12px; }
#publishReviewSummary dt { color:#a7b5cc; font-size:14px; }
#publishReviewSummary dd { margin:0; font-size:16px; overflow-wrap:anywhere; }
.notice-art { width:100%; height:100%; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:6%; color:white; background:#143d74; overflow:hidden; }
.notice-art[data-theme="green"] { background:#145541; }
.notice-art[data-theme="amber"] { background:#5b3f09; }
.notice-art strong { font-size:4vw; font-size:clamp(18px,4vw,60px); line-height:1.15; overflow-wrap:anywhere; }
.notice-art p { font-size:2.5vw; font-size:clamp(15px,2.5vw,38px); line-height:1.4; margin:4% 0 0; white-space:pre-wrap; overflow-wrap:anywhere; }
.home-content-row .notice-art { padding:4px; }
.home-content-row .notice-art strong { font-size:10px; }
.home-content-row .notice-art p { font-size:7px; }
.redesign .modal-overlay .modal-content { transform:none; transition:none; }
.redesign .studio-sidebar nav { display:grid; grid-template-columns:1fr; gap:8px; }
.redesign .studio-sidebar .nav-item { width:100%; }
.redesign #storeSettingsHost .business-profile { display:flex; flex-wrap:wrap; gap:16px; }
.redesign .home-feedback { display:flex; align-items:center; flex-wrap:wrap; gap:10px; padding:8px 12px; font-size:14px; background:#192a40; border-radius:10px; }
@media(min-width:1100px) { .redesign #overviewPanel { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:start; } .redesign #overviewPanel>.home-operation { grid-column:1; grid-row:1; } .redesign #overviewPanel>.section-title-row { grid-column:1; grid-row:2; } .redesign #overviewQueue { grid-column:1; grid-row:3; } .redesign #overviewPanel>.overview-grid { grid-column:2; grid-row:1/5; } .redesign #homeMore { grid-column:1; grid-row:4; } }
@media(max-width:900px) { .redesign .studio-sidebar nav { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); } .redesign .studio-main { padding-bottom:calc(100px + env(safe-area-inset-bottom)); } }
@media(max-width:900px) {
  .redesign #addBannerModal .media-editor-layout { display:flex; flex-direction:column; }
  .redesign #addBannerModal[data-step="prepare"] .media-editor-fields { order:-1; }
  .redesign #addBannerModal .media-editor-preview-panel { width:100%; }
}
@media(max-width:680px) {
  .redesign .studio-topbar { gap:8px; }
  .redesign .connection-indicator { display:none; }
  .redesign .store-identity strong { font-size:21px; }
  .redesign .logout-control { font-size:12px; padding:8px; }
  .redesign .page-heading-actions { width:100%; }
  .redesign .page-heading-actions .btn-primary { flex:1; }
  .redesign .home-content-row { gap:8px; }
  .home-content-row .media-art { width:64px; height:46px; }
  .home-content-row .home-content-info strong { font-size:14px; }
  .redesign .preview-header { flex-wrap:wrap; gap:8px; }
  .redesign #addBannerModal .modal-footer { gap:8px; flex-wrap:wrap; }
  .redesign #saveBannerBtn { flex:1; min-width:0; }
  .redesign .library-toolbar { grid-template-columns:minmax(0,1fr); }
  .redesign .library-toolbar>.btn { width:100%; order:2; }
  .redesign .library-filter-details .category-toolbar { grid-template-columns:minmax(0,1fr); }
  .redesign .banner-list { gap:16px; }
}
@media(max-width:360px) {
  .redesign .media-card-actions { grid-template-columns:minmax(64px,1fr) 44px 44px 44px; gap:6px; padding-inline:12px; }
  .media-more-btn>span { display:none; }
  .media-card-heading,.media-card-info,.media-extra-actions { padding-inline:12px; }
  .home-content-row .media-art { width:48px; height:36px; }
  .redesign .home-content-row { gap:4px; }
  .redesign .home-content-row .home-content-info strong { font-size:13px; }
  .redesign .home-content-row .btn-icon { width:44px; flex:none; }
  .redesign .home-tv-card { gap:10px; padding:12px; }
  .redesign .home-tv-icon { width:44px; height:44px; }
}
@media(max-height:500px) and (max-width:900px) {
  .redesign .studio-sidebar .nav-item { min-height:48px; flex-direction:row; gap:8px; padding:8px 4px; }
  .redesign .studio-main { padding-bottom:calc(80px + env(safe-area-inset-bottom)); }
}
