/* CHIEL_NIGHT_GLASS_V1
   Shared visual layer for CHIEL CORE. Functional module behavior stays local. */
:root{
  --chiel-bg:#071525;
  --chiel-bg-deep:#04101d;
  --chiel-surface:#0d2034;
  --chiel-surface-raised:#122a42;
  --chiel-surface-soft:#10263c;
  --chiel-border:rgba(151,181,207,.18);
  --chiel-border-strong:rgba(151,181,207,.30);
  --chiel-text:#f4f8fb;
  --chiel-text-muted:#9db1c3;
  --chiel-text-soft:#71899e;
  --chiel-green:#8bdc65;
  --chiel-green-strong:#6fc94d;
  --chiel-blue:#5ca9ff;
  --chiel-yellow:#f4c95d;
  --chiel-red:#ff7777;
  --chiel-radius-card:22px;
  --chiel-radius-panel:18px;
  --chiel-radius-control:14px;
  --chiel-radius-small:12px;
  --chiel-shadow-card:0 18px 45px rgba(0,0,0,.22);
  --chiel-shadow-soft:0 8px 24px rgba(0,0,0,.16);
  --chiel-space-1:4px;
  --chiel-space-2:8px;
  --chiel-space-3:12px;
  --chiel-space-4:16px;
  --chiel-space-5:20px;
  --chiel-space-6:24px;
  --chiel-space-7:32px;
  --chiel-space-8:40px;
  --chiel-font:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Segoe UI",Roboto,Arial,sans-serif;
}

html,body{
  min-height:100%;
  color:var(--chiel-text);
  font-family:var(--chiel-font)!important;
  background:
    radial-gradient(circle at 18% 0%,rgba(54,105,151,.16),transparent 34%),
    var(--chiel-bg)!important;
}
body{
  color:var(--chiel-text);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
button,input,select,textarea{font-family:var(--chiel-font)!important}

/* Shared page headings */
.head,.topbar,.chiel-page-header{
  position:relative;
}
.head h1,.brandtext strong,.chiel-page-title{
  color:var(--chiel-text);
  letter-spacing:-.035em;
}
.head h1{
  margin:.35rem 0 .4rem;
  font-size:clamp(28px,4vw,42px);
  line-height:1.05;
}
.muted,.hint,.small,.footnote,.brandtext small{
  color:var(--chiel-text-muted)!important;
}

/* Shared cards and panels. Specific visual canvases such as Energy scene-stage are excluded. */
.card,.panel,.chiel-card,.chiel-panel{
  border-color:var(--chiel-border)!important;
  box-shadow:var(--chiel-shadow-card);
}
.card,.chiel-card{
  border-radius:var(--chiel-radius-card)!important;
}
.panel:not(.scene-panel),.chiel-panel{
  border-radius:var(--chiel-radius-panel)!important;
  background:linear-gradient(145deg,rgba(18,42,66,.96),rgba(13,32,52,.96))!important;
}
.info-card,.metric,.weather>div,.source,.lamp,.lamp-room,.advice-item,.mode-banner{
  border-color:var(--chiel-border)!important;
  background:rgba(13,32,52,.88)!important;
  box-shadow:var(--chiel-shadow-soft);
}
.card-head{
  border-bottom-color:var(--chiel-border)!important;
  background:linear-gradient(180deg,rgba(18,42,66,.98),rgba(13,32,52,.98))!important;
}

/* General controls */
button,.chiel-button,.top-actions a,.ai-link,.quick-actions a,.scene-row a{
  border:1px solid var(--chiel-border)!important;
  border-radius:var(--chiel-radius-control)!important;
  color:var(--chiel-text)!important;
  background:rgba(92,169,255,.12)!important;
  box-shadow:none!important;
  transition:background-color 160ms ease,border-color 160ms ease,color 160ms ease,transform 160ms ease,box-shadow 160ms ease;
}
button:hover,.chiel-button:hover,.top-actions a:hover,.ai-link:hover,.quick-actions a:hover,.scene-row a:hover{
  transform:translateY(-1px);
  border-color:rgba(92,169,255,.34)!important;
  background:rgba(92,169,255,.18)!important;
}
button:active,.chiel-button:active,.top-actions a:active,.ai-link:active,.quick-actions a:active,.scene-row a:active{
  transform:translateY(0);
}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:2px solid var(--chiel-blue)!important;
  outline-offset:3px;
}
button#save,.chiel-button--primary{
  border-color:rgba(139,220,101,.26)!important;
  background:var(--chiel-green)!important;
  color:#071525!important;
  box-shadow:0 8px 20px rgba(139,220,101,.18)!important;
}
button#save:hover,.chiel-button--primary:hover{background:var(--chiel-green-strong)!important}
button.secondary,.chiel-button--secondary{
  border-color:rgba(92,169,255,.28)!important;
  background:rgba(92,169,255,.14)!important;
  color:var(--chiel-text)!important;
}
button:disabled,input:disabled,select:disabled{opacity:.52!important}

/* Forms */
input[type="text"],input[type="number"],input[type="time"],input[type="password"],input:not([type]),select,textarea,.chiel-input,.chiel-select{
  min-height:42px;
  border:1px solid var(--chiel-border)!important;
  border-radius:var(--chiel-radius-control)!important;
  outline:none;
  background:var(--chiel-surface-raised)!important;
  color:var(--chiel-text)!important;
  box-shadow:none!important;
}
input:focus,select:focus,textarea:focus{
  border-color:var(--chiel-blue)!important;
  box-shadow:0 0 0 3px rgba(92,169,255,.14)!important;
}
input[type="checkbox"]{accent-color:var(--chiel-green)!important}

/* Status language */
.status,.pill,.chiel-status{
  border-color:var(--chiel-border)!important;
  background:rgba(13,32,52,.86)!important;
  color:var(--chiel-text-muted)!important;
}
.status.ok,.chiel-status--live{border-color:rgba(139,220,101,.28)!important;color:var(--chiel-green)!important}
.status.warning,.warn,.chiel-status--warning{border-color:rgba(244,201,93,.30)!important;color:var(--chiel-yellow)!important}
.status.error,.error,.chiel-status--error{border-color:rgba(255,119,119,.30)!important;color:var(--chiel-red)!important}

