/* Appearance tokens only override colours in dark mode; light fallbacks live
   alongside their original declarations so customizer colours stay intact. */
:root { color-scheme: light; }
html[data-color-mode="dark"] {
    color-scheme: dark;
    --appearance-ink:#E8E9EB; --appearance-muted:#ADB0B6;
    --appearance-strong:#E8E9EB; --appearance-paper:#222326;
    --appearance-input:#2B2D31; --appearance-hover:#34363C;
    --appearance-rule:#3B3E44; --appearance-input-rule:#646972;
    --appearance-button-text:#18191B; --appearance-button-hover:#D2D5DA;
    --appearance-pending:#D7BE96; --appearance-error:#F2A7A2;
    --appearance-error-bg:#382625; --appearance-error-rule:#DC8A83;
    --appearance-body:#18191B; --appearance-decoration:none;
    --appearance-glass:#222326; --appearance-glass-hover:#27292D;
    --appearance-header:rgba(34,35,38,.95); --appearance-footer:#202124;
    --appearance-link:#80B5FF; --appearance-link-hover:#B9CEFF;
    --appearance-hero:rgba(0,0,0,.16);
}
/* Without JavaScript the page keeps the default light palette. */
/* Higher specificity than the customizer's :root overrides, dark only. */
html:root {
    --color-text:var(--appearance-ink, #1d1d1f);
    --color-muted:var(--appearance-muted, #86868b);
    --color-border:var(--appearance-rule, rgba(0,0,0,.08));
}
body { background:var(--appearance-body, linear-gradient(160deg,#f3f3f6 0%,#f9f9fb 40%,#f5f5f8 100%)); }
body::before { background:var(--appearance-decoration, radial-gradient(ellipse at 15% 40%,rgba(0,122,255,.06),transparent 55%),radial-gradient(ellipse at 85% 25%,rgba(88,86,214,.04),transparent 50%),radial-gradient(ellipse at 60% 80%,rgba(255,149,0,.03),transparent 50%)); }
.home.blog .home-content-cover { background:var(--appearance-body,linear-gradient(160deg,#f3f3f6 0%,#f9f9fb 40%,#f5f5f8 100%)); }
.hero-overlay { background-color:var(--appearance-hero,transparent); }
.glass-card,.glass-morph { --glass-bg:var(--appearance-glass,rgba(255,255,255,.45)); --glass-bg-hover:var(--appearance-glass-hover,rgba(255,255,255,.65)); --glass-border:1px solid var(--appearance-rule,rgba(255,255,255,.35)); }
.site-header.scrolled { background:var(--appearance-header,rgba(249,249,251,.72)); }
.header-search-input,.header-search-input:focus { color-scheme:inherit; background:var(--appearance-input,rgba(255,255,255,.9)); border-color:var(--appearance-input-rule,rgba(0,0,0,.15)); }
.header-search-input:focus { border-color:var(--appearance-ink,rgba(0,0,0,.28)) !important; }
.discussion-form .submit { color:var(--appearance-button-text,#fff); }
.discussion-form .submit:hover { background:var(--appearance-button-hover,#27282b); }
.social-dock { background:var(--appearance-footer,rgba(232,234,238,.96)); border-color:var(--appearance-rule,rgba(29,29,31,.08)); }
.social-dock-label { color:var(--appearance-muted,rgba(29,29,31,.56)); }
.social-dock-links { border-color:var(--appearance-rule,rgba(29,29,31,.12)); }
.social-link::after { background:var(--appearance-input,rgba(238,240,243,.98)); color:var(--appearance-ink,rgba(29,29,31,.78)); }
.site-footer { background:var(--appearance-footer,rgba(255,255,255,.5)); }
.home.blog .site-footer { background:transparent; }
.entry-content :is(pre,code,th) { background:var(--appearance-input,rgba(0,0,0,.04)); }
.entry-content blockquote { background:var(--appearance-input,rgba(0,122,255,.04)); }
.entry-content :is(td,th) { border-color:var(--appearance-rule,rgba(0,0,0,.08)); }
.entry-content pre code { background:transparent; }
.about-contact-row:hover { background:var(--appearance-hover,rgba(29,29,31,.035)); }
.about-page { --about-rule:var(--appearance-rule,rgba(29,29,31,.13)); }
.changelog-page { --changelog-line:var(--appearance-rule,rgba(29,29,31,.11)); }
.changelog-note ul { background:var(--appearance-paper,rgba(255,255,255,.48)); }
.page-action-link,.posts-navigation .nav-links a,.posts-navigation .page-numbers,.back-to-top { background:var(--appearance-paper,rgba(255,255,255,.52)); border-color:var(--appearance-rule,rgba(29,29,31,.12)); }
.page-action-link:hover,.back-to-top:hover { background:var(--appearance-hover,rgba(255,255,255,.72)); }
.search-form .search-field { color:var(--color-text); }
.comment-form :is(input,textarea)::placeholder,.savio-auth-form input::placeholder { color:var(--appearance-muted,#757575); opacity:1; }
.search-form .search-submit,.posts-navigation .nav-links .current { background:var(--appearance-strong,var(--liquidglass-primary,#007aff)); color:var(--appearance-button-text,#fff); }
input:-webkit-autofill,textarea:-webkit-autofill { -webkit-text-fill-color:var(--color-text); box-shadow:inset 0 0 0 1000px var(--appearance-input,#fff); caret-color:var(--color-text); }
.hero-search-input:-webkit-autofill { -webkit-text-fill-color:#fff; box-shadow:inset 0 0 0 1000px #303236; }

.appearance-control { display:none; position:relative; flex:0 0 44px; margin-left:0; color:var(--color-text); }
html[data-appearance] .appearance-control { display:block; }
.hero-top .appearance-control { color:#fff; }
.appearance-toggle,.hero-search-toggle,.header-search-toggle { width:44px; height:44px; display:grid; place-items:center; padding:0; border:0; border-radius:50%; background:transparent; cursor:pointer; -webkit-tap-highlight-color:transparent; touch-action:manipulation; transition:background-color 160ms,opacity 160ms; }
.appearance-toggle { color:inherit; }
.appearance-toggle:active,.hero-search-toggle:active,.header-search-toggle:active { background:var(--appearance-hover,rgba(0,0,0,.06)); }
.hero-top .appearance-toggle:active,.hero-search-toggle:active { background:rgba(255,255,255,.16); }
.appearance-toggle:focus-visible,.hero-search-toggle:focus-visible,.header-search-toggle:focus-visible { outline:2px solid currentColor; outline-offset:2px; }
@media(hover:hover) {
    .appearance-toggle:hover,.header-search-toggle:hover { background:var(--appearance-hover,rgba(0,0,0,.06)); }
    .hero-top .appearance-toggle:hover,.hero-search-toggle:hover { background:rgba(255,255,255,.16); }
}
.appearance-icon { display:none; width:22px; height:22px; }
.appearance-toggle svg,.hero-search-toggle svg,.header-search-toggle svg { width:22px; height:22px; stroke-width:1.75; }
html[data-appearance="light"] .appearance-icon--light,html[data-appearance="dark"] .appearance-icon--dark { display:block; }
.appearance-tip { position:absolute; z-index:20; right:0; top:calc(100% + 8px); width:max-content; max-width:calc(100vw - 32px); padding:7px 10px; border:1px solid var(--appearance-rule,#d8dadd); border-radius:6px; color:var(--color-text); background:var(--appearance-input,#fff); font:400 12px/1.5 var(--font-main); opacity:0; visibility:hidden; pointer-events:none; }
.appearance-control:has(.appearance-toggle:focus-visible) .appearance-tip,.appearance-control.show-feedback .appearance-tip { opacity:1; visibility:visible; }
@media(hover:hover) { .appearance-control:hover .appearance-tip { opacity:1; visibility:visible; } }
.hero-top,.site-header .header-inner { column-gap:8px; }
.main-navigation,.hero-nav { margin-left:auto; }
@media(max-width:782px) {
    .hero-top,.site-header .header-inner,body.single-post .site-header .header-inner {
        display:grid; grid-template-columns:minmax(0,1fr) 44px 44px;
        grid-template-areas:"brand appearance search" "nav nav nav"; column-gap:8px;
    }
    .hero-brand,.header-brand { grid-area:brand; width:auto; min-width:0; justify-content:flex-start; }
    .hero-nav,.main-navigation { grid-area:nav; min-width:0; margin-left:0; }
    .hero-menu,.nav-menu { justify-content:flex-start; }
    .hero-search,.header-search { grid-area:search; margin:0; }
    .appearance-control { grid-area:appearance; margin:0; }
    .hero-search-input,.header-search-input,body.single-post .header-search-input { width:min(270px,calc(100vw - 112px)); }
    .header-name,.hero-brand-control { font-size:clamp(16px,4.8vw,21px); }
}
html.appearance-changing body,html.appearance-changing :is(.site-header,.home-content-cover,.glass-card,.reading-article,.reading-next,.discussion-sheet,.savio-auth-dialog,input,textarea,.site-footer,.social-dock) { transition:background-color 160ms ease,color 160ms ease,border-color 160ms ease; }
/* Place search outside the navigation, to the right or below when space is tight. */
.hero-top .hero-search,.site-header .header-search { margin-left:0; }
body .hero-search .hero-search-input,body .header-search .header-search-input {
    box-sizing:border-box; width:min(280px,calc(100vw - 32px)); min-height:44px;
}
body .hero-search .hero-search-input { background:#303236; }
body .header-search .header-search-input { background:var(--appearance-input,#fff); }
.hero-search.active .hero-search-toggle,.header-search.active .header-search-toggle { opacity:1; pointer-events:auto; }
.hero-search.active .hero-search-toggle svg,.header-search.active .header-search-toggle svg { opacity:1; transform:none; }
.hero-search.active .hero-search-toggle { background:rgba(255,255,255,.16); }
.header-search.active .header-search-toggle { background:var(--appearance-hover,rgba(0,0,0,.06)); }
@media(prefers-reduced-motion:reduce) { html.appearance-changing *, .appearance-toggle,.hero-search-toggle,.header-search-toggle { transition:none !important; } }