/* Bright, tactile studio portfolio: cream paper, vermilion and deep teal. */
:root{--bg:#fffaf0;--surface:#fffdf8;--ink:#164e44;--muted:#65776c;--line:#d8dfd0;--acid:#f35b32;--sun:#ffcc55}
body{background:var(--bg);color:var(--ink)}
body::before{content:'';display:block;height:13px;background:radial-gradient(circle,#f35b32 1.2px,transparent 1.4px) 0 0/8px 8px;border-top:5px solid #f35b32}
::selection{background:#ffcc55;color:#164e44}
header{min-height:117px;display:grid;grid-template-columns:1fr auto 1fr;gap:25px;border-bottom:1px solid var(--line);background:transparent}
header .brand{grid-column:2;grid-row:1;flex-direction:column;gap:2px;font-size:12px;color:#6a796c;letter-spacing:.12em}
header .logo{font-family:Arial,sans-serif;font-size:35px;font-weight:900;font-style:italic;letter-spacing:-2.5px;color:var(--ink);transform:rotate(-3deg)}
header .logo::after,footer .logo::after{color:var(--acid)}
header nav{grid-column:1;grid-row:1;gap:22px}nav a{font-size:13px;color:var(--ink)}nav a:hover{color:var(--acid)}nav a::after{background:var(--acid)}
.edition{grid-column:3;grid-row:1;justify-self:end;font-size:10px;color:var(--ink);letter-spacing:.1em}
.intro{padding:38px 0 39px}
.intro-identity{gap:13px}.intro-identity strong{font-size:27px;letter-spacing:.08em;color:var(--ink)}
.intro-identity strong::after{background:#ffd86f;left:-13%;right:-13%;height:9px;border-radius:50% 30% 40% 20%}
.intro-top .eyebrow{font-size:12px;letter-spacing:.04em;color:#68796c}
.intro h1{font-size:clamp(42px,5.3vw,72px);line-height:1.25;font-weight:750;letter-spacing:-.06em;margin:25px 0 23px;color:var(--ink)}
.outline{color:var(--ink)}h1 em{color:var(--acid)}h1 em::after{background:#ffde89;height:23%;border-radius:50% 30% 40% 20%;transform:rotate(-3deg)}h1 em:hover::after{height:72%;transform:rotate(-1deg)}.period{color:var(--acid)}
.intro-bottom p{color:#65766b;font-size:15px;line-height:1.9}.intro-bottom>span{color:#376555;font-size:12px}.intro-bottom b{color:#eaa57a}
.overview{gap:16px;margin-bottom:62px}
.category{border:1px solid #dfd8c8;border-radius:16px 16px 7px 7px;min-height:158px;padding:20px 24px;box-shadow:none;transition:transform .25s,box-shadow .25s,border-color .25s}
.category:hover{transform:translateY(-5px) rotate(-.5deg);box-shadow:0 8px 0 #154f4410;border-color:#e78c69}
.cat-ai,.cat-ai:hover{background:#fff0df;color:#a43c24}.cat-ip{background:#e8f2e8;color:#215e4a}.cat-text{background:#fff4cc;color:#786125}
.category strong{font-size:clamp(27px,2.7vw,35px);font-weight:650;letter-spacing:-.05em;padding:9px 0}
.category-meta{font-size:10px;letter-spacing:.08em;color:#906f58}.cat-ip .category-meta{color:#557662}.cat-text .category-meta{color:#897944}
.category-bottom,.cat-ip .category-bottom,.cat-text .category-bottom{color:inherit;font-size:12px;opacity:.85}
.category .plus{border:1px solid currentColor;border-radius:50%;width:28px;height:28px;font-size:22px}
.section-heading{border-top:1px solid var(--line);padding:25px 0}.section-heading .eyebrow{font-size:10px;color:#c36742;letter-spacing:.08em}.section-heading h2{font-size:30px;font-weight:650;color:var(--ink)}.section-heading p{color:#6d7b6a;font-size:13px}.accent{color:var(--acid)}
.video-card{grid-template-columns:1.25fr 1fr;border:1px solid #e5ddca;border-radius:12px;background:#fffdf7;box-shadow:none;overflow:hidden}
.video-card:hover{box-shadow:0 10px 28px #34523509;transform:translateY(-2px)}
.video-slate.illustrated,.ip-card .video-slate.illustrated{display:flex;align-items:center;background:#f8e6d1;padding:22px;min-height:0;border-right:0}
.ip-card .video-slate.illustrated{background:#dfece0}
.cover-illustration{display:block;width:100%;height:auto;min-height:0;aspect-ratio:3/2;object-fit:contain;border:8px solid #fffdf6;box-shadow:4px 6px 0 #795e3720;transform:rotate(-1.5deg);transition:transform .4s}
.ip-card .cover-illustration{transform:rotate(1.3deg)}.video-card:hover .cover-illustration{transform:rotate(0) scale(1.015)}
.project-info{padding:30px;gap:26px}.project-info h3{font-size:25px;font-weight:650;letter-spacing:-.035em}.project-info p{font-size:15px;color:#65735f;line-height:1.9}.project-details{border-color:var(--line);color:#65735f}
.work-link,.ip-card .work-link,.hit-card .work-link{background:#175a49;border:1px solid #175a49;color:#fffaf0;border-radius:999px;padding:11px 20px;font-size:13px;box-shadow:none;transition:background .2s,transform .2s}
.work-link:hover,.ip-card .work-link:hover,.hit-card .work-link:hover{background:#26775d;transform:translateY(-2px)}
.code-line{font-size:13px;color:#687863}.code-line code{color:#175a49}.copy-code{border-color:#c1ceb9;border-radius:999px;font-size:12px;padding:7px 12px;color:#39654b}.copy-code:hover{background:#eaf3e3}
.skill-tags span{background:#eef3e7;color:#507049;border-radius:999px;border:1px solid #d5dfca;font-size:11px;padding:4px 9px}
.ip-context h3{color:var(--ink)}.ip-context p,.video-note{color:#6d7b65}
.hit-grid{gap:20px;margin-bottom:26px}.hit-card{border:1px solid #e8d8c2;border-radius:12px;background:#fff1df;padding:28px;position:relative;overflow:hidden}
.hit-card:nth-child(2){background:#eff4e6;border-color:#d7e1c9}
.hit-badge{background:transparent;border:1px solid #c47b4d;border-radius:999px;color:#a45732;padding:4px 10px;font-size:11px}
.hit-card:nth-child(2) .hit-badge{border-color:#87a273;color:#58733f}
.hit-number{font-size:80px;color:#df5530;font-weight:750;letter-spacing:-.07em;line-height:1.05}.hit-number span{color:#e99250;font-size:45px}.hit-card:nth-child(2) .hit-number{color:#2c6650}.hit-card:nth-child(2) .hit-number span{color:#809b5c}
.hit-card h3{color:var(--ink);font-size:23px}.hit-card p{color:#757760;font-size:14px}
.editorial-card{border-color:#dde2d2;border-radius:0;padding-left:13px;padding-right:13px}.editorial-card:hover{background:#fff0dc}.editorial-card h3{font-size:20px;color:#315c46}.editorial-card p{color:#748069}.read-label{color:#b6522f;border-color:#e7ae83;font-size:12px}.year-heading,.year-label{color:#315c46}
.archive-group,.archive-group:last-child{border-color:#dce2d3}.archive-group summary:hover{color:#ca542f}.expand{color:#c26a3f}
footer{border-top:1px solid var(--line);color:#708065;padding-top:28px}footer .logo{color:var(--ink);font-size:25px;font-style:italic;letter-spacing:-1.5px}
@media(max-width:900px){header{grid-template-columns:1fr auto;gap:18px;min-height:105px}header .brand{grid-column:2}header nav{gap:17px}.edition{display:none}.project-info{padding:24px}.video-slate.illustrated,.ip-card .video-slate.illustrated{padding:17px}.category{padding:18px}.category strong{font-size:28px}}
@media(max-width:600px){
 header{display:flex;flex-direction:column;gap:20px;padding:23px 6% 20px}header .brand{gap:0}header .logo{font-size:32px}header nav{gap:30px}nav a{font-size:13px}
 .intro{padding:29px 0 32px}.intro-identity strong{font-size:25px}.intro-top .eyebrow{font-size:11px}.intro h1{font-size:41px;line-height:1.3;margin:24px 0}.intro-bottom p{font-size:14px}.intro-bottom>span{font-size:11px}
 .overview{grid-template-columns:1fr;gap:11px;margin-bottom:40px}.category{min-height:118px;padding:17px 20px;border-radius:10px}.category strong{font-size:28px}.category .plus{display:none}
 .video-card{grid-template-columns:1fr}.video-slate.illustrated,.ip-card .video-slate.illustrated{padding:20px}.cover-illustration{min-height:0;border-width:6px}.project-info{padding:24px}.project-info h3{font-size:23px}
 .hit-grid{grid-template-columns:1fr;gap:14px}.hit-card{padding:24px}.hit-number{font-size:70px}.hit-card h3{font-size:22px}.section-heading h2{font-size:27px}
}
@media(prefers-reduced-motion:reduce){.category:hover,.video-card:hover,.video-card:hover .cover-illustration,.ip-card .cover-illustration,.cover-illustration,.work-link:hover{transform:none}}

/* Individual AI films with direct Xiaohongshu viewing links. */
.ai-works{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:20px}.ai-work{display:flex;flex-direction:column;padding:26px;border:1px solid #e5ddca;border-radius:12px;background:#fff1df;transition:transform .2s}.ai-work:nth-child(2){background:#eaf2e8}.ai-work:nth-child(3){background:#fff5d7}.ai-work:hover{transform:translateY(-3px)}.ai-work-meta{display:flex;justify-content:space-between;gap:10px;color:#617665;font-size:11px;letter-spacing:.04em}.ai-work-meta span:last-child{font-size:23px;color:#c55b36}.ai-work h3{font-size:22px;line-height:1.5;color:var(--ink);margin:22px 0 12px;letter-spacing:-.03em}.ai-work p{font-size:14px;line-height:1.85;color:#65735f;margin:0 0 25px}.ai-work .work-link{margin-top:auto;align-self:flex-start;text-decoration:none}.ai-channel{font-size:12px;color:#65735f}@media(max-width:800px){.ai-works{grid-template-columns:1fr}.ai-work{padding:24px}.ai-work h3{margin-top:12px}}@media(prefers-reduced-motion:reduce){.ai-work:hover{transform:none}}
