/* Small usability details in the existing paper palette. */
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible{outline:2px solid #324329;outline-offset:4px}
.skip:focus{z-index:1100;box-shadow:0 2px 8px #29342326}
.directory-email-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px}.directory-email-row>a{min-width:0}.directory-email-row .copy-mail{min-width:54px;min-height:44px;padding:8px 10px;border:1px solid var(--line);border-radius:2px;background:var(--surface);color:var(--ink);font:inherit;font-size:12px;cursor:pointer}.directory-email-row .copy-mail:hover{background:var(--wash)}
#main:focus{outline:none}
[data-panel] :is(h1,h2)[tabindex="-1"]:focus{outline:2px solid #63774c;outline-offset:5px}
@media(forced-colors:active){a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible{outline-color:Highlight}.paper-avatar,.paper-cover img{forced-color-adjust:none}}
/* The complete clickable project surface gets the same paper feedback. */
:is(.proj,.selected-item,.featured-card){cursor:pointer;transition:background-color .18s ease,box-shadow .18s ease;outline:none}
:is(.proj,.selected-item,.featured-card):focus-within{background-color:#f7f2e2;box-shadow:0 5px 14px -8px #62734b35}
@media(hover:hover) and (pointer:fine){:is(.proj,.selected-item,.featured-card):hover{background-color:#f7f2e2;box-shadow:0 5px 14px -8px #62734b35}:is(.proj,.selected-item,.featured-card):hover h3{text-decoration:underline;text-decoration-color:#a66f4b;text-decoration-thickness:1px;text-underline-offset:5px}}
:is(.proj,.selected-item,.featured-card):active{background-color:#ecebdc;box-shadow:0 2px 6px -4px #62734b25}
a[href],button:not(:disabled),summary,[role="button"]{cursor:pointer}button:disabled,[aria-disabled="true"]{cursor:not-allowed}
@media(prefers-reduced-motion:reduce){:is(.proj,.selected-item,.featured-card){transition:none}}

/* One scroll owner per reading dialog, at every viewport size. */
@media screen{
 .resume-modal[open]{display:flex;flex-direction:column;overflow:hidden}
 .resume-modal>.resume-toolbar{flex:none}
 .resume-modal>.resume-content,.resume-modal>.film-body{flex:1 1 auto;min-height:0;max-height:none;overflow-y:auto;overscroll-behavior:contain}
 .film-body .resume-content{max-height:none;overflow:visible}
}
/* Give the paper surface breathing room in every interaction state. */
.selected-item,.featured-card{padding:24px}
.proj--card{padding:22px}
.proj--row{padding:22px 20px}
@media(max-width:600px){.selected-item,.featured-card,.proj--card,.proj--row{padding:16px}}

/* Available status and readable, keyboard-accessible visitor activity. */
.availability-badge i{background:#168a36;box-shadow:0 0 0 3px #168a3618;width:7px;height:7px}
.traffic-trigger{border:0;border-bottom:1px dotted #536148;background:none;padding:4px 2px;text-align:left;min-height:36px;color:var(--ink)}
.traffic-trigger:hover{background:var(--surface)}
.traffic-dialog{width:min(480px,calc(100% - 32px));max-height:calc(100dvh - 40px);overflow:auto;padding:26px;background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:4px;box-shadow:0 12px 40px #20261d25}
.traffic-dialog::backdrop{background:#20261d66}.traffic-dialog header{display:flex;align-items:center;justify-content:space-between;gap:16px}.traffic-dialog h2{font:700 27px var(--serif)}.traffic-dialog header button{min-width:44px;min-height:44px;background:none;border:1px solid var(--line);font-size:25px}.traffic-dialog dl{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:24px 0}.traffic-dialog dl>div{padding:12px 0;border-top:1px solid var(--line)}.traffic-dialog dt{font-size:13px}.traffic-dialog dd{margin:5px 0 0;font:700 30px var(--serif)}.traffic-dialog p{font-size:13px;line-height:1.6;margin-top:12px}.traffic-feedback{font-weight:550}

/* Shared paper-dialog atmosphere and scroll lock across every modal. */
dialog::backdrop,.traffic-dialog::backdrop{background:#26321f66;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
body:has(dialog[open]){overflow:hidden}