.nav a{transition:color .15s}.nav a:hover{color:var(--text)}.dropdown-menu{transition:opacity .15s ease}.dropdown.dropup .dropdown-menu{top:auto;bottom:100%;margin-top:0;margin-bottom:.375rem}.dropdown.active .dropdown-menu{display:flex;flex-direction:column;opacity:1}.dropdown-menu a{display:flex;align-items:center;gap:8px;padding:.55rem 1rem;color:var(--text-soft);font-size:.85rem;text-decoration:none;transition:all .15s}.flag-img{width:18px;height:13px;border-radius:2px;flex-shrink:0;box-shadow:0 0 0 1px rgba(0,0,0,.1);display:inline-block;background-size:cover;background-position:center;background-repeat:no-repeat}.flag-id{background-image:url(/img/icons/flag-id.svg)}.flag-th{background-image:url(/img/icons/flag-th.svg)}.flag-es{background-image:url(/img/icons/flag-es.svg)}.flag-fr{background-image:url(/img/icons/flag-fr.svg)}.flag-de{background-image:url(/img/icons/flag-de.svg)}.flag-tr{background-image:url(/img/icons/flag-tr.svg)}.flag-ru{background-image:url(/img/icons/flag-ru.svg)}
.flag-en{background-image:url(/img/icons/flag-en.svg)}.dropdown-menu a:hover{background:var(--bg);color:var(--text)}.menu-toggle{cursor:pointer}.mob-menu{transition:right .3s cubic-bezier(.25,.46,.45,.94)}.mob-menu.active{right:0}.mob-close{cursor:pointer}.mob-nav a{transition:color .15s}.mob-nav a:hover{color:var(--text)}.mob-dropdown.active .mob-dropdown-menu{display:flex;flex-direction:column}.mob-overlay.active{display:block}main::before{pointer-events:none}.form-card:focus-within{box-shadow:0 0 0 1px rgba(197,195,187,.3)}.input-group{transition:border-color .2s}.input-group:focus-within{box-shadow:0 6px 20px rgba(247,247,247,.6)}#urlInput:focus{outline:0}.paste-btn{cursor:pointer;transition:all .15s}.paste-btn:hover{color:var(--text);background:var(--bg-alt)!important;border-color:var(--border)}.submit-btn{cursor:pointer;transition:all .2s}.submit-btn:hover{background:var(--accent-hover)!important;box-shadow:0 6px 20px rgba(13,115,119,.28)}.submit-btn:disabled{opacity:.78;cursor:not-allowed;transform:none;box-shadow:none}@media(max-width:768px){.result-card{width:100%;max-width:none;border-radius:16px;margin:0}}.content-text h3{font-family:var(--font);font-size:1.375rem;font-weight:700;letter-spacing:-.01em;margin:2.5rem 0 1rem;color:var(--text)}.faq-item:hover{border-color:var(--border)}.faq-item.active{border-color:var(--accent);box-shadow:0 4px 20px rgba(13,115,119,.08)}.faq-question:hover{color:var(--accent)}.faq-item.active .faq-question{color:var(--accent)}.faq-item.active .faq-question::after{background:var(--accent);transform:rotate(180deg)}.faq-item.active .faq-answer{max-height:500px}.footer-nav a:hover{color:var(--text)}.result-card{background:var(--bg-white);border-radius:24px;padding:2.5rem;width:100%;max-width:480px;margin:0 auto;border:1px solid var(--border-soft);box-shadow:0 8px 40px rgba(0,0,0,.08)}.video-preview{display:flex;flex-direction:column;gap:1rem;margin-bottom:2rem;text-align:center;align-items:center}.video-thumb{border-radius:18px;flex-shrink:0;max-width:350px;max-height:450px;object-fit:cover;object-position:center;width:100%;}.video-info{flex:1;min-width:0;width:100%}.video-title{font-family:var(--font);font-size:0.8rem;font-weight:400;color:var(--other-down);margin-bottom:.375rem;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:1.35;letter-spacing:-.01em}.video-author{display:flex;align-items:center;justify-content:center;gap:.5rem;font-size:1.4rem;color:var(--text);font-weight:700;margin-bottom: 25px;line-height:0}.video-author-avatar{width:30px;height:30px;min-width:30px;border-radius:50%;object-fit:cover;flex-shrink:0}.video-author>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.2}.download-actions{display:flex;flex-direction:column;gap:.625rem;margin-bottom:1.25rem;width:100%}.download-btn{width:100%;padding:1rem 1.25rem;background:var(--bg);border:1.5px solid var(--border);border-radius:14px;font-size:.9375rem;font-weight:600;cursor:pointer;font-family:var(--font);color:var(--text);transition:all .2s;display:flex;align-items:center;justify-content:center;gap:.75rem;text-align:center;text-decoration:none;position:relative;overflow:hidden;-webkit-appearance:none;appearance:none}.download-btn:hover{background:var(--bg-white);border-color:var(--accent);color:var(--accent);transform:translateY(-1px);box-shadow:0 4px 16px rgba(13,115,119,.12)}.download-btn.downloading{pointer-events:none;border-color:var(--accent);color:var(--accent)}.download-btn .progress-bar{position:absolute;left:0;bottom:0;height:3px;background:var(--accent);transition:width .15s linear,background .2s ease;width:0;border-radius:0 0 14px 14px;display:none}.download-btn.downloading .progress-bar{display:block}
.download-btn.download-done .progress-bar{display:block;background:#22c55e}.download-btn.download-done{border-color:#22c55e;color:#22c55e;pointer-events:none}.download-btn i{font-size:1.1rem;opacity:.7}.back-btn{width:100%;padding:1rem;background:var(--other-down);border:none;border-radius:14px;font-size:.9375rem;font-weight:600;cursor:pointer;font-family:var(--font);color:#fff;transition:all .2s;letter-spacing:.01em}.back-btn:hover{background:var(--accent-hover)}.toast{background:var(--bg-white);border:1px solid #f0b8b8;border-left:3px solid #e53e3e;border-radius:10px;padding:.875rem 1.25rem;display:flex;align-items:center;gap:.75rem;box-shadow:var(--shadow-md);animation:slideIn .25s cubic-bezier(.25,.46,.45,.94);min-width:280px}@keyframes slideIn{from{transform:translateX(100%) scale(.97);opacity:0}to{transform:translateX(0) scale(1);opacity:1}}.toast-icon{color:#e53e3e;font-size:1.125rem;flex-shrink:0}.toast-message{color:var(--text);font-size:.9rem;font-weight:500}.toast.toast-success{border-color:#bce3c5;border-left-color:#38a169}@media(max-width:768px){.video-preview{flex-direction:column;text-align:center}.video-thumb{width:100%;max-width:390px;min-width:230px;max-height:490px;}.toast{min-width:auto}}@media(max-width:480px){.result-card{padding:3rem 1.7rem;background-color:#f4f4f4}.result-card{border-radius:unset}}.paste-btn::before{transition:background-color .15s}.paste-btn:hover::before{background-color:var(--text)}.mob-nav .nav-tools>button::before,.nav-tools>button::before{transition:background-color .15s}.nav-tools>a:hover::before{background-color:var(--text)}.mob-nav .nav-lang>button::before,.nav-lang>button::before{transition:background-color .15s}.nav-lang>a:hover::before{background-color:var(--text)}.footer-nav .nav-lang>a:hover::before,.footer-nav .nav-tools>a:hover::before{background-color:var(--text)}@keyframes spin{to{transform:rotate(360deg)}}.submit-btn.loading::before{content:'';display:inline-block;width:1em;height:1em;border:2px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite;flex-shrink:0;mask-image:none;-webkit-mask-image:none;background-color:transparent}#formArea,#resultArea{transition:opacity .3s ease}#formArea.fading,#resultArea.fading{opacity:0;pointer-events:none}.btn-icon{width:1.1rem;height:1.1rem;opacity:.7;flex-shrink:0;display:inline-block;vertical-align:middle}.btn-icon-white{filter:brightness(0) invert(1);opacity:.9}.back-btn{display:flex;align-items:center;justify-content:center;gap:.6rem}
.footer-nav .nav-contact>a{color:var(--text-soft)}.footer-nav .nav-contact>a:hover{color:var(--text)}.footer-nav .nav-contact>a:hover::before{background-color:var(--text)}.download-btn .progress-bar.indeterminate{width:40%;animation:snapIndet 1.05s ease-in-out infinite}@keyframes snapIndet{0%{left:-40%}100%{left:100%}}
.dropdown-toggle,.mob-dropdown-toggle{font:inherit;background:none;border:none;cursor:pointer}.nav .dropdown-toggle{display:inline-flex;align-items:center;gap:5px;color:var(--text-soft);font-size:.9rem;font-weight:500;padding:0;transition:color .15s}.nav .dropdown-toggle:hover{color:var(--text)}.footer-nav .dropdown-toggle{display:inline-flex;align-items:center;gap:5px;color:var(--text-soft);font-size:.875rem;font-weight:500;padding:0;transition:color .15s}.footer-nav .dropdown-toggle:hover{color:var(--text)}.mob-nav .mob-dropdown-toggle{display:flex;align-items:center;gap:6px;width:100%;text-align:left;padding:.75rem 0;color:var(--text-soft);font-size:.9375rem;border:none;border-bottom:1px solid var(--border-soft);transition:color .15s}.mob-nav .mob-dropdown-toggle:hover{color:var(--text)}

.profile-slider{width:100%;margin-bottom:.875rem;display:flex;flex-direction:column;gap:.625rem}
.profile-stage{position:relative;width:100%;aspect-ratio:1/1;border-radius:14px;overflow:hidden;background:#000}
.profile-stage>img{width:100%;height:100%;object-fit:contain;display:block;transition:opacity .2s}
.profile-loader{display:none;position:absolute;inset:0;align-items:center;justify-content:center;background:rgba(0,0,0,.45)}
.profile-spin{width:36px;height:36px;border:3px solid rgba(255,255,255,.25);border-top-color:#fff;border-radius:50%;animation:profileSpin .7s linear infinite}
.profile-nav{position:absolute;top:50%;transform:translateY(-50%);width:34px;height:34px;border:none;border-radius:50%;background:rgba(0,0,0,.5);color:#fff;font-size:18px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s}
.profile-nav:hover{background:rgba(0,0,0,.72)}
.profile-prev{left:8px}
.profile-next{right:8px}
.profile-counter{position:absolute;top:8px;left:8px;padding:.25rem .55rem;border-radius:999px;background:rgba(0,0,0,.55);color:#fff;font-size:.72rem;font-weight:600;letter-spacing:.01em}
.profile-badge{position:absolute;top:8px;right:8px;padding:.25rem .55rem;border-radius:999px;background:rgba(0,0,0,.55);color:#fff;font-size:.72rem;font-weight:600}
.profile-caption{font-size:.85rem;line-height:1.45;color:var(--text);overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.profile-photonav{display:none;position:absolute;bottom:8px;left:50%;transform:translateX(-50%);align-items:center;gap:.25rem;padding:.15rem .3rem;border-radius:999px;background:rgba(0,0,0,.55)}
.profile-photonav button{width:24px;height:24px;border:none;border-radius:50%;background:transparent;color:#fff;font-size:15px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s}
.profile-photonav button:hover{background:rgba(255,255,255,.18)}
.profile-photonav span{min-width:34px;text-align:center;color:#fff;font-size:.72rem;font-weight:600;letter-spacing:.02em}
.profile-video{display:none;width:100%;height:100%;object-fit:contain;background:#000}
.profile-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:64px;height:64px;border:none;border-radius:50%;background:rgba(0,0,0,.55);cursor:pointer;display:none;align-items:center;justify-content:center;z-index:3;transition:background .15s,transform .15s}
.profile-play:hover{background:rgba(0,0,0,.75);transform:translate(-50%,-50%) scale(1.06)}
.profile-stage .profile-nav,.profile-stage .profile-counter,.profile-stage .profile-badge,.profile-stage .profile-photonav{z-index:2}
.profile-stage .profile-loader{z-index:1}
.video-thumb.profile-avatar{width:112px;height:112px;min-width:112px;max-width:112px;max-height:112px;aspect-ratio:1/1;border-radius:50%;object-fit:cover;object-position:center;flex-shrink:0}

.profile-icon,.profile-badge-icon,.profile-stat-icon,.profile-play::before{display:inline-block;flex-shrink:0;background-color:currentColor;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain}
.profile-badge.is-photo{display:inline-flex;align-items:center;gap:.28rem;line-height:1;padding-left:.45rem}
.profile-badge-icon{width:13px;height:13px;-webkit-mask-image:url(/img/icons/photos.svg);mask-image:url(/img/icons/photos.svg)}
.profile-stats{margin-top:.35rem;display:flex;flex-wrap:wrap;align-items:center;gap:.75rem;font-size:.78rem;color:var(--text-soft);font-weight:500;letter-spacing:.02em}
.profile-stat{display:inline-flex;align-items:center;gap:.28rem;line-height:1}
.profile-stat-icon{width:13px;height:13px;opacity:.85}
.profile-stat-icon.icon-play{-webkit-mask-image:url(/img/icons/play-fill.svg);mask-image:url(/img/icons/play-fill.svg)}
.profile-stat-icon.icon-heart{-webkit-mask-image:url(/img/icons/heart.svg);mask-image:url(/img/icons/heart.svg)}
.profile-stat-icon.icon-message{-webkit-mask-image:url(/img/icons/message.svg);mask-image:url(/img/icons/message.svg)}
.profile-stat-icon.icon-share{-webkit-mask-image:url(/img/icons/share.svg);mask-image:url(/img/icons/share.svg)}
.profile-play::before{content:"";width:26px;height:26px;margin-left:3px;background-color:#fff;-webkit-mask-image:url(/img/icons/play-fill.svg);mask-image:url(/img/icons/play-fill.svg)}
.profile-bottom{position:absolute;left:0;right:0;bottom:0;z-index:2;display:flex;align-items:flex-end;justify-content:center;gap:.6rem;padding:1.75rem .6rem .5rem;pointer-events:none;background:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.18) 38%,rgba(0,0,0,.66) 100%)}
.profile-stage.is-playing .profile-bottom{display:none}
.profile-bottom .profile-stats{margin:0;flex:none;min-width:0;display:flex;flex-wrap:nowrap;align-items:center;justify-content:center;gap:.6rem;color:#fff;font-size:.74rem;font-weight:600;letter-spacing:.01em;text-shadow:0 1px 2px rgba(0,0,0,.35)}
.profile-bottom .profile-stat{gap:.24rem;white-space:nowrap}
.profile-bottom .profile-stat-icon{width:12px;height:12px;opacity:.95}
.profile-meta{margin-top:-.15rem}
@media (max-width:420px){.profile-bottom{padding:1.5rem .45rem .45rem;gap:.4rem}.profile-bottom .profile-stats{gap:.45rem;font-size:.7rem}}
.profile-stage>.profile-photonav{position:absolute;top:8px;bottom:auto;left:50%;transform:translateX(-50%);z-index:3;pointer-events:auto;justify-self:auto;background:rgba(0,0,0,.55)}
.profile-stage.is-playing>.profile-photonav{display:none!important}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}.progress-bar.indeterminate{animation:none!important;left:0!important;width:100%!important;opacity:.35}}/* ===== Music card + real-time player (/music/) ===== */
.music-card{display:flex;flex-direction:column;align-items:center;gap:1.15rem;width:100%;margin-bottom:1.15rem}
.music-cover-wrap{width:200px;height:200px;flex-shrink:0;margin:.25rem auto .35rem}
.music-cover{width:200px;height:200px;border-radius:20px;object-fit:cover;object-position:center;display:block;box-shadow:0 10px 34px rgba(26,25,23,.18)}
@keyframes musicSpin{to{transform:rotate(360deg)}}
.music-meta{width:100%;text-align:center}
.music-title{font-family:var(--font);font-size:1.02rem;font-weight:700;color:var(--text);line-height:1.3;margin-bottom:.5rem;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;letter-spacing:-.01em}
.music-author{display:flex;align-items:center;justify-content:center;gap:.5rem;font-size:.92rem;font-weight:600;color:var(--text-soft)}
.music-author>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.music-player{display:flex;align-items:center;gap:.9rem;width:100%;background:var(--bg-white);border:1.5px solid var(--border-soft);border-radius:16px;padding:.75rem .9rem;box-shadow:var(--shadow-sm)}
.music-player.music-disabled{opacity:.55;pointer-events:none}
.music-play{flex-shrink:0;width:46px;height:46px;border-radius:50%;border:none;cursor:pointer;background:var(--accent);display:flex;align-items:center;justify-content:center;transition:transform .15s ease,background .2s ease;-webkit-appearance:none;appearance:none}
.music-play:hover{background:var(--accent-hover);transform:scale(1.05)}
.music-play-icon{width:0;height:0;border-style:solid;border-width:9px 0 9px 15px;border-color:transparent transparent transparent #fff;margin-left:3px;transition:none}
.music-play.is-playing .music-play-icon{width:14px;height:15px;border:none;margin-left:0;background:linear-gradient(to right,#fff 0 34%,transparent 34% 66%,#fff 66% 100%)}
.music-play.is-loading .music-play-icon{width:18px;height:18px;border:2.5px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;margin-left:0;background:none;animation:musicSpin .7s linear infinite}
.music-progress{flex:1;min-width:0;display:flex;flex-direction:column;gap:.35rem}
.music-seek{position:relative;height:16px;display:flex;align-items:center;cursor:pointer;touch-action:none}
.music-seek-track{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);height:5px;border-radius:5px;background:var(--border)}
.music-seek-fill{position:absolute;left:0;top:50%;transform:translateY(-50%);height:5px;border-radius:5px;background:var(--accent);width:0}
.music-seek-knob{position:absolute;top:50%;left:0;width:13px;height:13px;border-radius:50%;background:var(--accent);border:2px solid var(--bg-white);box-shadow:0 1px 4px rgba(0,0,0,.25);transform:translate(-50%,-50%);transition:none}
.music-seek:focus-visible{outline:none}
.music-seek:focus-visible .music-seek-knob{box-shadow:0 0 0 4px rgba(130,28,225,.25)}
.music-times{display:flex;justify-content:space-between;font-size:.72rem;color:var(--text-soft);font-variant-numeric:tabular-nums;letter-spacing:.01em}
.music-download{width:100%}
.music-hidden{display:none!important}
@media (max-width:480px){.music-cover-wrap,.music-cover{width:172px;height:172px}.music-play{width:42px;height:42px}}
@media (prefers-reduced-motion:reduce){.music-play.is-loading .music-play-icon{animation:none!important}}
