html { scroll-behavior: smooth; scrollbar-gutter: stable; }
body { margin: 0; background: #e9ebe3; }
html.dialog-open { overflow: hidden; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
#dilans-harbor-resume :focus-visible { outline: 2px solid var(--ir-blue); outline-offset: 5px; }
#dilans-harbor-resume main:focus { outline: none; }
#dilans-harbor-resume section[id] { scroll-margin-top: 24px; }
#dilans-harbor-resume .skip-link { position: fixed; z-index: 100; left: 20px; top: -100px; background: var(--ir-paper); border: 1px solid var(--ir-blue); padding: 10px 16px; }
#dilans-harbor-resume .skip-link:focus { top: 12px; }
#dilans-harbor-resume nav [aria-current] { text-decoration: underline; text-underline-offset: 5px; color: var(--ir-blue); }
#dilans-harbor-resume a.ir-project-trigger:hover { text-decoration: none; }
#dilans-harbor-resume .ir-project-trigger:focus-visible { outline-offset: -5px; }
#dilans-harbor-resume .ir-current-line a { color: var(--ir-blue); text-decoration: underline; }
#dilans-harbor-resume .ir-role-static > span { display: block; }
#dilans-harbor-resume .role-hide { display: none; }
#dilans-harbor-resume details[open] .role-read { display: none; }
#dilans-harbor-resume details[open] .role-hide { display: inline; }
#dilans-harbor-resume .ir-project-modal { position: fixed; inset: 0; margin: auto; transform: none; max-height: calc(100dvh - 48px); max-width: 820px; width: calc(100% - 48px); overflow: auto; overscroll-behavior: contain; animation: none; color: var(--ir-ink); }
#dilans-harbor-resume .ir-project-modal[open] { animation: dialog-arrive .2s ease-out; }
#dilans-harbor-resume .ir-project-modal::backdrop { background: #23322480; backdrop-filter: blur(3px); }
#dilans-harbor-resume .ir-modal-toolbar { position: sticky; top: 0; z-index: 2; background: var(--ir-paper); }
#dilans-harbor-resume .ir-modal-close { min-height: 44px; }
#dilans-harbor-resume .ir-modal-heading { grid-template-columns: minmax(0, 1fr); }
#dilans-harbor-resume .ir-project-overview-text { grid-template-columns: minmax(0, 1fr); }
#dilans-harbor-resume .ir-note-stack { flex-shrink: 0; }
#dilans-harbor-resume .ir-preview-controls button:disabled { opacity: .4; cursor: default; }
#dilans-harbor-resume .screenshot-preview { padding: 12px; }
#dilans-harbor-resume .screenshot-preview { min-height: 0; }
#dilans-harbor-resume .screenshot-preview a { display: block; }
#dilans-harbor-resume .screenshot-preview img { display: block; width: 100%; height: auto; object-fit: contain; }
#dilans-harbor-resume .screenshot-fullsize { display: inline-block; margin-top: 12px; padding: 5px 0; color: var(--ir-blue); font: 12px/1.5 Arial, sans-serif; text-decoration: underline; }
#dilans-harbor-resume .archive-intro { padding: 32px 0 30px; }
#dilans-harbor-resume .back-link { display: inline-block; color: var(--ir-blue); font-size: 12px; padding: 8px 0; margin-bottom: 28px; }
#dilans-harbor-resume .archive-intro h1 { font-size: clamp(44px, 8vw, 78px); letter-spacing: -3px; line-height: 1.1; margin: 13px 0 18px; white-space: normal; }
#dilans-harbor-resume .archive-intro p { font-size: 14px; color: var(--ir-muted); }
#dilans-harbor-resume .archive-tools { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 14px; padding: 18px 0; border-block: 1px solid var(--ir-line); }
#dilans-harbor-resume .project-filters { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
#dilans-harbor-resume .project-filters button, #dilans-harbor-resume .archive-empty button { border: 1px solid var(--ir-line); padding: 8px 11px; background: transparent; font: 12px/1.5 Arial, sans-serif; color: var(--ir-blue); cursor: pointer; border-radius: 0; }
#dilans-harbor-resume .project-filters button[aria-pressed=true] { background: var(--ir-blue); border-color: var(--ir-blue); color: var(--ir-paper); }
#dilans-harbor-resume .project-filters button:hover { border-color: var(--ir-blue); }
#dilans-harbor-resume .project-search { flex: 1; max-width: 230px; min-width: 170px; }
#dilans-harbor-resume .project-search input { padding: 8px 10px; border: 1px solid var(--ir-line); width: 100%; color: var(--ir-ink); background: var(--ir-paper); font: 13px/1.5 Arial, sans-serif; border-radius: 0; }
#dilans-harbor-resume .project-search input::placeholder { color: var(--ir-muted); }
#dilans-harbor-resume .archive-count { font: 11px/1.6 'Courier New', monospace; color: var(--ir-muted); padding: 17px 0; }
#dilans-harbor-resume .archive-thumbnail { display: block; border: 1px solid var(--ir-line); padding: 5px; background: var(--ir-paper); transform: rotate(2deg); transition: transform .2s ease; }
#dilans-harbor-resume .archive-thumbnail img { width: 100%; height: 112px; display: block; object-fit: cover; object-position: top; filter: saturate(.6); }
#dilans-harbor-resume .ir-project-trigger:hover .archive-thumbnail { transform: rotate(0); }
#dilans-harbor-resume .archive-empty { padding: 50px 20px; text-align: center; border: 1px solid var(--ir-line); }
#dilans-harbor-resume .archive-empty button { margin-top: 20px; }
#dilans-harbor-resume .archive-end { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin: 36px 0; }
#dilans-harbor-resume .archive-end p { font: 24px/1.4 Georgia, serif; }
#dilans-harbor-resume .archive-end a { color: var(--ir-blue); text-decoration: underline; font-size: 13px; }
#dilans-harbor-resume .project-page { padding: 32px 0 40px; }
#dilans-harbor-resume .project-page .back-link { display: block; }
#dilans-harbor-resume .project-page h1 { font-size: clamp(38px, 7vw, 68px); white-space: normal; letter-spacing: -2px; }
#dilans-harbor-resume .project-page-description { font: italic 20px/1.5 Georgia, serif; }
#dilans-harbor-resume .project-facts { display: flex; flex-wrap: wrap; gap: 12px 32px; margin: 20px 0 0; }
#dilans-harbor-resume .project-facts > div { min-width: 0; max-width: 100%; }
#dilans-harbor-resume .project-facts dt { margin-bottom: 4px; font: 11px/1.5 'Courier New', monospace; color: var(--ir-muted); }
#dilans-harbor-resume .project-facts dd { margin: 0; font: 14px/1.6 Arial, sans-serif; overflow-wrap: anywhere; }
#dilans-harbor-resume .project-page .ir-modal-links { margin: 16px 0 28px; }
#dilans-harbor-resume .project-page section { margin-top: 30px; }
#dilans-harbor-resume .project-page-image { margin: 36px 0 0; }
#dilans-harbor-resume .project-page-image img { display: block; max-width: 100%; height: auto; border: 1px solid var(--ir-line); }
#dilans-harbor-resume .project-page-image figcaption { margin-top: 12px; font: 12px/1.5 Georgia, serif; color: var(--ir-muted); }
#dilans-harbor-resume .project-page-image figcaption h3 { font: 24px/1.3 Georgia, serif; letter-spacing: -.5px; }
#dilans-harbor-resume .project-page-image figcaption p { margin-top: 8px; font: 13px/1.6 Arial, sans-serif; color: var(--ir-muted); }
#dilans-harbor-resume .not-found { min-height: 60vh; padding-top: 70px; }
#dilans-harbor-resume .not-found .back-link { margin-top: 22px; }
@keyframes dialog-arrive { from { opacity: 0; translate: 0 8px; } to { opacity: 1; translate: 0 0; } }
@media (max-width: 640px) {
  #dilans-harbor-resume .archive-tools { flex-direction: column; }
  #dilans-harbor-resume .project-search { max-width: none; }
  #dilans-harbor-resume .project-search input { font-size: 16px; }
  #dilans-harbor-resume .archive-thumbnail img { height: 90px; }
  #dilans-harbor-resume .ir-project-modal { width: calc(100% - 24px); max-height: calc(100dvh - 24px); }
}
@media (max-width: 440px) {
  #dilans-harbor-resume .ir-drawn-connector { justify-self: center; width: 18px; transform-origin: center; }
  #dilans-harbor-resume .archive-list .ir-project-overview { grid-template-columns: minmax(0, 1fr); }
  #dilans-harbor-resume .archive-list .archive-thumbnail { display: none; }
  #dilans-harbor-resume .archive-list .ir-project-mark { display: none; }
  #dilans-harbor-resume .archive-intro h1 { letter-spacing: -2px; }
  #dilans-harbor-resume .project-filters button { padding: 8px 9px; }
  #dilans-harbor-resume .ir-project-modal { width: calc(100% - 16px); max-height: calc(100dvh - 16px); }
  #dilans-harbor-resume .archive-end p { font-size: 21px; }
}
@media (pointer: coarse) {
  #dilans-harbor-resume .project-filters button, #dilans-harbor-resume .back-link { min-height: 44px; }
}