:root{color-scheme:dark;--background:#221e26;--panel:#2d2732;--line:rgba(255,255,255,.12);--muted:#aba4b0;--text:#f4f0f2;--accent:#a31c37;--reading-progress:0%;font-family:Arial,Helvetica,sans-serif;font-synthesis:none}
*{box-sizing:border-box}
html{scroll-padding-top:92px}
body{margin:0;background:var(--background);color:var(--text);overflow-wrap:break-word}
a{color:inherit}
button,a{-webkit-tap-highlight-color:transparent}
button{font:inherit;color:inherit;cursor:pointer}
button,a{outline-offset:4px}
:focus-visible{outline:2px solid #f2b5c2}
[hidden]{display:none!important}
.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:fixed;left:16px;top:-80px;background:#fff;color:#241f29;padding:12px 20px;z-index:100}
.skip-link:focus{top:12px}
.topbar{position:sticky;top:0;z-index:5;min-height:76px;display:flex;align-items:center;gap:24px;padding:0 30px;border-bottom:1px solid var(--line);background:var(--panel)}
.brand{display:flex;align-items:center;text-decoration:none;flex:none}
.brand img{display:block;width:148px;height:auto}
.document-name{font-size:13px;color:var(--text);margin-right:auto;white-space:nowrap}
.reading-hint{display:flex;gap:10px;align-items:center;font-size:12px;color:#c9bfce;white-space:nowrap}
.reading-hint span{font-size:18px;color:#e0c1cc}
.share-button{appearance:none;display:inline-flex;justify-content:center;align-items:center;min-height:44px;width:44px;flex:none;border:1px solid transparent;border-radius:7px;background:transparent}
.share-button:hover{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.08)}
.share-button svg{width:19px;height:19px;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round;fill:none}
.reading-progress{position:absolute;left:0;bottom:-1px;width:var(--reading-progress);height:2px;background:#cc3656;pointer-events:none}
.portfolio-stack{display:grid;gap:16px;width:min(1640px,100%);padding:20px;margin:0 auto;outline:none}
.portfolio-page{margin:0;min-width:0;background:var(--panel);scroll-margin-top:0}
.portfolio-page img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:contain}
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);margin:0;max-width:calc(100% - 40px);padding:13px 18px;border-radius:7px;border:1px solid #766078;background:#39303e;color:#fff;box-shadow:0 10px 35px #0006;font-size:13px;z-index:10;text-align:center}
@media(min-width:1500px){.topbar{padding-left:44px;padding-right:44px}}
@media(max-width:700px){html{scroll-padding-top:70px}.topbar{min-height:64px;padding:0 13px;gap:12px}.brand img{width:116px}.document-name{font-size:12px}.reading-hint{display:none}.share-button{width:40px;min-height:40px}.portfolio-stack{padding:0;gap:8px}.toast{bottom:16px}}
@media(max-width:350px){.document-name{font-size:11px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}}