/* === КАБИНЕТ === */
.cabinet{position:relative;z-index:2;padding-top:120px;opacity:0;transition:opacity .5s;display:none}
.cabinet.active{opacity:1;display:block}
.cabinet:not(.active) .bottom-nav,.cabinet:not(.active) .fab-ticket-btn{display:none!important}
.fade-top{position:fixed;top:75px;left:0;width:100%;height:140px;background:linear-gradient(to bottom,var(--bg) 20%,transparent 100%);pointer-events:none;z-index:1}
.dots-wrapper{display:flex;justify-content:center;margin-bottom:50px;position:relative;z-index:2}
.dot-matrix{display:grid;grid-template-columns:repeat(10,1fr);gap:8px}
.dot{width:8px;height:8px;background:var(--text-ghost);border-radius:50%}
.dot.active{background:var(--text);box-shadow:0 0 4px var(--glow-soft)}
.dot-matrix.faded{mask-image:linear-gradient(to bottom,transparent 0%,black 50%);-webkit-mask-image:linear-gradient(to bottom,transparent 0%,black 50%)}
.sub-info{text-align:center;margin-bottom:50px;padding:0 20px;position:relative;z-index:2}
/* === v4: цветовая шкала срока подписки (5д=жёлтый → оранж → тёмно-красный при истечении) === */
.days-left.exp-warn-5,.days-left.exp-warn-4,.days-left.exp-warn-3,.days-left.exp-warn-2,.days-left.exp-warn-1,.days-left.exp-warn-0,.days-left.exp-expired{background:none;-webkit-background-clip:initial;background-clip:initial;-webkit-text-fill-color:var(--exp-d5)}
.days-left.exp-warn-4{-webkit-text-fill-color:var(--exp-d4)}
.days-left.exp-warn-3{-webkit-text-fill-color:var(--exp-d3)}
.days-left.exp-warn-2{-webkit-text-fill-color:var(--exp-d2)}
.days-left.exp-warn-1{-webkit-text-fill-color:var(--exp-d1)}
.days-left.exp-warn-0{-webkit-text-fill-color:var(--exp-d0)}
.days-left.exp-expired{-webkit-text-fill-color:var(--exp-expired)}
.end-date.exp-warn-5{color:var(--exp-d5);border-color:var(--exp-d5)}
.end-date.exp-warn-4{color:var(--exp-d4);border-color:var(--exp-d4)}
.end-date.exp-warn-3{color:var(--exp-d3);border-color:var(--exp-d3)}
.end-date.exp-warn-2{color:var(--exp-d2);border-color:var(--exp-d2)}
.end-date.exp-warn-1{color:var(--exp-d1);border-color:var(--exp-d1)}
.end-date.exp-warn-0{color:var(--exp-d0);border-color:var(--exp-d0)}
.end-date.exp-expired{color:var(--exp-expired);border-color:var(--exp-expired);background:var(--exp-expired-bg)}
.dot-matrix.exp-warn-5 .dot.active{background:var(--exp-d5);box-shadow:0 0 4px var(--exp-d5)}
.dot-matrix.exp-warn-4 .dot.active{background:var(--exp-d4);box-shadow:0 0 4px var(--exp-d4)}
.dot-matrix.exp-warn-3 .dot.active{background:var(--exp-d3);box-shadow:0 0 4px var(--exp-d3)}
.dot-matrix.exp-warn-2 .dot.active{background:var(--exp-d2);box-shadow:0 0 4px var(--exp-d2)}
.dot-matrix.exp-warn-1 .dot.active{background:var(--exp-d1);box-shadow:0 0 4px var(--exp-d1)}
.dot-matrix.exp-warn-0 .dot.active{background:var(--exp-d0);box-shadow:0 0 4px var(--exp-d0)}
.dot-matrix.exp-expired .dot.active{background:var(--exp-expired);box-shadow:0 0 4px var(--exp-expired)}
.days-left{font-size:clamp(48px,12vw,80px);font-weight:200;line-height:1;margin-bottom:12px;background:linear-gradient(180deg,var(--gradient-text-start) 0%,var(--gradient-text-end) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.sub-label{font-size:16px;color:var(--text-muted);text-transform:uppercase;letter-spacing:1px}
.end-date{margin-top:15px;font-size:15px;color:var(--text);display:inline-block;padding:8px 20px;border:1px solid var(--pill-border);border-radius:999px;background:var(--pill-bg);backdrop-filter:var(--pill-blur);-webkit-backdrop-filter:var(--pill-blur);animation:glassBlurIn .18s ease-out both}
/* === ВЬЮХИ И КАРТОЧКИ === */
.view-container{padding:0 30px;max-width:600px;margin:0 auto;position:relative;z-index:2}
.view{display:none}
.view.active{display:block;animation:slideIn .18s ease}
.card{background:var(--surface);border:1px solid var(--border-light);border-radius:20px;padding:32px;margin-bottom:20px;backdrop-filter:var(--pill-blur);-webkit-backdrop-filter:var(--pill-blur);animation:glassBlurIn .18s ease-out both;contain:paint}
.card h3{font-size:14px;color:var(--text-muted);text-transform:uppercase;margin-bottom:16px;font-weight:700;letter-spacing:1px}
.link-box{margin-top:12px;border:1px solid var(--border-heavy);border-radius:14px;background:var(--surface-active);padding:16px 18px;box-sizing:border-box;backdrop-filter:var(--pill-blur);-webkit-backdrop-filter:var(--pill-blur);animation:glassBlurIn .18s ease-out both}
.link-text{font-size:16px;color:var(--text-secondary);white-space:nowrap;overflow-x:auto;overflow-y:hidden;user-select:none;-webkit-user-select:none;cursor:pointer;transition:color .2s ease;padding-bottom:4px;scrollbar-width:thin;scrollbar-color:var(--pill-border) transparent}
.link-text:hover{color:var(--text)}
.link-text:active{opacity:.7}
.link-text::-webkit-scrollbar{height:4px}
.link-text::-webkit-scrollbar-track{background:transparent}
.link-text::-webkit-scrollbar-thumb{background:var(--pill-border);border-radius:4px}
#view-profile .hero-title-wrap{margin-bottom:30px}
#view-profile .hero-title-text span{font-size:clamp(36px,8vw,60px);letter-spacing:-1px}
#view-profile .hero-moon{width:clamp(90px,20vw,170px);height:clamp(90px,20vw,170px);font-size:clamp(58px,12vw,110px)}
#pUsername:hover,#pUserId:hover{opacity:.7}
#pUsername:hover{border-bottom-color:var(--text-secondary)!important}
#pUserId:hover{background:var(--surface-hover)!important;border-color:var(--border-heavy)!important}
#pUsername:active,#pUserId:active{transform:scale(.98)}