/* Pixel — luminous watch dials, solid surfaces and precise circular details. */
html[data-style="3"] {
 --radius:28px !important;
 --px-lilac:var(--accent);--px-cyan:#087991;--px-mint:#19785f;
 --px-chip:color-mix(in srgb,var(--accent) 10%,var(--surface));
 --px-rim:color-mix(in srgb,var(--accent) 27%,var(--line));
 --px-round:'Terondo Ronde',ui-rounded,'SF Pro Rounded','Avenir Next',system-ui,sans-serif;
 --px-shadow:0 9px 26px -20px color-mix(in srgb,var(--ink) 30%,transparent);
}
html[data-style="3"][data-theme="dark"] {--px-cyan:#70dcf5;--px-mint:#80e6c0;--px-shadow:0 12px 30px -20px #000b}
html[data-style="3"]:not([data-pixel-harmony]) {
 --surface:#f8f9ff !important;--ink:#1c2234 !important;--muted:#536079 !important;--line:#cdd3e4 !important;--soft:#e7eaf5 !important;--g-surf2:#e7eaf5 !important;
}
html[data-style="3"]:not([data-pixel-harmony]):not([data-pixel-background]) {--bg:#eef0f8 !important}
html[data-style="3"]:not([data-pixel-harmony]):not([data-pixel-accent]) {--accent:#5950b8 !important}
html[data-style="3"][data-theme="dark"]:not([data-pixel-harmony]) {
 --surface:#121620 !important;--ink:#f0f2ff !important;--muted:#a6afc7 !important;--line:#30364b !important;--soft:#1b2131 !important;--g-surf2:#1b2131 !important;
}
html[data-style="3"][data-theme="dark"]:not([data-pixel-harmony]):not([data-pixel-background]) {--bg:#080a0f !important}
html[data-style="3"][data-theme="dark"]:not([data-pixel-harmony]):not([data-pixel-accent]) {--accent:#c2baff !important}
html[data-style="3"] body {background:var(--bg);color:var(--ink)}
html[data-style="3"] :is(h1,h2,h3,.heros-titre,.th-format strong,.th-quick-card strong,button,.heros-cta,.mega-family>summary) {font-family:var(--px-round)}
html[data-style="3"] :is(h1,h2,h3,.heros-titre) {font-weight:720;letter-spacing:-.035em}
html[data-style="3"] :is(.carousel-steps,.mh-live-n,.listing-toolbar,.stream-time) {font-variant-numeric:tabular-nums}
/* One watch-band navigation, with five solid, softly outlined capsules. */
html[data-style="3"] body>header:has(>.top) {background:var(--bg);border:0;box-shadow:none}
html[data-style="3"] body>header:has(>.top)::before {display:none}
html[data-style="3"] body>header .top {padding-block:24px 20px}
html[data-style="3"] body>header .mega {min-height:64px;padding:6px;gap:7px;border:1px solid var(--line);border-radius:999px;background:var(--surface);box-shadow:none}
html[data-style="3"] body>header .mega::before,html[data-style="3"] body>header .mega::after {display:none}
html[data-style="3"] .mega>.mega-family {flex:1 1 auto;--px-signal:var(--accent)}
html[data-style="3"] .mega>.mega-family:nth-child(2) {--px-signal:var(--px-cyan)}
html[data-style="3"] .mega>.mega-family:nth-child(3) {--px-signal:var(--px-mint)}
html[data-style="3"] body>header .mega>.mega-family>summary {justify-content:center;min-height:48px;padding:0 18px;border-radius:999px;border:1px solid transparent;font-weight:650;letter-spacing:-.02em;transition:color .18s ease,background .18s ease,border-color .18s ease}
html[data-style="3"] body>header nav.mega>.mega-family.mega-actif>summary[aria-current],
html[data-style="3"] body>header .mega>.mega-family[open]>summary {
 color:var(--px-signal);background:color-mix(in srgb,var(--px-signal) 11%,var(--surface)) !important;border-color:color-mix(in srgb,var(--px-signal) 65%,var(--line));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--px-signal) 12%,transparent);
}
html[data-style="3"] body>header .mega>.mega-family>.mega-panel {top:calc(100% + 10px);border:1px solid var(--px-rim);border-radius:28px;background:var(--surface);box-shadow:0 20px 60px #0003;color:var(--ink)}
html[data-style="3"] .mega :is(.mega-porte,.mega-close) {border:1px solid var(--line);border-radius:999px;background:var(--soft);color:var(--ink);min-height:40px}
html[data-style="3"] .mega .mega-porte[aria-selected="true"],html[data-style="3"] .mega .mega-porte.active,html[data-style="3"] .mega .mega-porte[aria-pressed="true"] {color:var(--accent);border-color:var(--accent)}
html[data-style="3"] body>header form.search {border:1px solid var(--line);border-radius:999px;background:var(--surface);box-shadow:inset 0 0 0 4px color-mix(in srgb,var(--bg) 40%,transparent)}
html[data-style="3"] body>header form.search input {background:transparent;color:var(--ink)}
html[data-style="3"] body>header .mh-grappe :is(.mh-ib,.header-locale-label),html[data-style="3"] body>header .em-actions :is(#favorites,.em-toggle) {border:1px solid var(--px-rim);border-radius:50%;background:var(--px-chip);color:var(--accent);box-shadow:inset 0 0 0 3px var(--surface)}
html[data-style="3"] body>header .mh-grappe .mh-pro {background:var(--accent);color:var(--bg);border-radius:999px;box-shadow:none}
/* Feature panel: rounded numerals' rhythm, a luminous dial around play. */
html[data-style="3"] .th-home .heros-carte {background:var(--surface) !important;color:var(--ink);border:1px solid var(--line);border-radius:32px;box-shadow:var(--px-shadow);padding:36px 38px 24px;gap:26px 40px}
html[data-style="3"] .heros-titre {font-family:var(--px-round);font-size:clamp(30px,3.7vw,50px);line-height:1.08;letter-spacing:-.045em;font-weight:730;color:var(--ink)}
html[data-style="3"] .heros-titre mark {background:color-mix(in srgb,var(--accent) 14%,var(--surface));color:var(--accent);padding:.015em .13em;border-radius:.25em}
html[data-style="3"] .heros-lieu {display:inline-flex;align-items:center;gap:9px;width:fit-content;padding:7px 12px;border:1px solid color-mix(in srgb,var(--px-mint) 34%,var(--line));border-radius:999px;color:var(--px-mint);font-size:11px;letter-spacing:.14em;opacity:1}
html[data-style="3"] .heros-lieu::before {content:'';width:6px;height:6px;border:2px solid var(--px-mint);border-radius:50%;box-shadow:0 0 0 3px color-mix(in srgb,var(--px-mint) 9%,transparent)}
html[data-style="3"] .heros-dit {color:var(--muted)}
html[data-style="3"] .heros-cta {border:1px solid var(--accent);background:var(--accent);color:var(--bg);border-radius:999px;min-height:46px;padding-inline:22px;font-family:var(--px-round);font-weight:750;box-shadow:inset 0 0 0 3px color-mix(in srgb,var(--surface) 12%,transparent)}
html[data-style="3"] .heros-carte .heros-media {border-radius:26px;--ec-h:7px;--ec-b:7px;background:#080b12;box-shadow:0 0 0 1px var(--line),inset 0 0 0 2px color-mix(in srgb,var(--accent) 12%,transparent)}
html[data-style="3"] .heros-carte .heros-media :is(img,iframe) {border-radius:19px}
html[data-style="3"] .heros-lire {width:48px;height:48px;min-width:44px;min-height:44px;background:#0b101dd9 !important;border:1px solid #c2baff66;box-shadow:none}
html[data-style="3"] .heros-lire::before {display:none}
html[data-style="3"] .heros-lire::after {left:19px;top:15px;border-left:12px solid #ded9ff;border-top:8px solid transparent;border-bottom:8px solid transparent}
/* Carousels become miniature complications: real counters, luminous rim. */
html[data-style="3"] .carousel-steps {padding:4px;border:1px solid var(--px-rim);background:var(--bg);box-shadow:inset 0 0 0 3px var(--surface);gap:4px}
html[data-style="3"] .carousel-steps>span {font-family:var(--px-round);font-weight:750;font-size:15px;letter-spacing:.02em;color:var(--px-cyan);min-width:72px}
html[data-style="3"] .carousel-nav button {color:var(--accent);border-radius:50%;background:var(--soft)}
html[data-style="3"] .carousel-caption {text-transform:uppercase;letter-spacing:.14em;font-size:10px;color:var(--muted)}
/* Cards use the small instrument shapes of the references. */
html[data-style="3"] :is(.th-quick-card,.th-format,.card,.memory,.selection) {border:1px solid var(--line);border-radius:28px;background:var(--surface);box-shadow:none;--px-signal:var(--accent)}
html[data-style="3"] :is(.th-quick-card:nth-child(4n+2),.th-format[data-format="radio"]) {--px-signal:var(--px-cyan)}
html[data-style="3"] :is(.th-quick-card:nth-child(4n+3),.th-format[data-format="podcast"]) {--px-signal:var(--px-mint)}
html[data-style="3"] .th-quick-card {padding:24px;gap:16px;min-height:154px}
html[data-style="3"] .th-quick-card .th-meta {font-size:10px;letter-spacing:.13em;font-weight:750;color:var(--px-signal);display:flex;align-items:center;gap:8px}
html[data-style="3"] .th-quick-card .th-meta::before {content:'';flex:none;width:6px;height:6px;border:2px solid var(--px-signal);border-radius:50%}
html[data-style="3"] .th-quick-card strong {font-size:19px;font-weight:720;letter-spacing:-.025em}
html[data-style="3"] .th-quick-card .th-go {display:grid;place-items:center;width:34px;height:34px;font-size:20px;line-height:1;border:1px solid color-mix(in srgb,var(--px-signal) 40%,var(--line));border-radius:50%;color:var(--px-signal);background:color-mix(in srgb,var(--px-signal) 8%,var(--surface))}
html[data-style="3"] .th-format {padding:24px;gap:14px;min-height:126px;position:relative}
html[data-style="3"] .th-format svg {box-sizing:border-box;width:56px;height:56px;padding:12px;border-radius:50%;background:color-mix(in srgb,var(--px-signal) 8%,var(--surface));color:var(--px-signal)}
html[data-style="3"] .th-format::before {content:'';position:absolute;left:20px;top:calc(50% - 32px);width:64px;height:64px;border-radius:50%;pointer-events:none;background:repeating-conic-gradient(var(--px-signal) 0deg 3deg,transparent 3deg 20deg);mask:radial-gradient(transparent 61%,#000 64%,#000 70%,transparent 73%);-webkit-mask:radial-gradient(transparent 61%,#000 64%,#000 70%,transparent 73%);opacity:.8;transition:transform .4s ease}
html[data-style="3"] .th-format strong {font-size:18px;font-weight:720}
html[data-style="3"] .th-format-arrow {color:var(--px-signal)}
html[data-style="3"] :is(.th-place,.th-mag-card,.th-banner) {border-radius:28px;border-color:var(--line)}
/* Search, catalogue and the player inherit the same physical controls. */
html[data-style="3"] #browse .explore-panel {padding:28px 30px;border-radius:30px;border:1px solid var(--line);background:var(--surface);box-shadow:none}
html[data-style="3"] #browse #explore-title {font-weight:730;letter-spacing:-.035em}
html[data-style="3"] #browse .explore-label {font-size:11px;text-transform:uppercase;letter-spacing:.09em;color:var(--muted)}
html[data-style="3"] #browse :is(#query,.explore-field select,.listing-toolbar select) {border:1px solid var(--px-rim);border-radius:999px;background:var(--bg);color:var(--ink);box-shadow:inset 0 0 0 3px var(--surface)}
html[data-style="3"] #browse #search button {border-radius:999px;background:var(--accent);color:var(--bg);font-weight:750}
html[data-style="3"] #browse .result[data-listing-card] {border-radius:26px;border-color:var(--line);background:var(--surface);box-shadow:none}
html[data-style="3"] #browse .listing-copy :is(h2,h3) {font-family:var(--px-round);font-weight:700;letter-spacing:-.02em}
html[data-style="3"] #browse .listing-copy .label {border:1px solid var(--px-rim);background:var(--px-chip);color:var(--accent);padding:4px 9px;border-radius:999px;font-size:10px;letter-spacing:.08em}
html[data-style="3"] #browse .listing-visual {border-radius:20px;background:var(--soft)}
html[data-style="3"] :is(.fav2-card-heart,.fav2-close,.ap-close,.stream-controls button,.stream-tools button,.stream-settings button) {border-radius:999px;border-color:var(--px-rim)}
html[data-style="3"] #detail :is(.stream-controls,.stream-tools,.stream-settings) {border-radius:24px;border-color:var(--line);background:var(--surface)}
html[data-style="3"] #detail .stream-player {border-color:var(--px-rim);box-shadow:0 0 0 3px var(--bg)}
html[data-style="3"] :is(.ap-panel,.fav2-dialog,.home-search-panel) {background:var(--surface);color:var(--ink);border:1px solid var(--px-rim);border-radius:28px;box-shadow:0 20px 60px #0004}
html[data-style="3"] :is(.ap-mode,.ap-reset,.ap-close) {border-radius:999px}
html[data-style="3"] .ac-preview[data-style="3"] {background:var(--bg);border:1px solid var(--px-rim);border-radius:22px}
html[data-style="3"] .ac-preview[data-style="3"] .ac-preview-picture {border-radius:50%;clip-path:none;background:repeating-conic-gradient(var(--accent) 0deg 4deg,transparent 4deg 30deg),var(--soft);border:7px solid var(--bg);box-shadow:0 0 0 1px var(--px-rim);width:76px;height:76px;mask:radial-gradient(transparent 43%,#000 46%);-webkit-mask:radial-gradient(transparent 43%,#000 46%)}
html[data-style="3"] :is(button,a,input,select,summary):focus-visible {outline:3px solid var(--accent);outline-offset:4px}
html[data-style="3"] select option {background:var(--surface);color:var(--ink)}
@media(hover:hover) and (pointer:fine) {
 html[data-style="3"] body>header .mega>.mega-family>summary:hover {background:color-mix(in srgb,var(--px-signal) 10%,var(--surface));color:var(--px-signal);border-color:var(--px-signal)}
 html[data-style="3"] :is(.th-quick-card,.th-format) {transition:transform .2s ease,border-color .2s ease,background .2s ease}
 html[data-style="3"] :is(.th-quick-card,.th-format):hover {border-color:var(--px-signal);background:color-mix(in srgb,var(--px-signal) 5%,var(--surface));transform:translateY(-2px);color:var(--ink)}
 html[data-style="3"] .th-format:hover::before {transform:rotate(20deg)}
 html[data-style="3"] .heros-lire:hover {background:#171d30 !important;border-color:#c2baff}
 html[data-style="3"] :is(.heros-cta,.carousel-nav button:not(:disabled)):hover {box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 16%,transparent)}
}
@media(min-width:761px) and (max-width:1000px) {
 html[data-style="3"] .th-format::before {top:16px;left:12px}
}
@media(max-width:900px) {
 html[data-style="3"] .th-home .heros-carte {padding:25px;gap:22px}
 html[data-style="3"] .th-format {padding:20px 16px;gap:12px}
 html[data-style="3"] .th-format::before {left:12px}
 html[data-style="3"] .th-format strong {font-size:16px}
}
@media(max-width:760px) {
 html[data-style="3"] body>header .top {padding-block:12px}
 html[data-style="3"] body>header .mega {min-height:54px;padding:4px;gap:2px;border-radius:28px}
 html[data-style="3"] body>header[data-mobile01] .mega>.mega-family>summary {min-height:44px;padding:0;border-radius:24px}
 html[data-style="3"] body>header[data-mobile01] .mega>.mega-family>summary::before {font-size:11px}
 html[data-style="3"] body>header[data-mobile01].em-open .mh-grappe {background:var(--surface);border:1px solid var(--px-rim);border-radius:24px}
 html[data-style="3"] .th-home .heros-carte {padding:14px 16px 18px;border-radius:28px;gap:20px}
 html[data-style="3"] .heros-titre {font-size:32px;line-height:1.1}
 html[data-style="3"] .heros-carte .heros-media {border-radius:22px;--ec-h:5px;--ec-b:5px}
 html[data-style="3"] .heros-carte .heros-media :is(img,iframe) {border-radius:17px}
 html[data-style="3"] .th-quick-card {padding:22px;min-height:145px}
 html[data-style="3"] #browse .explore-panel {padding:22px 18px}
 html[data-style="3"] .th-format {border-radius:25px;min-height:155px;flex-wrap:wrap;align-content:start}
 html[data-style="3"] .th-format>span:not(.th-format-arrow) {width:100%}
 html[data-style="3"] .th-format::before {top:16px}
}
@media(prefers-reduced-motion:reduce) {
 html[data-style="3"] :is(.th-format,.th-quick-card,.heros-cta,.mega-family>summary,.th-format::before,.heros-lire::before) {transition:none !important;transform:none !important}
}
@media(prefers-contrast:more) {html[data-style="3"] {--px-rim:var(--muted)}}

@media(max-width:760px) {
 html[data-style="3"] .heros-lire {width:44px;height:44px}
 html[data-style="3"] .heros-lire::after {left:17px;top:13px}
}
/* Mobile settings are touch tiles: desktop icon circles must not stretch into ovals. */
@media(max-width:760px) {
 html[data-style="3"] body>header[data-mobile01].em-open .mh-grappe {padding:12px;gap:8px;grid-template-rows:26px repeat(3,minmax(48px,auto))}
 html[data-style="3"] body>header[data-mobile01] .mh-grappe :is(.mh-ib,.mh-langue,.em-option,.mh-pro) {height:48px;min-height:48px;border:1px solid transparent;border-radius:14px;padding:10px 12px;gap:10px;box-shadow:none;outline-offset:2px}
 html[data-style="3"] body>header[data-mobile01] .mh-grappe :is(.mh-ib,.mh-langue,.em-option) {background:var(--soft);color:var(--ink);transition:background .18s ease,border-color .18s ease}
 html[data-style="3"] body>header[data-mobile01] .mh-grappe .mh-langue {padding:0}
 html[data-style="3"] body>header[data-mobile01] .mh-grappe .header-locale-label {height:46px;min-height:46px;padding:10px 12px;gap:10px;border:0;border-radius:13px;background:transparent;color:var(--ink);box-shadow:none}
 html[data-style="3"] body>header[data-mobile01] .mh-grappe :is(.mh-ib,.em-option)>svg,
 html[data-style="3"] body>header[data-mobile01] .header-locale-label::after {color:var(--accent)}
 html[data-style="3"] body>header[data-mobile01] .mh-grappe :is(.mh-ib,.mh-langue,.em-option):is(:hover,:active,:focus-within) {background:var(--px-chip);border-color:var(--px-rim)}
 html[data-style="3"] body>header[data-mobile01] .mh-grappe :is(.mh-ib,.em-option,.mh-pro):focus-visible,
 html[data-style="3"] body>header[data-mobile01] #langue-interface:focus-visible+.header-locale-label {outline:2px solid var(--accent);outline-offset:2px}
}
@media(max-width:760px) and (prefers-reduced-motion:reduce) {
 html[data-style="3"] body>header[data-mobile01] .mh-grappe :is(.mh-ib,.mh-langue,.em-option) {transition:none}
}
