/* Vigicast */ @font-face { font-family: Inter; src: url("fonts/InterVariable-4.1.woff2") format("woff2"); font-style: normal; font-weight: 100 900; font-display: swap; } :root { --ink: #102a2c; --ink-soft: #496062; --night: #10282a; --night-2: #173638; --paper: #f5f4ef; --card: #fffefa; --line: #dfe4df; --line-dark: rgba(255,255,255,.12); --coral: #f1765f; --coral-dark: #d95f49; --mint: #79d4b0; --blue: #77a8e8; --export-blue: #24558f; --violet: #a98bd6; --amber: #e5a94c; --danger: #c9574a; --shadow: 0 18px 54px rgba(18, 42, 44, .1); --radius: 22px; --radius-sm: 14px; --text-micro: 12px; --text-label: 12px; --text-small: 13px; --text-secondary: 14px; --text-body: 14px; --font-work-title: Georgia, "Times New Roman", serif; --text-work-title: 22px; font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color: var(--ink); background: var(--paper); } * { box-sizing: border-box; } html { min-height: 100%; scroll-behavior: smooth; } body { min-width: 320px; min-height: 100vh; margin: 0; background: var(--paper); color: var(--ink); } button, input, select { font: inherit; } button { color: inherit; } button:focus-visible, input:focus-visible, select:focus-visible { outline: 3px solid rgba(241,118,95,.32); outline-offset: 2px; } [hidden] { display: none !important; } .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; } .ambient { position: fixed; z-index: -1; border-radius: 999px; filter: blur(2px); pointer-events: none; } .ambient-one { width: 520px; height: 520px; top: -240px; right: -150px; background: radial-gradient(circle, rgba(241,118,95,.17), rgba(241,118,95,0) 70%); } .ambient-two { width: 440px; height: 440px; bottom: -240px; left: -180px; background: radial-gradient(circle, rgba(121,212,176,.18), rgba(121,212,176,0) 70%); } .brand { display: inline-flex; align-items: center; gap: 11px; color: var(--ink); text-decoration: none; font-size: 22px; font-weight: 800; letter-spacing: -.7px; } .brand-signature { display: block; flex: 0 0 auto; width: 166px; max-width: 100%; height: auto; object-fit: contain; } .brand-inverse { color: #f8f7f1; } .picker-shell { width: min(1180px, calc(100% - 40px)); margin: 0 auto; padding: 32px 0 48px; } .picker-header { display: flex; align-items: center; justify-content: space-between; } .picker-header-actions { display: flex; align-items: center; gap: 10px; } .picker-header-actions .button { display: inline-flex; min-height: 40px; align-items: center; justify-content: center; gap: 7px; padding: 0 16px; text-decoration: none; } .picker-account-summary { display: flex; align-items: center; gap: 9px; padding: 4px; border-radius: 12px; color: var(--ink); text-decoration: none; transition: background .16s ease; } .picker-account-summary:hover { background: rgba(16,40,42,.055); } .picker-account-summary > i { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 11px; background: var(--night); color: #fff; font-size: 12px; font-style: normal; font-weight: 850; } .picker-account-summary > span { display: grid; gap: 1px; } .picker-account-summary small { color: var(--ink-soft); font-size: var(--text-label); font-weight: 750; } .picker-account-summary strong { max-width: 170px; overflow: hidden; font-size: var(--text-secondary); text-overflow: ellipsis; white-space: nowrap; } .logout-form { margin: 0; } .logout-form button { display: grid; place-items: center; width: 36px; height: 36px; padding: 0; border: 1px solid var(--line); border-radius: 10px; background: var(--card); color: var(--ink-soft); cursor: pointer; } .logout-form .lucide { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; } .logout-form button:hover { border-color: #bcc9c3; color: var(--ink); } .picker-hero { max-width: 850px; margin: 82px auto 42px; text-align: center; } .eyebrow { display: none; } .eyebrow span { width: 24px; height: 1px; background: currentColor; } .picker-hero h1 { margin: 0; font-family: Georgia, "Times New Roman", serif; font-size: clamp(44px, 6.2vw, 78px); font-weight: 500; line-height: .99; letter-spacing: -3.6px; } .picker-hero h1 em { color: var(--coral); font-weight: 500; } .picker-hero > p { max-width: 680px; margin: 28px auto 0; color: var(--ink-soft); font-size: 18px; line-height: 1.6; } .company-search { max-width: 760px; margin: 0 auto 24px; } .company-search-heading { margin-bottom: 13px; text-align: center; } .company-search-heading h2 { margin: 0; font-size: 14px; } .company-search-heading p { margin: 5px 0 0; color: var(--ink-soft); font-size: 11px; } .company-combobox { position: relative; } .company-search-control { position: relative; display: flex; align-items: center; } .company-search-control input { width: 100%; height: 58px; padding: 0 56px 0 50px; border: 1px solid #cad4cf; border-radius: 17px; background: var(--card); color: var(--ink); box-shadow: 0 12px 38px rgba(18,42,44,.08); font-size: 15px; transition: border-color .18s ease, box-shadow .18s ease; } .company-search-control input::placeholder { color: #829092; } .company-search-control input:focus { border-color: var(--coral); box-shadow: 0 14px 42px rgba(18,42,44,.11), 0 0 0 4px rgba(241,118,95,.09); outline: 0; } .company-search-icon { position: absolute; z-index: 1; left: 18px; color: var(--coral-dark); font-size: 24px; pointer-events: none; } .company-search-loader { position: absolute; right: 20px; width: 18px; height: 18px; border: 2px solid #d4dcd8; border-top-color: var(--coral); border-radius: 50%; animation: search-spin .7s linear infinite; } @keyframes search-spin { to { transform: rotate(360deg); } } .company-suggestions { position: absolute; z-index: 12; top: calc(100% + 8px); left: 0; right: 0; max-height: 390px; padding: 7px; border: 1px solid var(--line); border-radius: 17px; background: var(--card); box-shadow: 0 24px 70px rgba(18,42,44,.18); overflow: auto; } .company-suggestion { display: grid; grid-template-columns: auto minmax(0,1fr) auto; gap: 13px; align-items: center; width: 100%; padding: 11px 12px; border: 0; border-radius: 12px; background: transparent; text-align: left; cursor: pointer; } .company-suggestion:hover, .company-suggestion.is-active { background: #f5f3ed; } .company-suggestion .company-monogram { position: relative; width: 42px; height: 42px; border-radius: 12px; font-size: 11px; } .company-suggestion .company-entity-icon { position: absolute; right: -5px; bottom: -5px; display: grid; place-items: center; width: 20px; height: 20px; border: 2px solid var(--card); border-radius: 7px; background: var(--night); color: #fffefa; box-shadow: 0 2px 7px rgba(16,42,44,.18); } .company-suggestion .company-entity-icon .lucide { width: 11px; height: 11px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; } .company-suggestion .company-entity-person { background: #315f91; } .company-suggestion .company-entity-organization { background: var(--night); } .company-suggestion .company-entity-media { background: #7656a4; } .company-suggestion .company-entity-institution { background: #9b6a22; } .company-suggestion .company-entity-unknown { background: #6d7b7c; } .company-suggestion-copy { min-width: 0; } .company-suggestion-copy strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; } .company-suggestion-copy span { display: block; margin-top: 4px; color: var(--ink-soft); font-size: 9px; } .company-suggestion-arrow { color: var(--coral-dark); font-size: 17px; } .company-suggestion-empty { padding: 21px 16px; color: var(--ink-soft); font-size: 11px; text-align: center; } .company-search-help { margin: 9px 4px 0; color: var(--ink-soft); font-size: 9px; text-align: center; } .company-search-help.is-error { color: var(--danger); } .coverage-strip { max-width: 1120px; margin: 0 auto 38px; } .coverage-title { display: flex; align-items: center; gap: 14px; margin: 0 0 10px; color: #7b898a; font-size: 9px; font-weight: 750; letter-spacing: .07em; text-transform: uppercase; } .coverage-title::before, .coverage-title::after { content: ""; height: 1px; flex: 1; background: var(--line); } .coverage-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; margin: 0; } .coverage-card { display: flex; min-width: 0; min-height: 110px; flex-direction: column; justify-content: center; padding: 17px 19px; border: 1px solid var(--line); border-radius: 17px; background: rgba(255,254,250,.7); box-shadow: 0 7px 22px rgba(19,46,48,.035); } .coverage-card dt { color: var(--ink); font-size: 10px; font-weight: 750; line-height: 1.35; } .coverage-card dt small { display: block; margin-top: 4px; color: var(--ink-soft); font-size: 8px; font-weight: 500; line-height: 1.35; } .coverage-value { order: -1; min-height: 35px; margin: 0 0 7px; font-family: Georgia, "Times New Roman", serif; font-size: 30px; font-variant-numeric: tabular-nums; font-weight: 500; letter-spacing: -.8px; line-height: 1; } .coverage-freshness { margin: 8px 2px 0; color: #7b898a; font-size: 8px; text-align: right; } .coverage-strip.is-loading .coverage-value { position: relative; color: transparent; } .coverage-strip.is-loading .coverage-value::after { content: ""; position: absolute; top: 3px; left: 0; width: 76px; height: 24px; border-radius: 7px; background: linear-gradient(100deg,#e6e9e5 20%,#f4f4f0 45%,#e6e9e5 70%); background-size: 200% 100%; animation: coverage-pulse 1.25s ease-in-out infinite; } @keyframes coverage-pulse { to { background-position-x: -200%; } } .company-shortcuts-title { display: flex; align-items: center; gap: 14px; max-width: 1120px; margin: 0 auto 9px; color: #7b898a; font-size: 9px; font-weight: 750; letter-spacing: .07em; text-transform: uppercase; } .company-shortcuts-title::before, .company-shortcuts-title::after { content: ""; height: 1px; flex: 1; background: var(--line); } .company-shortcuts-intro { max-width: 760px; margin: 0 auto 20px; color: var(--ink-soft); font-size: 11px; line-height: 1.55; text-align: center; } .company-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 16px; max-width: 1120px; margin: 0 auto; } .company-card { position: relative; display: flex; align-items: flex-start; gap: 15px; min-height: 190px; padding: 22px; border: 1px solid var(--line); border-radius: var(--radius); background: rgba(255,254,250,.78); box-shadow: 0 8px 24px rgba(19,46,48,.04); text-align: left; cursor: pointer; transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease, background .22s ease; } .company-card:hover { transform: translateY(-4px); border-color: rgba(241,118,95,.55); background: var(--card); box-shadow: var(--shadow); } .company-monogram { display: grid; place-items: center; flex: 0 0 auto; width: 58px; height: 58px; border-radius: 18px; color: var(--ink); font-size: 16px; font-weight: 850; letter-spacing: -.3px; } .company-coral { background: #ffd8cf; } .company-mint { background: #c9f0df; } .company-blue { background: #d8e7fb; } .company-violet { background: #e6daf7; } .company-amber { background: #f6dfb2; } .company-slate { background: #d7e4e2; } .company-copy { display: grid; gap: 5px; min-width: 0; } .company-copy strong { padding-right: 18px; font-size: 17px; line-height: 1.18; } .company-copy small { min-height: 32px; color: var(--ink-soft); font-size: 10px; line-height: 1.5; } .company-copy > span { color: var(--ink-soft); font-size: 11px; } .company-copy > .company-role { display: flex; width: fit-content; min-height: 20px; margin: 0 0 2px; align-items: flex-end; color: var(--coral-dark); font-size: 8px; font-weight: 800; letter-spacing: .075em; line-height: 1.25; text-transform: uppercase; } .company-copy > .company-count { margin-top: 7px; line-height: 1.4; } .company-copy b { color: var(--ink); } .company-arrow { position: absolute; top: 20px; right: 22px; color: #829092; font-size: 20px; transition: transform .22s ease, color .22s ease; } .company-card:hover .company-arrow { color: var(--coral-dark); transform: translate(2px,-2px); } .footnote-icon { display: grid; place-items: center; flex: 0 0 auto; width: 20px; height: 20px; border: 1px solid #aeb9b4; border-radius: 50%; font-family: Georgia, serif; font-size: 12px; } .workspace { min-height: 100vh; display: grid; grid-template-columns: 250px minmax(0,1fr); } .sidebar { position: sticky; top: 0; display: flex; flex-direction: column; height: 100vh; height: 100dvh; padding: 26px 16px 16px; background: var(--night); color: rgba(255,255,255,.78); overflow: auto; } .sidebar .brand { flex-shrink: 0; gap: 10px; margin-bottom: 28px; padding: 0 12px; font-size: 21px; letter-spacing: -.55px; } .main-nav { display: grid; flex-shrink: 0; gap: 3px; } .sidebar-nav-section { display: grid; gap: 3px; } .sidebar-section-label { margin: 0 12px 8px; color: rgba(255,255,255,.55); font-size: var(--text-micro); font-weight: 600; letter-spacing: .06em; text-transform: uppercase; } .nav-item { display: flex; align-items: center; gap: 12px; width: 100%; padding: 12px 13px; border: 0; border-radius: 8px; background: transparent; color: rgba(255,255,255,.72); font-size: 13px; font-weight: 550; text-align: left; cursor: pointer; transition: background .18s ease, color .18s ease; } .nav-item > span { display: grid; flex: 0 0 20px; place-items: center; width: 20px; } .nav-icon svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; } .nav-item b { display: grid; place-items: center; min-width: 26px; min-height: 22px; margin-left: auto; padding: 1px 6px; border-radius: 6px; background: rgba(255,255,255,.055); color: rgba(255,255,255,.68); font-size: var(--text-micro); font-weight: 550; font-variant-numeric: tabular-nums; white-space: nowrap; } .nav-item b[hidden] { display: none; } .nav-item:hover { background: rgba(255,255,255,.06); color: #fff; } .nav-item.is-active { background: var(--night-2); color: var(--coral); font-weight: 650; } .nav-item.is-active b { background: rgba(241,118,95,.12); color: var(--coral); } .nav-item:focus-visible { outline: 2px solid var(--coral); outline-offset: 2px; } .nav-item:disabled { opacity: .28; cursor: not-allowed; } .nav-item:disabled:hover { background: transparent; color: rgba(255,255,255,.62); } .sidebar-catalogue-collapsible { width: 100%; min-width: 0; margin: 16px 0 9px; padding-top: 16px; border-top: 1px solid var(--line-dark); } .sidebar-catalogue-collapsible > summary { display: flex; align-items: center; gap: 10px; min-height: 64px; padding: 10px 12px; border: 1px solid var(--line-dark); border-radius: 10px; background: rgba(255,255,255,.025); color: rgba(255,255,255,.9); cursor: pointer; list-style: none; transition: background .18s ease; } .sidebar-catalogue-collapsible > summary::-webkit-details-marker { display: none; } .sidebar-catalogue-collapsible > summary:hover, .sidebar-catalogue-collapsible[open] > summary { background: rgba(255,255,255,.08); outline: 0; } .sidebar-catalogue-collapsible > summary:focus-visible { outline: 2px solid var(--coral); outline-offset: 2px; } .sidebar-catalogue-collapsible.is-active > summary { background: rgba(255,255,255,.1); } .sidebar-catalogue-collapsible > summary > span { display: grid; min-width: 0; flex: 1; gap: 3px; } .sidebar-catalogue-collapsible > summary small { color: rgba(255,255,255,.55); font-size: var(--text-micro); font-weight: 550; letter-spacing: .05em; line-height: 1.35; text-transform: uppercase; } .sidebar-catalogue-collapsible > summary strong { min-width: 0; font-size: 12px; line-height: 1.35; white-space: normal; overflow-wrap: anywhere; } .sidebar-catalogue-collapsible > summary svg { flex: 0 0 16px; width: 16px; height: 16px; fill: none; stroke: rgba(255,255,255,.55); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: transform .18s ease; } .sidebar-catalogue-collapsible[open] > summary svg { transform: rotate(180deg); } .sidebar-catalogue-collapsible.is-static > summary { cursor: default; pointer-events: none; } .sidebar-catalogue-collapsible.is-static > summary:hover { background: rgba(255,255,255,.045); } .sidebar-catalogue-collapsible.is-static > summary svg, .sidebar-catalogue-collapsible.is-static > .sidebar-catalogue-list { display: none; } .sidebar-catalogue-list { display: grid; grid-template-columns: minmax(0,1fr); gap: 2px; min-width: 0; max-height: 220px; margin: 5px 0 5px 14px; padding: 3px 0 3px 9px; border-left: 1px solid rgba(255,255,255,.13); overflow-y: auto; } .sidebar-catalogue-list > p { margin: 0; padding: 10px; color: rgba(255,255,255,.42); font-size: 10px; } .sidebar-catalogue-option { display: flex; align-items: center; gap: 8px; width: 100%; min-height: 35px; padding: 6px 9px; border: 0; border-radius: 8px; background: transparent; color: rgba(255,255,255,.62); font: inherit; font-size: 10px; font-weight: 650; text-align: left; cursor: pointer; } .sidebar-catalogue-option:hover { background: rgba(255,255,255,.06); color: #fff; } .sidebar-catalogue-option.is-active { color: #fff; } .sidebar-catalogue-option > span:not(.catalogue-avatar) { min-width: 0; flex: 1; line-height: 1.35; white-space: normal; overflow-wrap: anywhere; } .sidebar-catalogue-option i { flex: 0 0 auto; color: var(--coral); font-style: normal; } .sidebar-spacer { flex: 1 0 28px; } .sidebar-footer { flex-shrink: 0; border-top: 1px solid var(--line-dark); padding-top: 10px; } .sidebar-contact { display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px; border-radius: 8px; color: var(--mint); font-size: var(--text-small); font-weight: 550; text-decoration: none; } .sidebar-contact:hover { background: color-mix(in srgb, var(--mint) 7%, transparent); } .sidebar-footer .lucide { flex: 0 0 auto; width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; } .sidebar-contact .sidebar-contact-arrow { width: 14px; height: 14px; margin-left: auto; } .sidebar-account { margin-top: 6px; padding-top: 12px; border-top: 1px solid var(--line-dark); } .sidebar-account-profile { display: grid; gap: 4px; min-width: 0; padding: 0 8px; overflow-wrap: anywhere; } .sidebar-account-profile strong { color: #fff; font-size: var(--text-body); font-weight: 700; line-height: 1.4; } .sidebar-account-meta { display: flex; flex-wrap: wrap; gap: 2px 8px; color: rgba(255,255,255,.64); font-size: var(--text-micro); line-height: 1.5; } .sidebar-account-meta > span { min-width: 0; } .sidebar-account-role::before { content: '·'; margin-right: 8px; } .sidebar-account-actions { display: grid; grid-template-columns: max-content max-content 44px; justify-content: space-between; align-items: center; gap: 8px; margin-top: 8px; } .sidebar-account-actions > a, .sidebar-account-actions .logout-form-inverse button { display: inline-flex; justify-content: center; align-items: center; gap: 5px; width: 100%; min-width: 44px; min-height: 44px; height: auto; padding: 6px 4px; border: 0; border-radius: 8px; background: transparent; color: rgba(255,255,255,.72); font: inherit; font-size: var(--text-micro); font-weight: 550; text-decoration: none; cursor: pointer; } .sidebar-account-actions > a:first-child { justify-content: flex-start; padding-left: 8px; } .sidebar-account-actions .logout-form-inverse button { width: 44px; height: 44px; padding: 0; } .sidebar-account-actions > a:hover, .sidebar-account-actions .logout-form-inverse button:hover { background: rgba(255,255,255,.06); color: #fff; } .sidebar-contact:focus-visible { outline: 2px solid var(--mint); outline-offset: 2px; } .sidebar-account-actions > a:focus-visible, .sidebar-account-actions button:focus-visible { outline: 2px solid var(--coral); outline-offset: 2px; } .app-shell { min-width: 0; } .access-notice { display: grid; grid-template-columns: 18px minmax(0,1fr); align-items: start; gap: 12px; margin: 30px 34px 0; padding: 14px 18px; border: 1px solid color-mix(in srgb, var(--coral) 30%, var(--card)); border-radius: 10px; background: color-mix(in srgb, var(--coral) 8%, var(--card)); color: var(--ink-soft); font-size: var(--text-secondary); line-height: 1.5; } .access-notice > svg { width: 18px; height: 18px; margin-top: 2px; fill: none; stroke: var(--coral-dark); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; } .access-notice p { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; min-width: 0; margin: 0; } .access-notice strong { color: var(--ink); font-weight: 700; } .demo-export-notice { display: none; } .topbar { min-height: 84px; display: none; align-items: center; gap: 24px; padding: 16px 34px; border-bottom: 1px solid var(--line); background: rgba(245,244,239,.88); backdrop-filter: blur(16px); } .topbar.is-context-empty { display: none; } .mobile-menu, .mobile-menu-close, .mobile-menu-backdrop, .mobile-topbar-brand { display: none; } .mobile-menu { border: 0; background: transparent; font-size: 22px; } .mobile-menu-close { border: 0; background: transparent; color: #fff; cursor: pointer; } .mobile-menu-close .lucide { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; } .mobile-topbar-brand { align-items: center; gap: 7px; color: var(--ink); } .mobile-topbar-brand .brand-signature { width: 118px; } .button { min-height: 40px; padding: 6px 14px; border: 1px solid transparent; border-radius: 10px; font-size: var(--text-secondary); line-height: 1.4; font-weight: 750; cursor: pointer; transition: transform .16s ease, background .16s ease, border .16s ease; } .button-with-icon { display: inline-flex; align-items: center; justify-content: center; gap: 7px; } .button-with-icon .lucide { flex: 0 0 auto; width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; } .button:hover { transform: translateY(-1px); } .button:disabled { opacity: .45; transform: none; cursor: not-allowed; } .button-primary { background: var(--coral); color: #fff; } .button-primary:hover { background: var(--coral-dark); } .button-ghost { border-color: var(--line); background: var(--card); } .button-soft { background: #edf1ed; color: var(--ink); } .button-export { min-height: 44px; background: var(--export-blue); color: #fff; box-shadow: none; } .button-export:hover { transform: none; } .button-export:hover:not(:disabled) { background: color-mix(in srgb, var(--export-blue) 88%, var(--ink)); } .button-export:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; } .button-full { width: 100%; } /* Authentification */ .auth-page { display: grid; min-height: 100vh; place-items: center; padding: 28px; background: radial-gradient(circle at 15% 10%, rgba(121,212,176,.18), transparent 34rem), radial-gradient(circle at 92% 12%, rgba(241,118,95,.2), transparent 30rem), var(--paper); } .auth-shell { width: min(460px, 100%); } .auth-card { padding: 42px; border: 1px solid var(--line); border-radius: 28px; background: rgba(255,254,250,.96); box-shadow: 0 24px 80px rgba(16,40,42,.13); } .auth-brand { display: flex; align-items: center; gap: 12px; margin-bottom: 38px; color: var(--ink); font-size: 23px; font-weight: 850; letter-spacing: -.8px; text-decoration: none; } .auth-brand img { width: 46px; height: 46px; border-radius: 13px; } .auth-brand .brand-signature { width: 166px; height: auto; border-radius: 0; } .auth-brand:focus-visible { outline: 2px solid var(--ink); outline-offset: 4px; } .auth-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 30px; } .auth-header .auth-brand { flex: 0 1 166px; min-width: 0; margin: 0; } .auth-header .brand-signature { width: 100%; max-width: 166px; height: auto; } .auth-home-link, .auth-home-link:visited { display: inline-flex; align-items: center; gap: 6px; flex-shrink: 0; min-height: 44px; color: var(--ink); font-size: var(--text-small); font-weight: 600; text-decoration: none; } .auth-home-link:hover { text-decoration: underline; text-underline-offset: 4px; } .auth-home-link:focus-visible { outline: 2px solid var(--ink); outline-offset: 4px; border-radius: 4px; } .auth-eyebrow { display: none; } .auth-card h1 { margin: 0; font-family: Georgia, "Times New Roman", serif; font-size: clamp(36px, 8vw, 50px); font-weight: 500; letter-spacing: -2px; line-height: .98; } .auth-intro { margin: 18px 0 0; color: var(--ink-soft); font-size: 14px; line-height: 1.55; } .auth-error { margin-top: 22px; padding: 12px 14px; border: 1px solid rgba(201,87,74,.24); border-radius: 12px; background: #fff1ed; color: #9d3f33; font-size: var(--text-secondary); font-weight: 700; line-height: 1.45; } .auth-form { display: grid; gap: 16px; margin-top: 28px; } .auth-form label { display: grid; gap: 7px; } .auth-form label > span { font-size: var(--text-small); font-weight: 800; } .auth-form input { width: 100%; height: 50px; padding: 0 14px; border: 1px solid #cbd5d0; border-radius: 12px; background: #fff; color: var(--ink); font-size: 15px; } .auth-form input:focus { border-color: var(--coral); box-shadow: 0 0 0 4px rgba(241,118,95,.1); outline: 0; } .auth-submit { width: 100%; min-height: 50px; margin-top: 4px; font-size: var(--text-secondary); } .auth-help { margin: 22px 0 0; color: #708083; font-size: var(--text-label); line-height: 1.5; text-align: center; } .auth-contact-link { display: flex; align-items: center; justify-content: center; width: fit-content; min-height: 44px; margin: 4px auto 0; color: var(--ink-soft); font-size: var(--text-small); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; } .auth-contact-link:hover { color: var(--ink); } .auth-contact-link:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; border-radius: 4px; } .account-shell { width: min(600px, 100%); } .account-card { padding: 38px 42px; } .account-brand { width: fit-content; margin-bottom: 30px; } .account-card h1 { max-width: 480px; } .account-summary { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; margin: 24px 0 0; } .account-summary > div { min-width: 0; padding: 14px 15px; border: 1px solid var(--line); border-radius: 13px; background: #f8f7f2; } .account-summary dt { margin-bottom: 6px; color: #708083; font-size: var(--text-micro); font-weight: 800; letter-spacing: .08em; text-transform: uppercase; } .account-summary dd { min-width: 0; margin: 0; overflow-wrap: anywhere; font-size: var(--text-secondary); font-weight: 800; } .account-summary dd small { display: block; margin-top: 4px; color: var(--ink-soft); font-size: var(--text-micro); font-weight: 600; } .auth-success { margin-top: 22px; padding: 12px 14px; border: 1px solid rgba(58,137,100,.25); border-radius: 12px; background: #edf9f2; color: #286f50; font-size: var(--text-secondary); font-weight: 700; line-height: 1.45; } .account-password-form { margin-top: 26px; } .account-password-form fieldset { display: grid; gap: 15px; min-width: 0; margin: 0; padding: 0; border: 0; } .account-password-form legend { margin-bottom: 15px; padding: 0; font-size: var(--text-body); font-weight: 850; } .password-requirements { margin: -3px 0 0; color: #708083; font-size: var(--text-micro); line-height: 1.5; } .account-actions { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 22px; } .account-actions a, .account-actions button { padding: 0; border: 0; background: transparent; color: var(--ink-soft); font-size: var(--text-label); font-weight: 750; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; } .account-actions form:only-child { margin-left: auto; } .account-actions a:hover, .account-actions button:hover { color: var(--ink); } .contact-page, .cgu-page { background: var(--paper); } .cgu-shell { width: min(820px, 100%); min-width: 0; } .cgu-draft { margin-top: 24px; padding: 16px; border: 1px solid var(--line); border-left: 3px solid var(--coral); border-radius: 10px; background: var(--paper); color: var(--ink); font-size: var(--text-body); line-height: 1.6; } .cgu-draft p { margin: 6px 0 0; } .cgu-content { margin-top: 28px; color: var(--ink-soft); font-size: var(--text-body); line-height: 1.7; overflow-wrap: anywhere; } .cgu-content section + section { margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--line); } .cgu-content h2 { margin: 0 0 12px; color: var(--ink); font-size: 18px; line-height: 1.4; } .cgu-content p { margin: 0 0 12px; } .cgu-content ul { margin: 0 0 12px; padding-left: 22px; } .cgu-content li + li { margin-top: 8px; } .cgu-content .cgu-pending { padding-left: 12px; border-left: 2px solid var(--coral); font-size: var(--text-small); } .cgu-content a { color: var(--ink); text-decoration: underline; text-underline-offset: 3px; } .cgu-content a:focus-visible { outline: 2px solid var(--coral); outline-offset: 3px; } .contact-card { box-shadow: 0 12px 40px rgba(16,40,42,.05); } .contact-card h1 em { color: var(--coral); } .contact-form input[type="email"], .contact-form textarea { font: inherit; font-size: 16px; } .contact-form textarea { width: 100%; min-height: 180px; padding: 14px; border: 1px solid #cbd5d0; border-radius: 12px; background: #fff; color: var(--ink); line-height: 1.6; resize: vertical; } .contact-form textarea:focus { border-color: var(--coral); box-shadow: 0 0 0 4px rgba(241,118,95,.1); outline: 0; } .contact-dialog-body { position: relative; padding: 30px 24px 24px; } .contact-dialog h2 { padding-right: 32px; } .contact-dialog h2 em { color: var(--coral); font-weight: inherit; } .contact-dialog-body > p { color: var(--ink-soft); font-size: var(--text-body); line-height: 1.6; } .contact-dialog .contact-form { padding: 0; margin-top: 20px; } .contact-dialog .contact-form > .button { justify-self: end; min-height: 44px; } .contact-dialog .modal-close { width: 44px; height: 44px; } .contact-dialog-body > .auth-error { color: var(--danger); } .contact-email-alternative { margin: 20px 0 0; padding-top: 16px; border-top: 1px solid var(--line); } .contact-email-alternative a { color: var(--ink); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; } .contact-email-alternative a:hover { color: var(--coral-dark); } .contact-email-alternative a:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; } .contact-dialog .catalogue-create-actions .button { min-height: 44px; } .account-dialog-body { position: relative; padding: 30px 24px 24px; } .account-dialog h2 { padding-right: 40px; } .account-dialog h2 em { color: var(--coral); font-weight: inherit; } .account-dialog .modal-close { width: 44px; height: 44px; } .account-dialog form { padding: 0; } .account-dialog-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-top: 24px; } .account-dialog-actions .button { min-height: 44px; } @media (max-width: 600px) { .auth-page { align-items: start; padding: 14px; } .auth-card, .account-card { padding: 28px 22px; border-radius: 22px; } .auth-brand { margin-bottom: 28px; } .account-summary { grid-template-columns: 1fr; } } /* Catalogue client */ .catalogue-switcher-empty { margin: 0; padding: 20px 12px; color: var(--ink-soft); font-size: 11px; text-align: center; } .catalogue-switcher-avatar { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; color: var(--ink); font-size: 11px; font-weight: 850; letter-spacing: -.2px; } .catalogue-avatar { --catalogue-avatar-size: 42px; position: relative; display: inline-grid; place-items: center; flex: 0 0 var(--catalogue-avatar-size); width: var(--catalogue-avatar-size); height: var(--catalogue-avatar-size); border-radius: 10px; color: var(--ink); font-size: 13px; font-weight: 750; } .catalogue-avatar--small { --catalogue-avatar-size: 28px; border-radius: 7px; font-size: 10px; } .catalogue-avatar--large { --catalogue-avatar-size: 120px; border-radius: 16px; font-size: 28px; } .catalogue-avatar .catalogue-avatar-initials { position: absolute; inset: 0; display: grid; place-items: center; } .catalogue-avatar img { position: relative; display: block; width: var(--catalogue-avatar-size); height: var(--catalogue-avatar-size); box-sizing: border-box; padding: 4px; border: 1px solid var(--line); border-radius: inherit; background: #fff; object-fit: contain; } .catalogue-avatar--large img { padding: 8px; } .sidebar-catalogue-option .catalogue-avatar { flex: 0 0 var(--catalogue-avatar-size); } .sidebar-catalogue-collapsible #current-company-name { display: flex; align-items: center; gap: 8px; } #current-company-name > span:not(.catalogue-avatar) { min-width: 0; flex: 1; white-space: normal; overflow-wrap: anywhere; } .catalogue-heading-identity { display: flex; align-items: center; gap: 20px; min-width: 0; } .catalogue-heading-identity > div { min-width: 0; } .catalogue-create-dialog { width: min(540px, calc(100% - 30px)); } .catalogue-create-field { display: grid; gap: 8px; margin-top: 22px; } .catalogue-create-field > span { font-size: 11px; font-weight: 800; } .catalogue-create-field input { width: 100%; height: 46px; padding: 0 13px; border: 1px solid #cad4cf; border-radius: 12px; background: #fff; color: var(--ink); font-size: 13px; transition: border-color .18s ease, box-shadow .18s ease; } .catalogue-create-field input:focus { border-color: var(--coral); box-shadow: 0 0 0 4px rgba(241,118,95,.1); outline: 0; } .catalogue-create-sources { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; margin: 18px 0 0; padding: 0; border: 0; } .catalogue-create-sources legend { grid-column: 1 / -1; margin-bottom: 1px; font-size: 11px; font-weight: 800; } .catalogue-create-source { position: relative; display: flex; flex-direction: column; gap: 8px; min-width: 0; min-height: 78px; align-items: flex-start; padding: 11px; border: 1px solid var(--line); border-radius: 13px; background: #fff; cursor: pointer; transition: border-color .16s ease, background .16s ease, box-shadow .16s ease; } .catalogue-create-source:hover { border-color: #b8c8c0; } .catalogue-create-source.is-selected { border-color: rgba(241,118,95,.72); background: #fff6f2; box-shadow: 0 0 0 2px rgba(241,118,95,.08); } .catalogue-create-source.is-disabled { opacity: .55; cursor: not-allowed; } .catalogue-create-source input { position: absolute; opacity: 0; pointer-events: none; } .catalogue-create-source span { min-width: 0; } .catalogue-create-source b, .catalogue-create-source small { display: block; } .catalogue-create-source b { color: var(--ink); font-size: 10px; } .catalogue-create-source small { margin-top: 5px; color: var(--ink-soft); font-size: 8px; line-height: 1.4; } .catalogue-create-source em { position: static; padding: 3px 5px; border-radius: 999px; background: #edf1ed; color: var(--ink-soft); font-size: 6px; font-style: normal; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; } .catalogue-company-import { position: relative; margin-top: 14px; padding: 13px; border-radius: 14px; background: #f5f7f3; } .catalogue-company-import .catalogue-create-field { margin-top: 0; } .catalogue-company-results { position: static; max-height: 190px; margin-top: 8px; padding: 5px; border: 1px solid var(--line); border-radius: 12px; background: #fff; overflow-y: auto; } .catalogue-company-result { display: grid; grid-template-columns: 34px minmax(0,1fr); gap: 9px; align-items: center; width: 100%; min-height: 46px; padding: 6px; border: 0; border-radius: 9px; background: transparent; color: var(--ink); text-align: left; cursor: pointer; } .catalogue-company-result:hover, .catalogue-company-result:focus-visible { background: #f5f3ed; outline: 0; } .catalogue-company-result > span:first-child { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: #dff6ed; font-size: 9px; font-weight: 850; } .catalogue-company-result strong, .catalogue-company-result small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .catalogue-company-result strong { font-size: 10px; } .catalogue-company-result small { margin-top: 3px; color: var(--ink-soft); font-size: 8px; } .catalogue-company-selection { margin: 8px 1px 0 !important; color: var(--ink-soft); font-size: 8px !important; line-height: 1.45; } .catalogue-company-selection.is-selected { color: #287457; font-weight: 750; } .catalogue-create-error { margin: 9px 0 0 !important; padding: 9px 11px; border-radius: 10px; background: #fff0ed; color: var(--danger) !important; font-size: 10px !important; } .catalogue-create-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 22px; } .work-search-panel { padding: 22px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--card); } .catalogue-add-head { display: grid; grid-template-columns: minmax(0,1fr) 44px; align-items: start; gap: 12px; } .catalogue-add-close { width: 44px; min-height: 44px; padding: 0; background: transparent; color: var(--ink-soft); } .catalogue-add-close:hover { transform: none; background: var(--paper); color: var(--ink); } .catalogue-add-close:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; } .work-search-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; } .work-search-copy { min-width: 0; max-width: 820px; } .work-search-copy .eyebrow, .catalogue-content-head .eyebrow { margin-bottom: 7px; } .work-search-copy h2 { margin: 0; font-size: 18px; font-weight: 700; line-height: 1.35; } .catalogue-content-head h2 { margin: 0; font-family: Georgia, "Times New Roman", serif; font-size: 25px; font-weight: 500; letter-spacing: -.7px; } .work-search-copy > p:last-child { margin: 7px 0 0; color: var(--ink-soft); font-size: 11px; line-height: 1.55; } .catalogue-add-contact { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 24px; margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--line); } .catalogue-add-contact > div { flex: 1 1 360px; min-width: 0; } .catalogue-add-contact h3 { margin: 0; font-size: var(--text-body); font-weight: 650; line-height: 1.45; } .catalogue-add-contact p { margin: 5px 0 0; color: var(--ink-soft); font-size: var(--text-small); line-height: 1.55; } .catalogue-add-contact > .button { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; max-width: 100%; margin-left: auto; background: var(--mint); color: var(--ink); text-align: center; text-decoration: none; } .catalogue-add-contact > .button:hover { background: color-mix(in srgb, var(--mint) 88%, var(--ink)); } .catalogue-management-note a:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; } .work-search-csv-cta { flex: 0 0 auto; min-height: 42px; gap: 8px; white-space: nowrap; } .work-search-csv-cta em { padding: 3px 6px; border-radius: 999px; background: #e8eeea; color: var(--ink-soft); font-size: var(--text-micro); font-style: normal; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; } .work-search-form { position: relative; display: grid; grid-template-columns: auto minmax(0,1fr) auto auto; gap: 10px; align-items: center; margin-top: 16px; padding: 6px; border: 1px solid var(--line); border-radius: 12px; background: var(--card); transition: border-color .18s ease, box-shadow .18s ease; } .work-search-form:focus-within { border-color: var(--ink-soft); box-shadow: 0 0 0 3px rgba(40,108,112,.12); } .work-search-form > span:first-child { padding-left: 8px; color: var(--coral-dark); font-size: 25px; } .work-search-form input { width: 100%; min-width: 0; height: 42px; border: 0; background: transparent; color: var(--ink); font-size: 15px; outline: 0; } .work-search-form input::placeholder { color: #829092; } .work-search-form .company-search-loader { position: static; } .work-search-help { min-height: 14px; margin: 9px 3px 0; color: var(--ink-soft); font-size: 10px; } .work-search-help.is-error { color: var(--danger); } .work-search-results { display: grid; gap: 8px; margin-top: 15px; } .work-search-results:empty { margin-top: 0; } .search-placeholder, .catalogue-works-empty { padding: 24px; border: 1px dashed #cbd6d1; border-radius: 15px; color: var(--ink-soft); font-size: 11px; line-height: 1.55; text-align: center; } .work-search-result { display: grid; grid-template-columns: 64px minmax(0,1fr) auto; gap: 16px; align-items: center; min-height: 116px; padding: 13px; border: 1px solid var(--line); border-radius: 18px; background: var(--card); } .work-search-result .programme-poster-featured { width: 64px; border-radius: 10px; } .work-result-copy, .catalogue-work-copy { min-width: 0; } .work-result-title-line { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; } .work-result-title-line strong { font-family: var(--font-work-title); font-size: var(--text-work-title); font-weight: 500; line-height: 1.4; } .work-result-meta, .catalogue-work-meta { display: flex; flex-wrap: wrap; gap: 5px 11px; margin-top: 6px; color: var(--ink-soft); font-size: 9px; } .work-result-meta .metadata-line-break, .catalogue-work-meta .metadata-line-break { flex-basis: 100%; } .work-result-original { margin: 5px 0 0; color: #596f71; font-size: 9px; } .source-chips { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 8px; } .source-chip { display: inline-flex; align-items: center; gap: 6px; min-height: 23px; padding: 0 8px; border: 1px solid var(--line); border-radius: 999px; background: #fbfbf8; color: var(--ink-soft); font-size: 8px; font-weight: 750; } .source-chip.is-warning { border-color: #ecd29c; background: #fff7e7; color: #855d17; } .catalogue-provenance { display: flex; width: fit-content; max-width: 100%; align-items: flex-start; gap: 7px; padding: 7px 9px; border-radius: 10px; background: #f2f5f1; color: var(--ink-soft); } .catalogue-provenance-icon { display: grid; flex: 0 0 20px; width: 20px; height: 20px; place-items: center; border-radius: 7px; background: #fff; color: var(--coral-dark); } .catalogue-provenance-icon .lucide { width: 12px; height: 12px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; } .catalogue-provenance-copy { display: block; min-width: 0; padding-top: 1px; line-height: 1.25; } .catalogue-provenance-copy strong, .catalogue-provenance-copy small { display: block; } .catalogue-provenance-copy strong { color: var(--ink); font-size: 8px; font-weight: 750; } .catalogue-provenance-copy small { margin-top: 2px; overflow: hidden; font-size: 7px; text-overflow: ellipsis; white-space: nowrap; } .catalogue-provenance--card { margin-top: 10px; } .catalogue-provenance--drawer { margin-top: 12px; } .catalogue-provenance--detail { margin-top: 16px; } .catalogue-provenance--drawer .catalogue-provenance-copy small, .catalogue-provenance--detail .catalogue-provenance-copy small { overflow: visible; text-overflow: clip; white-space: normal; } .source-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; } .source-vod { background: var(--mint); } .source-tv { background: var(--blue); } .button-add { min-width: 84px; } .button-added { border-color: #bcdcca; background: #edf8f2; color: #287457; } .button-added:disabled { opacity: 1; cursor: default; } .catalogue-content { margin-top: 28px; } .channels-inventory-totals { display: flex; flex-wrap: wrap; gap: 12px 28px; margin: 0 0 10px; } .channels-stat { display: flex; flex-direction: row-reverse; align-items: baseline; gap: 8px; } .channels-stat dt { color: var(--ink); font-size: 18px; font-weight: 600; line-height: 1.4; } .channels-stat dd { margin: 0; color: var(--ink); font-size: 28px; font-weight: 750; line-height: 1.2; font-variant-numeric: tabular-nums; } .channels-stat.is-ignored dt, .channels-stat.is-ignored dd { color: var(--ink-soft); } .channels-inventory-meta { margin: 0 0 24px; color: var(--ink-soft); font-size: var(--text-body); line-height: 1.6; } .channels-inventory-toolbar { display: grid; grid-template-columns: minmax(180px,2fr) repeat(4,minmax(110px,1fr)); align-items: end; gap: 14px; padding: 20px; margin-bottom: 20px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--card); } .channels-inventory-toolbar > label { display: grid; gap: 7px; min-width: 0; } .channels-inventory-toolbar > label > span:first-child { color: var(--ink-soft); font-size: var(--text-label); font-weight: 600; } .channels-inventory-toolbar .filter-select { width: 100%; min-width: 0; min-height: 44px; } .channels-inventory-toolbar select.filter-select { -webkit-appearance: none; appearance: none; padding-right: 40px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23496062' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-position: right 12px center; background-size: 16px 16px; background-repeat: no-repeat; } @media (forced-colors: active) { .channels-inventory-toolbar select.filter-select { appearance: auto; background-image: none; } } .channels-inventory-toolbar .catalogue-filter-search { min-height: 44px; } .channels-filter-reset { grid-column: 1 / -1; justify-self: end; min-height: 44px; } .channels-results-title { margin: 0 0 8px; color: var(--ink); font-size: 18px; font-weight: 700; line-height: 1.4; } .channels-results-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; } .channels-results-head .channels-results-title { margin: 0; } .channels-results-head .button-export { max-width: 100%; white-space: normal; } .channel-cell-label { display: none; } @media (max-width: 1100px) { .channels-inventory-toolbar { grid-template-columns: repeat(4,minmax(0,1fr)); } .channels-search-field { grid-column: 1 / -1; } } @media (max-width: 600px) { .channels-inventory-toolbar { grid-template-columns: repeat(2,minmax(0,1fr)); padding: 16px; } .channels-stat dt { font-size: var(--text-body); } .channels-stat dd { font-size: 24px; } } .channels-inclusion { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font-size: var(--text-small); cursor: pointer; } .channels-inclusion input { appearance: none; position: relative; flex: 0 0 auto; width: 36px; height: 22px; margin: 0; border: 1px solid var(--line); border-radius: 999px; background: #e7ece8; cursor: pointer; } .channels-inclusion input::before { position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%; background: #fff; content: ''; box-shadow: 0 1px 3px rgba(0,0,0,.15); } .channels-inclusion input:checked { background: var(--coral); border-color: var(--coral); } .channels-inclusion input:checked::before { transform: translateX(14px); } .channels-inclusion input:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; } .channels-inclusion input:disabled { cursor: default; opacity: .6; } .channels-save-bar { position: sticky; bottom: 16px; z-index: 5; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-top: 18px; padding: 16px; border: 1px solid var(--line); border-radius: 16px; background: var(--card); box-shadow: 0 4px 24px rgba(19,46,48,.16); } .channels-save-bar p { flex-basis: 100%; margin: 0; color: var(--coral-dark); } .channels-save-bar > div { display: flex; gap: 8px; } .channels-inventory-count { margin: 0 0 12px; color: var(--ink-soft); font-size: var(--text-small); } .data-table.channels-inventory-table { min-width: 0; } .channels-inventory-table .channel-identity-name { white-space: normal; overflow-wrap: anywhere; } .channels-inventory-table .channel-coverage { font-size: var(--text-small); } .channel-coverage-date { display: block; white-space: nowrap; } .channel-coverage-empty { color: var(--ink-soft); white-space: normal; } .channels-coverage-warning { margin: 0 0 20px; padding: 12px 16px; border-left: 3px solid var(--coral); background: color-mix(in srgb,var(--coral) 8%,var(--card)); color: var(--ink); font-size: var(--text-body); line-height: 1.6; } .channels-group-select { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; min-width: 110px; max-width: 220px; text-align: left; cursor: pointer; } .filter-select.channels-group-select { min-height: 44px; padding: 0 12px; } .channels-group-select > span:first-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .channels-group-select > .lucide { display: block; flex: 0 0 16px; width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; } .channels-group-select[aria-expanded="true"] > .lucide { transform: rotate(180deg); } .channels-group-select[aria-expanded="true"] { border-color: var(--coral); } .channel-groups-picker { position: fixed; inset: auto; margin: 0; width: min(340px,calc(100vw - 24px)); max-height: calc(100dvh - 24px); padding: 0; border: 1px solid var(--line); border-radius: 14px; background: var(--card); color: var(--ink); box-shadow: 0 10px 36px rgba(8,28,30,.18); } .channel-groups-picker::backdrop { background: transparent; } .channel-groups-picker h2 { margin: 0; padding: 16px 16px 6px; font-size: var(--text-body); overflow-wrap: anywhere; } .channel-groups-picker form > p { margin: 0; padding: 0 16px 12px; color: var(--ink-soft); font-size: var(--text-small); } .channel-groups-picker-options { max-height: min(320px,45dvh); overflow-y: auto; padding: 4px 8px; border-top: 1px solid var(--line); } .channel-groups-picker-options label { display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 8px; font-size: var(--text-body); overflow-wrap: anywhere; cursor: pointer; } .channel-groups-picker-options label:hover { background: #f7f8f5; } .channel-groups-picker-options input { flex: 0 0 auto; width: 18px; height: 18px; margin: 0; accent-color: var(--coral); } .channel-groups-picker-options input:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; } .channel-groups-picker-options p { padding: 8px; color: var(--ink-soft); font-size: var(--text-small); } .channel-groups-picker-actions { display: flex; justify-content: flex-end; gap: 8px; padding: 12px; border-top: 1px solid var(--line); } .channel-groups-picker-actions .button { min-height: 44px; } .channel-group-manager-body { position: relative; padding: 30px 22px 22px; } .channel-group-manager h2 { padding-right: 30px; } .channel-group-manager .channel-group-create-form { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: end; gap: 12px; margin-top: 22px; padding: 0 0 20px; border-bottom: 1px solid var(--line); } .channel-group-create-form .catalogue-create-field { min-width: 0; margin-top: 0; } .channel-group-create-form > .button { min-height: 46px; } .channel-group-manager-body > p { color: var(--ink-soft); font-size: var(--text-small); line-height: 1.6; } .channel-group-manager-list { max-height: min(32vh,320px); margin: 20px 0 0; padding: 0; overflow-y: auto; list-style: none; } .channel-group-manager-list li { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 0; } .channel-group-manager-list li + li { border-top: 1px solid var(--line); } .channel-group-manager-list li > div { min-width: 0; overflow-wrap: anywhere; } .channel-group-manager-list strong { font-size: var(--text-body); } .channel-group-manager-list small { display: block; margin-top: 4px; color: var(--ink-soft); font-size: var(--text-small); } .channel-group-manager-list .channel-group-delete { flex: 0 0 auto; min-height: 44px; color: var(--danger); } .channel-group-manager-empty { color: var(--ink-soft); font-size: var(--text-small); } .channels-inventory-status { display: inline-block; padding: 4px 8px; border: 1px solid var(--line); border-radius: 999px; color: var(--ink-soft); font-size: var(--text-micro); } .channels-inventory-status.is-active { color: var(--ink-soft); background: transparent; } .channels-inventory-status:not(.is-active) { background: color-mix(in srgb,var(--line) 30%,var(--card)); } @media (max-width: 600px) { .channels-inventory-table { display: block; } .channels-inventory-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); } .channels-inventory-table tbody { display: block; } .channels-inventory-table tbody tr { display: grid; grid-template-columns: minmax(0,max-content) minmax(0,1fr) auto; grid-template-areas: "identity identity follow" "country status follow" "groups groups groups" "coverage coverage coverage"; align-items: center; gap: 6px 12px; padding: 14px 16px; border-bottom: 1px solid var(--line); } .channels-inventory-table tbody tr:last-child { border-bottom: 0; } .data-table.channels-inventory-table td { min-width: 0; padding: 0; border: 0; white-space: normal; } .channels-inventory-table td:first-child { grid-area: identity; } .channels-inventory-table td:nth-child(2) { grid-area: follow; align-self: start; justify-self: end; } .channels-inventory-table td:nth-child(3) { grid-area: groups; margin-top: 6px; } .channels-inventory-table td:nth-child(4) { grid-area: country; color: var(--ink-soft); font-size: var(--text-small); overflow-wrap: anywhere; } .channels-inventory-table td:nth-child(5) { grid-area: status; justify-self: start; } .channels-inventory-table .channels-inclusion { flex-direction: column; justify-content: center; gap: 4px; min-width: 44px; padding: 3px; font-size: var(--text-label); } .channels-inventory-table .channels-inventory-status { padding: 0; border: 0; background: transparent; font-size: var(--text-small); } .channels-inventory-table td.channel-coverage { grid-area: coverage; display: flex; flex-wrap: wrap; gap: 0 4px; margin-top: 4px; color: var(--ink-soft); font-size: var(--text-label); line-height: 1.5; } .channels-inventory-table .channel-coverage-date { display: inline-block; } .channels-inventory-table .channel-cell-label { display: none; } .channels-inventory-table td:nth-child(3) .channel-cell-label { display: block; margin-bottom: 6px; color: var(--ink-soft); font-size: var(--text-label); font-weight: 600; } .channels-inventory-table .channels-group-select { min-width: 0; max-width: none; } .channels-inventory-table .channel-logo-frame { --channel-logo-size: 34px; --channel-logo-padding: 3px; } } .catalogue-content-head { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 18px; margin-bottom: 14px; } .catalogue-content-head > div { min-width: 0; } .catalogue-content-actions { display: flex; gap: 10px; margin-left: auto; } .catalogue-content-actions > .button { min-height: 44px; white-space: normal; } .catalogue-content-actions > .button:hover { transform: none; } .catalogue-content-actions > .button:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; } .catalogue-content > .work-search-panel { margin-bottom: 18px; } .catalogue-content .catalogue-content-head h2 { font-family: inherit; font-size: 18px; font-weight: 700; letter-spacing: normal; line-height: 1.4; } .catalogue-filter-bar { display: grid; grid-template-columns: minmax(220px,2fr) repeat(var(--catalogue-filter-columns,5),minmax(120px,1fr)); gap: 14px; align-items: end; margin-bottom: 20px; padding: 20px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--card); } .catalogue-filter-bar--single-format { --catalogue-filter-columns: 4; } .catalogue-frequency-note { margin: 0 0 16px; color: var(--ink-soft); font-size: var(--text-small); line-height: 1.5; } .catalogue-filter-bar > label { display: grid; gap: 7px; min-width: 0; } .catalogue-filter-bar > label > span:first-child { color: var(--ink-soft); font-size: var(--text-label); font-weight: 600; } .catalogue-filter-bar select, .catalogue-filter-search, .channels-inventory-toolbar .filter-select, .diffusion-date-fields input, .diffusion-date-fields select { width: 100%; min-width: 0; min-height: 44px; border: 1px solid #d8e0dc; border-radius: 10px; background-color: #fbfbf8; color: var(--ink-soft); font-size: var(--text-secondary); font-weight: 400; } .catalogue-filter-bar select { min-height: 44px; padding: 0 40px 0 12px; -webkit-appearance: none; appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23496062' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-position: right 12px center; background-size: 16px 16px; background-repeat: no-repeat; } .catalogue-filter-bar .catalogue-filter-search { min-height: 44px; grid-column: auto; } .catalogue-works-reset { grid-column: 1 / -1; justify-self: end; min-height: 44px; } @media (forced-colors: active) { .catalogue-filter-bar select { appearance: auto; background-image: none; } } .catalogue-filter-search { display: grid; grid-template-columns: 24px minmax(0,1fr); align-items: center; padding: 0 9px; } .catalogue-filter-search > span:first-child { color: var(--coral-dark); font-size: 18px; } .catalogue-filter-search input { width: 100%; min-width: 0; height: 37px; border: 0; background: transparent; color: var(--ink); font-size: 10px; outline: 0; } .catalogue-filter-bar select:focus-visible, .channels-inventory-toolbar .filter-select:focus-visible, .diffusion-date-fields input:focus-visible, .diffusion-date-fields select:focus-visible, .catalogue-filter-search:focus-within { border-color: #286c70; outline: 3px solid rgba(40,108,112,.14); } .catalogue-filter-reset { min-height: 39px; padding: 0 11px; border: 0; border-radius: 10px; background: #fff1ed; color: var(--coral-dark); font-size: 9px; font-weight: 750; cursor: pointer; } .catalogue-filter-reset:hover { background: #ffe4dc; } .catalogue-works { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 11px; } .catalogue-works-empty { grid-column: 1 / -1; } .catalogue-works-empty .button { margin-top: 12px; } .catalogue-work-card { display: grid; grid-template-columns: 104px minmax(0,1fr); gap: 19px; padding: 16px; border: 1px solid var(--line); border-radius: 22px; background: var(--card); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; } .catalogue-work-card:hover { transform: translateY(-2px); border-color: rgba(241,118,95,.35); box-shadow: 0 14px 34px rgba(18,42,44,.07); } .catalogue-work-card:focus-visible { outline: 3px solid rgba(241,118,95,.3); outline-offset: 3px; border-color: var(--coral); } .catalogue-work-card .programme-poster-featured { width: 104px; border-radius: 13px; box-shadow: 0 3px 10px rgba(16,40,42,.08); } .catalogue-work-copy { display: flex; min-width: 0; flex-direction: column; padding: 7px 0 2px; } .catalogue-work-copy > strong { font-family: var(--font-work-title); font-size: var(--text-work-title); font-weight: 500; line-height: 1.12; letter-spacing: -.55px; } .catalogue-work-card .catalogue-work-meta { margin-top: 9px; font-size: 10px; line-height: 1.45; } .catalogue-work-copy .source-chips { margin-top: 10px; } .catalogue-work-copy .catalogue-provenance { max-width: min(100%, 360px); } .catalogue-work-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; margin-top: auto; padding-top: 10px; } .catalogue-work-card .catalogue-work-actions small { color: var(--ink-soft); font-size: var(--text-small); line-height: 1.4; } .catalogue-work-card .button-remove { font-size: var(--text-small); } .button-remove { min-height: 36px; padding: 0 9px; border: 0; border-radius: 8px; background: transparent; color: #9a6760; font-size: 9px; font-weight: 750; cursor: pointer; } .button-remove:hover { background: #fff1ee; color: var(--danger); } .button-remove:disabled { opacity: .45; cursor: not-allowed; } .client-catalogue-empty, .catalogue-scope-placeholder { display: grid; justify-items: center; align-content: center; min-height: 390px; padding: 42px 24px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--card); box-shadow: 0 8px 30px rgba(19,46,48,.035); text-align: center; } .client-catalogue-empty > span, .catalogue-scope-placeholder > span { display: grid; place-items: center; width: 58px; height: 58px; margin-bottom: 18px; border-radius: 18px; background: #ffe4dc; color: var(--coral-dark); font-size: 25px; } .catalogue-scope-placeholder > span { background: #dcf2e8; color: #287457; } .client-catalogue-empty h2, .catalogue-scope-placeholder h2 { margin: 0; font-family: Georgia, "Times New Roman", serif; font-size: clamp(26px,3vw,36px); font-weight: 500; letter-spacing: -1px; } .client-catalogue-empty p, .catalogue-scope-placeholder p { max-width: 620px; margin: 12px auto 22px; color: var(--ink-soft); font-size: 12px; line-height: 1.6; } .button-remove:focus-visible, .macro-catalogue-entry > button:focus-visible, .macro-catalogue-chip:focus-visible { outline: 3px solid rgba(241,118,95,.38); outline-offset: 2px; } .view-root { padding: 30px 34px 56px; } .loading-state, .error-state { min-height: 450px; display: grid; place-items: center; align-content: center; text-align: center; } .loading-state strong { margin-top: 18px; } .loading-state p, .error-state p { color: var(--ink-soft); font-size: 13px; } .loader-radar { position: relative; width: 58px; height: 58px; border: 1px solid #a8b8b4; border-radius: 50%; animation: pulse 1.8s ease infinite; } .loader-radar::before { content: ""; position: absolute; inset: 10px; border: 1px solid #a8b8b4; border-radius: 50%; } .loader-radar::after { content: ""; position: absolute; inset: 24px; border-radius: 50%; background: var(--coral); } .loader-radar i { position: absolute; width: 45%; height: 1px; top: 50%; left: 50%; transform-origin: left; background: var(--coral); animation: sweep 1.4s linear infinite; } @keyframes sweep { to { transform: rotate(360deg); } } @keyframes pulse { 50% { box-shadow: 0 0 0 14px rgba(241,118,95,.06); } } .error-state > span { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; background: #ffe0dc; color: var(--danger); font-weight: 850; } .error-state h2 { margin: 18px 0 0; font-family: Georgia, serif; font-size: 28px; } .page-heading { display: flex; align-items: flex-end; gap: 24px; margin-bottom: 24px; } .page-heading > div:first-child { min-width: 0; } .page-heading .eyebrow { margin-bottom: 9px; } .page-heading h1 { margin: 0; font-family: Georgia, "Times New Roman", serif; font-size: clamp(30px, 4vw, 44px); font-weight: 500; letter-spacing: -1.6px; } .page-heading h1 em { color: var(--coral); font-weight: inherit; } .page-heading p { margin: 9px 0 0; color: var(--ink-soft); font-size: 13px; line-height: 1.55; } .heading-actions { display: flex; gap: 8px; margin-left: auto; } .kpi-grid { display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: 12px; margin-bottom: 18px; } .kpi-grid-4 { grid-template-columns: repeat(4, minmax(0,1fr)); } .kpi-card { min-width: 0; padding: 17px; border: 1px solid var(--line); border-radius: 16px; background: var(--card); } .kpi-card small { display: block; min-height: 28px; color: var(--ink-soft); font-size: 10px; line-height: 1.35; } .kpi-card strong { display: block; margin: 6px 0 3px; font-family: Georgia, serif; font-size: 30px; font-weight: 500; letter-spacing: -1px; } .kpi-card span { color: #718082; font-size: 9px; } .kpi-card.is-highlight { border-color: rgba(241,118,95,.46); background: #fff7f3; } .kpi-card.is-highlight strong { color: var(--coral-dark); } .kpi-card-link { position: relative; width: 100%; color: var(--ink); font: inherit; text-align: left; cursor: pointer; } .kpi-card-link small { padding-right: 20px; } .kpi-card-link:hover { border-color: var(--coral); } .kpi-card-link:focus-visible { outline: 2px solid var(--coral); outline-offset: 3px; } .kpi-card-arrow { position: absolute; top: 17px; right: 17px; color: var(--coral-dark); font-style: normal; font-size: var(--text-secondary); } .dashboard-grid { display: grid; grid-template-columns: minmax(0,1.55fr) minmax(310px,.8fr); gap: 18px; } .panel { min-width: 0; border: 1px solid var(--line); border-radius: var(--radius); background: var(--card); box-shadow: 0 8px 30px rgba(19,46,48,.035); } .panel-head { display: flex; align-items: flex-start; gap: 18px; padding: 20px 21px 0; } .panel-head h2 { margin: 0; font-size: 14px; } .panel-head p { margin: 5px 0 0; color: var(--ink-soft); font-size: 10px; } .panel-head .panel-action { margin-left: auto; border: 0; background: transparent; color: var(--coral-dark); font-size: 10px; font-weight: 750; cursor: pointer; } .catalogue-overview-panels .panel-head { box-sizing: border-box; padding: 20px; border-bottom: 1px solid var(--line); flex-wrap: wrap; align-items: center; } .catalogue-overview-panels .panel-head > div { flex: 1; min-width: 0; } .catalogue-overview-panels .panel-head h2 { line-height: 1.4; } .catalogue-overview-panels .panel-head p { margin-top: 6px; line-height: 1.5; } .catalogue-overview-panels .panel-head .panel-action { flex: 0 1 auto; max-width: 100%; min-height: 44px; padding: 8px 0; line-height: 1.4; text-align: left; } .catalogue-overview-panels .channel-ranking-head { padding-inline: 20px; } .catalogue-overview-panels .overview-kpis { grid-template-columns: repeat(4,minmax(0,1fr)); } .catalogue-overview-panels .overview-kpis .kpi-card { grid-column: auto; } .catalogue-overview-panels .catalogue-ranking-grid { grid-template-columns: repeat(2,minmax(0,1fr)); align-items: start; } .catalogue-programming-grid > .panel > .panel-head { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,42%); align-items: start; gap: 12px; } .catalogue-programming-grid > .panel > .panel-head .panel-action { justify-self: end; margin-left: 0; padding-top: 0; text-align: right; overflow-wrap: anywhere; } .overview-upcoming-panel { margin-top: 0; } .overview-hourly-panel { margin-top: 18px; } .overview-work-frequency { margin-top: 18px; } .catalogue-overview-panels .overview-work-frequency > .panel-head { padding-block: 12px; } .overview-work-frequency > .group-ranking-note { padding-block: 10px; } .overview-work-frequency .work-frequency-table { min-width: 0; table-layout: fixed; } .work-frequency-table thead th { padding-block: 8px; } .work-frequency-table thead th:first-child { width: 50%; } .work-frequency-table th:not(:first-child), .work-frequency-table td { text-align: right; font-variant-numeric: tabular-nums; } .work-frequency-table tbody th { position: static; padding: 0 16px; background: transparent; color: var(--ink); font-size: var(--text-secondary); font-weight: 500; text-transform: none; letter-spacing: normal; border-bottom: 1px solid #edf0ec; } .work-frequency-table tbody td { padding: 6px 16px; color: var(--ink); font-weight: 600; } .work-frequency-table .catalogue-ranking-link { min-height: 44px; width: 100%; } .catalogue-overview-panels .overview-upcoming-grid { grid-template-columns: minmax(0,1fr); gap: 0; } .overview-upcoming-grid > .empty-state { grid-column: 1 / -1; } .overview-upcoming-grid .upcoming-item { min-height: 0; padding: 14px 0; } .overview-upcoming-grid .upcoming-item:last-child { border-bottom: 0; } .overview-upcoming-grid .upcoming-channel-line { flex-wrap: wrap; row-gap: 8px; } .overview-history-panel .chart-wrap { padding-top: 34px; padding-bottom: 40px; } .overview-history-panel .chart-wrap:focus-visible { outline: 2px solid var(--ink); outline-offset: -4px; } .overview-history-panel .annual-history { min-width: 740px; } .overview-history-panel .annual-history-plot { min-height: 340px; } .overview-history-panel .bar-column > span small { display: none; } @media (max-width: 1180px) { .catalogue-overview-panels .overview-kpis { grid-template-columns: repeat(2,minmax(0,1fr)); } } @media (max-width: 860px) { .catalogue-overview-panels .catalogue-ranking-grid { grid-template-columns: minmax(0,1fr); } } .chart-panel { display: flex; min-height: 334px; flex-direction: column; } .chart-wrap { flex: 1; min-height: 245px; padding: 22px 20px 36px; } .chart-wrap-with-works { display: grid; padding-bottom: 54px; overflow-x: auto; } .annual-history { --works-line: #367b80; display: grid; min-width: 820px; } .annual-history-legend { display: flex; justify-content: space-between; gap: 20px; margin-bottom: 28px; color: var(--ink-soft); font-size: var(--text-micro); } .annual-history-legend > span { display: inline-flex; align-items: center; gap: 7px; } .annual-history-bar-key { width: 10px; height: 14px; border-radius: 3px 3px 0 0; background: var(--coral); } .annual-history-line-key { position: relative; width: 24px; height: 3px; background: var(--works-line); } .annual-history-line-key::after { position: absolute; top: -3px; left: 9px; width: 9px; height: 9px; border: 2px solid var(--works-line); border-radius: 50%; background: var(--card); content: ""; } .annual-history-grid { display: grid; grid-template-columns: 46px minmax(0,1fr) 40px; gap: 10px; } .annual-history-axis { position: relative; color: var(--ink-soft); font-size: var(--text-micro); font-variant-numeric: tabular-nums; } .annual-history-axis > span { position: absolute; right: 0; transform: translateY(-50%); } .annual-history-axis-works { color: var(--works-line); } .annual-history-axis-works > span { right: auto; left: 0; } .annual-history-plot { position: relative; display: grid; grid-template-columns: repeat(var(--history-years),minmax(0,1fr)); min-height: 300px; border-bottom: 1px solid var(--line); background: repeating-linear-gradient(to top, transparent 0, transparent calc(var(--history-grid-step) - 1px), rgba(16,42,44,.07) calc(var(--history-grid-step) - 1px), rgba(16,42,44,.07) var(--history-grid-step)); } .annual-history-line { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; } .annual-history-line path { fill: none; stroke: var(--works-line); stroke-width: 1.25px; stroke-linejoin: round; stroke-linecap: round; } .annual-history-point { position: absolute; z-index: 1; display: grid; place-items: center; width: 24px; height: 24px; transform: translate(-50%,-50%); border-radius: 50%; } .annual-history-point::before { width: 5px; height: 5px; border-radius: 50%; background: var(--works-line); content: ""; } .annual-history-point-value { position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); padding: 1px 3px; color: #fff; font-size: var(--text-micro); font-weight: 500; line-height: 1.2; font-variant-numeric: tabular-nums; white-space: nowrap; pointer-events: none; } .annual-history-point:focus-visible { outline: 2px solid var(--works-line); outline-offset: 2px; } .bar-column { flex: 1; min-width: 0; height: 100%; display: flex; align-items: flex-end; justify-content: center; position: relative; } .bar-column i { position: relative; width: min(28px,70%); overflow: hidden; border-radius: 7px 7px 2px 2px; background: linear-gradient(180deg, var(--coral), #f6ab98); transition: height .35s ease; } .bar-column span { position: absolute; top: 100%; margin-top: 8px; color: #667a7c; font-size: 9px; font-weight: 650; font-variant-numeric: tabular-nums; white-space: nowrap; } .bar-column > span { text-align: center; } .bar-column > span small { display: block; margin-top: 4px; color: var(--ink-soft); font-size: var(--text-micro); font-weight: 500; } .bar-column b { position: absolute; left: 50%; bottom: calc(var(--bar-height) + 5px); transform: translateX(-50%); color: var(--ink); font-size: 9px; font-weight: 800; font-variant-numeric: tabular-nums; text-align: center; white-space: nowrap; } .bar-column b small { display: block; margin-top: 2px; color: #53696b; font-size: 7px; font-weight: 650; white-space: nowrap; } .bar-column.is-projected i { border: 1px solid rgba(241,118,95,.72); background: repeating-linear-gradient(135deg, rgba(241,118,95,.26) 0 4px, rgba(241,118,95,.08) 4px 8px); } .bar-column.is-projected i::after { position: absolute; right: 0; bottom: 0; left: 0; height: var(--observed-share); background: linear-gradient(180deg, var(--coral), #f6ab98); content: ""; } .bar-column.is-projected b { color: var(--coral-dark); } .upcoming-list { display: grid; padding: 11px 20px 20px; } .upcoming-item { display: grid; grid-template-columns: 52px minmax(0,1fr); grid-template-areas: "poster copy" "poster context"; column-gap: 14px; row-gap: 8px; align-items: start; min-height: 108px; padding: 14px 0; border-bottom: 1px solid #edf0ec; } .upcoming-item:last-child { border-bottom: 0; } .upcoming-copy { grid-area: copy; min-width: 0; } .upcoming-title { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; color: var(--ink); font-size: 11px; line-height: 1.3; } .upcoming-channel-line { display: flex; align-items: center; gap: 5px; min-width: 0; margin: 5px 0 0; color: var(--ink-soft); font-size: 9px; } .upcoming-channel-line > .channel-day-link, .upcoming-channel-line > .channel-identity { flex: 0 1 auto; min-width: 0; max-width: 100%; } .upcoming-channel-line .channel-identity { max-width: 100%; } .upcoming-channel-line .channel-identity-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; } .upcoming-episode-detail { min-width: 0; margin: 5px 0 0; color: var(--ink-soft); font-size: var(--text-label); white-space: normal; overflow-wrap: anywhere; line-height: 1.5; } .upcoming-context { grid-area: context; display: flex; align-items: center; justify-content: flex-start; flex-wrap: wrap; min-width: 0; gap: 6px 10px; color: var(--ink-soft); font-size: 8px; } .upcoming-context > .upcoming-channel-line { flex-basis: 100%; margin: 0; } @media screen and (min-width: 861px) { .upcoming-context > .upcoming-channel-line { flex: 0 1 auto; max-width: 100%; } .upcoming-context .upcoming-channel-line .channel-identity-name { white-space: normal; overflow-wrap: anywhere; } } .upcoming-context > span, .upcoming-context > strong, .upcoming-context > small { white-space: nowrap; } .upcoming-context > small { color: var(--ink-soft); font-size: 8px; } .top-programmed-item { width: 100%; grid-template-columns: 52px minmax(0,1fr) auto; grid-template-areas: "poster copy count"; align-items: center; border: 0; border-bottom: 1px solid #edf0ec; background: transparent; color: var(--ink); font: inherit; text-align: left; cursor: pointer; } .top-programmed-item:hover .upcoming-title { color: var(--coral-dark); } .top-programmed-item:focus-visible { outline: 2px solid var(--coral); outline-offset: 3px; border-radius: 9px; } .top-programmed-meta { display: block; margin-top: 6px; color: var(--ink-soft); font-size: var(--text-label); line-height: 1.55; white-space: pre-line; } .top-programmed-count { grid-area: count; text-align: right; font-variant-numeric: tabular-nums; } .top-programmed-count strong { display: block; font-size: var(--text-secondary); } .top-programmed-count small { display: block; margin-top: 4px; color: var(--ink-soft); font-size: var(--text-micro); } .empty-state { padding: 42px 24px; text-align: center; color: var(--ink-soft); } .empty-state strong { display: block; color: var(--ink); } .empty-state p { font-size: 11px; } .secondary-grid { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(280px,.8fr); gap: 18px; margin-top: 18px; } .compact-table { width: 100%; border-collapse: collapse; } .compact-table th { padding-inline: 18px; text-align: left; } .compact-table td { padding: 13px 18px; border-bottom: 1px solid #edf0ec; font-size: 10px; } .compact-table tr:last-child td { border-bottom: 0; } .compact-table tbody tr { cursor: pointer; } .compact-table tbody tr:hover { background: #faf9f4; } .title-cell { min-width: 225px; } .programme-with-poster { display: grid; grid-template-columns: 46px minmax(0,1fr); gap: 11px; align-items: center; min-width: 0; } .programme-with-poster-copy { min-width: 0; } .programme-with-poster-copy strong { display: block; max-width: 360px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ink); font-family: var(--font-work-title); font-size: 11px; font-weight: 500; line-height: 1.25; } .programme-with-poster-copy > span { display: block; margin-top: 3px; overflow: hidden; color: var(--ink-soft); font-size: 9px; white-space: pre-line; } .insight-list { display: grid; gap: 10px; padding: 16px 20px 20px; } .insight { display: flex; gap: 12px; padding: 12px; border-radius: 13px; background: #f4f6f2; } .insight-icon { display: grid; place-items: center; flex: 0 0 auto; width: 29px; height: 29px; border-radius: 9px; background: #fff; color: var(--coral-dark); } .insight strong { display: block; font-size: 10px; } .insight p { margin: 4px 0 0; color: var(--ink-soft); font-size: 9px; line-height: 1.45; } .channel-ranking-panel { margin-top: 18px; } .catalogue-ranking-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } .catalogue-ranking-grid .channel-ranking-panel { margin-top: 0; } .catalogue-ranking-grid .channel-ranking-list { grid-template-columns: 1fr; } .catalogue-signal-grid { align-items: start; } .catalogue-signal-grid > :only-child { grid-column: 1 / -1; } .catalogue-signal-grid .channel-ranking-item { grid-template-columns: minmax(0,1.1fr) minmax(50px,.7fr) 64px; } .catalogue-ranking-label, .catalogue-ranking-provider { min-width: 0; font-size: var(--text-label); color: var(--ink); } .catalogue-ranking-label small { display: block; margin-top: 4px; color: var(--ink-soft); font-size: var(--text-micro); } .catalogue-ranking-link { padding: 0; border: 0; background: transparent; color: var(--ink); font: inherit; font-weight: 750; text-align: left; cursor: pointer; overflow-wrap: anywhere; } .catalogue-ranking-link span { color: var(--coral-dark); } .catalogue-ranking-link:hover { color: var(--coral-dark); } .catalogue-ranking-link:focus-visible { outline: 2px solid var(--coral); outline-offset: 4px; border-radius: 3px; } .catalogue-ranking-provider { display: flex; align-items: center; gap: 9px; } .catalogue-ranking-provider strong { min-width: 0; overflow-wrap: anywhere; } .catalogue-ranking-logo { display: grid; place-items: center; flex: 0 0 34px; width: 34px; height: 34px; padding: 3px; box-sizing: border-box; border: 1px solid var(--line); border-radius: 8px; background: #fff; font-size: var(--text-micro); } .catalogue-ranking-logo img { display: block; width: 100%; height: 100%; object-fit: contain; } .catalogue-perimeter-panel { margin-top: 18px; } .catalogue-overview-panels .catalogue-perimeter-panel .panel-head { min-height: 0; padding: 20px 20px 0; border-bottom: 0; } .perimeter-countries { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 18px; margin: 0 20px; padding: 20px 0; border-bottom: 1px solid var(--line); } .perimeter-metrics { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); margin: 0; padding: 22px 20px; } .perimeter-metrics > div { min-width: 0; padding: 0 22px; border-left: 1px solid var(--line); } .perimeter-metrics > div:first-child { padding-left: 0; border-left: 0; } .perimeter-metrics > div:last-child { padding-right: 0; } .perimeter-metrics dt { color: var(--ink-soft); font-size: var(--text-small); font-weight: 650; line-height: 1.5; } .perimeter-metrics dd { margin: 8px 0 0; } .perimeter-metrics dd strong { display: block; color: var(--ink); font-size: 28px; font-weight: 750; font-variant-numeric: tabular-nums; line-height: 1.2; } .perimeter-metrics dd small { display: block; margin-top: 8px; color: var(--ink-soft); font-size: var(--text-small); line-height: 1.5; } .perimeter-countries > div:first-child strong { display: block; color: var(--ink); } .perimeter-countries > div:first-child p { margin: 2px 0 0; color: var(--ink-soft); font-size: .86rem; } .perimeter-countries > div:first-child small { display: block; margin-top: 3px; color: var(--coral-dark); font-size: .78rem; font-weight: 700; } .perimeter-country-list { display: flex; flex-wrap: nowrap; justify-content: flex-end; gap: 7px; } .perimeter-country-option { display: inline-flex; align-items: center; gap: 7px; min-height: 44px; padding: 8px 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--card); color: var(--ink); font: inherit; text-align: left; cursor: pointer; transition: border-color .16s ease, background .16s ease, box-shadow .16s ease, transform .16s ease; } .perimeter-country-option:hover:not(:disabled) { border-color: #f5a99d; box-shadow: 0 5px 14px rgba(18, 49, 48, .08); transform: translateY(-1px); } .perimeter-country-option:focus-visible { outline: 3px solid rgba(246, 113, 94, .24); outline-offset: 2px; } .perimeter-country-option.is-selected { border-color: #f39a8c; background: #fff3ef; box-shadow: inset 0 0 0 1px rgba(246, 113, 94, .12); } .perimeter-country-option:disabled { cursor: default; } .perimeter-country-option strong { color: var(--ink); font-size: .84rem; line-height: 1; } .perimeter-country-emoji { font-size: 1.05rem; line-height: 1; } .perimeter-country-check { display: grid; width: 0; height: 18px; margin-left: -7px; overflow: hidden; place-items: center; border-radius: 50%; background: var(--coral); color: #fff; font-size: .68rem; font-weight: 900; opacity: 0; transform: scale(.72); transition: width .16s ease, margin .16s ease, opacity .16s ease, transform .16s ease; } .perimeter-country-option.is-selected .perimeter-country-check { width: 18px; margin-left: 1px; opacity: 1; transform: scale(1); } .data-coverage { overflow: hidden; } .data-coverage-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 16px 20px 10px; } .data-coverage-head h2 { margin: 0; font-size: 14px; } .data-coverage-head p { margin: 4px 0 0; color: var(--ink-soft); font-size: 10px; line-height: 1.45; } .data-coverage-facts { display: grid; grid-template-columns: repeat(auto-fit,minmax(150px,1fr)); gap: 1px; margin: 0; padding: 0 20px 16px; background: var(--line); } .data-coverage-fact { min-width: 0; padding: 12px 14px; background: #f8f8f4; } .data-coverage-fact dt { color: #788788; font-size: 9px; font-weight: 750; letter-spacing: .05em; line-height: 1.35; text-transform: uppercase; } .data-coverage-fact dd { margin: 5px 0 0; color: var(--ink); font-size: 11px; font-variant-numeric: tabular-nums; font-weight: 750; line-height: 1.4; } .data-coverage-fact small { display: block; margin-top: 4px; color: var(--ink-soft); font-size: 8px; line-height: 1.4; } .data-coverage-disclaimer { margin: 0; padding: 10px 20px 13px; border-top: 1px solid var(--line); color: var(--ink-soft); font-size: 9px; line-height: 1.5; } .data-coverage--catalogue .insight-list { border-top: 1px solid var(--line); } .data-coverage--footer { margin-top: 14px; border: 1px solid var(--line); border-radius: 16px; background: rgba(255,254,250,.72); } .data-coverage--footer .data-coverage-head { padding: 20px 20px 14px; } .data-coverage--footer .data-coverage-head h2 { margin: 0; font-family: inherit; font-size: 18px; font-weight: 700; line-height: 1.35; } .data-coverage--footer .data-coverage-head p { font-size: 8px; } .data-coverage--footer .data-coverage-facts { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: 10px; padding: 0 20px 20px; background: transparent; } .data-coverage--footer .data-coverage-fact { display: grid; grid-template-rows: 1fr auto; min-width: 0; padding: 14px; border: 1px solid var(--line); border-radius: 11px; background: #f8f8f4; } .data-coverage--footer .data-coverage-fact dt { min-height: 2.7em; color: var(--ink-soft); font-size: var(--text-micro); font-weight: 650; letter-spacing: .03em; } .data-coverage--footer .data-coverage-fact dd { margin-top: 8px; font-size: var(--text-small); line-height: 1.5; overflow-wrap: anywhere; } .data-coverage--footer .data-coverage-disclaimer { position: relative; padding: 10px 17px 11px 42px; background: #fbfbf8; font-size: 8px; } .data-coverage--footer .data-coverage-disclaimer::before { content: "i"; position: absolute; top: 9px; left: 17px; display: grid; width: 17px; height: 17px; place-items: center; border: 1px solid #b8c3bd; border-radius: 50%; color: var(--ink-soft); font-family: Georgia, serif; font-size: 10px; } .macro-data-footer { margin-top: 18px; } .work-data-footer { margin-top: 0; } .report-data-footer { margin-top: 28px; } .channel-ranking-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 0; padding-inline: 20px; } .channel-ranking-head > span:last-child { text-align: right; } /* En-têtes de colonnes communs aux listes, tableaux et rapports publics. */ .compact-table thead th, .data-table thead th, .macro-table thead th, .channel-ranking-head { padding-block: 8px; border-bottom: 1px solid var(--line); background: #f7f7f2; color: #738182; font-size: var(--text-label); font-weight: 700; line-height: 1.4; letter-spacing: .06em; text-transform: uppercase; } .channel-ranking-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1px 22px; margin: 0; padding: 0 20px 20px; list-style: none; } .channel-ranking-item { display: grid; grid-template-columns: minmax(150px,.85fr) minmax(100px,1.15fr) 58px; gap: 10px; align-items: center; min-height: 58px; } .channel-ranking-item:nth-child(n+3), .catalogue-ranking-grid .channel-ranking-item + .channel-ranking-item, .report-channel-ranking-list .channel-ranking-item + .channel-ranking-item, .work-detail-channel-ranking-list .channel-ranking-item + .channel-ranking-item { border-top: 1px solid #edf0ec; } .channel-ranking-track { display: block; height: 7px; overflow: hidden; border-radius: 999px; background: #edf1ed; } .channel-ranking-track i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg,var(--coral),#f5a18e); } .channel-ranking-metric { text-align: right; font-variant-numeric: tabular-nums; } .channel-ranking-metric strong { display: block; color: var(--ink); font-size: 11px; } .channel-ranking-metric small { display: block; margin-top: 2px; color: var(--ink-soft); font-size: 8px; } .group-ranking-note { margin: 0; padding: 14px 20px; border-top: 1px solid var(--line); color: var(--ink-soft); font-size: var(--text-small); line-height: 1.5; } .filter-select { min-height: 42px; padding: 0 34px 0 12px; border: 1px solid var(--line); border-radius: 12px; background: var(--card); color: var(--ink-soft); font-size: 10px; } .data-table-wrap { overflow: auto; border: 1px solid var(--line); border-radius: var(--radius); background: var(--card); } .data-table { width: 100%; border-collapse: collapse; min-width: 780px; } .data-table th { position: sticky; top: 0; z-index: 1; padding-inline: 16px; text-align: left; } .data-table td { padding: 14px 16px; border-bottom: 1px solid #edf0ec; font-size: 10px; } .data-table tbody tr { cursor: pointer; } .data-table tbody tr:hover { background: #fcfaf5; } .data-table-static tbody tr { cursor: default; } .data-table tbody tr:last-child td { border-bottom: 0; } .metric { font-variant-numeric: tabular-nums; font-weight: 750; } .muted { color: var(--ink-soft); } .table-title { max-width: 340px; } .table-title strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; } .table-title span { display: block; margin-top: 3px; color: var(--ink-soft); font-size: 9px; } .table-title-button { display: block; width: 100%; padding: 0; border: 0; background: transparent; color: inherit; text-align: left; cursor: pointer; } .table-title-button:focus-visible { border-radius: 5px; outline: 2px solid var(--coral); outline-offset: 4px; } .programme-poster { position: relative; display: block; flex: 0 0 auto; width: 44px; aspect-ratio: 2 / 3; overflow: hidden; border: 1px solid #dce3de; border-radius: 8px; background: linear-gradient(145deg, #173638, #10282a); box-shadow: 0 5px 14px rgba(16,40,42,.12); } .programme-poster img { position: absolute; z-index: 2; inset: 0; display: block; width: 100%; height: 100%; background: #eef1ed; object-fit: contain; } .programme-poster.is-missing img { display: none; } .programme-poster > .poster-fallback { position: absolute; z-index: 1; inset: 0; display: flex; width: 100%; height: 100%; align-items: center; justify-content: center; margin: 0; padding: 0; color: #f6c6ba; font-family: Georgia, serif; font-size: 13px; font-weight: 700; line-height: 1; letter-spacing: -.3px; text-align: center; } .programme-poster-drawer { width: 132px; border-radius: 13px; box-shadow: 0 14px 34px rgba(16,40,42,.2); } .programme-poster-drawer .poster-fallback { font-size: 28px; } .programme-poster-upcoming { grid-area: poster; width: 52px; border-radius: 9px; box-shadow: 0 7px 18px rgba(16,40,42,.16); } .programme-poster-upcoming .poster-fallback { font-size: 15px; } .programme-with-poster-featured { grid-template-columns: 52px minmax(0,1fr); gap: 12px; } .programme-with-poster-featured .programme-with-poster-copy strong { font-size: var(--text-secondary); letter-spacing: -.15px; } .programme-with-poster-featured .programme-with-poster-copy > span { margin-top: 6px; line-height: 1.55; } .programme-poster-featured { width: 52px; border-radius: 9px; box-shadow: 0 7px 18px rgba(16,40,42,.15); } .programme-poster-featured .poster-fallback { font-size: 15px; } .programme-poster-compact { width: 46px; border-radius: 8px; box-shadow: 0 6px 15px rgba(16,40,42,.13); } .programme-poster-compact .poster-fallback, .programme-poster-alert .poster-fallback { font-size: 11px; } .programme-poster-alert { width: 52px; border-radius: 9px; box-shadow: 0 7px 18px rgba(16,40,42,.14); } /* Système visuel partagé : œuvre éditoriale (A), événements modulaires (B). */ .work-card--editorial { position: relative; overflow: hidden; } .work-identity { min-width: 0; } .work-row--modular { position: relative; } .view-root [data-programme] { cursor: pointer; } .airing-table-wrap { max-height: none; border-radius: var(--radius) var(--radius) 0 0; } .airing-table { min-width: 800px; } .airing-table th { position: static; z-index: auto; box-shadow: none; } .airing-table td { padding-top: 13px; padding-bottom: 13px; vertical-align: middle; } .airing-table tbody tr { cursor: pointer; transition: background-color .15s ease; } .airing-table tbody tr:hover, .airing-table tbody tr:focus-within { background: #f5f7f3; } .airing-row td { vertical-align: middle; } .airing-work-cell { width: 38%; min-width: 260px; } .airing-work-cell .programme-with-poster { display: grid; grid-template-columns: 46px minmax(0,1fr); gap: 14px; align-items: center; margin-top: 0; } .airing-work-cell .programme-with-poster > span { margin-top: 0; } .airing-work-cell .programme-poster-compact { width: 46px; border-radius: 7px; box-shadow: 0 3px 8px rgba(16,40,42,.1); } .airing-work-cell .programme-with-poster-copy strong { max-width: none; white-space: normal; overflow-wrap: anywhere; line-height: 1.45; } .airing-work-cell .programme-with-poster-copy > span { margin-top: 4px; line-height: 1.4; } .airing-work-cell .table-title-button:hover strong { color: var(--coral-dark); } .airing-channel-cell { width: 25%; min-width: 180px; } .airing-channel-cell .channel-day-link { align-items: center; } .airing-channel-cell .channel-identity { align-items: center; flex-direction: row; gap: 10px; } .airing-channel-cell .channel-identity-name { white-space: normal; line-height: 1.4; font-size: var(--text-small); font-weight: 600; } .airing-time-slot { display: grid; grid-template-columns: 5ch max-content; align-items: center; gap: 10px; } .airing-time-slot > strong { white-space: nowrap; } .airing-time-slot > .restricted-value { grid-column: 1 / -1; } .airing-time-slot .slot-chip { white-space: nowrap; } .airing-row .channel-logo-frame { --channel-logo-size: 36px; border-radius: 8px; } .work-airing-table { min-width: 600px; } .work-airing-table .airing-channel-cell { width: 45%; } .work-airing-table .airing-date-cell { width: 25%; } .work-airing-table tbody tr { cursor: default; } .work-airing-episode { display: block; margin: 0 0 6px; color: var(--ink-soft); font-size: var(--text-small); line-height: 1.4; overflow-wrap: anywhere; } .airing-work-type { font-weight: 600; } .airing-work-type--film { color: var(--export-blue); } .airing-work-type--serie { color: color-mix(in srgb,var(--danger) 85%,var(--ink)); } .work-diffusions-table-region { min-width: 0; } .work-diffusions-table-region .airing-table-wrap { border: 0; border-radius: 0; } .report-airing-row td { vertical-align: middle; } .macro-layout { display: grid; grid-template-columns: minmax(0,1fr) 300px; gap: 18px; align-items: start; } .macro-catalogues-panel { min-width: 0; overflow: hidden; } .macro-table-wrap { overflow-x: auto; } .macro-table { width: 100%; min-width: 860px; border-collapse: collapse; } .macro-table th { padding-inline: 14px; text-align: left; } .macro-table td { padding: 14px; border-bottom: 1px solid #edf0ec; color: var(--ink-soft); font-size: 9px; vertical-align: middle; } .macro-table tbody tr:last-child td { border-bottom: 0; } .macro-table tbody tr:hover { background: #fcfaf5; } .macro-catalogue-name { min-width: 180px; } .macro-catalogue-entry { display: flex; align-items: center; gap: 10px; } .macro-catalogue-entry > button { display: grid; flex: 1; min-width: 0; grid-template-columns: 42px minmax(0,1fr); gap: 10px; align-items: center; padding: 0; border: 0; background: transparent; color: var(--ink); text-align: left; cursor: pointer; } .catalogue-order-controls { display: inline-flex; flex: none; gap: 2px; } .macro-catalogue-order { width: 90px; text-align: right; white-space: nowrap; } .catalogue-order-controls button { width: 44px; height: 44px; padding: 0; border: 0; border-radius: 6px; background: transparent; color: var(--ink-soft); font: inherit; font-size: 16px; cursor: pointer; } .catalogue-order-controls button:hover:not(:disabled) { color: var(--coral-dark); background: #f3f5f1; } .catalogue-order-controls button:focus-visible { outline: 2px solid var(--coral); outline-offset: 2px; } .catalogue-order-controls button:disabled { opacity: .35; cursor: default; } .macro-catalogue-name .catalogue-switcher-avatar { width: 42px; height: 42px; } .macro-catalogue-name strong, .macro-catalogue-name small { display: block; white-space: normal; overflow-wrap: anywhere; } .macro-catalogue-name strong { font-size: 11px; } .macro-catalogue-name small { margin-top: 4px; color: var(--coral-dark); font-size: 8px; } .macro-coverage-value { display: block; color: var(--ink); font-size: 9px; } .macro-coverage-bar { display: block; width: 74px; height: 4px; margin-top: 6px; overflow: hidden; border-radius: 999px; background: #e4eae5; } .macro-coverage-bar i { display: block; height: 100%; border-radius: inherit; background: var(--mint); } .macro-upcoming-value { color: var(--coral-dark) !important; } .macro-next { min-width: 190px; } .macro-next > strong, .macro-next > span { display: block; } .macro-next > strong { color: var(--ink); font-size: var(--text-body); white-space: normal; overflow-wrap: anywhere; } .macro-next > span { margin-top: 4px; color: var(--ink-soft); font-size: 8px; } .macro-attention-badge, .macro-ok { display: inline-flex; align-items: center; min-height: 24px; padding: 0 8px; border-radius: 999px; font-size: 8px; font-weight: 750; white-space: nowrap; } .macro-attention-badge { background: #fff0e7; color: #9a5a37; } .macro-ok { background: #eaf7f0; color: #287457; } .macro-attention { overflow: hidden; } .macro-signal-list { display: grid; gap: 9px; padding: 16px 20px 20px; } .macro-signal { display: flex; gap: 11px; padding: 12px; border-radius: 13px; background: #f3f6f2; } .macro-signal > span { display: grid; place-items: center; flex: 0 0 30px; width: 30px; height: 30px; border-radius: 9px; background: #fff; color: var(--ink-soft); font-weight: 800; } .macro-signal.is-warning > span { background: #fff0e7; color: #a45d35; } .macro-signal.is-success > span { background: #e7f6ef; color: #287457; } .macro-signal strong { display: block; font-size: 9px; } .macro-signal p { margin: 4px 0 0; color: var(--ink-soft); font-size: 8px; line-height: 1.45; } .macro-upcoming-panel { margin-top: 18px; overflow: hidden; } .macro-upcoming-table { min-width: 850px; } .macro-upcoming-table .airing-work-cell { width: 32%; } .macro-upcoming-table .airing-channel-cell { width: 22%; } .macro-upcoming-table tbody tr { cursor: default; } .macro-catalogue-chips { display: flex; flex-wrap: wrap; gap: 5px; } .macro-catalogue-chip { min-height: 44px; max-width: 100%; padding: 8px 12px; border: 1px solid var(--line); border-radius: 12px; background: var(--card); color: var(--ink-soft); font-size: var(--text-small); font-weight: 700; overflow-wrap: anywhere; cursor: pointer; } .macro-catalogue-chip:hover { border-color: var(--coral); color: var(--coral-dark); } .catalogue-macro-page .kpi-grid { grid-template-columns: repeat(4,minmax(0,1fr)); } .catalogue-macro-page .kpi-grid .kpi-card { grid-column: auto; } .catalogue-macro-page .macro-table td { font-size: var(--text-body); line-height: 1.5; } .catalogue-macro-page .macro-next strong, .catalogue-macro-page .macro-coverage-value { font-size: var(--text-body); } .macro-unlinked { display: block; margin-top: 6px; color: var(--ink-soft); font-size: var(--text-small); } .macro-cell-label, .macro-heading-mobile, .macro-coverage-mobile, .macro-next .macro-cell-label { display: none; } @media screen and (max-width: 1180px) { .catalogue-macro-page .kpi-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } } @media screen and (max-width: 860px) { .macro-heading .page-heading { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin-bottom: 16px; } .macro-heading .page-heading h1 { font-family: inherit; font-size: 26px; font-weight: 750; letter-spacing: -.6px; line-height: 1.2; } .macro-heading .page-heading p, .macro-heading-desktop { display: none; } .macro-heading-mobile { display: inline; } .macro-heading .heading-actions { margin: 0 0 0 auto; } .macro-heading .heading-actions .button { min-height: 44px; padding: 10px 12px; font-size: var(--text-small); } .catalogue-macro-page .kpi-grid { gap: 8px; } .catalogue-macro-page .kpi-card { padding: 12px; border-radius: 12px; } .catalogue-macro-page .kpi-card small { min-height: 32px; font-size: var(--text-label); } .catalogue-macro-page .kpi-card strong { margin: 4px 0 0; font-family: inherit; font-size: 26px; font-weight: 750; letter-spacing: -.5px; line-height: 1.2; } .catalogue-macro-page .kpi-card > span, .catalogue-macro-page .macro-catalogues-panel > .panel-head p { display: none; } .catalogue-macro-page .panel-head { padding: 16px; } .catalogue-macro-page .panel-head p { margin-top: 4px; font-size: var(--text-small); line-height: 1.4; } .catalogue-macro-page .macro-table-wrap { overflow: visible; } .catalogue-macro-page .macro-table, .catalogue-macro-page .macro-upcoming-table { display: block; min-width: 0; } .catalogue-macro-page .macro-table thead { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; } .catalogue-macro-page .macro-table tbody { display: block; } .catalogue-macro-page .macro-table tbody tr { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; padding: 20px; border-bottom: 1px solid var(--line); } .catalogue-macro-page .macro-table tbody tr:last-child { border-bottom: 0; } .catalogue-macro-page .macro-table td { display: block; width: auto; min-width: 0; padding: 0; border: 0; white-space: normal; } .catalogue-macro-page .macro-cell-label { display: block; margin: 0 0 6px; color: var(--ink-soft); font-size: var(--text-label); font-weight: 600; } .catalogue-macro-page .macro-catalogue-name, .catalogue-macro-page .macro-next, .catalogue-macro-page .airing-work-cell, .catalogue-macro-page .airing-channel-cell, .catalogue-macro-page .macro-catalogues-cell, .catalogue-macro-page td.empty-state { grid-column: 1 / -1; } .catalogue-macro-page .macro-catalogue-entry > button { min-height: 44px; } .catalogue-macro-page .macro-next { padding-top: 12px; border-top: 1px solid var(--line); } .catalogue-macro-page .airing-time-slot { grid-template-columns: 5ch minmax(0,1fr); gap: 10px; } .catalogue-macro-page .airing-channel-cell .channel-identity-name { white-space: normal; overflow-wrap: anywhere; } .catalogue-macro-page .macro-upcoming-panel > .macro-table-wrap { display: none; } .catalogue-macro-page .macro-table tbody tr { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px 12px; padding: 14px 16px; } .catalogue-macro-page .macro-table .macro-catalogue-name { grid-row: 1; } .catalogue-macro-page .macro-table tr:has(.macro-catalogue-order) .macro-catalogue-name { padding-right: 100px; } .catalogue-macro-page .macro-table .macro-catalogue-order { grid-column: 1 / -1; grid-row: 1; justify-self: end; align-self: center; } .catalogue-macro-page .macro-table .macro-catalogue-entry > button { grid-template-columns: 42px minmax(0,1fr) 20px; } .catalogue-macro-page .macro-table .macro-catalogue-entry > button::after { content: '→'; color: var(--coral-dark); font-size: 20px; text-align: right; } .catalogue-macro-page .macro-table .macro-catalogue-name small { display: none; } .catalogue-macro-page .macro-table td.metric { grid-row: 2; color: var(--ink); font-size: 20px; font-weight: 750; font-variant-numeric: tabular-nums; } .catalogue-macro-page .macro-table td.metric .macro-cell-label { min-height: 32px; margin-bottom: 2px; line-height: 1.3; } .catalogue-macro-page .macro-table .macro-tv-coverage { grid-column: 1 / -1; grid-row: 3; font-size: var(--text-small); } .catalogue-macro-page .macro-table .macro-tv-coverage > :not(.macro-coverage-mobile) { display: none; } .catalogue-macro-page .macro-table .macro-coverage-mobile { display: block; } .catalogue-macro-page .macro-table .macro-next { display: none; } } .macro-actions { display: flex; align-items: center; gap: 5px; } .macro-actions button { display: grid; place-items: center; width: 32px; height: 32px; padding: 0; border: 1px solid #dce3de; border-radius: 8px; background: #fff; color: var(--ink-soft); cursor: pointer; } .macro-actions button svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; } .macro-actions button:hover { border-color: var(--coral); color: var(--coral-dark); } .macro-actions button.is-danger:hover { border-color: #d68a7a; background: #fff1ed; color: #9f4637; } .airing-groups { display: grid; gap: 18px; } /* Le minimum intrinsèque du tableau et du fieldset ne doit pas élargir la page. */ .catalogue-diffusions-page, .catalogue-diffusions-page .airing-groups, .catalogue-diffusions-page .airing-groups > div, .catalogue-diffusions-page .diffusion-filter-panel { min-width: 0; } .diffusions-summary { margin-bottom: 18px; } .diffusions-summary .kpi-grid { margin-bottom: 0; } .diffusions-mode { display: inline-flex; gap: 4px; padding: 4px; margin-bottom: 16px; border: 1px solid var(--line); border-radius: 12px; background: var(--card); } .diffusions-mode button { min-height: 44px; padding: 10px 20px; border: 0; border-radius: 8px; background: transparent; color: var(--ink-soft); font: inherit; font-size: var(--text-small); font-weight: 650; cursor: pointer; } .diffusions-mode button[aria-pressed="true"] { background: var(--ink); color: var(--card); } .diffusions-mode button:disabled { cursor: wait; } .diffusions-mode button:focus-visible { outline: 2px solid var(--coral); outline-offset: 2px; } .diffusion-channel-field { grid-column: 2 / -1; } .slot-check { display: inline-grid; place-items: center; width: 16px; height: 16px; flex: 0 0 auto; border: 1px solid currentColor; border-radius: 4px; font-size: 11px; } .diffusion-slot-option input:not(:checked) + .slot-chip .slot-check { color: transparent; border-color: var(--ink-soft); background: transparent; } .diffusions-load-status { min-height: 3em; margin: -10px 0 8px; color: var(--ink-soft); font-size: var(--text-small); line-height: 1.5; } .is-refreshing > .diffusions-results { opacity: .45; pointer-events: none; } .diffusion-selection { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 12px 20px; margin-bottom: 16px; } .diffusion-selection-period { grid-column: 1 / -1; margin: 0; color: var(--ink); font-size: var(--text-body); font-weight: 650; line-height: 1.5; overflow-wrap: anywhere; } .diffusion-selection h2 { min-width: 0; margin: 0; color: var(--ink); font-size: var(--text-body); font-weight: 650; } .diffusion-selection-total { display: block; margin-bottom: 5px; font-size: 36px; font-weight: 800; line-height: 1.1; font-variant-numeric: tabular-nums; } .diffusion-date-sort { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0; border: 0; background: transparent; color: inherit; font: inherit; letter-spacing: inherit; text-transform: inherit; cursor: pointer; } .diffusion-date-sort span { color: var(--ink); font-size: 18px; } .diffusion-date-sort:hover { color: var(--ink); } .diffusion-date-sort:focus-visible { outline: 2px solid var(--coral); outline-offset: 4px; border-radius: 4px; } .diffusion-selection .button-export { justify-self: end; max-width: 100%; } @media (max-width: 700px) { .diffusion-selection { grid-template-columns: repeat(2,minmax(0,1fr)); column-gap: 12px; } .diffusion-selection h2 { overflow-wrap: anywhere; } .diffusion-selection .button-export { width: 100%; min-width: 0; padding-inline: 10px; white-space: normal; } .diffusion-selection .button-export > span { min-width: 0; overflow-wrap: anywhere; } } @media (max-width: 440px) { .diffusion-channel-field { grid-column: auto; } .diffusions-mode { display: flex; } .diffusions-mode button { flex: 1; } } .diffusion-filter-panel { position: relative; margin: 0 0 20px; padding: 20px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--card); } .catalogue-diffusions-page .diffusion-filter-panel { padding-block: 12px; border: 0; border-radius: 0; } .diffusion-filter-panel legend { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; } .diffusion-date-fields { display: grid; grid-template-columns: minmax(0,1.4fr) repeat(2,minmax(0,1fr)); gap: 14px; margin-bottom: 16px; padding-bottom: 16px; border-bottom: 1px solid #e6ebe7; } .catalogue-diffusions-page .diffusion-date-fields { row-gap: 12px; margin-bottom: 12px; padding-bottom: 12px; } .diffusion-date-fields label { display: grid; min-width: 0; gap: 7px; color: var(--ink-soft); font-size: var(--text-label); font-weight: 600; } .diffusion-date-fields input, .diffusion-date-fields select { padding: 0 12px; } .diffusion-date-fields select { -webkit-appearance: none; appearance: none; padding-right: 40px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23496062' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-position: right 12px center; background-size: 16px 16px; background-repeat: no-repeat; } .diffusion-date-fields label > span, .diffusion-slot-filter-head > span { display: inline-flex; align-items: center; gap: 6px; } .diffusion-date-fields label > span .lucide, .diffusion-slot-filter-head > span .lucide { flex: 0 0 auto; width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; } @media (forced-colors: active) { .diffusion-date-fields select { -webkit-appearance: auto; appearance: auto; background-image: none; } } .diffusion-quick-period { min-width: 210px !important; } .diffusion-slot-filter-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: flex-start; gap: 4px 12px; margin-bottom: 10px; color: var(--ink-soft); font-size: 9px; font-weight: 750; } .diffusion-slot-filter-head small { font-size: inherit; font-weight: 550; } .diffusion-slot-options { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; } .diffusion-slot-option { position: relative; cursor: pointer; } .diffusion-slot-option input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; } .diffusion-slot-option .slot-chip { gap: 8px; min-height: 44px; padding: 8px 12px; border: 0; border-radius: 4px; background: transparent; color: var(--ink); font-size: var(--text-secondary); font-weight: 600; cursor: pointer; } .slot-choice-label { min-width: 0; white-space: normal; line-height: 1.4; } .diffusion-slot-option .slot-chip b { display: inline-block; padding: 2px 7px; border: 1px solid var(--line); border-radius: 999px; background: var(--paper); color: var(--ink-soft); font-size: var(--text-micro); font-weight: 600; font-variant-numeric: tabular-nums; line-height: 1.4; vertical-align: middle; white-space: nowrap; } .diffusion-slot-option input:checked + .slot-chip .slot-check { border-color: var(--slot-color); background: var(--slot-color); color: #fff; } .diffusion-slot-option input:disabled + .slot-chip { opacity: .55; cursor: default; } .diffusion-slot-option input:focus-visible + .slot-chip { outline: 2px solid var(--ink); outline-offset: 3px; } .diffusion-filter-panel .catalogue-filter-reset { min-height: 32px; margin: 0 0 0 auto; } .section-title { display: flex; align-items: center; gap: 10px; margin: 24px 0 12px; } .section-title:first-child { margin-top: 0; } .section-title h2 { margin: 0; font-size: 14px; } .section-title p { margin: 4px 0 0; color: var(--ink-soft); font-size: 9px; } .section-title span { padding: 3px 7px; border-radius: 999px; background: #e7ece8; color: var(--ink-soft); font-size: 9px; } .history-section { min-width: 0; } .airings-history-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; margin-top: 6px; } .airings-history-head .section-title { margin-bottom: 12px; } .airings-period { display: grid; gap: 5px; min-width: 190px; margin-bottom: 12px; color: var(--ink-soft); font-size: 9px; font-weight: 750; } .airings-period .filter-select { width: 100%; color: var(--ink); font-size: 10px; font-weight: 650; } .history-quality-note { margin-bottom: 12px; padding: 11px 13px; border: 1px solid #d9e4dc; border-radius: 12px; background: #f3f8f4; color: var(--ink-soft); font-size: 10px; line-height: 1.5; } .history-quality-note strong { color: var(--ink); } .history-range { display: flex; justify-content: space-between; gap: 14px; margin: 0 3px 9px; color: var(--ink-soft); font-size: 9px; } .history-range-counts { display: flex; align-items: baseline; justify-content: flex-end; flex-wrap: wrap; gap: 5px 8px; text-align: right; } .history-range-counts strong { color: var(--ink); font-size: var(--text-small); } .history-range-counts small { color: var(--ink-soft); font-size: inherit; } .history-range-counts strong + small::before { margin-right: 8px; content: "·"; } .airings-inline-state { display: grid; place-items: center; min-height: 190px; padding: 32px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--card); color: var(--ink-soft); text-align: center; } .airings-inline-state strong { color: var(--ink); font-size: 12px; } .airings-inline-state p { max-width: 520px; margin: 7px 0 0; font-size: 10px; line-height: 1.5; } .airings-inline-state .button { margin-top: 14px; } .inline-state-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 7px; } .airings-inline-state.is-error { border-color: #efd3ce; background: #fff8f6; } .inline-spinner { width: 25px; height: 25px; margin-bottom: 12px; border: 2px solid #d6ded9; border-top-color: var(--coral); border-radius: 50%; animation: search-spin .7s linear infinite; } .site-pagination { display: grid; grid-template-columns: minmax(0,1fr) auto minmax(0,1fr); align-items: center; gap: 16px; margin: 20px 0 0; padding: 16px 0; border-top: 1px solid var(--line); } .site-pagination-button { display: inline-flex; justify-self: start; align-items: center; justify-content: center; gap: 9px; min-height: 40px; padding: 8px 14px; border: 1px solid var(--line); border-radius: 10px; background: var(--card); color: var(--ink); font-size: var(--text-small); font-weight: 650; line-height: 1.4; cursor: pointer; } .site-pagination-button:last-child { justify-self: end; } .site-pagination-button:hover { border-color: var(--coral); color: var(--coral-dark); } .site-pagination-button:focus-visible { outline: 2px solid var(--coral); outline-offset: 3px; } .site-pagination-button:disabled { visibility: hidden; pointer-events: none; } .site-pagination-status { min-width: 0; text-align: center; font-variant-numeric: tabular-nums; } .site-pagination-status strong { display: block; color: var(--ink); font-size: var(--text-secondary); font-weight: 650; line-height: 1.4; } .site-pagination-status small { display: block; margin-top: 3px; color: var(--ink-soft); font-size: var(--text-label); line-height: 1.4; } .work-detail-history-body > .site-pagination { margin: 0; padding: 16px 20px; } .channel-badge { display: inline-grid; place-items: center; min-width: 30px; height: 26px; padding: 0 7px; border-radius: 8px; background: var(--night); color: #fff; font-size: 8px; font-weight: 800; } .channel-identity { display: inline-flex; align-items: center; gap: 8px; min-width: 0; } .channel-logo-frame { --channel-logo-size: 46px; --channel-logo-padding: 4px; display: flex; align-items: center; justify-content: center; flex: 0 0 auto; width: var(--channel-logo-size); height: var(--channel-logo-size); padding: var(--channel-logo-padding); border: 1px solid #e2e7e3; border-radius: 10px; background: #fff; } /* Un carré explicite sur l'image évite que le ratio d'un SVG vertical agrandisse la grille. */ .channel-logo-frame img { display: block; flex: 0 0 auto; width: calc(var(--channel-logo-size) - 2 * var(--channel-logo-padding) - 2px); height: calc(var(--channel-logo-size) - 2 * var(--channel-logo-padding) - 2px); aspect-ratio: 1 / 1; object-fit: contain; object-position: center; } .channel-identity-name { color: var(--ink); font-size: 9px; font-weight: 750; white-space: nowrap; } .channel-day-link { display: inline-flex; align-items: center; border-radius: 9px; color: inherit; text-decoration: none; } .channel-day-link:hover .channel-logo-frame { border-color: #b7c8c1; box-shadow: 0 3px 8px rgba(8,28,30,.09); } .channel-day-link:hover .channel-identity-name { color: var(--coral-dark); text-decoration: underline; text-underline-offset: 2px; } .channel-day-link:focus-visible { outline: 3px solid rgba(241,118,95,.32); outline-offset: 3px; } .channel-identity-compact { gap: 5px; vertical-align: middle; } .channel-identity-compact .channel-logo-frame { --channel-logo-size: 34px; --channel-logo-padding: 3px; border-radius: 8px; } .channel-logo-placeholder { display: block; width: 75%; height: 75%; border-radius: 25%; background: linear-gradient(135deg, var(--violet) 0 50%, var(--mint) 50% 100%); filter: blur(3px); opacity: .7; transform: rotate(-12deg); } .restricted-label { display: inline-flex; align-items: center; gap: 6px; min-width: 0; color: var(--danger); font-size: var(--text-secondary); font-weight: 600; line-height: 1.4; } .restricted-label > svg { flex: 0 0 16px; width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; } .airing-date-partial { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 6px; white-space: normal; } .airing-date-partial > span:last-child { color: var(--ink); white-space: nowrap; } .restricted-value { display: inline-flex; align-items: center; color: var(--ink); font-variant-numeric: tabular-nums; white-space: nowrap; } .restricted-value-mask { display: inline-block; filter: blur(3px); user-select: none; pointer-events: none; } .channel-identity-compact .channel-identity-name { color: var(--ink-soft); font-size: 9px; font-weight: 650; } .channel-identity.is-missing .channel-logo-frame { display: none; } .channel-separator { margin: 0 5px; color: #9aa6a1; } .slot-chip { display: inline-flex; align-items: center; min-height: 22px; padding: 4px 8px; border: 1px solid color-mix(in srgb, var(--slot-color) 35%, var(--card)); border-radius: 999px; background: color-mix(in srgb, var(--slot-color) 12%, var(--card)); color: var(--ink); font-size: 8px; font-weight: 750; line-height: 1; white-space: nowrap; } .slot-chip-morning { --slot-color: #d6ad54; } .slot-chip-afternoon { --slot-color: #79a58e; } .slot-chip-access { --slot-color: #e48765; } .slot-chip-prime-time { --slot-color: #c5687c; } .slot-chip-prime-time-2 { --slot-color: #806b9f; } .slot-chip-night { --slot-color: #354c70; } /* Créneau informatif : conserver les couleurs des filtres sans leur forme de bouton. */ .slot-chip.slot-chip--label { gap: 6px; min-height: 0; padding: 0; border: 0; border-radius: 0; background: none; font-size: var(--text-secondary); font-weight: 500; line-height: 1.4; } .slot-chip--label::before { content: ""; flex: 0 0 6px; width: 6px; height: 6px; box-sizing: border-box; border: 3px solid var(--slot-color); border-radius: 50%; } .alerts-coming-soon { padding: 30px; box-shadow: none; } .alerts-development-body { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 40px; align-items: center; } .alerts-development-intro { min-width: 0; } .alerts-development-intro h2 { margin: 0 0 14px; font-family: Georgia, serif; font-size: clamp(25px,2.6vw,34px); font-weight: 500; line-height: 1.25; letter-spacing: -.5px; } .alerts-development-intro p { max-width: 42ch; margin: 0; color: var(--ink-soft); font-size: var(--text-body); line-height: 1.65; } .alerts-development-features { display: grid; gap: 18px; } .alerts-development-features article { display: grid; grid-template-columns: 42px minmax(0,1fr); gap: 14px; align-items: start; } .alerts-development-features article + article { border-top: 1px solid var(--line); padding-top: 18px; } .alerts-feature-icon { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: var(--paper); color: var(--ink); } .alerts-feature-icon .lucide { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; } .alerts-development-features h3 { margin: 0 0 5px; font-size: var(--text-body); font-weight: 700; } .alerts-development-features p { margin: 0; color: var(--ink-soft); font-size: var(--text-small); line-height: 1.6; } .alerts-development-footer { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 16px; margin-top: 30px; padding-top: 22px; border-top: 1px solid var(--line); } .alerts-development-footer p { flex: 1 1 280px; margin: 0; color: var(--ink-soft); font-size: var(--text-small); line-height: 1.6; } .alerts-development-footer p strong { display: block; color: var(--ink); font-weight: 650; } .alerts-development-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; margin-left: auto; } .alerts-development-footer .button { min-height: 44px; white-space: normal; } .alerts-contact-button { background: var(--mint); color: var(--ink); text-decoration: none; } .alerts-contact-button:hover { background: color-mix(in srgb, var(--mint) 88%, var(--ink)); } .alerts-contact-button:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; } @media (max-width: 700px) { .alerts-coming-soon { padding: 22px 18px; } .alerts-development-body { grid-template-columns: 1fr; gap: 26px; } .alerts-development-footer { align-items: flex-start; flex-direction: column; } .alerts-development-footer p { flex: auto; } .alerts-development-actions { width: 100%; } .alerts-development-actions .button { flex: 1 1 220px; } } .report-layout { display: grid; grid-template-columns: minmax(0,1fr); gap: 18px; align-items: start; } .report-kind-list { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 14px; margin-bottom: 24px; } .report-kind { display: flex; flex-direction: column; gap: 12px; min-width: 0; padding: 20px; border: 1px solid var(--line); border-radius: 16px; background: var(--card); } .report-kind.is-available { border-color: var(--coral); } .report-kind-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; } .report-kind-heading > .lucide { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; } .report-kind-status { padding: 4px 8px; border-radius: 6px; background: var(--paper); color: var(--ink-soft); font-size: var(--text-label); font-weight: 650; } .report-kind.is-available .report-kind-status { background: var(--mint); color: var(--ink); } .report-kind h2 { margin: 0; font-size: 17px; line-height: 1.4; } .report-kind p { flex: 1; margin: 0; color: var(--ink-soft); font-size: var(--text-small); line-height: 1.6; } .report-kind .button { align-self: flex-start; min-height: 44px; text-decoration: none; } .report-kind .button:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; } .report-kind-note { color: var(--ink-soft); font-size: var(--text-label); } .report-kind-contact { grid-column: 1 / -1; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 16px 24px; } .report-kind-contact > div { flex: 1 1 360px; min-width: 0; } .report-kind-contact p { margin-top: 6px; } .report-kind-contact .button { align-self: center; margin-left: auto; background: var(--mint); color: var(--ink); } .report-kind-contact .button:hover { background: color-mix(in srgb, var(--mint) 88%, var(--ink)); } .report-screen-heading h2[id] { scroll-margin-top: 85px; } .report-sheet > .report-period-note { margin-top: 10px; font-size: var(--text-small); line-height: 1.5; } @media (max-width: 1180px) { .report-kind-list { grid-template-columns: repeat(2,minmax(0,1fr)); } } @media (max-width: 700px) { .report-kind-list { grid-template-columns: 1fr; } } .report-sheet { min-width: 0; padding: 28px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--card); } .report-print-header, .report-print-summary, .report-promo-page, .catalogue-summary-print { display: none; } .report-overview > .catalogue-overview-panels { margin-top: 24px; } .report-overview .panel { box-shadow: none; } .report-overview .panel-head h2 { margin: 0; font-family: inherit; font-size: 18px; font-weight: 700; } .report-sheet > .report-method-note { margin-top: 24px; color: var(--ink-soft); font-size: var(--text-small); line-height: 1.6; } .report-screen-heading { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; } .report-sheet .report-screen-heading h2 { margin: 0; font-family: inherit; font-size: 18px; font-weight: 700; } .report-heading-actions { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 12px; margin-left: auto; } .report-heading-actions > span { display: inline-flex; align-items: center; gap: 7px; color: var(--ink-soft); font-size: var(--text-small); } .report-heading-actions .button { min-height: 44px; } .report-screen-heading .lucide, .report-kpi-label .lucide, .report-section .section-title .lucide { flex: 0 0 auto; width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; } .report-brand { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding-bottom: 22px; border-bottom: 1px solid var(--line); } .report-brand-identity { display: inline-flex; align-items: center; gap: 8px; } .report-brand-logo { width: 118px; } .report-brand span { color: var(--ink-soft); font-size: 9px; } .report-sheet h2 { margin: 28px 0 5px; font-family: Georgia, serif; font-size: 30px; font-weight: 500; } .report-catalogue-identity { display: flex; align-items: center; gap: 20px; margin: 24px 0; break-inside: avoid; } .report-catalogue-identity > div { min-width: 0; } .report-catalogue-identity h2 { margin: 0 0 6px; overflow-wrap: anywhere; } .report-catalogue-identity p { margin: 0; color: var(--ink-soft); font-size: var(--text-small); line-height: 1.5; } .report-sheet > p { margin: 0; color: var(--ink-soft); font-size: 10px; } .report-kpis { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; margin: 22px 0 16px; } .report-kpis > div { min-width: 0; padding: 20px; border: 1px solid var(--line); border-radius: 12px; background: var(--paper); } .report-kpis > div:first-child { border-top: 3px solid var(--coral); padding-top: 18px; } .report-kpis > div:last-child { border-top: 3px solid var(--mint); padding-top: 18px; } .report-kpis b { display: block; margin-top: 12px; font-size: clamp(28px,3vw,38px); font-weight: 750; font-variant-numeric: tabular-nums; line-height: 1.2; overflow-wrap: anywhere; } .report-kpis .report-kpi-label { display: flex; align-items: center; gap: 8px; min-height: 36px; color: var(--ink-soft); font-size: var(--text-small); font-weight: 600; line-height: 1.4; } .report-kpis .report-kpi-detail { display: block; margin-top: 6px; color: var(--ink-soft); font-size: var(--text-small); line-height: 1.4; } .report-activity { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 9px; margin: 0 0 25px; } .report-activity > div { padding: 15px 17px; border: 1px solid var(--line); border-radius: 10px; } .report-activity b { display: block; font-size: 25px; font-weight: 700; font-variant-numeric: tabular-nums; } .report-activity strong { display: block; margin-top: 5px; font-size: var(--text-small); } .report-activity span { display: block; margin-top: 5px; color: var(--ink-soft); font-size: var(--text-micro); } .report-summary { padding: 16px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); color: var(--ink-soft); font-size: var(--text-small); line-height: 1.65; } .report-summary p { margin: 0; } .report-section { min-width: 0; margin-top: 27px; } .report-ranking-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; align-items: start; } .report-section .section-title { margin-bottom: 10px; } .report-section .section-title h2 { display: flex; align-items: center; gap: 8px; margin: 0; font-family: inherit; font-size: 17px; font-weight: 700; } .report-section > .data-table-wrap { border: 0; border-radius: 12px; } .report-table { border: 1px solid var(--line); border-radius: 12px; border-collapse: separate; border-spacing: 0; overflow: hidden; } .report-table th:last-child, .report-table td:last-child { text-align: right; } .report-channel-ranking-table { overflow: hidden; border: 1px solid var(--line); border-radius: 12px; } .report-channel-ranking-table .channel-ranking-head { margin-top: 0; padding-right: 12px; padding-left: 12px; } .report-channel-ranking-list { grid-template-columns: 1fr; padding: 0 12px; } .report-channel-ranking-list .channel-ranking-item { grid-template-columns: minmax(120px,.9fr) minmax(70px,1.1fr) 48px; min-height: 63px; } .report-upcoming-date { white-space: nowrap; } .report-upcoming-date strong { display: inline; } .report-upcoming-date > span { display: inline; margin-left: 10px; } .report-empty { padding: 20px; border: 1px dashed var(--line); border-radius: 12px; color: var(--ink-soft); font-size: 9px; text-align: center; } .report-side { display: grid; gap: 12px; } .report-option { padding: 18px; border: 1px solid var(--line); border-radius: 16px; background: var(--card); } .report-option strong { display: block; font-size: 11px; } .report-option p { margin: 6px 0 13px; color: var(--ink-soft); font-size: 9px; line-height: 1.5; } .drawer { position: fixed; inset: 0; z-index: 20; visibility: hidden; pointer-events: none; } .drawer.is-open { visibility: visible; pointer-events: auto; } .drawer-backdrop { position: absolute; inset: 0; background: rgba(8,28,30,.42); opacity: 0; transition: opacity .25s ease; } .drawer.is-open .drawer-backdrop { opacity: 1; } .drawer-panel { position: absolute; top: 0; right: 0; width: min(530px, 100%); height: 100%; padding: 34px; background: var(--card); box-shadow: -20px 0 60px rgba(8,28,30,.18); overflow: auto; transform: translateX(100%); transition: transform .28s ease; } .drawer.is-open .drawer-panel { transform: translateX(0); } .drawer-close { position: absolute; top: 17px; right: 19px; width: 44px; height: 44px; border: 1px solid var(--line); border-radius: 50%; background: #fff; cursor: pointer; } .drawer-hero { padding: 22px 0 25px; } .drawer-hero-layout, .work-detail-hero-layout { display: grid; grid-template-columns: 132px minmax(0,1fr); gap: 22px; align-items: start; } @media screen and (min-width: 621px) { .drawer-hero-layout { grid-template-columns: 175px minmax(0,1fr); } .drawer-hero-layout .programme-poster-drawer { width: 175px; } } .drawer-hero-copy, .work-detail-hero-copy { min-width: 0; padding-top: 7px; } .drawer-hero .eyebrow { margin-bottom: 10px; } .drawer-hero h2, .work-detail-hero-copy h1 { margin: 0; font-family: var(--font-work-title); font-size: 34px; font-weight: 500; line-height: 1.08; letter-spacing: normal; overflow-wrap: anywhere; } .drawer-hero h2 { padding-right: 38px; } .drawer-hero p { margin: 10px 0 0; color: var(--ink-soft); font-size: 11px; } .drawer-hero .catalogue-provenance-copy small { max-width: 220px; } .work-external-links { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; margin-top: 12px; } .work-external-links > span { margin-right: 2px; color: #7d8989; font-size: 7px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; } .work-external-link { display: inline-flex; width: 40px; height: 36px; align-items: center; justify-content: center; padding: 5px; border: 1px solid #dce2de; border-radius: 10px; background: #fff; text-decoration: none; transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease; } .work-external-link:hover { border-color: #b7c4be; box-shadow: 0 4px 10px rgba(8,28,30,.1); transform: translateY(-1px); } .work-external-link:focus-visible { outline: 3px solid rgba(241,118,95,.32); outline-offset: 2px; } .work-external-logo { display: block; width: 19px; height: 19px; object-fit: contain; } .work-external-link-tvp { border-color: #568c9e; background: #629bad; } .work-external-link-tvp .work-external-logo { width: 26px; height: 26px; border-radius: 4px; } .work-external-link-imdb { border-color: #e4b916; background: #f5c518; } .work-external-link-imdb .work-external-logo { width: 23px; height: 23px; } .work-external-link-tmdb { border-color: #032541; background: #032541; } .work-external-link-tmdb .work-external-logo { width: 22px; height: 22px; } .work-external-link-tvdb { width: 52px; border-color: #17324a; background: #17324a; } .work-external-link-tvdb .work-external-logo { width: 41px; height: 23px; } .work-external-link-justwatch { border-color: #2d251d; background: #2d251d; } .work-external-link-justwatch .work-external-logo { width: 20px; height: 23px; } .work-source-links { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; margin-top: 12px; } .work-source-link { display: inline-grid; width: 26px; height: 26px; box-sizing: border-box; flex: 0 0 26px; place-items: center; border: 1px solid var(--line); border-radius: 6px; background: #fff; text-decoration: none; } .work-source-link img { display: block; box-sizing: border-box; width: 18px; height: 18px; object-fit: contain; } .work-source-link:focus-visible { outline: 3px solid rgba(241,118,95,.32); outline-offset: 2px; } .drawer-vod-offers { width: 100%; margin-top: 20px; padding-top: 15px; } .drawer-vod-offers-label { display: block; color: #7d8989; font-size: 7px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; } .drawer-vod-offers-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; margin-top: 8px; } .drawer-vod-offer { display: flex; width: 100%; min-width: 0; min-height: 43px; align-items: center; gap: 8px; padding: 5px 9px 5px 5px; border: 1px solid #dce2de; border-radius: 11px; background: #fff; color: var(--ink); text-decoration: none; transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease; } .drawer-vod-offer:hover { border-color: #b7c4be; box-shadow: 0 5px 13px rgba(8,28,30,.09); transform: translateY(-1px); } .drawer-vod-offer:focus-visible { outline: 3px solid rgba(241,118,95,.32); outline-offset: 2px; } .drawer-vod-offer-logo { display: grid; flex: 0 0 32px; width: 32px; height: 32px; place-items: center; padding: 3px; border-radius: 8px; background: #f4f5f1; color: var(--ink); font-size: 8px; font-weight: 800; overflow: hidden; } .drawer-vod-offer-logo img { display: block; max-width: 100%; max-height: 100%; object-fit: contain; } .drawer-vod-offer-copy { min-width: 0; } .drawer-vod-offer-copy strong { display: block; max-width: 118px; overflow: hidden; font-size: 8px; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; } .drawer-vod-offer-copy small { display: block; max-width: 118px; margin-top: 2px; overflow: hidden; color: var(--ink-soft); font-size: 7px; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; } .drawer-vod-summary { display: flex; width: fit-content; margin-top: 18px; align-items: center; gap: 8px; padding: 9px 12px; border: 1px solid #dce2de; border-radius: 999px; background: #f3f5f1; color: var(--ink-soft); font: inherit; font-size: 9px; cursor: pointer; transition: border-color .16s ease, background .16s ease, transform .16s ease; } .drawer-vod-summary:hover { border-color: #b7c8c1; background: #eef3ef; transform: translateY(-1px); } .drawer-vod-summary:focus-visible { outline: 3px solid rgba(241,118,95,.28); outline-offset: 2px; } .drawer-vod-summary svg { width: 14px; height: 14px; fill: none; stroke: var(--coral-dark); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; } .drawer-vod-summary strong { color: var(--ink); font-weight: 750; } .drawer-metrics { display: grid; grid-template-columns: repeat(3,1fr); gap: 9px; margin: 20px 0; } .drawer-metrics-title { margin: 20px 0 11px; color: var(--ink); font-size: 18px; } .drawer-metrics--summary { grid-template-columns: repeat(3,minmax(0,1fr)); margin-top: 0; } .drawer-metrics--summary span { white-space: nowrap; } .drawer-metrics > div, .drawer-metrics > button { min-width: 0; padding: 13px; border: 0; border-radius: 12px; background: #f3f5f1; color: var(--ink); text-align: left; } .drawer-metrics b { display: block; font-family: Georgia, serif; font-size: 22px; } .drawer-metrics span { color: var(--ink-soft); font-size: 8px; } .drawer-section { margin-top: 24px; } .drawer-section h3 { margin: 0 0 11px; font-size: 12px; } .drawer-overview-section { margin-top: 18px; } .drawer-macro-state { min-height: 92px; padding: 16px; } .drawer-airing-list { display: grid; gap: 10px; } .drawer-next-airing { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 10px 14px; align-items: center; padding: 14px; border: 1px solid var(--line); border-radius: 14px; background: #f7f8f5; } .drawer-next-airing-info { display: grid; min-width: 0; max-width: 180px; justify-items: end; gap: 6px; text-align: right; } .drawer-next-airing-date > span { display: block; } .drawer-next-airing-time { display: flex; align-items: center; justify-content: flex-end; gap: 8px; } .drawer-next-airing-channel { min-width: 0; } .drawer-next-airing-channel .channel-day-link, .drawer-next-airing-channel .channel-identity { max-width: 100%; } .drawer-next-airing-channel .channel-identity-name, .drawer-next-airing-channel .channel-badge { color: var(--ink); font-size: var(--text-secondary); font-weight: 700; white-space: normal; overflow-wrap: anywhere; } .drawer-next-airing p { margin: 0; color: var(--ink-soft); font-size: var(--text-small); line-height: 1.4; overflow-wrap: anywhere; } .drawer-next-airing-channel > p { margin-bottom: 6px; } .drawer-next-airing--overview { position: relative; grid-template-columns: minmax(0,1fr); } .drawer-next-airing--overview:has(.channel-identity:not(.is-missing) .channel-logo-frame) { min-height: 92px; padding-left: 90px; } .drawer-next-airing--overview .channel-logo-frame { --channel-logo-size: 64px; position: absolute; top: 14px; left: 14px; } .drawer-next-airing--overview .drawer-next-airing-info { grid-template-columns: max-content minmax(0,1fr); align-items: center; justify-items: start; max-width: none; gap: 10px; text-align: left; } .drawer-next-airing--overview .drawer-next-airing-time { justify-content: flex-start; flex-wrap: wrap; } .drawer-next-airing-more { margin: 7px 2px 0; color: var(--ink-soft); font-size: var(--text-label); } .drawer-airings-state { min-height: 132px; padding: 22px; border-radius: 13px; } .drawer-airings-group + .drawer-airings-group { margin-top: 18px; } .drawer-airings-group-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 8px; } .drawer-airings-group-head h4 { margin: 0; font-size: 10px; } .drawer-airings-group-head span { min-width: 22px; padding: 3px 7px; border-radius: 999px; background: #edf1ed; color: var(--ink-soft); font-size: 8px; font-weight: 800; text-align: center; } .drawer-airings-table tbody tr { cursor: default; } .drawer-airings-table td:first-child { white-space: nowrap; } .drawer-airing-time { display: block; margin-top: 2px; color: var(--ink-soft); font-size: 8px; } .drawer-airings-empty { margin: 0; padding: 13px 14px; border: 1px solid var(--line); border-radius: 12px; background: #f7f8f5; color: var(--ink-soft); font-size: 9px; line-height: 1.5; } .drawer-airings-empty strong { color: var(--ink); } .drawer-airings-note { margin: 6px 2px 0; color: var(--ink-soft); font-size: 8px; } .drawer-history-range { display: flex; justify-content: space-between; gap: 12px; margin: 0 2px 8px; color: var(--ink-soft); font-size: 8px; } .drawer-airings-table.is-detailed { min-width: 500px; } .drawer-airing-detail { display: block; max-width: 150px; overflow: hidden; color: var(--ink); font-size: 9px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; } .drawer-full-page-action { margin-top: 18px; } .drawer-detail-cta { position: relative; display: grid; width: 100%; min-height: 72px; grid-template-columns: 42px minmax(0,1fr) 32px; gap: 12px; align-items: center; padding: 11px 13px; overflow: hidden; border: 1px solid rgba(255,255,255,.08); border-radius: 16px; background: linear-gradient(135deg,#0d3436 0%,#123f41 100%); box-shadow: 0 12px 28px rgba(8,28,30,.14); color: #fff; text-align: left; cursor: pointer; transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; } .drawer-detail-cta::after { content: ""; position: absolute; right: -32px; bottom: -52px; width: 110px; height: 110px; border-radius: 50%; background: rgba(241,118,95,.18); pointer-events: none; } .drawer-detail-cta:hover { transform: translateY(-2px); border-color: rgba(241,118,95,.55); box-shadow: 0 17px 36px rgba(8,28,30,.2); } .drawer-detail-cta:focus-visible { outline: 3px solid rgba(241,118,95,.34); outline-offset: 3px; } .drawer-detail-cta-icon, .drawer-detail-cta-arrow { position: relative; z-index: 1; display: grid; place-items: center; } .drawer-detail-cta-icon { width: 42px; height: 42px; border-radius: 12px; background: rgba(255,255,255,.12); color: #8ce0c2; } .drawer-detail-cta-arrow { width: 32px; height: 32px; border-radius: 50%; background: #f1775f; color: #fff; transition: transform .18s ease; } .drawer-detail-cta:hover .drawer-detail-cta-arrow { transform: translateX(2px); } .drawer-detail-cta-icon .lucide { width: 20px; height: 20px; } .drawer-detail-cta-arrow .lucide { width: 16px; height: 16px; } .drawer-detail-cta .lucide { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; } .drawer-detail-cta-copy { position: relative; z-index: 1; min-width: 0; } .drawer-detail-cta-copy strong, .drawer-detail-cta-copy small { display: block; } .drawer-detail-cta-copy strong { font-size: 11px; line-height: 1.3; } .drawer-detail-cta-copy small { margin-top: 4px; color: rgba(255,255,255,.66); font-size: 8px; line-height: 1.35; } .work-detail-page { display: grid; gap: 18px; max-width: 1180px; margin: 0 auto; } .work-detail-tabs { display: flex; gap: 24px; border-bottom: 1px solid var(--line); scroll-margin-top: 84px; } @media screen { .work-detail-tabs { position: sticky; top: 0; z-index: 5; align-self: start; background: var(--paper); } } .work-detail-tabs button { display: inline-flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 8px; min-width: 0; min-height: 48px; padding: 12px 4px; border: 0; border-bottom: 3px solid transparent; background: transparent; color: var(--ink-soft); font: inherit; font-size: var(--text-body); font-weight: 650; cursor: pointer; } .work-detail-tabs .lucide { flex: 0 0 22px; width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; } .work-detail-tabs button[aria-selected="true"] { color: var(--coral-dark); border-bottom-color: var(--coral); } .work-detail-tabs button:hover { color: var(--ink); } .work-detail-tabs button:focus-visible, .work-detail-tab-panel:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; } .work-detail-tab-panel { display: grid; min-width: 0; gap: 18px; } .work-detail-modes { justify-self: start; margin: 0; } .work-detail-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; } .work-detail-toolbar-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 10px; } .work-toolbar-label-short { display: none; } .work-detail-remove { border-color: transparent; background: transparent; color: #9a6760; } .work-detail-remove:hover { background: #fff1ee; color: var(--danger); border-color: transparent; } .work-detail-hero { padding: 28px; } .work-detail-hero-copy .eyebrow { margin-bottom: 10px; color: var(--ink-soft); } .work-detail-hero .work-detail-metadata { margin-top: 10px; } .work-detail-metadata { margin: 14px 0 0; color: var(--ink-soft); font-size: 13px; line-height: 1.55; } .work-detail-hero .source-chips { margin-top: 15px; } .work-detail-facts { display: flex; flex-wrap: wrap; gap: 9px 22px; margin-top: 16px; } .work-detail-facts div { min-width: 120px; } .work-detail-facts span { display: block; color: #7d8989; font-size: 7px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; } .work-detail-facts strong { display: block; margin-top: 4px; font-size: 10px; } .work-detail-hero .catalogue-provenance-copy small { max-width: 520px; } .work-detail-hero .work-external-links { margin-top: 12px; } .work-detail-vod.drawer-vod-offers { margin: 0; padding: 0; } .work-detail-vod .panel-head { padding-bottom: 18px; border-bottom: 1px solid var(--line); } .work-vod-filter-bar { padding: 22px 22px 0; } .work-vod-types { max-width: 100%; box-sizing: border-box; flex-wrap: wrap; margin-bottom: 0; } .work-detail-vod .drawer-vod-offers-list { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; margin: 0; padding: 22px; } .work-detail-vod .drawer-vod-offer { min-height: 76px; gap: 12px; padding: 12px; background: #f7f8f5; transition: border-color .16s ease, background .16s ease; } .work-detail-vod .drawer-vod-offer:hover { background: #eef3ef; border-color: var(--ink-soft); box-shadow: none; transform: none; } .work-detail-vod .drawer-vod-offer-logo { flex-basis: 40px; width: 40px; height: 40px; padding: 4px; background: #fff; } .work-detail-vod .drawer-vod-offer-copy strong { font-size: var(--text-body); line-height: 1.4; } .work-detail-vod .drawer-vod-offer-copy small { margin-top: 4px; font-size: var(--text-small); line-height: 1.5; } .work-detail-vod .drawer-vod-offer-copy strong, .work-detail-vod .drawer-vod-offer-copy small { max-width: none; white-space: normal; overflow-wrap: anywhere; overflow: visible; } .work-activity-strip button { min-height: 44px; cursor: pointer; } .work-activity-strip button:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; } .work-activity-strip button:disabled { cursor: default; opacity: .6; } .work-activity-strip button:hover:not(:disabled) { background: #eaf0e9; } .work-detail-section { scroll-margin-top: 84px; } .work-detail-section { overflow: hidden; } .work-detail-section .panel-head { padding-bottom: 18px; border-bottom: 1px solid var(--line); } .work-detail-section-body { padding: 22px; } .work-production-companies { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; color: var(--ink); font-size: var(--text-small); line-height: 1.5; } .work-production-companies li { max-width: 100%; min-width: 0; padding: 6px 12px; border: 1px solid var(--line); border-radius: 18px; background: var(--paper); overflow-wrap: anywhere; break-inside: avoid; } .work-detail-insights-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; align-items: start; } .work-hour-panel { grid-column: 1 / -1; min-width: 0; } .work-hour-body { padding: 18px 20px; } .work-hour-legend { display: flex; flex-wrap: wrap; gap: 10px 18px; margin-bottom: 24px; } .work-hour-chart { display: grid; grid-template-columns: 42px minmax(0,1fr); gap: 8px; } .work-hour-axis { display: flex; height: 200px; flex-direction: column; justify-content: space-between; text-align: right; color: var(--ink-soft); font-size: var(--text-label); font-variant-numeric: tabular-nums; } .work-hour-scroll { min-width: 0; overflow-x: auto; padding: 3px; } .work-hour-bars { display: grid; grid-template-columns: repeat(24,minmax(0,1fr)); min-width: 720px; background: repeating-linear-gradient(to top, var(--line) 0 1px, transparent 1px 100px); background-size: 100% 201px; background-repeat: no-repeat; } .work-hour-column { display: flex; min-width: 0; flex-direction: column; padding: 0 4px; border: 0; border-radius: 3px; background: transparent; color: var(--ink-soft); font: inherit; cursor: pointer; } .work-hour-column:hover, .work-hour-column.is-active { background: rgba(16,42,44,.06); } .work-hour-column:focus-visible { outline: 2px solid var(--ink); outline-offset: 1px; } .work-hour-track { display: flex; width: 100%; height: 200px; align-items: flex-end; } .work-hour-stack { display: flex; flex-direction: column-reverse; width: 100%; border-radius: 4px 4px 0 0; overflow: hidden; } .work-hour-segment { display: block; flex: none; width: 100%; background: var(--slot-color); } .work-hour-label { width: 100%; padding-top: 8px; text-align: center; font-size: var(--text-label); font-variant-numeric: tabular-nums; } .work-hour-detail { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; box-sizing: border-box; min-height: 68px; margin: 14px 0 0; padding: 12px 16px; border: 1px solid transparent; border-radius: 12px; color: var(--ink-soft); font-size: var(--text-secondary); line-height: 1.5; } .work-hour-detail.is-selected { border-color: var(--line); background: #f7f8f5; } .work-hour-selected-time { color: var(--ink); font-weight: 650; font-variant-numeric: tabular-nums; white-space: nowrap; } .work-hour-selected-count { display: inline-flex; align-items: baseline; gap: 6px; } .work-hour-selected-count > strong { color: var(--ink); font-size: 24px; font-weight: 750; font-variant-numeric: tabular-nums; line-height: 1.2; } .work-hour-selected-slots { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; margin-left: auto; } .work-hour-selected-slot { display: inline-flex; align-items: center; gap: 8px; } .work-hour-selected-slot > strong { color: var(--ink); font-weight: 650; } @media (max-width: 620px) { .work-hour-selected-slots { flex-basis: 100%; margin-left: 0; } } @media print { .work-hour-panel { break-inside: avoid; print-color-adjust: exact; -webkit-print-color-adjust: exact; } .work-hour-scroll { overflow: visible; } .work-hour-bars { min-width: 0; } .work-hour-column.is-active { background: transparent; } .work-hour-detail { display: none; } } .work-detail-yearly-table-wrap { padding: 0 20px 20px; } .work-detail-yearly-table { min-width: 0; table-layout: fixed; } .work-detail-yearly-label-column, .work-detail-yearly-count-column { width: 72px; } .work-detail-yearly-table th:first-child, .work-detail-yearly-table td:first-child { width: 72px; } .work-detail-yearly-table th:nth-child(2), .work-detail-yearly-table td:nth-child(2) { width: auto; } .work-detail-yearly-table th:last-child, .work-detail-yearly-table td:last-child { width: 72px; text-align: right; } .work-detail-yearly-table td { height: 58px; padding: 0; } .work-detail-year-label { display: flex; align-items: baseline; gap: 10px; } .work-detail-year-label strong { color: var(--ink); font-size: 14px; font-variant-numeric: tabular-nums; } .work-detail-yearly-track { display: block; height: 9px; overflow: hidden; border-radius: 999px; background: #edf1ed; } .work-detail-yearly-track i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg,var(--coral),#f5a18e); } .work-detail-channel-ranking-list { grid-template-columns: 1fr; } .work-detail-programming-body { padding: 0; } .work-detail-programming-body > .work-detail-state { margin: 22px; } .work-detail-airing-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; padding: 22px; align-items: start; } .work-detail-airing-grid .drawer-airings-group { min-width: 0; padding: 0; } .work-detail-airing-grid .drawer-airings-group + .drawer-airings-group { margin-top: 0; } .work-detail-airing-grid .drawer-airings-group-head { min-height: 44px; margin: 0 0 12px; gap: 12px; } .work-programming-list { display: grid; gap: 10px; } .work-detail-airing-grid .drawer-airings-group > .drawer-airings-empty { margin-top: 20px; } .work-detail-airing-grid .data-table-wrap { border: 0; border-radius: 0; } .work-detail-airing-grid .drawer-airings-note { margin: 0; padding: 12px 2px 0; border-top: 1px solid #edf0ec; } .work-detail-airing-grid .drawer-airings-table th:first-child, .work-detail-airing-grid .drawer-airings-table td:first-child { padding-left: 0; } .work-detail-airing-grid .drawer-airings-table th:last-child, .work-detail-airing-grid .drawer-airings-table td:last-child { padding-right: 0; } .work-detail-history-body { padding: 0; } .work-detail-history-head { flex-wrap: wrap; gap: 15px; } .work-history-filters { padding: 16px 20px; border-bottom: 1px solid var(--line); } .work-history-filters .diffusion-filter-panel { margin: 0; padding-block: 0; } .work-history-status { min-height: calc(3em + 8px); margin: 0; padding: 4px 20px; color: var(--ink-soft); font-size: var(--text-small); line-height: 1.5; } .work-detail-history-body.is-refreshing { opacity: .45; pointer-events: none; } .work-detail-history-body > .work-detail-state, .work-detail-history-body > .drawer-airings-empty { margin: 22px; } .work-detail-history-body > .diffusion-selection { margin: 0; padding: 0 20px 16px; border-bottom: 1px solid var(--line); } .work-detail-history-body > .data-table-wrap { border: 0; border-radius: 0; } .work-detail-state { min-height: 160px; border-radius: 14px; } .work-detail-export-note { margin: -6px 2px 0; color: var(--ink-soft); font-size: 9px; text-align: right; } .modal { width: min(530px, calc(100% - 30px)); padding: 0; border: 0; border-radius: 22px; background: var(--card); box-shadow: 0 30px 90px rgba(8,28,30,.3); } .modal::backdrop { background: rgba(8,28,30,.5); backdrop-filter: blur(3px); } .modal form { position: relative; padding: 34px; } .modal-close { position: absolute; top: 16px; right: 16px; width: 31px; height: 31px; border: 1px solid var(--line); border-radius: 50%; background: transparent; cursor: pointer; } .modal-icon { display: grid; place-items: center; width: 48px; height: 48px; margin-bottom: 18px; border-radius: 14px; background: #ffe4dc; color: var(--coral-dark); font-size: 22px; } .modal .eyebrow { margin-bottom: 6px; } .modal h2 { margin: 0; font-family: Georgia, serif; font-size: 30px; font-weight: 500; } .modal form > p:not(.eyebrow) { color: var(--ink-soft); font-size: 11px; line-height: 1.55; } .toast { position: fixed; z-index: 40; right: 22px; bottom: 22px; max-width: 360px; padding: 13px 16px; border-radius: 12px; background: var(--night); color: #fff; box-shadow: var(--shadow); font-size: 10px; opacity: 0; transform: translateY(12px); pointer-events: none; transition: .22s ease; } .toast.is-visible { opacity: 1; transform: translateY(0); } /* Échelle compacte : 12–13 px pour les annotations, 14 px pour le contenu. */ body { font-size: var(--text-body); line-height: 1.5; } .company-search-heading p, .company-shortcuts-intro, .work-search-copy > p:last-child, .search-placeholder, .catalogue-works-empty, .client-catalogue-empty p, .catalogue-scope-placeholder p, .page-heading p, .empty-state p, .modal form > p:not(.eyebrow) { font-size: var(--text-secondary); } .company-suggestion-copy strong { font-size: var(--text-secondary); } .company-suggestion-copy span, .company-suggestion-empty, .company-search-help, .coverage-card dt, .company-copy small, .company-copy > span { font-size: var(--text-small); } .coverage-title, .company-shortcuts-title, .coverage-card dt small, .coverage-freshness, .company-copy > .company-role { font-size: var(--text-label); } .coverage-card { min-height: 122px; } .company-card { min-height: 204px; } .nav-item { min-height: 44px; padding: 10px 13px; font-size: var(--text-secondary); } .nav-item b, .sidebar-catalogue-collapsible > summary small { font-size: var(--text-micro); } .sidebar-catalogue-collapsible > summary strong { font-size: var(--text-secondary); } .sidebar-catalogue-list > p, .sidebar-catalogue-option { font-size: var(--text-small); } .button { font-size: var(--text-secondary); } .catalogue-switcher-empty, .catalogue-create-field > span, .catalogue-create-sources legend { font-size: var(--text-secondary); } .catalogue-create-source b, .catalogue-company-result strong, .catalogue-create-error { font-size: var(--text-small) !important; } .catalogue-create-source small, .catalogue-company-result small, .catalogue-company-selection { font-size: var(--text-label) !important; } .catalogue-create-source em { font-size: var(--text-micro); } .work-search-help, .work-result-original, .catalogue-work-actions small, .button-remove, .work-detail-export-note { font-size: var(--text-label); } .work-result-meta, .catalogue-work-meta { font-size: var(--text-small); } .catalogue-work-card .catalogue-work-meta { font-size: var(--text-body); } .source-chip { min-height: 25px; font-size: var(--text-micro); } .catalogue-provenance-copy strong { font-size: var(--text-label); } .catalogue-provenance-copy small { font-size: var(--text-micro); line-height: 1.35; } .catalogue-filter-search, .catalogue-filter-search input, .catalogue-filter-reset { font-size: var(--text-label); } .kpi-card small, .panel-head p, .panel-head .panel-action, .section-title p, .history-quality-note, .airings-inline-state p { font-size: var(--text-small); } .kpi-card span, .bar-column span, .bar-column b, .history-range { font-size: var(--text-label); } .bar-column b small { font-size: var(--text-micro); } .panel-head h2, .section-title h2 { font-size: 18px; } .upcoming-item { min-height: 116px; } .upcoming-title { font-size: var(--text-secondary); line-height: 1.4; } .upcoming-channel-line { font-size: var(--text-label); } .upcoming-context, .upcoming-context > small { font-size: var(--text-micro); } .compact-table th, .data-table th, .macro-table th { font-size: var(--text-label); } .compact-table td, .data-table td { font-size: var(--text-secondary); } .programme-with-poster-copy strong, .table-title strong { font-size: var(--text-secondary); } .programme-with-poster-copy > span, .table-title span { font-size: var(--text-label); } .insight strong { font-size: var(--text-secondary); } .insight p { font-size: var(--text-small); } .data-coverage-head p, .data-coverage-disclaimer { font-size: var(--text-small); } .data-coverage-fact dt, .data-coverage-fact small { font-size: var(--text-label); } .data-coverage-fact dd { font-size: var(--text-secondary); } .data-coverage--footer .data-coverage-head p, .data-coverage--footer .data-coverage-disclaimer { font-size: var(--text-label); } .data-coverage--footer .data-coverage-fact dt { font-size: var(--text-micro); } .data-coverage--footer .data-coverage-fact dd { font-size: var(--text-small); } .channel-ranking-head { font-size: var(--text-label); } .channel-ranking-metric strong { font-size: var(--text-small); } .channel-ranking-metric small { font-size: var(--text-micro); } .filter-select { font-size: var(--text-small); } .macro-table td { font-size: var(--text-small); } .macro-catalogue-name strong { font-size: var(--text-secondary); } .macro-catalogue-name small, .macro-next > span, .macro-attention-badge, .macro-ok, .macro-signal p, .macro-catalogue-chip { font-size: var(--text-micro); } .macro-coverage-value, .macro-next > strong, .macro-signal strong { font-size: var(--text-label); } .section-title span, .airings-period { font-size: var(--text-label); } .diffusion-slot-filter-head, .diffusion-date-fields label { font-size: var(--text-label); } .airings-period .filter-select { font-size: var(--text-small); } .history-quality-note { font-size: var(--text-secondary); } .airings-inline-state strong { font-size: var(--text-secondary); } .channel-badge, .slot-chip { font-size: var(--text-micro); } .channel-identity-name, .channel-identity-compact .channel-identity-name { font-size: var(--text-label); } .report-brand span, .report-kpis span { font-size: var(--text-micro); } .report-sheet > p, .report-summary, .report-empty, .report-option p { font-size: var(--text-small); } .report-option strong { font-size: var(--text-secondary); } .work-external-links > span, .drawer-vod-offers-label, .work-detail-facts span { font-size: var(--text-micro); } .drawer-hero p, .work-detail-hero .work-detail-metadata, .drawer-vod-offer-copy strong, .drawer-vod-summary, .drawer-airing-time, .drawer-airings-note, .drawer-history-range, .drawer-airing-detail, .work-detail-facts strong { font-size: var(--text-label); } .drawer-vod-offer-copy small, .drawer-metrics span, .drawer-airings-group-head span { font-size: var(--text-micro); } .drawer-section h3 { font-size: 18px; } .drawer-airings-group-head h4 { font-size: var(--text-secondary); } .drawer-airings-empty { font-size: var(--text-small); } .drawer-detail-cta-copy strong { font-size: var(--text-secondary); } .drawer-detail-cta-copy small { font-size: var(--text-label); } .toast { font-size: var(--text-small); } /* Contrôles et textes qui avaient encore une taille fixe dans les composants. */ .company-search-control input, .auth-form input, .catalogue-create-field input, .catalogue-filter-search input, .filter-select { min-height: 40px; font-size: var(--text-secondary); } .eyebrow { font-size: var(--text-micro); } .work-detail-metadata { font-size: var(--text-secondary); } .annual-history-axis, .bar-column > span > small { font-size: var(--text-micro); } .kpi-card span { color: var(--ink-soft); line-height: 1.5; } .channel-ranking-item .channel-identity-name { color: var(--ink); white-space: normal; overflow-wrap: anywhere; } .catalogue-ranking-link { min-width: 0; max-width: 100%; } /* Les identités principales dominent les métadonnées et compteurs. */ /* Tous les classements écran réservent le reste de la ligne à la barre. */ @media screen and (min-width: 621px) { .channel-ranking-list .channel-ranking-item { grid-template-columns: minmax(0,min(220px,40%)) minmax(0,1fr) 64px; } .channel-ranking-list .channel-ranking-item:has(> .catalogue-ranking-label) { grid-template-columns: minmax(0,min(100px,30%)) minmax(0,1fr) 64px; } .channel-ranking-list :is(.catalogue-ranking-label, .catalogue-ranking-provider) { overflow-wrap: anywhere; } } .airing-work-cell .programme-with-poster-copy strong, .upcoming-item .upcoming-title, .report-airing-row .programme-with-poster-copy strong, .report-table .title-cell .programme-with-poster-copy strong { font-family: var(--font-work-title); font-size: var(--text-work-title); font-weight: 500; line-height: 1.35; } .catalogue-macro-page .macro-next > strong { font-family: var(--font-work-title); font-size: var(--text-work-title); font-weight: 500; } .channels-inventory-table .channel-identity-name, .channels-inventory-table .channel-badge { font-size: 17px; font-weight: 750; line-height: 1.35; } .catalogue-ranking-label > .catalogue-ranking-link, .catalogue-ranking-label > strong, .catalogue-ranking-provider > strong, .channel-ranking-item .channel-identity-name, .channel-ranking-item .channel-badge { font-size: 15px; font-weight: 600; line-height: 1.35; } .report-table .title-cell .programme-with-poster-copy strong { max-width: none; white-space: normal; overflow-wrap: anywhere; } .channels-inventory-table .channel-badge, .channel-ranking-item .channel-badge { height: auto; min-height: 28px; white-space: normal; overflow-wrap: anywhere; } /* Les dates gardent leurs chiffres tabulaires ; la typographie est commune à toutes les métadonnées. */ .airing-table .airing-date-cell, .airing-table .airing-date-cell > span, .airing-time-slot strong, .upcoming-context > span:not(.slot-chip):not(.restricted-label), .upcoming-context > strong, .report-upcoming-date > strong, .report-upcoming-date > span, .drawer-next-airing-date > span, .drawer-next-airing-time > strong { color: var(--ink); font-variant-numeric: tabular-nums; white-space: nowrap; } .airing-table .airing-date-cell, .airing-table .airing-date-cell > span, .airing-time-slot strong, .upcoming-context > span, .upcoming-context > strong, .upcoming-context > small, .report-upcoming-date > strong, .report-upcoming-date > span, .drawer-next-airing-date > span, .drawer-next-airing-time > strong, .upcoming-item .upcoming-episode-detail, .airing-row .work-airing-episode, .airing-row .programme-with-poster-copy > span, .report-airing-row .programme-with-poster-copy > span, .drawer-next-airing-channel > p, .drawer-next-airing .drawer-next-airing-detail, :is(.upcoming-item, .airing-row, .report-airing-row, .drawer-next-airing) :is(.channel-identity-name, .channel-badge, .airing-work-type, .slot-chip) { font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size: var(--text-secondary); font-weight: 500; line-height: 1.4; } @media (max-width: 1180px) { .company-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } .data-coverage--footer .data-coverage-facts { grid-template-columns: repeat(3,minmax(0,1fr)); } .kpi-grid { grid-template-columns: repeat(3,1fr); } .dashboard-grid, .secondary-grid, .macro-layout { grid-template-columns: 1fr; } .channel-ranking-list { grid-template-columns: 1fr; } .channel-ranking-item + .channel-ranking-item { border-top: 1px solid #edf0ec; } .report-layout { grid-template-columns: 1fr; } .report-side { grid-template-columns: repeat(3,1fr); } .catalogue-filter-bar { grid-template-columns: repeat(2,minmax(0,1fr)); } .catalogue-search-field { grid-column: 1 / -1; } .catalogue-filter-search { grid-column: span 2; } .work-detail-vod .drawer-vod-offers-list { grid-template-columns: repeat(2,minmax(0,1fr)); } .work-detail-airing-grid { grid-template-columns: 1fr; } } @media (max-width: 860px) { .workspace { grid-template-columns: 1fr; } .sidebar { position: fixed; z-index: 15; width: min(260px, calc(100vw - 40px)); transform: translateX(-100%); box-shadow: 18px 0 40px rgba(5,23,24,.2); transition: transform .22s ease; } .workspace.menu-open .sidebar { transform: translateX(0); } .mobile-menu { display: block; } .mobile-menu-close { position: absolute; top: 16px; right: 12px; display: grid; width: 36px; height: 36px; place-items: center; border-radius: 50%; } .mobile-menu-close:hover, .mobile-menu-close:focus-visible { background: rgba(255,255,255,.1); outline: 0; } .mobile-menu-backdrop { position: fixed; z-index: 14; inset: 0; display: block; background: rgba(5,23,24,.42); opacity: 0; visibility: hidden; transition: opacity .22s ease, visibility .22s ease; } .workspace.menu-open .mobile-menu-backdrop { opacity: 1; visibility: visible; } .topbar { position: sticky; z-index: 12; top: 0; display: flex; min-height: 64px; padding: 10px 18px; } .work-detail-tabs { top: 64px; } .topbar.is-context-empty { display: flex; } .mobile-topbar-brand { display: inline-flex; } .view-root { padding: 24px 18px 45px; } .access-notice { margin: 24px 18px 0; padding: 12px 14px; } .access-notice p { display: grid; } .catalogue-works { grid-template-columns: 1fr; } .client-catalogue-empty, .catalogue-scope-placeholder { min-height: 340px; } .company-grid { grid-template-columns: 1fr; } .coverage-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } .report-ranking-grid { grid-template-columns: 1fr; } .picker-hero { margin-top: 70px; } .picker-hero h1 { letter-spacing: -2.5px; } .work-detail-airing-grid { grid-template-columns: 1fr; } .work-detail-insights-grid { grid-template-columns: 1fr; } .perimeter-metrics { grid-template-columns: 1fr; gap: 16px; padding: 20px; } .perimeter-metrics > div { padding: 16px 0 0; border-left: 0; border-top: 1px solid var(--line); } .perimeter-metrics > div:first-child { padding-top: 0; border-top: 0; } .perimeter-countries { grid-template-columns: 1fr; align-items: flex-start; } .perimeter-country-list { flex-wrap: wrap; justify-content: flex-start; } } @media (max-width: 620px) { .report-catalogue-identity { gap: 14px; } .report-catalogue-identity .catalogue-avatar--large { --catalogue-avatar-size: 72px; } .catalogue-heading-identity { align-items: flex-start; gap: 14px; } .catalogue-heading-identity .catalogue-avatar--large { --catalogue-avatar-size: 72px; font-size: 20px; } .picker-shell { width: min(100% - 24px,1180px); padding-top: 20px; } .picker-header { flex-wrap: wrap; gap: 12px; } .picker-header-actions { margin-left: auto; } .picker-account-summary { display: none; } .picker-header-actions .button { padding: 0 10px; font-size: var(--text-label); } .auth-page { padding: 14px; } .auth-card { padding: 30px 22px; border-radius: 22px; } .auth-brand { margin-bottom: 30px; } .picker-hero { margin: 56px auto 38px; text-align: left; } .picker-hero > p { font-size: 15px; } .company-search-heading { text-align: left; } .company-search-control input { height: 54px; padding-left: 45px; font-size: 16px; } .company-shortcuts-title { text-align: center; } .coverage-title { text-align: center; } .coverage-grid { grid-template-columns: 1fr; } .coverage-card { min-height: 118px; padding: 15px; } .coverage-value { font-size: 26px; } .coverage-freshness { text-align: center; } .company-shortcuts-intro { text-align: left; } .company-card { min-height: 194px; padding: 18px; } .company-monogram { width: 50px; height: 50px; } .topbar { gap: 10px; } .button { padding: 0 10px; } .page-heading { display: block; } .heading-actions { margin-top: 15px; } .work-search-panel { padding: 18px; } .catalogue-content-head { flex-direction: column; align-items: stretch; gap: 12px; } .catalogue-content-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); width: 100%; margin-left: 0; } .catalogue-content-actions > .button { min-width: 0; padding: 8px 10px; overflow-wrap: anywhere; } .work-search-head { align-items: stretch; flex-direction: column; gap: 16px; } .work-search-csv-cta { width: 100%; justify-content: center; } .work-search-form { grid-template-columns: auto minmax(0,1fr) auto; } .work-search-form input, .catalogue-create-field input, .catalogue-filter-search input, .catalogue-filter-bar select, .filter-select { font-size: 16px; } .work-search-form .button { grid-column: 1 / -1; width: 100%; min-height: 44px; } .work-search-result { grid-template-columns: 48px minmax(0,1fr); } .work-search-result .programme-poster-featured { width: 48px; } .work-search-result > .button { grid-column: 1 / -1; width: 100%; min-height: 44px; } .catalogue-filter-bar { grid-template-columns: 1fr; padding: 16px; } .catalogue-filter-search { grid-column: auto; } .catalogue-work-card { grid-template-columns: 60px minmax(0,1fr); } .catalogue-work-card .programme-poster-featured { width: 60px; } .button-remove { min-height: 44px; } .airings-history-head { display: block; } .airings-period { min-width: 0; } .diffusion-filter-panel { padding: 16px; } .diffusion-date-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); } .diffusion-date-fields label { min-width: 0; } .diffusion-quick-period { grid-column: 1 / -1; min-width: 0 !important; margin-left: 0; } .history-range { align-items: flex-start; flex-direction: column; } .history-range-counts { justify-content: flex-start; text-align: left; } .kpi-grid { grid-template-columns: repeat(2,1fr); } .kpi-card:last-child { grid-column: 1 / -1; } .report-sheet { padding: 20px 16px; } .report-kpis { grid-template-columns: 1fr; } .report-kpis .report-kpi-label { min-height: 0; } .report-activity { grid-template-columns: 1fr; } .report-side { grid-template-columns: 1fr; } .upcoming-item { grid-template-columns: 42px minmax(0,1fr); grid-template-areas: "poster copy" "poster context"; column-gap: 10px; row-gap: 7px; min-height: 96px; } .top-programmed-item { grid-template-columns: 42px minmax(0,1fr) auto; grid-template-areas: "poster copy count"; } .programme-poster-upcoming { width: 42px; } .upcoming-context { justify-content: flex-start; flex-wrap: wrap; gap: 6px 9px; } .programme-with-poster { grid-template-columns: 34px minmax(0,1fr); gap: 8px; } .programme-with-poster-featured { grid-template-columns: 44px minmax(0,1fr); gap: 10px; } .programme-poster-featured { width: 44px; } .programme-poster-compact { width: 34px; } .channel-ranking-list { padding-right: 15px; padding-left: 15px; } .channel-ranking-item { grid-template-columns: minmax(125px,1fr) 52px; gap: 8px; } .catalogue-signal-grid .channel-ranking-item { grid-template-columns: minmax(0,1fr) 64px; } .report-channel-ranking-list .channel-ranking-item { grid-template-columns: minmax(125px,1fr) 52px; } .channel-ranking-track { display: none; } .drawer-panel { padding: 26px 19px; } .drawer-hero-layout, .work-detail-hero-layout { grid-template-columns: 96px minmax(0,1fr); gap: 16px; } .programme-poster-drawer { width: 96px; border-radius: 10px; } .drawer-hero h2, .work-detail-hero-copy h1 { font-size: 28px; } .drawer-hero h2 { padding-right: 30px; } .drawer-metrics { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 6px; } .drawer-metrics > div, .drawer-metrics > button { padding: 10px; } .drawer-metrics--summary span { white-space: normal; } .work-detail-toolbar { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,2fr); align-items: stretch; gap: 6px; } .work-detail-tabs { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 6px; } .work-detail-tabs button { flex-direction: column; flex-wrap: nowrap; min-height: 78px; gap: 7px; } .work-detail-toolbar-actions { display: flex; flex-wrap: nowrap; align-items: stretch; gap: 6px; min-width: 0; } .work-detail-toolbar .button { flex: 1; width: auto; min-width: 0; min-height: 44px; padding: 0 6px; gap: 5px; font-size: 13px; } .work-detail-toolbar .work-toolbar-label-long { display: none; } .work-detail-toolbar .work-toolbar-label-short { display: inline; } .work-detail-hero { padding: 20px; } .work-detail-vod .drawer-vod-offers-list { grid-template-columns: 1fr; padding: 16px; } .work-vod-filter-bar { padding: 16px 16px 0; } .work-detail-airing-grid { padding: 16px; } .work-detail-section-body { padding: 16px; } .work-detail-programming-body { padding: 0; } .work-detail-programming-body > .work-detail-state { margin: 16px; } .work-detail-history-body { padding: 0; } .work-history-filters { padding: 14px; } .work-history-status { padding-right: 14px; padding-left: 14px; } .work-detail-history-body > .diffusion-selection { padding-right: 14px; padding-left: 14px; } .work-detail-history-body > .work-detail-state, .work-detail-history-body > .drawer-airings-empty { margin: 16px; } .data-coverage-facts { grid-template-columns: repeat(2,minmax(0,1fr)); padding-right: 14px; padding-left: 14px; } .data-coverage--footer .data-coverage-facts { grid-template-columns: repeat(2,minmax(0,1fr)); padding: 0 14px 14px; } .data-coverage--footer .data-coverage-head { padding: 16px 14px 14px; } .data-coverage-head { padding-right: 14px; padding-left: 14px; } .data-coverage-disclaimer { padding-right: 14px; padding-left: 14px; } } @media (max-width: 440px) { .site-pagination { grid-template-columns: 40px minmax(0,1fr) 40px; gap: 10px; } .site-pagination-button { width: 40px; min-height: 44px; padding: 8px; } .site-pagination-button-label { display: none; } .catalogue-overview-panels .panel-head { min-height: 0; padding: 16px; flex-wrap: wrap; gap: 10px; } .catalogue-overview-panels .panel-head > div { flex-basis: 100%; } .catalogue-overview-panels .panel-head .panel-action { margin-left: 0; } .catalogue-overview-panels .channel-ranking-head { padding-right: 16px; padding-left: 16px; } .diffusion-date-fields { grid-template-columns: 1fr; } .catalogue-switcher-avatar { width: 38px; height: 38px; } .catalogue-create-dialog form { padding: 28px 20px 22px; } .catalogue-create-actions { display: grid; grid-template-columns: 1fr; } .catalogue-create-sources { grid-template-columns: 1fr; } .catalogue-create-source { min-height: 62px; } .catalogue-create-actions .button { width: 100%; min-height: 44px; } .drawer-vod-offers-list { grid-template-columns: 1fr; } .work-search-panel { padding: 15px; border-radius: 17px; } .catalogue-content-head h2 { font-size: 22px; } .work-search-form { gap: 7px; padding: 7px; border-radius: 14px; } .work-search-form > span:first-child { padding-left: 4px; font-size: 22px; } .work-search-form input { font-size: 16px; } .work-search-result { grid-template-columns: 44px minmax(0,1fr); gap: 11px; } .work-search-result .programme-poster-featured { width: 44px; } .source-chip { font-size: var(--text-micro); } .catalogue-work-card { grid-template-columns: 54px minmax(0,1fr); gap: 11px; padding: 11px; } .catalogue-work-card .programme-poster-featured { width: 54px; } .client-catalogue-empty, .catalogue-scope-placeholder { min-height: 310px; padding: 32px 18px; } .client-catalogue-empty h2, .catalogue-scope-placeholder h2 { font-size: 27px; } } @media (max-width: 390px) { .drawer-hero-layout { grid-template-columns: 1fr; } .programme-poster-drawer { width: 92px; } .drawer-hero-copy, .work-detail-hero-copy { padding-top: 0; } .work-detail-hero-layout { grid-template-columns: 1fr; } .data-coverage-facts { grid-template-columns: 1fr; } .data-coverage--footer .data-coverage-facts { grid-template-columns: 1fr; } } /* Le modèle mobile de Diffusions est aussi celui des aperçus de programmation. */ .airing-mobile-preview { display: none; } .airing-date-mobile { display: none; } @media screen and (max-width: 860px) { :root { --text-work-title: 18px; } :is(.catalogue-diffusions-page, .work-diffusions-table-region, .airing-mobile-preview) .airing-date-desktop { display: none; } :is(.catalogue-diffusions-page, .work-diffusions-table-region, .airing-mobile-preview) .airing-date-mobile { display: inline; } .airing-desktop-preview { display: none; } .airing-mobile-preview { display: block; min-width: 0; } .panel > .airing-mobile-preview { padding: 0 16px 16px; } .airing-mobile-preview .airing-catalogues-cell { grid-column: 1 / -1; } .airing-mobile-preview .macro-catalogue-chip { padding: 8px 0; border: 0; border-radius: 0; background: transparent; font-size: var(--text-label); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; } .catalogue-diffusions-page .diffusions-summary .kpi-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } .catalogue-diffusions-page .diffusions-summary .kpi-card { grid-column: auto; } :is(.catalogue-diffusions-page, .work-diffusions-table-region, .airing-mobile-preview) .airing-table-wrap { overflow: visible; border: 0; border-radius: 0; background: transparent; } :is(.catalogue-diffusions-page, .work-diffusions-table-region, .airing-mobile-preview) .airing-table { display: block; min-width: 0; } :is(.catalogue-diffusions-page, .work-diffusions-table-region, .airing-mobile-preview) .airing-table thead { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; } :is(.catalogue-diffusions-page, .work-diffusions-table-region, .airing-mobile-preview) .airing-table tbody { display: grid; gap: 12px; } /* Œuvre, chaîne, puis date et horaires : trois rangées stables et compactes. */ :is(.catalogue-diffusions-page, .work-diffusions-table-region, .airing-mobile-preview) .airing-row { --airing-card-padding: 12px; --airing-logo-size: 28px; --airing-logo-gap: 10px; display: grid; grid-template-columns: max-content minmax(0,1fr); align-items: center; gap: 6px 10px; padding: var(--airing-card-padding); border: 1px solid var(--line); border-radius: 14px; background: var(--card); } :is(.catalogue-diffusions-page, .work-diffusions-table-region, .airing-mobile-preview) .airing-row td { display: block; width: auto; min-width: 0; max-width: 100%; padding: 0; border: 0; } :is(.catalogue-diffusions-page, .work-diffusions-table-region, .airing-mobile-preview) .airing-channel-cell .channel-identity { gap: var(--airing-logo-gap); max-width: 100%; } :is(.catalogue-diffusions-page, .airing-mobile-preview) .airing-work-cell { grid-column: 1 / -1; } :is(.catalogue-diffusions-page, .work-diffusions-table-region, .airing-mobile-preview) .airing-channel-cell { grid-column: 1 / -1; } :is(.catalogue-diffusions-page, .airing-mobile-preview) .airing-work-cell .programme-with-poster { grid-template-columns: 40px minmax(0,1fr); gap: 12px; } :is(.catalogue-diffusions-page, .airing-mobile-preview) .airing-work-cell .programme-poster-compact { width: 40px; } :is(.catalogue-diffusions-page, .work-diffusions-table-region, .airing-mobile-preview) .airing-channel-cell .channel-day-link { min-height: 36px; max-width: 100%; } :is(.catalogue-diffusions-page, .work-diffusions-table-region, .airing-mobile-preview) .airing-channel-cell .channel-identity-name { overflow-wrap: anywhere; } :is(.catalogue-diffusions-page, .work-diffusions-table-region, .airing-mobile-preview) .airing-row .channel-logo-frame { --channel-logo-size: var(--airing-logo-size); } :is(.catalogue-diffusions-page, .work-diffusions-table-region, .airing-mobile-preview) .airing-date-cell { grid-column: 1; align-self: center; white-space: nowrap; line-height: 1.4; } :is(.catalogue-diffusions-page, .work-diffusions-table-region, .airing-mobile-preview) .airing-schedule-cell { grid-column: 2; } :is(.catalogue-diffusions-page, .work-diffusions-table-region, .airing-mobile-preview) .airing-time-slot { grid-template-columns: 5ch minmax(0,1fr); gap: 10px; } :is(.catalogue-diffusions-page, .work-diffusions-table-region, .airing-mobile-preview) .airing-time-slot .slot-chip { min-width: 0; white-space: normal; overflow-wrap: anywhere; } .work-diffusions-table-region { padding: 16px; } /* Dans la fiche, reprendre la carte chaîne de l'aperçu latéral. */ .work-diffusions-table-region .airing-row { --airing-card-padding: 14px; --airing-logo-size: 64px; position: relative; grid-template-columns: max-content minmax(0,1fr); gap: 10px; background: #f7f8f5; } .work-diffusions-table-region .airing-row:has(.channel-identity:not(.is-missing) .channel-logo-frame) { min-height: 92px; padding-left: 90px; } .work-diffusions-table-region .airing-row .channel-logo-frame { position: absolute; top: 14px; left: 14px; border-radius: 10px; } .work-diffusions-table-region .airing-channel-cell .channel-day-link { min-height: 0; } } @media screen and (max-width: 620px) { .catalogue-diffusions-page .page-heading { margin-bottom: 18px; } .catalogue-diffusions-page .catalogue-heading-identity { gap: 12px; } .catalogue-diffusions-page .catalogue-avatar--large { --catalogue-avatar-size: 56px; border-radius: 12px; } .catalogue-diffusions-page .page-heading h1 { font-size: 30px; letter-spacing: -1px; } .catalogue-diffusions-page .page-heading .eyebrow { margin-top: 0; } .catalogue-diffusions-page .diffusions-results-head .button { min-height: 44px; } .catalogue-diffusions-page .diffusion-date-fields input, .catalogue-diffusions-page .diffusion-date-fields select { max-width: 100%; min-height: 44px; font-size: 16px; } .catalogue-diffusions-page .diffusion-slot-options { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; } .catalogue-diffusions-page .diffusion-slot-option { min-width: 0; } .catalogue-diffusions-page .diffusion-slot-option .slot-chip { width: 100%; min-height: 44px; padding: 7px 8px; gap: 5px; } .catalogue-diffusions-page .diffusion-filter-panel .catalogue-filter-reset { grid-column: 1 / -1; min-height: 44px; margin: 0; } .catalogue-diffusions-page .diffusions-summary .kpi-grid { gap: 10px; } .catalogue-diffusions-page .kpi-card { padding: 14px 12px; border-radius: 14px; } .catalogue-diffusions-page .kpi-card small { min-height: 34px; font-size: var(--text-small); } .catalogue-diffusions-page .kpi-card strong { font-size: 27px; } .catalogue-diffusions-page .kpi-card span { display: block; font-size: var(--text-micro); line-height: 1.4; } } @media print { body { background: #fff; } .catalogue-summary-screen { display: none !important; } .catalogue-summary-print { display: block; } .sidebar, .topbar, .access-notice, .page-heading, .report-side, .report-kind-list, .ambient { display: none !important; } .workspace { display: block; } .view-root { padding: 0; } .report-layout { display: block; } .report-sheet { border: 0; box-shadow: none; padding: 0; } /* Éviter la rastérisation des ombres d’affiches en rectangles dans le PDF. */ .report-sheet .programme-poster, .work-detail-page .programme-poster { box-shadow: none; background: #eef1ed; } .report-print-header, .report-print-summary { display: block; } .demo-export-notice { display: block; margin: 0 0 16px; font-weight: 700; } .restricted-value-mask { display: none; } .restricted-value::after { content: 'Masqué'; } .report-screen-heading, .report-screen-summary { display: none; } .report-kpis, .report-activity { grid-template-columns: repeat(3,minmax(0,1fr)); } .report-kpis > div { padding: 12px; border-top: 1px solid var(--line); } .report-kpis b { font-size: 28px; } .report-section .section-title { break-after: avoid; } .report-section > .data-table-wrap { overflow: visible; } .report-12m .report-ranking-grid { display: block; } .report-12m .report-section, .report-12m .report-data-footer { break-before: page; page-break-before: always; margin-top: 0; } .report-sheet .channel-logo-placeholder { print-color-adjust: exact; -webkit-print-color-adjust: exact; } .report-table tr, .report-channel-ranking-list li { break-inside: avoid; } .report-summary, .report-kpis, .report-activity { break-inside: avoid; } .report-overview { print-color-adjust: exact; -webkit-print-color-adjust: exact; } .report-overview .panel-action, .report-overview .kpi-card-arrow, .report-overview .catalogue-ranking-link > span[aria-hidden="true"] { display: none; } .report-overview .overview-history-panel, .report-overview .overview-kpis { break-inside: avoid; } .report-overview .chart-wrap-with-works { overflow: visible; } .report-overview .annual-history { width: 100%; min-width: 0; } .report-overview .annual-history-plot { min-height: 260px; } /* Une section par page après l’identité, les indicateurs et l’historique. */ .report-overview .catalogue-ranking-grid { display: block; margin-top: 0; } .report-overview .overview-upcoming-panel, .report-overview .overview-hourly-panel, .report-overview .overview-work-frequency, .report-overview .catalogue-ranking-grid > .panel { break-before: page; page-break-before: always; break-inside: avoid-page; page-break-inside: avoid; margin-top: 0; } .report-overview .upcoming-list, .report-overview .channel-ranking-list { display: block; } .report-overview .overview-upcoming-grid { padding-block: 6px 12px; } .report-overview .overview-upcoming-grid .upcoming-item { min-height: 0; padding-block: 10px; row-gap: 4px; } .report-overview .overview-upcoming-grid .upcoming-context { gap: 4px 10px; } .report-overview .overview-upcoming-grid .upcoming-channel-line { flex: 0 1 auto; max-width: 100%; } .report-overview .overview-upcoming-grid .channel-identity-name { white-space: normal; overflow-wrap: anywhere; } .report-overview .top-programmed-item { min-height: 96px; padding-block: 10px; } .report-overview .channel-ranking-track { display: block; } .report-overview .channel-ranking-item { grid-template-columns: minmax(0,1fr) minmax(60px,1fr) 64px; } .report-overview .panel-head { break-after: avoid; } .report-overview .catalogue-programming-grid > .panel > .panel-head { grid-template-columns: minmax(0,1fr); } .report-overview .upcoming-item, .report-overview .channel-ranking-item { break-inside: avoid; } .report-promo-page { display: flex; flex-direction: column; gap: 28px; min-height: 230mm; margin: 0; padding: 10mm 8mm; break-before: page; page-break-before: always; break-inside: avoid-page; background: var(--paper); color: var(--ink); print-color-adjust: exact; -webkit-print-color-adjust: exact; } .report-promo-brand { display: flex; align-items: center; } .report-promo-brand .brand-signature { width: 210px; } .report-promo-intro .eyebrow { margin: 0 0 14px; color: var(--ink-soft); } .report-promo-intro h2 { margin: 0; font-family: Georgia, "Times New Roman", serif; font-size: 48px; font-weight: 500; line-height: 1.08; letter-spacing: -1.5px; } .report-promo-intro h2 em { color: var(--coral-dark); } .report-promo-intro > p:last-child { max-width: 520px; margin: 20px 0 0; color: var(--ink-soft); font-size: 18px; line-height: 1.55; } .report-promo-benefits { display: grid; gap: 18px; margin: 0; padding: 0; list-style: none; } .report-promo-benefits li { padding-left: 16px; border-left: 3px solid var(--coral); } .report-promo-benefits strong { display: block; margin-bottom: 5px; font-size: 17px; } .report-promo-benefits span { color: var(--ink-soft); font-size: 14px; line-height: 1.5; } .report-promo-contact { margin-top: auto; padding-top: 22px; border-top: 1px solid var(--line); } .report-promo-contact h3 { margin: 0 0 14px; font-size: 24px; line-height: 1.25; } .report-promo-contact a { display: block; width: fit-content; margin-top: 6px; color: var(--ink); font-size: 17px; text-decoration: underline; text-underline-offset: 3px; } .panel { border: 0; } .data-coverage--footer { break-inside: avoid; border: 1px solid #dfe4df; } .data-coverage--footer .data-coverage-facts { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); } /* Fiche œuvre : toujours imprimer la synthèse, quel que soit l’onglet ouvert. */ .work-detail-page { display: block; max-width: none; margin: 0; color: var(--ink); print-color-adjust: exact; -webkit-print-color-adjust: exact; } .work-detail-page .work-detail-toolbar, .work-detail-page .work-detail-tabs, .work-detail-page .work-detail-hero .work-external-links, .work-detail-page .work-detail-hero .work-source-links, .work-detail-page [data-work-panel="diffusions"], .work-detail-page .work-vod-filter-bar { display: none !important; } .work-detail-page [data-work-panel="summary"] { display: block !important; } .work-detail-page [data-work-panel="vod"] { display: block !important; break-before: page; page-break-before: always; } .work-detail-page .work-detail-vod .drawer-vod-offers-list { grid-template-columns: repeat(2,minmax(0,1fr)); } .work-detail-page .work-detail-vod .drawer-vod-offer { display: flex !important; break-inside: avoid; page-break-inside: avoid; } .work-detail-page .report-brand { padding-bottom: 12px; margin-bottom: 16px; } .work-detail-page .work-detail-hero { display: grid; grid-template-columns: minmax(0,1fr) 170px; grid-template-rows: auto 1fr; column-gap: 20px; margin-bottom: 18px; padding: 16px; border: 1px solid var(--line); border-radius: 14px; break-inside: avoid; } .work-detail-page .work-detail-hero-layout { grid-column: 1; grid-row: 1 / 3; grid-template-columns: 110px minmax(0,1fr); gap: 20px; } .work-detail-page .programme-poster-drawer { width: 110px; } .work-detail-page .work-detail-hero-copy h1 { font-size: 30px; } .work-detail-page .work-detail-hero > .drawer-metrics-title { grid-column: 2; grid-row: 1; margin: 0; padding: 0 0 10px 16px; border-left: 1px solid var(--line); font-size: 15px; } .work-detail-page .work-activity-strip { grid-column: 2; grid-row: 2; grid-template-columns: minmax(0,1fr); align-content: start; gap: 10px; margin: 0; padding-left: 16px; border-left: 1px solid var(--line); } .work-detail-page .work-activity-strip button { display: grid; grid-template-columns: minmax(32px,max-content) minmax(0,1fr); align-items: baseline; column-gap: 8px; min-height: 0; padding: 0; border: 0; border-radius: 0; background: none; opacity: 1; } .work-detail-page .work-activity-strip b { font-size: 22px; } .work-detail-page .work-activity-strip span { font-size: 12px; line-height: 1.4; white-space: normal; } .work-detail-page [data-action="work-detail-goto-history"] small { display: none; } .work-detail-page .drawer-vod-summary { margin-top: 12px; } .work-detail-page .work-detail-insights-grid { display: block; } .work-detail-page .work-detail-section { margin-bottom: 18px; overflow: visible; border: 1px solid var(--line); border-radius: 12px; } .work-detail-page .panel-head { padding: 14px 16px; break-after: avoid; } .work-detail-page .panel-head h2 { font-size: 18px; } .work-detail-page .channel-ranking-head { break-after: avoid; } .work-detail-page .work-detail-section-body { padding: 14px 16px; } .work-detail-page .work-detail-yearly-table-wrap { padding: 0 16px 12px; overflow: visible; } .work-detail-page .work-detail-yearly-panel { break-inside: avoid; page-break-inside: avoid; } .work-detail-page .work-detail-yearly-table { min-width: 0; } .work-detail-page .work-detail-yearly-table td { height: 32px; } .work-detail-page .channel-ranking-list { display: block; padding: 0 16px 12px; } .work-detail-page .channel-ranking-item { display: grid; grid-template-columns: minmax(0,1fr) minmax(60px,1fr) 64px; min-height: 48px; } .work-detail-page .channel-ranking-track { display: block; } .work-detail-page .channel-ranking-item, .work-detail-page .work-detail-yearly-table tr { break-inside: avoid; } .work-detail-page .data-coverage--footer { margin-top: 18px; } } @media (prefers-reduced-motion: reduce) { .inline-spinner { animation: none; } .coverage-strip.is-loading .coverage-value::after { animation: none; } .catalogue-create-field input, .work-search-form, .catalogue-work-card { transition: none; } }