/* Dashboard V5 */
.shell{width:min(1600px,100%)}
.brandmark{
  border-color:var(--chiel-border)!important;
  background:linear-gradient(145deg,var(--chiel-surface-raised),var(--chiel-surface))!important;
  box-shadow:var(--chiel-shadow-soft)!important;
}
.status-strip .pill{
  backdrop-filter:blur(10px);
}
.preview-link{
  background:var(--chiel-bg-deep)!important;
}
.tap-badge{
  border-color:var(--chiel-border-strong)!important;
  background:rgba(4,16,29,.78)!important;
}
.quick-actions a{
  min-height:54px;
}

/* Energy: keep scene canvas, badges, lines and drag/touch untouched. */
main[data-energy-canonical="v1"]{
  width:min(1100px,100%);
}
/* Photo-first Energy layout: keep controls in the DOM for compatibility, but hide the complete header visually. */
main[data-energy-canonical="v1"]>.head{
  display:none!important;
}
main[data-energy-canonical="v1"]>.scene-panel{
  margin-top:0;
}
main[data-energy-canonical="v1"]>.head{
  margin-bottom:var(--chiel-space-5);
}
main[data-energy-canonical="v1"]>.head .pill{
  padding:7px 11px;
  border-radius:999px!important;
  color:var(--chiel-green)!important;
  border-color:rgba(139,220,101,.26)!important;
}
main[data-energy-canonical="v1"]>.head .actions>button,
main[data-energy-canonical="v1"]>.head .visual-wrap>button{
  min-height:42px;
  padding:0 15px;
}
main[data-energy-canonical="v1"]>.scene-panel{
  border:1px solid var(--chiel-border)!important;
  border-radius:var(--chiel-radius-card)!important;
  box-shadow:var(--chiel-shadow-card)!important;
  overflow:hidden;
}
main[data-energy-canonical="v1"]>.panel:not(.scene-panel){
  padding:var(--chiel-space-5)!important;
}
main[data-energy-canonical="v1"] .visual-popover{
  border-color:var(--chiel-border)!important;
  border-radius:var(--chiel-radius-panel)!important;
  background:rgba(7,21,37,.96)!important;
  box-shadow:var(--chiel-shadow-card)!important;
  backdrop-filter:blur(18px);
}
main[data-energy-canonical="v1"] .scene-panel>.status{
  background:rgba(4,16,29,.94)!important;
  border-top-color:var(--chiel-border)!important;
}
main[data-energy-canonical="v1"] .weather{
  gap:10px;
}
main[data-energy-canonical="v1"] .weather>div{
  border-radius:var(--chiel-radius-small)!important;
}

/* Settings pages and Light Coach */
.grid{gap:16px!important}
.grid>.card{
  background:linear-gradient(145deg,rgba(18,42,66,.96),rgba(13,32,52,.96))!important;
}
.row label,.dayname,.lamp-title strong{color:var(--chiel-text)}
.permissions label,.dim-limits label,.advice-meta,.lamp-title small{color:var(--chiel-text-muted)!important}
.lamp-room summary{color:var(--chiel-text)}
.actions{gap:10px!important}

/* Optional native Night Glass shell for pages migrated later. */
.chiel-app{min-height:100vh;background:transparent}
.chiel-main{min-width:0;padding:var(--chiel-space-7)}
.chiel-page-content,.chiel-page-header{width:min(100%,1480px);margin-left:auto;margin-right:auto}
.chiel-page-header{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--chiel-space-6);margin-bottom:var(--chiel-space-7)}
.chiel-page-kicker{margin-bottom:6px;color:var(--chiel-text-soft);font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.chiel-page-title{margin:0;font-size:clamp(28px,4vw,42px);font-weight:750;line-height:1.05}
.chiel-page-actions{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:var(--chiel-space-3)}
.chiel-card{padding:var(--chiel-space-6);background:linear-gradient(145deg,rgba(18,42,66,.96),rgba(13,32,52,.96))}
.chiel-panel{padding:var(--chiel-space-5)}
.chiel-section-title{margin:0;color:var(--chiel-text);font-size:20px;font-weight:700;line-height:1.2}
.chiel-subsection-title{margin:0;color:var(--chiel-text);font-size:15px;font-weight:700}
.chiel-body{color:var(--chiel-text);font-size:15px;line-height:1.55}
.chiel-muted{color:var(--chiel-text-muted);font-size:13px;line-height:1.45}
.chiel-small{color:var(--chiel-text-soft);font-size:12px;line-height:1.4}
.chiel-settings-list{display:grid;gap:1px;overflow:hidden;border:1px solid var(--chiel-border);border-radius:var(--chiel-radius-panel);background:var(--chiel-border)}
.chiel-setting-row{display:flex;align-items:center;justify-content:space-between;gap:var(--chiel-space-5);padding:var(--chiel-space-5);background:rgba(13,32,52,.96)}
.chiel-setting-copy{min-width:0}.chiel-setting-copy p{margin:6px 0 0}.chiel-setting-control{flex:0 0 auto}
.chiel-dashboard-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--chiel-space-5)}
.chiel-dashboard-grid>.span-4{grid-column:span 4}.chiel-dashboard-grid>.span-6{grid-column:span 6}.chiel-dashboard-grid>.span-8{grid-column:span 8}.chiel-dashboard-grid>.span-12{grid-column:span 12}

@media(max-width:720px){
  .chiel-main{padding:20px 16px 32px}
  .chiel-page-header{display:grid;gap:16px;margin-bottom:20px}
  .chiel-page-actions{justify-content:flex-start}
  .chiel-card{padding:18px;border-radius:18px!important}
  .chiel-dashboard-grid{grid-template-columns:1fr}
  .chiel-dashboard-grid>[class*="span-"]{grid-column:span 1}
  .chiel-setting-row{align-items:flex-start;flex-direction:column}
  .chiel-setting-control{width:100%}
  .chiel-setting-control input,.chiel-setting-control select,.chiel-setting-control button{width:100%}
  main[data-energy-canonical="v1"]>.head{gap:16px}
}

@media(min-width:721px) and (max-width:820px){
  .chiel-main{padding:24px}
  .chiel-dashboard-grid>.span-4{grid-column:span 6}
  .chiel-dashboard-grid>.span-8{grid-column:span 12}
}

@media(prefers-reduced-motion:reduce){
  button,.chiel-button,.top-actions a,.ai-link,.quick-actions a,.scene-row a{transition:none!important}
}


