@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@400;500;600;700&family=Instrument+Serif:ital@0;1&family=Special+Elite&family=Caveat:wght@400;600&family=Gloria+Hallelujah&display=swap');

:root {
  --paper: #eee8d7;
  --ink: oklch(.23 .02 55);
  --ink-soft: oklch(.43 .025 60);
  --pencil: oklch(.52 .025 65);
  --red: oklch(.50 .17 25);
  --brown: oklch(.39 .055 55);
  --newsprint: #e7dfca;
  --shadow-paper: 2px 3px 0 rgb(78 66 46 / .15), 7px 10px 18px rgb(66 52 32 / .11);
}

* { box-sizing: border-box; }
html { background: var(--paper); }
body { margin: 0; color: var(--ink); font-family: Archivo, Arial, sans-serif; }
button { color: inherit; font: inherit; }

.paper-bg {
  background-color: var(--paper);
  background-image: radial-gradient(rgb(72 58 36 / .065) .55px, transparent .7px);
  background-size: 5px 5px;
}
.grain { isolation: isolate; }
.grain::after {
  content: ''; position: absolute; z-index: 0; inset: 0; pointer-events: none; opacity: .18;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.22'/%3E%3C/svg%3E");
  mix-blend-mode: multiply;
}
.grain > * { position: relative; z-index: 1; }
.grid-paper { background-image: linear-gradient(rgb(126 145 158 / .14) 1px, transparent 1px), linear-gradient(90deg, rgb(126 145 158 / .14) 1px, transparent 1px); background-size: 13px 13px; }
.ruled-paper { background-image: repeating-linear-gradient(to bottom, transparent 0 26px, rgb(115 140 157 / .2) 27px 28px); }
.torn-bottom { clip-path: polygon(0 0,100% 0,100% 97%,94% 100%,88% 98%,81% 100%,74% 98%,66% 100%,57% 98%,50% 100%,42% 98%,33% 100%,24% 98%,16% 100%,8% 98%,0 100%); }
.halftone { background-image: radial-gradient(currentColor .75px, transparent .75px); background-size: 4px 4px; }
.tape { position: absolute; display: block; height: 24px; background: rgb(225 207 147 / .57); box-shadow: inset 0 0 8px rgb(133 112 55 / .1); }
.photo { box-shadow: var(--shadow-paper); transition: transform .3s ease; }
.photocopy { filter: saturate(.73) contrast(.96) sepia(.1); }
.drift { animation: drift 4.5s ease-in-out infinite alternate; }
.blink { animation: blink 1.5s steps(2, start) infinite; }
@keyframes drift { to { translate: 0 -7px; } }
@keyframes blink { 50% { opacity: .32; } }

