/* ============================================
ДОМ-2 Lite — Consolidated CSS
Reset · Theme · Base · Nav · Sections · Cards · Archive · Footer · Typography · Forms · 404 · Player · Comments · Responsive
============================================ */
/* === RESET === */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
/* === THEME TOKENS === */
:root[data-theme="dark"]{
--bg:#0a0a0c;--bg-primary:#141418;--bg-secondary:#1c1c22;
--surface:#141418;--surface2:#1c1c22;--surface3:#26262e;
--border:#2a2a34;--border-color:rgba(255,255,255,.12);--red:#ff2d55;--red-dim:rgba(255,45,85,.15);--red-glow:rgba(255,45,85,.3);
--text:#f0eef5;--text-primary:#f0eef5;--text-secondary:#b0acba;--text-muted:#8a8696;
--text2:#b0acba;--text3:#8a8696;
--color-primary:#ff2d55;
--shadow-card:0 12px 32px rgba(0,0,0,.4);--shadow-hero:0 16px 48px rgba(0,0,0,.5);
--nav-bg:rgba(10,10,12,.85);--tabs-bg:rgba(10,10,12,.75);
--player-bar:#181820;
}
:root[data-theme="light"]{
--bg:#f4f2ef;--bg-primary:#ffffff;--bg-secondary:#f0ede8;
--surface:#ffffff;--surface2:#f0ede8;--surface3:#e4e0da;
--border:#d8d4cc;--border-color:rgba(26,20,18,.12);--red:#e63946;--red-dim:rgba(230,57,70,.1);--red-glow:rgba(230,57,70,.2);
--text:#1a1412;--text-primary:#1a1412;--text-secondary:#5a544e;--text-muted:#7a746e;
--text2:#5a544e;--text3:#7a746e;
--color-primary:#e63946;
--shadow-card:0 8px 24px rgba(0,0,0,.08);--shadow-hero:0 12px 40px rgba(0,0,0,.1);
--nav-bg:rgba(244,242,239,.9);--tabs-bg:rgba(244,242,239,.85);
--player-bar:#f0ede8;
}
/* === BASE === */
html{font-size:16px;scroll-behavior:smooth;height:100%}
body{font-family:'Rubik',system-ui,sans-serif;background:var(--bg);color:var(--text);min-height:100vh;overflow-x:hidden;line-height:1.5;-webkit-font-smoothing:antialiased;transition:background .3s,color .3s;display:flex;flex-direction:column}
::-webkit-scrollbar{width:6px}
::-webkit-scrollbar-track{background:var(--bg)}
::-webkit-scrollbar-thumb{background:var(--surface3);border-radius:3px}
/* === NAV === */
.nav{position:fixed;top:0;left:0;right:0;z-index:200;height:56px;background:var(--nav-bg);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-bottom:1px solid var(--border);transition:background .3s}
.nav-inner{max-width:1280px;margin:0 auto;height:100%;padding:0 28px;display:flex;align-items:center;gap:4px}
.nav-logo{display:flex;align-items:center;gap:8px;text-decoration:none;flex-shrink:0;margin-right:12px}
.nav-logo-icon{width:28px;height:28px;background:var(--red);border-radius:6px;display:grid;place-items:center;font-size:13px;font-weight:900;color:#fff}
.nav-logo-text{font-size:15px;font-weight:800;color:var(--text);letter-spacing:-.3px}
.nav-sep{width:1px;height:20px;background:var(--border);margin:0 10px;flex-shrink:0}
.nav-links{display:flex;gap:2px}
.nav-links a{padding:6px 10px;border-radius:6px;text-decoration:none;font-size:12px;font-weight:600;color:var(--text2);transition:.15s}
.nav-links a:hover{color:var(--text);background:var(--surface2)}
.nav-links a.active{color:var(--red);background:var(--red-dim)}
.nav-tabs{display:flex;gap:2px;margin-right:auto}
.nav-tabs a{padding:6px 10px;border-radius:6px;text-decoration:none;font-size:11px;font-weight:700;letter-spacing:.3px;text-transform:uppercase;color:var(--text3);transition:.15s;white-space:nowrap}
.nav-tabs a:hover{color:var(--text2);background:var(--surface2)}
.nav-tabs a.active{color:var(--red);background:var(--red-dim)}
.nav-icons{display:flex;gap:4px;align-items:center;flex-shrink:0;margin-left: auto;}
.nav-icons button{width:34px;height:34px;border-radius:8px;border:none;background:none;color:var(--text2);cursor:pointer;display:grid;place-items:center;transition:.15s}
.nav-icons button:hover{color:var(--text);background:var(--surface2)}
.nav-icons button svg{width:18px;height:18px}
.nav-icons > .dropdown {margin-left:10px;}
.theme-toggle{position:relative}
.theme-toggle .icon-sun,.theme-toggle .icon-moon{position:absolute;inset:0;display:grid;place-items:center;transition:opacity .2s,transform .2s}
[data-theme="dark"] .theme-toggle .icon-sun{opacity:1;transform:rotate(0)}
[data-theme="dark"] .theme-toggle .icon-moon{opacity:0;transform:rotate(-90deg)}
[data-theme="light"] .theme-toggle .icon-sun{opacity:0;transform:rotate(90deg)}
[data-theme="light"] .theme-toggle .icon-moon{opacity:1;transform:rotate(0)}
/* === MAIN === */
main{padding-top:calc(56px + 16px);flex:1 0 auto}
/* === PROJECT STRIP / FEATURED / HERO / NEWS / LIST / CASTING / PHOTO GRID === */
.project-strip{background:var(--surface);border-bottom:1px solid var(--border);position:sticky;top:56px;z-index:100;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);transition:background .3s,border-color .3s}
.project-strip-inner{max-width:1280px;margin:0 auto;padding:10px 28px;display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.project-strip a{padding:7px 14px;border-radius:8px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;text-decoration:none;color:var(--text2);background:transparent;border:1px solid transparent;transition:.15s;white-space:nowrap}
.project-strip a:hover{color:var(--text);background:var(--surface2)}
.project-strip a.active{color:var(--red);background:var(--red-dim);border-color:rgba(255,45,85,.35)}
[data-theme="light"] .project-strip a.active{border-color:rgba(230,57,70,.35)}
.featured{max-width:1280px;margin:0 auto;padding:24px 28px 0;display:grid;grid-template-columns:1fr 320px;gap:24px;align-items:start}
.featured-main{min-width:0}
.ep-card--hero{position:relative;display:block;aspect-ratio:16/9;border-radius:12px;overflow:hidden;background:var(--surface);border:1px solid var(--border);text-decoration:none;color:#fff;box-shadow:var(--shadow-card);transition:.2s}
.ep-card--hero:hover{transform:translateY(-2px);box-shadow:var(--shadow-hero)}
.ep-card--hero img.hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .4s}
.ep-card--hero:hover img.hero-img{transform:scale(1.04)}
.ep-card--hero .hero-overlay{position:absolute;left:0;right:0;bottom:0;padding:24px;background:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.3) 50%,rgba(0,0,0,.85) 100%);z-index:2}
.ep-card--hero .hero-meta{font-size:12px;color:rgba(255,255,255,.85);margin-bottom:10px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.ep-card--hero .hero-meta .tag{padding:3px 8px;border-radius:4px;background:var(--red);color:#fff;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.4px}
.ep-card--hero .hero-meta .dot{width:3px;height:3px;border-radius:50%;background:rgba(255,255,255,.5)}
.ep-card--hero h3{font-size:22px;font-weight:800;line-height:1.2;letter-spacing:-.4px;text-shadow:0 2px 12px rgba(0,0,0,.4)}
.ep-card--hero .hero-views{position:absolute;top:12px;right:12px;background:rgba(0,0,0,.7);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);color:#fff;padding:4px 8px;border-radius:4px;font-size:11px;font-weight:700;z-index:3;display:flex;align-items:center;gap:4px}
.ep-card--hero .hero-views svg{width:11px;height:11px}
.news-sidebar{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:20px;position:sticky;top:calc(56px + 56px)}
.news-sidebar h2{font-size:15px;font-weight:800;margin-bottom:14px;letter-spacing:-.3px;display:flex;align-items:center;gap:8px}
.news-sidebar h2 svg{width:14px;height:14px;color:var(--red)}
.news-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column}
.news-list li{padding:12px 0;border-bottom:1px solid var(--border)}
.news-list li:last-child{border-bottom:none}
.news-time{display:inline-block;font-size:10px;font-weight:800;background:var(--surface2);color:var(--red);padding:2px 6px;border-radius:4px;margin-bottom:6px;letter-spacing:.3px}
.news-title{display:block;font-size:13px;font-weight:600;line-height:1.4;color:var(--text);text-decoration:none;transition:.15s}
.news-title:hover{color:var(--red)}
.news-all{display:inline-block;margin-top:14px;padding-top:14px;border-top:1px solid var(--border);width:100%;font-size:12px;font-weight:700;color:var(--red);text-decoration:none;text-align:center;letter-spacing:.3px}
.news-all:hover{opacity:.8}
.ep-list{display:flex;flex-direction:column;gap:8px}
.ep-card--compact{display:flex;gap:12px;background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:8px;text-decoration:none;color:inherit;transition:.15s;align-items:stretch}
.ep-card--compact:hover{border-color:var(--red);transform:translateX(2px)}
.ep-card--compact .thumb{position:relative;flex-shrink:0;width:170px;aspect-ratio:16/9;border-radius:6px;overflow:hidden;background:var(--surface2)}
.ep-card--compact .thumb img{width:100%;height:100%;object-fit:cover;transition:transform .35s}
.ep-card--compact:hover .thumb img{transform:scale(1.05)}
.ep-card--compact .thumb .badge{position:absolute;top:6px;left:6px;padding:1px 6px;border-radius:3px;font-size:9px;font-weight:800;background:rgba(0,0,0,.7);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);color:#fff;display:flex;align-items:center;gap:3px}
.ep-card--compact .thumb .badge svg{width:9px;height:9px}
.ep-card--compact .info{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center;gap:4px;padding:2px 4px 2px 0}
.ep-card--compact .info .meta{font-size:10px;color:var(--text3);text-transform:uppercase;letter-spacing:.4px;font-weight:700}
.ep-card--compact .info h3{font-size:13px;font-weight:700;line-height:1.3;color:var(--text);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ep-card--compact .info .date{font-size:11px;color:var(--text3);margin-top:2px}
.casting-banner{display:flex;max-width:1280px;margin:24px auto;background:var(--surface);border:1px solid var(--border);border-radius:12px;overflow:hidden;text-decoration:none;color:inherit;transition:.2s}
.casting-banner:hover{border-color:var(--red);transform:translateY(-2px);box-shadow:var(--shadow-card)}
.casting-banner img{width:300px;flex-shrink:0;object-fit:cover;aspect-ratio:1/1}
.casting-banner .casting-content{flex:1;padding:24px;display:flex;flex-direction:column;justify-content:center;gap:8px;min-width:0}
.casting-banner h3{font-size:18px;font-weight:800;line-height:1.3;letter-spacing:-.3px}
.casting-banner p{font-size:13px;color:var(--text2);line-height:1.5}
.casting-cta{display:inline-block;align-self:flex-start;padding:9px 20px;background:var(--red);color:#fff;border-radius:8px;font-size:12px;font-weight:700;text-decoration:none;margin-top:6px;transition:.15s;border:none;cursor:pointer;font-family:inherit}
.casting-cta:hover{opacity:.9}
.photo-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.photo-card{position:relative;display:block;text-decoration:none;color:inherit;background:var(--surface);border:1px solid var(--border);border-radius:10px;overflow:hidden;transition:.2s}
.photo-card:hover{border-color:var(--red);transform:translateY(-2px);box-shadow:var(--shadow-card)}
.photo-card img{width:100%;aspect-ratio:1/1;object-fit:cover;display:block;transition:transform .35s}
.photo-card:hover img{transform:scale(1.05)}
.photo-card .photo-count{position:absolute;top:8px;left:8px;background:rgba(0,0,0,.7);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);color:#fff;padding:2px 6px;border-radius:4px;font-size:10px;font-weight:700;display:flex;align-items:center;gap:3px}
.photo-card .photo-count svg{width:10px;height:10px}
.photo-card .photo-title{padding:10px 12px;font-size:12px;font-weight:600;line-height:1.35;color:var(--text);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.news-list-vertical{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;column-gap:32px}
.news-list-vertical li{padding:14px 0;border-bottom:1px solid var(--border);display:flex;align-items:flex-start;gap:14px}
.news-list-vertical .news-date{font-size:11px;color:var(--text3);min-width:130px;flex-shrink:0;font-weight:600}
.news-list-vertical .news-text{font-size:13px;font-weight:600;color:var(--text);text-decoration:none;line-height:1.4;transition:.15s}
.news-list-vertical .news-text:hover{color:var(--red)}
/* === SHOW MORE / AD BANNER / SECTION / EP-CARD / EP-GRID === */
.show-more-wrap{text-align:center;margin:32px 0 60px;padding:0 28px}
.show-more{padding:12px 32px;background:var(--surface);border:1px solid var(--border);color:var(--text);font-size:13px;font-weight:700;border-radius:8px;cursor:pointer;transition:.15s;font-family:inherit}
.show-more:hover{border-color:var(--red);color:var(--red)}
.ad-banner{max-width:1280px;margin:0 auto;padding:24px 28px 8px;display:flex;justify-content:center}
.ad-banner-inner{width:650px;max-width:100%;height:250px;border-radius:12px;overflow:hidden;background:var(--surface);border:1px solid var(--border);position:relative;display:grid;place-items:center;transition:background .3s,border-color .3s,transform .2s,box-shadow .2s}
.ad-banner-inner:hover{transform:translateY(-2px);box-shadow:var(--shadow-card)}
.ad-banner-inner video{width:100%;height:100%;object-fit:cover}
.ad-banner-inner .ad-label{position:absolute;top:8px;right:8px;padding:2px 8px;border-radius:4px;background:rgba(0,0,0,.55);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);color:rgba(255,255,255,.5);font-size:9px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;z-index:2}
.ad-banner-inner .ad-overlay{position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,rgba(0,0,0,.4) 100%);pointer-events:none;z-index:1}
.ad-banner-inner .ad-placeholder{display:flex;flex-direction:column;align-items:center;gap:6px;color:var(--text3);z-index:1}
.ad-banner-inner .ad-placeholder svg{width:24px;height:24px;opacity:.5}
.ad-banner-inner .ad-placeholder span{font-size:10px;font-weight:600;opacity:.6}
.ad-banner-inner .ad-muted{position:absolute;bottom:8px;right:8px;width:22px;height:22px;border-radius:4px;border:none;background:rgba(0,0,0,.5);color:rgba(255,255,255,.5);cursor:pointer;display:grid;place-items:center;z-index:2}
.ad-banner-inner .ad-muted svg{width:12px;height:12px}
.section--messages{padding-top:8px}
.section--messages .message{margin-bottom:8px}
.section{max-width:1280px;margin:0 auto;padding:32px 28px 0}
.section-head{display:flex;align-items:center;gap:16px;margin-bottom:18px}
.section-head h2{font-size:18px;font-weight:800;letter-spacing:-.3px;white-space:nowrap}
.section-head .divider{flex:1;height:1px;background:var(--border)}
.scroll-row{display:flex;gap:12px;overflow-x:auto;padding-bottom:12px;scroll-snap-type:x mandatory}
.scroll-row::-webkit-scrollbar{height:3px}
.scroll-row::-webkit-scrollbar-thumb{background:var(--surface3);border-radius:2px}
.ep-card{flex-shrink:0;width:260px;scroll-snap-align:start;background:var(--surface);border-radius:12px;overflow:hidden;border:1px solid var(--border);transition:.2s;cursor:pointer;position:relative;text-decoration:none;color:inherit;display:block}
.ep-card:hover{border-color:var(--red);transform:translateY(-3px);box-shadow:var(--shadow-card)}
.ep-card .thumb{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--surface2)}
.ep-card .thumb img{width:100%;height:100%;object-fit:cover;transition:transform .35s}
.ep-card:hover .thumb img{transform:scale(1.06)}
.ep-card .thumb .badge{position:absolute;top:8px;left:8px;padding:2px 8px;border-radius:4px;font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.4px}
.ep-card .thumb .badge.live{background:var(--red);color:#fff}
.ep-card .thumb .badge.views{background:rgba(0,0,0,.7);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);color:#fff;right:8px;left:auto;display:flex;align-items:center;gap:3px}
.ep-card .thumb .badge.views svg{width:10px;height:10px}
.ep-card .thumb .play-icon{position:absolute;inset:0;display:grid;place-items:center;opacity:0;transition:.2s}
.ep-card .thumb .play-icon .play-circle{width:52px;height:52px;border-radius:50%;background:var(--red);display:grid;place-items:center;box-shadow:0 4px 14px var(--red-glow);transition:.2s}
.ep-card .thumb .play-icon .play-circle svg{width:22px;height:22px;color:#fff;transition:.2s;margin-left:2px}
@media(hover:hover){.ep-card:hover .thumb .play-icon{opacity:1}}
@media(hover:none){.ep-card .thumb .play-icon{opacity:1;transition:none}}
@media(max-width:768px){.ep-card .thumb .play-icon{opacity:1;transition:none}}
.ep-card .info{padding:10px 12px 12px}
.ep-card .info h3{font-size:13px;font-weight:700;line-height:1.3;margin-bottom:4px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ep-card .info .meta{font-size:11px;color:var(--text3);display:flex;align-items:center;gap:6px}
.ep-card .info .meta .dot{width:2px;height:2px;border-radius:50%;background:var(--text3)}
.ep-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;padding-bottom:24px}
.ep-grid .ep-card{width:auto}
/* === ARCHIVE / PAGINATION / SEO === */
.archive{max-width:1280px;margin:20px auto 0;padding:0 28px 60px}
.archive-box{padding:24px;background:var(--surface);border-radius:12px;border:1px solid var(--border);transition:background .3s}
.archive-box h2{font-size:15px;font-weight:700;margin-bottom:14px;display:flex;align-items:center;gap:8px}
.archive-box h2 svg{width:16px;height:16px;color:var(--text3)}
.archive-row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.archive-row select,.archive-row input[type=date]{padding:10px 14px;border-radius:8px;border:1px solid var(--border);background:var(--surface2);font-family:inherit;font-size:13px;color:var(--text);flex:1;min-width:140px;transition:border-color .15s,background .3s,color .3s}
.archive-row select:focus,.archive-row input[type=date]:focus{outline:none;border-color:var(--red)}
.archive-row option{background:var(--surface2)}
.archive-btn{padding:10px 24px;border-radius:8px;border:none;background:var(--red);color:#fff;font-family:inherit;font-size:13px;font-weight:700;cursor:pointer;transition:.2s;white-space:nowrap}
.archive-btn:hover{opacity:.9}
/*
.pagination{max-width:1280px;margin:0 auto;padding:8px 28px 0;display:flex;justify-content:center;align-items:center;gap:6px}
.page-link{min-width:36px;height:36px;display:inline-grid;place-items:center;padding:0 12px;border-radius:8px;border:1px solid var(--border);background:var(--surface);color:var(--text2);font-family:inherit;font-size:13px;font-weight:700;text-decoration:none;transition:.15s}
.page-link:hover{border-color:var(--text3);color:var(--text)}
.page-link.active{background:var(--red);border-color:var(--red);color:#fff;cursor:default}
.page-link.next{padding:0 10px}
.page-link.next svg{width:14px;height:14px}
ul.pagination{list-style:none}
.pagination .page-item{list-style:none}
.page-item.disabled .page-link{opacity:.4;cursor:not-allowed;color:var(--text3)}
.page-item.disabled .page-link:hover{border-color:var(--border);color:var(--text3)}
.page-item-next .page-link{padding:0 10px;gap:6px}
.page-item-next .page-link svg{width:14px;height:14px}
.icms-svg-icon.w-16{width:16px;height:16px}
.d-none{display:none}
.d-sm-inline-block{display:none}
.mb-0{margin-bottom:0}
.my-3{margin-top:12px;margin-bottom:12px}
.w-16{width:16px}
@media(min-width:640px){.d-sm-inline-block{display:inline-block}}
@media(min-width:768px){.my-md-4{margin-top:16px;margin-bottom:16px}}
.seo-block{max-width:1280px;margin:32px auto 0;padding:0 28px}
.seo-block h2{font-size:18px;font-weight:800;letter-spacing:-.3px;margin:24px 0 10px;color:var(--text)}
.seo-block h2:first-child{margin-top:0}
.seo-block p{font-size:14px;line-height:1.7;color:var(--text2);margin-bottom:12px}
*/
.list-unstyled {
margin: 0;
padding: 0;
list-style: none;
}
.main-notify {
padding: 15px 20px;
background-color: var(--surface);
border-radius: 10px;
}
.main-notify h1{
margin-bottom: 15px;
font-size: 26px;
font-weight: 500;
}
.main-notify h3 {margin-bottom: 15px;font-weight: 500;}
.main-notify p { margin-bottom: 15px; }
.main-notify p:last-child {margin-bottom: 0;}
.main-notify ul { margin: 0 0 20px 0; padding-left: 15px;}
/* ── pagination ── */
.pagination {
display: flex;
gap: 4px;
list-style: none;
margin: 0;
padding: 0;
justify-content: center;
}
.page_prev,
.page_next {
display: inline-flex;
align-items: center;
}
.page_prev a,
.page_next a,
.page_prev > span,
.page_next > span,
.pages a,
.pages > span:not(.nav_ext) {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 36px;
height: 36px;
padding: 0 10px;
border-radius: 8px;
border: 1px solid var(--border);
background: var(--surface);
color: var(--text2);
font-size: 13px;
font-weight: 600;
text-decoration: none;
transition: all 0.15s ease;
}
.page_prev a:hover,
.page_next a:hover,
.pages a:hover {
border-color: var(--red);
color: var(--red);
background: var(--red-dim);
}
.pages > span:not(.nav_ext) {
background: var(--red);
border-color: var(--red);
color: #fff;
cursor: default;
}
.page_prev > span,
.page_next > span {
opacity: 0.4;
pointer-events: none;
cursor: not-allowed;
}
.page_prev a,
.page_next a {
gap: 6px;
min-width: 44px;
}
.page_prev svg.pagi-icon,
.page_next svg.pagi-icon {
width: 14px;
height: 14px;
flex-shrink: 0;
stroke: currentColor;
display: inline-block;
vertical-align: middle;
}
.pages .nav_ext {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 36px;
height: 36px;
padding: 0 10px;
border-radius: 8px;
border: 1px solid var(--border);
background: var(--surface);
color: var(--text3);
font-size: 13px;
font-weight: 600;
opacity: 0.4;
pointer-events: none;
cursor: not-allowed;
}
.d-none {
display: none;
}
.d-sm-inline-block {
display: none;
}
.mb-0 {
margin-bottom: 0;
}
.my-3 {
margin-top: 12px;
margin-bottom: 12px;
}
.w-16 {
width: 16px;
}
@media (min-width: 640px) {
.d-sm-inline-block {
display: inline-block;
}
}
@media (min-width: 768px) {
.my-md-4 {
margin-top: 16px;
margin-bottom: 16px;
}
}
@media (max-width: 480px) {
.pagination {
gap: 2px;
}
.page_prev a,
.page_next a,
.page_prev > span,
.page_next > span,
.pages a,
.pages > span:not(.nav_ext) {
min-width: 34px;
height: 34px;
padding: 0 8px;
font-size: 12px;
border-radius: 6px;
}
.page_prev a,
.page_next a {
min-width: 40px;
}
}
/* === FOOTER === */
footer{border-top:1px solid var(--border);padding:40px 28px 24px;background:var(--surface);transition:background .3s;flex-shrink:0}
.footer-inner{max-width:1280px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr 1fr 1fr;gap:32px}
.footer-inner h4{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--text3);margin-bottom:10px}
.footer-inner a{display:block;color:var(--text2);text-decoration:none;font-size:13px;padding:2px 0;transition:.15s}
.footer-inner a:hover{color:var(--red)}
.footer-bottom{max-width:1280px;margin:24px auto 0;padding-top:16px;border-top:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;font-size:11px;color:var(--text3)}
.footer-bottom .age{width:26px;height:26px;border-radius:50%;border:1.5px solid var(--text3);display:grid;place-items:center;font-size:10px;font-weight:800}
/* === BASE RESPONSIVE === */
@media(max-width:768px){
.nav-tabs a{padding:6px 6px;font-size:10px;letter-spacing:.2px}
.nav-tabs a:first-child{padding-left:0}
.ep-grid{grid-template-columns:repeat(2,1fr)}
.featured{grid-template-columns:1fr}
.news-sidebar{position:static}
.photo-grid{grid-template-columns:repeat(3,1fr)}
.news-list-vertical{grid-template-columns:1fr}
.comments-section__header{flex-wrap:wrap;gap:10px}
.comments-section__actions{width:100%}
.comments-section__actions .btn{flex:1;justify-content:center}
.comments-section__actions .btn span:not(.d2c__icon){display:none}
}
@media(max-width:640px){
.nav-inner{gap:2px;padding:0 12px}
.nav-links{display:none}
.nav-sep:first-of-type{display:none}
.nav-tabs a{padding:5px 6px;font-size:9px;display:none;}
.nav-logo-text{font-size:13px}
.project-strip-inner{padding:8px 16px;gap:4px}
.project-strip a{padding:6px 10px;font-size:10px}
.section,.archive,.pagination,.seo-block{padding-left:16px;padding-right:16px}
.featured{padding:16px}
.hero h1{font-size:22px}
.ep-grid{grid-template-columns:1fr}
.ep-card--hero h3{font-size:16px}
.ep-card--hero .hero-overlay{padding:14px}
.ep-card--compact{flex-direction:row;padding:6px}
.ep-card--compact .thumb{width:120px}
.casting-banner{flex-direction:column;margin:16px}
.casting-banner img{width:100%;height:200px;aspect-ratio:auto}
.casting-banner .casting-content{padding:18px}
.photo-grid{grid-template-columns:repeat(2,1fr)}
.news-list-vertical li{flex-direction:column;gap:4px}
.news-list-vertical .news-date{min-width:0}
.footer-inner{grid-template-columns:1fr}
}
/* === TYPOGRAPHY SHOWCASE === */
/* === Typography showcase === */
.type-display-1{font-size:clamp(40px,7vw,72px);font-weight:900;line-height:1.05;letter-spacing:-1.5px;color:var(--text)}
.type-display-2{font-size:clamp(32px,5vw,52px);font-weight:800;line-height:1.1;letter-spacing:-1px;color:var(--text)}
.type-h1{font-size:32px;font-weight:800;line-height:1.15;letter-spacing:-.6px;color:var(--text);margin:0 0 14px}
.type-h2{font-size:24px;font-weight:800;line-height:1.2;letter-spacing:-.4px;color:var(--text);margin:0 0 12px}
.type-h3{font-size:18px;font-weight:800;line-height:1.3;color:var(--text);margin:0 0 10px}
.type-h4{font-size:15px;font-weight:700;line-height:1.3;color:var(--text);margin:0 0 8px}
.type-h5{font-size:13px;font-weight:700;line-height:1.3;color:var(--text);text-transform:uppercase;letter-spacing:.4px;margin:0 0 6px}
.type-h6{font-size:11px;font-weight:800;line-height:1.3;color:var(--text3);text-transform:uppercase;letter-spacing:.6px;margin:0 0 4px}
.type-lead{font-size:16px;line-height:1.65;color:var(--text2);font-weight:500}
.type-body{font-size:14px;line-height:1.65;color:var(--text)}
.type-small{font-size:12px;line-height:1.5;color:var(--text2)}
.type-caption{font-size:11px;line-height:1.4;color:var(--text3);letter-spacing:.2px}
.type-mark{background:var(--red-dim);color:var(--red);padding:1px 5px;border-radius:3px;font-weight:600}
.type-code{font-family:'SF Mono',Menlo,monospace;font-size:.9em;background:var(--surface2);border:1px solid var(--border);padding:1px 6px;border-radius:4px;color:var(--text)}
.type-kbd{font-family:'SF Mono',Menlo,monospace;font-size:.85em;background:var(--surface2);border:1px solid var(--border);border-bottom-width:2px;padding:2px 7px;border-radius:5px;color:var(--text);font-weight:600}
.type-blockquote{margin:0;padding:16px 20px;border-left:3px solid var(--red);background:var(--surface2);border-radius:0 8px 8px 0;font-style:italic;color:var(--text2);line-height:1.6}
.type-blockquote cite{display:block;margin-top:8px;font-style:normal;font-size:12px;color:var(--text3)}
.type-pre{background:var(--surface2);border:1px solid var(--border);border-radius:8px;padding:16px;overflow-x:auto;font-family:'SF Mono',Menlo,monospace;font-size:13px;line-height:1.6;color:var(--text);margin:0}
.type-list{padding-left:24px;color:var(--text);line-height:1.8}
.type-list--bare{list-style:none;padding:0}
.type-list--bare li{padding:6px 0;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;gap:10px}
.type-list--bare li:last-child{border-bottom:none}
.type-list--bare li span:last-child{color:var(--text2);font-size:12px}
.weight-row{display:flex;align-items:baseline;gap:14px;padding:10px 0;border-bottom:1px solid var(--border);font-size:18px}
.weight-row:last-child{border-bottom:none}
.weight-row .name{font-size:11px;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:.4px;min-width:90px}
.weight-row .name code{font-family:'SF Mono',Menlo,monospace;color:var(--text2)}
.color-swatch{display:flex;align-items:center;gap:12px;padding:10px;background:var(--surface2);border:1px solid var(--border);border-radius:8px;margin-bottom:6px}
.color-swatch-chip{width:36px;height:36px;border-radius:6px;border:1px solid var(--border);flex-shrink:0}
.color-swatch-name{font-size:13px;font-weight:700;color:var(--text)}
.color-swatch-value{font-size:11px;color:var(--text3);font-family:'SF Mono',Menlo,monospace}
/* === FORM LAYOUT / HEAD === */
/* === Layouts === */
.form-page{min-height:calc(100vh - 56px - 280px);display:grid;place-items:center;padding:48px 28px 60px}
.form-page--wide{align-items:start;padding-top:32px}
.form-card{position:relative;width:100%;max-width:440px;background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:32px;box-shadow:var(--shadow-card);animation:form-in .5s cubic-bezier(.2,.7,.2,1)}
.form-card--wide{max-width:960px}
.form-head{text-align:center;margin-bottom:24px}
.form-logo{width:48px;height:48px;margin:0 auto 14px;background:var(--red);color:#fff;border-radius:12px;display:grid;place-items:center;font-size:22px;font-weight:900;box-shadow:0 6px 18px var(--red-glow)}
.form-title{font-size:22px;font-weight:800;letter-spacing:-.4px;margin-bottom:6px;color:var(--text)}
.form-sub{font-size:13px;color:var(--text2);line-height:1.5}
.form-foot{text-align:center;margin-top:20px;font-size:13px;color:var(--text2)}
.form-foot .link{font-weight:600}
@keyframes form-in{from{opacity:0;transform:translateY(16px) scale(.99)}to{opacity:1;transform:translateY(0) scale(1)}}
/* === TABS === */
/* === Tabs === */
.tabs-nav{display:flex;gap:4px;padding:4px;background:var(--surface2);border-radius:10px;margin-bottom:20px}
.tabs-btn{flex:1;padding:9px 14px;border:none;background:transparent;color:var(--text2);font-family:inherit;font-size:13px;font-weight:600;border-radius:7px;cursor:pointer;transition:.2s}
.tabs-btn:hover{color:var(--text)}
.tabs-btn.active{background:var(--surface);color:var(--text);box-shadow:0 2px 6px rgba(0,0,0,.06)}
.tabs-panel{animation:tab-in .25s ease}
@keyframes tab-in{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}
/* === FORM CORE (group, label, row, help, error, states) === */
/* === Form === */
.form{display:flex;flex-direction:column;gap:14px}
.form-group{display:flex;flex-direction:column;gap:6px;position:relative}
.form-label{font-size:12px;font-weight:600;color:var(--text2);letter-spacing:.2px}
.form-label .req{color:var(--red);margin-left:2px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form-row--inline{display:flex;justify-content:space-between;align-items:center;gap:10px}
.form-help{font-size:11px;color:var(--text3);margin-top:2px}
.form-error{font-size:11px;color:var(--red);font-weight:600;display:none;align-items:center;gap:4px}
.form-error svg{width:12px;height:12px;flex-shrink:0}
/* States */
.form-group.has-error .input,.form-group.has-error .textarea,.form-group.has-error .select{ border-color:var(--red);background:rgba(255,45,85,.04)}
[data-theme="light"] .form-group.has-error .input,[data-theme="light"] .form-group.has-error .textarea,[data-theme="light"] .form-group.has-error .select{background:rgba(230,57,70,.04)}
.form-group.has-error .form-error{display:flex}
.form-group.has-error .form-help{display:none}
.form-group.has-success .input,.form-group.has-success .textarea{border-color:#22c55e}
.form-group.has-success .form-success{display:flex}
/* === INPUTS / TEXTAREA / SIZES === */
/* === Input === */
.input,.textarea,.select{width:100%;padding:11px 14px;background:var(--surface2);border:1px solid var(--border);border-radius:9px;color:var(--text);font-family:inherit;font-size:14px;line-height:1.4;transition:border-color .15s,background .15s,box-shadow .15s;outline:none}
.input:hover,.textarea:hover,.select:hover{border-color:var(--text3)}
.input:focus,.textarea:focus,.select:focus{border-color:var(--red);box-shadow:0 0 0 3px var(--red-dim)}
.input::placeholder,.textarea::placeholder{color:var(--text3)}
.input:disabled,.textarea:disabled,.select:disabled{opacity:.55;cursor:not-allowed;background:var(--surface)}
.input[readonly],.textarea[readonly]{background:var(--surface)}
.textarea{min-height:88px;resize:vertical;font-family:inherit}
.textarea--lg{min-height:140px}
.input--lg{padding:14px 18px;font-size:15px}
.input--sm{padding:8px 12px;font-size:13px}
/* === INPUT WITH ICON / ACTION / GROUP === */
/* === Input with icon/action === */
.input-wrap{position:relative;display:flex;align-items:center}
.input-wrap .input{padding-left:40px}
.input-wrap .input-icon{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--text3);pointer-events:none;width:16px;height:16px;display:grid;place-items:center}
.input-wrap .input-action,.input-with-action .input-action{position:absolute;right:10px;top:50%;transform:translateY(-50%);width:28px;height:28px;display:grid;place-items:center;border:none;background:transparent;color:var(--text3);cursor:pointer;border-radius:6px;transition:.15s}
.input-wrap .input-action:hover,.input-with-action .input-action:hover{color:var(--text);background:var(--surface)}
.input-wrap .input-action svg,.input-with-action .input-action svg{width:16px;height:16px}
.input-with-action{position:relative}
.input-with-action .input{padding-right:42px}
.input-action.toggle-pw.is-active{color:var(--red)}
/* === Input group (prefix/suffix) === */
.input-group{display:flex;align-items:stretch}
.input-group .input{border-radius:9px 0 0 9px;border-right:none}
.input-group .input:focus{border-right:1px solid var(--red)}
.input-group-addon{padding:0 14px;background:var(--surface3);border:1px solid var(--border);border-radius:9px 0 0 9px;display:flex;align-items:center;font-size:13px;font-weight:600;color:var(--text2);font-family:inherit;white-space:nowrap;user-select:none}
.input-group-addon--right{border-radius:0 9px 9px 0;border-left:none;border-right:1px solid var(--border)}
.input-group .input:first-child{border-radius:9px 0 0 9px}
.input-group .input:last-child{border-radius:0 9px 9px 0;border-right:1px solid var(--border)}
.input-group .input:focus + .input-group-addon--right,.input-group .input:focus{border-color:var(--red)}
/* === SELECT === */
/* === Select === */
.select-wrapper{position:relative}
.select-wrapper::after{content:"";position:absolute;right:14px;top:50%;width:8px;height:8px;border-right:1.5px solid var(--text3);border-bottom:1.5px solid var(--text3);transform:translateY(-70%) rotate(45deg);pointer-events:none;transition:.15s}
.select-wrapper .select{appearance:none;padding-right:36px;cursor:pointer}
.select-wrapper .select option{background:var(--surface2);color:var(--text)}
/* === CHECKBOX / RADIO === */
/* === Checkbox & Radio === */
.choice{display:flex;align-items:flex-start;gap:10px;cursor:pointer;user-select:none;padding:8px 10px;border-radius:8px;transition:.15s}
.choice:hover{background:var(--surface2)}
.choice input{appearance:none;width:18px;height:18px;border:1.5px solid var(--border);background:var(--surface2);display:grid;place-items:center;flex-shrink:0;margin-top:1px;transition:.15s;cursor:pointer;border-radius:4px}
.choice input[type="radio"]{border-radius:50%}
.choice input:hover{border-color:var(--text3)}
.choice input:checked{background:var(--red);border-color:var(--red)}
.choice input:checked::after{content:"";width:10px;height:5px;border-left:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(-45deg) translate(1px,-1px);background:transparent}
.choice input[type="radio"]:checked::after{width:8px;height:8px;background:#fff;border:none;transform:none;border-radius:50%}
.choice input:focus-visible{box-shadow:0 0 0 3px var(--red-dim)}
.choice-label{font-size:13px;color:var(--text);line-height:1.4}
.choice-label small{display:block;font-size:11px;color:var(--text3);margin-top:2px}
.choice-stack{display:flex;flex-direction:column;gap:2px}
.choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:4px}
.choice--inline{flex-direction:row;align-items:center}
.checkbox,.radio{display:inline-flex;align-items:center;gap:8px;cursor:pointer;font-size:13px;color:var(--text)}
/* === TOGGLE === */
/* === Toggle switch === */
.toggle{position:relative;display:inline-flex;align-items:center;gap:10px;cursor:pointer;user-select:none}
.toggle input{position:absolute;opacity:0;pointer-events:none}
.toggle .toggle-track{width:38px;height:22px;background:var(--surface3);border-radius:99px;position:relative;transition:.2s;flex-shrink:0}
.toggle .toggle-track::after{content:"";position:absolute;top:2px;left:2px;width:18px;height:18px;background:#fff;border-radius:50%;box-shadow:0 1px 3px rgba(0,0,0,.2);transition:.2s}
.toggle input:checked + .toggle-track{background:var(--red)}
.toggle input:checked + .toggle-track::after{transform:translateX(16px)}
.toggle input:focus-visible + .toggle-track{box-shadow:0 0 0 3px var(--red-dim)}
.toggle-label{font-size:13px;color:var(--text)}
.toggle-label small{display:block;font-size:11px;color:var(--text3)}
/* === RANGE === */
/* === Range === */
.range-row{display:flex;align-items:center;gap:12px}
.range{flex:1;-webkit-appearance:none;appearance:none;height:4px;background:var(--surface3);border-radius:99px;outline:none;cursor:pointer}
.range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;background:var(--red);border-radius:50%;cursor:pointer;box-shadow:0 2px 6px var(--red-glow);transition:transform .15s}
.range::-webkit-slider-thumb:hover{transform:scale(1.15)}
.range::-moz-range-thumb{width:18px;height:18px;background:var(--red);border-radius:50%;cursor:pointer;border:none;box-shadow:0 2px 6px var(--red-glow)}
.range-value{min-width:48px;text-align:center;padding:4px 10px;background:var(--surface2);border:1px solid var(--border);border-radius:6px;font-size:12px;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums}
/* === COLOR === */
/* === Color === */
.color-row{display:flex;align-items:center;gap:12px}
.color-input{width:48px;height:48px;padding:0;border:1px solid var(--border);border-radius:9px;cursor:pointer;background:transparent;overflow:hidden}
.color-input::-webkit-color-swatch-wrapper{padding:4px}
.color-input::-webkit-color-swatch{border:none;border-radius:5px}
.color-hex{font-family:'SF Mono',Menlo,monospace;font-size:13px;color:var(--text2);padding:6px 10px;background:var(--surface2);border:1px solid var(--border);border-radius:6px;min-width:90px}
/* === DATE / TIME === */
/* === Date/time === */
.input[type="date"]::-webkit-calendar-picker-indicator,.input[type="time"]::-webkit-calendar-picker-indicator,.input[type="datetime-local"]::-webkit-calendar-picker-indicator,.input[type="month"]::-webkit-calendar-picker-indicator,.input[type="week"]::-webkit-calendar-picker-indicator{filter:invert(.5);cursor:pointer;opacity:.6;transition:.15s}
.input[type="date"]::-webkit-calendar-picker-indicator:hover,.input[type="time"]::-webkit-calendar-picker-indicator:hover,.input[type="datetime-local"]::-webkit-calendar-picker-indicator:hover,.input[type="month"]::-webkit-calendar-picker-indicator:hover,.input[type="week"]::-webkit-calendar-picker-indicator:hover{opacity:1}
[data-theme="light"] .input[type="date"]::-webkit-calendar-picker-indicator,[data-theme="light"] .input[type="time"]::-webkit-calendar-picker-indicator,[data-theme="light"] .input[type="datetime-local"]::-webkit-calendar-picker-indicator,[data-theme="light"] .input[type="month"]::-webkit-calendar-picker-indicator,[data-theme="light"] .input[type="week"]::-webkit-calendar-picker-indicator{filter:invert(0)}
/* === FILE UPLOAD === */
/* === File upload === */
.file-drop{position:relative;display:block;padding:24px;border:1.5px dashed var(--border);border-radius:10px;text-align:center;cursor:pointer;transition:.2s;background:var(--surface2)}
.file-drop:hover{border-color:var(--red);background:var(--red-dim)}
.file-drop input[type="file"]{position:absolute;inset:0;opacity:0;cursor:pointer}
.file-drop.has-file{border-style:solid;border-color:var(--red);background:var(--red-dim)}
.file-drop-icon{width:36px;height:36px;margin:0 auto 8px;background:var(--surface);border-radius:8px;display:grid;place-items:center;color:var(--text2)}
.file-drop-icon svg{width:18px;height:18px}
.file-drop-text{font-size:13px;color:var(--text);font-weight:600}
.file-drop-hint{font-size:11px;color:var(--text3);margin-top:4px}
.file-drop-name{font-size:12px;color:var(--red);font-weight:700;margin-top:6px;word-break:break-all}
.file-name{font-size:12px;color:var(--text2);margin-top:8px;display:flex;align-items:center;gap:6px;padding:8px 10px;background:var(--surface2);border:1px solid var(--border);border-radius:6px}
/* === PASSWORD STRENGTH === */
/* === Password strength === */
.pw-strength{margin-top:6px}
.pw-strength-bar{display:flex;gap:3px;height:4px;margin-bottom:6px}
.pw-strength-bar i{flex:1;height:100%;background:var(--surface3);border-radius:2px;transition:background .2s}
.pw-strength[data-score="0"] .pw-strength-bar i:nth-child(1){background:var(--red)}
.pw-strength[data-score="1"] .pw-strength-bar i:nth-child(-n+2){background:#f59e0b}
.pw-strength[data-score="2"] .pw-strength-bar i:nth-child(-n+3){background:#eab308}
.pw-strength[data-score="3"] .pw-strength-bar i{background:#22c55e}
.pw-strength-text{font-size:11px;font-weight:600;color:var(--text3)}
.pw-strength[data-score="0"] .pw-strength-text{color:var(--red)}
.pw-strength[data-score="1"] .pw-strength-text{color:#f59e0b}
.pw-strength[data-score="2"] .pw-strength-text{color:#eab308}
.pw-strength[data-score="3"] .pw-strength-text{color:#22c55e}
.pw-rules{list-style:none;padding:0;margin:8px 0 0;font-size:11px;color:var(--text3);display:grid;grid-template-columns:1fr 1fr;gap:4px}
.pw-rules li{display:flex;align-items:center;gap:5px;transition:color .2s}
.pw-rules li svg{width:11px;height:11px;flex-shrink:0}
.pw-rules li.met{color:#22c55e}
.pw-rules li svg{color:var(--text3)}
.pw-rules li.met svg{color:#22c55e}
/* === BUTTONS === */
/* === Buttons === */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 20px;border-radius:9px;font-family:inherit;font-size:13px;font-weight:700;cursor:pointer;transition:.2s;border:1px solid var(--border);background:var(--surface);color:var(--text);text-decoration:none;line-height:1.2;user-select:none}
.btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(0,0,0,.08)}
.btn:active{transform:translateY(0)}
.btn:disabled{opacity:.55;cursor:not-allowed;transform:none;box-shadow:none}
.btn--primary{background:var(--red);border-color:var(--red);color:#fff}
.btn--primary:hover{box-shadow:0 6px 18px var(--red-glow);color:#fff}
.btn--ghost{background:transparent;border-color:transparent;color:var(--text2)}
.btn--ghost:hover{color:var(--text);background:var(--surface2);box-shadow:none}
.btn--block{width:100%}
.btn--lg{padding:14px 24px;font-size:14px}
.btn--sm{padding:7px 14px;font-size:12px}
.btn svg{width:14px;height:14px}
.btn--social{flex:1;justify-content:center;background:var(--surface2)}
.btn--social svg{width:16px;height:16px}
.btn--vk{color:#0077ff}
.btn--ya{color:#fc3f1d}
.btn--mail{color:#005ff9}
.btn-row{display:flex;gap:8px;flex-wrap:wrap}
.btn-row--three{display:grid;grid-template-columns:1fr 1fr 1fr}
/* === LINKS / DIVIDER / SOCIAL === */
/* === Links === */
.link{color:var(--red);text-decoration:none;font-weight:600;transition:.15s}
.link:hover{text-decoration:underline}
/* Social login — temporarily hidden */
.form-divider,
.btn-row--three{display:none!important}
/* === Divider === */
.form-divider{display:flex;align-items:center;gap:12px;margin:18px 0;color:var(--text3);font-size:11px;font-weight:700;letter-spacing:.4px;text-transform:uppercase}
.form-divider::before,.form-divider::after{content:"";flex:1;height:1px;background:var(--border)}
/* === Social grid === */
.social-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}
/* === ALERTS === */
/* === Alerts === */
.alert,.message{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;border-radius:9px;font-size:13px;line-height:1.4;border:1px solid}
.alert svg,.message svg{width:16px;height:16px;flex-shrink:0;margin-top:1px}
.alert--info,.message.__info{background:var(--red-dim);border-color:rgba(255,45,85,.3);color:var(--red)}
.alert--success,.message.__success{background:rgba(34,197,94,.08);border-color:rgba(34,197,94,.3);color:#22c55e}
.alert--warning,.message.__warning{background:rgba(245,158,11,.08);border-color:rgba(245,158,11,.3);color:#f59e0b}
.alert--error,.message.__error{background:rgba(239,68,68,.08);border-color:rgba(239,68,68,.3);color:#ef4444}
/* === FORM GRID === */
/* === Form grid (wide layouts) === */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form-grid--three{grid-template-columns:1fr 1fr 1fr}
.form-grid--mixed{grid-template-columns:2fr 1fr 1fr}
/* === PAGE / SECTION / DEMO CARDS === */
/* === Section (typography & form elements pages) === */
.page{max-width:1100px;margin:0 auto;padding:32px 28px 60px}
.page-head{margin-bottom:32px;padding-bottom:20px;border-bottom:1px solid var(--border)}
.page-head h1, h1{font-size:32px;font-weight:800;letter-spacing:-.6px;margin-bottom:8px}
.page-head p, p{font-size:14px;color:var(--text2);max-width:640px;line-height:1.6}
.section{margin-bottom:48px;scroll-margin-top:80px}
.section-head{display:flex;align-items:baseline;gap:14px;margin-bottom:18px;padding-bottom:10px;}
.section-head h2, h2{font-size:20px;font-weight:800;letter-spacing:-.3px;color:var(--text)}
.section-head .tag{font-size:10px;font-weight:800;letter-spacing:.4px;text-transform:uppercase;color:var(--text3);padding:3px 8px;background:var(--surface2);border-radius:4px}
.section-sub{font-size:13px;color:var(--text2);margin-bottom:18px;line-height:1.5}
.demo-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:24px;margin-bottom:14px;transition:background .3s,border-color .3s}
.demo-card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px}
.demo-label{font-size:10px;font-weight:800;letter-spacing:.4px;text-transform:uppercase;color:var(--text3);margin-bottom:8px;display:flex;align-items:center;justify-content:space-between}
.demo-label code{font-family:'SF Mono',Menlo,monospace;font-size:10px;font-weight:600;padding:2px 6px;background:var(--surface2);border:1px solid var(--border);border-radius:4px;color:var(--text2);text-transform:none;letter-spacing:0}
/* === FORM ELEMENTS PAGE HELPERS === */
/* === Form elements page === */
.field-demo{display:flex;flex-direction:column;gap:6px}
.field-states{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px}
.field-state-label{font-size:10px;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:.4px;margin-bottom:2px}
/* === ANIMATION UTILITIES === */
/* === Animation utilities === */
.shake{animation:shake .35s ease}
@keyframes shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
.fade-in{animation:fade-in .4s ease both}
@keyframes fade-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.form-card,.tabs-panel,.fade-in,.shake{animation:none}}
/* === FORMS RESPONSIVE === */
/* === Responsive === */
@media(max-width:768px){
.form-page{padding:32px 16px 40px}
.form-card{padding:24px}
.form-card--wide{padding:20px}
.form-row{grid-template-columns:1fr}
.form-grid{grid-template-columns:1fr}
.form-grid--three,.form-grid--mixed{grid-template-columns:1fr}
.page{padding:24px 16px 40px}
.page-head h1{font-size:24px}
.section-head h2{font-size:17px}
.demo-card{padding:18px}
.btn-row--three{grid-template-columns:1fr}
.social-grid{grid-template-columns:1fr}
.pw-rules{grid-template-columns:1fr}
}
@media(max-width:640px){
.form-card{border-radius:12px}
.form-title{font-size:19px}
.field-states{grid-template-columns:1fr}
.section-head{flex-direction:column;gap:6px;align-items:flex-start}
}
/* === 404 PAGE === */
.nf-wrap{min-height:calc(100vh - 56px - 200px);display:grid;place-items:center;padding:40px 28px 60px;position:relative;overflow:hidden}
.nf-bg{position:absolute;inset:0;pointer-events:none;z-index:0;background:radial-gradient(ellipse at 50% 40%,var(--red-dim) 0%,transparent 55%)}
.nf-scanlines{position:absolute;inset:0;pointer-events:none;z-index:1;background:repeating-linear-gradient(0deg,transparent 0,transparent 3px,rgba(0,0,0,.06) 3px,rgba(0,0,0,.06) 4px);animation:nf-scan 6s linear infinite;mix-blend-mode:multiply}
[data-theme="light"] .nf-scanlines{background:repeating-linear-gradient(0deg,transparent 0,transparent 3px,rgba(0,0,0,.04) 3px,rgba(0,0,0,.04) 4px)}
.nf-noise{position:absolute;inset:0;pointer-events:none;z-index:1;opacity:.04;background-image:url("data:image/svg+xml;utf8,");animation:nf-noise .8s steps(4) infinite}
@keyframes nf-scan{from{transform:translateY(0)}to{transform:translateY(8px)}}
@keyframes nf-noise{0%{transform:translate(0,0)}25%{transform:translate(-2%,1%)}50%{transform:translate(1%,-2%)}75%{transform:translate(-1%,2%)}100%{transform:translate(0,0)}}
.nf-inner{position:relative;z-index:2;max-width:680px;width:100%;display:flex;flex-direction:column;align-items:center}
.nf-badge{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:99px;background:var(--red-dim);border:1px solid rgba(255,45,85,.35);color:var(--red);font-size:11px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;margin-bottom:24px;animation:nf-badge-pulse 1.6s ease-in-out infinite}
[data-theme="light"] .nf-badge{border-color:rgba(230,57,70,.35)}
.nf-badge .dot{width:6px;height:6px;border-radius:50%;background:var(--red);box-shadow:0 0 8px var(--red-glow);animation:nf-dot 1.2s ease-in-out infinite}
@keyframes nf-badge-pulse{0%,100%{box-shadow:0 0 0 0 var(--red-glow)}50%{box-shadow:0 0 0 6px transparent}}
@keyframes nf-dot{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.75)}}
.nf-tv{position:relative;display:inline-block;margin:8px 0 18px;padding:18px 28px 24px;background:linear-gradient(180deg,var(--surface) 0%,var(--surface2) 100%);border:1px solid var(--border);border-radius:18px;box-shadow:var(--shadow-hero)}
.nf-tv::before,.nf-tv::after{content:"";position:absolute;top:-14px;width:6px;height:14px;background:var(--surface3);border-radius:3px 3px 0 0;transform-origin:bottom center}
.nf-tv::before{left:30%;transform:rotate(-12deg)}
.nf-tv::after{right:30%;transform:rotate(12deg)}
.nf-screen{position:relative;display:inline-block;padding:6px;background:#0a0a0c;border-radius:10px;overflow:hidden}
.nf-screen::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0,transparent 2px,rgba(255,255,255,.03) 2px,rgba(255,255,255,.03) 3px);pointer-events:none;animation:nf-screen-flicker 3.5s steps(20) infinite}
@keyframes nf-screen-flicker{0%,100%{opacity:.9}5%{opacity:1}10%{opacity:.85}15%{opacity:1}20%{opacity:.92}60%{opacity:.85}62%{opacity:1}64%{opacity:.88}80%{opacity:1}}
.nf-code{position:relative;display:inline-block;font-family:'Rubik',sans-serif;font-size:clamp(96px,18vw,180px);font-weight:900;line-height:1;letter-spacing:-6px;color:var(--text);text-shadow:0 0 20px var(--red-glow);font-variant-numeric:tabular-nums}
.nf-code::before,.nf-code::after{content:attr(data-text);position:absolute;top:0;left:0;width:100%;height:100%;background:transparent;pointer-events:none}
.nf-code::before{color:var(--red);text-shadow:none;clip-path:inset(0 0 60% 0);animation:nf-glitch-r 2.4s steps(8) infinite}
.nf-code::after{color:#00e0ff;text-shadow:none;clip-path:inset(60% 0 0 0);animation:nf-glitch-c 2.4s steps(8) infinite}
[data-theme="light"] .nf-code::after{color:#0066cc}
@keyframes nf-glitch-r{0%,100%{transform:translate(0,0);opacity:0}10%{transform:translate(-3px,1px);opacity:.85}12%{transform:translate(0,0);opacity:0}40%{transform:translate(2px,-1px);opacity:.7}42%{transform:translate(0,0);opacity:0}70%{transform:translate(-2px,0);opacity:.8}72%{transform:translate(0,0);opacity:0}}
@keyframes nf-glitch-c{0%,100%{transform:translate(0,0);opacity:0}10%{transform:translate(3px,-1px);opacity:.85}12%{transform:translate(0,0);opacity:0}40%{transform:translate(-2px,1px);opacity:.7}42%{transform:translate(0,0);opacity:0}70%{transform:translate(2px,0);opacity:.8}72%{transform:translate(0,0);opacity:0}}
.nf-title{font-size:clamp(20px,3.5vw,28px);font-weight:800;letter-spacing:-.4px;margin:14px 0 10px;color:var(--text)}
.nf-sub{font-size:14px;line-height:1.65;color:var(--text2);max-width:460px;margin:0 auto 28px;text-align:center}
.nf-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.nf-btn{display:inline-flex;align-items:center;gap:8px;padding:12px 22px;border-radius:10px;font-family:inherit;font-size:13px;font-weight:700;text-decoration:none;cursor:pointer;transition:.2s;border:1px solid var(--border);background:var(--surface);color:var(--text)}
.nf-btn:hover{transform:translateY(-1px);border-color:var(--red);color:var(--red)}
.nf-btn--primary{background:var(--red);border-color:var(--red);color:#fff}
.nf-btn--primary:hover{opacity:.92;color:#fff;box-shadow:0 6px 18px var(--red-glow)}
.nf-btn svg{width:14px;height:14px}
.nf-timeline{margin:36px auto 0;max-width:420px;padding:14px 16px;background:var(--surface);border:1px solid var(--border);border-radius:10px;display:flex;align-items:center;gap:12px;font-size:11px;color:var(--text3);font-weight:700;letter-spacing:.4px;text-transform:uppercase}
.nf-timeline .bar{flex:1;height:3px;background:var(--surface3);border-radius:2px;overflow:hidden;position:relative}
.nf-timeline .bar::before{content:"";position:absolute;top:0;left:-40%;width:40%;height:100%;background:linear-gradient(90deg,transparent,var(--red),transparent);animation:nf-slide 2.4s ease-in-out infinite}
@keyframes nf-slide{0%{left:-40%}100%{left:100%}}
.nf-floats{position:absolute;inset:0;pointer-events:none;z-index:1;overflow:hidden}
.nf-float{position:absolute;width:54px;height:32px;border-radius:5px;background:var(--surface2);border:1px solid var(--border);opacity:0;animation:nf-drift 9s linear infinite}
.nf-float::before{content:"";position:absolute;inset:6px 6px auto 6px;height:14px;background:var(--surface3);border-radius:2px}
.nf-float::after{content:"";position:absolute;left:6px;bottom:4px;width:18px;height:3px;background:var(--red);border-radius:2px;opacity:.7}
.nf-float:nth-child(1){top:80%;left:-10%;animation-delay:0s}
.nf-float:nth-child(2){top:30%;left:-15%;width:42px;height:26px;animation-delay:2.5s;animation-duration:11s}
.nf-float:nth-child(3){top:55%;left:-8%;width:64px;height:38px;animation-delay:5s;animation-duration:13s}
.nf-float:nth-child(4){top:15%;left:-12%;width:48px;height:30px;animation-delay:7s;animation-duration:10s}
@keyframes nf-drift{0%{transform:translateX(0) rotate(-2deg);opacity:0}5%{opacity:.5}95%{opacity:.5}100%{transform:translateX(calc(100vw + 80px)) rotate(3deg);opacity:0}}
@media(max-width:768px){.nf-wrap{padding:24px 16px 40px}.nf-floats{display:none}}
@media(max-width:640px){.nf-tv{padding:14px 18px 18px;border-radius:14px}.nf-screen{padding:4px;border-radius:8px}.nf-code{letter-spacing:-3px}.nf-timeline{margin-top:28px}}
@media(prefers-reduced-motion:reduce){.nf-scanlines,.nf-noise,.nf-badge,.nf-badge .dot,.nf-screen::after,.nf-code::before,.nf-code::after,.nf-timeline .bar,.nf-float{animation:none}}
/* === OFFLINE / MAINTENANCE PAGE === */
.off-topbar{position:fixed;top:0;left:0;right:0;z-index:200;height:56px;background:var(--nav-bg);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 28px;transition:background .3s}
.off-topbar-logo{text-decoration:none;color:inherit;flex-shrink:0}
.off-theme-toggle{position:relative;width:34px;height:34px;border-radius:8px;border:none;background:none;color:var(--text2);cursor:pointer;display:grid;place-items:center;transition:.15s}
.off-theme-toggle:hover{color:var(--text);background:var(--surface2)}
.off-theme-toggle .icon-sun,.off-theme-toggle .icon-moon{position:absolute;inset:0;display:grid;place-items:center;transition:opacity .2s,transform .2s}
[data-theme="dark"] .off-theme-toggle .icon-sun{opacity:1;transform:rotate(0)}
[data-theme="dark"] .off-theme-toggle .icon-moon{opacity:0;transform:rotate(-90deg)}
[data-theme="light"] .off-theme-toggle .icon-sun{opacity:0;transform:rotate(90deg)}
[data-theme="light"] .off-theme-toggle .icon-moon{opacity:1;transform:rotate(0)}
.off-wrap{min-height:100vh;padding:calc(56px + 32px) 28px 48px;display:grid;place-items:center;position:relative;overflow:hidden}
.off-bg{position:absolute;inset:0;pointer-events:none;z-index:0;background:radial-gradient(ellipse at 50% 40%,var(--red-dim) 0%,transparent 55%)}
.off-scanlines{position:absolute;inset:0;pointer-events:none;z-index:1;background:repeating-linear-gradient(0deg,transparent 0,transparent 3px,rgba(0,0,0,.06) 3px,rgba(0,0,0,.06) 4px);animation:off-scan 6s linear infinite;mix-blend-mode:multiply}
[data-theme="light"] .off-scanlines{background:repeating-linear-gradient(0deg,transparent 0,transparent 3px,rgba(0,0,0,.04) 3px,rgba(0,0,0,.04) 4px)}
.off-noise{position:absolute;inset:0;pointer-events:none;z-index:1;opacity:.04;background-image:url("data:image/svg+xml;utf8,");animation:off-noise .8s steps(4) infinite}
@keyframes off-scan{from{transform:translateY(0)}to{transform:translateY(8px)}}
@keyframes off-noise{0%{transform:translate(0,0)}25%{transform:translate(-2%,1%)}50%{transform:translate(1%,-2%)}75%{transform:translate(-1%,2%)}100%{transform:translate(0,0)}}
.off-inner{position:relative;z-index:2;max-width:680px;width:100%;display:flex;flex-direction:column;align-items:center}
.off-badge{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:99px;background:var(--red-dim);border:1px solid rgba(255,45,85,.35);color:var(--red);font-size:11px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;margin-bottom:24px;animation:off-badge-pulse 1.6s ease-in-out infinite}
[data-theme="light"] .off-badge{border-color:rgba(230,57,70,.35)}
.off-badge .dot{width:6px;height:6px;border-radius:50%;background:var(--red);box-shadow:0 0 8px var(--red-glow);animation:off-dot 1.2s ease-in-out infinite}
@keyframes off-badge-pulse{0%,100%{box-shadow:0 0 0 0 var(--red-glow)}50%{box-shadow:0 0 0 6px transparent}}
@keyframes off-dot{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.75)}}
.off-tv{position:relative;display:inline-block;margin:8px 0 18px;padding:18px 28px 24px;background:linear-gradient(180deg,var(--surface) 0%,var(--surface2) 100%);border:1px solid var(--border);border-radius:18px;box-shadow:var(--shadow-hero)}
.off-tv::before,.off-tv::after{content:"";position:absolute;top:-14px;width:6px;height:14px;background:var(--surface3);border-radius:3px 3px 0 0;transform-origin:bottom center}
.off-tv::before{left:30%;transform:rotate(-12deg)}
.off-tv::after{right:30%;transform:rotate(12deg)}
.off-screen{position:relative;display:inline-block;padding:6px;background:#0a0a0c;border-radius:10px;overflow:hidden}
.off-screen::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0,transparent 2px,rgba(255,255,255,.03) 2px,rgba(255,255,255,.03) 3px);pointer-events:none;animation:off-screen-flicker 3.5s steps(20) infinite}
@keyframes off-screen-flicker{0%,100%{opacity:.9}5%{opacity:1}10%{opacity:.85}15%{opacity:1}20%{opacity:.92}60%{opacity:.85}62%{opacity:1}64%{opacity:.88}80%{opacity:1}}
.off-code{position:relative;display:inline-block;font-family:'Rubik',system-ui,sans-serif;font-size:clamp(96px,18vw,180px);font-weight:900;line-height:1;letter-spacing:-6px;color:#f5f3f7;text-shadow:0 0 26px var(--red-glow),0 0 8px var(--red-glow),0 0 2px rgba(255,255,255,.4);font-variant-numeric:tabular-nums}
.off-code::before,.off-code::after{content:attr(data-text);position:absolute;top:0;left:0;width:100%;height:100%;background:transparent;pointer-events:none}
.off-code::before{color:var(--red);text-shadow:none;clip-path:inset(0 0 60% 0);animation:off-glitch-r 2.4s steps(8) infinite}
.off-code::after{color:#00e0ff;text-shadow:none;clip-path:inset(60% 0 0 0);animation:off-glitch-c 2.4s steps(8) infinite}
[data-theme="light"] .off-code::after{color:#0066cc}
@keyframes off-glitch-r{0%,100%{transform:translate(0,0);opacity:0}10%{transform:translate(-3px,1px);opacity:.85}12%{transform:translate(0,0);opacity:0}40%{transform:translate(2px,-1px);opacity:.7}42%{transform:translate(0,0);opacity:0}70%{transform:translate(-2px,0);opacity:.8}72%{transform:translate(0,0);opacity:0}}
@keyframes off-glitch-c{0%,100%{transform:translate(0,0);opacity:0}10%{transform:translate(3px,-1px);opacity:.85}12%{transform:translate(0,0);opacity:0}40%{transform:translate(-2px,1px);opacity:.7}42%{transform:translate(0,0);opacity:0}70%{transform:translate(2px,0);opacity:.8}72%{transform:translate(0,0);opacity:0}}
.off-title{font-family:'Rubik',sans-serif;font-size:clamp(20px,3.5vw,28px);font-weight:800;letter-spacing:-.4px;margin:14px 0 10px;color:var(--text);text-align:center}
.off-sub{font-family:'Rubik',sans-serif;font-size:14px;line-height:1.65;color:var(--text2);max-width:480px;margin:0 auto 28px;text-align:center}
.off-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.off-btn{display:inline-flex;align-items:center;gap:8px;padding:12px 22px;border-radius:10px;font-family:'Rubik',sans-serif;font-size:13px;font-weight:700;text-decoration:none;cursor:pointer;transition:.2s;border:1px solid var(--border);background:var(--surface);color:var(--text)}
.off-btn:hover{transform:translateY(-1px);border-color:var(--red);color:var(--red)}
.off-btn--primary{background:var(--red);border-color:var(--red);color:#fff}
.off-btn--primary:hover{opacity:.92;color:#fff;box-shadow:0 6px 18px var(--red-glow)}
.off-btn svg{width:14px;height:14px}
.off-timeline{margin:36px auto 0;max-width:420px;padding:14px 16px;background:var(--surface);border:1px solid var(--border);border-radius:10px;display:flex;align-items:center;gap:12px;font-size:11px;color:var(--text3);font-weight:700;letter-spacing:.4px;text-transform:uppercase}
.off-timeline .bar{flex:1;height:3px;background:var(--surface3);border-radius:2px;overflow:hidden;position:relative}
.off-timeline .bar::before{content:"";position:absolute;top:0;left:-40%;width:40%;height:100%;background:linear-gradient(90deg,transparent,var(--red),transparent);animation:off-slide 2.4s ease-in-out infinite}
@keyframes off-slide{0%{left:-40%}100%{left:100%}}
.off-floats{position:absolute;inset:0;pointer-events:none;z-index:1;overflow:hidden}
.off-float{position:absolute;width:54px;height:32px;border-radius:5px;background:var(--surface2);border:1px solid var(--border);opacity:0;animation:off-drift 9s linear infinite}
.off-float::before{content:"";position:absolute;inset:6px 6px auto 6px;height:14px;background:var(--surface3);border-radius:2px}
.off-float::after{content:"";position:absolute;left:6px;bottom:4px;width:18px;height:3px;background:var(--red);border-radius:2px;opacity:.7}
.off-float:nth-child(1){top:80%;left:-10%;animation-delay:0s}
.off-float:nth-child(2){top:30%;left:-15%;width:42px;height:26px;animation-delay:2.5s;animation-duration:11s}
.off-float:nth-child(3){top:55%;left:-8%;width:64px;height:38px;animation-delay:5s;animation-duration:13s}
.off-float:nth-child(4){top:15%;left:-12%;width:48px;height:30px;animation-delay:7s;animation-duration:10s}
@keyframes off-drift{0%{transform:translateX(0) rotate(-2deg);opacity:0}5%{opacity:.5}95%{opacity:.5}100%{transform:translateX(calc(100vw + 80px)) rotate(3deg);opacity:0}}
.off-footer{border-top:1px solid var(--border);padding:40px 28px 24px;background:var(--surface);position:relative;z-index:2}
.off-footer-inner{max-width:1280px;margin:0 auto;display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px}
.off-footer-brand .nav-logo{display:inline-flex;margin-bottom:10px}
.off-footer-tag{font-size:12px;line-height:1.55;color:var(--text2);max-width:280px}
.off-footer-inner h4{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--text3);margin-bottom:10px}
.off-footer-inner a{display:block;color:var(--text2);text-decoration:none;font-size:13px;padding:2px 0;transition:.15s}
.off-footer-inner a:hover{color:var(--red)}
.off-footer-bottom{max-width:1280px;margin:24px auto 0;padding-top:16px;border-top:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;font-size:11px;color:var(--text3)}
.off-footer-bottom .age{width:26px;height:26px;border-radius:50%;border:1.5px solid var(--text3);display:grid;place-items:center;font-size:10px;font-weight:800}
@media(max-width:768px){.off-wrap{padding:calc(56px + 16px) 16px 32px}.off-floats{display:none}.off-footer-inner{grid-template-columns:1fr 1fr;gap:24px}.off-footer-brand{grid-column:1 / -1}}
@media(max-width:520px){.off-tv{padding:14px 18px 18px;border-radius:14px}.off-screen{padding:4px;border-radius:8px}.off-code{letter-spacing:-3px}.off-timeline{margin-top:28px}.off-footer-inner{grid-template-columns:1fr}.off-footer-bottom{flex-direction:column;gap:8px}}
@media(prefers-reduced-motion:reduce){.off-scanlines,.off-noise,.off-badge,.off-badge .dot,.off-screen::after,.off-code::before,.off-code::after,.off-timeline .bar,.off-float{animation:none}}
/* === CONTENT TYPOGRAPHY (content pages) === */
.page > h1{max-width:760px;margin:0 auto 20px;font-size:32px;font-weight:800;letter-spacing:-.5px;line-height:1.2;color:var(--text)}
.content_item{max-width:760px;margin:0 auto 24px !important;font-size:16px;line-height:1.7;color:var(--text)}
.content_item .value{line-height:1.7}
.content_item .value > h2:first-of-type,.content_item .value > h3:first-of-type,.content_item .value > h4:first-of-type{margin-top:16px}
.content_item h2,.content_item h3,.content_item h4{font-weight:700;line-height:1.3;color:var(--text);margin:32px 0 12px;letter-spacing:-.2px}
.content_item h2{font-size:22px}
.content_item h3{font-size:18px;margin-top:28px}
.content_item h4{font-size:13px;margin-top:24px;text-transform:uppercase;letter-spacing:.5px;color:var(--text2)}
.content_item p{margin:0 0 14px;line-height:1.7;color:var(--text)}
.content_item p:last-child{margin-bottom:0}
.content_item strong,.content_item b{font-weight:700;color:var(--text)}
.content_item a{color:var(--red);text-decoration:none;border-bottom:1px solid transparent;transition:border-color .15s}
.content_item a:hover{border-bottom-color:var(--red)}
.content_item ul,.content_item ol{margin:0 0 16px;padding-left:24px;color:var(--text)}
.content_item ul{list-style:disc}
.content_item ol{list-style:decimal}
.content_item li{margin-bottom:6px;line-height:1.65}
.content_item li > ul,.content_item li > ol{margin-top:6px;margin-bottom:6px}
.content_item li::marker{color:var(--text3)}
.content_item blockquote{margin:20px 0;padding:12px 18px;border-left:3px solid var(--red);background:var(--surface2);border-radius:0 8px 8px 0;color:var(--text2);font-style:italic}
.content_item hr{border:0;height:1px;background:var(--border);margin:24px 0}
.content_item code{background:var(--surface2);padding:2px 6px;border-radius:4px;font-family:ui-monospace,SFMono-Regular,monospace;font-size:14px;color:var(--text)}
.content_item pre{background:var(--surface2);padding:14px 18px;border-radius:8px;overflow-x:auto;font-size:14px;line-height:1.5;margin:0 0 16px}
.content_item pre code{padding:0;background:transparent}
.content_item img{max-width:100%;height:auto;border-radius:8px;margin:8px 0}
@media(max-width:640px){
.page > h1{font-size:26px}
.content_item h2{font-size:20px}
.content_item h3{font-size:17px}
}
/* === PLAYER PAGE === */
.player-page{max-width:1280px;margin:0 auto;padding:0 0 60px}
.player-page.visible{display:block;animation:pf .3s ease}
@keyframes pf{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.player-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px;flex-wrap:wrap}
.player-top .player-back{margin-bottom:0}
.player-back{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:8px;border:1px solid var(--border);background:var(--surface);color:var(--text2);font-size:12px;font-family:inherit;font-weight:600;cursor:pointer;transition:.15s;text-decoration:none}
.player-back:hover{border-color:var(--text3);color:var(--text)}
.player-back svg{width:14px;height:14px}
.player-actions{position:relative}
.player-actions-btn{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:8px;border:1px solid var(--border);background:var(--surface);color:var(--text2);font-size:12px;line-height:1;font-family:inherit;font-weight:600;cursor:pointer;transition:.15s;text-decoration:none;appearance:none;-webkit-appearance:none}
.player-actions-btn:hover{border-color:var(--text3);color:var(--text)}
.player-actions-chevron{width:14px;height:14px;flex-shrink:0;transition:transform .2s}
.player-actions-btn[aria-expanded="true"]{border-color:var(--text3);color:var(--text)}
.player-actions-btn[aria-expanded="true"] .player-actions-chevron{transform:rotate(180deg)}
.player-actions .dropdown-menu{position:absolute;top:calc(100% + 6px);right:0;left:auto;z-index:50;display:none;float:none;min-width:220px;padding:6px;margin:0;font-size:13px;list-style:none;background:var(--surface);border:1px solid var(--border);border-radius:8px;box-shadow:var(--shadow-card)}
.player-actions.open .dropdown-menu,.player-actions .dropdown-menu.show{display:block}
.player-actions .dropdown-menu > li{display:block}
.player-actions .dropdown-menu .dropdown-item{display:flex;align-items:center;gap:8px;width:100%;padding:8px 12px;border:0;border-radius:6px;color:var(--text);text-decoration:none;white-space:nowrap;background:transparent;font-weight:500;line-height:1.3;transition:background .12s,color .12s}
.player-actions .dropdown-menu .dropdown-item:hover,.player-actions .dropdown-menu .dropdown-item:focus{background:var(--surface2);color:var(--text)}
.player-actions .dropdown-menu .dropdown-item svg.icms-svg-icon{width:14px;height:14px;flex-shrink:0}
.player-actions .dropdown-menu .nav-item-text{line-height:1.2}
.player-layout{display:grid;grid-template-columns:1fr 340px;gap:28px}
.player-main{min-width:0}
.player-video-wrap{border-radius:12px;overflow:hidden;background:#000;box-shadow:var(--shadow-card)}
.player-video-wrap .plyr{--plyr-color-main:var(--red);border-radius:0}
.player-video-wrap .plyr__video-wrapper{background:#000}
.player-preview{position:relative;aspect-ratio:16/9;cursor:pointer;overflow:hidden;background:#000;transition:background .3s}
.player-preview img{width:100%;height:100%;object-fit:cover;transition:transform .35s,opacity .3s}
.player-preview:hover img{transform:scale(1.04)}
.player-preview--no-cover{background:linear-gradient(135deg,#1c1c22 0%,#26262e 100%)}
.player-preview--no-cover .player-play-btn{opacity:1}
.player-preview--playing{cursor:default;background:#000;aspect-ratio:16/9}
.player-preview--playing .player-plyr{position:absolute;inset:0;width:100%;height:100%}
.player-preview--playing iframe,.player-preview--playing video,.player-preview--playing .plyr,.player-preview--playing .plyr__video-wrapper{display:block;width:100%;height:100%;aspect-ratio:16/9;border:0}
.player-play-btn{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:80px;height:80px;border-radius:50%;border:none;background:var(--red);color:#fff;cursor:pointer;display:grid;place-items:center;transition:transform .2s,box-shadow .2s,opacity .25s;box-shadow:0 8px 24px rgba(0,0,0,.45),0 0 0 0 var(--red-glow);opacity:0}
.player-preview:hover .player-play-btn,.player-preview:focus-within .player-play-btn{opacity:1;transform:translate(-50%,-50%) scale(1.08);box-shadow:0 12px 32px rgba(0,0,0,.55),0 0 0 8px var(--red-glow)}
.player-play-btn:focus-visible{outline:none;opacity:1}
.player-play-btn svg{width:32px;height:32px;margin-left:4px}
@media(hover:none){.player-play-btn{opacity:1;transition:transform .2s,box-shadow .2s}}
@media(max-width:768px){.player-play-btn{opacity:1;transition:transform .2s,box-shadow .2s}}
.player-plyr{position:relative}
.player-modal{position:fixed;inset:0;z-index:9999;background:rgba(0,0,0,.85);display:flex;align-items:center;justify-content:center;padding:20px;animation:playerModalFade .2s ease;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.player-modal__inner{position:relative;width:100%;max-width:1280px;background:#000;border-radius:12px;overflow:hidden;box-shadow:0 24px 60px rgba(0,0,0,.6);aspect-ratio:16/9;animation:playerModalZoom .2s ease}
.player-modal__close{position:absolute;top:-44px;right:0;width:36px;height:36px;border-radius:50%;border:none;background:rgba(255,255,255,.15);color:#fff;cursor:pointer;display:grid;place-items:center;transition:background .15s;z-index:2;-webkit-tap-highlight-color:transparent}
.player-modal__close:hover{background:rgba(255,255,255,.3)}
.player-modal__close svg{width:18px;height:18px}
.player-modal__frame{position:absolute;inset:0;width:100%;height:100%}
.player-modal__frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
@keyframes playerModalFade{from{opacity:0}to{opacity:1}}
@keyframes playerModalZoom{from{transform:scale(.95);opacity:0}to{transform:scale(1);opacity:1}}
@media(max-width:640px){
.player-modal{padding:0}
.player-modal__inner{border-radius:0;height:100vh;max-height:100vh;aspect-ratio:auto}
.player-modal__close{top:10px;right:10px;background:rgba(0,0,0,.5)}
}
.player-details{padding-top:16px;display:flex;flex-wrap:wrap;align-items:center;column-gap:16px}
.player-details h1{flex:0 0 100%;font-size:22px;font-weight:800;letter-spacing:-.4px;margin-bottom:6px;color:var(--text);line-height:1.25}
.player-details .pmeta{display:inline-flex;align-items:center;gap:10px;font-size:12px;color:var(--text3);margin:0 auto 0 0}
.player-details .pmeta .tag{padding:3px 10px;border-radius:5px;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;background:var(--red-dim);color:var(--red)}
.player-details .pstats{display:inline-flex;align-items:center;gap:16px;font-size:12px;color:var(--text3);margin:0}
.player-details .pstats span{display:inline-flex;align-items:center;gap:5px}
.player-details .pstats svg{width:13px;height:13px}
.player-details .pstats b{font-weight:700;color:var(--text)}
.player-details .pdesc{flex:0 0 100%;font-size:14px;color:var(--text2);line-height:1.65}
.player-details .pdesc{margin-top:15px;font-size:14px;color:var(--text2);line-height:1.65}
.player-details .pdesc p{margin:0 0 8px}
.player-details .pdesc p:last-child{margin-bottom:0}
.pdesc-wrap{position:relative;flex:0 0 100%}
.pdesc-fade{position:absolute;left:0;right:0;bottom:0;height:48px;pointer-events:none;opacity:0;background:linear-gradient(to bottom,rgba(255,255,255,0),var(--bg));transition:opacity .2s}
[data-theme="dark"] .pdesc-fade{background:linear-gradient(to bottom,rgba(10,10,12,0),var(--bg))}
[data-theme="light"] .pdesc-fade{background:linear-gradient(to bottom,rgba(244,242,239,0),var(--bg))}
.pdesc-toggle{display:none;align-items:center;gap:6px;margin-top:8px;padding:8px 14px;border:1px solid var(--border);border-radius:8px;background:var(--surface);color:var(--text);font-family:inherit;font-size:13px;font-weight:600;cursor:pointer;transition:.15s;-webkit-tap-highlight-color:transparent}
.pdesc-toggle:hover{border-color:var(--text3)}
.pdesc-toggle .pdesc-toggle-hide{display:none}
.pdesc-toggle[aria-expanded="true"] .pdesc-toggle-show{display:none}
.pdesc-toggle[aria-expanded="true"] .pdesc-toggle-hide{display:inline}
.pdesc-toggle-icon{width:14px;height:14px;transition:transform .2s}
.pdesc-toggle[aria-expanded="true"] .pdesc-toggle-icon{transform:rotate(180deg)}
@media(max-width:768px){
.pdesc-wrap[data-collapsed] .pdesc{max-height:7.2em;overflow:hidden;display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical}
.pdesc-wrap[data-collapsed] .pdesc-fade{opacity:1}
.pdesc-toggle{display:inline-flex}
.pdesc-wrap:not([data-collapsed]) .pdesc-fade{opacity:0}
}
.player-sidebar h3{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;color:var(--text3);margin-bottom:12px;display:flex;align-items:center;gap:8px}
.player-sidebar h3::after{content:"";flex:1;height:1px;background:var(--border)}
.player-sidebar .scroll-row{flex-direction:column;gap:8px}
.player-sidebar .ep-card{width:100%}
.player-sidebar .ep-card:hover .player-play-btn {opacity: 1;transform:translate(-50%,-50%);}
@media(hover:none){.player-sidebar .ep-card .player-play-btn{opacity:1;transform:translate(-50%,-50%);transition:none}}
@media(max-width:768px){.player-sidebar .ep-card .player-play-btn{opacity:1;transform:translate(-50%,-50%);transition:none}}
.player-sidebar__empty{padding:16px;background:var(--surface2);border-radius:8px;font-size:12px;color:var(--text3);text-align:center}
@media(max-width:640px){
.player-sidebar__empty{padding:12px}
}
@media(max-width:900px){
.player-layout{grid-template-columns:1fr;gap:20px}
.player-sidebar{order:2}
}
@media(max-width:640px){
.player-page{padding-left:16px;padding-right:16px}
.player-play-btn{width:60px;height:60px}
.player-play-btn svg{width:24px;height:24px;margin-left:3px}
}
/* === COMMENTS THREAD (player) === */
.comments{margin-top:20px;padding-top:20px;border-top:1px solid var(--border)}
.comments-title{font-size:18px;font-weight:800;letter-spacing:-.3px;margin-bottom:18px;display:flex;align-items:center;gap:8px}
.comments-count{font-size:12px;font-weight:700;color:var(--text3);background:var(--surface2);padding:2px 8px;border-radius:10px;letter-spacing:0}
.comment-form{margin-bottom:24px;padding:14px;background:var(--surface);border:1px solid var(--border);border-radius:12px;transition:border-color .15s}
.comment-form:focus-within{border-color:var(--red)}
.comment-input{width:100%;min-height:72px;resize:vertical;padding:10px 12px;border:1px solid var(--border);border-radius:8px;background:var(--surface2);color:var(--text);font-family:inherit;font-size:13px;line-height:1.5;transition:border-color .15s,background .3s,color .3s}
.comment-input:focus{outline:none;border-color:var(--red)}
.comment-input::placeholder{color:var(--text3)}
.comment-form-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:10px;flex-wrap:wrap}
.comment-reply-hint{font-size:12px;color:var(--text2)}
.comment-reply-hint a{color:var(--red);text-decoration:none}
.comment-reply-hint a:hover{text-decoration:underline}
.comment-submit{padding:8px 18px;border:none;border-radius:8px;background:var(--red);color:#fff;font-family:inherit;font-size:13px;font-weight:700;cursor:pointer;transition:.15s}
.comment-submit:hover{opacity:.9}
.comment-submit:disabled{opacity:.5;cursor:not-allowed}
.comment-list{display:flex;flex-direction:column;gap:14px}
.comment{padding:12px 14px;background:var(--surface);border:1px solid var(--border);border-radius:10px}
.comment[data-depth="1"]{margin-left:32px}
.comment[data-depth="2"]{margin-left:64px}
.comment-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:6px}
.comment-avatar{flex-shrink:0;width:22px;height:22px;border-radius:50%;background:var(--surface2);color:var(--text2);display:grid;place-items:center;font-size:11px;font-weight:800;border:1px solid var(--border)}
.comment-name{font-size:13px;font-weight:700;color:var(--text)}
.comment-time{font-size:11px;color:var(--text3)}
.comment-text{font-size:13px;color:var(--text2);line-height:1.6;white-space:pre-wrap;word-wrap:break-word}
.comment-actions{display:flex;align-items:center;gap:14px;margin-top:8px}
.comment-action{background:none;border:none;padding:0;font-family:inherit;font-size:12px;color:var(--text3);cursor:pointer;display:inline-flex;align-items:center;gap:4px;transition:.15s}
.comment-action:hover{color:var(--red)}
.comment-action svg{width:13px;height:13px}
.comment-action.liked{color:var(--red)}
@media(max-width:640px){
.comment[data-depth="1"]{margin-left:16px}
.comment[data-depth="2"]{margin-left:32px}
.comment-form-actions{flex-direction:column;align-items:stretch}
.comment-submit{width:100%}
}
/* === WIDGET SEARCH === */
.widget_search{position:relative;width:100%}
.widget_search__group{display:flex;align-items:stretch;gap:0;width:100%}
.widget_search__input{flex:1 1 auto;min-width:0;height:42px;padding:0 14px;border:1px solid var(--border-color);border-radius:8px;background:var(--surface);color:var(--text);font-family:inherit;font-size:14px;transition:border-color .2s,box-shadow .2s,background .3s;outline:none}
.widget_search__input:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px rgba(230,62,62,.15)}
.widget_search__group .widget_search__input{border-top-right-radius:0;border-bottom-right-radius:0;border-right:none}
.widget_search__btn{position:relative;display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;padding:0;border:0;border-radius:8px;background:transparent;color:var(--text-secondary);cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;transition:color .15s,background .15s,transform .15s}
.widget_search__group .widget_search__btn{border-top-left-radius:0;border-bottom-left-radius:0;width:42px;height:42px;border:1px solid var(--border-color);background:var(--surface);color:var(--text-secondary);border-left:none}
.widget_search__btn:hover,.widget_search__btn:focus-visible{color:var(--text);background:var(--surface2);transform:scale(1.08)}
.widget_search__group .widget_search__btn:hover,.widget_search__group .widget_search__btn:focus-visible{color:var(--color-primary);background:var(--surface2);border-color:var(--color-primary);transform:none}
.widget_search__btn:active{transform:scale(.94)}
.widget_search__group .widget_search__btn:active{transform:none}
.widget_search__icon{flex-shrink:0;width:18px;height:18px;transition:transform .25s cubic-bezier(.34,1.56,.64,1)}
.widget_search__btn:hover .widget_search__icon{transform:rotate(12deg) scale(1.1)}
.widget_search__group .widget_search__btn:hover .widget_search__icon{transform:none}
.widget_search__btn:focus-visible{outline:none}
@media (max-width:575.98px){.widget_search__group{flex-direction:column;gap:8px}.widget_search__group .widget_search__input{border-right:1px solid var(--border-color);border-top-right-radius:8px;border-bottom-right-radius:0;border-bottom:none}.widget_search__group .widget_search__btn{border-top-left-radius:0;border-bottom-left-radius:8px;border:1px solid var(--border-color);border-top:none;width:100%;height:42px}}
/* === DEBUG BLOCK === */
.debug-block{position:fixed;bottom:0;left:0;right:0;z-index:9999;background:var(--surface);box-shadow:0 -4px 20px rgba(0,0,0,.4);font-size:.8125rem;line-height:1.5;color:var(--text)}
.debug-block__bar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 24px;background:var(--surface2);cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}
.debug-block__info{display:flex;align-items:center;gap:12px;min-width:0}
.debug-block__icon{display:block;flex-shrink:0;color:var(--red)}
.debug-block__stat{display:inline-flex;align-items:center;gap:4px;font-size:.75rem;color:var(--text2);white-space:nowrap}
.debug-block__stat-icon{display:block;flex-shrink:0;color:var(--text3)}
.debug-block__stat-value{font-variant-numeric:tabular-nums}
.debug-block__divider{width:1px;height:12px;background:var(--border);flex-shrink:0}
.debug-block__toggle{display:flex;align-items:center;justify-content:center;width:24px;height:24px;padding:0;border:none;background:transparent;color:var(--text2);cursor:pointer;border-radius:6px;transition:background .15s,color .15s}
.debug-block__toggle:hover{background:var(--surface2);color:var(--red)}
.debug-block__chevron{display:block;transition:transform .3s ease}
.debug-block--expanded .debug-block__chevron{transform:rotate(180deg)}
.debug-block__body{transition:max-height .35s ease,opacity .25s ease}
.debug-block:not(.debug-block--expanded) .debug-block__body{max-height:0;opacity:0;overflow:hidden}
.debug-block--expanded .debug-block__body{max-height:2000px;opacity:1}
.debug-block__tabs{position:relative;display:flex;gap:32px;padding:0 24px;background:var(--surface);border-bottom:1px solid var(--border);overflow-x:auto;-webkit-overflow-scrolling:touch}
.debug-block__tabs::-webkit-scrollbar{display:none}
.debug-block__tab{position:relative;display:inline-flex;align-items:center;gap:8px;padding:16px 0;border:none;background:transparent;color:var(--text2);font-size:.8125rem;font-weight:500;white-space:nowrap;cursor:pointer;transition:color .15s}
.debug-block__tab:hover{color:var(--red)}
.debug-block__tab.is-active{color:var(--red)}
.debug-block__tab-icon{display:block;flex-shrink:0;color:currentColor}
.debug-block__badge{display:inline-flex;align-items:center;justify-content:center;min-width:1.125rem;height:1.125rem;padding:0 6px;background:var(--surface2);color:var(--text2);font-size:.6875rem;font-weight:500;line-height:1;border-radius:1.5rem}
.is-active .debug-block__badge{background:var(--red-dim);color:var(--red)}
.debug-block__badge.is-warning{background:#f59e0b;color:#fff;font-size:.625rem;min-width:auto;height:1rem;padding:0 8px}
.debug-block__track{position:absolute;bottom:-1px;left:0;right:0;height:1.5px;pointer-events:none}
.debug-block__track-active{position:absolute;bottom:0;left:0;height:1.5px;background:var(--red);transition:left .25s ease,width .25s ease}
.debug-block__panels{overflow-y:auto;max-height:25vh}
.debug-block__panel{display:none;padding:16px 24px}
.debug-block__panel.is-active{display:block}
.debug-block__toolbar{display:flex;align-items:center;gap:16px;margin-bottom:16px;flex-wrap:wrap}
.debug-block__search{flex:1 1 200px;min-width:0;height:1.75rem;padding:0 16px;border:1px solid var(--border);border-radius:6px;background:var(--surface2);color:var(--text);font-size:.75rem;outline:none;transition:border-color .15s}
.debug-block__search::placeholder{color:var(--text3)}
.debug-block__search:focus{border-color:var(--red)}
.debug-block__sort{display:flex;gap:4px;flex-shrink:0}
.debug-block__sort-btn{display:inline-flex;align-items:center;height:1.75rem;padding:0 16px;border:1px solid var(--red);border-radius:99px;background:transparent;color:var(--red);font-size:.75rem;font-weight:500;cursor:pointer;transition:background .15s,color .15s}
.debug-block__sort-btn:hover{background:var(--red-dim)}
.debug-block__sort-btn.is-active{background:var(--red);color:#fff}
.debug-block__db-info{padding:8px 16px;margin-bottom:12px;background:var(--red-dim);border-radius:6px;color:var(--red);font-size:.75rem;font-weight:500}
.debug-block__list{display:flex;flex-direction:column}
.debug-block__query{padding:12px 0;border-bottom:1px solid var(--border)}
.debug-block__query:last-child{border-bottom:none}
.debug-block__query-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:8px}
.debug-block__query-src{color:var(--text3);font-size:.6875rem;word-break:break-all;line-height:1.3}
.debug-block__query-time{display:inline-flex;align-items:center;gap:4px;flex-shrink:0;color:var(--text2);font-size:.6875rem;font-variant-numeric:tabular-nums;white-space:nowrap}
.debug-block__clock{display:block;color:var(--text3);flex-shrink:0}
.debug-block__query-sql{padding:8px 16px;background:var(--surface2);border-radius:6px;font-size:.6875rem;line-height:1.4;word-break:break-all}
.debug-block__query-sql code{font-family:'SF Mono',Monaco,Menlo,monospace;color:var(--text2)}
.debug-block__file{padding:8px 0;border-bottom:1px solid var(--border)}
.debug-block__file:last-child{border-bottom:none}
.debug-block__file-name{color:var(--text3);font-size:.75rem;font-family:'SF Mono',Monaco,Menlo,monospace}
/* === USER PROFILE / LIST (dom2) === */
.user-shell{max-width:1280px;margin:0 auto;padding:24px 28px 60px}
.user-shell--narrow{max-width:960px}
.user-profile{display:grid;grid-template-columns:300px 1fr;gap:24px;align-items:start}
@media (max-width:900px){.user-profile{grid-template-columns:1fr;gap:16px}}
.user-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:16px;box-shadow:var(--shadow-card);transition:background .3s,border-color .3s}
.user-card + .user-card{margin-top:14px}
.user-card__title{font-size:12px;font-weight:800;letter-spacing:.4px;text-transform:uppercase;color:var(--text3);margin:0 0 12px;display:flex;align-items:center;gap:6px}
.user-avatar{position:relative;display:inline-block;flex-shrink:0}
.user-avatar > *{border-radius:50%;overflow:hidden;border:none;min-width:32px;min-height:32px;background:var(--surface2)}
.user-avatar.online::after,.user-avatar.offline::after{content:"";position:absolute;right:0;bottom:0;width:.8em;height:.8em;border:2px solid var(--surface);border-radius:50%}
.user-avatar.online::after{background:#22c55e}
.user-avatar.offline::after{background:var(--text3)}
.user-avatar--sm > *{width:32px;height:32px;min-width:32px;min-height:32px}
.user-avatar--md > *{width:80px;height:80px;min-width:80px;min-height:80px}
.user-avatar--lg > *{width:64px;height:64px;min-width:64px;min-height:64px;aspect-ratio:1/1;object-fit:cover}
.user-avatar-empty{position:relative;display:inline-grid;place-items:center;border-radius:50%;background:var(--surface2);color:var(--text2);font-weight:800;text-transform:uppercase;overflow:hidden;border:1px solid var(--border)}
.user-avatar-empty svg{width:100%;height:100%}
.user-avatar-empty--sm{width:32px;height:32px;font-size:11px}
.user-avatar-empty--md{width:80px;height:80px;font-size:24px}
.user-avatar-empty--lg{width:64px;height:64px;font-size:20px}
.user-header{display:flex;align-items:center;gap:16px;padding:16px;background:var(--surface);border:1px solid var(--border);border-radius:12px;margin-bottom:16px;flex-wrap:wrap}
.user-header__avatar{flex-shrink:0}
.user-header__main{flex:1 1 auto;min-width:0}
.user-header__name{font-size:22px;font-weight:800;letter-spacing:-.3px;margin:0;display:flex;align-items:center;gap:8px;flex-wrap:wrap;color:var(--text)}
.user-header__name a{color:inherit;text-decoration:none}
.user-header__name a:hover{color:var(--red)}
.user-header__name .lock-icon{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:6px;background:var(--surface2);color:var(--text2);font-size:14px;line-height:1;cursor:help}
.user-header__name .lock-icon svg{width:14px;height:14px}
.user-header__status{margin-top:6px;font-size:13px;color:var(--text2);display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.user-header__status-text{color:var(--text2)}
.user-header__status-text:empty{display:none}
.user-header__status-action{display:inline-flex;align-items:center;gap:4px;color:var(--text2);text-decoration:none;font-size:12px;transition:.15s}
.user-header__status-action:hover{color:var(--red)}
.user-header__status-action svg{width:13px;height:13px}
.user-header__status-action.danger{color:var(--red)}
.user-header__status-input{margin-top:10px;width:100%;padding:8px 12px;border:1px solid var(--border);border-radius:8px;background:var(--surface2);color:var(--text);font-family:inherit;font-size:13px;transition:border-color .15s}
.user-header__status-input:focus{outline:none;border-color:var(--red)}
.user-header__status-input:disabled{opacity:.5;cursor:not-allowed}
.user-header__rating{display:flex;align-items:stretch;gap:8px;flex-shrink:0}
.user-rating{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:8px 12px;border-radius:10px;color:#fff;min-width:72px;transition:background .3s}
.user-rating--pos{background:#16a34a}
.user-rating--neg{background:var(--surface2);color:var(--text)}
.user-rating--neutral{background:var(--surface2);color:var(--text)}
.user-rating__row{display:flex;align-items:center;gap:6px}
.user-rating__btn{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:6px;color:inherit;background:transparent;border:none;cursor:pointer;transition:.15s;font-size:14px}
.user-rating__btn:hover{background:rgba(255,255,255,.15)}
.user-rating--neg .user-rating__btn:hover{background:var(--surface3)}
.user-rating__btn.up{color:#22c55e}
.user-rating__btn.down{color:var(--red)}
.user-rating__value{font-size:18px;font-weight:800;letter-spacing:-.2px}
.user-rating__hint{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;opacity:.85;margin-top:2px}
.user-tabs{display:flex;gap:2px;background:var(--surface2);padding:4px;border-radius:10px;overflow-x:auto;-webkit-overflow-scrolling:touch;margin-bottom:16px;scrollbar-width:none}
.user-tabs::-webkit-scrollbar{display:none}
/* CMS отдает и - — перебиваем Bootstrap */
.user-tabs > ul{display:flex;flex:1 0 auto;gap:2px;list-style:none;margin:0;padding:0;flex-wrap:nowrap}
.user-tabs > ul > li{flex:1 0 auto;list-style:none;margin:0;padding:0;background:transparent;border:none;float:none}
.user-tabs > ul > li > a.nav-link,.user-tabs__item{flex:1 0 auto;padding:8px 14px;border-radius:7px;border:none;background:transparent;color:var(--text2);font-family:inherit;font-size:13px;font-weight:600;cursor:pointer;transition:.2s;white-space:nowrap;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:6px;width:100%}
.user-tabs > ul > li > a.nav-link:hover,.user-tabs__item:hover{color:var(--text);background:var(--surface);box-shadow:0 2px 6px rgba(0,0,0,.04)}
.user-tabs > ul > li > a.nav-link.active,.user-tabs__item.active{background:var(--surface);color:var(--text);box-shadow:0 2px 6px rgba(0,0,0,.06)}
.user-tabs > ul > li.is-active > a.nav-link{background:var(--surface);color:var(--text);box-shadow:0 2px 6px rgba(0,0,0,.06)}
.user-tabs__count,.user-tabs .counter.badge{font-size:10px;font-weight:700;color:var(--text3);background:var(--surface3);padding:1px 6px;border-radius:8px;line-height:1.4;display:inline-flex;align-items:center;justify-content:center;margin-left:6px}
.user-tabs > ul > li > a.nav-link.active .user-tabs__count,.user-tabs__item.active .user-tabs__count,.user-tabs > ul > li.is-active .counter.badge{color:var(--red);background:var(--red-dim)}
.user-section{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:20px;margin-bottom:14px;box-shadow:var(--shadow-card);transition:background .3s,border-color .3s}
.user-section h3{font-size:18px;font-weight:800;letter-spacing:-.3px;margin:0 0 14px;color:var(--text);display:flex;align-items:center;gap:8px}
.user-section h3::after{content:"";flex:1;height:1px;background:var(--border)}
.user-field{display:grid;grid-template-columns:160px 1fr;gap:12px;padding:10px 0;border-bottom:1px solid var(--border);font-size:14px;align-items:start}
.user-field:last-child{border-bottom:none}
.user-field__label{color:var(--text3);font-size:12px;font-weight:600;letter-spacing:.2px}
.user-field__value{color:var(--text);word-wrap:break-word;min-width:0}
.user-field__value a{color:var(--red);text-decoration:none}
.user-field__value a:hover{text-decoration:underline}
.user-field--stacked{grid-template-columns:1fr;gap:2px}
.user-field--stacked .user-field__label{font-size:11px}
@media (max-width:600px){.user-field{grid-template-columns:1fr;gap:2px}.user-field__label{font-size:11px}}
.user-friends-list{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.user-friends-list a{flex-shrink:0;border-radius:50%;overflow:hidden;display:block;transition:transform .15s}
.user-friends-list a:hover{transform:translateY(-2px)}
.user-list-card{display:flex;align-items:center;gap:12px;padding:12px;background:var(--surface);border:1px solid var(--border);border-radius:10px;margin-bottom:8px;transition:.15s}
.user-list-card:hover{border-color:var(--red);background:var(--surface2)}
.user-list-card__main{flex:1 1 auto;min-width:0}
.user-list-card__name{font-size:15px;font-weight:700;color:var(--text);text-decoration:none;display:flex;align-items:center;gap:6px;margin:0}
.user-list-card__name a{color:inherit;text-decoration:none}
.user-list-card__name a:hover{color:var(--red)}
.user-list-card__sub{font-size:12px;color:var(--text3);margin-top:4px;display:flex;gap:10px;flex-wrap:wrap}
.user-list-card__sub span{display:inline-flex;align-items:center;gap:4px}
.user-list-card__rating{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--text2);flex-shrink:0}
.user-list-card__rating .pos{color:#16a34a}
.user-list-card__rating .neg{color:var(--red)}
.user-list-card__rank{width:32px;height:32px;display:grid;place-items:center;flex-shrink:0;font-size:14px;font-weight:800;color:var(--text3)}
.user-list-card__rank.medal{color:#f59e0b}
.user-list-card__actions{flex-shrink:0}
.user-list-card__more{width:34px;height:34px;border-radius:8px;border:1px solid var(--border);background:var(--surface2);color:var(--text2);cursor:pointer;display:grid;place-items:center;transition:.15s}
.user-list-card__more:hover{border-color:var(--red);color:var(--red)}
.user-list-card__more svg{width:14px;height:14px}
.user-list-content{display:flex;flex-direction:column;gap:8px;padding:0;margin:0;list-style:none}
.user-action-link{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:8px;border:1px solid var(--border);background:var(--surface);color:var(--text);font-family:inherit;font-size:13px;font-weight:600;cursor:pointer;transition:.15s;text-decoration:none}
.user-action-link:hover{border-color:var(--red);color:var(--red)}
.user-action-link--primary{background:var(--red);border-color:var(--red);color:#fff}
.user-action-link--primary:hover{opacity:.9;color:#fff}
.user-action-link--danger{border-color:var(--red);color:var(--red);background:transparent}
.user-action-link--danger:hover{background:var(--red);color:#fff}
.user-action-link svg{width:14px;height:14px}
.user-action-bar{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}
.user-info-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.user-info-item{padding:10px 12px;background:var(--surface2);border:1px solid var(--border);border-radius:8px}
.user-info-item__label{font-size:10px;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:.4px;margin-bottom:2px}
.user-info-item__value{font-size:14px;font-weight:700;color:var(--text)}
@media (max-width:600px){.user-info-grid{grid-template-columns:1fr}}
.user-alert{padding:14px 16px;border-radius:10px;background:var(--surface2);border:1px solid var(--border);font-size:13px;color:var(--text2);line-height:1.5;display:flex;align-items:flex-start;gap:10px}
.user-alert--info{background:var(--bg-secondary);border-color:var(--border);color:var(--text2)}
.user-alert--danger{background:var(--red-dim);border-color:rgba(255,45,85,.3);color:var(--red)}
.user-alert svg{flex-shrink:0;width:18px;height:18px;margin-top:1px}
.user-table{width:100%;border-collapse:collapse;font-size:13px}
.user-table th,.user-table td{padding:10px 12px;text-align:left;border-bottom:1px solid var(--border);vertical-align:middle}
.user-table th{font-size:11px;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:.4px;background:var(--surface2)}
.user-table tbody tr:hover{background:var(--surface2)}
.user-table tbody tr:last-child td{border-bottom:none}
.user-table a{color:var(--red);text-decoration:none}
.user-table a:hover{text-decoration:underline}
.user-table .danger{color:var(--red)}
.user-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--border);border-radius:10px;background:var(--surface)}
.user-table-wrap .user-table{border-radius:10px;overflow:hidden}
.user-dataset-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:14px 0}
.user-dataset-bar > *{flex-shrink:0}
.user-dataset-bar__label{font-size:12px;font-weight:600;color:var(--text3);text-transform:uppercase;letter-spacing:.4px;margin-right:auto}
.user-dataset-bar .dropdown{position:relative}
.user-tabs--editor{background:var(--surface2);padding:4px;border-radius:10px;display:flex;gap:2px;overflow-x:auto;margin-bottom:16px;scrollbar-width:none}
.user-tabs--editor::-webkit-scrollbar{display:none}
/* === DROPDOWN (минимальный, без bootstrap) === */
.dropdown{position:relative;display:inline-block}
.dropdown-menu{position:absolute;top:calc(100% + 6px);right:0;min-width:200px;background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:6px;box-shadow:0 12px 32px rgba(0,0,0,.2);z-index:100;display:none;animation:d2-fade-in .15s ease}
.dropdown-menu.show{display:block}
.dropdown-menu__item{display:block;width:100%;padding:8px 12px;border:none;background:transparent;color:var(--text);text-align:left;font-family:inherit;font-size:13px;border-radius:6px;cursor:pointer;transition:.12s;text-decoration:none}
.dropdown-menu__item:hover{background:var(--surface2);color:var(--red)}
.dropdown-menu__item.danger{color:var(--red)}
.dropdown-menu__item.danger:hover{background:var(--red);color:#fff}
.dropdown-menu__divider{height:1px;background:var(--border);margin:6px 0}
/* Bootstrap-подобные классы для dropdown (совместимость) */
.dropdown-item{display:block;width:100%;padding:8px 12px;background:transparent;color:var(--text);text-align:left;font-size:13px;font-weight:400;line-height:1.5;border-radius:6px;cursor:pointer;transition:.12s;text-decoration:none}
.dropdown-item:hover{background:var(--surface2);color:var(--red)}
.dropdown-item.active,.dropdown-item:active{background:var(--surface2);color:var(--red)}
.dropdown-item.disabled,.dropdown-item:disabled{color:var(--text-muted);pointer-events:none;cursor:default}
.dropdown-divider{height:1px;background:var(--border);margin:6px 0}
@keyframes d2-fade-in{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
/* === TOOLTIP (минимальный, без bootstrap) === */
.d2-tooltip{position:absolute;background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:6px;padding:6px 10px;font-size:12px;font-weight:500;line-height:1.4;box-shadow:0 6px 20px rgba(0,0,0,.2);pointer-events:none;max-width:240px;animation:d2-tip-in .12s ease}
@keyframes d2-tip-in{from{opacity:0;transform:translate(-50%,2px)}to{opacity:1;transform:translate(-50%,0)}}
/* === MOBILE TWEAKS === */
@media (max-width:600px){
.user-shell{padding:16px}
.user-header{padding:12px;gap:12px}
.user-header__name{font-size:18px}
.user-header__rating{flex-basis:100%;justify-content:flex-start}
.user-action-bar{flex-direction:column;align-items:stretch}
.user-action-bar .user-action-link{justify-content:center}
.user-list-card{flex-wrap:wrap}
.user-list-card__rank{order:0}
.user-list-card__main{order:1;flex:1 0 100%}
.user-list-card__rating{order:2;flex:1}
.user-list-card__actions{order:3}
.user-field{font-size:13px}
}
/* === USER WIDGETS (grids) === */
.user-profiles-grid{display:flex;flex-wrap:wrap;gap:8px}
.user-profiles-grid > *{flex-shrink:0}
.user-widget-avatar:hover{background:var(--surface3)}
.user-widget-avatar__menu{min-width:220px}
.user-widget-avatar__menu--right{right:0;left:auto}
.user-widget-avatar__menu .dropdown-menu__item{font-size:13px}
/* === UTILITY CLASSES (для совместимости с bootstrap-подобной разметкой) === */
.d-block{display:block}
.d-flex{display:flex}
.d-inline-block{display:inline-block}
.d-none{display:none}
.text-center{text-align:center}
.text-right{text-align:right}
.text-left{text-align:left}
.align-items-center{align-items:center}
.justify-content-between{justify-content:space-between}
.justify-content-center{justify-content:center}
.flex-wrap{flex-wrap:wrap}
.gap-2{gap:8px}
.gap-3{gap:12px}
.mt-2{margin-top:8px}
.mb-2{margin-bottom:8px}
.ml-2{margin-left:8px}
.mr-2{margin-right:8px}
.mt-3{margin-top:12px}
.mb-3{margin-bottom:12px}
.my-3{margin-top:12px;margin-bottom:12px}
.mx-auto{margin-left:auto;margin-right:auto}
.float-right{float:right}
.float-left{float:left}
.w-100{width:100%}
.h-100{height:100%}
.text-success{color:#16a34a}
.text-danger{color:var(--red)}
.text-muted{color:var(--text3)}
.text-white{color:#fff}
.bg-primary{background:var(--red);color:#fff}
.bg-success{background:#16a34a;color:#fff}
@media (min-width:768px){
.d-md-none{display:none}
.d-md-block{display:block}
.float-md-right{float:right}
.mt-md-0{margin-top:0}
}
@media (max-width:767px){
.d-md-none{display:block}
.mt-md-4{margin-top:16px}
}
@media (max-width:600px){
.d-sm-inline-block{display:inline-block}
}
/* === USER DATASET TABS (Новые / Онлайн / Рейтинг / Популярные / Администраторы) === */
.user-dataset-tabs{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.user-dataset-tabs::-webkit-scrollbar{display:none}
.user-dataset-tabs__list{display:flex;gap:6px;list-style:none;margin:0;padding:0;flex-wrap:nowrap}
.user-dataset-tabs__item{flex-shrink:0;list-style:none}
.user-dataset-tabs__btn{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:10px;border:1px solid var(--border);background:var(--surface);color:var(--text2);font-family:inherit;font-size:13px;font-weight:600;cursor:pointer;transition:.15s;text-decoration:none;white-space:nowrap}
.user-dataset-tabs__btn:hover{border-color:var(--red);color:var(--red)}
.user-dataset-tabs__btn.active{background:var(--red);border-color:var(--red);color:#fff;cursor:default}
.user-dataset-tabs__btn.active:hover{color:#fff}
.user-dataset-tabs__count{font-size:10px;font-weight:700;background:var(--surface2);color:var(--text2);padding:2px 6px;border-radius:8px}
.user-dataset-tabs__btn.active .user-dataset-tabs__count{background:rgba(255,255,255,.2);color:#fff}
.content_datasets_description{padding:8px 0;font-size:13px;color:var(--text2);line-height:1.5}
/* === FILTER PANEL (dom2) === */
/* Стилизовано идентично .search-form на странице поиска */
.icms-filter-panel{position:relative;margin:20px 0}
.icms-filter-panel .icms-filter-container{position:relative;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:12px;padding:20px;transition:background .3s,border-color .3s}
.icms-filter-panel .icms-filter-container form{position:relative;display:flex;flex-direction:column;gap:14px}
.icms-filter-link__open{display:inline-flex;align-items:center;gap:8px;height:48px;padding:0 20px;border:1px solid var(--border);border-radius:8px;background:var(--bg-primary);color:var(--text2);font-family:inherit;font-size:15px;font-weight:600;cursor:pointer;transition:.15s;text-decoration:none}
.icms-filter-link__open:hover{border-color:var(--red);color:var(--red)}
.icms-filter-link__open .icms-svg-icon{width:16px;height:16px}
.icms-filter-link__close{position:absolute;top:14px;right:14px;width:32px;height:32px;padding:0;display:grid;place-items:center;background:transparent;border:none;color:var(--text3);cursor:pointer;border-radius:6px;transition:.15s;z-index:5}
.icms-filter-link__close:hover{background:var(--surface2);color:var(--red)}
.icms-filter-link__close .icms-svg-icon{width:14px;height:14px}
.filter-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:600px){.filter-fields{grid-template-columns:1fr}}
.filter-field{display:flex;flex-direction:column;gap:6px}
.filter-field__label{font-size:12px;font-weight:600;color:var(--text2);letter-spacing:.2px}
/* Поля формы (input/select/textarea) — белый фон, высота 48px, как в .search-form__input */
.filter-field .input,.filter-field .textarea,.filter-field .select,
.icms-filter-container .input,.icms-filter-container .textarea,.icms-filter-container .select{width:100%;height:48px;padding:0 16px;background:var(--bg-primary);border:1px solid var(--border-color);border-radius:8px;color:var(--text);font-family:inherit;font-size:15px;line-height:1;transition:border-color .2s,box-shadow .2s;outline:none;-webkit-appearance:none;appearance:none}
.filter-field textarea{height:auto;min-height:48px;padding:10px 16px;line-height:1.4}
.filter-field .input:focus,.filter-field .textarea:focus,.filter-field .select:focus,
.icms-filter-container .input:focus,.icms-filter-container .textarea:focus,.icms-filter-container .select:focus{border-color:var(--red);box-shadow:0 0 0 3px var(--red-dim)}
.filter-field .input::placeholder{color:var(--text3)}
/* Select — со стрелочкой (как .search-form__select) */
.icms-filter-container select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23888' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:36px}
/* Кнопки действий — высота 48px, как input */
.filter-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:14px;padding-top:14px;border-top:1px solid var(--border-color)}
.filter-actions .btn-primary{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:48px;padding:0 20px;border:1px solid var(--red);border-radius:8px;background:var(--red);color:#fff;font-family:inherit;font-size:15px;font-weight:600;cursor:pointer;transition:.15s;text-decoration:none;line-height:1;flex:none}
.filter-actions .btn-primary:hover{background:#c92d3a;border-color:#c92d3a}
.filter-actions .btn-secondary{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:48px;padding:0 20px;border:1px solid var(--border);border-radius:8px;background:var(--bg-primary);color:var(--text);font-family:inherit;font-size:15px;font-weight:600;cursor:pointer;transition:.15s;text-decoration:none;line-height:1;flex:none}
.filter-actions .btn-secondary:hover{border-color:var(--red);color:var(--red)}
.filter-actions .btn-link{padding:0 12px;height:48px;display:inline-flex;align-items:center;gap:6px;color:var(--text2);font-size:14px;text-decoration:none;background:transparent;border:none;cursor:pointer;line-height:1;flex:none}
.filter-actions .btn-link:hover{color:var(--red)}
/* === SVG ICON SIZES (html_svg_icon) === */
/* Базовые стили (как в modern theme) */
.icms-svg-icon{display:inline-block;font-size:inherit;height:1em;overflow:visible;vertical-align:-0.125em;fill:currentColor;width:1em;flex-shrink:0}
/* Размеры иконок — соответствуют вызову html_svg_icon($file, $name, $size) */
.icms-svg-icon.w-8{width:8px;height:8px}
.icms-svg-icon.w-10{width:10px;height:10px}
.icms-svg-icon.w-12{width:12px;height:12px}
.icms-svg-icon.w-13{width:13px;height:13px}
.icms-svg-icon.w-14{width:14px;height:14px}
.icms-svg-icon.w-15{width:15px;height:15px}
.icms-svg-icon.w-16{width:16px;height:16px}
.icms-svg-icon.w-18{width:18px;height:18px}
.icms-svg-icon.w-20{width:20px;height:20px}
.icms-svg-icon.w-22{width:22px;height:22px}
.icms-svg-icon.w-24{width:24px;height:24px}
.icms-svg-icon.w-26{width:26px;height:26px}
.icms-svg-icon.w-28{width:28px;height:28px}
.icms-svg-icon.w-30{width:30px;height:30px}
.icms-svg-icon.w-32{width:32px;height:32px}
.icms-svg-icon.w-36{width:36px;height:36px}
.icms-svg-icon.w-40{width:40px;height:40px}
.icms-svg-icon.w-44{width:44px;height:44px}
.icms-svg-icon.w-48{width:48px;height:48px}
.icms-svg-icon.w-56{width:56px;height:56px}
.icms-svg-icon.w-64{width:64px;height:64px}
.icms-svg-icon.w-72{width:72px;height:72px}
.icms-svg-icon.w-80{width:80px;height:80px}
.icms-svg-icon.w-96{width:96px;height:96px}
.icms-svg-icon.w-128{width:128px;height:128px}
.icms-svg-icon.w-160{width:160px;height:160px}
/* === POSITION UTILITIES === */
.position-relative{position:relative}
.position-absolute{position:absolute}
.position-fixed{position:fixed}
.position-static{position:static}
.position-sticky{position:sticky}
/* === DEFAULT AVATAR (icms-profile-avatar__default) === */
.icms-profile-avatar__default{display:flex;justify-content:center;align-items:center;height:100%;font-size:14px;background:var(--surface2);color:var(--text2);font-weight:700;text-transform:uppercase;overflow:hidden;border-radius:50%}
.icms-profile-avatar__default svg{width:100%;height:100%;text-rendering:optimizeSpeed}
.icms-profile-avatar__default.avatar__inlist{width:64px;height:64px}
.icms-profile-avatar__default.avatar__mini{width:32px;height:32px}
.icms-profile-avatar__default.avatar__micro{width:24px;height:24px;font-size:9px}
/* === FORM HELPERS === */
.icms-form__symbols_count_wrap{position:relative}
.icms-form__symbols_count_wrap .symbols_count{position:absolute;top:50%;right:10px;transform:translateY(-50%);font-size:11px;color:var(--text3);pointer-events:none}
.icms-form__symbols_count_wrap .symbols_count .overflowing,
.icms-form__symbols_count_wrap .symbols_count .overflowing_min{color:var(--red)}
/* === ZERO PLACEHOLDER === */
.zero{color:var(--text3);font-size:12px}
/* === MISC HELPERS === */
.is_online{color:#16a34a}
.is_offline{color:var(--text3)}
.no_approved{opacity:.4}
/* === FIX: SVG with