/* CHIEL_NIGHT_GLASS_MODULES_V2 */
html[data-chiel-night-glass="module"]{
  color-scheme:dark;
  background:var(--chiel-bg)!important;
}
html[data-chiel-night-glass="module"] body{
  color:var(--chiel-text)!important;
  background:
    radial-gradient(circle at 18% 0%,rgba(54,105,151,.16),transparent 34%),
    var(--chiel-bg)!important;
}
html[data-chiel-night-glass="module"] body>main,
html[data-chiel-night-glass="module"] .wrap{
  width:min(1100px,100%)!important;
  margin-left:auto!important;
  margin-right:auto!important;
}
html[data-chiel-night-glass="module"] .card,
html[data-chiel-night-glass="module"] .panel,
html[data-chiel-night-glass="module"] .item,
html[data-chiel-night-glass="module"] .box,
html[data-chiel-night-glass="module"] .kpi,
html[data-chiel-night-glass="module"] .check,
html[data-chiel-night-glass="module"] .switch{
  border-color:var(--chiel-border)!important;
  background:linear-gradient(145deg,rgba(18,42,66,.96),rgba(13,32,52,.96))!important;
  color:var(--chiel-text)!important;
}
html[data-chiel-night-glass="module"] .card,
html[data-chiel-night-glass="module"] dialog{
  border-radius:var(--chiel-radius-card)!important;
}
html[data-chiel-night-glass="module"] .eyebrow,
html[data-chiel-night-glass="module"] .chip,
html[data-chiel-night-glass="module"] .badge,
html[data-chiel-night-glass="module"] .tag{
  border-color:var(--chiel-border)!important;
  background:rgba(92,169,255,.10)!important;
  color:var(--chiel-text-muted)!important;
}
html[data-chiel-night-glass="module"] h1,
html[data-chiel-night-glass="module"] h2,
html[data-chiel-night-glass="module"] h3,
html[data-chiel-night-glass="module"] strong,
html[data-chiel-night-glass="module"] label{
  color:var(--chiel-text)!important;
}
html[data-chiel-night-glass="module"] .muted,
html[data-chiel-night-glass="module"] .lead,
html[data-chiel-night-glass="module"] .sub,
html[data-chiel-night-glass="module"] .hint,
html[data-chiel-night-glass="module"] .meta{
  color:var(--chiel-text-muted)!important;
}
html[data-chiel-night-glass="module"] dialog{
  border:1px solid var(--chiel-border)!important;
  background:var(--chiel-surface)!important;
  color:var(--chiel-text)!important;
  box-shadow:var(--chiel-shadow-card)!important;
}
html[data-chiel-night-glass="module"] dialog::backdrop{
  background:rgba(2,8,16,.72)!important;
  backdrop-filter:blur(6px);
}
html[data-chiel-night-glass="module"] button.danger{
  border-color:rgba(255,119,119,.35)!important;
  background:rgba(255,119,119,.14)!important;
  color:var(--chiel-red)!important;
}
html[data-chiel-night-glass="module"] button.amber,
html[data-chiel-night-glass="module"] button.warning{
  border-color:rgba(244,201,93,.35)!important;
  background:rgba(244,201,93,.14)!important;
  color:var(--chiel-yellow)!important;
}
html[data-chiel-night-glass="module"] .notice.good,
html[data-chiel-night-glass="module"] .ok,
html[data-chiel-night-glass="module"] .good{
  color:var(--chiel-green)!important;
}
html[data-chiel-night-glass="module"] .notice.error,
html[data-chiel-night-glass="module"] .bad{
  color:var(--chiel-red)!important;
}
@media(max-width:720px){
  html[data-chiel-night-glass="module"] body{padding-left:14px!important;padding-right:14px!important}
  html[data-chiel-night-glass="module"] .actions{gap:8px!important}
}

/* CHIEL_NO_FLOATING_AGENDA_SMART_V2
   Agenda/Smart blijven via normale navigatie en overlays beschikbaar; alleen zwevende launchers zijn verborgen. */
#chielAgenda3443Btn,
#chielAgendaFloatBtn,
#chiel-agenda-button-v4,
#chielSmart3443Btn,
#chielSmartFloatBtn,
#chiel-homey-button-v4,
#smartHubButton,
.smart-hub-button{
  display:none!important;
  visibility:hidden!important;
  pointer-events:none!important;
}

/* CHIEL_AI_SELF_LEARNING_PARITY_V1
   Only presentation: self-learning logic and data bindings remain untouched. */
