/* Layout: a press-shop proof sheet. Masthead name, a spec row of counts,
   then one band per discipline (writing, graphics, photo, events), each in its own native format,
   a running list of offices and outlets she has worked with, and a signed sign-off.
   Profile opens as a LinkedIn-style splash over the page, after unwd.net. */
:root{
  --paper:#F2F3EF;
  --sheet:#FBFBF8;
  --ink:#15171B;
  --muted:#5D626A;
  --rule:#D6D9D2;
  --pencil:#2B45D2;      /* blue editing pencil */
  --pencil-soft:#2B45D21A;
  --on-pencil:#FFFFFF;
  --hatch:#2B45D226;
  --display:"Bricolage Grotesque", "Arial Narrow", Arial, sans-serif;
  --title:"Instrument Serif", "Source Serif 4", Georgia, serif;   /* titles only; the wordmark stays in the display face */
  --read:"Source Serif 4", Georgia, "Times New Roman", serif;
  --mono:"IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
  --s-1:.75rem; --s0:.9375rem; --s1:1.0625rem; --s2:1.375rem; --s3:1.875rem; --s4:2.75rem;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --paper:#111317; --sheet:#181B20; --ink:#ECEDE8; --muted:#9BA1A9; --rule:#2B3038;
    --pencil:#93A6FF; --pencil-soft:#93A6FF1F; --on-pencil:#0E1014; --hatch:#93A6FF29;
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --paper:#111317; --sheet:#181B20; --ink:#ECEDE8; --muted:#9BA1A9; --rule:#2B3038;
  --pencil:#93A6FF; --pencil-soft:#93A6FF1F; --on-pencil:#0E1014; --hatch:#93A6FF29;
  color-scheme:dark;
}
*{box-sizing:border-box}
body{background:var(--paper);color:var(--ink);font-family:var(--display);font-size:var(--s0);line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:inherit}
:focus-visible{outline:2px solid var(--pencil);outline-offset:3px;border-radius:2px}
.wrap{max-width:1180px;margin:0 auto;padding-left:max(16px, env(safe-area-inset-left, 0px));padding-right:max(16px, env(safe-area-inset-right, 0px))}
.mono{font-family:var(--mono);font-size:var(--s-1);letter-spacing:.06em;text-transform:uppercase}
.muted{color:var(--muted)}

/* masthead */
header.top{position:sticky;top:env(safe-area-inset-top, 0px);z-index:5;background:var(--paper);border-bottom:1px solid var(--rule)}
header.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:14px;flex-wrap:wrap}
.wordmark{font-weight:750;font-variation-settings:"wdth" 80;font-size:1.125rem;letter-spacing:-.01em;text-decoration:none}
.wordmark span{color:var(--pencil)}
nav.links{display:flex;gap:4px 18px;flex-wrap:wrap}
nav.links a,nav.links button{font-family:var(--mono);font-size:var(--s-1);letter-spacing:.06em;text-transform:uppercase;text-decoration:none;background:none;border:0;color:var(--muted);cursor:pointer;padding:4px 0}
nav.links a:hover,nav.links button:hover{color:var(--ink)}
nav.links button{color:var(--pencil)}

