/* ==========================================================================
   Classic — dark tube theme: big search, uppercase nav bar, fluid grid with
   duration and views on every thumbnail, orange accent.
   Layers: 1 tokens (see critical.css) · 2 base · 3 layout · 4 components ·
           5 utilities. Mobile-first: base rules are mobile, desktop lives in
           min-width media queries only (560 / 900 / 1024 / 1200 / 1800).
   ========================================================================== */

/* --- 2. base ------------------------------------------------------------ */
h1,h2,h3,h4{margin:0 0 var(--cl-s3);line-height:1.2;font-weight:500}
h1{font-size:1.25rem}
h2{font-size:1.125rem}
h3{font-size:1rem}
p{margin:0 0 var(--cl-s3)}
:focus-visible{outline:2px solid var(--cl-accent);outline-offset:2px}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0}
input,select,textarea{font:inherit;color:var(--cl-text);background:var(--cl-bg);border:2px solid var(--cl-surface-2);border-radius:var(--cl-r);padding:9px var(--cl-s3)}
input:focus,select:focus,textarea:focus{border-color:var(--cl-accent);outline:none}
::placeholder{color:var(--cl-dim)}
hr{border:0;border-top:1px solid var(--cl-border);margin:var(--cl-s5) 0}
table{width:100%;border-collapse:collapse}
::selection{background:var(--cl-accent);color:var(--cl-accent-ink)}
.cl-ico{width:1em;height:1em;flex:none;fill:currentColor}

/* --- 3. layout ---------------------------------------------------------- */
.lic-banner{padding:var(--cl-s3) var(--cl-s4);font-size:.875rem;text-align:center}
.lic-banner--info{background:var(--cl-surface-2)}
.lic-banner--warning{background:var(--cl-warn-bg);color:var(--cl-warn-ink)}
.lic-banner--alert{background:var(--cl-danger-bg);color:var(--cl-danger-ink)}
.site-footer{margin-top:40px;padding:10px 10px 24px;background:rgba(0,0,0,.35);text-align:center;color:var(--cl-dim);font-size:13px}
.cl-footer-inner{display:flex;flex-direction:column;align-items:center;gap:var(--cl-s3)}
.cl-footer-nav .menu__list{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:4px}
.cl-footer-nav a{display:inline-flex;align-items:center;min-height:32px;padding:0 16.8px;border-radius:var(--cl-r);color:var(--cl-accent);font-size:14px;font-weight:500;text-transform:uppercase}
.cl-footer-nav a:hover{background:var(--cl-accent);color:var(--cl-bg)}
.cl-copyright{margin:0}.cl-copyright a{color:var(--cl-accent)}

