/* Open editorial layout: one page scroll, no nested book or card frames. */
.header nav{gap:30px;margin-left:85px}
body.blog-open{overflow:hidden}
.blog-open .viewport{min-width:0;min-height:0}
.blog-open .canvas{inset:0;width:100vw;height:100dvh;transform:none!important;mask:none!important}
.blog-open .canvas>:not(.header):not(.blog-room){visibility:hidden!important;pointer-events:none!important}
.blog-open .header{z-index:30!important;visibility:visible!important;opacity:1!important;pointer-events:auto!important;left:calc(50% - 733px * var(--scale,1));right:auto;top:calc(50% - 496px * var(--scale,1));width:1467px;transform:scale(var(--scale,1));transform-origin:top left}
.blog-room{position:absolute;inset:0;z-index:21;overflow:auto;overscroll-behavior:contain;background:#0b0911;color:#eee6ee;scrollbar-color:#79526b #0b0911}
.blog-room .journal-shell{max-width:1500px;margin:auto;padding:145px clamp(24px,5vw,88px) 90px}
.blog-room .journal-top{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:64px}
.journal-top small{font-size:11px;letter-spacing:2px;color:#d899c5}
.blog-room .journal-top h1{font-size:clamp(38px,5.5vw,78px);line-height:1.05;font-weight:500;letter-spacing:-.045em;margin:20px 0 0}
.journal-top h1 span{display:block;margin:18px 0 0;font:400 16px/1.6 Arial,sans-serif;letter-spacing:0;color:#a89dac;transform:none}
.blog-room .journal-demo{border:0;background:none;padding:0;color:#a89dac;font-size:10px;letter-spacing:1.3px;white-space:nowrap}
.blog-room .journal-book{display:grid;grid-template-columns:minmax(200px,260px) minmax(0,1fr);gap:clamp(36px,6vw,100px);height:auto;min-height:0;overflow:visible;border:0;border-radius:0;background:none;box-shadow:none;align-items:start}
.blog-room .journal-index{padding:0;background:none;border:0;overflow:visible}
.journal-label{font-size:10px;letter-spacing:1.3px;color:#938799}
.blog-room .journal-tabs{display:flex;flex-wrap:wrap;gap:4px 18px;margin:14px 0 30px}
.blog-room .journal-tabs button{padding:8px 0;min-height:44px;border:0;border-radius:0;background:none;color:#a89dac;font-size:13px}
.blog-room .journal-tabs button[aria-pressed=true]{color:#ffb6e3;text-decoration:underline;text-underline-offset:8px}
.blog-room .journal-list{display:grid;gap:26px;overflow:visible}
.blog-room .journal-card{display:block;width:100%;min-width:0;padding:0;text-align:left;border:0;background:none;opacity:.65;transition:opacity .2s}
.blog-room .journal-card:hover,.blog-room .journal-card[aria-current=true]{opacity:1;background:none;border:0}
.journal-card small{display:block;color:#ce92b9;font-size:10px;letter-spacing:.6px}
.journal-card strong{display:block;font-size:19px;font-weight:500;line-height:1.4;margin:9px 0;color:#eee6ee}
.journal-card>span{font-size:12px;color:#a89dac}
.journal-scribble,.journal-index-note{display:none}
.blog-room .journal-entry{min-width:0;padding:0;overflow:visible;background:none;scroll-margin-top:110px}
.blog-room .journal-meta{display:flex;justify-content:space-between;gap:16px;color:#c692b7;font-size:11px;letter-spacing:1px}
.journal-entry h2{font-size:clamp(30px,3.6vw,52px);line-height:1.12;font-weight:500;letter-spacing:-.035em;margin:18px 0}
.journal-intro{font-size:17px;line-height:1.7;color:#bfaebf;max-width:660px}
.journal-entry figure{margin:30px 0 36px}
.journal-entry figure img{display:block;width:100%;height:auto;border-radius:0}
.blog-room .journal-entry figcaption{font-size:11px;color:#a89dac;margin-top:12px}
.journal-copy{max-width:680px;font-size:16px;line-height:1.85;color:#d3c5d4}
.journal-copy h3{font-size:22px;font-weight:500;color:#eee6ee;margin-top:32px}
.journal-copy ol{padding-left:22px}.journal-copy li{padding-left:8px;margin-bottom:14px}.journal-copy li::marker{color:#ed94ca}
.journal-note{border:0;background:none;padding:16px 0;color:#e6b4d7;font-size:20px;line-height:1.5}
.journal-copy footer{margin-top:34px;font-size:12px;color:#ef9cd5}.journal-copy footer span{display:block;color:#a89dac;margin-top:4px}
@media(max-width:900px){
 .blog-room .journal-shell{padding:120px 24px 60px}
 .blog-room .journal-top{margin-bottom:36px;align-items:flex-start;flex-direction:column;gap:16px}
 .blog-room .journal-book{grid-template-columns:1fr;gap:40px}
 .blog-room .journal-tabs{margin:0 0 24px}
 .blog-room .journal-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
 .blog-room .journal-card{min-width:0}.journal-card strong{font-size:16px}
 .journal-label{display:none}
}
@media(max-width:540px){
 .blog-room .journal-shell{padding:112px 20px 48px}
 .blog-room .journal-list{grid-template-columns:1fr;gap:20px}
 .blog-room .journal-card strong{font-size:18px;margin:5px 0}
 .journal-card>span{display:none}
 .blog-room .journal-book{gap:36px}
 .journal-intro,.journal-copy{font-size:16px}
}
/* Thumbnail journal: shared scroll, open cards and a quiet category rail. */
.blog-room .journal-shell{max-width:1440px;padding:130px 38px 80px}
.blog-room .journal-top{margin-bottom:40px}
.blog-room .journal-top h1{font-size:clamp(38px,4vw,58px);margin-top:12px}
.journal-catalog{display:grid;grid-template-columns:180px minmax(0,1fr);gap:40px;align-items:start}
.journal-categories{position:sticky;top:110px}
.journal-categories nav{display:grid;gap:8px;margin-top:18px}
.journal-categories button{display:flex;justify-content:space-between;gap:12px;padding:12px 0;background:none;border:0;color:#b5a8b8;text-align:left;min-height:44px;font:inherit;font-size:14px;cursor:pointer}
.journal-categories button[aria-pressed=true]{color:#ffb5df}
.journal-categories button span{font-size:11px;opacity:.7}
.journal-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:42px 24px}
.journal-tile{display:block;color:inherit;text-decoration:none;min-width:0}
.journal-tile img{display:block;width:100%;height:auto;margin-bottom:17px}
.journal-tile small{font-size:10px;letter-spacing:1.2px;color:#d799c2;text-transform:uppercase}
.journal-tile h2{font-size:21px;line-height:1.3;font-weight:500;margin:10px 0 12px;letter-spacing:-.4px}
.journal-tile p{font-size:13px;line-height:1.65;color:#b6a9b9;margin:0 0 16px}
.journal-tile>span,.journal-back,.journal-prose a{font-size:13px;color:#f3afd7;text-decoration:none}
.journal-tile:hover h2{color:#ffb5df}.blog-room a:focus-visible,.blog-room button:focus-visible{outline:2px solid #ffb5df;outline-offset:6px}
.journal-reading{max-width:1050px!important}.journal-back{display:inline-block;margin-bottom:30px;padding:10px 0}.journal-reading h1{font-size:clamp(32px,4vw,54px);font-weight:500;line-height:1.15;max-width:850px}.journal-reading .journal-intro{max-width:800px}.journal-article-image{display:block;width:100%;height:auto;margin:32px 0;max-width:850px}.journal-prose{max-width:740px}.journal-prose h2{font-size:28px;font-weight:500;line-height:1.3;margin-top:40px}.journal-prose p{font-size:16px;line-height:1.85;color:#ccbfce}.journal-project-link{display:inline-block;padding:20px 0}.journal-author{font-size:12px!important;color:#a79bab!important}
@media(max-width:1100px){.journal-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.journal-catalog{grid-template-columns:150px minmax(0,1fr);gap:28px}}
@media(max-width:700px){.blog-room .journal-shell{padding:112px 24px 60px}.journal-catalog{grid-template-columns:1fr;gap:28px}.journal-categories{position:static}.journal-categories nav{display:flex;flex-wrap:wrap;gap:4px 20px;margin-top:0}.journal-categories button{gap:8px}.journal-tile h2{font-size:18px}.journal-grid{gap:32px 18px}.journal-tile p{display:none}}
@media(max-width:400px){.journal-grid{gap:28px 14px}.journal-tile h2{font-size:16px}.journal-tile>span{font-size:11px}}
/* Paired scroll choreography; layout remains stable while the cards rotate. */
.blog-room .journal-grid{display:flex;flex-direction:column;gap:64px;overflow:visible}
.journal-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px;perspective:1400px}
.journal-pair .journal-tile{transform-origin:50% 35%;backface-visibility:hidden;transition:transform 160ms ease-out;will-change:transform}
.journal-pair .journal-tile p{max-width:390px}
.blog-room{overflow-x:hidden}
@media(max-width:700px){.journal-pair{gap:18px}.blog-room .journal-grid{gap:38px}}
@media(prefers-reduced-motion:reduce){.journal-pair .journal-tile{transform:none!important;transition:none;will-change:auto}}
/* Hover acts on the image so it does not overwrite the scroll rotation. */
.journal-tile{cursor:pointer}
.journal-tile img{transition:transform .35s cubic-bezier(.22,.8,.25,1),filter .35s ease;transform-origin:center}
.journal-tile h2{transition:color .2s ease}
.journal-tile>span{display:inline-block;transition:transform .25s ease,color .25s ease}
@media(hover:hover) and (pointer:fine){
 .journal-tile:hover img{transform:translateY(-7px) scale(1.025);filter:brightness(1.1)}
 .journal-tile:hover h2{color:#ffb5df}
 .journal-tile:hover>span{transform:translateX(6px);color:#ffe1f3}
}
.journal-tile:focus-visible img{transform:translateY(-7px) scale(1.025);filter:brightness(1.1)}
.journal-tile:focus-visible h2{color:#ffb5df}
@media(prefers-reduced-motion:reduce){.journal-tile img,.journal-tile>span,.journal-tile h2{transition:none}.journal-tile:hover img,.journal-tile:focus-visible img,.journal-tile:hover>span{transform:none}}