.hero{position:relative;background:var(--ink);color:var(--paper);overflow:hidden}
.hero-media{margin:0;height:min(calc(100vh - 58px),1040px);min-height:540px}
.hero-media img{width:100%;height:100%;object-fit:cover;object-position:50% 34%;display:block}
.hero-media.await{display:grid;place-items:center;background:repeating-linear-gradient(135deg,rgba(255,255,255,.06) 0 1px,transparent 1px 9px),#1B1E24}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(21,23,27,.42) 0%,rgba(21,23,27,.08) 34%,rgba(21,23,27,0) 58%);-webkit-mask-image:linear-gradient(180deg,#000 60%,transparent 75%);mask-image:linear-gradient(180deg,#000 60%,transparent 75%);pointer-events:none}
.hero{background:transparent}
.hero-media img{-webkit-mask-image:linear-gradient(180deg,#000 66%,transparent 99%);mask-image:linear-gradient(180deg,#000 66%,transparent 99%)}
.hero-over .wrap{position:relative}
.hero-cap{align-items:flex-end}
.hero .sig{margin:0}
.hero .sigmark{width:clamp(150px,18vw,260px);background:var(--pencil);opacity:1;-webkit-mask-position:right center;mask-position:right center}
.hero-over{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;justify-content:space-between;padding-block:clamp(18px,3vw,32px) clamp(22px,4vw,48px)}
.hero-over .wrap{width:100%;display:flex;flex-direction:column;justify-content:space-between;height:100%}
.hero .slug{display:flex;gap:10px 22px;flex-wrap:wrap;color:rgba(242,243,239,.78)}
.hero h1{margin:16px 0 0;font-family:var(--title);font-weight:400;font-size:clamp(3.6rem,8.2vw,7.8rem);line-height:.88;letter-spacing:-.03em;color:var(--paper);text-shadow:0 2px 30px rgba(0,0,0,.28)}
.hero-cap{display:flex;justify-content:space-between;gap:16px;color:var(--ink)}
.hero-cap .mark{display:inline-block;width:8px;height:8px;background:var(--pencil);margin-right:10px;vertical-align:1px}
.hero h1 em{font-style:italic;color:#C7D1FF}
/* lede under the image */
.lede{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);grid-template-areas:"dek side" "spec spec";gap:clamp(20px,3vw,40px) clamp(28px,5vw,72px);align-items:start;padding-top:clamp(28px,4vw,48px)}
.lede .dek{grid-area:dek;margin:0;max-width:40ch;font-family:var(--read);font-size:clamp(1.25rem,2.3vw,1.7rem);line-height:1.38;text-wrap:pretty}
.lede .dek em{font-family:var(--title);font-style:italic;font-size:1.12em;color:var(--pencil)}
.lede-side{grid-area:side;display:flex;flex-direction:column;gap:22px;justify-self:end;align-items:flex-end}
.lede .actions{display:flex;gap:12px;flex-wrap:wrap;justify-content:flex-end}
.lede .spec{grid-area:spec;margin-top:clamp(8px,2vw,20px)}
.btn{display:inline-flex;align-items:center;gap:10px;font-family:var(--mono);font-size:var(--s-1);letter-spacing:.06em;text-transform:uppercase;padding:13px 18px;border:1px solid var(--ink);background:none;color:var(--ink);cursor:pointer;text-decoration:none;transition:background .18s,color .18s,border-color .18s,transform .15s}
.btn:hover{background:var(--ink);color:var(--paper)}
.btn.solid{background:var(--pencil);border-color:var(--pencil);color:var(--on-pencil)}
.btn.solid:hover{background:var(--ink);border-color:var(--ink);color:var(--paper)}

.spec{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-top:1px solid var(--ink);border-bottom:1px solid var(--rule)}
.spec div{padding:14px 12px 16px 0;display:flex;flex-direction:column;gap:6px}
.spec div+div{padding-left:14px;border-left:1px solid var(--rule)}
.spec b{font-family:var(--title);font-weight:400;font-size:calc(var(--s4) * 1.15);line-height:1;font-variant-numeric:tabular-nums}
.spec b.none{color:var(--muted)}

/* bands */
section.band{padding-block:clamp(56px,8vw,96px) 0}
.bandhead{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:12px 24px;border-bottom:1px solid var(--ink);padding-bottom:14px;margin-bottom:28px}
.bandhead h2{margin:0;font-family:var(--title);font-weight:400;font-size:clamp(2.4rem,4.6vw,3.6rem);line-height:.95;letter-spacing:-.02em}
.bandhead h2 em{color:var(--pencil)}
.bandhead p{margin:6px 0 0;color:var(--muted);max-width:52ch}

/* writing: release sheets */
.sheets{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.sheet{background:var(--sheet);border:1px solid var(--rule);padding:22px 24px 20px;display:flex;flex-direction:column;gap:12px;min-width:0;position:relative;transition:border-color .2s,transform .2s,box-shadow .2s}
.sheet:not(.await):hover{border-color:var(--ink);transform:translateY(-2px);box-shadow:0 14px 30px -18px rgba(21,23,27,.35)}
.sheet .byline{font-family:var(--mono);font-size:var(--s-1);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.sheet .row{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;color:var(--muted)}
.sheet .kind{color:var(--pencil)}
.sheet h3{margin:0;font-family:var(--title);font-weight:400;font-size:calc(var(--s2) * 1.15);line-height:1.1;letter-spacing:-.01em;text-wrap:balance}
.sheet .body{font-family:var(--read);font-size:var(--s1);line-height:1.55;margin:0}
.sheet .body .dl{font-weight:650}
.sheet .end{display:flex;justify-content:space-between;align-items:center;gap:12px;border-top:1px dashed var(--rule);padding-top:12px;margin-top:auto}
.sheet .read{white-space:nowrap}
.sheet .end .hash{font-family:var(--mono);letter-spacing:.3em;color:var(--muted)}
.sheet a.read{font-family:var(--mono);font-size:var(--s-1);letter-spacing:.06em;text-transform:uppercase;color:var(--pencil);text-decoration:none}

/* awaiting slots */
.await{background:repeating-linear-gradient(135deg,var(--hatch) 0 1px,transparent 1px 9px),var(--sheet);border:1px dashed var(--pencil);color:var(--muted)}
.await .tag{display:inline-flex;align-self:flex-start;gap:8px;align-items:center;background:var(--pencil-soft);color:var(--pencil);padding:4px 8px}
.sheet.await h3{color:var(--muted);font-weight:500}
.sheet.await .lines{display:flex;flex-direction:column;gap:9px;margin:4px 0}
.sheet.await .lines i{display:block;height:8px;background:var(--rule)}

/* graphics */
.boards{column-count:3;column-gap:20px}
.boards figure{break-inside:avoid;margin:0 0 20px;display:block}
.boards .frame{transition:transform .25s,box-shadow .25s}
/* home design preview: two wide slots stacked beside one tall slot; images crossfade in place */
.rotator{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.rotator .slot{position:relative;display:block;overflow:hidden;background:var(--sheet);border:1px solid var(--rule);transition:transform .25s,box-shadow .25s}
.rotator .slot:hover{transform:translateY(-3px);box-shadow:0 18px 36px -20px rgba(21,23,27,.45)}
.rotator .slot-a,.rotator .slot-b{grid-column:1;aspect-ratio:40/21}
.rotator .slot-c{grid-column:2;grid-row:1 / span 2}
.rotator img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.rotator img.nx{opacity:0;transform:scale(1.05);filter:blur(8px);transition:opacity 1.4s ease,transform 2.4s cubic-bezier(.2,.7,.3,1),filter 1.2s ease}
.rotator img.nx.on{opacity:1;transform:none;filter:none}
@media (max-width:640px){.rotator{grid-template-columns:minmax(0,1fr)}.rotator .slot-a,.rotator .slot-b,.rotator .slot-c{grid-column:auto;grid-row:auto}.rotator .slot-c{aspect-ratio:4/5}}
.boards figure:not(.await):hover .frame{transform:translateY(-3px);box-shadow:0 18px 36px -20px rgba(21,23,27,.45)}
figure{margin:0;min-width:0}
.frame{position:relative;width:100%;max-width:100%;overflow:hidden;background:var(--sheet);border:1px solid var(--rule);display:flex;align-items:center;justify-content:center}
.frame img{width:100%;height:100%;object-fit:cover;display:block}
.frame.await{flex-direction:column;gap:10px;padding:16px;text-align:center}
figcaption{display:flex;justify-content:space-between;gap:12px;padding-top:10px}
figcaption .t{font-weight:600;font-size:var(--s0)}
figcaption .m{font-family:var(--mono);font-size:var(--s-1);letter-spacing:.04em;color:var(--muted);white-space:nowrap}

/* events: run of show */
.ros{display:flex;flex-direction:column;border-top:1px solid var(--rule)}
.ros article{display:grid;grid-template-columns:150px minmax(0,1fr) minmax(0,1fr);gap:8px 28px;padding:20px 0;border-bottom:1px solid var(--rule)}
.ros .when{color:var(--pencil)}
.ros h3{margin:0;font-family:var(--title);font-weight:400;font-size:calc(var(--s2) * 1.15);line-height:1.1}
.ros .where{margin-top:4px}
.ros .did{font-family:var(--read);font-size:var(--s1);line-height:1.55;margin:0}
.ros ul.did{padding-left:1.1em;display:flex;flex-direction:column;gap:4px}

/* worked with: credits, one row per body of work */
.credits{margin-top:-28px}
.credit{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.35fr);gap:10px clamp(24px,5vw,72px);padding:22px 0;border-bottom:1px solid var(--rule);align-items:baseline}
.credit-work h3{margin:0 0 6px;font-family:var(--title);font-weight:400;font-size:var(--s3);line-height:1.05;letter-spacing:-.01em}
.credit-work .mono{font-size:var(--s-1)}
.credit-names{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 28px;font-family:var(--read);font-size:var(--s1);line-height:1.4}
.credit-names li{display:flex;align-items:baseline;gap:12px;min-width:0}
.credit-names li::before{content:"";flex:none;width:5px;height:5px;background:var(--pencil);transform:translateY(-3px)}
@media (max-width:640px){.credit{grid-template-columns:minmax(0,1fr)}.credit-names{grid-template-columns:minmax(0,1fr)}}
/* credits motion: rule draws in, title and names stagger up, markers spin in; hover runs a blue line across */
.credit{position:relative}
.credit::before{content:"";position:absolute;left:0;bottom:-1px;height:2px;width:100%;background:var(--pencil);transform:scaleX(0);transform-origin:left;transition:transform .5s cubic-bezier(.2,.7,.3,1)}
.credit:hover::before{transform:scaleX(1)}
.credit-work h3{transition:transform .35s cubic-bezier(.2,.7,.3,1),color .2s}
.credit:hover .credit-work h3{transform:translateX(10px);color:var(--pencil)}
@media (prefers-reduced-motion:no-preference){
  .credit{border-bottom-color:transparent}
  .credit::after{content:"";position:absolute;left:0;bottom:-1px;height:1px;width:100%;background:var(--rule);transform:scaleX(0);transform-origin:left;transition:transform 1.1s cubic-bezier(.2,.7,.3,1)}
  .credit.in::after{transform:scaleX(1)}
  .credit-work{opacity:0;transform:translateX(-24px);transition:opacity .7s ease,transform .8s cubic-bezier(.2,.7,.3,1)}
  .credit-names li{opacity:0;transform:translateY(12px);transition:opacity .5s ease,transform .6s cubic-bezier(.2,.7,.3,1);transition-delay:calc(.15s + var(--i,0) * .09s)}
  .credit-names li::before{transform:translateY(-3px) scale(0) rotate(-90deg);transition:transform .5s cubic-bezier(.3,1.6,.5,1);transition-delay:calc(.3s + var(--i,0) * .09s)}
  .credit.in .credit-work{opacity:1;transform:none}
  .credit.in .credit-names li{opacity:1;transform:none}
  .credit.in .credit-names li::before{transform:translateY(-3px) scale(1) rotate(0)}
}

/* signature */
.sig{display:flex;align-items:flex-end;gap:16px}
.sigmark{display:block;width:min(170px,50vw);aspect-ratio:307/103;background:var(--muted);-webkit-mask:var(--sig) no-repeat left center/contain;mask:var(--sig) no-repeat left center/contain}
.watermark{position:fixed;z-index:0;pointer-events:none;right:-18vw;top:46vh;width:max(760px,92vw);aspect-ratio:307/103;background:var(--pencil);opacity:.06;transform:rotate(-7deg);-webkit-mask:var(--sig) no-repeat center/contain,linear-gradient(to bottom,#000 30%,transparent 92%);-webkit-mask-composite:source-in;mask:var(--sig) no-repeat center/contain intersect,linear-gradient(to bottom,#000 30%,transparent 92%)}
main,footer.foot{position:relative;z-index:1}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .watermark{opacity:.1}:root:not([data-theme="light"]) .hero .sigmark{background:#C7D1FF}}
:root[data-theme="dark"] .hero .sigmark{background:#C7D1FF}
:root[data-theme="dark"] .watermark{opacity:.1}
@media (max-width:640px){.watermark{right:-40vw;top:58vh;width:150vw}}
.sig .slot{gap:8px;width:220px;max-width:100%;height:60px;border-bottom:1.5px solid var(--ink);display:flex;align-items:flex-end;padding-bottom:6px}

/* photo: contact sheet */
.contact{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;background:var(--ink);padding:10px 10px 6px}
.contact figure{background:var(--ink)}
.contact .frame{border:0;aspect-ratio:3/2;background:#000}
.contact .frame.await{background:repeating-linear-gradient(135deg,#ffffff14 0 1px,transparent 1px 9px),#1B1E24;border:1px dashed #6E7FD9;color:#A9B0BA}
.contact .frame.await .tag{background:#93A6FF22;color:#B9C6FF}
.contact figcaption{padding:5px 2px 4px;color:#C9CDD2}
.contact figcaption .m{color:#8D939B}
.contact .sprockets{grid-column:1/-1;height:10px;background:repeating-linear-gradient(90deg,transparent 0 10px,#2A2E35 10px 18px)}

/* contact */
footer.foot{margin-top:clamp(64px,9vw,112px);border-top:1px solid var(--ink)}
footer.foot .wrap{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:28px;padding-block:36px 48px}
footer.foot h2{margin:0;font-family:var(--title);font-weight:400;font-size:clamp(2.6rem,6vw,4.6rem);line-height:.95;letter-spacing:-.02em}
footer.foot h2 em{color:var(--pencil)}
.foot-note{margin:14px 0 0;font-family:var(--read);color:var(--muted);max-width:32ch}
.reach{display:flex;flex-direction:column;gap:14px}
.reach .icons{display:flex;gap:12px}
.reach .icons{gap:22px}
.reach .icons a{display:inline-grid;place-items:center;color:var(--ink);text-decoration:none;transition:color .15s,transform .2s}
.reach .icons a:hover{color:var(--pencil);transform:translateY(-2px)}
.reach .icons svg{display:block}
.reach .line{display:flex;justify-content:space-between;align-items:center;gap:12px;border-top:1px solid var(--rule);padding-top:12px;flex-wrap:wrap}
.reach .val{font-family:var(--mono);font-size:var(--s0);overflow-wrap:anywhere}

/* ============================================================
   PROFILE SPLASH — ported from unwd.net/assets/profile-splash.css.
   LinkedIn's information architecture, this site's palette: the dark
   panel is her ink, the signal is her pencil at its dark-mode value.
   Opens as an overlay from any page; rendered inline on About.
   ============================================================ */
:root{
  --sp-panel:#15171B; --sp-paper:#ECEDE8; --sp-signal:#93A6FF;
  --sp-rule:rgba(236,237,232,.16); --sp-quiet:rgba(236,237,232,.56);
}
html.splash-open, html.splash-open body{overflow:hidden}
.splash{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;padding:clamp(0px,3vw,48px);background:rgba(6,6,6,.88);backdrop-filter:blur(8px) saturate(.8);-webkit-backdrop-filter:blur(8px) saturate(.8);overflow:hidden;font-family:var(--display)}
.splash[hidden]{display:none}
.splash__panel{display:flex;flex-direction:column;width:min(720px,100%);max-height:100%;background:var(--sp-panel);color:var(--sp-paper);font-size:16px;line-height:1.5;box-shadow:0 40px 120px rgba(0,0,0,.6)}
.splash__panel:focus{outline:none}
.splash__head{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:16px clamp(20px,4vw,40px);border-bottom:1px solid var(--sp-rule)}
.splash__title{margin:0;font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.22em;font-family:var(--mono)}
.splash__title::before{content:"";display:inline-block;width:8px;height:8px;margin-right:.8em;background:var(--sp-signal)}
.splash__close{appearance:none;background:none;cursor:pointer;border:1px solid var(--sp-rule);padding:.45em .9em;font:inherit;font-family:var(--mono);font-size:.62rem;font-weight:700;text-transform:uppercase;letter-spacing:.18em;color:var(--sp-quiet);transition:border-color .15s,color .15s}
.splash__close:hover{border-color:var(--sp-signal);color:var(--sp-signal)}
.splash__content{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain}
.splash__body > :not(.splash__identity){padding:0 clamp(20px,4vw,40px)}
.splash__banner{position:relative;aspect-ratio:4/1;overflow:hidden;background:#1C1E24}
.splash__banner img{width:100%;height:100%;object-fit:cover;display:block}
.splash__banner::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(21,23,27,0) 45%,rgba(21,23,27,.85) 100%)}
.splash__banner--empty{aspect-ratio:8/1;background:repeating-linear-gradient(135deg,rgba(147,166,255,.16) 0 1px,transparent 1px 9px),#1C1E24}
.splash__identity-row{display:flex;align-items:flex-end;justify-content:space-between;padding:0 clamp(20px,4vw,40px);margin-top:-46px;position:relative;z-index:1}
.splash__avatar{width:112px;height:112px;border-radius:50%;overflow:hidden;border:3px solid var(--sp-panel);background:var(--sp-panel);display:grid;place-items:center}
.splash__avatar img{width:100%;height:100%;object-fit:cover;display:block}
.splash__avatar--initials{background:var(--sp-signal);color:var(--sp-panel);font-weight:800;font-size:2.2rem;letter-spacing:-.02em}
.splash__inbadge{color:var(--sp-signal);margin-bottom:.4rem}
.splash__nameline{display:flex;align-items:center;gap:.5rem;padding:1.1rem clamp(20px,4vw,40px) 0}
.splash__name{margin:0;font-size:clamp(1.5rem,4vw,2rem);font-weight:800;letter-spacing:-.025em;line-height:1.1}
.splash__verified{color:rgba(236,237,232,.45);flex:0 0 auto}
.splash__headline{margin:.5rem 0 0;padding:0 clamp(20px,4vw,40px);font-size:1rem;line-height:1.4;max-width:46ch}
.splash__location{margin:.5rem 0 0;padding:0 clamp(20px,4vw,40px);font-size:.68rem;text-transform:uppercase;letter-spacing:.14em;color:var(--sp-quiet);font-family:var(--mono)}
.splash__connections{margin:.35rem 0 clamp(32px,5vw,44px);padding:0 clamp(20px,4vw,40px);font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.14em;color:var(--sp-signal);font-family:var(--mono)}
.splash__identity > :last-child{margin-bottom:clamp(32px,5vw,44px)}
.splash__section{margin:0 0 clamp(34px,5vw,52px)}
.splash__section-title{margin:0 0 1.25rem;padding-bottom:.55rem;border-bottom:1px solid var(--sp-rule);font-size:.64rem;font-weight:700;text-transform:uppercase;letter-spacing:.22em;font-family:var(--mono)}
.splash__about{margin:0 0 1rem;max-width:62ch;font-family:var(--read);font-size:1.05rem;line-height:1.55}
.splash__about:last-child{margin-bottom:0}
.splash__item{position:relative;margin:0 0 1.75rem;padding:0 0 0 1.5rem;border-left:1px solid var(--sp-rule)}
.splash__item:last-child{margin-bottom:0}
.splash__item::before{content:"";position:absolute;left:-4px;top:.45em;width:7px;height:7px;background:rgba(236,237,232,.5)}
.splash__item--current::before{background:var(--sp-signal)}
.splash__item-title{margin:0;font-size:1rem;font-weight:700;letter-spacing:-.01em;display:block}
.splash__item-org{margin:.1rem 0 0;font-weight:600}
.splash__item-meta{margin:.35rem 0 0;font-size:.66rem;text-transform:uppercase;letter-spacing:.14em;color:var(--sp-quiet);font-family:var(--mono)}
.splash__item-desc{margin:.6rem 0 0;max-width:60ch;color:rgba(236,237,232,.82);font-family:var(--read)}
.splash__skill-group{margin:0 0 1.25rem}
.splash__skill-group:last-child{margin-bottom:0}
.splash__skill-category{margin:0 0 .6rem;font-size:.6rem;font-weight:700;text-transform:uppercase;letter-spacing:.2em;color:var(--sp-signal);font-family:var(--mono)}
.splash__skill-list{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.4rem}
.splash__skill{border:1px solid var(--sp-rule);padding:.32em .8em;font-size:.78rem}
.splash__cards{display:grid;gap:.75rem;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr))}
.splash__card{display:block;padding:1.1rem 1.2rem;border:1px solid var(--sp-rule);color:inherit;text-decoration:none;transition:border-color .15s,transform .15s}
.splash__card:hover{border-color:var(--sp-signal);transform:translateY(-2px)}
.splash__card-title{margin:0;font-size:.95rem;font-weight:700}
.splash__card-title::after{content:" \2197";color:var(--sp-signal)}
.splash__card-blurb{margin:.5rem 0 0;font-size:.88rem;color:var(--sp-quiet)}
.splash__card-meta{margin:.7rem 0 0;font-size:.62rem;text-transform:uppercase;letter-spacing:.14em;color:var(--sp-quiet);font-family:var(--mono)}
.splash__quote{display:flex;gap:1rem;margin:0 0 1.9rem}
.splash__quote:last-child{margin-bottom:0}
.splash__quote-photo{flex:0 0 auto;width:46px;height:46px;border-radius:50%;overflow:hidden;background:#222;margin-top:.15rem}
.splash__quote-photo img{width:100%;height:100%;object-fit:cover;display:block}
.splash__quote-col{border-left:2px solid var(--sp-signal);padding-left:1rem}
.splash__quote-text{margin:0;font-size:.98rem;line-height:1.5;max-width:56ch;font-family:var(--read)}
.splash__quote-attr{margin:.7rem 0 0;font-size:.64rem;text-transform:uppercase;letter-spacing:.14em;color:var(--sp-quiet);font-family:var(--mono)}
.splash__foot{padding-top:clamp(8px,2vw,16px);padding-bottom:clamp(28px,5vw,48px);border-top:1px solid var(--sp-rule);margin-top:clamp(8px,2vw,16px)}
.splash__linkedin{display:inline-flex;align-items:center;gap:.7rem;margin-top:clamp(20px,4vw,28px);padding:.85em 1.4em;border:1px solid var(--sp-paper);color:var(--sp-paper);text-decoration:none;font-size:.66rem;font-weight:700;text-transform:uppercase;letter-spacing:.18em;font-family:var(--mono);transition:background .15s,color .15s,border-color .15s}
.splash__linkedin:hover{background:var(--sp-paper);color:var(--sp-panel)}
.splash__linkedin-mark{display:block}
.splash__link{color:inherit;text-decoration:none;border-bottom:1px solid var(--sp-rule)}
.splash__link:hover{color:var(--sp-signal);border-color:var(--sp-signal)}
.splash__clamp{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;overflow:hidden}
.splash__clamp.is-expanded{display:block;-webkit-line-clamp:unset;overflow:visible}
.splash__more{appearance:none;background:none;border:0;border-bottom:1px solid transparent;cursor:pointer;margin:.45rem 0 0;padding:0;font:inherit;font-family:var(--mono);font-size:.62rem;font-weight:700;text-transform:uppercase;letter-spacing:.18em;color:var(--sp-signal)}
.splash__more:hover{border-bottom-color:var(--sp-signal)}
/* gaps inside the panel keep the site's "Awaiting" convention */
.splash__gap{display:flex;gap:10px;align-items:center;color:var(--sp-quiet);font-family:var(--read);font-style:italic}
.splash__gap .tag{font-family:var(--mono);font-style:normal;font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;background:rgba(147,166,255,.14);color:var(--sp-signal);padding:3px 7px}
.splash__item .splash__gap{margin-top:.35rem}
[data-splash]{transition:border-color .2s,color .2s}
.splash :focus-visible{outline:2px solid var(--sp-signal);outline-offset:3px}
/* inline on the About page: same panel, in the flow, no overlay */
.splash--inline{position:static;inset:auto;z-index:auto;display:block;padding:0;background:none;backdrop-filter:none;-webkit-backdrop-filter:none;overflow:visible;margin:28px 0 0}
.splash--inline .splash__panel{width:100%;max-width:820px;max-height:none;box-shadow:none;border:1px solid var(--rule)}
.splash--inline .splash__content{overflow:visible}
.splash--inline .splash__close{display:none}
@media (prefers-reduced-motion:no-preference){
  .splash__panel{animation:splash-in .24s cubic-bezier(.2,.7,.3,1) 1}
  @keyframes splash-in{from{opacity:0;transform:translateY(10px)}}
}
@media (max-width:520px){ .splash__avatar{width:88px;height:88px} .splash__identity-row{margin-top:-36px} }

/* scroll reveal */
@media (prefers-reduced-motion:no-preference){
  .reveal{opacity:0;transform:translateY(14px);transition:opacity .6s cubic-bezier(.2,.7,.3,1),transform .6s cubic-bezier(.2,.7,.3,1)}
  .reveal.in{opacity:1;transform:none}
  .hero-media img{animation:heroin 1.4s cubic-bezier(.2,.7,.3,1) both}
  @keyframes heroin{from{transform:scale(1.04);opacity:0}to{transform:none;opacity:1}}
  .hero h1{animation:rise .8s .2s cubic-bezier(.2,.7,.3,1) both}
  .lede > *{animation:rise .7s .35s cubic-bezier(.2,.7,.3,1) both}
  @keyframes rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
}
@media (max-width:900px){
  .lede{grid-template-columns:minmax(0,1fr);grid-template-areas:"dek" "side" "spec"}
  .lede-side{justify-self:start;align-items:flex-start}
  .lede .actions{justify-content:flex-start}
  .hero-media{height:min(78vh,900px)}
  .hero-media img{object-position:50% 22%}
  .boards{column-count:2}
  .ros article{grid-template-columns:120px minmax(0,1fr)}
  .ros .did{grid-column:2}
  .contact{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:640px){
  .sheets{grid-template-columns:minmax(0,1fr)}
  .boards{column-count:1}
  .ros article{grid-template-columns:minmax(0,1fr)}
  .ros .did{grid-column:auto}
  .contact{grid-template-columns:repeat(2,minmax(0,1fr))}
  .spec{grid-template-columns:repeat(3,minmax(0,1fr))}
  .spec div:nth-child(4){padding-left:0;border-left:0}
  .spec div:nth-child(n+4){border-top:1px solid var(--rule)}
  .bandhead{grid-template-columns:minmax(0,1fr)}
  footer.foot .wrap{grid-template-columns:minmax(0,1fr)}
}
@media (prefers-reduced-motion:no-preference){
  .btn{transition:transform .15s ease}
}

/* shared reset for every page */
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
:root{padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
body{margin:0}
img{max-width:100%}
nav.links a[aria-current="page"]{color:var(--ink);box-shadow:inset 0 -2px 0 var(--pencil)}
/* page header for inner pages */
.pagehead{padding-block:clamp(36px,6vw,72px) 8px}
.pagehead h1{margin:10px 0 0;font-family:var(--title);font-weight:400;font-size:clamp(3.4rem,10vw,7rem);line-height:.9;letter-spacing:-.03em}
.pagehead p{margin:18px 0 0;max-width:52ch;font-family:var(--read);font-size:var(--s1);color:var(--muted)}
.pagehead + section.band{padding-top:28px}
/* events: the studio photo is the set the page stands on */
.onset{position:relative;overflow:hidden;min-height:clamp(560px,82vh,820px);display:flex;align-items:flex-end;border-bottom:1px solid var(--ink)}
.onset-photo{position:absolute;top:0;right:0;height:100%;width:min(62vw,860px);object-fit:cover;object-position:50% 46%;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 38%),linear-gradient(0deg,transparent 0%,#000 22%);-webkit-mask-composite:source-in;
  mask-image:linear-gradient(90deg,transparent 0%,#000 38%),linear-gradient(0deg,transparent 0%,#000 22%);mask-composite:intersect}
.onset-copy{position:relative;z-index:1;width:100%;padding-block:clamp(40px,7vw,96px) clamp(28px,4vw,48px);display:flex;flex-direction:column;gap:18px}
.onset h1{margin:0;font-family:var(--title);font-weight:400;font-size:clamp(4rem,12vw,10.5rem);line-height:.84;letter-spacing:-.035em;max-width:9ch;padding-bottom:.14em}
.onset h1 em{font-style:italic;color:var(--pencil)}
.onset p{margin:0;max-width:38ch;font-family:var(--read);font-size:var(--s1);color:var(--muted)}
.onset-cap{display:flex;justify-content:space-between;gap:16px;font-size:var(--s-1);padding-top:14px;margin-top:6px;border-top:1px solid var(--rule)}
.onset-cap .mark{display:inline-block;width:8px;height:8px;background:var(--pencil);margin-right:10px;vertical-align:1px}
.onset + .wrap > section.band:first-child{padding-top:36px}
@media (max-width:760px){
  .onset{min-height:0;display:block}
  .onset-photo{position:relative;width:100%;height:auto;aspect-ratio:4/5;object-position:50% 38%;
    -webkit-mask-image:linear-gradient(0deg,transparent 0%,#000 34%);mask-image:linear-gradient(0deg,transparent 0%,#000 34%);-webkit-mask-composite:source-over;mask-composite:add}
  .onset-copy{margin-top:-10vw;padding-top:0}
}
/* home: discipline index */
.index{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border-top:1px solid var(--ink)}
.index a{display:flex;flex-direction:column;gap:10px;padding:18px 16px 26px 0;text-decoration:none;border-bottom:1px solid var(--rule);min-width:0;position:relative;transition:background .2s}
.index a i{font-family:var(--title);font-style:italic;font-size:var(--s3);color:var(--pencil);line-height:1}
.index a:hover{background:linear-gradient(180deg,var(--pencil-soft),transparent)}
.index a .go{transition:transform .2s}
.index a:hover .go{transform:translateX(4px)}
.index a+a{padding-left:16px;border-left:1px solid var(--rule)}
.index b{font-family:var(--title);font-weight:400;font-size:calc(var(--s3) * 1.15);line-height:1}
.index span.go{color:var(--pencil)}
.index a:hover b{color:var(--pencil)}
.more{font-family:var(--mono);font-size:var(--s-1);letter-spacing:.06em;text-transform:uppercase;color:var(--pencil);text-decoration:none;white-space:nowrap}
/* pager */
.pager{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;margin-top:clamp(56px,8vw,88px);border-top:1px solid var(--ink)}
.pager a{display:flex;flex-direction:column;gap:6px;padding:18px 0;text-decoration:none;min-width:0}
.pager a.next{text-align:right;align-items:flex-end}
.pager b{font-family:var(--title);font-weight:400;font-size:calc(var(--s3) * 1.15);line-height:1}
.pager a:hover b{color:var(--pencil)}
@media (max-width:900px){.index{grid-template-columns:repeat(2,minmax(0,1fr))}.index a:nth-child(3){padding-left:0;border-left:0}}
@media (max-width:640px){.index{grid-template-columns:minmax(0,1fr)}.index a+a{padding-left:0;border-left:0}}

/* awaiting line (restored) */
.gap{display:flex;gap:10px;align-items:center;flex-wrap:wrap;color:var(--muted);font-family:var(--read);font-style:italic}
.gap .tag{font-family:var(--mono);font-style:normal;font-size:var(--s-1);letter-spacing:.06em;text-transform:uppercase;background:var(--pencil-soft);color:var(--pencil);padding:3px 7px}

/* ---------- design page ---------- */
.stage{position:relative;overflow:hidden;isolation:isolate;border-bottom:1px solid var(--rule)}
.stage-amb{position:absolute;inset:-12%;z-index:-2}
.stage-amb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:blur(80px) saturate(1.5);transform:scale(1.2);opacity:0;transition:opacity 1.6s ease}
.stage-amb img.on{opacity:.4}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .stage-amb img.on{opacity:.55}}
:root[data-theme="dark"] .stage-amb img.on{opacity:.55}
.stage::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,var(--paper) 12%,color-mix(in srgb,var(--paper) 50%,transparent) 50%,color-mix(in srgb,var(--paper) 10%,transparent)),linear-gradient(to top,var(--paper) 2%,transparent 34%)}
.stage-in{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(24px,5vw,72px);align-items:center;padding-block:clamp(36px,6vw,72px) 24px}
.stage-copy h1{margin:10px 0 0;font-family:var(--title);font-weight:400;font-size:clamp(3.4rem,10vw,7rem);line-height:.9;letter-spacing:-.03em}
.stage-copy p{margin:18px 0 0;max-width:40ch;font-family:var(--read);font-size:var(--s1);color:var(--muted)}
.stage-ctl{display:flex;align-items:center;gap:4px;margin-top:36px}
.stage-ctl button{appearance:none;background:none;border:0;color:var(--ink);cursor:pointer;padding:8px;display:grid;place-items:center;transition:color .15s,transform .2s}
.stage-ctl button:hover{color:var(--pencil)}
#stPrev:hover{transform:translateX(-2px)} #stNext:hover{transform:translateX(2px)}
.stage-bar{flex:1;height:1px;margin:0 14px;background:var(--rule);position:relative;overflow:hidden}
.stage-bar i{position:absolute;inset:0;background:var(--pencil);transform:scaleX(0);transform-origin:left}
.stage-bar.run i{animation:stbar var(--dur,5s) linear forwards}
@keyframes stbar{to{transform:scaleX(1)}}
.stage-kind{font-size:var(--s-1);letter-spacing:.08em;text-transform:uppercase;min-width:9ch;text-align:right}
.stage-art{appearance:none;border:0;padding:0;background:none;position:relative;display:block;width:100%;height:min(66vh,600px);cursor:zoom-in}
.stage-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;transform:translateY(22px) scale(.96);filter:drop-shadow(0 34px 42px rgba(0,0,0,.35));transition:opacity .9s ease,transform 1.2s cubic-bezier(.2,.7,.3,1)}
.stage-art img.on{opacity:1;transform:none}
.stage-art img.off{opacity:0;transform:translateY(-16px) scale(1.02);transition-duration:.6s,.8s}
.strip{display:flex;gap:10px;overflow-x:auto;scrollbar-width:none;padding:8px 2px 30px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}
.strip::-webkit-scrollbar{display:none}
.strip button{flex:none;height:62px;padding:0;border:0;background:var(--sheet);cursor:pointer;opacity:.38;outline:1px solid transparent;outline-offset:4px;transition:opacity .3s,transform .35s cubic-bezier(.2,.7,.3,1),outline-color .3s}
.strip button img{display:block;width:100%;height:100%;object-fit:cover}
.strip button:hover{opacity:.8}
.strip button[aria-current="true"]{opacity:1;outline-color:var(--pencil);transform:translateY(-4px)}
.chips{display:flex;flex-wrap:wrap;gap:4px 18px}
.chips button{appearance:none;border:0;background:none;padding:4px 0;cursor:pointer;color:var(--muted);font-family:var(--mono);font-size:var(--s-1);letter-spacing:.08em;text-transform:uppercase;background-image:linear-gradient(var(--pencil),var(--pencil));background-repeat:no-repeat;background-position:0 100%;background-size:0 1px;transition:color .2s,background-size .35s cubic-bezier(.2,.7,.3,1)}
.chips button:hover{color:var(--ink)}
.chips button[aria-pressed="true"]{color:var(--ink);background-size:100% 1px}
.wall{column-count:3;column-gap:20px}
.tile{display:block;width:100%;margin:0 0 20px;padding:0;border:0;background:none;cursor:zoom-in;break-inside:avoid;will-change:transform;transition:transform .4s cubic-bezier(.2,.7,.3,1)}
.tile[hidden]{display:none}
.tile .frame{transition:box-shadow .4s}
.tile:hover .frame{box-shadow:0 26px 44px -24px rgba(0,0,0,.55)}
.tile img{transition:transform .8s cubic-bezier(.2,.7,.3,1)}
.tile:hover img{transform:scale(1.04)}
@media (prefers-reduced-motion:no-preference){
  .tile{opacity:0;translate:0 28px;transition:opacity .6s ease calc(var(--d,0)*70ms),translate .8s cubic-bezier(.2,.7,.3,1) calc(var(--d,0)*70ms),scale .25s ease,transform .4s cubic-bezier(.2,.7,.3,1)}
  .tile.in{opacity:1;translate:0 0}
  .tile.out{opacity:0;scale:.95;transition-delay:0s}
}
.lb{position:fixed;inset:0;z-index:80;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;background:rgba(10,11,14,.86);overflow:hidden;isolation:isolate;opacity:0;transition:opacity .25s}
.lb[hidden]{display:none}
.lb.on{opacity:1}
.lb-amb{position:absolute;inset:-12%;z-index:-1;background-size:cover;background-position:center;filter:blur(90px) saturate(1.5);opacity:.5;transition:background-image .6s}
.lb figure{margin:0;height:100vh;display:grid;place-items:center;padding:64px 0}
.lb img{max-width:100%;max-height:calc(100vh - 128px);object-fit:contain;box-shadow:0 40px 90px -30px rgba(0,0,0,.8);transition:opacity .25s,transform .4s cubic-bezier(.2,.7,.3,1)}
.lb img.swap{opacity:0;transform:scale(.97)}
.lb button{appearance:none;background:none;border:0;color:#ECEDE8;cursor:pointer;padding:clamp(10px,2vw,24px);display:grid;place-items:center;transition:color .15s,transform .2s}
.lb button:hover{color:#93A6FF}
.lb .lb-x{position:absolute;top:10px;right:10px;z-index:1}
@media (max-width:900px){
  .stage-in{grid-template-columns:minmax(0,1fr);gap:20px}
  .stage-art{height:min(58vh,520px)}
  .stage::before{background:linear-gradient(to bottom,var(--paper) 20%,color-mix(in srgb,var(--paper) 40%,transparent) 55%,var(--paper))}
  .wall{column-count:2}
}
@media (max-width:560px){.wall{column-count:1}.lb{grid-template-columns:minmax(0,1fr)}.lb .lb-nav{display:none}.lb figure{padding:56px 12px}}

/* ---------- writing page ---------- */
.wire{display:block;margin-top:clamp(28px,4vw,44px);padding-top:18px;border-top:1px solid var(--rule);color:var(--ink);text-decoration:none}
.wire-meta{display:flex;align-items:center;gap:10px;font-size:var(--s-1);letter-spacing:.08em;text-transform:uppercase;color:var(--pencil)}
.pulse{width:7px;height:7px;border-radius:50%;background:var(--pencil);box-shadow:0 0 0 0 var(--pencil);animation:pulse 2s ease-out infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--pencil) 60%,transparent)}100%{box-shadow:0 0 0 12px transparent}}
.wire-text{display:block;margin-top:12px;max-width:26ch;font-family:var(--title);font-size:clamp(2rem,4.6vw,3.6rem);line-height:1.04;letter-spacing:-.015em;text-wrap:balance}
.caret{display:inline-block;width:.06em;min-width:3px;height:.82em;margin-left:.06em;background:var(--pencil);vertical-align:-.04em;animation:blink 1s steps(1) infinite}
.wire.typing .caret{animation:none}
@keyframes blink{50%{opacity:0}}
.wire:hover .wire-text{color:var(--pencil)}
.log{list-style:none;margin:0;padding:0 0 0 clamp(28px,4vw,48px);position:relative}
.log-rail{position:absolute;left:6px;top:0;bottom:0;width:1px;background:var(--rule)}
.log-rail i{position:absolute;inset:0;background:var(--pencil);transform-origin:top;transform:scaleY(var(--p,0))}
.log-month{position:relative;padding:34px 0 12px;font-size:var(--s-1);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.log-rail + .log-month{padding-top:6px}
.log-month::before{content:"";position:absolute;left:calc(-1 * clamp(28px,4vw,48px) + 2px);bottom:15px;width:9px;height:9px;background:var(--paper);border:1px solid var(--muted);transform:rotate(45deg);transition:background .3s,border-color .3s}
.log-month.lit::before{background:var(--pencil);border-color:var(--pencil)}
.log-item{position:relative;border-bottom:1px solid var(--rule)}
.log-item::before{content:"";position:absolute;left:calc(-1 * clamp(28px,4vw,48px) + 3px);top:31px;width:7px;height:7px;border-radius:50%;background:var(--paper);border:1px solid var(--rule);transition:background .3s,border-color .3s,transform .3s}
.log-item.lit::before{background:var(--pencil);border-color:var(--pencil);transform:scale(1.15)}
.log-link{display:grid;grid-template-columns:7.5ch minmax(0,1fr) auto;gap:clamp(14px,3vw,40px);align-items:start;padding:22px 0;color:var(--ink);text-decoration:none}
.log-date{padding-top:4px;white-space:nowrap;font-size:var(--s-1);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.log-kind{display:block;margin-bottom:8px;font-size:var(--s-1);letter-spacing:.08em;text-transform:uppercase;color:var(--pencil)}
.log-head{font-family:var(--title);font-size:clamp(1.45rem,2.6vw,2.15rem);line-height:1.1;letter-spacing:-.01em;text-wrap:balance;background-image:linear-gradient(var(--pencil-soft),var(--pencil-soft));background-repeat:no-repeat;background-size:0 100%;transition:background-size .5s cubic-bezier(.2,.7,.3,1),color .2s;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.log-go{font-size:1.4rem;color:var(--muted);padding-top:2px;transition:transform .3s cubic-bezier(.2,.7,.3,1),color .2s}
a.log-link:hover .log-head{background-size:100% 100%}
a.log-link:hover .log-go{color:var(--pencil);transform:translate(4px,-4px)}
.log-item[hidden],.log-month[hidden]{display:none}
@media (prefers-reduced-motion:no-preference){
  .log-item .log-link{opacity:0;translate:0 22px;transition:opacity .6s ease calc(var(--d,0)*70ms),translate .8s cubic-bezier(.2,.7,.3,1) calc(var(--d,0)*70ms)}
  .log-item.in .log-link{opacity:1;translate:0 0}
  .log-item.out .log-link{opacity:0;translate:0 -8px;transition-delay:0s;transition-duration:.2s}
}
.log-cursor{position:fixed;left:0;top:0;z-index:70;pointer-events:none;padding:7px 11px;background:var(--pencil);color:var(--on-pencil);font-size:var(--s-1);letter-spacing:.08em;text-transform:uppercase;opacity:0;scale:.6;transition:opacity .2s,scale .25s cubic-bezier(.3,1.5,.5,1)}
.log-cursor.on{opacity:1;scale:1}
@media (hover:hover) and (prefers-reduced-motion:no-preference){a.log-link{cursor:none}}
@media (max-width:640px){.log-link{grid-template-columns:minmax(0,1fr) auto}.log-date{display:none}}