:root { --black:#000; --near-black:#111; --white:#fff; --apple-gray:#f5f5f7; --mid:#6e6e73; --blue:#2997ff; --line:rgba(0,0,0,.1); --radius:28px; --font:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Helvetica Neue",Arial,sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:#1d1d1f; background:var(--white); font-family:var(--font); -webkit-font-smoothing:antialiased; }
img { display:block; width:100%; }
a { color:inherit; }
.skip-link { position:fixed; left:18px; top:-60px; z-index:100; padding:10px 14px; border-radius:8px; background:white; color:black; }
.skip-link:focus { top:12px; }
.glass { background:rgba(255,255,255,.72); border:1px solid rgba(31,38,53,.12); box-shadow:0 16px 50px rgba(65,74,106,.10),inset 0 1px 0 rgba(255,255,255,.88); backdrop-filter:blur(28px) saturate(145%); -webkit-backdrop-filter:blur(28px) saturate(145%); }
.global-header { position:fixed; inset:0 0 auto; z-index:20; padding:12px 18px; }
.header-inner { position:relative; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; width:min(1160px,100%); min-height:48px; margin:auto; padding:0 18px; border-radius:16px; color:#252936; }
.wordmark { font-size:15px; font-weight:600; letter-spacing:-.02em; text-decoration:none; }
.header-inner nav { display:flex; gap:32px; }
.header-inner nav a,.studio-link { font-size:12px; text-decoration:none; }
.header-inner nav a:hover,.studio-link:hover { color:#0066cc; }
.studio-link { justify-self:end; }
.mobile-menu-toggle,.header-inner .mobile-menu { display:none; }
.hero { position:relative; min-height:900px; overflow:hidden; color:#17191f; background:radial-gradient(circle at 83% 42%,rgba(255,232,164,.9) 0%,rgba(255,232,164,.28) 18%,transparent 38%),linear-gradient(128deg,#fffaf4 0%,#edf6ff 48%,#eee8ff 100%); }
.hero::before { content:""; position:absolute; inset:0; opacity:.28; background-image:linear-gradient(rgba(55,69,103,.10) 1px,transparent 1px),linear-gradient(90deg,rgba(55,69,103,.10) 1px,transparent 1px); background-size:48px 48px; mask-image:linear-gradient(90deg,transparent 8%,black 62%); }
.pixel-intro { position:absolute; z-index:3; top:50%; right:max(40px,calc((100vw - 1180px)/2)); width:500px; height:600px; transform:translateY(-44%); }
.speech-bubble { position:absolute; z-index:6; top:-48px; left:-28px; width:325px; color:#161719; font-family:ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace; font-size:15px; line-height:1.45; }
.speech-content,.speech-shadow { border-radius:18px; }
.speech-content { position:relative; z-index:2; padding:22px 24px; background:#fff; border:2px solid #252936; filter:drop-shadow(0 16px 20px rgba(72,78,119,.16)); }
.speech-content::after,.speech-shadow::after { content:""; position:absolute; right:31px; bottom:-12px; width:20px; height:20px; transform:rotate(45deg); }
.speech-content::after { background:#fff; border-right:2px solid #252936; border-bottom:2px solid #252936; }
.speech-shadow { display:none; }
.speech-shadow::after { background:#bdc8ff; }
.speech-bubble p { margin:0; }
.speech-bubble p+p { margin-top:8px; }
.avatar-illustration { position:absolute; right:-8px; bottom:-4px; width:390px; height:540px; animation:avatar-float 5.4s ease-in-out infinite; }
.avatar-illustration::before { content:""; position:absolute; inset:60px 5px 22px 6px; border:1px solid rgba(68,73,122,.14); border-radius:48% 52% 42% 58%; background:radial-gradient(circle at 48% 38%,rgba(255,255,255,.92),rgba(190,208,255,.5) 48%,rgba(197,179,248,.16) 72%,transparent 73%); box-shadow:inset 0 0 70px rgba(255,255,255,.56),0 24px 70px rgba(93,104,162,.13); }
.avatar-portrait { position:absolute; z-index:2; left:50%; bottom:-8px; width:445px; max-width:none; height:auto; transform:translateX(-50%); filter:drop-shadow(10px 18px 14px rgba(74,57,88,.2)); }
.avatar-pink { display:none; }
.avatar-art { display:none; }
.avatar-hair-back { transform-origin:210px 170px; animation:hair-breathe 5.4s ease-in-out infinite; }
.floating-tech { position:absolute; z-index:5; inset:0; pointer-events:none; }
.tech-object,.ux-question { position:absolute; z-index:5; display:block; filter:drop-shadow(0 14px 16px rgba(75,67,133,.15)); }
.tech-object svg { display:block; width:100%; overflow:visible; }
.ux-question { left:auto; right:0; top:335px; padding:13px 18px; border:2px solid #2d2a3f; border-radius:18px 18px 6px 18px; color:#2d2a3f; background:#fff; box-shadow:none; font-family:ui-monospace,"SFMono-Regular",Menlo,monospace; font-size:13px; font-weight:750; letter-spacing:-.025em; animation:future-drift 5.9s ease-in-out -.8s infinite alternate-reverse; }
.ux-question::after { content:""; position:absolute; left:13px; right:auto; bottom:-9px; width:14px; height:14px; border-left:2px solid #2d2a3f; border-bottom:2px solid #2d2a3f; background:#fff; transform:skew(-20deg) rotate(-37deg); }
.tech-robot { top:90px; right:-30px; width:82px; opacity:.9; animation:future-drift 5.2s ease-in-out infinite alternate; }
.tech-ai { left:-58px; bottom:128px; width:88px; animation:future-drift 5.7s ease-in-out -.5s infinite alternate-reverse; }
.tech-car { right:-54px; bottom:30px; width:150px; opacity:.92; animation:future-drift 5s ease-in-out -1.4s infinite alternate; }
@keyframes avatar-float { 0%,100% { translate:0 0; rotate:-.35deg; } 50% { translate:0 -9px; rotate:.5deg; } }
@keyframes hair-color-shift { 0%,18%,100% { opacity:0; } 38%,72% { opacity:1; } 90% { opacity:0; } }
@keyframes hair-breathe { 0%,100% { transform:scale(1); } 50% { transform:scale(1.012,1.006); } }
@keyframes token-float { from { translate:0 -5px; } to { translate:0 10px; } }
@keyframes future-drift { from { translate:0 -5px; rotate:-2deg; } to { translate:0 9px; rotate:3deg; } }
.hero-content { position:relative; z-index:4; display:flex; min-height:900px; flex-direction:column; justify-content:center; width:min(1180px,calc(100% - 48px)); margin:auto; padding:120px 0 110px; }
.hero h1 { max-width:640px; margin:0; font-size:clamp(58px,6.5vw,88px); font-weight:600; line-height:.96; letter-spacing:-.065em; }
.hero-links { display:flex; gap:28px; flex-wrap:wrap; margin-top:30px; }
.hero-links a,.studio-actions a { color:var(--blue); font-size:17px; text-decoration:none; }
.hero-links a:hover,.studio-actions a:hover { text-decoration:underline; text-underline-offset:4px; }
.series { padding:96px max(24px,5vw); background:var(--apple-gray); }
.section-title { max-width:820px; margin:0 auto 72px; text-align:center; }
.section-title h2,.writing-heading h2,.studio-card h2,.about h2 { margin:0; font-size:clamp(48px,5vw,72px); font-weight:600; line-height:1.04; letter-spacing:-.055em; }
.section-title>p { max-width:760px; margin:24px auto 0; color:#646469; font-size:18px; line-height:1.55; }
.episode-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:54px 24px; width:min(1280px,100%); margin:auto; }
.episode-card { min-width:0; overflow:hidden; border:1px solid rgba(25,26,33,.09); border-radius:24px; background:#fff; box-shadow:0 16px 42px rgba(57,58,68,.08); }
.episode-preview { position:relative; aspect-ratio:9/14.25; overflow:hidden; background:#111; }
.episode-preview iframe { position:absolute; z-index:1; top:-90px; left:-8%; display:block; width:116%; height:calc(100% + 350px); border:0; background:#111; overflow:hidden; }
.episode-placeholder { display:flex; height:100%; flex-direction:column; align-items:center; justify-content:center; padding:32px; color:#25232d; background:radial-gradient(circle at 50% 20%,rgba(255,255,255,.9),transparent 31%),linear-gradient(145deg,#efeaff,#dff8ff 65%,#fff0f7); text-align:center; text-decoration:none; }
.episode-placeholder strong { margin-top:18px; font-size:24px; line-height:1.08; letter-spacing:-.035em; }
.episode-placeholder small { max-width:220px; margin-top:9px; color:#6e6878; font-size:13px; line-height:1.4; }
.placeholder-play { display:grid; width:56px; height:56px; place-items:center; border:1px solid rgba(45,41,65,.2); border-radius:50%; background:rgba(255,255,255,.72); box-shadow:0 10px 28px rgba(91,75,169,.15); font-size:15px; }
.episode-meta { position:relative; z-index:4; margin-top:-92px; min-height:212px; padding:26px 24px 24px; border-top:1px solid rgba(0,0,0,.07); background:#fff; box-shadow:0 -12px 28px rgba(0,0,0,.06); }
.episode-hud { position:absolute; z-index:3; top:14px; right:14px; left:14px; display:flex; align-items:center; justify-content:space-between; gap:12px; pointer-events:none; }
.episode-number,.episode-likes { margin:0; padding:8px 11px; border:1px solid rgba(255,255,255,.56); border-radius:999px; color:#22232a; background:rgba(255,255,255,.84); box-shadow:0 8px 22px rgba(25,28,42,.13); font-size:11px; font-weight:750; letter-spacing:.04em; backdrop-filter:blur(16px) saturate(140%); }
.episode-kicker { margin:0 0 12px; color:#77777f; font-size:10px; font-weight:750; letter-spacing:.12em; }
.episode-meta h3 { min-height:54px; margin:0; font-size:24px; font-weight:650; line-height:1.08; letter-spacing:-.04em; }
.episode-more { display:flex; align-items:center; justify-content:space-between; width:100%; margin-top:22px; padding:15px 0 0; border:0; border-top:1px solid rgba(0,0,0,.1); color:#25262c; background:transparent; font:inherit; font-size:14px; font-weight:600; text-align:left; cursor:pointer; }
.episode-more b { display:grid; width:28px; height:28px; place-items:center; border:1px solid rgba(0,0,0,.12); border-radius:50%; font-size:15px; font-weight:400; }
.episode-more:hover { color:#004e93; }
.episode-dialog { width:min(590px,calc(100% - 32px)); max-height:min(720px,calc(100vh - 32px)); padding:50px; border:1px solid rgba(35,31,48,.16); border-radius:30px; color:#25232d; background:linear-gradient(145deg,#fff 45%,#fff1f8 100%); box-shadow:0 30px 110px rgba(35,27,62,.28); }
.episode-dialog::backdrop { background:rgba(19,18,24,.5); backdrop-filter:blur(9px); }
.episode-dialog[open] { animation:dialog-in .22s ease-out; }
.dialog-close { position:absolute; top:18px; right:18px; display:grid; width:38px; height:38px; place-items:center; border:1px solid rgba(0,0,0,.1); border-radius:50%; background:#fff; color:#24222b; font-size:25px; line-height:1; cursor:pointer; }
.dialog-part { display:inline-block; margin:0 0 18px; padding:8px 12px; border-radius:999px; color:#fff; background:#17171b; box-shadow:4px 4px 0 #f2a7cd; font-size:11px; font-weight:800; letter-spacing:.08em; }
.episode-dialog h2 { max-width:470px; margin:0; font-size:clamp(34px,5vw,50px); line-height:1; letter-spacing:-.05em; }
.dialog-summary { margin-top:24px; color:#5f5b65; font-size:17px; line-height:1.6; }
.dialog-summary p { margin:0; }
.dialog-instagram { display:inline-block; margin-top:28px; color:#066dcc; font-size:15px; text-decoration:none; }
.modal-open { overflow:hidden; }
@keyframes dialog-in { from { opacity:0; transform:translateY(14px) scale(.98); } to { opacity:1; transform:none; } }
.series-controls { display:flex; align-items:center; justify-content:center; gap:12px; margin-top:52px; }
.series-controls button { min-width:138px; padding:13px 18px; border-radius:999px; font:inherit; font-size:14px; cursor:pointer; }
.series-primary { border:1px solid #202126; color:#fff; background:#202126; }
.series-secondary { border:1px solid rgba(29,29,31,.16); color:#30323a; background:rgba(255,255,255,.78); }
.series-controls button:hover { transform:translateY(-1px); }
.center-link { margin-top:28px; text-align:center; }
.center-link a { color:#06c; font-size:17px; text-decoration:none; }
.mobile-episode-index { display:none; }
.writing { padding:96px 24px; color:#1d1d1f; background:linear-gradient(145deg,#f8f6f2 0%,#f1f5fb 52%,#f2edfa 100%); }
.writing-inner { width:min(1180px,100%); margin:auto; }
.writing-heading { max-width:760px; }
.writing-heading>p:last-child { max-width:590px; margin:20px 0 0; color:#65656b; font-size:18px; line-height:1.5; }
.article-card { display:grid; grid-template-columns:minmax(300px,.9fr) minmax(0,1.1fr); min-height:420px; margin-top:58px; overflow:hidden; border:1px solid rgba(42,45,60,.13); border-radius:30px; color:#1d1d1f; background:rgba(255,255,255,.78); box-shadow:0 24px 70px rgba(73,70,107,.10),inset 0 1px 0 rgba(255,255,255,.9); text-decoration:none; transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease; }
.article-card:hover { transform:translateY(-4px); border-color:rgba(78,72,141,.24); box-shadow:0 30px 80px rgba(73,70,107,.15),inset 0 1px 0 rgba(255,255,255,.92); }
.article-card-art { position:relative; display:grid; grid-template-columns:repeat(3,1fr); gap:12px; align-items:center; min-height:360px; padding:30px 22px; overflow:hidden; background:linear-gradient(145deg,#f5ede8,#e7edfa 55%,#eee8fa); }
.article-card-art::before { content:none; }
.mini-ui { position:relative; display:flex; min-width:0; height:220px; flex-direction:column; align-items:center; justify-content:center; border-radius:24px; }
.mini-ui small { position:absolute; top:17px; font-size:6.5px; font-weight:850; letter-spacing:.09em; }
.mini-skeuo { color:#f7e9c9; border:4px solid #6c4b36; background:linear-gradient(145deg,#67412b,#2b1b15); box-shadow:inset 0 0 0 2px rgba(255,255,255,.12),0 14px 25px rgba(78,55,43,.24); }
.mini-dial { display:block; width:76px; height:76px; border:9px solid #a49c89; border-radius:50%; background:radial-gradient(circle at 34% 28%,#f6f0e4,#5e5850 63%,#292622); box-shadow:inset 0 0 0 4px #332f29,0 9px 14px rgba(0,0,0,.38); }
.mini-glass { color:#fff; background:radial-gradient(circle at 20% 15%,#69ece0,transparent 35%),linear-gradient(145deg,#6157e8,#e174ab 70%,#f4c56e); }
.mini-glass::before { content:""; position:absolute; inset:37px 10px 30px; border:1px solid rgba(255,255,255,.58); border-radius:19px; background:rgba(255,255,255,.22); box-shadow:0 14px 30px rgba(52,35,104,.25),inset 0 1px rgba(255,255,255,.7); backdrop-filter:blur(16px); }
.mini-play { position:relative; z-index:1; display:grid; width:58px; height:58px; place-items:center; border:1px solid rgba(255,255,255,.55); border-radius:50%; background:rgba(255,255,255,.2); }
.mini-glass b { position:relative; z-index:1; }
.mini-neumo { color:#5a6171; background:#dde2eb; box-shadow:10px 10px 20px rgba(84,89,101,.26),-7px -7px 18px rgba(255,255,255,.8); }
.mini-toggle { display:block; width:82px; height:46px; padding:7px; border-radius:999px; background:#dde2eb; box-shadow:inset 6px 6px 12px #bbc0c9,inset -6px -6px 12px #fff; }
.mini-toggle i { display:block; width:32px; height:32px; margin-left:auto; border-radius:50%; background:#8375e6; box-shadow:3px 3px 7px #adb1bd,-2px -2px 6px #fff; }
.article-card-copy { display:flex; flex-direction:column; justify-content:center; padding:56px; }
.article-card-copy p { margin:0; color:#777780; font-size:10px; font-weight:750; letter-spacing:.12em; }
.article-card-copy h3 { margin:22px 0 0; font-size:clamp(34px,4vw,54px); line-height:1; letter-spacing:-.05em; }
.article-card-copy span { margin-top:30px; color:#315fbd; font-size:15px; }
.studio-section { padding:96px 24px; color:#1d1d1f; background:#fff; }
.studio-card { display:grid; grid-template-columns:minmax(0,1.08fr) minmax(310px,.92fr); gap:76px; align-items:center; width:min(1120px,100%); margin:auto; padding:68px; border:1px solid rgba(42,45,60,.12); border-radius:30px; background:linear-gradient(145deg,#fbfaf7 0%,#f3f6fb 58%,#f4effb 100%); box-shadow:0 24px 70px rgba(73,70,107,.09); }
.studio-card h2 { max-width:610px; margin-top:34px; font-size:clamp(46px,4.6vw,66px); }
.studio-brand { display:inline-flex; align-items:center; gap:13px; color:#1d1d1f; font-size:16px; font-weight:650; text-decoration:none; }
.studio-brand img { width:54px; height:auto; }
.studio-copy>p:not(.studio-eyebrow) { max-width:620px; margin:22px 0 0; color:#5d5d63; font-size:17px; line-height:1.62; }
.studio-actions { display:flex; gap:12px; flex-wrap:wrap; margin-top:34px; }
.studio-actions a { padding:13px 18px; border-radius:999px; font-size:14px; text-decoration:none; }
.studio-primary { color:#fff!important; background:#1f2025; }
.studio-secondary { border:1px solid rgba(29,29,31,.16); color:#30323a!important; background:rgba(255,255,255,.62); }
.studio-menu>p { margin:0 0 18px; color:#74747b; font-size:11px; font-weight:750; letter-spacing:.12em; text-transform:uppercase; }
.studio-services { border-top:1px solid rgba(29,29,31,.14); }
.studio-services div { display:grid; grid-template-columns:38px 1fr; align-items:center; padding:18px 0; border-bottom:1px solid rgba(29,29,31,.14); }
.studio-services span { color:#8a8990; font:700 10px/1 ui-monospace,"SFMono-Regular",Menlo,monospace; }
.studio-services p { margin:0; font-size:15px; font-weight:600; }
.studio-actions { display:flex; gap:28px; flex-wrap:wrap; margin-top:30px; }
.about { display:grid; grid-template-columns:minmax(360px,.8fr) minmax(0,1.2fr); gap:8vw; align-items:center; width:min(1180px,calc(100% - 48px)); margin:auto; padding:96px 0; }
.about-photo { overflow:hidden; border-radius:var(--radius); background:#eee; }
.about-photo img { height:660px; object-fit:cover; object-position:center top; }
.about-copy { max-width:670px; }
.about-copy h2 { margin-bottom:30px; }
.about-copy>p:not(.overline) { color:var(--mid); font-size:17px; line-height:1.6; }
.about-copy .about-lede { color:#1d1d1f; font-size:21px; }
.social-links { display:flex; gap:24px; flex-wrap:wrap; margin-top:28px; }
.social-links a { color:#06c; font-size:15px; text-decoration:none; }
footer { display:grid; grid-template-columns:1fr auto; gap:24px; align-items:start; padding:42px max(24px,5vw) 28px; color:#a1a1a6; background:#111; }
footer>div { display:flex; gap:20px; }
footer>div a { font-size:12px; text-decoration:none; }
footer small { grid-column:1/-1; padding-top:22px; border-top:1px solid #2e2e31; font-size:11px; }
@media(max-width:980px){ .pixel-intro{right:-35px;scale:.82;} .hero h1{max-width:530px;} .episode-grid{grid-template-columns:repeat(2,minmax(0,1fr));} .studio-card{grid-template-columns:1fr;gap:48px}.studio-menu{max-width:620px}.about{grid-template-columns:1fr 1fr;gap:5vw;} }
@media(max-width:720px){ .global-header{padding:8px;} .header-inner{grid-template-columns:1fr auto;min-height:46px;padding:0 14px;} .header-inner nav{display:none;} .studio-link{font-size:0}.studio-link::after{content:"Studio ↗";font-size:11px}.hero,.hero-content{min-height:760px;} .hero-content{width:calc(100% - 36px);justify-content:flex-end;padding:500px 0 52px;} .pixel-intro{top:74px;right:0;width:100%;height:430px;transform:none;scale:1;} .speech-bubble{top:0;left:18px;width:calc(100% - 92px);max-width:292px;font-size:11px;line-height:1.45;} .speech-content,.speech-shadow{border-radius:14px}.speech-content{padding:15px 16px}.speech-shadow{translate:8px 9px}.avatar-illustration{right:50%;bottom:-7px;width:250px;height:345px;transform:translateX(56%)} .avatar-portrait{width:286px;bottom:-4px;} .ux-question{left:12px;top:205px;padding:9px 11px;font-size:9px;box-shadow:none}.tech-ai{left:8px;bottom:40px;width:58px}.hero h1{max-width:100%;font-size:clamp(46px,13.4vw,62px);line-height:.94}.hero-links{gap:18px;margin-top:24px}.hero-links a{font-size:15px}.series{padding:86px 16px 96px;} .section-title{margin:0 2px 46px;text-align:left;} .section-title h2,.writing-heading h2,.about h2{font-size:43px}.section-title>p{margin-top:18px;font-size:15px;line-height:1.55}.episode-grid{grid-template-columns:1fr;gap:32px;} .episode-card{width:100%;max-width:430px;margin:auto;border-radius:20px}.episode-preview{border-radius:0}.episode-meta{min-height:196px;margin-top:-88px;padding:23px 20px 21px}.episode-kicker{font-size:9px}.episode-meta h3{min-height:0;font-size:25px}.episode-more{margin-top:20px}.series-controls{flex-direction:column;margin-top:38px}.series-controls button{width:min(280px,100%)}.episode-dialog{padding:44px 24px 30px;border-radius:24px}.writing{padding:86px 16px;} .writing-heading>p:last-child{font-size:16px}.article-card{grid-template-columns:1fr;min-height:0;margin-top:42px;border-radius:22px}.article-card-art{min-height:280px;padding:24px 14px;gap:8px}.mini-ui{height:190px;border-radius:18px}.mini-ui small{font-size:5.4px}.article-card-copy{padding:31px 22px 36px}.article-card-copy h3{font-size:35px}.studio-section{padding:82px 16px;} .studio-card{grid-template-columns:1fr;gap:42px;padding:32px 22px;border-radius:22px}.studio-brand{font-size:15px}.studio-brand img{width:46px}.studio-card h2{margin-top:28px;font-size:40px;line-height:1.02}.studio-copy>p:not(.studio-eyebrow){font-size:15.5px;line-height:1.58}.studio-actions{flex-direction:column;gap:10px}.studio-actions a{text-align:center}.studio-menu>p{margin-bottom:12px}.studio-services div{padding:16px 0}.about{grid-template-columns:1fr;width:calc(100% - 32px);padding:86px 0;} .about-photo img{height:420px;} footer{grid-template-columns:1fr;} footer>div{flex-direction:column;} }
@media(max-width:720px){
  .global-header{padding:8px}
  .header-inner{grid-template-columns:1fr auto;min-height:46px;padding:0 14px}
  .header-inner nav:not(.mobile-menu),.studio-link{display:none}
  .mobile-menu-toggle{display:flex;height:46px;align-items:center;gap:9px;padding:0;border:0;color:#252936;background:transparent;font:inherit;font-size:11px;line-height:1;cursor:pointer}
  .mobile-menu-toggle i{position:relative;display:block;width:18px;height:18px}
  .mobile-menu-toggle i::before,.mobile-menu-toggle i::after{content:"";position:absolute;top:8px;left:1px;display:block;width:16px;height:1px;background:#252936;transition:transform .2s ease}
  .mobile-menu-toggle i::before{transform:translateY(-3px)}
  .mobile-menu-toggle i::after{transform:translateY(3px)}
  .mobile-menu-toggle[aria-expanded="true"] i::before{transform:rotate(45deg)}
  .mobile-menu-toggle[aria-expanded="true"] i::after{transform:rotate(-45deg)}
  .header-inner .mobile-menu{position:absolute;top:54px;right:0;left:0;display:grid;gap:0;padding:8px;border:1px solid rgba(31,38,53,.12);border-radius:18px;background:#fff;box-shadow:0 18px 44px rgba(65,74,106,.18)}
  .mobile-menu[hidden]{display:none}
  .mobile-menu a{padding:14px 12px;border-bottom:1px solid rgba(0,0,0,.08);font-size:15px;font-weight:600;text-decoration:none}
  .mobile-menu a:last-child{border-bottom:0}
  .hero,.hero-content{min-height:714px}
  .hero-content{width:calc(100% - 36px);justify-content:flex-end;padding:492px 0 28px}
  .ux-question{top:207px;right:3px;left:auto;padding:9px 11px;font-size:9px;box-shadow:none}
  .series{padding:54px 16px 52px}
  .section-title{margin:0 2px 30px}
  .center-link{margin-top:22px}
  .writing{padding:54px 16px 56px}
  .article-card{margin-top:34px}
  .studio-section{padding:54px 16px}
  .about{padding:58px 0 64px}
}
@media(max-width:720px){
  .episode-grid,.series-controls{display:none}
  .mobile-episode-index{display:block;overflow:hidden;border:1px solid rgba(25,26,33,.1);border-radius:20px;background:#fff;box-shadow:0 14px 36px rgba(57,58,68,.07)}
  .mobile-index-label{margin:0;padding:18px 18px 14px;border-bottom:1px solid rgba(0,0,0,.09);color:#707078;font-size:10px;font-weight:750;letter-spacing:.12em;text-transform:uppercase}
  .mobile-episode-row{border-bottom:1px solid rgba(0,0,0,.09)}
  .mobile-episode-row:last-child{border-bottom:0}
  .mobile-episode-toggle{display:grid;grid-template-columns:34px minmax(0,1fr) auto 30px;gap:9px;align-items:center;width:100%;min-height:68px;padding:12px 13px;border:0;color:#1d1d1f;background:#fff;font:inherit;text-align:left;cursor:pointer}
  .mobile-part{display:grid;width:30px;height:30px;place-items:center;border-radius:50%;color:#fff;background:#202126;font-size:10px;font-weight:750}
  .mobile-title{font-size:14px;font-weight:650;line-height:1.2;letter-spacing:-.015em}
  .mobile-likes{color:#717178;font-size:10px;white-space:nowrap}
  .mobile-chevron{display:grid;width:28px;height:28px;place-items:center;border:1px solid rgba(0,0,0,.12);border-radius:50%;font-size:15px;transition:transform .2s ease}
  .mobile-episode-row.is-open .mobile-chevron{transform:rotate(45deg)}
  .mobile-episode-panel{padding:0 13px 18px;background:#f7f7f9}
  .mobile-player{position:relative;aspect-ratio:9/14;overflow:hidden;border-radius:14px;background:#111}
  .mobile-player iframe{position:absolute;top:-88px;left:-8%;width:116%;height:calc(100% + 320px);border:0}
  .mobile-summary,.mobile-unavailable{display:block;width:100%;margin-top:12px;padding:13px;border:1px solid rgba(0,0,0,.12);border-radius:999px;color:#202126;background:#fff;font:inherit;font-size:13px;font-weight:600;text-align:center;text-decoration:none}
  .mobile-list-more{display:block;width:calc(100% - 26px);margin:13px;padding:14px;border:1px solid rgba(0,0,0,.14);border-radius:999px;color:#fff;background:#202126;font:inherit;font-size:13px;font-weight:650;cursor:pointer}
  .center-link{margin-top:22px}
  .center-link a{font-size:15px}
}
@media(prefers-reduced-motion:reduce){ html{scroll-behavior:auto;} .avatar-illustration,.avatar-hair-back,.avatar-pink,.tech-object,.ux-question{animation:none;} .avatar-pink{opacity:0;} }