.grid>.card:has(#learning){
  grid-column:1/-1;
  padding:24px;
  overflow:hidden;
}
.grid>.card:has(#learning)>h2{
  margin:0 0 8px;
  font-size:20px;
  letter-spacing:-.015em;
}
.grid>.card:has(#learning)>.row{
  margin:0;
  padding:15px 0;
  border-top:1px solid var(--chiel-border);
  align-items:center;
}
.grid>.card:has(#learning)>.row:first-of-type{
  border-top:0;
}
.grid>.card:has(#learning)>.row strong{
  color:var(--chiel-text);
}
.grid>.card:has(#learning)>#learningProfiles{
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:10px;
  margin:16px 0 18px;
}
.grid>.card:has(#learning)>#resetLearning{
  width:100%;
  min-height:44px;
}
.grid>.card:has(#learning)>p.hint{
  max-width:78ch;
  margin:14px 0 0;
  line-height:1.55;
}
.grid>.card:has(#learning) #retention{
  width:92px;
}
@media(max-width:620px){
  .grid>.card:has(#learning){padding:18px}
  .grid>.card:has(#learning)>.row{
    flex-direction:row;
    align-items:center;
    gap:10px;
  }
  .grid>.card:has(#learning)>.row .switch{
    align-self:center;
    margin-top:0;
  }
  .grid>.card:has(#learning)>#learningProfiles{
    grid-template-columns:1fr;
  }
}

/* CHIEL_UNIFIED_JOURNAAL_WEER_V1
   Centrale visuele laag voor Machielatsma.nl.
   Gebaseerd op CHIEL Journaal + CHIEL Weer: nachtelijk blauw, glas, cyaan en warm goud.
   Alleen presentatie; modulelogica en layout blijven lokaal. */
:root{
  color-scheme:dark;
  --bg:#06111d;
  --bg-2:#091827;
  --panel:rgba(10,27,45,.78);
  --panel-strong:rgba(12,31,51,.92);
  --panel-soft:rgba(255,255,255,.045);
  --card:rgba(12,31,51,.90);
  --card2:rgba(15,38,61,.92);
  --line:rgba(210,232,255,.12);
  --line-strong:rgba(190,224,255,.22);
  --text:#f5f8fc;
  --muted:#9fb2c6;
  --soft:#758da6;
  --blue:#6ec5ff;
  --blue-2:#2a8fff;
  --green:#45dfa5;
  --amber:#ffd46d;
  --gold:#edc384;
  --danger:#ff8290;
  --red:#ff8290;
  --sea:#6ec5ff;
  --mint:#b9dbe8;
  --shadow:0 28px 80px rgba(0,0,0,.30);
  --radius-xl:28px;
  --radius-lg:22px;
  --radius-md:17px;

  --chiel-bg:#06111d;
  --chiel-bg-deep:#04101c;
  --chiel-surface:#0a1b2d;
  --chiel-surface-raised:#0f263d;
  --chiel-surface-soft:#0c2034;
  --chiel-border:rgba(210,232,255,.12);
  --chiel-border-strong:rgba(190,224,255,.22);
  --chiel-text:#f5f8fc;
  --chiel-text-muted:#9fb2c6;
  --chiel-text-soft:#758da6;
  --chiel-blue:#6ec5ff;
  --chiel-green:#45dfa5;
  --chiel-green-strong:#34c994;
  --chiel-yellow:#ffd46d;
  --chiel-gold:#edc384;
  --chiel-red:#ff8290;
  --chiel-radius-card:22px;
  --chiel-radius-panel:18px;
  --chiel-radius-control:14px;
  --chiel-radius-small:12px;
  --chiel-shadow-card:0 28px 80px rgba(0,0,0,.30);
  --chiel-shadow-soft:0 14px 38px rgba(0,0,0,.20);
  --chiel-font:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}

html{
  background:#06111d!important;
}
html,body,button,input,select,textarea{
  font-family:var(--chiel-font)!important;
}
body{
  color:var(--text)!important;
  background:
    radial-gradient(circle at 72% -10%,rgba(83,151,215,.24),transparent 30%),
    radial-gradient(circle at 20% 25%,rgba(33,100,153,.12),transparent 28%),
    linear-gradient(150deg,#04101c 0%,#071522 47%,#05101b 100%)!important;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

/* Redactionele accenten uit Journaal. */
.eyebrow,.label,.tag,.section-kicker,.chiel-page-kicker{
  color:var(--gold)!important;
}
.muted,.sub,.lead small,.hint,.small,.footnote{
  color:var(--muted)!important;
}

a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,video:focus-visible{
  outline:3px solid var(--gold)!important;
  outline-offset:4px!important;
}

/* Glass cards uit Weer, zonder layouts te veranderen. */
.card,
.panel:not(.scene-panel),
.stat,
.metric,
.portal-group,
.system-card,
.status-box,
.info-card,
.route,
.record,
.idea-proof,
.release-row,
.dialog{
  border-color:var(--line)!important;
  background:linear-gradient(145deg,rgba(14,34,55,.88),rgba(7,22,38,.82))!important;
  box-shadow:var(--shadow)!important;
  backdrop-filter:blur(20px) saturate(130%);
  -webkit-backdrop-filter:blur(20px) saturate(130%);
}
.card,.portal-group,.dialog{
  border-radius:var(--radius-lg)!important;
}
.card:hover,.panel:hover,.portal-group:hover{
  border-color:rgba(110,197,255,.26)!important;
}

/* Navigatie als rustige, translucente rail. */
.ecosystem-nav,
.chiel-ecosystem-nav,
.side-rail,
.sidebar{
  border-color:var(--line)!important;
  background:linear-gradient(160deg,rgba(12,31,50,.90),rgba(5,18,31,.86))!important;
  box-shadow:0 22px 70px rgba(0,0,0,.22)!important;
  backdrop-filter:blur(24px) saturate(135%);
  -webkit-backdrop-filter:blur(24px) saturate(135%);
}
.ecosystem-nav a,
.chiel-ecosystem-nav a,
.nav-link,
.side-nav a{
  color:#a8bacc!important;
}
.ecosystem-nav a.active,
.ecosystem-nav a[aria-current],
.chiel-ecosystem-nav a.active,
.chiel-ecosystem-nav a[aria-current],
.nav-link.active,
.side-nav a.active{
  color:#f7fbff!important;
  border-color:rgba(119,190,255,.18)!important;
  background:rgba(72,145,211,.13)!important;
}

/* Inputs en beheercontrols. */
input:not([type="checkbox"]):not([type="radio"]),select,textarea{
  border-color:var(--line-strong)!important;
  border-radius:14px!important;
  background:rgba(5,18,31,.78)!important;
  color:var(--text)!important;
}
input:focus,select:focus,textarea:focus{
  border-color:rgba(110,197,255,.62)!important;
  box-shadow:0 0 0 3px rgba(110,197,255,.11)!important;
}
input[type="checkbox"],input[type="radio"]{
  accent-color:var(--blue)!important;
}

/* Pills, tabs en rustige secundaire controls. */
.pill,.chip,.badge,.tab,.count,.service-badge,.group-count,.status-pill{
  border-color:var(--line)!important;
}
.tab.active,.chip.active,.pill.active{
  border-color:rgba(110,197,255,.30)!important;
  background:rgba(72,145,211,.14)!important;
  color:#f7fbff!important;
}

/* Statuskleuren blijven semantisch overal hetzelfde. */
.ok,.good,.state-online,.status.ok,.badge.ok{--status-color:var(--green)}
.warn,.warning,.state-warning,.status.warning,.badge.warn{--status-color:var(--amber)}
.bad,.error,.state-offline,.status.error{--status-color:var(--danger)}
.status.ok,.badge.ok,.notice.good{color:var(--green)!important}
.status.warning,.badge.warn,.warn{color:var(--amber)!important}
.status.error,.notice.error,.bad{color:var(--danger)!important}

/* Buttons: vorm gelijk, bestaande functionele/semantische kleurclasses blijven intact. */
button,.btn,.ghost,.back,.hero-action{
  border-radius:14px!important;
}
.btn:not(.danger):not(.amber),
button.secondary,
.ghost,
.back,
.hero-action{
  border-color:var(--line)!important;
}

/* Mediaframes krijgen dezelfde premium rand en schaduw. */
.video-wrap,.player-shell,.thumb,.camera-media,.frame{
  border-color:rgba(190,224,255,.20)!important;
  box-shadow:0 20px 60px rgba(0,0,0,.28)!important;
}

::selection{
  background:rgba(110,197,255,.28);
  color:#fff;
}

@media(max-width:640px){
  .card,.portal-group,.dialog{border-radius:18px!important}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important}
}

/* CHIEL_UNIFIED_COMPONENT_FINISH_V2: consistent typography, controls and mobile ergonomics. */
:root{--chiel-space-1:8px;--chiel-space-2:12px;--chiel-space-3:18px;--chiel-space-4:24px;--chiel-control-height:42px}
:where(h1,h2,h3){text-wrap:balance;letter-spacing:-.025em}
:where(p,li,.hint,.muted){overflow-wrap:break-word}
:where(button,.btn,[role="button"],input[type="submit"],input[type="button"]){min-height:var(--chiel-control-height);font:inherit;transition:border-color .16s ease,background-color .16s ease,box-shadow .16s ease}
:where(button,.btn,[role="button"],a,input,select,textarea):focus-visible{outline:3px solid var(--gold)!important;outline-offset:3px!important}
:where(button,.btn,[role="button"]):not(:disabled):hover{border-color:rgba(110,197,255,.42)!important}
:where(button,.btn,[role="button"]):disabled{cursor:not-allowed;opacity:.58}
:where(.card,.panel,.dialog,.portal-group){min-width:0}
:where(table){border-collapse:separate;border-spacing:0}
:where(th){color:var(--muted);font-weight:650}
:where(hr){border:0;border-top:1px solid var(--line)}
@media(max-width:640px){
  :root{--chiel-control-height:44px}
  :where(input,select,textarea){font-size:16px!important}
  :where(.card,.panel,.dialog,.portal-group){max-width:100%}
  :where(img,video,canvas,svg){max-width:100%}
  :where(table){max-width:100%}
}
@media(prefers-reduced-motion:reduce){:where(button,.btn,[role="button"]){transition:none!important}}
/* CHIEL_AI_LIGHT_COACH_PARITY_V2: force the legacy Smart/Light Coach overlay into the same Journaal/Weer night-glass language. */
#chielSmart3443Btn{
  border:1px solid var(--line)!important;
  border-radius:14px!important;
  background:linear-gradient(145deg,rgba(15,38,61,.94),rgba(7,22,38,.92))!important;
  color:var(--text)!important;
  box-shadow:0 18px 44px rgba(0,0,0,.28)!important;
  backdrop-filter:blur(18px) saturate(130%);
  -webkit-backdrop-filter:blur(18px) saturate(130%);
}
#chielSmart3443Panel{
  border:1px solid var(--line)!important;
  border-radius:var(--radius-lg)!important;
  background:
    radial-gradient(circle at 78% -8%,rgba(83,151,215,.20),transparent 32%),
    linear-gradient(155deg,rgba(10,27,45,.97),rgba(4,16,28,.97))!important;
  color:var(--text)!important;
  box-shadow:0 32px 90px rgba(0,0,0,.42)!important;
  font-family:var(--chiel-font)!important;
  backdrop-filter:blur(24px) saturate(135%);
  -webkit-backdrop-filter:blur(24px) saturate(135%);
}
#chielSmart3443Panel .csh-head{
  padding:2px 2px 12px!important;
  border-bottom:1px solid var(--line)!important;
}
#chielSmart3443Panel .csh-head>b{
  font-size:1.05rem!important;
  letter-spacing:-.02em!important;
}
#chielSmart3443Panel .csh-tabs{
  margin:12px 0 14px!important;
  padding:6px!important;
  border:1px solid var(--line)!important;
  border-radius:16px!important;
  background:rgba(4,16,28,.60)!important;
}
#chielSmart3443Panel .csh-head button,
#chielSmart3443Panel .csh-tabs button,
#chielSmart3443Panel .csh-actions button,
#chielSmart3443Panel .csh-homey-scene-grid button,
#chielSmart3443Panel .csh-homey-device>button{
  min-height:44px!important;
  border:1px solid var(--line)!important;
  border-radius:14px!important;
  background:rgba(15,38,61,.90)!important;
  color:var(--text)!important;
  box-shadow:0 9px 24px rgba(0,0,0,.16)!important;
}
#chielSmart3443Panel .csh-tabs button:hover,
#chielSmart3443Panel .csh-tabs button:focus-visible,
#chielSmart3443Panel .csh-actions button:hover,
#chielSmart3443Panel .csh-actions button:focus-visible{
  border-color:rgba(110,197,255,.42)!important;
  background:rgba(28,66,101,.92)!important;
}
#chielSmart3443Panel h3{
  margin:16px 0 10px!important;
  color:var(--text)!important;
  font-size:1.32rem!important;
  letter-spacing:-.03em!important;
}
#chielSmart3443Panel .csh-note,
#chielSmart3443Panel .csh-room summary small,
#chielSmart3443Panel .csh-homey-status span,
#chielSmart3443Panel .csh-homey-device small,
#chielSmart3443Panel .csh-homey-limit small,
#chielSmart3443Panel .csh-homey-scenes small{
  color:var(--muted)!important;
}
#chielSmart3443Panel .csh-room,
#chielSmart3443Panel .csh-homey-status,
#chielSmart3443Panel .csh-homey-scenes,
#chielSmart3443Panel .csh-homey-device,
#chielSmart3443Panel .csh-homey-limit{
  border-color:var(--line)!important;
  border-radius:16px!important;
  background:linear-gradient(145deg,rgba(14,34,55,.78),rgba(7,22,38,.72))!important;
  box-shadow:0 14px 34px rgba(0,0,0,.16)!important;
}
#chielSmart3443Panel .csh-room{
  padding:11px!important;
  margin:10px 0!important;
}
#chielSmart3443Panel .csh-room summary{
  min-height:42px!important;
  color:var(--text)!important;
}
#chielSmart3443Panel input:not([type="checkbox"]):not([type="radio"]),
#chielSmart3443Panel select{
  min-height:44px!important;
  border:1px solid var(--line-strong)!important;
  border-radius:14px!important;
  background:rgba(5,18,31,.82)!important;
  color:var(--text)!important;
}
#chielSmart3443Panel input[type="checkbox"],
#chielSmart3443Panel input[type="radio"]{
  accent-color:var(--blue)!important;
}
#chielSmart3443Panel .csh-error{color:var(--danger)!important}
#chielSmart3443Panel .csh-homey-scene-result{
  border-color:rgba(69,223,165,.26)!important;
  background:rgba(10,48,39,.72)!important;
  color:#dfffee!important;
}
#chielSmart3443Panel .csh-homey-device>button[aria-pressed="true"]{
  border-color:rgba(69,223,165,.34)!important;
  background:rgba(31,103,76,.72)!important;
  color:#e8fff5!important;
}
#chielDoorbellOverlay3443 .cdb-box{
  border-color:var(--line-strong)!important;
  background:linear-gradient(155deg,rgba(10,27,45,.98),rgba(4,16,28,.98))!important;
  box-shadow:0 34px 100px rgba(0,0,0,.48)!important;
}
#chielDoorbellOverlay3443 .cdb-foot span{color:var(--muted)!important}
@media(max-width:680px){
  #chielSmart3443Panel{border-radius:18px!important;padding:14px!important}
  #chielSmart3443Panel .csh-tabs{border-radius:14px!important}
}


