:root{--plum:#2b1830;--seam:#46284a;--ink:#170c1a;--cream:#f3e7d3;--peach:#ffb48a;--lilac:#b9a3e3;--rose:#e46f86;--serif:"Gloock",Georgia,"Times New Roman",serif;--sans:"Figtree",system-ui,-apple-system,"Segoe UI",sans-serif;}*,*::before,*::after{box-sizing:border-box}html,body{overflow-x:clip}html{scroll-behavior:smooth}body{margin:0;background:var(--plum);color:var(--cream);font-family:var(--sans);font-size:clamp(1rem,0.96rem + 0.2vw,1.075rem);line-height:1.55;-webkit-font-smoothing:antialiased}a{color:inherit}.wrap{width:min(1180px,100%);margin:0 auto;padding:0 clamp(1rem,0.6rem + 2vw,2.5rem)}.top{display:flex;align-items:center;gap:.7rem;padding-top:calc(env(safe-area-inset-top) + 0.75rem);padding-bottom:.5rem}.top img{width:44px;height:44px;border-radius:12px;display:block}.top .name{font-family:var(--serif);font-size:clamp(1.15rem,1.05rem + 0.4vw,1.35rem);letter-spacing:.01em}.story{display:grid;grid-template-columns:minmax(0,1fr);position:relative}.stage{position:sticky;top:0;z-index:2;background:var(--plum);padding:.35rem 0 .5rem;align-self:start}.stage-in{height:min(34dvh,270px);display:flex;align-items:flex-end;justify-content:center}.stage svg{height:100%;width:auto;max-width:100%;display:block;overflow:visible}.hero{padding:.9rem 0 1rem}h1{font-family:var(--serif);font-weight:400;font-size:clamp(1.85rem,1.25rem + 3.2vw,3.9rem);line-height:1.04;letter-spacing:-0.01em;margin:0 0 .8rem;max-width:15ch;text-wrap:balance}h1 .brand{color:var(--peach);display:block}.lede{margin:0 0 1.2rem;max-width:38ch;color:#e6d6c4}.term{color:var(--cream);text-decoration:underline;text-decoration-color:var(--lilac);text-decoration-thickness:1px;text-underline-offset:3px}.term:hover{text-decoration-color:var(--peach)}.cta{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;min-height:52px;padding:.85rem 1.6rem;border-radius:999px;background:var(--peach);color:var(--ink);font-weight:600;font-size:1.06rem;text-decoration:none;transition:background-color .2s}.cta svg{width:16px;height:16px;flex:none}.cta:focus-visible{outline:3px solid var(--cream);outline-offset:3px}@media (hover: hover) and (pointer: fine){.cta:hover{background:#ffc6a4}}.under{margin:.75rem 0 0;font-size:.93rem;color:#d9c7e8}.steps{padding:6dvh 0 10dvh}.step{min-height:70dvh;display:flex;align-items:center}.step p{margin:0;font-family:var(--serif);font-size:clamp(1.4rem,1.1rem + 1.5vw,2.25rem);line-height:1.3;max-width:20ch;opacity:.4;transition:opacity .35s}.step.is-on p{opacity:1}.step:first-child{min-height:60dvh}#scene .fade{transition:opacity .6s ease}#scene .move{transition:transform .7s cubic-bezier(.2,.8,.2,1),opacity .6s ease;transform-box:fill-box}#dark{opacity:.25}#beam{transform-origin:50% 100%}#wall{transform-origin:50% 50%}#ph-dark,#ph-cat{opacity:0}#ph-play{opacity:1}[data-step="dark"] #dark{opacity:.8}[data-step="dark"] #beam{opacity:0;transform:scaleY(.15)}[data-step="dark"] #wall{opacity:0;transform:scale(.8)}[data-step="dark"] #ph-dark{opacity:1}[data-step="dark"] #ph-play{opacity:0}[data-step="dark"] #tilt{transform:rotate(-7deg)}[data-step="cat"] #dark{opacity:.55}[data-step="cat"] #beam{opacity:0;transform:scaleY(.15)}[data-step="cat"] #wall{opacity:0;transform:scale(.8)}[data-step="cat"] #ph-cat{opacity:1}[data-step="cat"] #ph-play{opacity:0}#tilt{transform-origin:50% 100%}#lift,.poster{transform-box:fill-box;transform-origin:50% 50%}#spin{transform-origin:50% 50%;transform-box:fill-box;animation:spin 1.2s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media (min-width: 900px){.story{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);column-gap:clamp(2rem,4vw,5rem)}.hero{grid-column:1;grid-row:1;padding:clamp(2rem,7dvh,5rem) 0 2rem}.steps{grid-column:1;grid-row:2}.stage{grid-column:2;grid-row:1 / span 2;position:relative;align-self:stretch;padding:0;background:none}.stage-in{position:sticky;top:6dvh;height:min(82dvh,640px)}.step{min-height:72dvh}}.bento{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem;padding:2rem 0 4.5rem}.tile{background:var(--seam);border-radius:22px;padding:1.15rem 1.1rem;min-width:0}.tile h2{font-family:var(--serif);font-weight:400;font-size:clamp(1.45rem,1.2rem + 1vw,2rem);line-height:1.1;margin:0 0 .8rem}.t-explain{grid-column:1 / -1;background:var(--cream);color:var(--ink)}.t-gloss{grid-column:1 / -1;background:none;padding:.6rem .2rem 0}.t-gloss h2{margin:0}.t-term{background:var(--ink)}.t-term h3{font-family:var(--serif);font-weight:400;font-size:1.2rem;margin:0 0 .35rem;color:var(--peach);scroll-margin-top:2rem}.t-term p{margin:0;font-size:.93rem;line-height:1.45;color:#e2d3c2}@media (min-width: 900px){.bento{grid-template-columns:repeat(4,minmax(0,1fr));gap:.9rem}.t-explain{grid-column:1 / 3;grid-row:1 / 4;padding:2rem}.t-gloss{grid-column:3 / 5;grid-row:1;align-self:end}}.lvl{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}.seg{display:inline-flex;background:#e6d5bd;border-radius:999px;padding:4px;margin:0 0 1rem}.seg label{min-height:44px;min-width:96px;display:inline-flex;align-items:center;justify-content:center;padding:0 1rem;border-radius:999px;cursor:pointer;font-weight:600;font-size:.95rem;color:#4b3349}#lvl-s:checked ~ .seg label[for="lvl-s"],#lvl-d:checked ~ .seg label[for="lvl-d"]{background:var(--plum);color:var(--cream)}#lvl-s:focus-visible ~ .seg label[for="lvl-s"],#lvl-d:focus-visible ~ .seg label[for="lvl-d"]{outline:3px solid var(--plum);outline-offset:2px}.say{margin:0;font-size:1.05rem;max-width:46ch}.say-d{display:none}#lvl-d:checked ~ .say-s{display:none}#lvl-d:checked ~ .say-d{display:block}.band{background:var(--peach);color:var(--ink);padding:clamp(3rem,8dvh,5rem) 0}.band .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1.25rem}.band p{margin:0;font-family:var(--serif);font-size:clamp(1.5rem,1.15rem + 1.6vw,2.5rem);line-height:1.12;max-width:18ch}.band .cta{background:var(--plum);color:var(--cream)}.band .cta:focus-visible{outline-color:var(--ink)}@media (hover: hover) and (pointer: fine){.band .cta:hover{background:var(--ink)}}.bar{position:fixed;left:0;right:0;bottom:0;z-index:20;background:rgba(23,12,26,.94);border-top:1px solid #4a2d4e;padding:.6rem 1rem calc(env(safe-area-inset-bottom) + .6rem);display:flex;align-items:center;justify-content:space-between;gap:.8rem;transform:translateY(110%);visibility:hidden;transition:transform .35s ease,visibility 0s linear .35s}.bar.on{transform:none;visibility:visible;transition:transform .35s ease}.bar span{font-family:var(--serif);font-size:1.05rem}.bar .cta{min-height:46px;padding:.6rem 1.2rem;font-size:1rem}footer{margin-top:3rem;padding:1.4rem 0 calc(env(safe-area-inset-bottom) + 5.5rem);border-top:1px solid #5a3a5e}.foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.8rem 1.5rem}.foot b{font-family:var(--serif);font-weight:400;font-size:1.2rem}.foot nav{display:flex;flex-wrap:wrap;gap:.2rem 1.2rem}.foot nav a{display:inline-flex;align-items:center;min-height:44px;color:#e2d3c2;text-underline-offset:3px}.foot nav a:focus-visible{outline:2px solid var(--peach);outline-offset:2px}.note{margin:.4rem 0 0;font-size:.88rem;color:#cbb6d6}@media (max-width: 599px){.foot{flex-direction:column;align-items:flex-start}}@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none !important;animation:none !important}}