@import url('/assets/fabric-history/carousel.css');
:root{--paper:#f5f5f0;--navy:#1d2f4e;--gold:#c5a059;--muted:#c4ccd8;--rule:#c5a05950;background:var(--navy);color:var(--paper);scroll-behavior:smooth;scroll-padding-top:55px}body{background:var(--navy)}.atmosphere{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;background:#1d2f4e}.still,#fabric-scene{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.still{object-position:center;opacity:.82;mask-image:linear-gradient(transparent 22%,#fff 49%,#fff 90%,transparent)}#fabric-scene{opacity:0;transition:opacity 1.4s}.webgl-ready #fabric-scene{opacity:1}.webgl-ready .still{opacity:0}.reading-veil{position:absolute;inset:0;background:linear-gradient(90deg,#1d2f4e66,#1d2f4efc 22%,#1d2f4efc 78%,#1d2f4e66);opacity:var(--read-veil,0);transition:opacity .3s}.masthead,main,footer{position:relative;z-index:2}.masthead{max-width:none;margin:0 5%;padding:24px 0;border-color:#c5a05940;align-items:center}.masthead a:first-child{font:25px Bodoni,Georgia,serif;letter-spacing:-.04em}.masthead a:last-child{font-size:10px;color:var(--paper)}.immersive-title{height:calc(100svh - 82px);min-height:610px;padding:55px 24px 0;text-align:center;position:relative}.immersive-title .eyebrow{font-size:10px;color:#d7bd86;letter-spacing:.18em;margin:0 0 16px}.immersive-title h1{font:400 clamp(70px,8vw,122px)/1.12 Bodoni,Georgia,serif;letter-spacing:-.045em;margin:0 0 18px;color:#f5f5f0}.immersive-title .standfirst{font:20px/1.6 Source,sans-serif;color:#f5f5f0;margin:0}.scroll-cue{position:absolute;bottom:28px;left:50%;transform:translateX(-50%);font:9px Source,sans-serif;letter-spacing:.18em;display:flex;gap:24px;align-items:center;text-decoration:none;color:#f5f5f0;padding:12px 22px;background:#1d2f4eac;border:1px solid #c5a05945}.scroll-cue span{color:#dec894;font-size:19px}.article-body{padding:100px 0 60px}.article-body>p,.article-body>p:first-child,.article-body>.reader-note{width:min(680px,calc(100% - 48px));font:400 20px/1.85 Source,Arial,sans-serif;color:#f5f5f0;margin:0 auto 44px;letter-spacing:.005em}.article-body>.reader-note{font-style:normal;border-top:1px solid #c5a05960;padding-top:32px;margin-top:60px}.article-body>p a{text-decoration-color:#c5a059;text-decoration-thickness:1px}.motion-ready .article-body>p{opacity:0;transform:translateY(24px);transition:opacity 1.15s cubic-bezier(.16,1,.3,1),transform 1.4s cubic-bezier(.16,1,.3,1)}.motion-ready .article-body>p.revealed{opacity:1;transform:none}.evolution{margin:85px auto 90px;max-width:1040px;border-color:#c5a05960;padding:30px 28px;background:#203451f2;box-shadow:0 20px 75px #14243b35}.gallery-heading h2{color:#f5f5f0}.gallery-period,.caption-date,.gallery-hint,.frame figcaption p,.timeline button{color:#d0d6df}.art{background:#f5f2e9;border-color:#c5a05944;aspect-ratio:2/1}.frame{opacity:.4}.frame.active{opacity:1}.frame figcaption{min-height:145px}.frame h3{color:#f5f5f0}.caption-date>span,.timeline-number,.eyebrow{color:#d7bd86}.timeline [aria-current]{color:#f5f5f0}.timeline-line{background:#ffffff30}.arrows button{border-color:#c5a05970;color:#f5f5f0}.arrows button:hover:enabled{background:#c5a059;color:#1d2f4e}.timeline-line:after{background:#c5a059}.prompt-art{background:#1d2f4e}.gallery-controls{border-top:1px solid #ffffff15;padding-top:8px}.track{touch-action:pan-x pan-y}.motion-toggle{position:fixed;bottom:17px;right:18px;z-index:10;background:#1d2f4eea;border:1px solid #c5a05965;color:#f5f5f0;font:10px Source,sans-serif;padding:10px 15px;letter-spacing:.04em}.reading-progress{position:fixed;top:0;left:0;height:2px;background:#c5a059;transform:scaleX(0);transform-origin:left;width:100%;z-index:20}footer{max-width:1100px;margin:0 auto;padding:25px 24px 70px;color:#c4ccd8;border-color:#c5a05945;gap:20px}footer a{text-decoration:none}.skip-link{position:fixed;z-index:30;left:15px;top:15px;background:#1d2f4e;padding:15px}.skip-link:not(:focus){clip-path:inset(50%);height:1px;width:1px;overflow:hidden;padding:0}html.motion-off{scroll-behavior:auto}html.motion-off *,html.motion-off *:before,html.motion-off *:after{animation:none!important;transition:none!important}html.motion-off .article-body>p{opacity:1;transform:none}
@media(max-width:650px){.masthead{margin:0 6%}.immersive-title{padding-top:58px;min-height:650px}.immersive-title h1{font-size:68px}.immersive-title .standfirst{font-size:18px;max-width:290px;margin:auto}.immersive-title .eyebrow{font-size:8px}.article-body{padding-top:65px}.article-body>p,.article-body>p:first-child,.article-body>.reader-note{font-size:18px;line-height:1.85;margin-bottom:32px}.evolution{padding:22px 16px;width:calc(100% - 28px);margin-block:65px}.gallery-heading h2{font-size:29px}.frame figcaption{min-height:155px}.reading-veil{background:linear-gradient(90deg,#1d2f4eee,#1d2f4efc 20%,#1d2f4efc 80%,#1d2f4eee)}footer{font-size:11px}footer>span{display:none}.motion-toggle{font-size:9px;bottom:10px;right:10px}}
@media(prefers-reduced-motion:reduce){:root{scroll-behavior:auto}.motion-ready .article-body>p{opacity:1;transform:none}}
/* Reserve a quiet title zone even when WebGL is unavailable. */
.still{mask-image:linear-gradient(transparent 50%,#fff 69%,#fff 90%,transparent)}
.immersive-title .standfirst{max-width:none;text-wrap:balance;margin-inline:auto}.immersive-title .standfirst span{display:inline-block}
/* The Living Edition — a restrained feature identity within Musings. */
.masthead{padding-block:21px}.edition-mark{font:9px Source,sans-serif;letter-spacing:.2em;color:#d6bd89;display:flex;gap:18px;align-items:center}.edition-mark i{font-style:normal;letter-spacing:.08em;color:#bfc9d8;border-left:1px solid #c5a05960;padding-left:18px}
.immersive-title{padding-top:30px;min-height:720px;overflow:hidden}.immersive-title .eyebrow{font-size:8px;letter-spacing:.2em;margin-bottom:22px;color:#c4cddb}.immersive-title h1{font-size:inherit;line-height:1;margin:0 0 22px;letter-spacing:normal}.title-the{display:block;font:italic 30px/1.15 Bodoni,Georgia,serif;letter-spacing:.07em}.title-ornament{display:block;width:64px;height:1px;background:#c5a05960;margin:16px auto 18px;position:relative}.title-ornament:after{content:'';width:3px;height:3px;position:absolute;left:31px;top:-1px;background:#c5a059;transform:rotate(45deg)}.title-fabric{display:block;font:400 clamp(160px,20vw,245px)/.94 Bodoni,Georgia,serif;font-variation-settings:'opsz' 96;letter-spacing:-.035em;transform:scaleX(.57);white-space:nowrap;margin-inline:-25%}.immersive-title .standfirst{font-size:18px;line-height:1.65;color:#e3e7ec;max-width:520px}.scroll-cue{bottom:26px;background:transparent;border:0;padding:12px 18px;font-size:8px;letter-spacing:.2em;gap:18px}.scroll-cue .cue-line{height:30px;width:1px;background:linear-gradient(transparent,#c5a059);font-size:0}.scroll-cue:hover{color:#d7bd86}.motion-toggle{border-color:#c5a05935;background:#1d2f4ec7;color:#c7d0df;padding:8px 12px;font-size:9px}.evolution{border-inline:0;box-shadow:none;background:linear-gradient(145deg,#263c58eb,#1d2f4ef5);border-bottom:1px solid #c5a05935}.article-body{padding-top:70px}
@media(prefers-reduced-motion:no-preference){.title-the,.title-ornament,.title-fabric,.immersive-title .standfirst{animation:edition-appear 1.7s cubic-bezier(.16,1,.3,1) both}.title-ornament{animation-delay:.1s}.title-fabric{animation-name:edition-title;animation-delay:.18s}.immersive-title .standfirst{animation-delay:.35s}@keyframes edition-appear{from{opacity:0;translate:0 10px}to{opacity:1;translate:0 0}}@keyframes edition-title{from{opacity:0;translate:0 16px}to{opacity:1;translate:0 0}}}
@media(max-width:650px){.edition-mark{font-size:7px;letter-spacing:.12em}.edition-mark i{display:none}.masthead a:first-child{font-size:20px}.masthead a:last-child{font-size:8px}.immersive-title{padding-top:34px;min-height:680px}.immersive-title .eyebrow{font-size:7px;margin-bottom:25px}.title-the{font-size:27px}.title-fabric{font-size:clamp(155px,48vw,220px)}.immersive-title h1{margin-bottom:25px}.immersive-title .standfirst{font-size:17px;max-width:300px}.scroll-cue{bottom:28px}.article-body{padding-top:50px}}
/* A broad translucent wash, never an opaque rectangle behind the text. */
.reading-veil{opacity:1;background:radial-gradient(ellipse at 48% 46%,#1d2f4e68 0%,#1d2f4e55 42%,#1d2f4e18 85%);transition:none}
.still{mask-image:none;opacity:.55}.webgl-ready .still{opacity:0}
.immersive-title h1,.immersive-title .standfirst,.article-body>p{color:#fffaf0;text-shadow:0 2px 16px #13243b88}
.masthead{background:transparent}.immersive-title .eyebrow{color:#e3e7ec}
@media(max-width:800px){.reading-veil{background:radial-gradient(ellipse at center,#1d2f4e88 0%,#1d2f4e66 65%,#1d2f4e44 100%)}}
/* The archive floats within the textile rather than inside a solid panel. */
.evolution{position:relative;isolation:isolate;background:none;border:0;padding:34px 0 28px;width:min(1040px,calc(100% - 72px));margin-block:100px;box-shadow:none}
.evolution:before{content:'';position:absolute;inset:-65px -45px;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 45% 58%,#152a446e,transparent 73%)}
.gallery-heading{padding:0 2px 24px;margin-bottom:0;align-items:end}.gallery-heading h2{color:#fffaf0;text-shadow:0 2px 18px #14243b80}.gallery-heading .eyebrow{font-size:9px;letter-spacing:.2em;color:#ddc799}.gallery-period{font-size:9px;letter-spacing:.13em;color:#e0e5ec}
.track{padding-top:10px;padding-bottom:10px;gap:30px}.frame{opacity:.40;transition:opacity .9s cubic-bezier(.16,1,.3,1)}.frame.active{opacity:1}
.art{position:relative;border:1px solid #fffaf063;background:#f5f2e9;box-shadow:inset 0 0 0 5px #fffaf018,0 12px 30px #13243b24;outline:1px solid #c5a0593b;outline-offset:5px}
.art:after{content:'';position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 1px 0 #fffaf060;background:linear-gradient(135deg,#fffaf00a,transparent 40%)}
.frame:first-child .art{background:transparent}.prompt-art{background:linear-gradient(115deg,#1d2f4e9c,#253e5966);backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px)}.prompt-art pre{color:#fffaf0;text-shadow:0 1px 7px #15263e}.terminal-label{color:#e1c991}.terminal-footer,.terminal-footer span{color:#cdd8e4}
.frame figcaption{padding:27px 2px 14px;min-height:150px;max-width:none}.caption-date{font-size:11px;gap:24px;color:#d8e0e9}.caption-date>span{color:#e3ce9e}.frame h3{margin-top:12px;color:#fffaf0}.frame figcaption p{color:#e5e9ef;text-shadow:0 2px 12px #14243b;max-width:660px}
.gallery-controls{border-top:0;margin-top:0;padding-top:3px}.gallery-hint{font-size:11px;letter-spacing:.015em;color:#dce2e9}.arrows{gap:12px}.arrows button{border-color:#fffaf050;background:#f5f5f009;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:background .3s,border-color .3s,transform .5s cubic-bezier(.16,1,.3,1)}.arrows button:hover:enabled{background:#c5a05926;border-color:#e1c991;color:#fffaf0;transform:translateY(-2px)}
.timeline{margin-top:12px;gap:18px}.timeline button{color:#d3dce7}.timeline-line{background:linear-gradient(90deg,#fffaf04d,#fffaf018)}.timeline-line:after{height:2px;background:linear-gradient(90deg,#dec68e,#c5a059);box-shadow:0 0 9px #c5a05930}.timeline [aria-current]{color:#fffaf0}.timeline-number{color:#e3ce9e}
@media(max-width:650px){.evolution{width:calc(100% - 40px);padding:20px 0;margin-block:65px}.evolution:before{inset:-30px -18px}.gallery-heading{padding-bottom:18px}.track{gap:18px}.art{outline-offset:3px}.frame figcaption{padding-top:22px;min-height:158px}.timeline{gap:9px}.gallery-hint{max-width:180px}.prompt-art{backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}}
.arrows button.explore-cue:enabled{color:#1d2f4e;background:#dec68e;border-color:#f0dfba;box-shadow:0 0 0 5px #c5a05918,0 0 24px #c5a05948;animation:explore-arrow 2s ease-in-out 3}
@keyframes explore-arrow{0%,100%{transform:translateX(0);box-shadow:0 0 0 3px #c5a05912,0 0 16px #c5a05930}50%{transform:translateX(3px);box-shadow:0 0 0 8px #c5a05922,0 0 28px #c5a05955}}
@media(prefers-reduced-motion:reduce){.arrows button.explore-cue:enabled{animation:none;transform:none}}
.evolution .timeline{grid-template-columns:repeat(7,minmax(0,1fr))}
#phase-7 .art{background:#1d2f4e}
#phase-7 .art img{object-fit:contain;width:100%;height:100%}
/* Keep the condensed masthead centered within narrow screens. */
@media(max-width:650px){.title-fabric{width:max-content;position:relative;left:50%;margin-inline:0;transform:translateX(-50%) scaleX(.57);font-size:clamp(120px,42vw,220px)}}