:root {
  --paper: #f4efe4;
  --paper-warm: #ece2d2;
  --paper-rose: #f4e4db;
  --ink: #29231e;
  --muted-ink: #756d64;
  --archive-red: #b84432;
  --archive-red-deep: #7f2d26;
  --archive-blue: #31465b;
  --archive-line: #c9bdad;
  --story-line: #d3c6b5;
  --story-panel: rgba(255,255,255,.52);
  --story-cyan: #496b80;
  --story-warm: #b84432;
}

body.archive-case { background: var(--paper); color: var(--ink); font-family: "Noto Sans SC", sans-serif; }
body.archive-case .noise { opacity: .12; mix-blend-mode: multiply; z-index: 20; }
body.archive-case .progress { background: var(--archive-red); }
body.archive-case .theme { display: none; }
body.archive-case .nav { height: 76px; padding: 0 5vw; border-bottom: 1px solid var(--archive-line); background: rgba(244,239,228,.88); backdrop-filter: blur(14px); }
body.archive-case .brand { color: var(--ink); }
body.archive-case .brand span { border-color: var(--archive-red); color: var(--archive-red); }
body.archive-case .back-home { border-color: var(--archive-line); color: var(--muted-ink); }
body.archive-case .back-home:hover { border-color: var(--archive-red); color: var(--archive-red); }
body.archive-case .nav nav a { color: var(--muted-ink); }
body.archive-case .nav nav a:hover { color: var(--archive-red); }
body.archive-case .section { max-width: 1400px; padding: 120px 7vw; }
body.archive-case h1, body.archive-case h2, body.archive-case h3 { color: var(--ink); }
body.archive-case .index, body.archive-case .eyebrow { color: var(--archive-red); }

