/* The front door. Neutral ground so all three directions read as equals. */
[data-view='chooser'] body { background: #11100e; color: #efe6d2; }
[data-view='chooser'] .masthead { background: rgba(17, 16, 14, .85); border-color: rgba(239, 230, 210, .14); color: #efe6d2; --ink: #efe6d2; --bg: #11100e; --line: rgba(239,230,210,.16); --line-strong: rgba(239,230,210,.4); --accent: #e0261b; --accent-text: #ff7a6b; }
[data-view='chooser'] .colophon { color: #efe6d2; --ink: #efe6d2; --ink-2: #b9ae98; --line: rgba(239,230,210,.16); --line-strong: rgba(239,230,210,.4); --accent-text: #ff8a7b; --bg: #11100e; }
[data-view='chooser'] .colophon__thesis { font-family: 'Fraunces', serif; }

.door { position: relative; padding: clamp(2rem, 5vw, 4rem) var(--gutter) 0; }
.door__head { max-width: 1440px; margin: 0 auto clamp(1.5rem, 3vw, 2.5rem); display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); column-gap: clamp(1.5rem, 4vw, 4rem); align-items: end; }
.door__deck { grid-column: 1 / -1; font-family: 'Courier Prime', monospace; font-size: .8rem; letter-spacing: .16em; text-transform: uppercase; color: #ff8a7b; margin-bottom: .8rem; }
.door__title { font-family: 'Fraunces', serif; font-weight: 800; font-size: clamp(2.4rem, 5.2vw, 5rem); line-height: .9; letter-spacing: -.02em; text-transform: uppercase; }
.door__lead { font-family: 'Source Serif 4', serif; font-size: clamp(1.1rem, 1.6vw, 1.35rem); line-height: 1.5; max-width: 40ch; color: #efe6d2; }
.door__lead span { display: block; color: #b9ae98; margin-top: .5rem; font-size: .92em; }
@media (max-width: 1000px) { .door__head { grid-template-columns: 1fr; row-gap: 1rem; } .door__lead { max-width: 60ch; } }

.door__panels { max-width: 1440px; margin: 0 auto; display: flex; gap: 10px; height: clamp(420px, calc(100vh - 330px), 680px); }
.door__panel { flex: 1 1 0; min-width: 0; transition: flex-grow .7s var(--ease-out); position: relative; }
.door__panel.is-open { flex-grow: 2.1; }
.door__link { position: absolute; inset: 0; display: block; overflow: hidden; text-decoration: none; color: inherit; border-radius: 2px; }
.door__link:focus-visible { outline: 3px solid #f4d35e; outline-offset: 4px; }
.door__art { position: absolute; inset: 0; display: block; }
.door__label { position: absolute; left: 0; right: 0; bottom: 0; padding: 1.4rem 1.4rem 1.5rem; display: grid; gap: .25rem; z-index: 5; }
.door__n { font-family: 'Courier Prime', monospace; font-size: .8rem; letter-spacing: .14em; }
.door__name { font-size: clamp(1.5rem, 2.4vw, 2.2rem); line-height: 1; }
.door__tag { font-size: 1rem; max-width: 34ch; opacity: .92; }
.door__go { font-family: 'Courier Prime', monospace; font-size: .8rem; letter-spacing: .12em; text-transform: uppercase; margin-top: .6rem; display: inline-block; transform: translateX(-6px); opacity: .7; transition: transform .4s var(--ease-out), opacity .3s; }
.door__panel.is-open .door__go { transform: none; opacity: 1; }

/* A — workbench miniature */
.door__panel--workbench .door__link { background: linear-gradient(180deg, #8a6a47, #5d442c); color: #1f1b16; }
.door__panel--workbench .door__label { background: linear-gradient(0deg, #f6efe1 0 72%, rgba(246,239,225,0)); }
.door__panel--workbench .door__name { font-family: 'Fraunces', serif; }
.door__panel--workbench .door__tag { font-family: 'Source Serif 4', serif; }
.door__panel--workbench .door__n, .door__panel--workbench .door__go { color: #962219; }
.da-wb img { position: absolute; background: #f8f2e6; padding: 7px 7px 20px; box-shadow: 0 14px 26px -10px rgba(0,0,0,.6); transition: transform .8s var(--ease-out); }
.da-wb__a { width: 72%; left: 8%; top: 7%; transform: rotate(-5deg); }
.da-wb__b { width: 36%; right: 6%; top: 24%; transform: rotate(7deg); }
.da-wb__c { width: 48%; left: 4%; top: 40%; transform: rotate(4deg); }
.door__panel--workbench.is-open .da-wb__a { transform: rotate(-2deg) translate(4%, 2%); }
.door__panel--workbench.is-open .da-wb__b { transform: rotate(3deg) translate(-12%, -8%); }
.door__panel--workbench.is-open .da-wb__c { transform: rotate(8deg) translate(10%, 6%); }
.da-wb__note { position: absolute; right: 8%; top: 4%; font-family: 'Courier Prime', monospace; font-size: .8rem; background: #f6efe1; padding: .4em .6em; transform: rotate(3deg); max-width: 14em; box-shadow: 0 6px 12px -6px rgba(0,0,0,.5); color: #1f1b16; }

/* B — expressionist miniature */
.door__panel--expressionist .door__link { background: #141210; color: #f0e8d8; }
.door__panel--expressionist .door__label { background: #141210; border-top: 6px solid #e0261b; }
.door__panel--expressionist .door__name { font-family: 'Bricolage Grotesque', sans-serif; text-transform: uppercase; letter-spacing: .01em; font-size: clamp(1.7rem, 2.8vw, 2.6rem); }
.door__panel--expressionist .door__tag { font-family: 'Archivo', sans-serif; }
.door__panel--expressionist .door__n, .door__panel--expressionist .door__go { color: #ff6b5c; font-family: 'Archivo', sans-serif; font-weight: 800; }
.da-ex__red { position: absolute; inset: 0; background: #e0261b; clip-path: polygon(0 0, 78% 0, 34% 100%, 0 100%); transition: clip-path .8s var(--ease-out); }
.door__panel--expressionist.is-open .da-ex__red { clip-path: polygon(0 0, 52% 0, 18% 100%, 0 100%); }
.da-ex__cut { position: absolute; width: 90%; left: 18%; top: -4%; transition: transform .9s var(--ease-out); }
.da-ex__cut--1 { clip-path: polygon(0 0, 100% 0, 100% 46%, 0 62%); }
.da-ex__cut--2 { clip-path: polygon(0 62%, 100% 46%, 100% 100%, 0 100%); transform: translate(-4%, 3%) rotate(-2deg); }
.door__panel--expressionist.is-open .da-ex__cut--2 { transform: translate(0, 0) rotate(0); }
.da-ex__type { position: absolute; left: 7%; top: 7%; font-family: 'Bricolage Grotesque', sans-serif; font-size: clamp(2.2rem, 4.4vw, 4.4rem); line-height: .92; color: #141210; }

/* C — cinema miniature */
.door__panel--cinema .door__link { background: radial-gradient(70% 55% at 50% 35%, #2a2420, #0b0908 70%); color: #efe6d2; }
.door__panel--cinema .door__label { background: linear-gradient(0deg, #0b0908 0 70%, rgba(11,9,8,0)); }
.door__panel--cinema .door__name { font-family: 'Marcellus', serif; font-weight: 800; text-transform: uppercase; letter-spacing: .02em; }
.door__panel--cinema .door__tag { font-family: 'Lora', serif; }
.door__panel--cinema .door__n, .door__panel--cinema .door__go { color: #e9c77b; font-family: 'Jost', sans-serif; font-weight: 700; }
.da-ci__moon { position: absolute; width: 44%; left: 28%; top: 10%; filter: drop-shadow(0 0 40px rgba(255, 240, 200, .25)); transition: transform 1s var(--ease-out); }
.door__panel--cinema.is-open .da-ci__moon { transform: scale(1.12) translateY(4%); }
.da-ci__beam { position: absolute; left: 50%; bottom: 0; width: 160%; height: 100%; transform: translateX(-50%); background: conic-gradient(from 168deg at 50% 100%, transparent 0deg, rgba(255, 236, 190, .14) 10deg, rgba(255, 236, 190, .03) 22deg, transparent 24deg); }
.da-ci__curtain { position: absolute; top: 0; bottom: 0; width: 34%; background: repeating-linear-gradient(90deg, #5a0d12 0 14px, #8e1a20 14px 24px, #6b1016 24px 34px); box-shadow: inset 0 -80px 60px -40px rgba(0,0,0,.7); transition: transform 1s var(--ease-out); }
.da-ci__curtain--l { left: 0; border-radius: 0 0 60% 0; }
.da-ci__curtain--r { right: 0; border-radius: 0 0 0 60%; }
.door__panel--cinema.is-open .da-ci__curtain--l { transform: translateX(-60%); }
.door__panel--cinema.is-open .da-ci__curtain--r { transform: translateX(60%); }
.da-ci__seats { position: absolute; left: 0; right: 0; bottom: 26%; height: 60px; background: radial-gradient(circle at 20px 60px, #050403 22px, transparent 23px) 0 0 / 52px 60px repeat-x; opacity: .9; }

@media (max-width: 760px) {
  .door__panels { flex-direction: column; height: auto; }
  .door__panel { height: 300px; flex: none; }
  .door__panel.is-open { flex: none; }
}

.door-after { padding-top: clamp(3rem, 7vw, 6rem); }
.door-after__grid { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(2rem, 5vw, 5rem); }
.door-after__h { font-family: 'Fraunces', serif; font-size: clamp(2rem, 4vw, 3.4rem); text-transform: uppercase; font-weight: 800; margin: .6rem 0 1rem; }
[data-view='chooser'] .eyebrow { color: #ff8a7b; }
[data-view='chooser'] .lede { color: #cfc4ad; font-family: 'Lora', serif; }
.door-after__thesis { margin-top: 1.6rem; padding-left: 1rem; border-left: 4px solid #e0261b; font-family: 'Lora', serif; font-size: 1.2rem; }
.door-after__list { border-top: 1px solid rgba(239,230,210,.2); font-family: 'Lora', serif; }
.door-after__list a { display: grid; grid-template-columns: 3rem 7.5rem 1fr; gap: .6rem; padding: 1rem .3rem; border-bottom: 1px solid rgba(239,230,210,.2); text-decoration: none; transition: background .25s, padding .3s var(--ease-out); }
.door-after__list a:hover { background: rgba(239,230,210,.06); padding-left: .9rem; }
.door-after__list .mono { color: #ff8a7b; }
.door-after__list .muted { color: #b9ae98; }
@media (max-width: 860px) { .door-after__grid { grid-template-columns: 1fr; } .door-after__list a { grid-template-columns: 2.5rem 1fr; } .door-after__list .muted { grid-column: 2; } }
