/* rmnlsk V2: original independent implementation; no Tumblr theme source reused. */
:root{color-scheme:dark;--black:#050505;--white:#fafafa;--bar:rgba(0,0,0,.67)}
*{box-sizing:border-box}
html{background:var(--black)}
body{margin:0;background:var(--black);color:var(--white);font-family:Helvetica,Arial,sans-serif;overflow-x:clip;-webkit-font-smoothing:antialiased}
a{color:inherit}button{font:inherit}a:focus-visible,button:focus-visible{outline:2px solid white;outline-offset:3px}
.site-title{position:absolute;z-index:60;top:0;left:0;width:100%;pointer-events:none;text-align:center;padding:30px 68px 10px}
.site-title h1{font-size:clamp(26px,4.3vw,58px);line-height:1.08;margin:0;font-weight:700;letter-spacing:-.04em}
.site-title a{pointer-events:auto;text-decoration:none;color:white;text-shadow:0 2px 10px #0008}
.menu-toggle{position:fixed;z-index:200;top:calc(12px + env(safe-area-inset-top,0px));left:calc(12px + env(safe-area-inset-left,0px));height:42px;width:42px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;background:var(--bar);border:0;color:white;cursor:pointer}
.menu-toggle span{width:20px;height:2px;background:white;display:block}
.drawer{position:fixed;inset:0 auto 0 0;z-index:190;width:min(330px,82vw);padding:calc(96px + env(safe-area-inset-top,0px)) 24px 30px;background:#090909;border-right:1px solid #333;transform:translate3d(-105%,0,0);transition:transform .22s ease;overflow-y:auto}
.drawer strong{display:block;text-align:center;letter-spacing:.11em;font-size:14px;margin-bottom:30px}
.drawer a{display:block;text-decoration:none;padding:18px 0;border-bottom:1px solid #303030;text-align:center;font-size:15px}
.drawer a:hover{text-decoration:underline}
.close-menu{display:block;background:none;border:1px solid #555;color:white;padding:10px 14px;margin:35px auto;cursor:pointer}
body.menu-open .drawer{transform:translate3d(0,0,0)}
.veil{position:fixed;inset:0;z-index:170;background:#0009}
body.menu-open .veil{display:block!important}
/* STICKY STACK: each succeeding screen covers the previous image from bottom to top.
   Unlike background-attachment:fixed, position:sticky works in iOS Safari and Android Chrome.
   Keep gallery ancestors free of overflow:auto/hidden and transforms. */
.gallery{position:relative;isolation:isolate}
.panel{position:-webkit-sticky;position:sticky;top:0;height:100vh;height:100svh;min-height:360px;background:#050505;overflow:hidden;contain:layout paint}
.panel-image{
 position:absolute;inset:0;display:block;width:100%;height:100%;
 /* Fixed, centered natural-aspect tile: width = viewport height × image aspect ratio.
    Shrinking browser width reveals less of the left/right repeated copies,
    without changing the scale or center position of the original. */
 background-color:#050505;
 background-position:center center;
 background-size:auto 100%;
 background-repeat:repeat-x;
 user-select:none;
}

/* On desktop and in phone landscape, the native-size image is hidden:
   the repeat-x background above retains the V2.1 visual wipe. */
.panel-portrait-image{display:none}
/* Every artwork is a large click/tap target for instant progression.
   This does not intercept touch pan gestures, so the original scrolling
   (sticky wipe on wide screens, natural stacking on narrow portrait) remains. */
.panel-advance{position:absolute;inset:0;z-index:2;display:block;width:100%;height:100%;border:0;padding:0;margin:0;background:transparent;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:pan-y pinch-zoom}
.panel-advance:focus-visible{outline:3px solid white;outline-offset:-5px}
.panel-caption{position:absolute;z-index:4;bottom:calc(14px + env(safe-area-inset-bottom,0px));left:50%;transform:translateX(-50%);max-width:min(82vw,810px);max-height:26vh;overflow-y:auto;padding:7px 13px;background:rgba(0,0,0,.67);font-weight:600;font-size:clamp(12px,1.2vw,15px);line-height:1.5;text-align:center;pointer-events:none;overflow-wrap:anywhere}
.more{position:absolute;z-index:5;bottom:calc(12px + env(safe-area-inset-bottom,0px));left:calc(12px + env(safe-area-inset-left,0px));width:42px;height:42px;background:rgba(0,0,0,.73);display:grid;place-items:center;text-decoration:none;font-size:27px;line-height:1}
.counter{position:absolute;z-index:3;top:calc(15px + env(safe-area-inset-top,0px));right:calc(15px + env(safe-area-inset-right,0px));font-size:12px;background:rgba(0,0,0,.6);padding:6px 10px;letter-spacing:.05em}
/* Prevent browser-native scrolling from locking on iPhone and Android. */
.panel,.panel-image{touch-action:pan-y pinch-zoom}
.page-nav{position:relative;z-index:10;display:flex;background:#111}
.page-nav>a,.page-nav>span{flex:1;min-height:96px;display:grid;place-items:center;text-decoration:none;font-size:clamp(36px,8vw,70px)}
.page-nav>a:hover{background:#222}.page-nav>span{color:#444}
footer{position:relative;z-index:10;padding:25px 14px;background:black;color:#888;text-align:center;font-size:12px;letter-spacing:.03em}
.single .panel-caption{bottom:16px}
.post-text{position:relative;z-index:10;background:#111;max-width:none;padding:50px max(24px,calc((100vw - 780px)/2));font-size:16px;line-height:1.65;overflow-wrap:anywhere}
.post-text h2{font-size:clamp(22px,4vw,35px);margin:0 0 20px;line-height:1.2}
.post-text .caption-detail p{margin:.25em 0 1em}
.post-text a{color:white}.post-text .muted{color:#aaa;font-size:13px;margin-top:25px}
.slide-detail{margin:20px 0;border-left:2px solid #666;padding:8px 16px}
.archive{position:relative;z-index:2;padding:100px 20px 75px;max-width:1150px;margin:auto}
.archive h2{text-align:center;font-size:32px}.archive>p{text-align:center;color:#888;margin-bottom:35px}
.archive-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:24px}
.archive-card{text-decoration:none;font-size:13px;line-height:1.4}
.archive-card img{display:block;width:100%;height:170px;object-fit:contain;background:#111;margin-bottom:10px}
.archive-card strong{font-weight:600;display:block}.archive-card small{display:block;margin-top:6px;color:#aaa}
@media (max-width:800px){
 .site-title{padding:calc(17px + env(safe-area-inset-top,0px)) 58px 10px}
 .site-title h1{font-size:clamp(23px,6vw,33px)}
 .panel-caption{bottom:calc(14px + env(safe-area-inset-bottom,0px));font-size:12px;max-width:calc(100vw - 108px);max-height:22vh;padding:6px 8px}
 .counter{font-size:11px;top:calc(16px + env(safe-area-inset-top,0px))}
 .more{height:40px;width:40px}
 .archive{padding-top:80px}.archive-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
 .archive-card img{height:145px}
 .page-nav>a,.page-nav>span{min-height:72px}
}
@media(max-width:390px){.panel-caption{max-width:calc(100vw - 92px);font-size:11px}.site-title h1{font-size:24px}}
/* Phone portrait deliberately shows entire artworks without cropping.
   Image heights follow natural aspect ratios. The next artwork begins
   immediately below; sticky wipes are kept for wider/landscape layouts. */
@media screen and (max-width:600px) and (orientation:portrait){
 .site-title{position:relative;z-index:60;padding:calc(24px + env(safe-area-inset-top,0px)) 58px 20px}
 .site-title h1{font-size:clamp(22px,6vw,30px)}
 .gallery{display:block}
 .panel{position:relative;top:auto;height:auto;min-height:0;overflow:visible;contain:none}
 .panel-image{position:relative;inset:auto;width:100%;height:auto;background-image:none!important;background-repeat:no-repeat}
 .panel-portrait-image{display:block;width:100%;max-width:100%;height:auto;object-fit:contain}
 .panel-caption,.single .panel-caption{
  position:relative;left:auto;bottom:auto;transform:none;max-width:none;
  max-height:none;width:100%;overflow:visible;display:block;
  margin:0;padding:10px 54px 12px;background:#111;
  font-size:12px;line-height:1.45;text-align:center;
 }
 .more{top:8px;bottom:auto;left:8px;width:36px;height:36px}
 .counter{top:8px;right:8px}
}
@media(prefers-reduced-motion:reduce){.drawer{transition:none}}