/* Monochrome archive home. The lunar home is a separate, unchanged option. */
body[data-home-style="archive"]{--file-bg:#edeef0;--file-paper:#fafafa;--file-ink:#18191b;--file-muted:#73767b;--file-line:#d8dadd;--file-wash:#f1f2f3;--file-shadow:#11131714}
body[data-home-style="archive"]:not(.light-theme){--file-bg:#101112;--file-paper:#1c1e20;--file-ink:#f2f3f3;--file-muted:#a5a8ad;--file-line:#42454a;--file-wash:#27292c;--file-shadow:#0008}
body[data-home-style="archive"].moon-intro::before{background:var(--file-bg)!important;filter:none!important}
.archive-home[hidden]{display:none!important}
.archive-home{position:sticky;top:0;display:grid;place-items:center;min-height:540px;height:100svh;padding:calc(env(safe-area-inset-top) + 24px) 18px calc(env(safe-area-inset-bottom) + 26px);overflow:hidden;background:var(--file-bg);color:var(--file-ink);box-shadow:0 0 0 100vmax var(--file-bg);clip-path:inset(0 -100vmax);opacity:var(--moon-fade,1);transform:translateY(var(--moon-shift,0));isolation:isolate}
.archive-home::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent calc(50% - .5px),var(--file-line) 50%,transparent calc(50% + .5px));opacity:.16;pointer-events:none}
.archive-desk{width:min(100%,650px);display:grid;gap:20px;align-content:center}
.archive-desk-top{display:flex;justify-content:space-between;gap:14px;padding:0 2px 12px;border-bottom:1px solid var(--file-line);color:var(--file-muted);font:600 10px/1.5 var(--global-font,sans-serif);letter-spacing:.15em;animation:file-top .55s ease both}
.archive-folder{position:relative;perspective:900px}
.archive-paper{position:relative;display:flex;flex-direction:column;min-height:clamp(390px,54svh,510px);padding:clamp(25px,6vw,45px);border:1px solid var(--file-line);border-radius:26px;background:var(--file-paper);box-shadow:0 22px 50px var(--file-shadow);overflow:hidden;animation:file-open .95s .12s cubic-bezier(.16,1,.3,1) both}
.archive-paper::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--file-ink);transform-origin:top;animation:file-spine .85s .5s cubic-bezier(.16,1,.3,1) both}
.archive-paper::after{content:"";position:absolute;left:-65%;top:0;width:45%;height:100%;background:linear-gradient(90deg,transparent,#ffffff2e,transparent);transform:skewX(-20deg);animation:file-glint 1.4s 1.05s ease-out both;pointer-events:none}
body[data-home-style="archive"]:not(.light-theme) .archive-paper::after{background:linear-gradient(90deg,transparent,#ffffff0a,transparent)}
.archive-paper-top{display:flex;justify-content:space-between;gap:12px;color:var(--file-muted);font:600 10px/1.5 var(--global-font,sans-serif);letter-spacing:.17em;animation:file-rise .65s .45s both}
.archive-paper-rule{display:block;width:100%;height:1px;margin:18px 0 auto;background:var(--file-line);transform-origin:left;animation:file-rule .8s .52s both}
.archive-file-label{display:block;margin-bottom:13px;color:var(--file-muted);font:500 12px/1.5 var(--global-font,sans-serif);letter-spacing:.13em;animation:file-rise .6s .7s both}
.archive-paper h1{margin:0;color:var(--file-ink);font:400 clamp(60px,12vw,105px)/.98 var(--global-font,-apple-system,BlinkMacSystemFont,sans-serif);letter-spacing:-.095em;text-transform:lowercase;animation:file-title .85s .77s cubic-bezier(.16,1,.3,1) both}
.archive-paper #archive-greeting{max-width:28em;margin:22px 0 38px;color:var(--file-muted);font:400 clamp(15px,2.4vw,19px)/1.55 var(--global-font,-apple-system,BlinkMacSystemFont,sans-serif);white-space:pre-line;overflow-wrap:anywhere;animation:file-rise .7s .94s both}
.archive-paper-bottom{display:grid;grid-template-columns:1fr 1fr;gap:13px 24px;margin-top:auto;padding-top:17px;border-top:1px solid var(--file-line);color:var(--file-ink);font:12px/1.65 var(--global-font,sans-serif);overflow-wrap:anywhere;animation:file-rise .75s 1.05s both}
.archive-paper-bottom span:nth-child(1)::before,.archive-paper-bottom span:nth-child(2)::before,.archive-paper-bottom span:nth-child(3)::before{display:block;margin-bottom:4px;color:var(--file-muted);font:600 9px/1.4 var(--global-font,sans-serif);letter-spacing:.13em}
.archive-paper-bottom span:nth-child(1)::before{content:"PERSON 01"}.archive-paper-bottom span:nth-child(2)::before{content:"PERSON 02"}.archive-paper-bottom span:nth-child(3)::before{content:"TIMELINE"}
.archive-paper-bottom span:nth-child(3){grid-column:1/-1;padding-top:10px;border-top:1px solid var(--file-line);color:var(--file-muted)}
.archive-enter{justify-self:end;display:flex;align-items:center;gap:26px;min-height:46px;padding:10px 17px 10px 22px;border:1px solid var(--file-ink);border-radius:999px;background:var(--file-ink);color:var(--file-paper);font:500 12px/1.4 var(--global-font,sans-serif);letter-spacing:.06em;cursor:pointer;animation:file-rise .7s 1.22s both;transition:transform .3s cubic-bezier(.16,1,.3,1),box-shadow .3s}
.archive-enter span{font-size:19px;line-height:1;animation:file-nudge 2s 1.8s ease-in-out infinite}
.archive-enter:hover,.archive-enter:focus-visible{transform:translateY(-3px);box-shadow:0 8px 22px var(--file-shadow)}
.archive-enter:active{transform:scale(.96)}
@keyframes file-top{from{opacity:0;transform:translateY(-9px)}to{opacity:1;transform:none}}
@keyframes file-open{from{opacity:0;transform:translateY(42px) rotateX(-8deg) scale(.965)}to{opacity:1;transform:none}}
@keyframes file-spine{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes file-glint{from{left:-65%}to{left:140%}}
@keyframes file-rule{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes file-rise{from{opacity:0;transform:translateY(13px)}to{opacity:1;transform:none}}
@keyframes file-title{from{opacity:0;letter-spacing:-.16em;transform:translateY(18px)}to{opacity:1;letter-spacing:-.095em;transform:none}}
@keyframes file-nudge{0%,100%{transform:translateY(0)}50%{transform:translateY(4px)}}

/* Scroll destination: a spare index rather than six floating cards. */
body[data-home-style="archive"] #home-view{position:relative;max-width:850px;margin:0 auto;padding:45px clamp(25px,5vw,55px) 52px;border:1px solid var(--file-line);border-radius:25px;background:var(--file-paper);color:var(--file-ink);box-shadow:0 20px 48px var(--file-shadow)}
body[data-home-style="archive"] #home-view::before{content:"UTOPIA  /  INDEX  001";display:block;margin-bottom:38px;padding-bottom:14px;border-bottom:1px solid var(--file-line);color:var(--file-muted);font:600 10px/1.5 var(--global-font,sans-serif);letter-spacing:.16em}
body[data-home-style="archive"] .overview-grid{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(22px,5vw,48px);max-width:none}
body[data-home-style="archive"] .home-date{color:var(--file-muted);font-size:11px;letter-spacing:.1em}
body[data-home-style="archive"] .overview-intro h1{color:var(--file-ink);font:500 clamp(30px,4.5vw,46px)/1.2 var(--global-font,-apple-system,BlinkMacSystemFont,sans-serif);letter-spacing:-.055em}
body[data-home-style="archive"] .feature-image{height:clamp(170px,23vw,250px);border:1px solid var(--file-line);border-radius:14px;background:var(--file-wash);transition:transform .45s cubic-bezier(.16,1,.3,1),box-shadow .45s}
body[data-home-style="archive"] .feature-image:hover{transform:translateY(-4px);box-shadow:0 12px 20px var(--file-shadow)}
body[data-home-style="archive"] .feature-image img{filter:grayscale(1)}
body[data-home-style="archive"] .feature-image img.custom-photo{filter:none}
body[data-home-style="archive"] .profile-names{color:var(--file-ink)}
body[data-home-style="archive"] .profile-details{color:var(--file-muted)}
body[data-home-style="archive"] .overview-cards{padding-top:18px}
body[data-home-style="archive"] .overview-card{grid-template-columns:30px minmax(0,1fr);gap:11px;min-height:89px;margin:0;padding:15px 2px;border:0;border-top:1px solid var(--file-line);border-radius:0;background:transparent!important;color:var(--file-ink)!important;box-shadow:none;transition:padding-left .3s,background .3s}
body[data-home-style="archive"] .overview-card:last-child{border-bottom:1px solid var(--file-line)}
body[data-home-style="archive"] .overview-card:hover{padding-left:10px;background:var(--file-wash)!important}
body[data-home-style="archive"] .overview-card-avatar{width:29px;height:29px;border:1px solid var(--file-line);border-radius:8px;background:var(--file-wash)!important;color:var(--file-muted)!important;font:600 10px/1 var(--global-font,sans-serif)}
body[data-home-style="archive"] .overview-card small,body[data-home-style="archive"] .overview-card>div>span{color:var(--file-muted)}
body[data-home-style="archive"] .home-links{max-width:none;gap:0;margin-top:52px;border-top:1px solid var(--file-line);counter-reset:file-index}
body[data-home-style="archive"] .home-link{position:relative;grid-template-columns:32px 40px minmax(0,1fr) 20px;gap:12px;min-height:88px;margin:0;padding:16px 4px;border:0;border-bottom:1px solid var(--file-line);border-radius:0;background:transparent!important;color:var(--file-ink)!important;box-shadow:none!important;overflow:hidden;counter-increment:file-index;transition:padding-left .35s cubic-bezier(.16,1,.3,1),background .35s}
body[data-home-style="archive"] .home-link::before{content:counter(file-index,decimal-leading-zero);grid-column:1;align-self:center;color:var(--file-muted);font:600 10px/1.2 var(--global-font,sans-serif);letter-spacing:.1em}
body[data-home-style="archive"] .home-link::after{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--file-ink);transform:scaleY(0);transform-origin:bottom;transition:transform .35s}
body[data-home-style="archive"] .home-link:hover,body[data-home-style="archive"] .home-link:focus-visible{padding-left:14px;transform:none;background:var(--file-wash)!important}
body[data-home-style="archive"] .home-link:hover::after,body[data-home-style="archive"] .home-link:focus-visible::after{transform:scaleY(1)}
body[data-home-style="archive"] .home-link-icon{grid-column:2;width:34px;height:34px;border:1px solid var(--file-line);border-radius:9px;background:var(--file-wash)!important;color:var(--file-ink)!important;font-size:19px;transition:transform .3s}
body[data-home-style="archive"] .home-link:hover .home-link-icon{transform:scale(1.08)}
body[data-home-style="archive"] .home-link-icon img{border-radius:8px}
body[data-home-style="archive"] .home-link>span:nth-child(2){grid-column:3;color:var(--file-ink);font-size:16px}
body[data-home-style="archive"] .home-link small,body[data-home-style="archive"] .home-link-arrow{color:var(--file-muted)}
body[data-home-style="archive"] .home-link-arrow{grid-column:4;transition:transform .3s}
body[data-home-style="archive"] .home-link:hover .home-link-arrow{transform:translateX(4px)}
body[data-home-style="archive"].archive-reveal-ready #home-view :is(.overview-intro,.overview-card,.home-link):not(.archive-visible){opacity:0;transform:translateY(19px)}
body[data-home-style="archive"].archive-reveal-ready #home-view :is(.overview-intro,.overview-card,.home-link).archive-visible{opacity:1;transform:none;transition:opacity .55s ease,transform .7s cubic-bezier(.16,1,.3,1),padding-left .35s,background .35s;transition-delay:calc(var(--archive-order,0) * 45ms)}

.home-style-label{margin:22px 0 10px!important}
.home-style-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:8px 0 20px}
.home-style-choice{display:grid;grid-template-columns:44px minmax(0,1fr);column-gap:11px;align-items:center;min-width:0;min-height:76px;padding:11px;border:1px solid #8885;border-radius:14px;background:transparent;color:inherit;text-align:left;font:inherit;cursor:pointer;transition:border-color .25s,background .25s,transform .25s}
.home-style-choice:hover{transform:translateY(-2px);background:#8881}
.home-style-choice[aria-pressed="true"]{border-color:currentColor;background:#8882}
.home-style-choice strong{font-size:13px;font-weight:600}
.home-style-choice small{grid-column:2;color:inherit;opacity:.58;font-size:10px;line-height:1.45}
.home-style-preview{grid-row:1/3;display:block;width:44px;height:49px;border:1px solid #8885;border-radius:7px;overflow:hidden}
.home-style-preview-moon{position:relative;background:#1b1b1b}
.home-style-preview-moon::before,.home-style-preview-moon::after{content:"";position:absolute;inset:8px;border:1px solid #dfdcd4a0;border-radius:50%}
.home-style-preview-moon::after{inset:16px;background:#dedbd2;border-color:transparent}
.home-style-preview-archive{position:relative;background:#eef0f1}
.home-style-preview-archive::before{content:"";position:absolute;inset:7px 6px;border:1px solid #c9cccf;border-radius:4px;background:#fff}
.home-style-preview-archive::after{content:"";position:absolute;left:13px;right:13px;top:17px;height:3px;background:#1c1d1e;box-shadow:0 8px #b8bbbe,0 13px #b8bbbe}

@media(max-width:600px){
  .archive-home{min-height:500px;padding:calc(env(safe-area-inset-top) + 12px) 14px calc(env(safe-area-inset-bottom) + 19px)}
  .archive-desk{gap:17px}
  .archive-paper{min-height:min(54svh,470px);padding:26px 23px;border-radius:21px}
  .archive-paper h1{font-size:clamp(54px,13vw,72px)}
  .archive-paper #archive-greeting{margin:16px 0 24px;font-size:15px}
  .archive-paper-bottom{grid-template-columns:1fr 1fr;gap:11px 13px;font-size:11px}
  .archive-enter{min-height:43px}
  body[data-home-style="archive"] #home-view{margin-inline:-10px;padding:29px 21px 42px;border-radius:20px}
  body[data-home-style="archive"] #home-view::before{margin-bottom:27px}
  body[data-home-style="archive"] .overview-grid{grid-template-columns:1fr;gap:18px}
  body[data-home-style="archive"] .overview-intro h1{font-size:34px;margin-bottom:18px}
  body[data-home-style="archive"] .feature-image{height:160px}
  body[data-home-style="archive"] .overview-cards{padding-top:4px}
  body[data-home-style="archive"] .overview-card{min-height:71px;padding:11px 4px}
  body[data-home-style="archive"] .home-links{margin-top:35px}
  body[data-home-style="archive"] .home-link{grid-template-columns:21px 34px minmax(0,1fr) 15px;gap:9px;min-height:76px;padding:12px 2px}
  body[data-home-style="archive"] .home-link-icon{width:31px;height:31px}
  .home-style-choice{grid-template-columns:38px minmax(0,1fr);gap:4px 8px;padding:8px}
  .home-style-preview{width:38px;height:43px}
}
@media(max-width:360px){.archive-paper{padding-inline:18px}.archive-paper h1{font-size:50px}.home-style-choice small{font-size:9px}}
@media(prefers-reduced-motion:reduce){
  .archive-home,.archive-desk-top,.archive-paper,.archive-paper::before,.archive-paper::after,.archive-paper-rule,.archive-file-label,.archive-paper h1,.archive-paper #archive-greeting,.archive-paper-bottom,.archive-enter,.archive-enter span{animation:none!important;transition:none!important}
  .archive-paper::after{display:none}
  body[data-home-style="archive"].archive-reveal-ready #home-view :is(.overview-intro,.overview-card,.home-link){opacity:1!important;transform:none!important;transition:none!important}
  body[data-home-style="archive"] .home-link,body[data-home-style="archive"] .home-link-icon,body[data-home-style="archive"] .feature-image{transition:none!important}
}
