/* Archive-only prototype. Preserve the existing shell and all shared page styles. */
.ar-v1{background:var(--product-paper);color:var(--ink);padding-bottom:6px}
.ar-intro{padding:44px 5vw 40px}
.ar-intro h1{font-size:clamp(34px,3.6vw,56px);font-weight:500;letter-spacing:-.045em;line-height:1.06;margin-top:20px}
.ar-feed{--ar-columns:2;--ar-gap:4px;display:grid;grid-template-columns:repeat(var(--ar-columns),minmax(0,1fr));gap:var(--ar-gap);align-items:start;margin:0 5px;padding:0;list-style:none}
.ar-feed.is-masonry{grid-auto-rows:1px;row-gap:0}
.ar-item{min-width:0;margin:0;padding:0}
.ar-tile{display:block;width:100%;aspect-ratio:var(--ar-ratio);min-width:0}
.ar-case{position:relative;overflow:hidden;padding:0;border:0;border-radius:0;box-shadow:none;background:var(--ar-tone);color:var(--ink);text-align:left;cursor:pointer;scroll-margin-top:calc(var(--shell-h) + 16px)}
.ar-case:focus-visible{outline:2px solid var(--ink);outline-offset:-4px}
.ar-output,.ar-media,.ar-placeholder,.ar-media picture{display:block;width:100%;height:100%}
.ar-output{position:absolute;inset:0}
.ar-media img{display:block;width:100%;height:100%;object-fit:cover}
.ar-placeholder{display:grid;place-items:center;background:var(--ar-tone,#ECECE8)}
.ar-dev-label{text-align:center;font:10px/1.65 var(--mono);letter-spacing:.045em;color:#66665f}
.ar-reveal{position:absolute;inset:0;display:flex;flex-direction:column;gap:16px;padding:20px;background:#F2F1ED;clip-path:inset(0 100% 0 0);transition:clip-path 340ms cubic-bezier(.22,.61,.36,1);pointer-events:none}
.ar-reveal-meta{display:flex;justify-content:space-between;gap:8px;font:10px/1.4 var(--mono);letter-spacing:.035em}
.ar-reveal-meta>span{color:#66665f}
.ar-input{display:block;flex:1;min-height:0;overflow:hidden;--ar-tone:#E3E3DE}
.ar-input .ar-media img{object-fit:contain}
.ar-note{font-size:clamp(16px,1.4vw,21px);line-height:1.2;letter-spacing:-.025em}
.ar-editorial,.ar-create{padding:clamp(16px,2.2vw,32px);display:flex;flex-direction:column;justify-content:center;background:#F2F1ED}
.ar-editorial blockquote{margin:0;font-size:clamp(22px,2.4vw,36px);line-height:1.12;letter-spacing:-.045em}
.ar-editorial p{font-size:11px;line-height:1.5;margin-top:24px}
.ar-create{background:var(--ink);color:var(--paper);justify-content:space-between}
.ar-create>p{font-size:clamp(23px,2.6vw,40px);line-height:1.03;letter-spacing:-.045em}
.ar-create>a{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;font-size:12px;text-decoration:underline;text-underline-offset:5px}
.ar-create>a:focus-visible{outline:2px solid currentColor;outline-offset:4px}
@media(min-width:768px){.ar-feed{--ar-columns:3;--ar-gap:5px;margin-inline:10px}}
@media(min-width:1200px){.ar-feed{--ar-columns:4}}
@media(min-width:1600px){.ar-feed{--ar-columns:5}}
@media(hover:hover) and (pointer:fine){
 .ar-case.is-input-ready:is(:hover,:focus-visible) .ar-reveal{clip-path:inset(0 0 0 0)}
}
.ar-story{width:min(1000px,calc(100vw - 64px));max-width:none;max-height:86svh;padding:0;margin:auto;border:1px solid #D9D9D4;border-radius:0;background:var(--product-paper);color:var(--ink);box-shadow:none;overflow:hidden}
.ar-story[open]{display:flex;flex-direction:column;animation:ar-sheet-in 280ms cubic-bezier(.22,.61,.36,1)}
@keyframes ar-sheet-in{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
.ar-story::backdrop{background:#0009}
.ar-story-header{display:flex;align-items:center;justify-content:flex-start;gap:16px;min-height:60px;padding:8px 22px;border-bottom:1px solid #D9D9D4;flex-shrink:0}
.ar-story-header>p{font:12px/1.4 var(--mono)}
.ar-close{display:flex;justify-content:center;align-items:center;width:44px;min-height:44px;padding:0;border:0;background:none;color:inherit;font-size:12px;cursor:pointer}
.ar-close .b-arrow-icon{width:24px;height:24px}
.ar-story-body{min-height:0;overflow:auto;overscroll-behavior:contain;display:grid;grid-template-columns:1fr 1fr}
.ar-story-media-column{min-width:0;border-right:1px solid #D9D9D4}
.ar-media-tabs{display:flex;align-items:center;gap:24px;padding:8px 24px;border-bottom:1px solid #D9D9D4}
.ar-media-tabs button{min-height:44px;padding:6px 0;border:0;background:none;color:#66665f;font-size:12px;cursor:pointer}
.ar-media-tabs [aria-selected=true]{color:var(--ink);text-decoration:underline;text-underline-offset:6px}
.ar-story-media{height:min(58svh,560px);background:#ECECE8;--ar-tone:#ECECE8;overflow:hidden}
.ar-story-media img{object-fit:contain}
.ar-story-media[data-side=input]{--ar-tone:#E3E3DE}
.ar-story-copy{display:flex;flex-direction:column;align-items:stretch;padding:30px 32px 36px;min-width:0}
.ar-story-meta{font:11px/1.5 var(--mono);color:#66665f;text-transform:uppercase}
.ar-story-copy h2{font-size:clamp(26px,2.5vw,36px);font-weight:500;line-height:1.08;letter-spacing:-.04em;margin-top:24px}
.ar-story-text{margin-top:26px;margin-bottom:40px}
.ar-story-text p{font-size:16px;line-height:1.65}
.ar-story-create{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:54px;padding:17px 18px;margin-top:auto;border:1px solid var(--ink);background:var(--ink);color:var(--paper);font-size:12px;line-height:1.4;text-decoration:none}
.ar-story-create:hover{background:#333}
.ar-story .ar-story-create:focus-visible{outline-color:var(--ink);outline-offset:4px}
.ar-story :is(button,a,[tabindex]):focus-visible{outline:2px solid currentColor;outline-offset:3px}
.ar-story-media:focus-visible{outline-offset:-4px!important}
@media(max-width:767px){
 .ar-intro{padding:30px 20px 30px}
 .ar-intro h1{font-size:32px;margin-top:16px}
 .ar-intro .b-kicker{font-size:10px}
 .ar-dev-label{font-size:9px}
 .ar-reveal{gap:10px;padding:12px}
 .ar-story{width:calc(100% - 12px);height:auto;max-height:calc(100dvh - max(64px, env(safe-area-inset-top)) - 6px);margin:auto 6px 6px;border:0;border-radius:16px 16px 8px 8px;box-shadow:0 12px 48px #0003}
 .ar-story-header{padding:8px 12px;min-height:62px;gap:12px}
 .ar-story-body{display:block}
 .ar-story-media-column{border-right:0;border-bottom:1px solid #D9D9D4}
 .ar-media-tabs{padding:4px 20px}
 .ar-story-media{height:65vw;min-height:220px;max-height:360px}
 .ar-story-copy{padding:26px 20px max(32px,env(safe-area-inset-bottom))}
 .ar-story-copy h2{font-size:30px;margin-top:16px}
 .ar-story-text{margin-top:22px;margin-bottom:30px}
}
@media(prefers-reduced-motion:reduce){.ar-reveal{transition:none}.ar-story[open]{animation:none}}
