:root{--paper:#fff;--ink:#111112;--mute:#6c6c72;--rule:#e6e6e6;--sans:"Helvetica Neue",Helvetica,Arial,sans-serif;--serif:Georgia,"Times New Roman",serif;--mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:#45454a;font:400 17px/1.7 var(--sans);-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}a:hover{color:#111}img{max-width:100%;display:block}button,a{-webkit-tap-highlight-color:transparent}:focus-visible{outline:2px solid #555;outline-offset:5px;border-radius:3px}.shell{max-width:1120px;margin:auto;padding-inline:clamp(20px,4vw,40px)}.topbar{display:flex;align-items:baseline;justify-content:space-between;gap:24px;padding-block:26px;color:var(--ink)}.topbar a{font-size:14px}.name{font-weight:500}.nav{display:flex;gap:24px}.nav a:hover,.name:hover{color:#777}.mono,.eyebrow,.meta dt,.caption,.draft-note,.next-label{font:400 11px/1.5 var(--sans);letter-spacing:.01em;color:#85858b}.case-hero{max-width:640px;margin:auto;padding-block:72px 48px}.eyebrow{display:flex;justify-content:space-between;gap:20px;margin:0 0 26px}.eyebrow a{color:#777}.draft-note{color:#999}h1{font:400 clamp(36px,5vw,52px)/1.1 var(--serif);color:var(--ink);letter-spacing:-.035em;margin:0 0 22px;text-wrap:balance}.subtitle{font-size:20px;line-height:1.5;letter-spacing:-.015em;color:#666;margin:0 0 32px}.intro-grid{display:flex;flex-direction:column;gap:28px}.meta{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:0;padding-top:18px;border-top:1px solid var(--rule)}.meta dt{margin-bottom:5px}.meta dd{margin:0;color:#4d4d52;font-size:13px;line-height:1.45}.overview{font-size:17px;line-height:1.7;margin:0}.cover{margin:0 0 48px;overflow:hidden;border-radius:12px;background:#f3f3f2}.cover img{width:100%;max-height:640px;object-fit:contain;aspect-ratio:16/9}.reading{display:block}.contents{display:flex;flex-wrap:wrap;gap:10px 20px;font-size:12px;line-height:1.5;color:#85858b;padding-block:20px 0;margin:0 auto 64px;max-width:640px}.contents a{display:block}.contents a:hover{color:#111}.chapters{min-width:0}.chapter{scroll-margin-top:32px;margin-bottom:80px}.chapter h2,.takeaway h2{max-width:640px;margin:8px auto 22px;font:400 clamp(27px,3.5vw,34px)/1.2 var(--serif);letter-spacing:-.025em;color:var(--ink);text-wrap:balance}.chapters p,.chapters ul{max-width:640px;margin:0 auto 20px}.chapters ul{padding-left:20px}.chapters li{margin-block:8px}.chapter-num{max-width:640px;display:block;margin:0 auto 10px;color:#999;font-size:11px}.case-figure{margin:40px 0 0}.case-figure img{width:100%;height:auto;max-height:1200px;object-fit:contain;margin:auto;border-radius:10px;background:#f4f4f2}.case-figure figcaption{max-width:640px;margin:14px auto 0;color:#77777e;font-size:13px;line-height:1.55}.image-link{display:block}.image-link:hover img{opacity:.96}.takeaway{padding-block:8px 24px}.takeaway p{font-size:18px;line-height:1.65}.project-site{display:inline-flex;align-items:center;gap:6px;margin-top:16px;font-size:13px;color:#777}.project-site:hover{color:#111}.end-nav{max-width:640px;margin:48px auto 64px;border-top:1px solid var(--rule);padding-top:20px;display:flex;align-items:baseline;justify-content:space-between;gap:24px}.next-title{font-size:16px;line-height:1.4;letter-spacing:-.015em;color:#333}.next-title:hover{color:#777}.foot{display:flex;justify-content:space-between;gap:24px;padding-block:24px;border-top:1px solid var(--rule);color:#888;font:400 12px/1.5 var(--sans)}.foot a:hover{color:#222}@media(max-width:680px){body{font-size:16px}.nav{gap:18px}.topbar{padding-block:22px}.case-hero{padding-top:44px}.eyebrow{flex-wrap:wrap}.meta{gap:16px}.meta dd{font-size:12px}.cover{margin-bottom:30px;border-radius:9px}.cover img{aspect-ratio:4/3}.contents{margin-bottom:48px;gap:10px 18px}.chapter{margin-bottom:60px}.subtitle{font-size:19px}.end-nav{align-items:start;flex-direction:column;gap:8px;margin-bottom:48px}.foot{flex-wrap:wrap}.chapters p{overflow-wrap:anywhere}.case-figure img{border-radius:8px}}.placeholder-banner{max-width:640px;margin:0 auto 32px;padding:14px 16px;border:1px solid var(--rule);border-radius:10px;background:#f6f6f4;color:#3f3f44;font-size:14px;line-height:1.55}
body.tiktok-case{--paper:#fafaf8;--ink:#0d0d0e;--mute:#6b6b70;--rule:#d9d9d4;background:#fafaf8;color:#3f3f44}
body.tiktok-case h1,body.tiktok-case h2,body.tiktok-case .meta-strip dd,body.tiktok-case .gate-form label{color:#0d0d0e}
body.tiktok-case .subtitle,body.tiktok-case .overview,body.tiktok-case .case-note,body.tiktok-case .example-figure figcaption{color:#3f3f44}
body.tiktok-case .eyebrow,body.tiktok-case .eyebrow a,body.tiktok-case .draft-note,body.tiktok-case .chapter-num,body.tiktok-case .contents,body.tiktok-case .contents a,body.tiktok-case .next-label,body.tiktok-case .foot,body.tiktok-case .meta-strip dt,body.tiktok-case .outcome-note,body.tiktok-case .gate-access{font-size:12px;line-height:1.45;color:#6b6b70}
body.tiktok-case .chapter,body.tiktok-case .gate-form,body.tiktok-case .gate-error,body.tiktok-case .gate-access,body.tiktok-case .case-note,body.tiktok-case .outcome-note,body.tiktok-case .example-figure figcaption{max-width:640px;margin-left:auto;margin-right:auto}
body.tiktok-case .meta-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;max-width:640px;margin:8px auto 0;padding-top:18px;border-top:1px solid #d9d9d4}
body.tiktok-case .meta-strip:has(div:nth-child(4)){grid-template-columns:repeat(4,minmax(0,1fr))}
body.tiktok-case .meta-strip dt{margin:0 0 6px;font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace;letter-spacing:.02em}
body.tiktok-case .meta-strip dd{margin:0;font-size:14px;line-height:1.45}
body.tiktok-case .example-figure{max-width:1040px;margin:8px auto 36px}
body.tiktok-case .example-frame{position:relative;background:#eeeeea;border:1px solid #d9d9d4;border-radius:12px;overflow:hidden}
body.tiktok-case .example-frame img,body.tiktok-case .example-frame svg{display:block;width:100%;height:auto}
body.tiktok-case .example-badge{position:absolute;z-index:1;top:12px;left:12px;padding:4px 8px;background:#0d0d0e;color:#fafaf8;font:400 12px/1.4 ui-monospace,"SF Mono",Menlo,Consolas,monospace;letter-spacing:.04em}
body.tiktok-case .example-figure figcaption{margin-top:14px;font-size:14px;line-height:1.55}
body.tiktok-case .case-note{margin-top:8px;margin-bottom:28px;font-size:14px;line-height:1.55}
body.tiktok-case .outcome-note{margin-bottom:20px;font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace}
body.tiktok-case .accent,body.tiktok-case .gate-access a{color:#2E5E7E;text-decoration:underline;text-underline-offset:2px}
body.tiktok-case .accent:hover,body.tiktok-case .gate-access a:hover{color:#0d0d0e}
body.tiktok-case .gate-access{display:flex;align-items:center;gap:6px;margin-top:8px;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif}
body.tiktok-case .work-lock{display:block;width:16px;height:16px;flex:0 0 auto}
body.tiktok-case .gate-form{display:flex;flex-direction:column;align-items:flex-start;gap:8px;margin-top:28px}
body.tiktok-case .gate-form label{font-size:14px}
body.tiktok-case .gate-error{display:flex;align-items:flex-start;gap:8px;margin-top:28px;margin-bottom:0;color:#7a1f1f;font-size:14px;font-weight:500;line-height:1.45}
body.tiktok-case .gate-error-icon{width:16px;height:16px;flex:0 0 auto;margin-top:2px}
body.tiktok-case .gate-form input{box-sizing:border-box;width:min(100%,320px);min-height:44px;padding:10px 12px;color:#0d0d0e;background:#fff;border:1px solid #45454a;border-radius:6px;font:400 16px/1.4 "Helvetica Neue",Helvetica,Arial,sans-serif}
body.tiktok-case .gate-form button{min-height:44px;padding:10px 16px;color:#fafaf8;background:#0d0d0e;border:0;border-radius:6px;cursor:pointer;font:500 14px/1.2 "Helvetica Neue",Helvetica,Arial,sans-serif}
@media(max-width:680px){body.tiktok-case .meta-strip{grid-template-columns:1fr 1fr}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
