@import url('https://fonts.googleapis.com/css2?family=VT323&display=swap');
/* A personal homepage inside a dark, star-scattered desktop. */
html{background:#101110}body{max-width:1180px;margin:30px auto;border:2px solid #716471;border-right-color:#302b30;border-bottom-color:#302b30;box-shadow:7px 7px 0 #050505;background:#181917;font-family:Verdana,Arial,sans-serif;font-size:16px}html{background-image:radial-gradient(circle at 12px 20px,#b3a6d76b 0 1px,transparent 1.5px),radial-gradient(circle at 76px 87px,#efa9c97a 0 1px,transparent 1.5px),radial-gradient(circle at 41px 132px,#e7f34a55 0 1px,transparent 1.5px);background-size:141px 167px,213px 191px,253px 239px}.desktop-caption{display:flex;justify-content:space-between;gap:20px;background:linear-gradient(90deg,#493c58,#2e2735);border-bottom:2px solid #0b0b0c;padding:8px 12px;font:12px/1.5 monospace;color:#e3d7eb}.desktop-caption>span:last-child{font-size:10px;color:var(--lavender)}header{padding:21px 4%;gap:22px;background:#222220;border-bottom:1px solid #70696c}header .brand{font-family:'VT323',monospace;font-size:48px;letter-spacing:-1px;transform:none;text-shadow:2px 2px #0b0b0c}header nav{gap:8px}header nav a,.tune,.button,.round-link{border:2px solid #807381;border-right-color:#080908;border-bottom-color:#080908;background:#322b31;color:var(--pink);padding:8px 13px;font:14px/1.4 monospace;box-shadow:1px 1px 0 #070807}header nav a:hover,.tune:hover,.button:hover,.round-link:hover{background:#433443;color:#fff}header nav a:active,.tune:active,.button:active,.round-link:active{border-color:#080908 #807381 #807381 #080908}.tune{background:#383329;color:var(--yellow);white-space:nowrap}.location-bar{padding:9px 4%;font:12px monospace;background:#10110f;color:var(--lavender);border-bottom:1px solid #474047;display:flex;align-items:center;gap:14px}.location-bar>span:first-child{font-size:10px;color:var(--muted)}.location-star{color:var(--yellow);margin-left:auto;font-size:17px}.hero{padding:27px 4% 35px;background:radial-gradient(circle at 88% 25%,#8e609510,transparent 45%)}.hero h1{font-family:'VT323',monospace;font-size:clamp(70px,7.8vw,102px);font-weight:400;letter-spacing:-2px;line-height:.9;margin:40px 0 26px;text-shadow:3px 3px #090a08}.hero h1 .serif{font-family:'VT323',monospace;font-style:normal;letter-spacing:-2px;text-shadow:3px 3px #090a08,1px 0 #b3a6d7}.hero-bottom p{font-size:14px;line-height:1.8}.hero-bottom .round-link{font-size:13px;padding:9px 12px;align-self:end}.eyebrow span:first-child{border:0;background:none;padding:0;transform:none;color:var(--yellow);font:12px monospace}.eyebrow span:last-child{font:10px monospace}.station-sticker{right:7%;top:134px;border:2px ridge #a38ba4;background:#241f29;box-shadow:4px 4px #090909;transform:rotate(3deg);min-width:205px}.station-sticker:before{display:none}.station-sticker>span{font-size:10px;letter-spacing:0;color:var(--yellow)}.station-sticker strong{font-family:'VT323',monospace;font-size:30px;font-style:normal}.station-sticker small{font-size:10px;color:var(--lavender)}.hero-sparkles span:nth-child(1){right:32%;top:86px}.hero-sparkles span:nth-child(2){right:3%;top:110px}.hero-sparkles span:nth-child(3){right:31%;bottom:90px}.ticker{padding:11px 4%;font-size:11px;border-block:1px dotted #6c5e6b;background:#111210}.section{padding:44px 4%}.section-heading{margin-bottom:24px}.section h2,.shop h2{font-family:'VT323',monospace;font-weight:400;font-size:44px;letter-spacing:-.4px;line-height:1}.kicker{font-size:11px;color:var(--lavender)}.section-heading>p{font-size:12px;line-height:1.7}.apps{gap:18px}.app{padding:0 18px 22px;border:2px solid #786b7b;border-right-color:#080908;border-bottom-color:#080908;background:#20211e;box-shadow:3px 3px #070807;overflow:hidden}.app-top{margin:0 -18px;padding:8px 9px;background:#413348;color:#efd8ea;border-bottom:2px solid #080908;min-height:34px}.app-top>span:first-child,.app:nth-child(2) .app-top>span:first-child,.app.notebook .app-top>span:first-child{padding:0;transform:none;border:0;background:none;color:inherit;font:11px monospace;letter-spacing:0}.app:nth-child(2) .app-top{background:#373148;color:#d6c9ee}.app.notebook .app-top{background:#3d3a29;color:#e6dfac}.app.notebook:before{display:none}.app-logo{height:136px}.app h3{font-family:'VT323',monospace;font-size:32px;font-weight:400;letter-spacing:0}.app p{font-size:13px}.app .app-cta{font:13px monospace;text-decoration:underline;text-underline-offset:4px}.app:hover{background:#282429}.app.notebook{background:#23231e}.app.notebook h3{font-size:33px;margin-top:23px}.notebook em{font-style:normal;font-family:inherit}.project-row{font-size:12px}.tag{font-size:10px}.text-link,.contact-links{font-family:monospace;font-size:14px;text-decoration:underline;text-underline-offset:4px}.broadcast-grid{gap:24px}.screen-card{border:3px ridge #6c666c;background:#292927;box-shadow:4px 4px #080808}.screen{height:330px}.screen-title{font-family:'VT323',monospace;font-size:44px;letter-spacing:0}.screen-title em{font-family:inherit;font-style:normal}.caption h3{font-size:16px}.caption p{font-size:12px}.program h3{font-size:17px}.program p{font-size:13px}.program-header{font-size:11px}.channel{font-family:'VT323',monospace;font-size:25px;transform:none;border:2px inset #6a606e;line-height:1}.program:nth-child(3) .channel{transform:none}.shop{margin:0 4%;padding:31px 25px;border:3px ridge #776079;background:#242026;box-shadow:4px 4px #0b0b0b}.shop:before{display:none}.shop h2{font-size:37px}.shop-side{font-family:'VT323',monospace;font-size:43px;transform:none}.shop-side span{font:9px/1.6 monospace}.shop p{font-size:13px}.about{gap:45px;padding-top:54px;padding-bottom:40px}.about h2{font-size:43px}.about h2 em{font:inherit;color:var(--pink)}.about .about-copy{font-size:17px}.about p{font-size:14px;line-height:1.8}.contact h3{font-family:'VT323',monospace;font-size:31px}.web-badges{display:flex;flex-wrap:wrap;justify-content:center;gap:9px;padding:12px 4% 24px}.web-badge{min-width:100px;min-height:40px;text-align:center;padding:4px 7px;border:2px outset #bda9bb;font:10px/1.4 monospace;letter-spacing:.5px;box-shadow:2px 2px #080808}.web-badge b{font-size:11px}.web-badge.pink{background:#efa9c9;color:#252026}.web-badge.purple{background:#b3a6d7;color:#252026}.web-badge.lemon{background:#e7f34a;color:#25261c}.web-badge.dark{background:#292b28;color:#edecdd}.signoff{padding-bottom:25px}.signoff span{font-size:11px}footer{padding:22px 4%;background:#20211e}footer .brand{font-family:'VT323',monospace;letter-spacing:0}footer>span{font-size:9px}
@media(max-width:1220px){body{margin:20px}.hero h1{font-size:90px}.station-sticker{right:7%;min-width:185px}.station-sticker strong{font-size:27px}.brains{font-size:28px}.brains b{font-size:40px}}@media(max-width:900px){header{flex-wrap:wrap}header nav{order:3;justify-content:start;width:100%;margin:0}.tune{margin-left:auto}.desktop-caption>span:last-child{display:none}.hero h1{font-size:80px}.station-sticker{right:5%;top:133px;min-width:170px;padding:14px 10px}.station-sticker strong{font-size:25px}.hero-sparkles span:nth-child(1){right:31%;font-size:25px}.hero-bottom{gap:20px}.hero-bottom p{font-size:13px}.apps{gap:12px}.app-logo{font-size:30px}.brains{font-size:24px}.brains b{font-size:25px}.app{padding-inline:14px}.app-top{margin-inline:-14px}.app-top>span:first-child,.app:nth-child(2) .app-top>span:first-child,.app.notebook .app-top>span:first-child{font-size:10px}.shop-side{display:none}}
@media(max-width:700px){body{margin:10px;border-width:2px}.desktop-caption{font-size:10px;padding:7px 9px}.desktop-caption>span{overflow-wrap:anywhere}header{padding:15px 5%;gap:12px}header .brand{font-size:43px}header nav{gap:6px;flex-wrap:wrap}header nav a{font-size:12px;padding:7px 9px}.location-bar{font-size:11px;padding-inline:5%;gap:8px}.hero{padding:23px 5% 28px}.hero h1{font-size:clamp(56px,12vw,82px);letter-spacing:-1.5px;margin-top:31px;line-height:.95}.hero h1 .serif{letter-spacing:-1.5px}.eyebrow span:first-child{font-size:10px}.station-sticker{display:none}.hero-sparkles span:nth-child(1){right:6%;top:24px;font-size:20px}.hero-sparkles span:nth-child(2){right:8%;top:auto;bottom:24px;font-size:28px}.hero-bottom .round-link{display:inline-flex;margin-top:20px;font-size:12px}.hero-bottom p{font-size:13px}.ticker{padding-inline:5%;font-size:10px}.section{padding:33px 5%}.section h2,.about h2{font-size:37px}.kicker{font-size:10px}.apps{gap:21px}.app{padding:0 20px 22px}.app-top{margin-inline:-20px}.app-top>span:first-child,.app:nth-child(2) .app-top>span:first-child,.app.notebook .app-top>span:first-child{font-size:12px}.app-logo{font-size:40px;height:130px}.brains{font-size:31px}.brains b{font-size:43px}.app h3{font-size:33px}.app p{font-size:14px}.screen{height:275px}.screen-title{font-size:39px}.shop{margin-inline:5%;padding:25px 20px}.shop h2{font-size:34px}.about{gap:23px}.about .about-copy{font-size:16px}.signoff span{font-size:10px}.web-badges{gap:8px}.web-badge{min-width:110px}footer{padding-inline:5%}footer>span{font-size:9px;line-height:1.6}.section-heading{gap:15px}}

/* Keep the station note in the layout, above the full-width action row. */
.hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(185px,25%);grid-template-areas:"eyebrow eyebrow" "headline sticker" "actions actions";column-gap:28px;row-gap:24px;align-items:center}
.hero>.eyebrow{grid-area:eyebrow;min-width:0}
.hero>h1{grid-area:headline;min-width:0;margin:12px 0 0}
.hero>.station-sticker{grid-area:sticker;position:relative;top:auto;right:auto;float:none;justify-self:center;min-width:0;width:100%;max-width:230px;margin:14px 0;box-sizing:border-box}
.hero>.hero-bottom{grid-area:actions;min-width:0;position:relative;z-index:1;gap:20px}
.hero-bottom>.round-link{flex-shrink:0}
@media(min-width:701px) and (max-width:900px){.hero{column-gap:22px;grid-template-columns:minmax(0,1fr) 185px}.hero>h1{font-size:clamp(57px,8.8vw,79px)}.hero>.station-sticker{padding:14px 10px}}
@media(max-width:700px){.hero{grid-template-columns:minmax(0,1fr);grid-template-areas:"eyebrow" "headline" "actions";row-gap:20px}.hero>h1{margin:8px 0 0}.hero>.station-sticker{display:none}.hero-bottom>.round-link{margin-top:20px}}