.archive-case .hero { position: relative; grid-template-columns: minmax(0,1.1fr) minmax(340px,.75fr); min-height: 760px; padding-top: 150px; padding-bottom: 96px; gap: clamp(40px,7vw,120px); overflow: hidden; }
.archive-case .hero::before { content:""; position:absolute; inset:76px 0 0; pointer-events:none; opacity:.46; background-image:linear-gradient(90deg,transparent 0 4%,rgba(113,91,72,.1) 4% calc(4% + 1px),transparent calc(4% + 1px)),linear-gradient(rgba(113,91,72,.075) 1px,transparent 1px); background-size:auto,100% 42px; }
.archive-case .hero-copy, .archive-case .case-cover-art { position:relative; z-index:1; }
.archive-case .case-cover-title { max-width: 720px; margin: 21px 0 24px; font-size: clamp(48px,4.7vw,74px); line-height: 1.08; letter-spacing: -.065em; font-weight: 900; }
.archive-case .case-cover-title > span { display:block; white-space:nowrap; }
.archive-case .case-cover-title em { display:block; color: var(--archive-red); font-style:normal; }
.archive-case .lead { max-width: 620px; color: var(--muted-ink); font-size: 16px; line-height: 1.95; }
.archive-case .meta { max-width: 700px; gap: 16px 24px; margin-top: 42px; }
.archive-case .meta div { border-color: var(--archive-line); }.archive-case .meta b { color:var(--archive-blue); }.archive-case .meta span { color:var(--muted-ink); }
.case-cover-art { align-self:stretch; min-height:500px; padding: 28px; display:flex; flex-direction:column; justify-content:flex-end; overflow:hidden; border:1px solid #9e6b60; color:#f8ecdc; background: linear-gradient(180deg,rgba(54,30,25,.06),rgba(49,20,18,.72)), url("assets/screens/01-hub.webp") center/cover; box-shadow: 13px 13px 0 rgba(184,68,50,.18); transform:rotate(1.5deg); }
.case-cover-art::before { content:""; position:absolute; inset:13px; border:1px solid rgba(255,235,211,.62); pointer-events:none; }.case-cover-art::after { content:""; position:absolute; width:220px; aspect-ratio:1; top:-85px; right:-68px; border:1px solid rgba(255,222,173,.65); border-radius:50%; box-shadow:0 0 0 24px rgba(255,222,173,.1),0 0 0 48px rgba(255,222,173,.08); }
.case-cover-art>* { position:relative; z-index:1; }.case-cover-art__file,.case-cover-art__year { position:absolute; top:30px; color:#ffe5c0; font:700 10px/1.5 Syne,sans-serif; letter-spacing:.14em; }.case-cover-art__file{left:30px}.case-cover-art__year{right:30px;text-align:right}.case-cover-art b{font-size:clamp(42px,4vw,62px);line-height:1.06;letter-spacing:-.055em}.case-cover-art i{margin-top:15px;color:#ffe5c0;font:500 10px/1.8 Syne,sans-serif;letter-spacing:.14em;font-style:normal;}

.archive-case .overview { border-top:1px solid var(--archive-line); background:var(--paper-warm); }
.archive-case .overview-head p, .archive-case .section-head>p:last-child, .archive-case .challenge-grid p, .archive-case .source-note p { color:var(--muted-ink); }
.archive-case .overview-grid { gap:12px; margin-top:48px; }.archive-case .overview-grid article { min-height:180px; border:1px solid var(--archive-line); background:rgba(255,255,255,.36); }.archive-case .overview-grid small{color:var(--archive-red)}.archive-case .overview-grid b{color:var(--ink)}.archive-case .overview-grid span{color:var(--muted-ink)}
.archive-case .brief-strip { gap:12px; border:0; border-radius:0; background:transparent; }.archive-case .brief-strip > div{ min-height:116px; padding:20px; border-top:2px solid var(--archive-red); background:rgba(255,255,255,.48); }.archive-case .brief-strip strong{color:var(--archive-red);font-family:Syne,sans-serif}.archive-case .brief-strip span{color:var(--muted-ink)}
.archive-case .source-note{border-left:3px solid var(--archive-red);background:rgba(184,68,50,.06)}.archive-case .source-note>span{color:var(--archive-red)}

.archive-case .manifesto { border:0; background:var(--paper); }.archive-case h2 span{ color:var(--archive-red); }.archive-case .challenge-grid{gap:12px;margin-top:50px}.archive-case .challenge-grid article{min-height:210px;padding:28px;border:1px solid var(--archive-line);background:rgba(255,255,255,.45);box-shadow:4px 5px 0 rgba(103,74,52,.08)}.archive-case .challenge-grid article>span{color:var(--archive-red)}.archive-case .challenge-grid h3{margin-top:32px;color:var(--ink)}.archive-case .goal{border-color:var(--archive-line);margin-top:48px}.archive-case .goal span{color:var(--archive-red)}.archive-case .goal p{color:var(--ink);font-size:22px}

.archive-case .architecture{max-width:none;background:var(--paper-rose)}.archive-case .architecture .section-head,.archive-case .decision-section .section-head{max-width:920px}.archive-case .intent-hub{border:1px dashed var(--archive-red);border-radius:0;background:rgba(255,255,255,.55);box-shadow:6px 6px 0 rgba(184,68,50,.13)}.archive-case .intent-hub small{color:var(--archive-red)}.archive-case .intent-hub span{color:var(--muted-ink)}.archive-case .intent-groups{gap:12px}.archive-case .intent-groups article{min-height:230px;border:1px solid var(--archive-line);border-radius:0;background:rgba(255,255,255,.5)}.archive-case .intent-groups i{margin-bottom:25px;color:#d3aa9e}.archive-case .intent-groups small{color:var(--archive-red)}.archive-case .intent-groups p{color:var(--ink)}.archive-case .intent-groups span{color:var(--muted-ink)}

.archive-case .decision-section{background:var(--paper)}.archive-case .decision-story{border-color:var(--archive-line)}.archive-case .decision-story>header span{color:var(--archive-red)}.archive-case .story-logic>div{min-height:166px;border-color:var(--archive-line);border-radius:0;background:rgba(255,255,255,.6)}.archive-case .story-logic small{color:var(--archive-red)}.archive-case .story-logic p{color:var(--muted-ink)}.archive-case .process-evidence figure,.archive-case .evidence-frame,.archive-case .evidence-pair figure,.archive-case .iteration-compare figure,.archive-case .iteration-summary figure{border-color:var(--archive-line);border-radius:0;background:#fffdf8;box-shadow:6px 6px 0 rgba(103,74,52,.09)}.archive-case .process-evidence figcaption b,.archive-case .evidence-frame figcaption b,.archive-case .evidence-pair figcaption b{color:var(--ink)}.archive-case .process-evidence figcaption span,.archive-case .evidence-frame figcaption span,.archive-case .evidence-pair figcaption span{color:var(--muted-ink)}.archive-case .state-language{border-color:var(--archive-line);border-radius:0;background:var(--archive-line)}.archive-case .state-language>div{background:#fffdf8}.archive-case .state-language i{box-shadow:none;background:var(--archive-blue)}.archive-case .state-language i.claim{background:#cf7b3a}.archive-case .state-language i.done{background:#6e9766}.archive-case .state-language i.locked{background:#a69e94}.archive-case .state-language span{color:var(--muted-ink)}

.archive-case .screen-section{max-width:none;background:#e5ebeb}.archive-case .screen-card{border-color:#aebec2;background:#fffdf8;box-shadow:5px 6px 0 rgba(49,70,91,.11)}.archive-case .screen-card figcaption span{color:var(--archive-red)}.archive-case .screen-card figcaption b{color:var(--ink)}.archive-case .screen-card figcaption p{color:var(--muted-ink)}.archive-case .screen-section .section-head h2{white-space:normal;font-size:clamp(38px,5vw,72px)}

.archive-case .artifact{border-color:var(--archive-line);background:var(--paper-warm)}.archive-case .artifact>p:not(.index){color:var(--muted-ink)}.archive-case .privacy-note{border-color:var(--archive-line);border-radius:0;background:rgba(255,255,255,.5)}.archive-case .privacy-note span{color:var(--archive-red)}.archive-case .privacy-note p{color:var(--muted-ink)!important}
.archive-case .reflection{background:var(--paper)}.archive-case .reflection-main>p:last-child{color:var(--muted-ink)}.archive-case .learnings>div{border-color:var(--archive-line)}.archive-case .learnings i{color:var(--archive-red)}.archive-case footer{background:var(--archive-red);color:#fff6e9}.archive-case footer p,.archive-case footer a{color:#fff6e9}
.archive-case .image-dialog{background:#fffaf1;color:var(--ink)}.archive-case .image-dialog button{background:var(--archive-red);color:#fff;border-radius:0}

@media(max-width:900px){.archive-case .hero{grid-template-columns:1fr;min-height:0;padding-top:125px;gap:38px}.archive-case .case-cover-art{min-height:390px;max-width:520px;width:90%;margin-left:auto}.archive-case .hero::before{inset:76px 0 0}.archive-case .overview-grid{gap:8px}.archive-case .brief-strip{gap:8px}.archive-case .challenge-grid{gap:8px}.archive-case .intent-groups{gap:8px}}
@media(max-width:640px){.archive-case .nav{padding:0 16px}.archive-case .hero{padding-bottom:70px}.archive-case .case-cover-title{font-size:36px}.archive-case .case-cover-art{width:100%;min-height:330px;transform:none}.archive-case .case-cover-art b{font-size:42px}.archive-case .section{padding:86px 6vw}.archive-case .brief-strip{grid-template-columns:1fr 1fr}.archive-case .overview-grid{grid-template-columns:1fr}.archive-case .goal p{font-size:19px}.archive-case .story-logic,.archive-case .evidence-pair,.archive-case .iteration-decisions{grid-template-columns:1fr}.archive-case .screen-gallery{gap:14px}.archive-case .screen-card figcaption{padding:19px}.archive-case .source-note{padding:18px}}

/* Folder-to-project shared transition. The home page stores a short route state;
   this layer receives it and unfolds the same project cover before the case appears. */
.case-arrival { display:none; position:fixed; inset:0; z-index:200; pointer-events:none; background:rgba(37,26,20,.82); backdrop-filter:blur(8px); opacity:0; }
.case-arrival.is-active { display:block; animation:case-arrival-fade 1.1s cubic-bezier(.2,.76,.2,1) forwards; }
.case-arrival__folder { position:absolute; left:50%; top:50%; width:min(72vw,900px); height:min(72vh,680px); display:grid; align-content:end; padding:clamp(24px,4vw,58px); overflow:hidden; border:1px solid rgba(255,230,196,.72); color:#fff4e4; background:linear-gradient(180deg,rgba(18,10,8,.06),rgba(45,11,8,.75)),url("assets/screens/01-hub.webp") center/cover; box-shadow:0 30px 90px rgba(0,0,0,.58),13px 14px 0 rgba(184,68,50,.3); transform:translate(-50%,-50%) rotate(-.8deg); animation:case-arrival-folder .98s cubic-bezier(.2,.76,.2,1) forwards; }
.case-arrival__folder::before { content:""; position:absolute; inset:17px; border:1px solid rgba(255,235,205,.48); }.case-arrival__folder::after { content:""; position:absolute; width:42%; aspect-ratio:1; right:-10%; top:-14%; border:1px solid rgba(255,215,156,.62); border-radius:50%; box-shadow:0 0 0 24px rgba(255,215,156,.1),0 0 0 48px rgba(255,215,156,.06); }.case-arrival__folder span,.case-arrival__folder b,.case-arrival__folder i{position:relative;z-index:1}.case-arrival__folder span,.case-arrival__folder i{font:600 10px/1.5 Syne,sans-serif;letter-spacing:.16em}.case-arrival__folder b{margin:14px 0 12px;font-size:clamp(38px,5vw,76px);line-height:1.02;letter-spacing:-.065em}.case-arrival__folder i{font-style:normal;color:#ffe0bd}
body.case-entering .nav,body.case-entering .hero-copy,body.case-entering .case-cover-art { opacity:0; transform:translateY(18px); }body.case-entered .nav,body.case-entered .hero-copy,body.case-entered .case-cover-art { opacity:1; transform:none; transition:opacity .62s ease .12s,transform .62s cubic-bezier(.2,.76,.2,1) .12s; }
@keyframes case-arrival-folder{0%{transform:translate(-50%,-50%) scale(.78) rotate(-2.5deg)}68%{transform:translate(-50%,-50%) scale(1.04) rotate(.3deg)}100%{transform:translate(-50%,-50%) scale(1.15) rotate(0)}}@keyframes case-arrival-fade{0%,62%{opacity:1}100%{opacity:0}}
.archive-case .intent-map.visible .intent-hub{animation:stamp-in .54s cubic-bezier(.2,.76,.2,1) both}.archive-case .intent-map.visible .intent-groups article{animation:ticket-in .56s cubic-bezier(.2,.76,.2,1) both}.archive-case .intent-map.visible .intent-groups article:nth-child(1){animation-delay:.08s}.archive-case .intent-map.visible .intent-groups article:nth-child(2){animation-delay:.15s}.archive-case .intent-map.visible .intent-groups article:nth-child(3){animation-delay:.22s}.archive-case .intent-map.visible .intent-groups article:nth-child(4){animation-delay:.29s}@keyframes stamp-in{from{opacity:0;transform:translateY(18px) rotate(-1deg)}to{opacity:1;transform:none}}@keyframes ticket-in{from{opacity:0;transform:translateY(28px) rotate(.8deg)}to{opacity:1;transform:none}}
@media(max-width:900px){.case-arrival__folder{width:88vw;height:58vh}}
@media(prefers-reduced-motion:reduce){.case-arrival{display:none!important}.archive-case .intent-map.visible .intent-hub,.archive-case .intent-map.visible .intent-groups article{animation:none}.case-entering .nav,.case-entering .hero-copy,.case-entering .case-cover-art{opacity:1;transform:none}}

/* Soft scrapbook refinement: a warm creative notebook rather than a hard archive. */
body.archive-case{--paper:#fffaf2;--paper-warm:#f8eddc;--paper-rose:#f9e9e3;--ink:#4e4a47;--muted-ink:#817a72;--archive-red:#e58f7b;--archive-blue:#85aeba;--archive-line:#e8daca;--story-cyan:#86b4bd;background:var(--paper)}
body.archive-case .nav{background:rgba(255,250,242,.84);border-bottom-color:#eadfce}.archive-case .brand span{border-radius:50%;border-color:#e7a38f;color:#d98570}.archive-case .back-home{border-radius:999px}.archive-case .hero::before{opacity:.7;background-image:radial-gradient(circle at 16% 22%,rgba(229,143,123,.16) 0 3px,transparent 4px),radial-gradient(circle at 86% 72%,rgba(133,174,186,.16) 0 4px,transparent 5px);background-size:120px 120px}.archive-case .case-cover-art{border-radius:26px;background:linear-gradient(180deg,rgba(255,244,225,.05),rgba(119,79,61,.38)),url("assets/screens/01-hub.webp") center/cover;box-shadow:18px 22px 0 rgba(229,143,123,.15),0 18px 42px rgba(91,67,48,.12);animation:gentle-float 5.5s ease-in-out infinite}.archive-case .case-cover-art::before{border-radius:18px;border-color:rgba(255,250,239,.72)}.archive-case .case-cover-art::after{border-color:#ffe7a9;box-shadow:0 0 0 18px rgba(255,231,169,.18),0 0 0 36px rgba(133,174,186,.1)}
.archive-case .overview-grid,.archive-case .challenge-grid,.archive-case .intent-groups{gap:18px}.archive-case .overview-grid article,.archive-case .challenge-grid article,.archive-case .intent-groups article,.archive-case .story-logic>div{border-radius:18px;background:rgba(255,255,255,.72);box-shadow:0 10px 28px rgba(116,91,69,.07)}.archive-case .overview-grid article:nth-child(2),.archive-case .challenge-grid article:nth-child(2){transform:translateY(16px) rotate(.5deg)}.archive-case .overview-grid article:nth-child(3),.archive-case .challenge-grid article:nth-child(3){transform:rotate(-.45deg)}.archive-case .brief-strip>div{border-radius:16px;border-top:0;box-shadow:0 8px 22px rgba(116,91,69,.06)}.archive-case .source-note{border-left:0;border-radius:18px;padding:28px;background:#fff4df;box-shadow:inset 4px 0 #f1be74}.archive-case .intent-hub{border-radius:22px;border-style:solid;border-color:#e8b2a4;background:#fffaf5}.archive-case .process-evidence figure,.archive-case .evidence-frame,.archive-case .evidence-pair figure,.archive-case .iteration-compare figure,.archive-case .iteration-summary figure,.archive-case .screen-card{border-radius:20px;overflow:hidden;box-shadow:0 14px 32px rgba(93,75,62,.12)}.archive-case .screen-card{transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s ease}.archive-case .screen-card:hover{transform:translateY(-10px) rotate(.4deg);box-shadow:0 23px 38px rgba(93,75,62,.16)}.archive-case .screen-card:nth-child(3n+2){transform:rotate(-.6deg)}.archive-case .screen-card:nth-child(3n+2):hover{transform:translateY(-10px) rotate(-.15deg)}.archive-case .state-language{border-radius:20px;overflow:hidden}.archive-case footer{background:linear-gradient(120deg,#f1b39f,#9fc8cc);color:#fffdf9}.archive-case footer p,.archive-case footer a{color:#fffdf9}
@keyframes gentle-float{0%,100%{translate:0 0}50%{translate:0 -12px}}@media(max-width:640px){.archive-case .overview-grid article:nth-child(n),.archive-case .challenge-grid article:nth-child(n){transform:none}.archive-case .case-cover-art{animation:none}.archive-case .screen-card:nth-child(3n+2){transform:none}}