/* CHIEL_AURORA_MOTION_20261015_V1
   Consistent colors, tactile depth and quiet motion; no family/animal assets. */
:root{
  --chiel-bg:#071421;
  --chiel-bg-deep:#050f1b;
  --chiel-surface:#102438;
  --chiel-surface-raised:#17314a;
  --chiel-surface-soft:#102a40;
  --chiel-border:rgba(137,185,218,.23);
  --chiel-border-strong:rgba(137,198,235,.43);
  --chiel-text:#f1f8ff;
  --chiel-text-muted:#a8bed2;
  --chiel-text-soft:#8faac1;
  --chiel-blue:#71caff;
  --chiel-green:#78e1ac;
  --chiel-green-strong:#4ccf93;
  --chiel-yellow:#ffd07b;
  --chiel-red:#ff8997;
  --chiel-shadow-card:0 20px 52px rgba(0,5,17,.33),inset 0 1px rgba(255,255,255,.055);
  --chiel-shadow-soft:0 9px 28px rgba(0,6,20,.24);
}
html,body{
  background:radial-gradient(ellipse at 14% -8%,rgba(47,117,166,.22),transparent 42%),
             radial-gradient(ellipse at 88% 4%,rgba(32,132,126,.11),transparent 34%),
             #071421!important;
}
:where(button,a,input,select,textarea,[role="button"]):focus-visible{
  outline:2px solid #8bdbff!important;
  outline-offset:3px;
}
:where(.card,.panel,.chiel-card,.chiel-panel){
  box-shadow:var(--chiel-shadow-card);
}
.shell .topbar{
  border-bottom:1px solid rgba(131,199,237,.19);
  background:linear-gradient(90deg,rgba(31,75,105,.10),transparent 62%);
}
.shell .brandmark{
  background:linear-gradient(155deg,rgba(43,100,133,.45),rgba(8,29,48,.9));
  border-color:rgba(129,206,241,.35);
  box-shadow:0 0 28px rgba(64,161,209,.10),inset 0 1px rgba(255,255,255,.12);
}
.shell .brandtext strong{background:linear-gradient(105deg,#fff 10%,#b8eaff 72%,#86e2c3);background-clip:text;-webkit-background-clip:text;color:transparent}
.shell .pill{
  border:1px solid rgba(135,187,217,.22);
  background:linear-gradient(160deg,rgba(25,57,80,.90),rgba(9,28,45,.92));
  color:#e0effb;
  box-shadow:inset 0 1px rgba(255,255,255,.06),0 7px 18px rgba(0,0,0,.13);
}
.shell .pill:first-child{border-color:rgba(120,225,172,.36);color:#c6ffe1}
.shell .primary-grid>.card{
  border:1px solid rgba(133,188,222,.27)!important;
  background:linear-gradient(155deg,rgba(17,43,65,.98),rgba(7,22,39,.99));
  box-shadow:0 24px 58px rgba(0,6,19,.30),inset 0 1px rgba(255,255,255,.07);
}
.shell .card-head{
  color:#e9f6ff;
  letter-spacing:.065em;
  text-shadow:0 1px 14px rgba(95,197,250,.12);
}
.shell .card-head .live{color:var(--chiel-green);text-shadow:0 0 14px rgba(120,225,172,.36)}
.shell .energy-calm-preview{
  background:radial-gradient(circle at 48% 30%,rgba(72,173,218,.19),transparent 40%),
             radial-gradient(circle at 77% 78%,rgba(71,203,156,.12),transparent 36%),
             linear-gradient(145deg,#0b2438,#071725 74%,#06111e);
}
.shell .energy-calm-preview:after{
  content:"";position:absolute;inset:-55% -65%;pointer-events:none;
  background:linear-gradient(105deg,transparent 42%,rgba(126,214,255,.055) 50%,transparent 58%);
  animation:chielAuroraSweep 14s ease-in-out infinite;
}
.shell .energy-calm-core span{
  border-color:rgba(121,192,226,.26);
  background:linear-gradient(145deg,rgba(21,56,79,.76),rgba(8,28,46,.88));
  box-shadow:inset 0 1px rgba(255,255,255,.07),0 10px 24px rgba(0,0,0,.14);
}
.shell .energy-calm-core span:nth-child(2){border-color:rgba(255,208,123,.29)}
.shell .energy-calm-core span:nth-child(3){border-color:rgba(120,225,172,.29)}
.shell .energy-calm-core span:nth-child(4){border-color:rgba(180,159,250,.27)}
.shell .quick-actions a,.shell .quick-actions button,.shell .top-actions a,.shell .top-actions button{
  background:linear-gradient(155deg,rgba(27,65,92,.85),rgba(12,37,57,.92))!important;
  border-color:rgba(135,198,229,.28)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.075),0 8px 24px rgba(0,0,0,.18);
  transition:background-color .22s ease,border-color .22s ease,box-shadow .22s ease,transform .22s ease;
}
.shell :is(button,a)[aria-pressed="true"]{border-color:rgba(120,225,172,.68)!important;box-shadow:inset 0 0 0 1px rgba(120,225,172,.14),0 0 22px rgba(120,225,172,.12)}
main[data-energy-canonical="v1"] .scene-stage{
  background:radial-gradient(circle at 46% 34%,rgba(70,166,210,.19),transparent 42%),
             radial-gradient(circle at 76% 78%,rgba(79,209,158,.11),transparent 35%),
             linear-gradient(145deg,#0a2336,#071521 70%,#06101d)!important;
}
main[data-energy-canonical="v1"] .scene-panel,
main[data-energy-canonical="v1"] .panel:not(.scene-panel){
  border-color:rgba(139,193,224,.25)!important;
}
main[data-energy-canonical="v1"] .energy-widget-board>[data-energy-widget]{
  animation:chielAuroraEnter .48s ease both;
}
main[data-energy-canonical="v1"] .energy-widget-board>[data-energy-widget]:nth-child(2){animation-delay:.07s}
main[data-energy-canonical="v1"] .energy-widget-board>[data-energy-widget]:nth-child(3){animation-delay:.12s}
.shell .primary-grid>.card{animation:chielAuroraEnter .48s cubic-bezier(.2,.75,.25,1) both}
.shell .primary-grid>.card:nth-child(2){animation-delay:.07s}
.shell .primary-grid>.card:nth-child(3){animation-delay:.14s}
.shell .status-strip .pill{animation:chielAuroraEnter .38s ease both}
.shell .quick-actions{animation:chielAuroraEnter .5s .16s ease both}
@keyframes chielAuroraEnter{from{opacity:0;translate:0 10px}to{opacity:1;translate:0 0}}
@keyframes chielAuroraSweep{0%,25%{transform:translateX(-42%)}70%,100%{transform:translateX(42%)}}
@media(hover:hover) and (pointer:fine){
  .shell .primary-grid>.card:hover{border-color:rgba(124,210,247,.50)!important;box-shadow:0 28px 64px rgba(0,6,19,.40),0 0 0 1px rgba(113,202,255,.08)}
  .shell .quick-actions :is(a,button):hover,.shell .top-actions :is(a,button):hover{
    transform:translateY(-2px);border-color:rgba(128,212,251,.55)!important;
    box-shadow:0 13px 28px rgba(0,0,0,.25),inset 0 1px rgba(255,255,255,.1);
  }
}
@media(prefers-reduced-motion:reduce){
  .shell .primary-grid>.card,.shell .status-strip .pill,.shell .quick-actions,
  main[data-energy-canonical="v1"] .energy-widget-board>[data-energy-widget],
  .shell .energy-calm-preview:after{animation:none!important;translate:none!important}
  .shell .quick-actions :is(a,button),.shell .top-actions :is(a,button){transition:none!important;transform:none!important}
}

/* CHIEL_PREMIUM_SPATIAL_V3
   Shared read-only presentation upgrade. Scoped to module pages so dashboard controls,
   energy scene positioning, and critical operations preserve their current layouts. */
:root{
  --chiel-spatial-edge:rgba(136,203,242,.23);
  --chiel-spatial-glow:0 20px 55px rgba(0,0,0,.24),0 4px 20px rgba(23,137,194,.085);
  --chiel-spatial-radius:22px;
}
html[data-chiel-night-glass="module"] body{
  background:
    radial-gradient(ellipse at 78% -8%,rgba(63,153,231,.17),transparent 37%),
    radial-gradient(ellipse at 8% 73%,rgba(44,185,183,.075),transparent 40%),
    linear-gradient(150deg,#04101d,#091929 45%,#061220 100%)!important;
}
html[data-chiel-night-glass="module"] :is(.card,.panel:not(.scene-panel),.item,.box,.kpi,.check,.device,.climate-stat){
  border:1px solid var(--chiel-spatial-edge)!important;
  border-radius:var(--chiel-spatial-radius)!important;
  background:
    radial-gradient(circle at 93% 4%,rgba(68,181,238,.07),transparent 45%),
    linear-gradient(155deg,rgba(17,43,64,.95),rgba(8,25,42,.96))!important;
  box-shadow:var(--chiel-spatial-glow),inset 0 1px 0 rgba(225,250,255,.04)!important;
}
html[data-chiel-night-glass="module"] :is(.card,.panel:not(.scene-panel),.item,.box,.kpi,.check,.device,.climate-stat){
  transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease;
}
@media(hover:hover) and (pointer:fine){
  html[data-chiel-night-glass="module"] :is(.card,.panel:not(.scene-panel),.item,.box,.kpi,.check,.device,.climate-stat):hover{
    border-color:rgba(98,207,244,.38)!important;
    box-shadow:0 25px 65px rgba(0,0,0,.30),0 0 30px rgba(33,171,218,.075),inset 0 1px rgba(255,255,255,.055)!important;
    transform:translateY(-2px);
  }
}
html[data-chiel-night-glass="module"] :is(.eyebrow,.label,.category){
  letter-spacing:.11em;
}
html[data-chiel-night-glass="module"] :is(.value,.main-temp strong,.reading strong,.kpi strong){
  font-variant-numeric:tabular-nums;
}
html[data-chiel-night-glass="module"] :is(.ecosystem-nav,.chiel-ecosystem-nav){
  border:1px solid rgba(138,209,243,.20);
  border-radius:16px;
  box-shadow:0 15px 34px rgba(0,0,0,.17),inset 0 1px rgba(255,255,255,.045);
  background:linear-gradient(110deg,rgba(14,35,53,.89),rgba(6,20,33,.86));
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
}
html[data-chiel-night-glass="module"] :is(button,.refresh,.history-periods button):focus-visible,
html[data-chiel-night-glass="module"] :is(a,input,select,summary):focus-visible{
  outline:2px solid #8ae9ff!important;
  outline-offset:3px!important;
}
@media(max-width:640px){
  html[data-chiel-night-glass="module"] :is(.card,.panel:not(.scene-panel),.device,.climate-stat){
    border-radius:18px!important;
  }
  html[data-chiel-night-glass="module"] :is(button,.refresh,.history-periods button){min-height:44px}
}
@media(prefers-reduced-motion:reduce){
  html[data-chiel-night-glass="module"] :is(.card,.panel:not(.scene-panel),.item,.box,.kpi,.check,.device,.climate-stat){
    transition:none!important;transform:none!important;
  }
}

/* CHIEL DASHBOARD DEPTH V1 — spatial polish without transforming live floorplans */
.shell>.topbar{border-bottom-color:rgba(129,193,232,.18);background:linear-gradient(180deg,rgba(13,34,56,.62),rgba(8,22,40,.08));border-radius:18px 18px 0 0}
.shell>.topbar .brandmark{border-color:rgba(132,206,244,.34)!important;background:radial-gradient(circle at 33% 20%,rgba(134,226,250,.19),transparent 62%),linear-gradient(145deg,#1c3b55,#0b1c30)!important;box-shadow:0 14px 32px rgba(0,4,17,.36),inset 0 1px rgba(255,255,255,.16)!important}
.shell>.topbar .brandtext strong{letter-spacing:-.055em;text-shadow:0 8px 28px rgba(15,143,221,.16)}
.shell>.status-strip{scroll-snap-type:x proximity}
.shell>.status-strip>.pill{scroll-snap-align:start;white-space:nowrap;border-color:rgba(123,181,222,.26)!important;background:linear-gradient(160deg,rgba(22,48,71,.91),rgba(9,26,44,.95))!important;color:#daefff!important;box-shadow:0 8px 23px rgba(0,5,20,.22),inset 0 1px rgba(255,255,255,.075)!important}
.shell #chielDepthMode{cursor:pointer;touch-action:manipulation;min-height:42px}
.shell #chielDepthMode[aria-pressed="true"]{border-color:rgba(105,220,235,.5)!important;background:linear-gradient(135deg,rgba(29,102,137,.64),rgba(21,55,93,.9))!important}
.shell #chielDepthMode:focus-visible{outline:2px solid #9be7ff!important;outline-offset:3px}
.shell>.primary-grid{perspective:1200px}
.shell>.primary-grid>.card{isolation:isolate;border-color:rgba(131,181,224,.29)!important;background:linear-gradient(152deg,rgba(19,42,65,.95),rgba(8,22,38,.97))!important;box-shadow:0 27px 60px rgba(0,5,20,.4),inset 0 1px rgba(255,255,255,.10)!important;transition:border-color .18s ease,box-shadow .18s ease}
.shell>.primary-grid>.card::before{content:"";position:absolute;z-index:2;inset:0;pointer-events:none;opacity:0;border-radius:inherit;background:radial-gradient(330px circle at var(--depth-x,50%) var(--depth-y,10%),rgba(140,218,255,.13),transparent 60%);transition:opacity .2s ease}
.shell>.primary-grid>.card:hover,.shell>.primary-grid>.card:focus-within{border-color:rgba(123,215,252,.54)!important;box-shadow:0 31px 72px rgba(0,3,18,.48),0 0 0 1px rgba(100,210,249,.085),inset 0 1px rgba(255,255,255,.14)!important}
.shell>.primary-grid>.card:hover::before,.shell>.primary-grid>.card:focus-within::before{opacity:1}
.shell>.primary-grid>.card .card-head{letter-spacing:.065em;box-shadow:inset 0 1px rgba(255,255,255,.065);border-bottom-color:rgba(132,196,229,.26)!important}
.shell>.primary-grid>.card .card-head:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--card-accent,#75bfff);box-shadow:0 0 12px var(--card-accent,#75bfff);flex:none}
.shell>.primary-grid>.card .energy-calm-preview{background:radial-gradient(ellipse 60% 45% at 50% 30%,rgba(62,161,219,.23),transparent 82%),linear-gradient(160deg,#102941,#061321)}
.shell>.primary-grid>.card .energy-calm-icon{box-shadow:0 15px 32px rgba(0,7,19,.35),inset 0 1px rgba(255,255,255,.12);background:radial-gradient(circle at 35% 25%,rgba(91,225,246,.24),rgba(17,55,81,.57))}
.shell>.quick-actions a,.shell>.quick-actions button{border-color:rgba(125,193,229,.24)!important;background:linear-gradient(154deg,rgba(23,52,76,.95),rgba(10,27,45,.96))!important;box-shadow:0 11px 26px rgba(0,4,19,.27),inset 0 1px rgba(255,255,255,.085)!important;transition:border-color .16s ease,background .16s ease,box-shadow .16s ease,transform .16s ease}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
 body:not([data-chiel-depth="off"]) .shell>.quick-actions a:hover,
 body:not([data-chiel-depth="off"]) .shell>.quick-actions button:hover:not(:disabled){transform:translateY(-3px);border-color:rgba(127,213,248,.61)!important;box-shadow:0 17px 35px rgba(0,3,16,.42),0 0 18px rgba(58,173,237,.09),inset 0 1px rgba(255,255,255,.14)!important}
}
body[data-chiel-depth="off"] .shell>.primary-grid>.card::before{display:none}
body[data-chiel-depth="off"] .shell>.primary-grid>.card{box-shadow:var(--chiel-shadow-card)!important}
body[data-chiel-depth="off"] .shell>.quick-actions :is(a,button){box-shadow:var(--chiel-shadow-soft)!important}
@media(max-width:820px){.shell>.primary-grid>.card::before{display:none}.shell>.primary-grid>.card{box-shadow:0 15px 34px rgba(0,5,20,.29),inset 0 1px rgba(255,255,255,.06)!important}}
@media(prefers-reduced-motion:reduce){.shell>.primary-grid>.card,.shell>.primary-grid>.card::before,.shell>.quick-actions :is(a,button){transition:none!important;animation:none!important}}

/* CHIEL_SITEWIDE_PREMIUM_V8: alleen vormgeving */
:root{--chiel-v8-edge:rgba(143,213,246,.29);--chiel-v8-cyan:#81e1f8}
.ecosystem-nav,.chiel-ecosystem-nav{border-color:var(--chiel-v8-edge)!important;border-radius:17px!important;box-shadow:0 16px 44px rgba(0,7,20,.25)!important;backdrop-filter:blur(16px)}
.card:not(.warning):not(.error),.panel:not(.scene-panel):not(.error),.portal-group,.program-card{border-color:var(--chiel-v8-edge)!important;box-shadow:0 22px 54px rgba(0,6,18,.3),inset 0 1px rgba(245,252,255,.055)!important}
.ecosystem-nav a:focus-visible,.chiel-ecosystem-nav a:focus-visible{outline:2px solid #98edff;outline-offset:3px}
@media(max-width:680px){:where(.ecosystem-nav,.chiel-ecosystem-nav) a{min-height:44px}}
/* Heldere actieve module en rustige focus op iedere schermmaat. */
.ecosystem-nav a:is(.active,[aria-current]),.chiel-ecosystem-nav a:is(.active,[aria-current]){
 color:#edfbff!important;border-color:rgba(104,219,242,.4)!important;
 background:linear-gradient(118deg,rgba(33,151,204,.19),rgba(69,112,202,.13))!important;
 box-shadow:inset 0 1px rgba(244,255,255,.09),0 0 18px rgba(37,169,219,.08);
}
.ecosystem-nav,.chiel-ecosystem-nav{
 background:linear-gradient(122deg,rgba(16,41,62,.93),rgba(7,23,40,.94))!important;
 -webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);
}
.card h2,.panel h2,.program-card b{letter-spacing:-.025em;text-wrap:balance}
.card strong,.panel strong,.program-card strong{font-variant-numeric:tabular-nums}
@media(hover:hover) and (pointer:fine){
 .ecosystem-nav a:hover,.chiel-ecosystem-nav a:hover{color:#edfbff!important}
 .card:not(.error):hover,.panel:not(.error):hover{border-color:rgba(109,217,246,.4)!important}
}
@media(max-width:680px){
 .ecosystem-nav,.chiel-ecosystem-nav{border-radius:14px!important}
 .card,.panel:not(.scene-panel),.program-card{border-radius:19px}
}
@media(prefers-reduced-motion:reduce){
 .ecosystem-nav a,.chiel-ecosystem-nav a{transition:none!important}
}