.dono i{font-family:Georgia,serif;font-size:48px;font-weight:400;letter-spacing:0;line-height:1;color:var(--lavender)}
@media(min-width:701px) and (max-width:900px){.dono i{font-size:32px}}

/* A dedicated decorative row keeps the stars clear of text and the sticker. */
.hero{grid-template-areas:"eyebrow eyebrow" "headline sticker" "sparkles sparkles" "actions actions";row-gap:18px}
.hero>.hero-sparkles{grid-area:sparkles;position:relative;inset:auto;display:flex;align-items:center;justify-content:space-between;height:32px;padding:0 7% 0 2%;overflow:visible;pointer-events:none}
.hero>.hero-sparkles span:nth-child(n){position:static;inset:auto;display:block;line-height:1;font-size:19px;transform:none}
.hero>.hero-sparkles span:nth-child(1){font-size:22px;transform:rotate(12deg);margin-right:12%}
.hero>.hero-sparkles span:nth-child(2){font-size:28px;transform:translateY(-3px);margin-right:5%}
.hero>.hero-sparkles span:nth-child(3){font-size:14px;transform:rotate(-12deg);margin-right:15%}
.hero>.hero-sparkles span:nth-child(4){font-size:24px;transform:translateY(3px)}
.hero>.hero-sparkles span:nth-child(5){font-size:27px;margin-left:6%}
.broadcast-badges{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin:-3px 0 26px;padding-bottom:21px;border-bottom:1px dotted #655566}
.badge-label{font:11px monospace;letter-spacing:1px;color:var(--muted)}
.channel-badges{padding:0;justify-content:flex-start;gap:10px}
.channel-badges .web-badge{display:inline-block;min-width:112px;min-height:44px;cursor:pointer;text-decoration:none}
.channel-badges .web-badge:hover{filter:brightness(1.12);color:#151614;box-shadow:3px 3px #080808}
.channel-badges .web-badge:active{border-style:inset;box-shadow:none}
@media(max-width:700px){.hero{grid-template-areas:"eyebrow" "headline" "sparkles" "actions";row-gap:16px}.hero>.hero-sparkles{height:25px;padding-right:3%}.hero>.hero-sparkles span:nth-child(1){margin-right:4%}.hero>.hero-sparkles span:nth-child(3){margin-right:4%}.hero>.hero-sparkles span:nth-child(5){margin-left:2%}.broadcast-badges{gap:12px}.badge-label{width:100%}.channel-badges{gap:8px}.channel-badges .web-badge{min-width:90px;padding-inline:6px}}

.hero>h1.welcome-headline{font-size:clamp(44px,6.2vw,76px);line-height:1;letter-spacing:-1px}.hero>h1.welcome-headline .serif{letter-spacing:-1px}
@media(max-width:700px){.hero>h1.welcome-headline{font-size:clamp(38px,9.6vw,64px);line-height:1.03;letter-spacing:-.5px}}


/* The station mottos live in the footer, as colored text rather than a separate panel. */
.footer-motto{display:flex;flex-wrap:wrap;justify-content:center;gap:7px 16px;max-width:660px;text-align:center;color:var(--muted);font:11px/1.6 monospace;letter-spacing:.35px}
.footer-motto .motto-pink{color:var(--pink)}
.footer-motto .motto-lilac{color:var(--lavender)}
.footer-motto .motto-yellow{color:var(--yellow)}
.footer-motto>span:last-child{flex-basis:100%;font-size:10px}
@media(max-width:700px){footer .footer-motto{order:3;flex-basis:100%;justify-content:flex-start;text-align:left;gap:7px 14px;font-size:10px}.footer-motto>span:last-child{font-size:9px}.signoff span{line-height:1.7}}