/* --- 4. components ------------------------------------------------------ */
/* 4.1 header, search, nav bar, notice */
.cl-logo-img{height:44px;width:auto}
.search-btn{position:absolute;right:2px;top:2px;bottom:2px;width:50px;display:grid;place-items:center;color:var(--cl-accent)}
.search-btn:hover{color:var(--cl-text)}
.search-input:focus{border-color:var(--cl-hi)}
.menu-toggle{display:inline-flex;align-items:center;gap:var(--cl-s2);height:38px;padding:0 12px;border-radius:var(--cl-r);background:var(--cl-bg);font-size:14px}
.menu-toggle[aria-expanded="true"]{background:var(--cl-accent);color:var(--cl-accent-ink)}
.menu-bars{display:grid;gap:3px}.menu-bars span{display:block;width:18px;height:2px;border-radius:1px;background:currentColor}
.cl-nav{display:none;background:var(--cl-bg);padding:6px 10px 12px;box-shadow:var(--cl-elev)}
.cl-nav.is-open{display:block}
.main-nav .menu__list{list-style:none;margin:0;padding:0}
.main-nav .menu__link{display:flex;align-items:center;min-height:44px;padding:0 10px;border-radius:var(--cl-r);font-size:16px;text-transform:uppercase;color:var(--cl-muted)}
.main-nav .menu__link:hover{color:var(--cl-accent)}
.main-nav .menu__list--depth2{padding-left:var(--cl-s4)}
.main-nav .menu__list--depth2 .menu__link{font-size:14px;min-height:40px}
.cl-nav-end{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:var(--cl-s2);padding-top:var(--cl-s3);border-top:1px solid var(--cl-border)}
.auth-nav{display:flex;gap:6px}
.logout-form{margin:0}
.nav-link,.lang-current{display:inline-flex;align-items:center;min-height:40px;padding:0 12px;border-radius:var(--cl-r);background:var(--cl-surface);font-size:13px;text-transform:uppercase;color:var(--cl-muted)}
.nav-link:hover,.lang-current:hover{color:var(--cl-accent)}
.nav-link--accent{background:var(--cl-hi);color:var(--cl-accent-ink);font-weight:500}
.nav-link--accent:hover{background:var(--cl-accent);color:var(--cl-accent-ink)}
.lang-current::after{content:"";margin-left:6px;border:4px solid transparent;border-top-color:currentColor;transform:translateY(2px)}
.lang-switcher{position:relative}
.lang-dropdown{list-style:none;position:absolute;left:0;top:100%;z-index:45;min-width:160px;margin:4px 0 0;padding:4px 0;background:var(--cl-bg);border-radius:var(--cl-r);box-shadow:0 6px 14px rgba(0,0,0,.5)}
.lang-dropdown[hidden]{display:none}
.lang-dropdown a{display:flex;align-items:center;min-height:40px;padding:0 var(--cl-s4)}
.lang-dropdown a:hover{background:var(--cl-accent);color:var(--cl-accent-ink)}
.cl-notice .menu__list{list-style:none;margin:0;padding:0}
.cl-notice .menu__link{display:block;padding:10px;background:var(--cl-accent);color:var(--cl-text);text-align:center;font-size:14px;line-height:1.4}
.cl-notice .menu__link:hover{background:var(--cl-hi)}
.cl-notice .menu__item+.menu__item{display:none}
@media (min-width:1024px){
  .menu-toggle{display:none}
  .cl-logo-img{height:56px}
  .cl-nav,.cl-nav.is-open{display:flex;align-items:center;justify-content:space-between;gap:var(--cl-s4);padding:0 10px;box-shadow:none}
  .main-nav .menu__list--depth1{display:flex}
  .main-nav .menu__item{position:relative}
  .main-nav .menu__list--depth1>.menu__item>.menu__link{min-height:39px;padding:10px 8px;border-radius:0}
  .main-nav .menu__item--has-children>.menu__link::after{content:"";margin-left:6px;border:4px solid transparent;border-top-color:currentColor;transform:translateY(2px);transition:transform .2s}
  .main-nav .menu__list--depth2{position:absolute;left:0;top:100%;z-index:40;min-width:200px;padding:6px 0;background:var(--cl-bg);border-radius:0 var(--cl-r-lg) var(--cl-r-lg) var(--cl-r-lg);box-shadow:0 3px 7px rgba(0,0,0,.5);opacity:0;visibility:hidden;transform:translateY(6px);transition:.2s}
  .main-nav .menu__item--has-children:hover>.menu__link,.main-nav .menu__item--has-children:focus-within>.menu__link{background:var(--cl-accent);color:var(--cl-text);border-radius:var(--cl-r-lg) var(--cl-r-lg) 0 0}
  .main-nav .menu__item--has-children:hover>.menu__link::after{transform:translateY(-2px) rotate(180deg)}
  .main-nav .menu__item--has-children:hover>.menu__list--depth2,.main-nav .menu__item--has-children:focus-within>.menu__list--depth2{opacity:1;visibility:visible;transform:none}
  .main-nav .menu__list--depth2 .menu__link{min-height:36px;padding:0 16px;border-radius:0;font-size:13px;color:var(--cl-text)}
  .main-nav .menu__list--depth2 .menu__link:hover{background:var(--cl-accent);color:var(--cl-text)}
  .cl-nav-end{margin:0;padding:0;border:0;flex-wrap:nowrap}
  .nav-link,.lang-current{min-height:30px;background:none;font-size:14px}
  .nav-link--accent{background:var(--cl-hi);color:var(--cl-accent-ink)}
  .lang-dropdown{left:auto;right:0}
}

