/* CHIVI — shared visual language. Loaded after feature styles. */
:root{
 --ink:#12364b;--yellow:#009cec;--paper:#fbfcfd;--soft:#f0f5f8;
 --line:#dfe8ee;--muted:#607787;--accent:#087cae;
 --surface:#fff;--radius:14px;--radius-sm:10px;
 --shadow:0 6px 24px #12364b08;
}
body{background:var(--paper);line-height:1.5;-webkit-font-smoothing:antialiased}
h1,h2,h3{font-weight:700;text-wrap:pretty}
p{color:inherit}
button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}
a,button{transition:background-color .18s ease,color .18s ease,border-color .18s ease}
:where(button,a,input,textarea,select):focus-visible{outline:3px solid #009ceca6;outline-offset:3px}
body.fixed-header-layout>header{background:var(--surface);box-shadow:0 3px 16px #12364b06;border-bottom:1px solid var(--line)}
.location-strip{background:var(--soft);color:var(--muted)}
.section-nav{border-top-color:var(--line);border-bottom:0}
.section-nav .nav-scroll{gap:24px}
.section-nav button{font-size:13px;font-weight:500;color:var(--muted);border-bottom:2px solid transparent}
.section-nav button.active{color:var(--ink);border-bottom:2px solid var(--accent);font-weight:700}
.header-actions .icon-button{border-radius:var(--radius-sm)}
.header-actions .icon-button:hover{background:var(--soft);opacity:1}
.header-menu{background:var(--surface);border-bottom:1px solid var(--line)}
.searchbar input{background:var(--soft);border-color:var(--line);border-radius:var(--radius-sm)}
.edition{color:var(--muted);letter-spacing:.02em}
.section{margin-top:32px}
.section-head{border-top-color:var(--line);padding-top:20px;margin-bottom:20px}
.section-head h2{font-size:24px;line-height:1.2;letter-spacing:-.6px}
.eyebrow,.home-media-kicker{font-weight:700;letter-spacing:.08em;color:var(--muted)}
.hero-image,.card img,.article img,.real-card img{border-radius:var(--radius-sm)}
.hero-summary,.story-meta,.card p{color:var(--muted)}
.solid,.outline,.article-actions a,.culture-actions a{min-height:42px;border-radius:var(--radius-sm);font-weight:500}
.solid{background:var(--ink);color:#fff}
.outline{background:var(--surface);border-color:var(--line)}
.outline:hover{background:var(--soft);opacity:1}
.brief,.voice-box,.pharmacy-card,.obit-card,.culture-event,.bus-planner,.bus-smart-panel,.bus-geo-panel{border-radius:var(--radius);border-color:var(--line);box-shadow:var(--shadow)}
.article-source,.source-detail,.notice{border-radius:var(--radius-sm)}
/* Services belong to the same palette as the editorial entry points. */
#community-services,body.home-overview #community-services{margin:16px 0;border:1px solid var(--line);border-top:0;border-radius:var(--radius);background:var(--surface);box-shadow:none}
#community-services .service-switch{background:var(--surface);border-bottom:1px solid var(--line);padding:0 8px}
#community-services .service-tab{color:var(--muted);border-bottom-width:2px}
#community-services .service-tab[aria-pressed=true]{background:var(--soft);color:var(--accent);border-bottom-color:var(--accent)}
#community-services>.pharmacy-module{background:var(--soft);border-left:0!important}
#community-services .pharmacy-summary p,#community-services .sepelios-ticker{color:var(--ink)}
#community-services .pharmacy-home-today,#community-services .sepelios-home-day,#community-services .service-home-badge{background:var(--surface);color:var(--muted);border-color:var(--line);border-radius:6px}
#community-services button.service-expand-toggle{border-color:var(--line);color:var(--accent);border-radius:var(--radius-sm);min-height:40px}
#community-services .service-today-panel{background:var(--surface);border-color:var(--line);padding:18px}
/* Flat banners share rhythm, typography and navigation affordances. */
body.home-overview .home-media.home-media-banner,.home-media.home-media-banner,
body.home-overview #city-pulse,.home-assistant-banner{margin:16px 0 0;padding:0;border:0;background:none;box-shadow:none}
.media-banner-button{padding:22px 20px;gap:16px;min-height:116px;border-block:1px solid var(--line);background:var(--soft);border-radius:0;color:var(--ink)}
.media-banner-button:hover{background:#e8f1f6;opacity:1}
.media-banner-copy{gap:5px}
.media-banner-copy .home-media-title{font-size:clamp(22px,2.6vw,28px);font-weight:700;line-height:1.16;letter-spacing:-.65px}
.media-banner-copy .home-media-kicker{font-size:10px;color:var(--muted)}
.media-banner-caption{font-size:13px;line-height:1.5;color:var(--muted)}
.media-banner-open{font-size:12px;gap:10px;color:var(--accent)}
.media-banner-open>span{width:34px;height:34px;display:grid;place-items:center;border:1px solid #cedfe8;border-radius:50%;font-size:21px;background:var(--surface)}
.media-banner-button .media-intelligence{color:var(--accent)}
#culture-home.culture-home,body.home-overview #culture-home.culture-home{border:0;border-block:1px solid var(--line);border-radius:0;background:var(--soft);box-shadow:none;margin-top:16px;margin-bottom:16px}
#culture-home .culture-mini{border:0;background:transparent;box-shadow:none;border-radius:0}
#culture-home .culture-mini strong{color:var(--ink);font-weight:700}
#culture-home .culture-mini small{color:var(--muted)}
.culture-filter-group button,.feed-controls button,.source-chip{border-radius:100px;background:var(--surface);border:1px solid var(--line);color:var(--muted)}
.culture-filter-group button[aria-pressed=true],.feed-controls button.active{background:var(--ink);color:#fff;border-color:var(--ink)}
/* Every reading window uses the same surfaces and close controls. */
dialog,dialog.media-browser-dialog,dialog#chat.assistant-dialog{border-color:var(--line);background:var(--surface);color:var(--ink);border-radius:20px;box-shadow:0 24px 80px #12364b26}
dialog::backdrop,.media-browser-dialog::backdrop{background:#0d293a99}
.media-browser-dialog .media-browser-header,#chat .chat-head{background:var(--soft);color:var(--ink);border-color:var(--line)}
.media-browser-dialog .media-browser-header h2,#chat .chat-head h2{font-weight:700;letter-spacing:-.6px}
.media-browser-dialog .media-browser-header p,#chat .chat-head small{color:var(--muted)}
.media-browser-dialog .media-browser-close,.modal-close{display:grid;place-items:center;width:40px;height:40px;flex:0 0 40px;border:1px solid var(--line);background:var(--surface);border-radius:50%;font-size:19px}
.media-browser-dialog .media-browser-list{background:var(--paper);gap:12px}
.media-browser-dialog .media-browser-list .media-home-card{background:var(--surface);border-color:var(--line);border-radius:var(--radius);box-shadow:none}
.media-browser-dialog .media-browser-footer{background:var(--surface);border-color:var(--line);color:var(--muted)}
.media-browser-detail .source-detail,.pulse-reading .pulse-sources{border-color:var(--line)}
#chat #question,.user-question{background:var(--soft);border-color:var(--line);border-radius:var(--radius-sm)}
.bus-smart-input-shell input,.field input,.field textarea,.field select{border-color:var(--line);border-radius:var(--radius-sm);background:var(--surface)}
body>footer{background:var(--soft);border-top:1px solid var(--line);margin-top:40px;padding-top:28px}
body>footer .footer-inner p{color:var(--muted)}
@media(max-width:680px){
 .section{margin-top:26px}.section-head h2{font-size:22px}
 #community-services,body.home-overview #community-services{margin:12px 0;border-radius:12px}
 #community-services .service-today-panel{padding:14px}
 .media-banner-button{padding:18px 16px;gap:12px;min-height:108px}
 .media-banner-copy .home-media-title{font-size:22px}
 .media-banner-copy .home-media-kicker{font-size:9px}
 .media-banner-caption{font-size:12px}
 .media-banner-open{font-size:0;gap:0;flex-shrink:0}
 .media-banner-open>span{width:30px;height:30px;font-size:20px}
 body.home-overview .home-media.home-media-banner,.home-media.home-media-banner,body.home-overview #city-pulse,.home-assistant-banner{margin-top:12px}
 #culture-home.culture-home,body.home-overview #culture-home.culture-home{margin-top:12px;margin-bottom:12px}
 .media-browser-dialog .media-browser-header{padding:18px}
 .media-browser-dialog .media-browser-header h2,#chat .chat-head h2{font-size:22px}
 .media-browser-dialog .media-browser-close{width:36px;height:36px;flex-basis:36px}
 .article h1{font-size:32px;line-height:1.18}
 .footer-inner{gap:20px}
}
@media(prefers-reduced-motion:reduce){a,button{transition:none}}

/* Give the primary identity more presence at every viewport. */
body.fixed-header-layout .masthead{min-height:116px;padding-top:16px;padding-bottom:16px;gap:24px}
body.fixed-header-layout .masthead .identity-brand{gap:12px}
body.fixed-header-layout .masthead .brand-wordmark{width:200px;height:70px}
body.fixed-header-layout .masthead .brand-mascot{width:60px;height:60px}
@media(max-width:680px){
 body.fixed-header-layout .masthead{min-height:88px;padding-top:12px;padding-bottom:12px;gap:8px}
 body.fixed-header-layout .masthead .identity-brand{gap:8px}
 body.fixed-header-layout .masthead .brand-wordmark{width:146px;height:51px}
 body.fixed-header-layout .masthead .brand-mascot{width:44px;height:48px}
}
@media(max-width:360px){
 body.fixed-header-layout .masthead{min-height:80px;gap:4px}
 body.fixed-header-layout .masthead .identity-brand{gap:5px}
 body.fixed-header-layout .masthead .brand-wordmark{width:120px;height:42px}
 body.fixed-header-layout .masthead .brand-mascot{width:36px;height:42px}
}

/* Mobile overview: keep the three entry banners within the first screen. */
@media(max-width:680px){
 body.home-overview #app{padding-bottom:12px}
 body.home-overview .home-media.home-media-banner,body.home-overview #city-pulse{margin-top:8px;margin-bottom:0}
 body.home-overview .media-banner-button{padding:13px 12px;gap:10px;min-height:94px}
 body.home-overview .media-banner-copy{gap:3px}
 body.home-overview .media-banner-copy .home-media-title{font-size:clamp(19px,5.2vw,22px);line-height:1.15;letter-spacing:-.5px;overflow-wrap:anywhere}
 body.home-overview .media-banner-copy .home-media-kicker{font-size:9px;line-height:1.25}
 body.home-overview .media-banner-caption{font-size:12px;line-height:1.3;overflow-wrap:anywhere}
 body.home-overview .media-banner-button .media-intelligence,body.home-overview .pulse-banner-symbol,body.home-overview .assistant-banner-icon{width:30px;height:36px;flex:0 0 30px}
 body.home-overview .media-intelligence svg{width:30px;height:30px}
 body.home-overview #city-pulse .pulse-banner-symbol .pulse-magic{width:30px;height:30px}
 body.home-overview .assistant-banner-icon img{width:30px;height:36px;object-fit:contain}
 body.home-overview .media-banner-open{flex:0 0 30px}
 body.home-overview #community-services{margin:10px 0}
 body.home-overview #culture-home.culture-home{margin-top:8px;margin-bottom:8px;padding-block:7px}
 body.home-overview #culture-home .culture-mini .culture-poster,body.home-overview #culture-home .culture-mini .culture-image-fallback{width:60px;height:90px}
 body.home-overview>footer{margin-top:12px;padding-top:20px}
}
@media(max-width:680px) and (max-height:740px){
 body.home-overview .media-banner-button{min-height:82px;padding-block:10px}
 body.home-overview .media-banner-copy .home-media-kicker{display:none}
}

/* Service details follow CHIVI's shared visual language. */
#community-services #pharmacy-today,.pharmacy-detail .pharmacy-day-compact{border:0;border-radius:0;background:var(--surface);box-shadow:none;color:var(--ink)}
#community-services #pharmacy-today .pharmacy-compact-row,.pharmacy-detail .pharmacy-compact-row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px 18px;padding:16px 0;border-bottom:1px solid var(--line);background:transparent}
#community-services #pharmacy-today .pharmacy-compact-row:first-child{padding-top:0}
#community-services #pharmacy-today .pharmacy-compact-info,.pharmacy-detail .pharmacy-compact-info{flex:1 1 220px;min-width:0}
#community-services #pharmacy-today .pharmacy-compact-name,.pharmacy-detail .pharmacy-compact-name{align-items:center;gap:6px 10px}
#community-services #pharmacy-today .pharmacy-compact-name h3,.pharmacy-detail .pharmacy-compact-name h3{font:700 19px/1.25 Roboto,Arial,sans-serif;letter-spacing:-.3px;color:var(--ink);overflow-wrap:anywhere}
#community-services #pharmacy-today .pharmacy-compact-hours,.pharmacy-detail .pharmacy-compact-hours{padding:4px 8px;border:0;border-radius:6px;background:var(--soft);color:var(--muted);font-size:11px;line-height:1.4;font-weight:500}
#community-services #pharmacy-today .pharmacy-compact-hours.limited,.pharmacy-detail .pharmacy-compact-hours.limited{background:#fff5e5;color:#825b23}
#community-services #pharmacy-today .pharmacy-compact-info>p,.pharmacy-detail .pharmacy-compact-info>p{margin:5px 0 0;font-size:13px;line-height:1.45;color:var(--muted)}
#community-services #pharmacy-today .pharmacy-compact-actions,.pharmacy-detail .pharmacy-compact-actions{display:flex;flex-direction:row;align-items:center;flex-wrap:wrap;gap:8px;max-width:100%}
#community-services #pharmacy-today .pharmacy-compact-actions a,.pharmacy-detail .pharmacy-compact-actions a{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:8px 12px;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--surface);color:var(--accent);font:500 12px/1.35 Roboto,Arial,sans-serif;text-decoration:none;box-sizing:border-box}
#community-services #pharmacy-today .pharmacy-compact-actions a:hover,.pharmacy-detail .pharmacy-compact-actions a:hover{background:var(--soft);border-color:var(--accent)}
#community-services #pharmacy-today .pharmacy-compact-note,.pharmacy-detail .pharmacy-compact-note{padding:12px 0;background:transparent;color:var(--muted);font-size:11px;line-height:1.5}
#community-services .service-whatsapp,.pharmacy-detail .service-whatsapp{min-height:42px;margin:8px 0 0;padding:9px 13px;border-radius:var(--radius-sm);font:500 12px/1.4 Roboto,Arial,sans-serif;background:#f1f8f4;border-color:#d3e6da;color:#266345}
#community-services .service-whatsapp svg,.pharmacy-detail .service-whatsapp svg{width:19px;height:19px}
#community-services .service-history-link{display:block;width:fit-content;margin-top:14px;padding:8px 0;font-size:12px;font-weight:500;color:var(--accent)}
.pharmacy-detail .pharmacy-compact-heading{padding:12px 0;background:var(--soft);border-bottom:1px solid var(--line)}
.pharmacy-detail .pharmacy-week-day{border-color:var(--line);color:var(--ink)}
.pharmacy-detail .pharmacy-week-day.pharmacy-week-today{background:var(--soft);box-shadow:inset 3px 0 var(--accent)}
@media(max-width:680px){
 #community-services #pharmacy-today .pharmacy-compact-row{gap:10px;padding:14px 0}
 #community-services #pharmacy-today .pharmacy-compact-info{flex-basis:100%}
 #community-services #pharmacy-today .pharmacy-compact-name h3{font-size:18px}
 #community-services #pharmacy-today .pharmacy-compact-info>p{font-size:12px}
 #community-services #pharmacy-today .pharmacy-compact-actions a{min-height:40px;font-size:12px;padding:8px 11px}
}

/* Keep navigation symbols independent of the OS emoji font, including iOS. */
.ui-symbol{display:inline-block;width:20px;height:20px;min-width:20px;flex-shrink:0;vertical-align:-.18em;overflow:visible;pointer-events:none}
.media-banner-open .ui-symbol{width:18px;height:18px;min-width:18px}
.media-home-arrow .ui-symbol{width:16px;height:16px;min-width:16px}
.media-browser-close .ui-symbol,.modal-close .ui-symbol{width:20px;height:20px}
.bookmark .ui-symbol{width:21px;height:21px}

/* Shared module icons: same scale, palette, stroke and animation. */
.media-banner-button .module-feature-icon{display:grid;place-items:center;width:44px;height:44px;flex:0 0 44px;color:#24758d;pointer-events:none}
.module-feature-icon svg{display:block;width:100%;height:100%;overflow:visible;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.module-feature-icon .module-feature-disc{fill:#e7f1ef;stroke:#bdd5d4;stroke-width:1}
.module-feature-icon .module-feature-orbit{transform-origin:24px 24px;animation:module-feature-orbit 14s linear infinite}
.module-feature-orbit>circle:first-child{stroke:#76a8b2;stroke-dasharray:2 9;stroke-width:1;opacity:.65}
.module-feature-icon .module-feature-dot{fill:#2484a2;stroke:#f7f5ef;stroke-width:1.2}
.module-feature-icon .module-feature-glyph{transform-origin:24px 24px;animation:module-feature-breathe 3.6s ease-in-out infinite}
@keyframes module-feature-orbit{to{transform:rotate(360deg)}}
@keyframes module-feature-breathe{0%,100%{transform:translateY(1px) scale(.96);opacity:.8}50%{transform:translateY(-1px) scale(1.04);opacity:1}}
@media(max-width:680px){.media-banner-button .module-feature-icon{width:36px;height:36px;flex-basis:36px}}
@media(prefers-reduced-motion:reduce){.module-feature-icon .module-feature-orbit,.module-feature-icon .module-feature-glyph{animation:none}}

/* Footer: installation is the primary action. */
body>footer #install.footer-install{display:inline-flex;align-items:center;gap:12px;background:var(--yellow);color:var(--ink);border:1px solid transparent;border-radius:14px;padding:14px 18px;text-align:left;font-size:16px;font-weight:400;line-height:1.3;min-height:62px;margin-bottom:12px}
body>footer #install.footer-install[hidden]{display:none}
body>footer .footer-install svg{flex:0 0 22px}
body>footer .footer-install small{display:block;font-size:11px;font-weight:400;margin-top:4px;opacity:.8}
body>footer .footer-install:focus-visible{outline:3px solid var(--ink);outline-offset:4px}
body>footer .footer-install+button{display:block;font-size:12px}
@media(max-width:680px){body>footer .footer-inner>div:last-child{width:100%}body>footer #install.footer-install{width:100%;justify-content:center}}