@charset "UTF-8";
@font-face{font-family:Yoube Display;src:url('./assets/yoube-display.ttf') format('truetype');font-weight:900;font-display:swap}
:root{--paper:#f3f1e9;--ink:#252820;--muted:#777b70;--red:#e64a2e;--line:#d2d4c9;--sans:Arial,"PingFang SC","Microsoft YaHei",sans-serif;--display:"Yoube Display",var(--sans)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:34px}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased}body:after{content:"";position:fixed;inset:0;pointer-events:none;z-index:20;opacity:.025;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23000' filter='url(%23n)' opacity='.5' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}a{color:inherit;text-decoration:none}button{color:inherit;font:inherit;cursor:pointer}button,a{-webkit-tap-highlight-color:transparent}button:disabled{cursor:default}a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--red);outline-offset:6px}::selection{background:var(--red);color:var(--paper)}img{max-width:100%;display:block}.wrap{width:calc(100% - 112px);max-width:1360px;margin-inline:auto}.skip{position:fixed;top:-100px;padding:12px;background:var(--ink);color:white;z-index:110}.skip:focus{top:12px}.eyebrow,.header-note,.hero-meta,.art-top,.hero-domain,.section-kicker,.project-meta,.project-url{font-size:10px;letter-spacing:1.2px}.intro{position:fixed;inset:0;z-index:100;background:var(--ink);color:var(--paper);display:none;align-items:center;justify-content:center;pointer-events:none}.intro.active{display:flex}.intro>span{font-size:76px;font-weight:900;letter-spacing:-7px}.intro-dot{color:var(--red)}.intro>i{position:absolute;bottom:0;left:0;width:100%;height:4px;background:var(--red);transform:scaleX(0);transform-origin:left}.header{height:106px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.wordmark{display:flex;align-items:center;font-size:38px;font-weight:900;letter-spacing:-2.8px;gap:9px;line-height:1}.wordmark img{width:28px;height:32px;object-fit:contain;transform:rotate(-9deg)}.wordmark>span{font-size:15px;color:var(--red);align-self:start;letter-spacing:0;margin-top:1px;margin-left:-3px}.header nav{display:flex;gap:36px;font-size:12px}.header nav a{position:relative}.header nav a:after{content:"";position:absolute;bottom:-7px;left:0;right:0;height:1px;background:var(--ink);transform:scaleX(0);transform-origin:left;transition:transform .3s}.header nav a:hover:after{transform:scaleX(1)}.header nav span{margin-left:14px}.header-note{font-size:9px}.hero{padding-top:27px}.hero-meta{display:flex;justify-content:space-between}.hero-meta>span:first-child{letter-spacing:2px;font-size:10px}.live-dot{display:inline-block;width:6px;height:6px;background:var(--red);border-radius:50%;margin-right:10px;vertical-align:2px}.hero-grid{display:grid;grid-template-columns:1.3fr 1fr;align-items:center;gap:35px;min-height:560px}.hero-copy{position:relative;padding:35px 0 34px;z-index:1}h1{font:900 clamp(74px,7.8vw,118px)/1.18 var(--display);letter-spacing:-7px;margin:0}.line{display:block;overflow:hidden;padding-bottom:13px}.line>span{display:block}.second-line{margin-left:28px}.comma{display:inline-block;transform:translateX(-6px) rotate(-12deg)}.outline{color:transparent;-webkit-text-stroke:1.8px var(--red);display:inline-block;transform:rotate(-6deg);margin-inline:2px 5px}.punct{color:var(--red);font-family:var(--sans);font-weight:400;display:inline-block;margin-left:-8px}.hero-caption{display:flex;align-items:flex-start;gap:20px;margin-top:31px;position:relative}.caption-rule{width:37px;height:1px;background:var(--red);margin-top:11px}.hero-caption p{font-size:12px;line-height:1.9;color:#64695e;margin:0}.hand-note{font:italic 22px Georgia,serif;transform:rotate(-10deg);margin-left:27px;align-self:center;color:var(--red);white-space:nowrap}.art{position:relative;aspect-ratio:1;max-width:510px;width:100%;justify-self:end}.orbit{width:100%;height:100%;color:#737c65;opacity:.65}.art-top{position:absolute;top:5px;right:3px;font-size:8px;color:var(--muted)}.art-word{position:absolute;inset:24% 0 0 27%;font:900 clamp(70px,8vw,118px)/.77 Arial,sans-serif;letter-spacing:-10px;transform:rotate(-10deg);pointer-events:none}.art-word i{font-style:italic;color:var(--red);display:block;margin-left:29px}.art-label{position:absolute;right:0;bottom:73px;writing-mode:vertical-rl;font-size:9px;line-height:1.9;letter-spacing:3px}.art-cross{position:absolute;bottom:25px;left:50px;font:300 28px Arial}.hero-bottom{border-top:1px solid var(--line);padding:23px 0 27px;display:flex;align-items:center;justify-content:space-between}.explore{font-size:11px;display:flex;align-items:center;gap:28px}.explore span{display:inline-flex;border:1px solid var(--line);width:33px;height:33px;border-radius:50%;align-items:center;justify-content:center;transition:transform .3s}.explore:hover span{transform:translateY(4px)}.coming{display:flex;align-items:center;gap:13px}.asterisk{font-size:39px;line-height:1;color:var(--red)}.coming>span:last-child{font-size:13px;font-weight:500}.coming small{font:8px var(--sans);display:block;letter-spacing:1.8px;color:var(--muted);margin-top:7px}.hero-domain{font-size:9px;color:var(--muted)}
.about{padding:39px 0 44px;border-top:1px solid var(--line)}.section-kicker{display:flex;justify-content:space-between;color:var(--muted);font-size:9px}.about-body{display:grid;grid-template-columns:1.35fr 1fr;align-items:center;gap:70px;padding:38px 4% 0}.brand-story{display:flex;align-items:center;gap:30px}.brand-logo{width:115px;height:115px;flex-shrink:0;display:flex;align-items:center;justify-content:center;border-radius:50%;background:#fffdf5;transform:rotate(-5deg)}.brand-logo img{width:76px;height:86px;object-fit:contain}.brand-story h2{font-size:22px;font-weight:700;letter-spacing:-.8px;margin:0 0 15px}.brand-story h2>span{color:var(--red);padding-left:4px}.brand-story p{font-size:13px;line-height:1.9;letter-spacing:.1px;margin:0;color:#626759}.like-area{position:relative}.like-button{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;min-height:53px;border:1px solid #b7bcac;border-radius:2px;background:transparent;font-size:12px;font-weight:600;transition:background .25s,color .25s,border-color .25s}.like-button svg{width:20px;height:20px}.like-arrow{margin-left:auto;padding-left:18px;font-size:18px;font-weight:400}.like-button{padding:12px 19px}.like-button:hover:not(:disabled){border-color:var(--red);background:#e64a2e0a;color:var(--red)}.like-button[aria-pressed=true]{color:var(--red);border-color:#e64a2e55;background:#e64a2e05}.like-button[aria-pressed=true]>svg{fill:currentColor}.like-button:disabled:not([aria-pressed=true]){opacity:.55}.like-caption{font-size:11px;color:var(--muted);text-align:center;margin:13px 0 0}.like-count{font-size:16px;color:var(--red);font-variant-numeric:tabular-nums}.like-status{font-size:10px;line-height:1.6;text-align:center;margin:7px 0 0;min-height:16px;color:var(--red)}.like-status:empty{display:none}.like-privacy{font-size:9px;color:var(--muted);text-align:center;margin-top:10px}.like-privacy summary{cursor:pointer;list-style:none;display:inline-block;border-bottom:1px dotted #aeb4a3;padding-bottom:2px}.like-privacy summary::-webkit-details-marker{display:none}.like-privacy p{font-size:10px;line-height:1.8;max-width:320px;margin:10px auto 0}.heart-pop{position:absolute;top:0;left:50%;color:var(--red);font-size:30px;pointer-events:none;animation:heart-pop .9s ease-out both}@keyframes heart-pop{from{opacity:1;transform:translate(-50%,0) scale(.5)}to{opacity:0;transform:translate(-50%,-70px) scale(1.2)}}
.spaces{padding-top:48px;border-top:1px solid var(--line)}.section-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:33px}.section-heading .eyebrow{color:var(--muted);font-size:9px}.section-heading h2{font:900 clamp(28px,3vw,43px)/1.35 var(--display);letter-spacing:-1.8px;margin:18px 0 0}.section-heading h2 span{color:var(--red)}.section-heading>p{font-size:11px;line-height:1.9;margin:0;color:var(--muted)}.project-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px 34px}.project{display:block;min-width:0;border:0;padding:0;background:none;text-align:left}.project-meta{display:flex;justify-content:space-between;margin-bottom:12px;font-size:8px;color:var(--muted);letter-spacing:1px}.project-meta>span:last-child{font-size:8px;letter-spacing:.8px}.preview{aspect-ratio:1.54;position:relative;overflow:hidden;background:#dddcd3;border:1px solid #2528200d}.preview>img:not(.mini-code){width:100%;height:100%;object-fit:cover;object-position:center;transition:transform .7s cubic-bezier(.2,.7,.2,1)}.project:hover .preview>img:not(.mini-code){transform:scale(1.025)}.project-title{display:flex;align-items:center;justify-content:space-between;padding-top:19px}.project h3{font-size:23px;font-weight:700;letter-spacing:-.8px;line-height:1.4;margin:0}.project-arrow{font-size:24px;font-weight:400;transition:transform .3s}.project:hover .project-arrow{transform:translate(3px,-3px);color:var(--red)}.project>p{font-size:11px;color:var(--muted);line-height:1.8;margin:9px 0 16px}.project-url{font-size:9px;letter-spacing:.4px;display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:13px;gap:20px}.project-url>span{color:var(--muted);font-size:9px}.preview-mini{background:#123c30;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:8% 7%}.mini-copy{display:flex;flex-direction:column;align-items:start;gap:20px;min-width:0;color:#f4eedc}.mini-caption{font-size:9px;letter-spacing:.5px;white-space:nowrap}.mini-copy strong{font:900 clamp(20px,2.3vw,33px)/1.5 var(--display);letter-spacing:-1px}.mini-scan{font-size:9px;border-bottom:1px solid #f4eedc66;padding-bottom:5px}.mini-scan>span{margin-left:20px}.mini-code{width:47%;height:auto;aspect-ratio:1;object-fit:contain;background:white;border-radius:3px;padding:5px;transform:rotate(4deg);transition:transform .4s}.project:hover .mini-code{transform:rotate(0deg) scale(1.025)}.signoff{padding:65px 0 45px;margin-top:75px;border-top:1px solid var(--line)}.signoff>.eyebrow{font-size:9px;color:var(--muted)}.signoff>p{font:900 clamp(55px,7vw,100px)/1.3 var(--display);letter-spacing:-6px;margin:24px 0}.signoff>p>span{color:var(--red)}.signoff>p>i{float:right;font:400 100px/1 Arial;font-style:normal;color:var(--red)}.signoff>div{display:flex;justify-content:space-between;font-size:11px;color:var(--muted)}.footer{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);min-height:95px;gap:24px;font-size:9px;color:var(--muted)}.footer-brand{color:var(--ink);font-size:21px;font-weight:900;letter-spacing:-1px}.footer-brand>span{font-size:8px;font-weight:400;margin-left:17px;letter-spacing:0;color:var(--muted)}.footer>a:nth-child(2){line-height:1.8}.footer>a:nth-child(2):hover{color:var(--ink)}dialog{border:0;background:var(--paper);color:var(--ink);width:min(480px,calc(100% - 36px));padding:35px;max-height:90dvh;overflow:auto}dialog::backdrop{background:#25282099;backdrop-filter:blur(6px)}.dialog-close{border:0;background:none;position:absolute;right:15px;top:10px;font-size:29px}.mini-dialog h2{font-size:22px;font-weight:700;letter-spacing:-.7px;margin:24px 0}.dialog-code{width:100%;height:auto;max-width:310px;margin:0 auto;background:white}.mini-dialog>p{font-size:11px;text-align:center;color:var(--muted);margin:18px 0}.dialog-cta{display:flex;justify-content:space-between;background:var(--ink);color:var(--paper);padding:16px 19px;margin-top:20px;font-size:12px}
@media(min-width:1700px){.hero-grid{min-height:600px}.hero-copy h1{font-size:118px}.art{max-width:530px}}
@media(max-width:1100px){.wrap{width:calc(100% - 64px)}.header-note{display:none}.hero-grid{min-height:480px;gap:15px;grid-template-columns:1.35fr 1fr}h1{font-size:8vw;letter-spacing:-5px}.second-line{margin-left:16px}.hand-note{font-size:18px;margin-left:0}.hero-caption{gap:14px}.hero-caption p{font-size:11px}.art-word{font-size:9vw;letter-spacing:-7px}.art-top{font-size:6px}.art-label{font-size:8px;right:-7px;bottom:40px}.about-body{gap:40px;padding-inline:1%;grid-template-columns:1.2fr 1fr}.brand-story{gap:22px}.brand-logo{width:90px;height:90px}.brand-logo img{width:62px;height:70px}.brand-story h2{font-size:20px}.brand-story p{font-size:11px}.project-grid{gap:40px 26px}.project h3{font-size:21px}.preview-mini{gap:14px}.mini-copy{gap:17px}.mini-caption{font-size:7px}.mini-scan{font-size:8px}.mini-copy strong{font-size:25px}.footer>span{display:none}}
@media(max-width:720px){.about-body{grid-template-columns:1fr;gap:32px;padding-inline:5%}.brand-story{justify-content:center;gap:25px}.like-area{width:100%;max-width:370px;margin:auto}.brand-story p{font-size:13px}.brand-story h2{font-size:23px}.brand-logo{width:100px;height:100px}.hand-note{display:none}}
@media(max-width:640px){.wrap{width:calc(100% - 40px)}.header{height:85px}.wordmark{font-size:31px;gap:7px}.wordmark img{width:24px;height:27px}.wordmark>span{font-size:12px}.header nav{gap:22px;font-size:10px}.header nav span{margin-left:5px}.hero{padding-top:23px}.hero-meta>span:first-child{font-size:9px}.hero-meta>span:last-child{font-size:7px;letter-spacing:.7px}.hero-grid{grid-template-columns:1fr;gap:0;position:relative;padding-bottom:18px;min-height:610px;align-items:start}.hero-copy{padding:36px 0 0}h1{font-size:clamp(56px,15vw,88px);line-height:1.18;letter-spacing:-4px}.line{padding-bottom:12px}.second-line{margin-left:18px}.outline{-webkit-text-stroke:1.3px var(--red);margin-inline:0 3px}.punct{margin-left:-7px}.hero-caption{margin-top:16px;gap:13px}.caption-rule{width:25px}.hero-caption p{font-size:10px}.hand-note{display:block;position:absolute;right:8px;top:6px;font-size:20px}.art{width:69%;max-width:290px;margin-top:10px;margin-right:0}.art-top{font-size:6px;top:-2px;right:0;letter-spacing:.5px}.art-word{font-size:72px;letter-spacing:-6px}.art-word i{margin-left:16px}.art-label{font-size:7px;right:-5px;bottom:40px;letter-spacing:2px}.art-cross{font-size:21px;bottom:7px;left:20px}.hero-bottom{padding-block:21px;gap:16px}.explore{font-size:10px;gap:13px}.explore span{width:27px;height:27px}.coming{gap:9px}.asterisk{font-size:30px}.coming>span:last-child{font-size:11px}.coming small{font-size:6px;letter-spacing:1px}.hero-domain{display:none}.about{padding-block:30px 35px}.section-kicker{font-size:8px}.about-body{padding:29px 0 0;gap:27px}.brand-story{gap:23px;justify-content:start}.brand-logo{width:87px;height:87px}.brand-logo img{width:59px;height:67px}.brand-story h2{font-size:21px;margin-bottom:12px}.brand-story p{font-size:12px}.like-area{max-width:none}.like-button{font-size:12px;min-height:51px}.like-caption{font-size:10px}.like-privacy{font-size:9px}.spaces{padding-top:34px}.section-heading{margin-bottom:28px;align-items:center;gap:15px}.section-heading h2{font-size:26px;margin-top:14px;letter-spacing:-1.5px}.section-heading .eyebrow{font-size:8px}.section-heading>p{font-size:8px;flex-shrink:0}.project-grid{grid-template-columns:1fr;gap:35px}.project-meta{margin-bottom:10px;font-size:7px}.project-meta>span:last-child{font-size:7px}.preview{aspect-ratio:1.5}.project-title{padding-top:16px}.project h3{font-size:21px}.project>p{font-size:10px;margin:8px 0 14px}.project-url{font-size:9px;padding-top:11px;gap:10px}.project-url>span{font-size:8px}.preview-mini{padding:8% 7%}.mini-copy{gap:20px}.mini-caption{font-size:8px}.mini-copy strong{font-size:26px}.mini-scan{font-size:9px}.mini-code{padding:4px;width:46%}.signoff{margin-top:43px;padding:36px 0 33px}.signoff>.eyebrow{font-size:7px}.signoff>p{font-size:54px;letter-spacing:-4px;margin:23px 0}.signoff>p>i{font-size:60px}.signoff>div{font-size:9px;gap:15px}.footer{padding-block:23px;align-items:start;flex-direction:column;gap:16px}.footer-brand{font-size:21px}.footer>a:nth-child(2){font-size:9px}dialog{padding:30px 24px}.mini-dialog h2{font-size:20px;margin:22px 0}.dialog-code{max-width:270px}.mini-dialog>p{font-size:10px}}
@media(max-width:365px){h1{font-size:14.8vw}.second-line{margin-left:10px}.hand-note{font-size:17px;right:0}.header nav{gap:15px}.hero-grid{min-height:580px}.mini-copy strong{font-size:22px}.section-heading h2{font-size:24px}.brand-story{gap:17px}.brand-story p{font-size:11px}}
/* Small, purposeful feedback for real actions. */
html{scroll-padding-top:130px}.header{position:sticky;top:0;z-index:30;background:var(--paper);transition:box-shadow .25s}.header.is-scrolled{box-shadow:0 10px 18px -18px #25282066}
.wordmark img{transition:transform .22s ease}.wordmark:active img{transform:rotate(-15deg) scale(.92)}
.header nav a{transition:color .2s}.header nav a[aria-current="location"]{color:var(--red)}.header nav a[aria-current="location"]:after{transform:scaleX(1);background:var(--red)}.header nav a span{display:inline-block;transition:transform .2s}.header nav a:active{color:var(--red)}
.about,.spaces{transition:border-color .3s}.about.is-arriving,.spaces.is-arriving{border-top-color:var(--red)}.is-arriving .section-kicker>span:first-child,.is-arriving .section-heading .eyebrow{color:var(--red)}
.explore span{transition:transform .2s,background .2s,color .2s,border-color .2s}.explore:active span{transform:translateY(6px) scale(.9)}
.art{padding:0;border:0;background:transparent;color:inherit;text-align:left;border-radius:50%;-webkit-appearance:none;appearance:none}.art:focus-visible{outline-offset:3px}.art-hint{position:absolute;bottom:16px;right:17px;display:flex;align-items:center;gap:12px;font-size:9px;color:var(--muted);letter-spacing:1px;border-bottom:1px solid var(--line);padding-bottom:6px;transition:color .2s,border-color .2s}.art-hint>span{display:inline-block;font-size:20px;transition:transform .4s}.art.is-playing .art-hint{color:var(--red);border-color:var(--red)}.art.is-playing .art-hint>span{transform:rotate(180deg)}.art:active .art-hint{color:var(--red)}
.brand-avatar{position:relative;flex-shrink:0}.brand-logo{position:relative;border:1px solid transparent;padding:0;transition:background .2s,box-shadow .2s,border-color .2s,transform .15s;overflow:visible}.brand-logo:active{transform:rotate(-5deg) scale(.96)}.brand-logo:focus-visible{outline-offset:5px;border-color:var(--red)}.brand-logo img{position:relative;z-index:1;pointer-events:none}.avatar-hint{position:absolute;right:-2px;bottom:0;z-index:2;background:var(--ink);color:var(--paper);border:3px solid var(--paper);width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font:italic 12px Georgia,serif;transform:rotate(5deg);transition:background .2s}.avatar-reply{position:absolute;left:0;bottom:calc(100% + 13px);z-index:4;display:block;white-space:nowrap;background:#fffdf5;border:1px solid var(--line);padding:11px 15px;border-radius:3px;font-size:11px;color:var(--ink);opacity:0;transform:translateY(5px);pointer-events:none;transition:opacity .18s,transform .18s;box-shadow:0 5px 14px #25282007}.avatar-reply:after{content:"";position:absolute;bottom:-5px;left:33px;width:8px;height:8px;background:#fffdf5;border-right:1px solid var(--line);border-bottom:1px solid var(--line);transform:rotate(45deg)}.avatar-reply.is-visible{opacity:1;transform:translateY(0)}.avatar-reply:empty{padding:0;border:0;box-shadow:none}.avatar-spark{position:absolute;z-index:3;left:50%;top:50%;width:6px;height:6px;border-radius:50%;pointer-events:none;animation:avatar-spark .65s ease-out both}@keyframes avatar-spark{0%{opacity:0;transform:translate(-50%,-50%) scale(.5)}25%{opacity:1}100%{opacity:0;transform:translate(var(--spark-x),var(--spark-y)) scale(.3)}}
.preview{transition:transform .17s,border-color .25s,box-shadow .25s}.project:focus-visible .preview{border-color:var(--red)}.project:active .preview{transform:scale(.985);border-color:var(--red)}.project[href] .preview-open{display:flex;align-items:center;gap:9px;position:absolute;right:15px;bottom:15px;padding:10px 13px;background:var(--paper);color:var(--ink);font:10px var(--sans);border:1px solid #25282018;opacity:0;transform:translateY(7px);transition:opacity .2s,transform .2s;pointer-events:none}.project[href]:focus-visible .preview-open{opacity:1;transform:translateY(0)}.mini-scan{transition:transform .2s,border-color .2s}.mini-trigger:focus-visible .mini-scan{transform:translateX(3px);border-color:currentColor}
.dialog-close{width:42px;height:42px;padding:0;display:grid;place-items:center;border-radius:50%;transition:background .2s,color .2s,transform .2s}.dialog-close:active{transform:scale(.88)}.dialog-cta{transition:background .2s,transform .15s}.dialog-cta>span{display:inline-block;transition:transform .2s}.dialog-cta:active{transform:scale(.98)}.mini-dialog::backdrop{animation:dialog-shade .22s ease-out}@keyframes dialog-shade{from{background-color:#25282000}to{background-color:#25282099}}
.back-top{display:inline-flex;align-items:center;gap:10px;min-height:36px;margin-block:-9px;transition:color .2s}.back-top-icon{width:34px;height:34px;display:grid;place-items:center;position:relative}.back-top-icon>svg{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke-width:1.2;transform:rotate(-90deg)}.back-top-track{stroke:var(--line)}.back-top-progress{stroke:var(--red);stroke-dasharray:100;stroke-dashoffset:100;stroke-linecap:round}.back-top-icon>span{font-size:15px;line-height:1;transition:transform .2s}.back-top:active .back-top-icon>span{transform:translateY(-3px) scale(.9)}.footer-brand{transition:color .2s}
@media(hover:hover){.wordmark:hover img{transform:rotate(7deg) scale(1.08)}.header nav a:hover span{transform:translate(2px,-2px)}.explore:hover span{background:var(--ink);color:var(--paper);border-color:var(--ink)}.art:hover .art-hint{color:var(--red);border-color:var(--red)}.brand-logo:hover{background:#fffdf8;border-color:#e64a2e55;box-shadow:0 4px 18px #2528200a}.brand-logo:hover .avatar-hint,.brand-logo:focus-visible .avatar-hint{background:var(--red)}.project:hover .preview{border-color:#e64a2e77;box-shadow:0 4px 15px #25282008}.project[href]:hover .preview-open{opacity:1;transform:translateY(0)}.mini-trigger:hover .mini-scan{transform:translateX(3px);border-color:currentColor}.dialog-close:hover{color:var(--red);background:#e64a2e0a;transform:rotate(90deg)}.dialog-cta:hover{background:var(--red)}.dialog-cta:hover>span{transform:translateY(3px)}.back-top:hover{color:var(--ink)}.back-top:hover .back-top-icon>span{transform:translateY(-3px)}.footer-brand:hover{color:var(--red)}}
@media(max-width:640px){.art-hint{font-size:8px;right:7px;bottom:0;gap:8px;padding-bottom:4px}.art-hint>span{font-size:17px}.avatar-hint{width:29px;height:29px;font-size:10px;border-width:2px;right:-3px;bottom:-1px}.avatar-reply{font-size:10px;padding:10px 12px;bottom:calc(100% + 11px)}.project[href] .preview-open{right:10px;bottom:10px;font-size:9px;padding:8px 10px}}
.art .orbit{display:block}.avatar-reply{bottom:calc(100% - 5px)}
.avatar-reply.is-below{top:calc(100% + 10px);bottom:auto}.avatar-reply.is-below:after{top:-5px;bottom:auto;transform:rotate(225deg)}
@media(max-width:640px){html{scroll-padding-top:104px}}
/* Typography stays in place; only its letters and the closing arrow respond. */
.hero-play,.signoff-play{border:0;padding:0;margin:0;background:transparent;color:inherit;font:inherit;letter-spacing:inherit;text-align:left;appearance:none;-webkit-appearance:none;touch-action:manipulation}
.hero-play{display:block;width:100%;border-radius:3px}.hero-play:focus-visible{outline-offset:8px}.title-glyph,.signoff-glyph{display:inline-block}.hero-play.is-playing .line{overflow:visible}.hero-play .outline{transition:color .18s}.hero-play.is-playing .outline{color:var(--red)}
.signoff-play{display:flex;align-items:center;justify-content:space-between;width:100%;gap:18px;border-radius:3px}.signoff-words{white-space:nowrap}.signoff-accent{position:relative;display:inline-block;color:var(--red)}.signoff-accent:after{content:"";position:absolute;left:3px;right:3px;bottom:0;height:2px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .3s ease}.signoff-play.is-playing .signoff-accent:after{transform:scaleX(1)}.signoff-arrow{display:grid;place-items:center;flex:none;overflow:hidden;width:1.1em;height:1.1em;font:400 100px/1 Arial,sans-serif;color:var(--red);letter-spacing:0}.signoff-arrow i{display:block;font-style:normal}.signoff-play:focus-visible{outline-offset:10px}
@media(hover:hover){.hero-play:hover .outline{color:#e64a2e22}.hero-play.is-playing:hover .outline{color:var(--red)}.signoff-play:hover .signoff-accent:after{transform:scaleX(.22)}.signoff-play.is-playing:hover .signoff-accent:after{transform:scaleX(1)}}
@media(max-width:640px){.signoff>p{font-size:clamp(36px,10.8vw,54px)}.signoff-play{gap:10px}.signoff-arrow{font-size:54px}}
/* SVG arrows keep their line shape on every platform, independent of emoji fonts. */
.icon{display:inline-block;width:1em;height:1em;flex-shrink:0;vertical-align:-.14em;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.project-arrow,.like-arrow{display:inline-flex;align-items:center;justify-content:center;line-height:1}.like-arrow .icon{width:1em;height:1em;fill:none}.project-meta>span:last-child{display:inline-flex;align-items:center;gap:5px}.project-meta .icon{width:10px;height:10px}.preview-open .icon{width:12px;height:12px}
.signoff-arrow i{width:1em;height:1em}.signoff-arrow .icon{display:block;width:100%;height:100%;stroke-width:1.2}.back-top-icon>span{display:grid;place-items:center}.back-top-icon>span .icon{width:16px;height:16px}.dialog-cta .icon{width:15px;height:15px}
/* Brand bursts use geometry instead of platform-specific symbol fonts. */
.brand-spark{display:block;width:1em;height:1em;fill:currentColor;stroke:none;flex-shrink:0}.wordmark>span{display:block}.asterisk{display:grid;place-items:center;flex-shrink:0}
.project,.preview{border-radius:8px}.preview{overflow:hidden}
.portfolio-trigger .preview-open{display:flex;align-items:center;gap:9px;position:absolute;right:15px;bottom:15px;padding:10px 13px;background:var(--paper);color:var(--ink);font:10px var(--sans);border:1px solid #25282018;pointer-events:none}
.portfolio-dialog{border-radius:8px;padding-top:42px}.portfolio-dialog>.eyebrow{font-size:9px;color:var(--muted)}.portfolio-dialog h2{font-size:25px;line-height:1.45;letter-spacing:-.8px;margin:22px 0 14px}.portfolio-dialog>p{font-size:13px;line-height:1.9;color:var(--muted);margin:0 0 27px}.portfolio-form label{display:block;font-size:12px;margin-bottom:10px}.portfolio-form input{display:block;width:100%;min-height:50px;padding:13px 15px;border:1px solid var(--line);border-radius:4px;background:#fffdf7;color:var(--ink);font:16px var(--sans);transition:border-color .2s}.portfolio-form input:focus{outline:2px solid var(--red);outline-offset:2px}.portfolio-form input[aria-invalid=true]{border-color:var(--red)}.portfolio-form input::placeholder{color:var(--muted);font-size:13px}.portfolio-error{min-height:20px;margin:9px 0 0;font-size:12px;line-height:1.7;color:var(--red)}.portfolio-form .dialog-cta{width:100%;min-height:50px;align-items:center;border:0;border-radius:4px;margin-top:12px;font:13px var(--sans)}
@media(max-width:640px){.portfolio-trigger .preview-open{right:10px;bottom:10px;font-size:9px;padding:8px 10px}.portfolio-dialog h2{font-size:22px}.portfolio-dialog>p{font-size:12px}}
.header-tools{display:flex;align-items:center;gap:20px}.sound-toggle{width:36px;height:36px;flex-shrink:0;padding:8px;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;background:transparent;color:var(--muted);transition:color .2s,border-color .2s,background .2s}.sound-toggle[hidden]{display:none}.sound-toggle svg{width:18px;height:18px}.sound-muted,.sound-toggle[aria-pressed="false"] .sound-waves{display:none}.sound-toggle[aria-pressed="false"] .sound-muted{display:block}.sound-toggle[aria-pressed="false"]{color:var(--muted)}.sound-toggle:active{background:#e64a2e0d}.sound-toggle[aria-pressed="true"]{color:var(--ink)}
@media(hover:hover){.sound-toggle:hover{color:var(--red);border-color:#e64a2e66;background:#e64a2e08}}
@media(max-width:640px){.header{gap:12px}.header-tools{gap:0}.sound-toggle{width:34px;height:34px;padding:7px;position:relative}.sound-toggle:before{content:"";position:absolute;inset:-5px}.header nav{margin-left:auto;gap:16px}}
@media(max-width:380px){.header{gap:8px}.header nav{gap:10px;font-size:9px}.header nav span{margin-left:2px}.wordmark{font-size:28px;gap:5px}}
@media(max-width:365px){.header{gap:6px}.wordmark{font-size:25px;gap:4px}.header nav{font-size:8.5px;gap:8px;white-space:nowrap;flex-shrink:0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.intro{display:none!important}}