/* 4.2 headline + sort dropdown */
.cl-headline{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;padding:20px 0 0;margin-bottom:15px}
.page-title,.cl-headline .video-title{margin:0;padding-left:5px;font-size:20px;font-weight:500;line-height:1.2;color:var(--cl-muted)}
.page-title small{margin-left:4px;font-size:14px;font-weight:400;color:#7c7c7c}
.cl-headline--video{padding-top:6px}
.cl-headline--video .video-title{font-size:18px}
.cl-headline--tx{align-items:flex-start}
.cl-headline--tx .tx-head{flex:1 1 320px;min-width:0;margin:0}
.cl-sort{position:relative;z-index:20}
.cl-sort-btn{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 12px 0 10px;border-radius:var(--cl-r);background:var(--cl-hi);color:var(--cl-accent-ink);font-size:12px;font-weight:700;letter-spacing:.3px}
.cl-sort-btn::after{content:"";border:4px solid transparent;border-top-color:currentColor;transform:translateY(2px);transition:transform .2s}
.cl-sort-list{list-style:none;position:absolute;right:0;top:100%;min-width:100%;margin:0;padding:4px 0;background:var(--cl-bg);border-radius:0 0 var(--cl-r) var(--cl-r);box-shadow:0 6px 14px rgba(0,0,0,.5);opacity:0;visibility:hidden;transform:translateY(-4px);transition:.2s}
.cl-sort-list .sort-tab{display:block;padding:10px 12px;color:var(--cl-hi);font-size:12px;text-transform:uppercase;letter-spacing:.3px;white-space:nowrap}
.cl-sort-list .sort-tab:hover{background:var(--cl-hi);color:var(--cl-bg)}
.cl-sort-list .sort-tab.active{color:var(--cl-text)}
.cl-sort:hover .cl-sort-btn,.cl-sort.is-open .cl-sort-btn{background:var(--cl-accent);border-radius:var(--cl-r) var(--cl-r) 0 0}
.cl-sort:hover .cl-sort-btn::after,.cl-sort.is-open .cl-sort-btn::after{transform:translateY(-2px) rotate(180deg)}
.cl-sort:hover .cl-sort-list,.cl-sort.is-open .cl-sort-list,.cl-sort:focus-within .cl-sort-list{opacity:1;visibility:visible;transform:none}

/* 4.3 cards + grid */
.card-link{display:block}
.card-thumb .xs-preview{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.card-badge{position:absolute;bottom:4px;z-index:2;display:inline-flex;align-items:center;gap:5px;height:22px;padding:0 6px;border-radius:var(--cl-r-sm);background:rgba(0,0,0,.7);color:rgba(255,255,255,.8);font-size:12px;line-height:1}
.card-badge svg{width:13px;height:13px;fill:currentColor;opacity:.9}
.card-duration{left:4px}.card-views{right:4px}
.card-rating{position:absolute;top:6px;right:6px;z-index:2;display:inline-flex;align-items:center;height:22px;padding:0 6px;border-radius:var(--cl-r-sm);background:rgba(0,0,0,.7);color:var(--cl-accent);font-size:12px;font-weight:500;opacity:0;transform:translateX(6px);transition:.2s}
.item-card:hover .card-rating{opacity:.95;transform:none}
.item-card:hover .card-title{color:var(--cl-accent)}
.card-taxo,.card-meta{display:flex;flex-wrap:wrap;align-items:center;margin:0;padding:0 10px 8px 2px;font-size:14px;line-height:1.2}
.card-taxo a{display:inline-flex;align-items:center;gap:5px;min-height:24px;padding-right:5px;color:var(--cl-accent);text-shadow:.5px 0 0 currentColor}
.card-taxo a+a{margin-left:5px}
.card-taxo a+a::before{content:"";width:4px;height:4px;border-radius:50%;background:currentColor}
.card-taxo .card-actor{color:var(--cl-hi)}
.card-taxo a:hover{text-decoration:underline}
.card-meta{color:var(--cl-dim);font-size:12px}
@media (prefers-reduced-motion:reduce){.card-rating{transition:none}}

/* 4.4 pagination + load more */
.cl-load-more{display:flex;align-items:center;justify-content:center;width:100%;max-width:320px;min-height:46px;margin:25px auto 0;border-radius:var(--cl-r);background:var(--cl-box);border:1px solid var(--cl-edge);font-size:15px;font-weight:500;text-transform:uppercase}
.cl-load-more:hover{background:var(--cl-accent);color:var(--cl-accent-ink)}
.cl-load-more.is-loading{opacity:.6;pointer-events:none}
.pagination{display:flex;flex-wrap:wrap;justify-content:center;gap:5px;margin-top:25px}
.page-link{display:grid;place-items:center;min-width:46px;height:46px;padding:0 15px;border-radius:var(--cl-r);background:var(--cl-box);border:1px solid var(--cl-edge);font-size:17px;font-weight:500;color:var(--cl-text)}
.page-link:hover{background:var(--cl-accent);color:var(--cl-accent-ink)}
.page-link.active{background:var(--cl-accent);color:var(--cl-bg)}
.page-ellipsis{display:grid;place-items:center;height:46px;padding:0 4px;color:var(--cl-dim)}
.page-jump{display:none}
@media (min-width:640px){.page-jump{display:grid}}
.empty-message{color:var(--cl-dim);padding:var(--cl-s6) 0;text-align:center}

/* 4.5 listings */
.breadcrumbs{margin:14px 0 0;padding-left:5px;font-size:13px;color:var(--cl-dim)}
.cl-crumbs{list-style:none;display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0}
.cl-crumbs li+li::before{content:"/";margin-right:6px;color:#555}
.cl-crumbs a{color:var(--cl-accent)}.cl-crumbs a:hover{text-decoration:underline}
.breadcrumb-current{color:var(--cl-dim)}
.page-description{color:var(--cl-dim);max-width:90ch;margin-bottom:var(--cl-s4)}
.actor-profile{display:flex;flex-wrap:wrap;gap:15px;align-items:flex-start;padding-top:15px}
.actor-photo{width:120px;aspect-ratio:3/4;height:auto;border-radius:var(--cl-r);object-fit:cover;flex:none;background:var(--cl-surface);border:1px solid #000;box-shadow:var(--cl-shadow)}
.actor-info{flex:1;min-width:200px}
.actor-info h1{margin-bottom:10px;font-size:24px;color:var(--cl-item-title)}
.actor-bio{color:#cfcfcf;margin:0;max-width:80ch;line-height:1.5}
.result-count{color:var(--cl-dim);font-size:13px}
.type-filter{display:flex;gap:6px;overflow-x:auto;margin-bottom:15px}
.type-tab{flex:none;display:flex;align-items:center;min-height:36px;padding:0 14px;border-radius:var(--cl-r);background:var(--cl-box);border:1px solid var(--cl-edge);font-size:13px;text-transform:uppercase}
.type-tab.active,.type-tab:hover{background:var(--cl-accent);color:var(--cl-accent-ink)}
@media (min-width:768px){.actor-photo{width:160px}.actor-info h1{font-size:28px}}

/* 4.6 pills (video info, profile stats) */
.cl-pills{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 10px}
.cl-pill,.btn-download{display:inline-flex;align-items:center;gap:8px;min-height:34px;padding:0 10px;border-radius:var(--cl-r);background:var(--cl-surface);border:2px solid transparent;font-size:14px;font-weight:500;color:var(--cl-text)}
.cl-pill .cl-ico,.cl-pill svg{width:16px;height:16px;fill:currentColor}
.btn-download{background:var(--cl-accent);color:var(--cl-accent-ink);text-transform:uppercase}
.btn-download:hover{background:var(--cl-text);color:var(--cl-accent-ink)}
.cl-pill--model{background:var(--cl-bg);border-color:var(--cl-hi);color:var(--cl-hi);text-shadow:.5px 0 0 currentColor}
.cl-pill--model:hover{background:var(--cl-hi);color:var(--cl-accent-ink)}
.cl-pill-avatar{width:22px;height:22px;border-radius:50%;object-fit:cover;margin-left:-5px}
.cl-pill--cat:hover,.cl-pill--tag:hover{background:var(--cl-accent);color:var(--cl-accent-ink)}
.cl-pill--tag{color:var(--cl-accent)}

/* 4.7 video detail */
.cl-block-video{display:grid;grid-template-columns:minmax(0,1fr);gap:20px}
@media (min-width:1200px){.cl-block-video.has-side{grid-template-columns:minmax(0,1fr) 380px}}
.cl-video-side{display:grid;gap:10px;align-content:start;justify-items:center}
.cl-ratio-16x9{position:relative;aspect-ratio:16/9;background:#000;border:1px solid #000;margin:0 -10px;overflow:hidden}
@media (min-width:640px){.cl-ratio-16x9{margin:0;border-radius:var(--cl-r)}}
.cl-ratio-16x9 iframe,.cl-ratio-16x9 video,.cl-ratio-16x9 .external-player{position:absolute;inset:0;width:100%;height:100%;border:0}
.external-player{cursor:pointer}
.external-player-poster,.external-player-poster img{width:100%;height:100%;object-fit:cover}
.external-player-poster-empty{width:100%;height:100%;background:var(--cl-surface)}
.external-player-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:84px;height:84px;padding:0;border-radius:50%;background:rgba(0,0,0,.55);border:3px solid var(--cl-accent);display:grid;place-items:center;color:var(--cl-accent);transition:background .15s,color .15s}
.external-player-play svg{width:34px;height:34px;margin-left:5px}
.external-player:hover .external-player-play{background:var(--cl-accent);color:var(--cl-accent-ink)}
.external-player-duration{position:absolute;right:8px;bottom:8px;display:inline-flex;align-items:center;height:22px;padding:0 6px;border-radius:var(--cl-r-sm);background:rgba(0,0,0,.7);color:rgba(255,255,255,.8);font-size:12px}
.cl-info-buttons{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;padding:10px 0}
.cl-rating{display:flex;align-items:center;gap:6px}
.reaction-buttons{display:flex;gap:4px}
.reaction-btn{display:inline-flex;align-items:center;gap:6px;min-width:44px;height:40px;padding:0 8px;border-radius:var(--cl-r);font-size:13px;color:var(--cl-text)}
.reaction-btn .cl-ico{width:24px;height:24px}
.reaction-dislike .cl-ico{transform:rotate(180deg)}
.reaction-btn:hover,.reaction-btn.active{color:var(--cl-accent)}
.cl-scale{display:block;width:130px;margin-left:6px}
.cl-voters{display:block;margin-bottom:6px;font-size:12px;text-transform:uppercase}
.cl-scale-bar{display:block;height:4px;border-radius:2px;background:#3f3f3f}
.cl-scale-bar i{display:block;height:100%;border-radius:2px;background:var(--cl-accent)}
.cl-tabs{display:flex;gap:3px}
.cl-tabs [role="tab"]{position:relative;width:50px;height:40px;display:grid;place-items:center;border-radius:var(--cl-r);color:var(--cl-text)}
.cl-tabs [role="tab"] .cl-ico{width:20px;height:20px}
.cl-tabs [role="tab"]:hover{color:var(--cl-accent)}
.cl-tabs [role="tab"][aria-selected="true"]{background:var(--cl-accent);color:var(--cl-text)}
.cl-tab-count{position:absolute;right:4px;top:3px;font-size:10px;font-weight:700}
.cl-panel{padding-bottom:8px}
.cl-panel[hidden]{display:none}
.item-description{margin:6px 0 4px;color:#cfcfcf;line-height:1.55;max-width:100ch}
.item-description.collapsible{max-height:4.7em;overflow:hidden;position:relative}
.item-description.collapsible.expanded{max-height:none}
.item-description.collapsible:not(.expanded)::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1.6em;background:linear-gradient(to bottom,transparent,var(--cl-bg))}
.cl-more{min-height:40px;color:var(--cl-accent);font-size:12px;font-weight:500;text-transform:uppercase;letter-spacing:.3px}
.cl-share{display:flex;gap:8px}
.cl-share input{flex:1;min-width:0;height:40px;border-color:var(--cl-accent);font-size:13px}
.cl-copy{height:40px;padding:0 16px;border-radius:var(--cl-r);background:var(--cl-accent);color:var(--cl-accent-ink);font-weight:500;text-transform:uppercase}
.related-section{margin-top:var(--cl-s4)}
.section-title{margin-bottom:var(--cl-s3);font-size:18px;font-weight:500;color:var(--cl-muted)}

/* --- 4.6 core fallbacks --------------------------------------------------
   Core (app/templates/) still renders these pages/partials under Classic:
   auth forms, flash, comments, error/static pages, and the gallery /
   category / actor grids. Class names below are core's — restyled with
   Classic tokens. */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 var(--cl-s4);border-radius:var(--cl-r-sm);background:var(--cl-surface-2);color:var(--cl-text);font-weight:600;font-size:.9375rem}
.btn:hover{background:var(--cl-border)}
.btn-primary{background:var(--cl-accent);color:var(--cl-accent-ink)}
.btn-primary:hover{background:var(--cl-accent);opacity:.9}

.site-main{padding-left:var(--cl-s4);padding-right:var(--cl-s4)}
.site-main .container{padding-left:0;padding-right:0}

.flash{display:flex;align-items:center;justify-content:space-between;gap:var(--cl-s3);min-height:44px;padding:var(--cl-s3) var(--cl-s4);margin-bottom:var(--cl-s4);border-radius:var(--cl-r);font-size:.875rem}
.flash-success{background:var(--cl-success-bg);color:var(--cl-success-ink);box-shadow:inset 0 0 0 1px var(--cl-success-ring)}
.flash-error{background:var(--cl-danger-bg);color:var(--cl-danger-ink);box-shadow:inset 0 0 0 1px var(--cl-danger-ring)}
.flash-close{display:flex;align-items:center;justify-content:center;flex:none;min-width:44px;min-height:44px;font-size:1.25rem;line-height:1}

.auth-form-wrap{max-width:400px;margin:var(--cl-s6) auto}
.auth-form-wrap h1{margin-bottom:var(--cl-s5)}
.auth-form{display:flex;flex-direction:column;gap:var(--cl-s4)}
.form-group{display:flex;flex-direction:column;gap:var(--cl-s1)}
.form-group label{font-size:.8125rem;font-family:var(--cl-mono);color:var(--cl-muted)}
.form-error{background:var(--cl-danger-bg);color:var(--cl-danger-ink);box-shadow:inset 0 0 0 1px var(--cl-danger-ring);padding:var(--cl-s2) var(--cl-s3);border-radius:var(--cl-r-sm);font-size:.875rem;margin-bottom:var(--cl-s2)}
.auth-link{margin-top:var(--cl-s4);font-size:.875rem;color:var(--cl-muted)}
.auth-link a{color:var(--cl-accent)}

.profile-row{display:flex;justify-content:space-between;gap:var(--cl-s3);padding:var(--cl-s3) 0;border-bottom:1px solid var(--cl-border)}

.comments-section{margin-top:var(--cl-s6)}
.comment-form{margin-bottom:var(--cl-s5)}
.comment-form textarea{width:100%;font-family:inherit}
.comment-form .btn{margin-top:var(--cl-s2)}
.comment{padding:var(--cl-s3) 0;border-bottom:1px solid var(--cl-border)}
.comment-header{display:flex;align-items:center;gap:var(--cl-s2);margin-bottom:var(--cl-s1);font-size:.875rem}
.comment-date{color:var(--cl-muted);font-family:var(--cl-mono);font-size:.75rem}
.comment-body{color:var(--cl-text);line-height:1.5}
.comment-delete-btn{display:flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;color:var(--cl-muted)}
.comment-delete-btn:hover{color:var(--cl-accent)}
.comment-replies{margin-left:var(--cl-s5);border-left:2px solid var(--cl-border);padding-left:var(--cl-s3)}

.error-page{text-align:center;padding:var(--cl-s6) 0}
.error-page h1{font-size:3.5rem;color:var(--cl-muted);font-family:var(--cl-mono)}
.error-page p{color:var(--cl-muted);font-size:1.125rem;margin-bottom:var(--cl-s5)}
.back-link{color:var(--cl-accent);font-weight:700}

.static-page{max-width:70ch}
.page-content{margin:var(--cl-s5) 0;line-height:1.7}
.article-body{margin:var(--cl-s5) 0;line-height:1.7}
.article-body h2,.article-body h3{margin:var(--cl-s5) 0 var(--cl-s2)}
.article-body p{margin-bottom:var(--cl-s3)}
.article-body img{border-radius:var(--cl-r)}

.gallery-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--cl-s2);margin:var(--cl-s4) 0}
.gallery-item img{border-radius:var(--cl-r-sm)}
/* actor listing: portrait cards (default), compact circles, list rows.
   The view class lives on the grid; markup is identical across views. */
.cl-al-head .page-title small{font-family:var(--cl-mono);font-size:.8125rem;font-weight:400;color:var(--cl-muted);margin-left:var(--cl-s1)}
.cl-al-toolbar{display:flex;flex-direction:column;gap:var(--cl-s3);margin-bottom:var(--cl-s4)}
.cl-al-row{display:flex;flex-wrap:wrap;gap:var(--cl-s2);align-items:center}
.cl-al-find{position:relative;flex:1 1 100%;min-width:0;margin:0}
.cl-al-find svg{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--cl-muted);pointer-events:none}
.cl-al-find input[type=search]{width:100%;height:44px;padding:0 44px 0 38px}
.cl-al-clear{position:absolute;right:4px;top:50%;transform:translateY(-50%);width:36px;height:36px;display:grid;place-items:center;border-radius:var(--cl-r-sm);color:var(--cl-muted);font-size:1.25rem}
.cl-al-clear:hover{background:var(--cl-surface-2);color:var(--cl-text)}
.cl-al-sort{flex:1 1 0;min-width:0;display:flex;gap:var(--cl-s1);overflow-x:auto;scrollbar-width:none}
.cl-al-sort::-webkit-scrollbar{display:none}
.cl-al-views{flex:none;margin-left:auto;display:flex;gap:2px;padding:3px;border-radius:var(--cl-r-sm);background:var(--cl-surface)}
.cl-al-views[hidden]{display:none}
.cl-al-views button{width:36px;height:38px;display:grid;place-items:center;border-radius:3px;color:var(--cl-muted)}
.cl-al-views button[aria-pressed="true"]{background:var(--cl-surface-2);color:var(--cl-text)}
.cl-al-alpha{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}
.cl-al-alpha::-webkit-scrollbar{display:none}
.cl-al-alpha a{flex:none;min-width:34px;height:34px;padding:0 var(--cl-s2);display:grid;place-items:center;border-radius:var(--cl-r-sm);font-family:var(--cl-mono);font-size:.75rem;color:var(--cl-muted)}
.cl-al-alpha a:hover{background:var(--cl-surface-2);color:var(--cl-text)}
.cl-al-alpha a.active{background:var(--cl-accent);color:var(--cl-accent-ink);font-weight:700}
.cl-al-empty{padding:var(--cl-s6) var(--cl-s4);text-align:center;color:var(--cl-muted);border:1px dashed var(--cl-border);border-radius:var(--cl-r)}
.cl-al-empty strong{color:var(--cl-text)}
.cl-al-empty a{color:var(--cl-accent)}

.actor-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--cl-s3);margin:0}
.actor-card{position:relative;display:block;min-width:0;color:var(--cl-text)}
.actor-card-media{position:relative;display:block;aspect-ratio:3/4;border-radius:var(--cl-r);overflow:hidden;background:var(--cl-surface-2);isolation:isolate}
.actor-card-media picture{display:contents}
.actor-card-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 22%;transition:transform .35s ease}
.actor-card-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 45%,rgba(0,0,0,.55) 72%,rgba(0,0,0,.88));pointer-events:none}
.actor-card-body{position:absolute;left:0;right:0;bottom:0;z-index:1;display:flex;flex-direction:column;gap:2px;padding:var(--cl-s3)}
.actor-card-name{font-weight:650;font-size:.9375rem;line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.actor-card .count{font-family:var(--cl-mono);font-size:.6875rem;color:rgba(237,237,237,.72)}
.actor-card:hover .actor-card-media{box-shadow:0 0 0 2px var(--cl-accent)}
.actor-card:hover .actor-card-photo{transform:scale(1.05)}
.cl-al-mono{display:grid;place-items:center;font-weight:800;font-size:2.25rem;letter-spacing:.02em;color:rgba(255,255,255,.88);background:radial-gradient(120% 90% at 30% 15%,hsl(var(--h) 45% 32%),hsl(calc(var(--h) + 30) 30% 11%))}
.cl-al-rank{position:absolute;top:var(--cl-s2);left:var(--cl-s2);z-index:1;padding:3px 6px;border-radius:3px;background:var(--cl-accent);color:var(--cl-accent-ink);font-family:var(--cl-mono);font-size:.625rem;font-weight:700;letter-spacing:.06em}

/* compact: round avatars, name below */
.actor-grid.is-compact{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--cl-s4) var(--cl-s3)}
.is-compact .actor-card{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center}
.is-compact .actor-card-media{width:100%;max-width:120px;aspect-ratio:1;border-radius:50%;box-shadow:0 0 0 2px var(--cl-bg),0 0 0 3px var(--cl-border)}
.is-compact .actor-card-media::after,.is-compact .cl-al-rank{display:none}
.is-compact .actor-card:hover .actor-card-media{box-shadow:0 0 0 2px var(--cl-bg),0 0 0 4px var(--cl-accent)}
.is-compact .actor-card-body{position:static;padding:0;width:100%;align-items:center}
.is-compact .actor-card-name{font-size:.8125rem;width:100%}
.is-compact .count{color:var(--cl-muted)}
.is-compact .cl-al-mono{font-size:1.25rem}

