/* A screen-printed poster language: vivid ink, solid color, hard edges. */
:root{--paper:#fffbed;--ink:#191e19;--lime:#c5ff47;--muted:#53564c;--line:#191e1955;--pop-pink:#ff8fc5;--pop-yellow:#ffdc55;--pop-cyan:#70d8f1}
[data-tone="film"]{--tone:#174d36;--tone-wash:#b9f45b;--tone-soft:#c5ff47;--tone-border:var(--ink)}
[data-tone="music"]{--tone:#164b59;--tone-wash:#70d8f1;--tone-soft:#70d8f1;--tone-border:var(--ink)}
[data-tone="animation"]{--tone:#672247;--tone-wash:#ff9acb;--tone-soft:#ff9acb;--tone-border:var(--ink)}
[data-tone="commercial"]{--tone:#5f460b;--tone-wash:#ffdc55;--tone-soft:#ffdc55;--tone-border:var(--ink)}
[data-tone="banjihaban"]{--tone:#692617;--tone-wash:#ff9b73;--tone-soft:#ff9b73;--tone-border:var(--ink)}
[data-tone="church"]{--tone:#164e35;--tone-wash:#8ce4b6;--tone-soft:#8ce4b6;--tone-border:var(--ink)}
[data-tone="idoltop"]{--tone:#61251b;--tone-wash:#ffb29b;--tone-soft:#ffb29b;--tone-border:var(--ink);--tone-block:#ff795b}
[data-tone="trainees"]{--tone:#194934;--tone-wash:#c3ee83;--tone-soft:#c5ff47;--tone-border:var(--ink)}
[data-tone="kisieun"]{--tone:#30491a;--tone-wash:#d0f575;--tone-soft:#d0f575;--tone-border:var(--ink)}
[data-tone="hajuwoo"]{--tone:#164d42;--tone-wash:#76e4cb;--tone-soft:#76e4cb;--tone-border:var(--ink)}
[data-tone="nambada"]{--tone:#24446b;--tone-wash:#8bcaff;--tone-soft:#8bcaff;--tone-border:var(--ink)}
[data-tone="banrieul"]{--tone:#5b4510;--tone-wash:#ffdb66;--tone-soft:#ffdb66;--tone-border:var(--ink)}
[data-tone="choisireun"]{--tone:#652349;--tone-wash:#ffa1d0;--tone-soft:#ffa1d0;--tone-border:var(--ink)}
[data-tone="domina"]{--tone:#63291a;--tone-wash:#ffad88;--tone-soft:#ffad88;--tone-border:var(--ink)}
[data-tone="mahiji"]{--tone:#414d17;--tone-wash:#d7e975;--tone-soft:#d7e975;--tone-border:var(--ink)}
[data-tone="recognition"]{--tone:#54450c;--tone-wash:#ffe36c;--tone-soft:#ffe36c;--tone-border:var(--ink)}
body{background:var(--paper)}
::selection{background:var(--pop-pink);color:var(--ink)}
[data-tone] :is(button,a):focus-visible,button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #204de0;outline-offset:4px}
.header{border-bottom:3px solid var(--ink);height:98px}
.wordmark{font-weight:950;letter-spacing:-3px}
.wordmark>span{color:#f45b9f;text-shadow:1px 1px 0 var(--ink)}
.header nav{gap:10px}
.header nav a{background:var(--paper);border:2px solid var(--ink);padding:7px 11px;box-shadow:2px 2px 0 var(--ink);font-weight:750;transition:transform .15s,box-shadow .15s}
.header nav a:hover{opacity:1;transform:translate(-1px,-1px);box-shadow:3px 3px 0 var(--ink);background:var(--lime)}
.header nav .nav-contact{background:var(--pop-pink)}
.header-name{border-color:var(--ink)}

/* The opening is a single, instantly recognizable poster. */
.hero{position:relative;isolation:isolate;padding:29px 34px 28px;margin-top:25px;margin-bottom:36px;background:var(--pop-yellow);border:3px solid var(--ink);box-shadow:8px 8px 0 var(--ink)}
.hero::after{content:'';position:absolute;inset:0 0 0 auto;width:37%;background-image:radial-gradient(var(--ink) 1px,transparent 1px);background-size:8px 8px;opacity:.15;mask-image:linear-gradient(to right,transparent,#000);z-index:-1;pointer-events:none}
.hero-kicker{font-weight:500;letter-spacing:.7px}
.live-dot{background:var(--ink);box-shadow:0 0 0 4px var(--paper);border:1px solid var(--ink)}
.hero-location{color:var(--ink)}
.hero h1{font-size:clamp(84px,10.4vw,156px);font-weight:950;letter-spacing:-.08em;line-height:.91;margin:31px 0 24px}
.hero .second-line{color:var(--lime);-webkit-text-stroke:2px var(--ink);text-shadow:4px 4px 0 var(--ink)}
.hero .period{color:var(--pop-pink)}
.hero-sticker{right:2%;top:-8px;transform:rotate(12deg)}
.hero-sticker svg{fill:var(--pop-pink);stroke:var(--ink);stroke-width:1.5px;filter:drop-shadow(4px 4px 0 var(--ink))}
.hero-sticker>span{color:var(--ink);-webkit-text-stroke:0;text-shadow:none;font-weight:600}
.hero-bottom{margin-top:25px}
.hero-credit{font-weight:800}
.hero-credit small{color:var(--ink)}
.hero-feature-link{background:var(--pop-pink);border:2px solid var(--ink);border-radius:0;box-shadow:3px 3px 0 var(--ink);padding:6px 11px;transform:rotate(-2deg);margin-bottom:6px}
.hero-feature-link:hover{background:var(--lime)}
.hero-feature-link>strong{font-weight:800}
.round-link{background:var(--paper);border:2px solid var(--ink);box-shadow:3px 3px 0 var(--ink);font-weight:800}
.round-link:hover{transform:translate(-1px,-1px)}

.work{border-top:0;padding-top:15px}
.section-heading h2{font-weight:850;letter-spacing:-1.7px}
.heading-star{color:#e6509b;text-shadow:1px 1px 0 var(--ink);transform:rotate(10deg)}
.section-index{color:var(--ink);font-weight:500}
.spotlight-intro p,.ongoing-intro{color:var(--muted)}
.spotlight{border:3px solid var(--ink);border-radius:0;box-shadow:5px 5px 0 var(--ink)}
.spotlight-copy>strong,.spotlight-0 .spotlight-copy>strong{font-weight:850}
.spotlight-label>span{border:1px solid var(--ink);background:var(--tone-wash);color:var(--ink);font-weight:600;border-radius:0}
.spotlight-0 .spotlight-copy>small{display:inline-block;background:var(--lime);color:var(--ink);padding:6px 8px;border:1px solid var(--ink);font-weight:600;letter-spacing:.5px}
.spotlight-0.is-latest .spotlight-copy>small{color:var(--ink)}
.spotlight-0 .play-round{border:2px solid var(--ink);box-shadow:2px 2px 0 var(--ink)}
.spotlight-honor>span{border-radius:0;background:var(--pop-yellow);color:var(--ink);border:1px solid var(--ink);font-weight:600}

/* Entire sections are colored panels, while the footage keeps its own colors. */
.channel-project[data-tone],.trainee-project,.collection,.recognition,.channels-page main.wrap,.about{border:3px solid var(--ink);border-radius:0;box-shadow:7px 7px 0 var(--ink)}
.channel-project[data-tone]{background:var(--tone-block);color:var(--ink)}
.channel-project-copy h3{font-weight:900;letter-spacing:-1.8px}
.channel-project-copy h3>span,.channel-project .project-eyebrow{color:var(--ink)}
.channel-project-stats>strong{font-weight:850}
.channel-project-stats>span,.channel-preview-wall button>small{color:#40241a}
.project-archive-link{font-weight:750}
.channel-preview-image{border:2px solid var(--ink);border-radius:0;box-shadow:3px 3px 0 var(--ink)}
.channel-preview-image svg{background:var(--lime);border:2px solid var(--ink);color:var(--ink);box-shadow:2px 2px 0 var(--ink)}
.channel-preview-wall button>strong{font-weight:750}
.trainee-project{background:#173f34}
.trainee-project-heading h3{font-weight:800}
.trainee-project-heading h3 em{color:var(--lime)}
.trainee-project-heading p,.trainee-project .project-eyebrow{color:#d1e9c0}
.trainee-project-heading a{font-weight:650}
.trainee-project a:focus-visible{outline-color:var(--lime)}
.trainee-cover-image{border:2px solid var(--ink);border-bottom:4px solid var(--tone-soft);border-radius:0}
.trainee-cover-image img{filter:none}
.trainee-cover-image>small{background:var(--tone-soft);color:var(--ink);border:1px solid var(--ink);border-radius:0;font-weight:500}
.trainee-cover>strong{display:inline-block;color:var(--ink);background:var(--tone-soft);font-size:15px;font-weight:800;padding:4px 7px;margin-top:10px;border:2px solid var(--ink);box-shadow:2px 2px 0 var(--ink)}
.trainee-cover>strong::before{background:var(--ink);width:4px;height:4px;margin-right:5px}
.trainee-cover>span:last-child{color:#d1e9c0}
.trainee-project-bottom{border-color:#d1e9c066;color:#d1e9c0}
.trainee-project-bottom>a{color:var(--lime);font-weight:650}
.recognition{background:var(--tone-wash)}
.recognition-heading h2{font-weight:850}
.recognition-kicker,.recognition-heading>div>p,.recognition-stats span,.recognition-film>span,.recognition-wins li>span,.recognition-card-bottom>p,.recognition-footnote{color:#494326}
.recognition-stats strong{font-weight:850}
.recognition-grid{border-top:2px solid var(--ink)}
.recognition .recognition-card{border-bottom:1px solid #191e1966}
.recognition-film>strong{font-weight:800}
.recognition-wins li>strong{font-weight:700}
.recognition-invite{color:#2f4921}
.recognition-card-bottom>button{color:var(--ink);font-weight:750}
.recognition-footnote{border-color:var(--ink)}
.recognition-stats>div{border-color:#191e1955}

.collection{margin-top:28px}
.collection+.collection{border-top:3px solid var(--ink)}
.collection-heading{border-bottom:2px solid var(--ink)}
.collection-heading h3{color:var(--ink);font-weight:850}
.collection-heading h3 sup{color:var(--ink)}
.collection-index{border:2px solid var(--ink);border-radius:0;background:var(--paper);box-shadow:2px 2px 0 var(--ink);color:var(--ink);font-weight:600}
.collection-heading p,.collection-description,.collection .film-subtitle{color:var(--tone)}
.work-toolbar{border-bottom:2px solid var(--ink)}
.filters{gap:8px;padding-bottom:9px}
.filters button{border:2px solid var(--ink);border-radius:0;font-weight:700;box-shadow:2px 2px 0 var(--ink);transition:transform .15s,box-shadow .15s}
.filters button[data-tone]{border-color:var(--ink);color:var(--ink);background:var(--tone-wash)}
.filters button.active,.filters button[data-tone].active{background:var(--ink);border-color:var(--ink);color:var(--paper);box-shadow:2px 2px 0 #e6509b}
.filters button[data-tone]::before{background:var(--ink)}
.filters button[data-tone].active::before{background:var(--tone-soft)}
.film-open{background:var(--paper);border:2px solid var(--ink);box-shadow:3px 3px 0 var(--ink);transition:transform .2s,box-shadow .2s}
.film-open:hover{transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--ink)}
.film-cover{border-radius:0}
.film-caption{border-top:2px solid var(--ink);margin:0;padding:10px 9px 11px;gap:8px}
.film-caption strong{font-weight:750}
.film-number,.film-arrow{color:var(--ink)}
.film-honor{background:var(--pop-yellow);color:var(--ink);border:1px solid var(--ink);border-radius:0;font-weight:650}
.film-duration,.film-tag,.social-duration{border:1px solid var(--ink);border-radius:0;background:var(--paper);color:var(--ink);font-weight:500;backdrop-filter:none}

.marquee{margin-block:12px;background:var(--lime);border-block:3px solid var(--ink)}
.marquee>div{font-weight:900}
.about{background:#8bcaff;padding:30px;margin-block:36px 48px}
.about .section-label{color:#243849}
.about h2{font-weight:850}
.about h2 span{background:var(--pop-pink);padding:0 5px;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.about-copy p.muted{color:#2d455c}
.practice-tags span{background:var(--paper);color:var(--ink);border:2px solid var(--ink);border-radius:0;font-weight:650;box-shadow:2px 2px 0 var(--ink)}
.contact{background:var(--pop-pink);color:var(--ink);border-block:3px solid var(--ink)}
.contact-top,.contact-bottom button{color:var(--ink)}
.contact-title{font-weight:900}
.contact-title>span,.contact-bottom>a span{color:var(--ink)}
.contact-title:hover{color:#325d37}
.contact-bottom{border-color:var(--ink)}
.contact-bottom>a{font-weight:750}
.footer{color:var(--ink)}

/* Carry the same visual language through channel discovery and the player. */
.library-header{border-bottom:3px solid var(--ink)}
.library-header>a:last-child{font-weight:700}
.channels-page main.wrap{background:var(--tone-wash)}
.series-switch button[data-tone]{border:2px solid var(--ink);color:var(--ink);border-radius:0;box-shadow:2px 2px 0 var(--ink);font-weight:700;transition:transform .15s,box-shadow .15s}
.series-switch button[data-tone].active{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.library-hero{border-bottom:2px solid var(--ink)}
.library-hero h1{font-weight:900}
.library-hero h1>span{color:var(--ink)}
.library-hero-count>strong{font-weight:850;color:var(--ink)}
.library-hero-covers>img{border:2px solid var(--ink);border-radius:0;box-shadow:3px 3px 0 var(--ink);filter:none}
.member-selector{padding-bottom:27px;border-color:var(--ink)}
.member-pill{border:2px solid transparent;border-radius:0}
.member-pill.active{border:2px solid var(--ink);box-shadow:3px 3px 0 var(--ink)}
.member-pill.active>span{color:var(--ink);font-weight:800}
.member-pill:hover{background:var(--paper)}
.member-pill img{outline-color:var(--ink);outline-width:1px}
.library-search{background:var(--paper);border:2px solid var(--ink);padding:10px 12px;box-shadow:3px 3px 0 var(--ink)}
.library-search:focus-within{border:2px solid var(--ink);margin-bottom:0;outline:2px solid #204de0;outline-offset:3px}
.library-search input::placeholder{color:#55594e}
.library-search>svg{color:var(--ink)}
.format-filters button{border-radius:0;font-weight:700}
.format-filters button.active{background:var(--ink);box-shadow:2px 2px 0 var(--paper)}
.library-sort select{background:var(--paper);border:2px solid var(--ink);border-radius:0;color:var(--ink)}
.library-results{border-color:var(--ink)}
.social-clip-card>button{border:2px solid var(--ink);background:var(--paper);padding:7px;box-shadow:3px 3px 0 var(--ink)}
.social-clip-cover{border-radius:0}
.social-format{border:1px solid var(--ink);border-radius:0;color:var(--ink);background:var(--tone-wash);font-weight:650}
.social-clip-meta{border-top:2px solid var(--ink);padding-top:9px}
.social-clip-meta>strong{font-weight:750}
.social-clip-arrow{color:var(--ink)}
.social-clip-overlay svg{background:var(--tone-wash);border:2px solid var(--ink);color:var(--ink);box-shadow:2px 2px 0 var(--ink)}
.social-format-section>h2{font-weight:850}
.library-more>button{border:2px solid var(--ink);border-radius:0;box-shadow:4px 4px 0 var(--ink);font-weight:750}
.library-more>button:not(:disabled){background:var(--ink)}
.library-more>button:disabled{background:var(--paper);color:var(--ink);box-shadow:2px 2px 0 var(--ink)}
.watch-dialog{border:3px solid var(--ink);border-radius:0;box-shadow:8px 8px 0 var(--lime)}
.watch-dialog[data-tone] .watch-topline{background:var(--lime);color:var(--ink);border-bottom:2px solid var(--ink)}
.watch-dialog[data-tone] .watch-topline i{color:var(--ink)}
.dialog-close{color:var(--ink);font-weight:700}
.watch-info h2{font-weight:800}
.toast{border:2px solid var(--ink);border-radius:0;box-shadow:4px 4px 0 var(--ink);font-weight:700}

@media(max-width:1100px){
 .header{gap:24px}
 .header nav{gap:7px}
 .header nav a{padding:6px 8px;font-size:11px}
 .header-name{display:none}
 .hero{padding:25px}
 .hero h1{font-size:10.3vw}
 .hero-sticker{right:1%;width:14vw;height:14vw}
 .channel-project-copy h3{font-size:34px}
}
@media(max-width:700px){
 .header{height:76px;gap:12px}
 .header nav{gap:6px}
 .header nav a{padding:5px 6px;font-size:9px;box-shadow:2px 2px 0 var(--ink)}
 .hero{padding:21px 17px 22px;margin-top:18px;margin-bottom:28px;box-shadow:5px 5px 0 var(--ink)}
 .hero-kicker{font-size:5.5px;letter-spacing:.15px}
 .hero-location{font-size:6px}
 .hero h1{font-size:11.3vw;letter-spacing:-.075em;line-height:.98;margin:27px 0 21px}
 .hero .second-line{-webkit-text-stroke:1.25px var(--ink);text-shadow:2px 2px 0 var(--ink)}
 .hero-sticker{width:17vw;height:17vw;right:0;top:-4px}
 .hero-sticker>span{font-size:2vw}
 .hero-sticker svg{filter:drop-shadow(2px 2px 0 var(--ink))}
 .hero-bottom{margin-top:18px;gap:8px;flex-wrap:wrap}
 .hero-credit{min-width:104px}
 .hero-credit small{font-size:4.5px}
 .hero-feature-link{padding:4px 6px;gap:5px;box-shadow:2px 2px 0 var(--ink)}
 .hero-feature-link>strong{font-size:9px}
 .hero-bottom p{font-size:7px}
 .hero-bottom .round-link{width:28px;height:28px;box-shadow:2px 2px 0 var(--ink)}
 .section-heading h2{font-size:28px;font-weight:850;letter-spacing:-1.2px}
 .spotlight{border-width:2px;box-shadow:3px 3px 0 var(--ink)}
 .spotlight-0 .spotlight-copy>small{padding:4px 5px;font-size:6px}
 .channel-project[data-tone],.trainee-project,.collection,.recognition,.channels-page main.wrap,.about{border-width:2px;box-shadow:4px 4px 0 var(--ink)}
 .channel-project-copy h3{font-size:30px;letter-spacing:-1.3px}
 .channel-project-stats>strong{font-size:28px}
 .trainee-project-heading h3{font-size:23px;font-weight:800}
 .trainee-cover>strong{font-size:15px;padding:3px 6px}
 .trainee-cover-image{border-width:2px;border-bottom-width:3px}
 .collection{margin-top:20px}
 .collection+.collection{border-top-width:2px}
 .collection-heading{margin-bottom:19px;padding-bottom:16px}
 .collection-heading h3{font-size:22px}
 .collection-index{padding:5px;font-size:7px}
 .film-caption{padding:8px 6px;gap:4px}
 .film-caption strong{font-size:11px}
 .film-caption .film-number{font-size:6px;min-width:8px}
 .film-open{box-shadow:2px 2px 0 var(--ink)}
 .film-grid,.film-grid.two-films{gap:20px 12px}
 .filters{padding-bottom:8px;gap:7px}
 .filters button{font-size:9px;padding:8px 10px}
 .recognition-heading h2{font-size:27px}
 .recognition-film>strong{font-weight:800}
 .about{padding:23px 20px;margin-block:27px 36px}
 .about h2{font-size:32px}
 .contact-title{font-size:10vw}
 .library-header{border-bottom-width:2px}
 .library-hero-covers>img{border-width:1px;box-shadow:2px 2px 0 var(--ink)}
 .library-hero-covers.single-cover>img{border:0;box-shadow:none}
 .member-selector{padding-bottom:23px}
 .member-pill{padding:6px 8px}
 .social-clip-card>button{padding:5px;box-shadow:2px 2px 0 var(--ink)}
 .social-clip-meta{padding-right:12px}
 .social-clip-meta>strong{font-size:11px}
 .social-clip-meta>small{font-size:6px}
 .social-clip-meta>small>span{font-size:5px}
 .social-format{font-size:5px;left:6px;top:6px;padding:3px 4px}
 .social-duration{font-size:6px;right:5px;bottom:5px}
 .watch-dialog{border-width:2px;box-shadow:4px 4px 0 var(--lime)}
 .watch-dialog .watch-topline{padding:11px 13px}
}
@media(max-width:360px){
 .header nav{gap:5px}
 .header nav a{padding:4px 5px;font-size:8px}
 .hero{padding-inline:13px}
 .hero-bottom{gap:7px}
 .hero-credit{min-width:98px}
 .hero-bottom .round-link{display:none}
 .channel-project-copy h3{font-size:27px}
 .trainee-project-heading h3{font-size:21px}
 .section-heading h2{font-size:26px}
 .recognition-heading h2{font-size:24px}
}
