/* =====================================================================
   INK NIGHT: the Ink style on black sumi paper, Nomi in white ink, the
   vermilion kept. Same palette as the Sage Core Blueprint's Night.
   On when <html data-ink="night"> and data-theme="ink"; the Paper and
   Night buttons in the style switcher set it (assets/js/ink-night.js).
   Loads after themes.css, so every rule here outranks the Ink rules.
   ===================================================================== */
html[data-ink="night"][data-theme="ink"]{
  --pearl:#151412;--paper:#1d1c19;--ink:#f2ece0;--forest:#f2ece0;--forest-deep:#0e0d0c;--jade:#e0553a;
  --mint:#1d1c19;--mint-2:rgba(242,236,224,.2);--gold:#a59d8f;--gold-line:#5c564b;--gold-soft:#2b2924;
  --body:#d6cfc1;--muted:#a59d8f;--line:rgba(242,236,224,.12);--line-strong:rgba(242,236,224,.26);
  color-scheme:dark;
}
html[data-ink="night"][data-theme="ink"] body{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .95 0 0 0 0 .92 0 0 0 0 .86 0 0 0 .045 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E") 0 0/240px 240px,#151412}
html[data-ink="night"][data-theme="ink"] .jade{color:#e0553a}
html[data-ink="night"][data-theme="ink"] .label{color:#a59d8f}
html[data-ink="night"][data-theme="ink"] .wordmark{color:#f2ece0}
html[data-ink="night"][data-theme="ink"] .wordmark::after{color:#e0553a}
html[data-ink="night"][data-theme="ink"] .nav{background:rgba(21,20,18,.88)}
html[data-ink="night"][data-theme="ink"] .link{text-decoration-color:#e0553a}
html[data-ink="night"][data-theme="ink"] .lg img{filter:invert(.92)}

/* hairlines and paper in place of cards, now dark */
html[data-ink="night"][data-theme="ink"] .tri,html[data-ink="night"][data-theme="ink"] .fit-item,html[data-ink="night"][data-theme="ink"] .tier,html[data-ink="night"][data-theme="ink"] .anything,html[data-ink="night"][data-theme="ink"] .window{background:rgba(29,28,25,.72);border-color:rgba(242,236,224,.26)}
html[data-ink="night"][data-theme="ink"] .tri.dark{background:#0e0d0c;border-color:rgba(242,236,224,.26)}
html[data-ink="night"][data-theme="ink"] .price-card{border-color:rgba(242,236,224,.55)}
html[data-ink="night"][data-theme="ink"] .pc-price .left{background:#151412;color:#f2ece0}
html[data-ink="night"][data-theme="ink"] .chip{background:rgba(29,28,25,.85);border-color:rgba(242,236,224,.26)}
html[data-ink="night"][data-theme="ink"] .chip img{filter:invert(.92)}
html[data-ink="night"][data-theme="ink"] .chip .mono{background:#f2ece0;color:#151412}
html[data-ink="night"][data-theme="ink"] .hat::before{color:#a59d8f}
html[data-ink="night"][data-theme="ink"] .hat-title{color:#f2ece0;text-decoration-color:rgba(242,236,224,.45)}
html[data-ink="night"][data-theme="ink"] .flow-out{background:#1d1c19;color:#f2ece0}

/* the three visuals: the AI tiles, the file tree, the calendar */
html[data-ink="night"][data-theme="ink"] .mt{box-shadow:0 0 0 1px rgba(242,236,224,.22),0 14px 24px -14px rgba(0,0,0,.8)}
html[data-ink="night"][data-theme="ink"] .mt-ask{background:#151412;color:#a59d8f}
html[data-ink="night"][data-theme="ink"] .mt-send{background-color:#e0553a}
html[data-ink="night"][data-theme="ink"] .ed{background:#151412;box-shadow:0 12px 24px -18px rgba(0,0,0,.8)}
html[data-ink="night"][data-theme="ink"] .ed-bar{background:#26241f}
html[data-ink="night"][data-theme="ink"] .ed-t{color:#a59d8f}
html[data-ink="night"][data-theme="ink"] .br{background:#151412;color:#d6cfc1}
html[data-ink="night"][data-theme="ink"] .r{color:#d6cfc1}
html[data-ink="night"][data-theme="ink"] .r.on{background:rgba(224,85,58,.14)}
html[data-ink="night"][data-theme="ink"] .cal{background:#1d1c19;box-shadow:0 0 0 1px rgba(242,236,224,.16),0 14px 26px -16px rgba(0,0,0,.8)}
html[data-ink="night"][data-theme="ink"] .cal-h span,html[data-ink="night"][data-theme="ink"] .ev span{color:#a59d8f}
html[data-ink="night"][data-theme="ink"] .cal-ev{background-image:repeating-linear-gradient(to bottom,transparent 0,transparent calc(18.18% - 1px),rgba(242,236,224,.08) calc(18.18% - 1px),rgba(242,236,224,.08) 18.18%)}
html[data-ink="night"][data-theme="ink"] .ev.c1{background:rgba(47,154,89,.2)}
html[data-ink="night"][data-theme="ink"] .ev.c2{background:rgba(201,155,61,.2)}
html[data-ink="night"][data-theme="ink"] .ev.c3{background:rgba(200,115,74,.22)}
html[data-ink="night"][data-theme="ink"] .ev.c4{background:rgba(138,100,184,.22)}

/* phone: Telegram in dark mode, in ink tones */
html[data-ink="night"][data-theme="ink"] .tg-head{background:rgba(28,27,25,.96);border-bottom-color:rgba(242,236,224,.12)}
html[data-ink="night"][data-theme="ink"] .tg-title b{color:#f2ece0}
html[data-ink="night"][data-theme="ink"] .tg-chat{background:linear-gradient(160deg,#1f1d1a 0%,#171613 100%)}
html[data-ink="night"][data-theme="ink"] .tg-date{background:rgba(242,236,224,.14)}
html[data-ink="night"][data-theme="ink"] .bub{background:#2a2723;color:#f2ece0;box-shadow:none}
html[data-ink="night"][data-theme="ink"] .bub.tail::before{background:radial-gradient(circle at 0 0,rgba(42,39,35,0) 10px,#2a2723 10.5px)}
html[data-ink="night"][data-theme="ink"] .bub .quote{background:rgba(224,85,58,.14);border-left-color:#e0553a}
html[data-ink="night"][data-theme="ink"] .bub .quote em{color:#ef8a72}
html[data-ink="night"][data-theme="ink"] .tg-input{background:rgba(28,27,25,.97);border-top-color:rgba(242,236,224,.1)}
html[data-ink="night"][data-theme="ink"] .tg-field{background:#0e0d0c;border-color:rgba(242,236,224,.14)}

/* Nomi in white ink, the pearl in vermilion (nomi-dragon.js reads these) */
html[data-ink="night"][data-theme="ink"] [data-nomi]{--nomi-ink:#f2ece0;--nomi-wash:rgba(242,236,224,.4);--nomi-pearl:#e0553a}

/* chaos scene: the dither canvas is drawn in paper and ink; a color matrix
   (#ink-night-dither, added by ink-night.js) turns its paper black and its
   ink white and keeps the vermilion red */
html[data-ink="night"][data-theme="ink"] .cp-stage,html[data-ink="night"][data-theme="ink"] .cp-stage.dither{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .95 0 0 0 0 .92 0 0 0 0 .86 0 0 0 .045 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E") 0 0/240px 240px,#151412}
html[data-ink="night"][data-theme="ink"] .cp-stage::before,html[data-ink="night"][data-theme="ink"] .cp-stage::after{background:none}
/* lighten lets the page's paper grain show through the canvas's flat black */
html[data-ink="night"][data-theme="ink"] .cp-stage .cp-dither{filter:url(#ink-night-dither);mix-blend-mode:lighten}
html[data-ink="night"][data-theme="ink"] .cp-glow{background:radial-gradient(circle,rgba(242,236,224,.14) 0%,rgba(242,236,224,.05) 38%,rgba(242,236,224,0) 64%)}
html[data-ink="night"][data-theme="ink"] .cp-card{color:#f2ece0;border-color:rgba(242,236,224,.2)}
html[data-ink="night"][data-theme="ink"] .cp-stage:not(.dither) .cp-card{background:rgba(29,28,25,.92)}

/* the app wall and its scroll scene */
html[data-ink="night"][data-theme="ink"] .suck-card{background:#1d1c19;border-color:rgba(242,236,224,.2);box-shadow:0 14px 28px -20px rgba(0,0,0,.9)}
html[data-ink="night"][data-theme="ink"] .suck-count{background:#f2ece0;color:#151412}

/* the band is already black sumi paper: a hairline keeps it apart from the page */
html[data-ink="night"][data-theme="ink"] .band{background:#0e0d0c;border-block:1px solid rgba(242,236,224,.12)}

/* the style switcher, with Paper and Night beside the styles while Ink is on */
.theme-switch .ts-ink{display:none}
html[data-theme="ink"] .theme-switch .ts-ink{display:flex;gap:4px;margin-left:4px;padding-left:8px;border-left:1px solid rgba(242,236,224,.22)}
html[data-ink="night"][data-theme="ink"] .theme-switch{background:rgba(29,28,25,.94);box-shadow:0 0 0 1px rgba(242,236,224,.2),0 10px 30px -12px rgba(0,0,0,.8)}
@media (max-width:720px){
  .theme-switch:not(.open) .ts-ink{display:none!important}
  html[data-theme="ink"] .theme-switch.open .ts-ink{flex-basis:100%;justify-content:flex-end;margin:4px 0 0;padding:4px 0 0;border-left:0;border-top:1px solid rgba(242,236,224,.22)}
}
@media (max-width:1000px){html[data-ink="night"][data-theme="ink"] .hero-shade{background:linear-gradient(to bottom,rgba(21,20,18,0) 62%,#151412 100%)}}