/* list: thumbnail + name + count rows */
.actor-grid.is-list{grid-template-columns:1fr;gap:0;border-top:1px solid var(--cl-border)}
.is-list .actor-card{display:grid;grid-template-columns:48px minmax(0,1fr);gap:var(--cl-s3);align-items:center;min-height:64px;padding:var(--cl-s2);border-bottom:1px solid var(--cl-border)}
.is-list .actor-card:hover{background:var(--cl-surface)}
.is-list .actor-card-media{width:48px;height:48px;aspect-ratio:auto;border-radius:var(--cl-r-sm)}
.is-list .actor-card-media::after,.is-list .cl-al-rank{display:none}
.is-list .actor-card:hover .actor-card-media{box-shadow:none}
.is-list .actor-card-body{position:static;padding:0;flex-direction:row;justify-content:space-between;align-items:center;gap:var(--cl-s3)}
.is-list .count{color:var(--cl-muted);flex:none}
.is-list .cl-al-mono{font-size:.9375rem}

@media (min-width:480px){
  .actor-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .actor-grid.is-compact{grid-template-columns:repeat(4,minmax(0,1fr))}
  .cl-al-find{flex:1 1 240px}
}
@media (min-width:768px){
  .actor-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--cl-s4)}
  .actor-grid.is-compact{grid-template-columns:repeat(6,minmax(0,1fr))}
  .actor-grid.is-list{grid-template-columns:1fr 1fr;column-gap:var(--cl-s5);border-top:0}
  .is-list .actor-card:nth-child(-n+2){border-top:1px solid var(--cl-border)}
}
@media (min-width:1024px){
  .actor-grid{grid-template-columns:repeat(6,minmax(0,1fr))}
  .actor-grid.is-compact{grid-template-columns:repeat(8,minmax(0,1fr))}
}
@media (min-width:1340px){
  .actor-grid{grid-template-columns:repeat(7,minmax(0,1fr))}
  .actor-grid.is-compact{grid-template-columns:repeat(10,minmax(0,1fr))}
}
@media (prefers-reduced-motion:reduce){.actor-card-photo{transition:none}}

