/* PHYLLO app pages in the landing's look: grid stage, Instrument Serif + Geist, mauve recon ink. Loaded after each page's own styles. */
:root{
  --bg:#fbfbfa;--bg2:#ffffff;--panel:#ffffff;--line:rgba(20,20,20,.12);--line2:rgba(20,20,20,.24);
  --text:#141414;--mute:#666;--dim:#7a7a7a;--ink:#141414;--white:#fbfbfa;
  --tape:#a2467a;--tape2:#c77aa3;--amber:#a2467a;--box:#a2467a;
  --head:"Instrument Serif",Georgia,"Times New Roman",serif;--body:"Geist","Helvetica Neue",Arial,sans-serif;--mono:"Geist Mono",ui-monospace,Menlo,monospace;
}
body{background:#efefee url(/img/grid.svg) 0 0/80px 80px!important;color:var(--text)}
::selection{background:#a2467a;color:#fff}
:focus-visible{outline-color:#a2467a}
header.top,header.top.sc,header.top.solid{background:rgba(239,239,238,.9)!important;border-color:var(--line)!important}
.brand{font:500 17px var(--mono)!important;letter-spacing:.1em!important;text-transform:uppercase}
.brand img{width:34px!important;height:34px!important;filter:none!important}
h1,h2,.page h1,.empty h1{font-family:var(--head)!important;text-transform:none!important;font-weight:400!important;letter-spacing:-.005em!important;line-height:1.05}
h3{font-family:var(--body)!important}
body{font-family:var(--body)}
h1 em,h2 em{font-style:italic;color:#a2467a}
.mod>header b{text-transform:none!important;font-weight:500!important;letter-spacing:-.01em!important}
.box,.mod{background:#fff!important;border-color:var(--line)!important;box-shadow:none}
.counts div,.subs{background:#fbfbfa!important}
.btn{border-color:var(--line2)}
.btn:hover{background:rgba(20,20,20,.05)}
.btn.tape{background:#141414!important;border-color:#141414!important;color:#fbfbfa!important;box-shadow:none!important}
.btn.tape:hover{background:#a2467a!important;border-color:#a2467a!important}
.cmd{background:#fff!important;border-color:#141414!important;backdrop-filter:none}
.cmd .pr{color:#a2467a!important;font-family:var(--mono)!important;text-transform:none!important;letter-spacing:0!important}
.filters button[aria-pressed="true"]{background:#141414!important;border-color:#141414!important}
.dark,.log,.code,.verify code,.f pre,.ai pre{background:#141414!important;box-shadow:none!important;border-color:#141414!important}
.dark h3,.code,.verify code,.f pre,.ai pre .lab,.log .y{color:#e7a6c9!important}
.sev.medium{background:rgba(162,70,122,.12)!important;color:#8a3a66!important}
.chip.plan{color:#a2467a!important;border-color:rgba(162,70,122,.35)!important}
.spin{border-top-color:#a2467a!important}
.navlinks a.on{color:#a2467a;opacity:1}

/* boards: every readout sits on a panel with recon corner ticks; only page headlines sit on the grid */
.box,.mod,.docs article,.empty{position:relative}
.box,.mod,.docs article,.toc,.empty{border-radius:6px!important;border:1px solid rgba(20,20,20,.14)!important;box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 14px 34px -22px rgba(20,20,20,.45)!important}
.box::before,.mod::before,.docs article::before,.toc::before,.box::after,.mod::after,.docs article::after,.toc::after{content:"";position:absolute;width:10px;height:10px;pointer-events:none;z-index:1}
.box::before,.mod::before,.docs article::before,.toc::before{left:-1px;top:-1px;border-left:1.5px solid #a2467a;border-top:1.5px solid #a2467a;border-top-left-radius:6px}
.box::after,.mod::after,.docs article::after,.toc::after{right:-1px;bottom:-1px;border-right:1.5px solid #a2467a;border-bottom:1.5px solid #a2467a;border-bottom-right-radius:6px}
.dark::before,.dark::after{border-color:#e7a6c9!important}
.docs article{background:rgba(251,251,250,.94);padding:30px clamp(18px,3vw,40px)}
.docs article section:last-child{border-bottom:0;margin-bottom:0;padding-bottom:6px}
.toc{background:rgba(251,251,250,.94);padding:8px}
.toc a:hover,.toc a.on{background:rgba(162,70,122,.08)!important;color:#a2467a}
.empty{background:rgba(251,251,250,.94);padding:40px 20px!important}
.eyebrow{display:inline-flex;padding:5px 10px;border-radius:999px;background:rgba(251,251,250,.9);border:1px solid rgba(20,20,20,.12);font-family:var(--mono)!important;color:#a2467a!important}
.page .sub{display:inline-block;background:rgba(251,251,250,.9);border:1px solid rgba(20,20,20,.1);border-radius:6px;padding:10px 14px;color:#444!important}
article code{background:rgba(162,70,122,.08)!important}
@media (max-width:860px){.toc{flex-direction:row}}
.toc::after{right:0;bottom:0}

.xi{display:inline-flex;align-items:center;margin-left:22px;color:var(--dim);transition:color .25s}.xi:hover{color:#a2467a}.xi svg{width:16px;height:16px}
@media (max-width:860px){.nav .xi{margin-left:auto}}
