/* Portfolio typography and reading controls with a clean, borderless media feed. */
html { -webkit-text-size-adjust:100%; }
button,a { -webkit-tap-highlight-color:transparent; touch-action:manipulation; }
[hidden] { display:none !important; }
body.explorations-view main.explorations-page { width:min(calc(100% - max(20px,env(safe-area-inset-left)) - max(20px,env(safe-area-inset-right))),620px); margin:18px auto 0; padding:0 0 max(40px,env(safe-area-inset-bottom)); }
.explorations-header { margin:0 0 26px; }
.explorations-identity { display:flex; align-items:center; gap:13px; }
.explorations-avatar { display:block; flex:none; width:44px; height:44px; border-radius:50%; object-fit:cover; border:1px solid var(--line); }
.explorations-author { display:block; color:var(--muted); font-size:12px; line-height:1.4; margin-bottom:3px; }
.explorations-header h1 { margin:0; font-size:28px; line-height:1.2; letter-spacing:-.035em; font-weight:500; }
.explorations-header p { margin:14px 0 0; color:var(--muted); font-size:14px; line-height:1.6; }
.explorations-feed { display:grid; gap:24px; }
.exploration { min-width:0; }
.preview-open { display:block; width:100%; margin:0; padding:0; border:0; border-radius:4px; background:#e4e4e4; overflow:hidden; box-shadow:none; cursor:zoom-in; }
.card-media { display:block; width:100%; height:auto; }
.motion-stage { position:relative; aspect-ratio:3/4; border:0; border-radius:4px; background:#e4e4e4; overflow:hidden; box-shadow:none; }
.motion-stage .preview-open,.motion-stage video { width:100%; height:100%; }
.motion-stage .preview-open { border:0; border-radius:0; box-shadow:none; }
.motion-stage video { object-fit:contain; }
.motion-toggle { position:absolute; bottom:8px; right:8px; display:grid; place-items:center; width:44px; height:44px; margin:0; padding:0; border:0; border-radius:50%; color:#343434; background:#f8f8f880; backdrop-filter:blur(12px); cursor:pointer; opacity:0; transition:opacity 180ms ease; }
.motion-stage:focus-within .motion-toggle,.motion-stage:hover .motion-toggle,.motion-toggle[data-playing="false"] { opacity:1; }
.motion-toggle svg { width:14px; height:14px; }
.motion-toggle .motion-pause,.motion-toggle[data-playing="true"] .motion-play { display:none; }
.motion-toggle[data-playing="true"] .motion-pause { display:block; }
.explorations-footer { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-top:42px; padding-top:18px; border-top:1px solid var(--line); color:var(--muted); font-size:13px; }
.explorations-footer a { display:inline-flex; align-items:center; min-height:44px; text-decoration:none; }
html:has(dialog[open]) { overflow:hidden; }
#media-viewer { position:fixed; inset:0; width:fit-content; max-height:calc(100svh - 32px); margin:auto; padding:0; border:1px solid #8883; border-radius:20px; color:var(--ink); background:var(--paper); overflow:auto; }
#media-viewer[open] { display:flex; flex-direction:column; opacity:1; transform:none; transition:none; }
#media-viewer::backdrop { background:#0007; backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); }
.viewer-stage { position:relative; flex:none; width:100%; height:auto; aspect-ratio:var(--viewer-ratio,4/3); max-height:calc(100svh - 32px); background:#e4e4e4; }
.viewer-stage [hidden] { display:none; }
.viewer-stage img,.viewer-stage video { position:absolute; inset:0; display:block; width:100%; height:100%; max-height:100%; object-fit:contain; }
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { animation:none !important; transition:none !important; } }

.explorations-home { display:block; flex:none; border-radius:50%; }
.explorations-home:focus-visible { outline:2px solid var(--ink); outline-offset:4px; }