.item-detail{margin-bottom:var(--cl-s6)}
.download-info{display:flex;gap:var(--cl-s4);font-size:.875rem;color:var(--cl-muted)}
.file-size{color:var(--cl-muted);font-family:var(--cl-mono)}
@media (min-width:480px){.gallery-grid{grid-template-columns:repeat(3,1fr)}}

/* 4.x taxonomy index (categories / tags) */
.tx-tiles{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--cl-s2);margin:var(--cl-s5) 0}
.tx-tile{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;background:var(--cl-surface-2);border-radius:var(--cl-r)}
.tx-tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .3s}
.tx-tile:hover img{transform:scale(1.04)}
.tx-tile-info{position:absolute;inset:auto 0 0;display:flex;flex-direction:column;padding:var(--cl-s4) var(--cl-s2) var(--cl-s2);background:linear-gradient(transparent,rgba(0,0,0,.85))}
.tx-tile-name{font-weight:700;font-size:.8125rem;line-height:1.25;color:var(--cl-text)}
.tx-tile .count{color:var(--cl-muted);font-size:.8125rem;font-family:var(--cl-mono)}
.tx-alpha{display:flex;flex-wrap:wrap;gap:var(--cl-s2);margin:var(--cl-s5) 0 var(--cl-s4)}
.tx-alpha a{min-width:36px;padding:var(--cl-s1) var(--cl-s3);text-align:center;background:var(--cl-surface);border-radius:var(--cl-r-sm);font-weight:600;font-family:var(--cl-mono);color:var(--cl-muted)}
.tx-alpha a:hover{background:var(--cl-accent);color:var(--cl-accent-ink)}
.tx-alpha a.active{background:var(--cl-accent);color:var(--cl-accent-ink)}
.tx-find{display:flex;gap:var(--cl-s2);margin:var(--cl-s4) 0}
.tx-find-box{position:relative;flex:1;min-width:0;display:flex}
.tx-find input[type=search]{flex:1;min-width:0;width:100%;height:44px;padding:0 40px 0 var(--cl-s3);background:var(--cl-surface);border:1px solid var(--cl-border);border-radius:var(--cl-r-sm);color:var(--cl-text)}
.tx-find button{height:44px;padding:0 var(--cl-s4);background:var(--cl-surface);border:1px solid var(--cl-border);border-radius:var(--cl-r-sm);color:var(--cl-text);font-family:var(--cl-mono);cursor:pointer}
.tx-clear{position:absolute;right:0;top:0;width:36px;height:44px;display:grid;place-items:center;color:var(--cl-muted)}
.tx-popular{display:flex;flex-wrap:wrap;gap:var(--cl-s2);margin:var(--cl-s4) 0 var(--cl-s5)}
.tx-chip{display:inline-flex;align-items:center;gap:var(--cl-s1);min-height:36px;padding:0 var(--cl-s3);background:var(--cl-surface);border:1px solid var(--cl-border);border-radius:var(--cl-r-sm);font-size:.8125rem;font-family:var(--cl-mono);color:var(--cl-text)}
.tx-chip b{color:var(--cl-muted);font-weight:400;font-size:.75rem}
.tx-chip:hover{background:var(--cl-accent);border-color:var(--cl-accent);color:var(--cl-accent-ink)}
.tx-chip:hover b{color:inherit}
.tag-badge.tx-chip{min-height:44px;padding:0 var(--cl-s3);font-size:.75rem;color:var(--cl-muted)}
.tag-badge.tx-chip:hover{color:var(--cl-accent-ink)}
.tx-empty{margin:var(--cl-s6) 0;color:var(--cl-muted);text-align:center}
.tx-group{break-inside:avoid;margin-bottom:var(--cl-s5);scroll-margin-top:72px}
.tx-group h2{padding-bottom:var(--cl-s1);border-bottom:1px solid var(--cl-border);color:var(--cl-accent)}
.tx-group ul{list-style:none;margin:0;padding:0}
.tx-group li{display:flex;align-items:baseline;gap:var(--cl-s2);padding:var(--cl-s1) 0}
.tx-group .count{color:var(--cl-muted);font-size:.8125rem;font-family:var(--cl-mono)}
.tx-parent{color:var(--cl-muted);font-size:.75rem}
/* taxonomy detail header (category / tag) */
.tx-head{margin-bottom:var(--cl-s3)}
.tx-head .page-title{margin-bottom:var(--cl-s2)}
.tx-total{color:var(--cl-muted);font-size:.875rem;font-weight:400;letter-spacing:0;font-family:var(--cl-mono);white-space:nowrap}
.tx-desc{position:relative;margin-bottom:var(--cl-s2);color:var(--cl-muted);font-size:.875rem;max-width:70ch}
.tx-more-toggle{position:absolute;opacity:0;pointer-events:none}
.tx-desc-text{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;margin:0}
.tx-more{color:var(--cl-accent);font-size:.8125rem;cursor:pointer}
.tx-more-hide,.tx-more-toggle:checked~.tx-more .tx-more-show{display:none}
.tx-more-toggle:checked~.tx-more .tx-more-hide{display:inline}
.tx-more-toggle:checked~.tx-desc-text{display:block}
.tx-more-toggle:focus-visible~.tx-more{outline:2px solid var(--cl-accent);outline-offset:2px}
.tx-related{display:flex;gap:var(--cl-s2);overflow-x:auto;padding-bottom:var(--cl-s1);scrollbar-width:none}
.tx-related::-webkit-scrollbar{display:none}
.tx-related .tx-chip{flex:none;white-space:nowrap}
@media (min-width:600px){.tx-tiles{gap:var(--cl-s3)}.tx-tile-info{padding:var(--cl-s5) var(--cl-s3) var(--cl-s3)}.tx-tile-name{font-size:inherit}.tx-tile .count{font-size:.8125rem}}
@media (min-width:768px){.tx-dict{columns:2}.tx-related{flex-wrap:wrap;overflow-x:visible}}
@media (min-width:1024px){.tx-tiles{grid-template-columns:repeat(4,1fr)}.tx-dict{columns:3}}

