.library-page{background:transparent;padding-top:clamp(3rem,7svh,5rem)}.library-shell{max-width:none;margin:0}.library-hero-title{margin-top:0;font-size:clamp(2.1rem,4vw,3.75rem);color:var(--theme-text)}.lib-tabs{gap:.8rem}.lib-tab{border-radius:.5rem;color:var(--theme-muted);border-color:var(--line);transition:transform .25s}.lib-tab:hover{transform:translateY(-3px)}.lib-tab.active{box-shadow:0 8px 20px #0003;background:var(--theme-text);color:var(--site-base);border-color:var(--theme-text)}.lib-tab:focus-visible,.calendar-days button:focus-visible,.calendar-nav button:focus-visible,.book-call:focus-visible{outline:2px solid var(--theme-text);outline-offset:4px}.project{border-radius:.75rem;background:linear-gradient(145deg,#202521d9,#101310d9);box-shadow:0 12px 30px #0004}.project h3{color:var(--theme-text)}.project-grid{border:0;gap:1rem}.wire{color:var(--theme-muted)}.project p,.project small,.tag{color:var(--theme-muted)}.project:hover{transform:translateY(-4px);background:#e9ede5}.project:hover :is(h3,p,small,.tag){color:#263127}.row{grid-template-columns:8rem minmax(0,1fr) 3.5rem;padding:1.3rem .5rem;color:var(--theme-muted)}.row strong{color:var(--theme-text);font-weight:400}.row .arrow{font-size:.85rem}.row:hover{background:#9aaf981a}.row:hover strong{color:var(--theme-text)}.writing-profile{display:inline-block;margin-top:1.5rem;color:var(--theme-text);text-underline-offset:.25rem}
html[data-theme=light] .project{background:linear-gradient(145deg,#fffffff2,#eeefe8f5);box-shadow:inset 0 1px 0 #fff,0 18px 40px #25392718}html[data-theme=light] .project h3{color:#263127}html[data-theme=light] .lib-tab{border-color:#bbc7ba}html[data-theme=light] .portfolio-dialog{background:#f8f9f3}html[data-theme=light] .row{border-color:#bcc8bc}
@media(max-width:600px){.row{grid-template-columns:4.5rem minmax(0,1fr) 2.5rem;gap:.7rem}.row time{font-size:.65rem;letter-spacing:0}.row strong{font-size:.95rem}.project-grid{grid-template-columns:1fr}.lib-tab{padding:1rem .5rem}}
@media(prefers-reduced-motion:reduce){.lib-tab,.project,.book-call::before{transition:none}.lib-tab:hover,.project:hover{transform:none}}

.library-quote{width:100%;max-width:65rem;margin:0 auto clamp(2rem,5svh,4rem);text-align:center}
.library-quote .library-hero-title{margin:0;font-family:Georgia,"Times New Roman",serif;font-size:clamp(1.4rem,3vw,3.1rem);line-height:1.3;font-weight:300;letter-spacing:.045em;text-wrap:balance;color:var(--theme-text)}
.library-quote>p{margin:clamp(.65rem,1.8svh,1.2rem) 0 0;font:normal .7rem/1.5 Georgia,serif;text-transform:uppercase;letter-spacing:.25em;color:var(--theme-muted)}
.writing-update{font-size:.8rem;color:var(--theme-muted);line-height:1.5}
@media(min-width:701px) and (max-width:1100px){.library-quote .library-hero-title{font-size:clamp(1.6rem,3vw,2.5rem)}}
@media(max-width:700px){.library-quote .library-hero-title{font-size:clamp(1.3rem,5.7vw,1.9rem);line-height:1.35;letter-spacing:.035em}.lib-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}.lib-tab{min-width:0;font-size:.65rem;letter-spacing:.08em}}
@media(max-height:650px){.library-quote .library-hero-title{font-size:clamp(1.2rem,2.6vw,2rem)}}
@media(prefers-reduced-motion:reduce){.portfolio-dialog[open]{animation:none}.access-portrait{transform:none}}


/* A raised, square window inspired by the supplied access-denied reference. */
.portfolio-dialog.retro-access{box-sizing:border-box;width:min(90vw,34rem);max-width:calc(100vw - 2rem);max-height:calc(100svh - 2rem);padding:0;border:2px solid var(--theme-text);border-radius:0;background:var(--site-base);color:var(--theme-text);overflow:auto;box-shadow:0 0 0 4px var(--site-base),0 0 0 6px var(--theme-muted),7px 9px 0 var(--theme-muted),0 28px 70px #0006}
.portfolio-dialog::backdrop{background:#0008;backdrop-filter:blur(8px)}
.access-window-bar{height:clamp(2rem,4svh,2.6rem);display:flex;align-items:center;justify-content:flex-end;padding:.2rem .35rem;border-bottom:2px solid var(--theme-text);background:color-mix(in srgb,var(--theme-text) 7%,var(--site-base))}
.portfolio-dialog.retro-access .access-close{position:static;display:grid;place-items:center;width:1.5rem;height:1.5rem;padding:0;background:var(--theme-text);color:var(--site-base);border:1px solid var(--theme-muted);border-radius:0;font:1.3rem/1 Georgia,serif;cursor:pointer}
.access-window-content{padding:clamp(1.5rem,4vw,3rem) clamp(1rem,3vw,2.5rem);text-align:center}
.portfolio-dialog.retro-access h3{margin:0 auto 1.3rem;max-width:7em;font-family:Georgia,"Times New Roman",serif;font-size:clamp(2rem,6vw,3.3rem);line-height:1.05;font-weight:400;letter-spacing:.07em;color:var(--theme-text);text-wrap:balance}
.portfolio-dialog.retro-access p{margin:0 auto;max-width:27rem;font-family:Georgia,"Times New Roman",serif;font-size:clamp(.95rem,2vw,1.1rem);font-weight:400;line-height:1.7;color:var(--theme-muted);text-wrap:balance}
.portfolio-dialog.retro-access[open]{animation:access-window-enter .3s cubic-bezier(.16,1,.3,1)}
.portfolio-dialog .access-close:focus-visible{outline:2px solid var(--theme-text);outline-offset:4px}
@keyframes access-window-enter{from{opacity:0;transform:perspective(900px) translateY(12px) rotateX(5deg) scale(.97)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.portfolio-dialog.retro-access[open]{animation:none}}

/* Comic-inspired lettering, scoped exclusively to the access heading. */
.portfolio-dialog.retro-access h3.comic-access{font-family:Impact,"Arial Black","Helvetica Neue",sans-serif;font-size:clamp(2.7rem,9vw,5rem);font-weight:900;font-style:italic;line-height:.98;letter-spacing:.035em;max-width:100%;margin:0 auto clamp(1.4rem,3vw,2rem);color:var(--theme-text);-webkit-text-stroke:1px var(--site-base);paint-order:stroke fill;text-shadow:2px 2px 0 var(--site-base),3px 3px 0 var(--theme-muted),4px 4px 0 var(--theme-muted),5px 5px 0 var(--theme-muted),6px 7px 0 var(--theme-muted);transform:rotate(-3deg);overflow-wrap:normal}
.comic-access span{display:block}
.comic-access span+span{margin-top:.13em}
@media(max-width:420px){.portfolio-dialog.retro-access h3.comic-access{text-shadow:1px 1px 0 var(--site-base),2px 2px 0 var(--theme-muted),3px 3px 0 var(--theme-muted),4px 5px 0 var(--theme-muted)}}