.relative { position: relative; }.absolute { position: absolute; }.block { display:block; }.inline-block { display:inline-block; }
.flex { display:flex; }.grid { display:grid; }.flex-col { flex-direction:column; }.flex-wrap { flex-wrap:wrap; }
.items-center { align-items:center; }.items-baseline { align-items:baseline; }.justify-center { justify-content:center; }.justify-between { justify-content:space-between; }
.overflow-hidden { overflow:hidden; }.pointer-events-none { pointer-events:none; }.min-h-screen { min-height:100vh; }.w-full { width:100%; }
.inset-0 { inset:0; }.inset-x-0 { left:0;right:0; }.bottom-3 { bottom:.75rem; }.left-4 { left:1rem; }
.font-sans { font-family:Archivo,Arial,sans-serif; }.font-serif { font-family:'Instrument Serif',Georgia,serif; }.font-mono { font-family:'Special Elite',monospace; }.font-hand { font-family:Caveat,cursive; }.font-hand2 { font-family:'Gloria Hallelujah',cursive; }
.font-normal { font-weight:400; }.font-semibold { font-weight:600; }.italic { font-style:italic; }.uppercase { text-transform:uppercase; }.lowercase { text-transform:lowercase; }.normal-case { text-transform:none; }
.text-ink { color:var(--ink); }.text-ink-soft { color:var(--ink-soft); }.text-pencil { color:var(--pencil); }.text-red { color:var(--red); }.text-brown { color:var(--brown); }.text-paper { color:var(--paper); }.text-rose { color:#b57078; }
.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.leading-none{line-height:1}.object-cover{object-fit:cover}.rounded-full{border-radius:999px}.border-b{border-bottom-width:1px}.border-border{border-color:rgb(86 70 48 / .25)}.border-dotted{border-style:dotted}
.bg-transparent{background-color:transparent}.bg-newsprint{background-color:var(--newsprint)}.bg-red{background-color:var(--red)}.bg-rose\/70{background-color:rgb(181 112 120 / .7)}.bg-chrome\/70{background-color:rgb(177 174 160 / .7)}.bg-faded-blue\/50{background-color:rgb(126 145 158 / .5)}.bg-matcha\/60{background-color:rgb(143 157 103 / .6)}
.bg-\[\#fbf7ec\]{background-color:#fbf7ec}.bg-\[\#fbf9f0\]{background-color:#fbf9f0}.bg-\[\#fdfaf1\]{background-color:#fdfaf1}.bg-\[\#fdfbf4\]{background-color:#fdfbf4}.bg-\[oklch\(0\.97_0\.02_85_\/_0\.62\)\]{background-color:oklch(.97 .02 85 / .62)}
.shadow-\[var\(--shadow-paper\)\]{box-shadow:var(--shadow-paper)}.shadow-\[2px_2px_0_oklch\(0\.3_0\.03_60_\/_0\.18\)\]{box-shadow:2px 2px 0 oklch(.3 .03 60 / .18)}.backdrop-blur-\[1px\]{backdrop-filter:blur(1px)}

/* Spacing utilities used by the supplied markup */
.ml-1{margin-left:.25rem}.ml-2{margin-left:.5rem}.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}.mt-5{margin-top:1.25rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.px-7{padding-left:1.75rem;padding-right:1.75rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-4{padding-top:1rem;padding-bottom:1rem}.py-5{padding-top:1.25rem;padding-bottom:1.25rem}.py-6{padding-top:1.5rem;padding-bottom:1.5rem}.py-\[3px\]{padding-top:3px;padding-bottom:3px}.p-\[9px\]{padding:9px}.pb-2{padding-bottom:.5rem}.pb-\[34px\]{padding-bottom:34px}.gap-2{gap:.5rem}.gap-x-4{column-gap:1rem}.gap-y-\[6px\]{row-gap:6px}.space-y-3>:not([hidden])~:not([hidden]){margin-top:.75rem}.space-y-\[7px\]>:not([hidden])~:not([hidden]){margin-top:7px}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}

/* Values generated by Tailwind arbitrary-value utilities in the markup */
.w-\[74px\]{width:74px}.w-\[150px\]{width:150px}.w-\[176px\]{width:176px}.w-\[190px\]{width:190px}.w-\[196px\]{width:196px}.w-\[236px\]{width:236px}.w-\[254px\]{width:254px}.w-\[262px\]{width:262px}.w-\[268px\]{width:268px}.w-\[276px\]{width:276px}.w-\[300px\]{width:300px}.w-\[318px\]{width:318px}.w-\[336px\]{width:336px}.w-\[420px\]{width:420px}.w-\[452px\]{width:452px}.w-\[1440px\]{width:1440px}.h-\[92px\]{height:92px}.h-\[560px\]{height:560px}.bottom-\[7px\]{bottom:7px}.max-w-\[210px\]{max-width:210px}.max-w-\[520px\]{max-width:520px}
.text-\[9px\]{font-size:9px}.text-\[10px\]{font-size:10px}.text-\[11px\]{font-size:11px}.text-\[12px\]{font-size:12px}.text-\[13px\]{font-size:13px}.text-\[15px\]{font-size:15px}.text-\[16px\]{font-size:16px}.text-\[17px\]{font-size:17px}.text-\[18px\]{font-size:18px}.text-\[19px\]{font-size:19px}.text-\[20px\]{font-size:20px}.text-\[21px\]{font-size:21px}.text-\[22px\]{font-size:22px}.text-\[23px\]{font-size:23px}.text-\[24px\]{font-size:24px}.text-\[26px\]{font-size:26px}.text-\[27px\]{font-size:27px}.text-\[28px\]{font-size:28px}.text-\[30px\]{font-size:30px}.text-\[34px\]{font-size:34px}.text-\[64px\]{font-size:64px}.text-\[70px\]{font-size:70px}.text-\[74px\]{font-size:74px}.text-\[76px\]{font-size:76px}.text-\[80px\]{font-size:80px}.text-\[88px\]{font-size:88px}.text-\[92px\]{font-size:92px}.text-\[104px\]{font-size:104px}.text-\[108px\]{font-size:108px}.text-\[124px\]{font-size:124px}.text-\[188px\]{font-size:188px}
.leading-\[0\.78\]{line-height:.78}.leading-\[0\.86\]{line-height:.86}.leading-\[1\.1\]{line-height:1.1}.leading-\[1\.15\]{line-height:1.15}.leading-\[1\.2\]{line-height:1.2}.leading-\[1\.24\]{line-height:1.24}.leading-\[1\.25\]{line-height:1.25}.leading-\[1\.3\]{line-height:1.3}.leading-\[1\.4\]{line-height:1.4}.leading-\[1\.5\]{line-height:1.5}.leading-\[1\.7\]{line-height:1.7}.leading-\[1\.75\]{line-height:1.75}.leading-\[1\.8\]{line-height:1.8}.leading-\[1\.9\]{line-height:1.9}
.tracking-\[-0\.02em\]{letter-spacing:-.02em}.tracking-\[-0\.03em\]{letter-spacing:-.03em}.tracking-\[-0\.045em\]{letter-spacing:-.045em}.tracking-\[-0\.05em\]{letter-spacing:-.05em}.tracking-\[-0\.06em\]{letter-spacing:-.06em}.tracking-\[0\.14em\]{letter-spacing:.14em}.tracking-\[0\.16em\]{letter-spacing:.16em}.tracking-\[0\.18em\]{letter-spacing:.18em}.tracking-\[0\.2em\]{letter-spacing:.2em}.tracking-\[0\.22em\]{letter-spacing:.22em}.tracking-\[0\.24em\]{letter-spacing:.24em}.tracking-\[0\.3em\]{letter-spacing:.3em}.tracking-\[0\.48em\]{letter-spacing:.48em}
.transition-transform{transition:transform .3s ease}.transition-opacity{transition:opacity .3s ease}.duration-200{transition-duration:.2s}.duration-300{transition-duration:.3s}.opacity-0{opacity:0}.opacity-30{opacity:.3}
.group:hover .group-hover\:-translate-y-\[5px\]{transform:translateY(-5px)}.group:hover .group-hover\:-translate-y-\[6px\]{transform:translateY(-6px)}.group:hover .group-hover\:-translate-y-\[7px\]{transform:translateY(-7px)}.group:hover .group-hover\:-rotate-2{transform:rotate(-2deg)}.group:hover .group-hover\:rotate-\[-1\.4deg\]{transform:rotate(-1.4deg)}.group:hover .group-hover\:rotate-\[-1\.8deg\]{transform:rotate(-1.8deg)}.group:hover .group-hover\:rotate-\[1\.5deg\]{transform:rotate(1.5deg)}.group:hover .group-hover\:rotate-\[2deg\]{transform:rotate(2deg)}.group:hover .group-hover\:rotate-\[3deg\]{transform:rotate(3deg)}.group:hover .group-hover\:opacity-100{opacity:1}.group:hover .group-hover\:scale-\[1\.03\]{transform:scale(1.03)}.group\/nav:hover .group-hover\/nav\:translate-x-\[3px\]{transform:translateX(3px)}.group\/nav:hover .group-hover\/nav\:italic{font-style:italic}.group\/nav:hover .group-hover\/nav\:text-red{color:var(--red)}

@media (max-width: 1439px) {
  /* Preserve the collage's fixed composition by scaling the 1440px canvas. */
  .paper-bg > .relative > div > div[style*='width:1440px'] { transform: scale(calc(100vw / 1440)) !important; }
  .paper-bg > .relative > div { height: calc(5480px * (100vw / 1440)) !important; }
}
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; } }