/* --- 5. utilities ------------------------------------------------------- */
.cl-visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

.card-thumb,.external-player-poster{position:relative}

/* --- 6. Classic skin for core fallbacks -------------------------------- */
.tx-chip,.tx-popular .tx-chip{min-height:36px;padding:0 20px;background:rgba(0,0,0,.25);border:1px solid #000;border-radius:var(--cl-r);color:var(--cl-accent);font-size:14px;font-weight:700;font-family:var(--cl-font);text-transform:capitalize;text-shadow:.5px 0 0 currentColor}
.tx-chip b{color:var(--cl-dim);text-shadow:none}
.tx-chip:hover{background:var(--cl-accent);border-color:#000;color:var(--cl-accent-ink)}
.tx-popular{justify-content:center;gap:10px;padding:10px 0}
.tx-alpha a,.cl-al-alpha a{min-width:36px;height:36px;padding:0 8px;display:grid;place-items:center;background:var(--cl-box);border:1px solid var(--cl-edge);border-radius:var(--cl-r);color:var(--cl-text);font-family:var(--cl-font);font-weight:500;font-size:14px}
.tx-alpha a:hover,.tx-alpha a.active,.cl-al-alpha a:hover,.cl-al-alpha a.active{background:var(--cl-accent);color:var(--cl-accent-ink)}
.tx-group h2{color:var(--cl-accent);font-weight:700}
.tx-group a:hover{color:var(--cl-accent)}
.tx-find input[type=search],.cl-al-find input[type=search]{border:2px solid var(--cl-accent);background:var(--cl-bg);box-shadow:inset 1px 1px 3px rgba(0,0,0,.5)}
.tx-find button{border:0;background:var(--cl-hi);color:var(--cl-accent-ink);font-family:var(--cl-font);font-weight:500;text-transform:uppercase}
.tx-total{font-family:var(--cl-font);color:#7c7c7c}
.tx-desc{color:var(--cl-dim)}
.tx-tile{border:1px solid #000;box-shadow:var(--cl-shadow)}
.tx-tile-name{color:var(--cl-item-title);font-weight:500}
.actor-card-media{border:1px solid #000;box-shadow:var(--cl-shadow)}
.actor-card-name{font-weight:500;color:var(--cl-item-title)}
.actor-card .count{font-family:var(--cl-font);color:var(--cl-accent)}
.actor-card:hover .actor-card-media{box-shadow:0 0 0 2px var(--cl-accent)}
.cl-al-rank{font-family:var(--cl-font)}
.cl-al-views button[aria-pressed="true"]{background:var(--cl-accent);color:var(--cl-accent-ink)}
.btn{border-radius:var(--cl-r);background:var(--cl-box);font-weight:500;text-transform:uppercase;font-size:14px}
.btn-primary{background:var(--cl-hi);color:var(--cl-accent-ink)}
.comments-section{margin-top:0}
.comments-section .section-title{display:none}
.comment-header b,.comment-author{color:var(--cl-hi)}
.comment-date{font-family:var(--cl-font)}
.form-group label{font-family:var(--cl-font)}
.error-page h1{font-family:var(--cl-font);color:var(--cl-accent)}