/* Extracted from page_panels/video.php block 1 */
:root{
        --wv-card: rgba(8,10,14,0.62);
        --wv-border: rgba(255,255,255,0.10);
        --wv-border2: rgba(255,255,255,0.08);
        --wv-text: rgba(255,255,255,0.92);
        --wv-muted: rgba(255,255,255,0.70);
        --wv-dim: rgba(255,255,255,0.60);
        --wv-shadow: 0 24px 80px rgba(0,0,0,0.62);
    }

    .wv-watch{
        position: relative;
        background: #000;
        color: var(--wv-text);
        padding: 2.75rem 1.1rem 3.5rem;
        overflow: hidden;
    }

    .wv-bg{ position:absolute; inset:0; z-index:0; pointer-events:none; }
    .wv-video{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transform:translateZ(0); }

    .wv-overlay{
        position:absolute; inset:0;
        background:
            radial-gradient(1100px 760px at 18% 10%, rgba(0,0,0,0.18), rgba(0,0,0,0.82) 60%, rgba(0,0,0,0.92) 100%),
            linear-gradient(to bottom, rgba(0,0,0,0.28), rgba(0,0,0,0.84));
    }

    .wv-noise{
        position:absolute; inset:0;
        opacity:0.10;
        background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='220' height='220' filter='url(%23n)' opacity='.65'/%3E%3C/svg%3E");
        background-size:220px 220px;
    }

    .wv-inner{
        position: relative;
        z-index: 2;
        max-width: 1520px;
        margin: 0 auto;
    }

    .wv-panel{
        border-radius: 18px;
        background: var(--wv-card);
        border: 1px solid var(--wv-border);
        backdrop-filter: blur(12px);
        box-shadow: var(--wv-shadow);
        position: relative;
        overflow: hidden;
    }

    .wv-panel::before{
        content:"";
        position:absolute; inset:-2px;
        background: radial-gradient(700px 350px at var(--mx, 30%) var(--my, 20%), rgba(255,255,255,0.12), rgba(255,255,255,0) 55%);
        opacity:0.75;
        pointer-events:none;
    }

    .wv-panel::after{
        content:"";
        position:absolute; inset:0;
        background: linear-gradient(120deg, rgba(255,255,255,0.08), rgba(255,255,255,0) 28%, rgba(255,255,255,0.05) 62%, rgba(255,255,255,0));
        opacity:0.18;
        pointer-events:none;
    }

    /* topbar */
    .wv-topbar{
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:1rem;
        padding:0.85rem 1rem;
        margin-bottom:1.1rem;
    }

    .wv-back{
        display:inline-flex;
        align-items:center;
        justify-content:center;
        height:36px;
        padding:0 0.95rem;
        border-radius:999px;
        border:1px solid rgba(255,255,255,0.14);
        background:rgba(0,0,0,0.22);
        color:rgba(255,255,255,0.86);
        text-decoration:none;
        font-weight:900;
        font-size:0.9rem;
        transition:transform 0.10s ease, background 0.10s ease, border-color 0.10s ease;
        position:relative;
        z-index:2;
        white-space:nowrap;
    }
    .wv-back:hover{
        background:rgba(255,255,255,0.12);
        border-color:rgba(255,255,255,0.22);
        transform:translateY(-1px);
    }

    .wv-topmeta{
        display:flex;
        gap:0.45rem;
        align-items:center;
        position:relative;
        z-index:2;
        flex-wrap:wrap;
        justify-content:flex-end;
    }

    .wv-pill{
        display:inline-flex;
        align-items:center;
        height:28px;
        padding:0 0.7rem;
        border-radius:999px;
        border:1px solid rgba(255,255,255,0.14);
        background:rgba(0,0,0,0.22);
        font-weight:900;
        font-size:0.78rem;
        color:rgba(255,255,255,0.76);
        letter-spacing:0.02em;
        text-transform:uppercase;
        white-space:nowrap;
    }
    .wv-pill-link{ text-decoration:none; }
    .wv-pill-link:hover{
        background:rgba(255,255,255,0.12);
        border-color:rgba(255,255,255,0.22);
    }

    /* layout */
    .wv-layout{ display:block; }
    .wv-main{ min-width:0; }

    /* player */
    .wv-player-panel{ padding:1rem; }
    .wv-player-frame{
        position:relative;
        width:100%;
        aspect-ratio:16 / 9;
        background:rgba(0,0,0,0.30);
        border-radius:16px;
        border:1px solid rgba(255,255,255,0.10);
        overflow:hidden;
        z-index:2;
    }
    .wv-player-frame iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }

    .wv-player-html5{
        background:rgba(0,0,0,0.30);
        border-radius:16px;
        border:1px solid rgba(255,255,255,0.10);
        overflow:hidden;
        z-index:2;
        position:relative;
    }
    .wv-player{ width:100%; aspect-ratio:16 / 9; height:auto; display:block; background:#000; }
    .wv-player-html5:hover .wv-controls,
    .wv-player-html5:focus-within .wv-controls{ opacity:1; transform:translateY(0); }
    .wv-controls{
        position:absolute;
        left:0.75rem;
        right:0.75rem;
        bottom:0.75rem;
        z-index:5;
        display:grid;
        grid-template-columns:auto auto minmax(120px,1fr) auto 92px auto;
        gap:0.55rem;
        align-items:center;
        padding:0.55rem;
        border-radius:12px;
        border:1px solid rgba(255,255,255,0.16);
        background:rgba(0,0,0,0.74);
        backdrop-filter:blur(12px);
        opacity:0.18;
        transform:translateY(6px);
        transition:opacity .15s ease, transform .15s ease;
    }
    .wv-controls-downloadable{
        grid-template-columns:auto auto minmax(120px,1fr) auto 92px auto auto;
    }
    .wv-control-btn{
        width:38px;
        height:34px;
        border-radius:8px;
        border:1px solid rgba(255,255,255,0.16);
        background:rgba(255,255,255,0.10);
        color:rgba(255,255,255,0.92);
        font-weight:900;
        cursor:pointer;
    }
    .wv-control-download{
        width:auto;
        min-width:150px;
        padding:0 0.8rem;
        text-decoration:none;
        display:inline-flex;
        align-items:center;
        justify-content:center;
        font-size:0.78rem;
    }
    .wv-control-btn:hover{ background:rgba(255,255,255,0.18); }
    .wv-time{
        min-width:96px;
        color:rgba(255,255,255,0.78);
        font-size:0.78rem;
        font-weight:900;
        white-space:nowrap;
    }
    .wv-seek,.wv-volume{
        width:100%;
        accent-color:#ffffff;
    }

    .wv-player-tiktok{
        display:flex;
        justify-content:center;
        align-items:center;
        min-height:520px;
        background:rgba(0,0,0,0.30);
        border-radius:16px;
        border:1px solid rgba(255,255,255,0.10);
        overflow:hidden;
        z-index:2;
        position:relative;
        padding:0.35rem;
    }
    .wv-player-tiktok blockquote{ margin:0; }

    .wv-player-fallback{
        padding:1.25rem;
        border-radius:16px;
        border:1px solid rgba(255,255,255,0.10);
        background:rgba(0,0,0,0.30);
        z-index:2;
        position:relative;
        text-align:center;
        color:rgba(255,255,255,0.75);
    }

    /* recommendations */
    .wv-recommend{ padding:1rem 1.05rem 1.05rem; margin-top:1.1rem; }
    .wv-recommend-head{
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:1rem;
        margin-bottom:0.8rem;
        position:relative;
        z-index:2;
    }
    .wv-recommend-title{
        margin:0;
        font-weight:900;
        font-size:1.05rem;
        letter-spacing:-0.01em;
    }
    .wv-recommend-count{
        display:inline-flex;
        align-items:center;
        justify-content:center;
        min-width:30px;
        height:26px;
        padding:0 0.6rem;
        border-radius:999px;
        border:1px solid rgba(255,255,255,0.14);
        background:rgba(0,0,0,0.22);
        color:rgba(255,255,255,0.78);
        font-weight:900;
        font-size:0.82rem;
    }
    .wv-recommend-grid{
        position:relative;
        z-index:2;
        display:grid;
        grid-template-columns:repeat(5, minmax(0, 1fr));
        gap:0.85rem;
    }
    .wv-recommend-card{
        text-decoration:none;
        color:rgba(255,255,255,0.90);
        border-radius:16px;
        border:1px solid rgba(255,255,255,0.10);
        background:rgba(0,0,0,0.22);
        overflow:hidden;
        transition:transform 0.10s ease, border-color 0.10s ease, background 0.10s ease;
    }
    .wv-recommend-card:hover{
        transform:translateY(-1px);
        border-color:rgba(255,255,255,0.22);
        background:rgba(255,255,255,0.06);
    }
    .wv-recommend-thumb-wrap{ background:#000; }
    .wv-recommend-thumb,
    .wv-recommend-thumb-placeholder{
        width:100%;
        aspect-ratio:16 / 9;
        display:block;
        object-fit:cover;
    }
    .wv-recommend-thumb-placeholder{
        display:flex;
        align-items:center;
        justify-content:center;
        color:rgba(255,255,255,0.62);
        font-weight:900;
        font-size:0.82rem;
        text-transform:uppercase;
        letter-spacing:0.03em;
        background:rgba(255,255,255,0.06);
    }
    .wv-recommend-info{
        padding:0.8rem 0.85rem 0.9rem;
        display:flex;
        flex-direction:column;
        gap:0.4rem;
    }
    .wv-recommend-card-title{
        font-weight:900;
        line-height:1.25;
        font-size:0.92rem;
        overflow:hidden;
        display:-webkit-box;
        -webkit-line-clamp:2;
        -webkit-box-orient:vertical;
    }
    .wv-recommend-views{
        color:rgba(255,255,255,0.64);
        font-weight:900;
        font-size:0.82rem;
    }

    /* head */
    .wv-head{ padding:1rem 1.05rem; margin-top:1.1rem; }
    .wv-title{
        margin:0 0 0.55rem;
        font-weight:900;
        letter-spacing:-0.02em;
        font-size:clamp(1.35rem, 2.6vw, 1.9rem);
        line-height:1.08;
        position:relative;
        z-index:2;
    }

    .wv-meta{
        display:flex;
        flex-wrap:wrap;
        gap:0.45rem;
        align-items:center;
        color:rgba(255,255,255,0.72);
        font-weight:900;
        font-size:0.86rem;
        position:relative;
        z-index:2;
    }
    .wv-dot{ opacity:0.65; }
    .wv-provider{
        display:inline-flex;
        align-items:center;
        padding:0 0.6rem;
        height:26px;
        border-radius:999px;
        border:1px solid rgba(255,255,255,0.14);
        background:rgba(0,0,0,0.22);
        font-size:0.78rem;
        letter-spacing:0.02em;
        text-transform:uppercase;
        color:rgba(255,255,255,0.78);
    }
    .wv-spacer{ flex:1 1 auto; }
    .wv-link{
        color:rgba(255,255,255,0.78);
        text-decoration:none;
        padding:0.25rem 0.65rem;
        border-radius:999px;
        border:1px solid rgba(255,255,255,0.14);
        background:rgba(0,0,0,0.22);
        font-size:0.82rem;
        font:inherit;
        font-weight:900;
        cursor:pointer;
    }
    .wv-link:hover{
        background:rgba(255,255,255,0.12);
        border-color:rgba(255,255,255,0.22);
    }
    .wv-download-link{
        background:rgba(255,255,255,0.86);
        color:rgba(0,0,0,0.92);
        border-color:rgba(255,255,255,0.86);
    }
    .wv-download-link:hover{
        background:rgba(255,255,255,0.95);
        border-color:rgba(255,255,255,0.95);
    }

    .wv-info-grid{
        display:grid;
        grid-template-columns:minmax(0, 1fr) minmax(0, 1fr);
        gap:1.1rem;
        align-items:start;
        margin-top:1.1rem;
    }
    .wv-section-head{
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:1rem;
        margin-bottom:0.75rem;
        position:relative;
        z-index:2;
    }
    .wv-section-title{
        margin:0;
        font-weight:900;
        font-size:1.05rem;
        letter-spacing:-0.01em;
    }

    /* description */
    .wv-desc{ padding:1rem 1.05rem; min-height:220px; }
    .wv-desc-text{
        position:relative;
        z-index:2;
        line-height:1.6;
        color:rgba(255,255,255,0.76);
        overflow-wrap:anywhere;
    }
    .wv-desc-muted{ color:rgba(255,255,255,0.64); }

    /* comments */
    .wv-comments{ padding:1rem 1.05rem 1.1rem; min-height:220px; }
    .wv-comments-head{
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:1rem;
        margin-bottom:0.75rem;
        position:relative;
        z-index:2;
    }
    .wv-comments-title{
        margin:0;
        font-weight:900;
        font-size:1.05rem;
        letter-spacing:-0.01em;
    }
    .wv-comments-count{
        display:inline-flex;
        align-items:center;
        justify-content:center;
        min-width:30px;
        height:26px;
        padding:0 0.6rem;
        border-radius:999px;
        border:1px solid rgba(255,255,255,0.14);
        background:rgba(0,0,0,0.22);
        color:rgba(255,255,255,0.78);
        font-weight:900;
        font-size:0.82rem;
    }

    .wv-comment-form{ position:relative; z-index:2; }
    .wv-comment-form textarea{
        width:100%;
        min-height:70px;
        resize:vertical;
        padding:0.65rem 0.75rem;
        border-radius:14px;
        border:1px solid rgba(255,255,255,0.14);
        background:rgba(0,0,0,0.30);
        color:rgba(255,255,255,0.88);
        outline:none;
    }
    .wv-comment-form textarea:focus{
        border-color:rgba(255,255,255,0.35);
        background:rgba(0,0,0,0.36);
    }

    .wv-comment-actions{
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:0.8rem;
        margin-top:0.55rem;
    }

    .wv-comment-hint{
        color:rgba(255,255,255,0.60);
        font-weight:900;
        font-size:0.78rem;
        letter-spacing:0.02em;
        text-transform:uppercase;
        white-space:nowrap;
    }

    .wv-comment-signin{
        position:relative;
        z-index:2;
        color:rgba(255,255,255,0.70);
        margin:0.25rem 0 0;
    }

    .wv-comment-list{
        position:relative;
        z-index:2;
        margin-top:1rem;
        display:flex;
        flex-direction:column;
        gap:0.85rem;
    }

    .wv-comment-item{
        display:flex;
        gap:0.75rem;
        align-items:flex-start;
        padding:0.65rem 0.65rem;
        border-radius:16px;
        border:1px solid rgba(255,255,255,0.08);
        background:rgba(0,0,0,0.22);
    }

    .wv-comment-avatar{
        width:38px;
        height:38px;
        border-radius:999px;
        border:1px solid rgba(255,255,255,0.14);
        background:rgba(255,255,255,0.10);
        display:flex;
        align-items:center;
        justify-content:center;
        font-weight:900;
        color:rgba(255,255,255,0.90);
        flex:0 0 auto;
    }

    .wv-comment-body{ min-width:0; flex:1 1 auto; }
    .wv-comment-meta{
        display:flex;
        flex-wrap:wrap;
        gap:0.45rem;
        align-items:center;
        color:rgba(255,255,255,0.66);
        font-weight:900;
        font-size:0.82rem;
        margin-bottom:0.25rem;
    }

    .wv-comment-username{ color:rgba(255,255,255,0.90); }
    .wv-comment-text{ color:rgba(255,255,255,0.78); line-height:1.55; overflow-wrap:anywhere; }

    .wv-no-comments{
        margin:0.25rem 0 0;
        color:rgba(255,255,255,0.60);
        font-weight:900;
        font-size:0.9rem;
    }

    /* buttons */
    .wv-btn{
        display:inline-flex;
        align-items:center;
        justify-content:center;
        height:42px;
        padding:0 1.05rem;
        border-radius:999px;
        font-size:0.92rem;
        font-weight:900;
        text-decoration:none;
        border:1px solid rgba(255,255,255,0.14);
        background:rgba(255,255,255,0.10);
        color:rgba(255,255,255,0.92);
        box-shadow:0 18px 46px rgba(0,0,0,0.55);
        transition:transform 0.10s ease, background 0.10s ease, border-color 0.10s ease;
        cursor:pointer;
    }
    .wv-btn:hover{
        background:rgba(255,255,255,0.14);
        border-color:rgba(255,255,255,0.22);
        transform:translateY(-1px);
    }
    .wv-btn:active{ transform:translateY(0); }
    .wv-btn-primary{
        background:rgba(255,255,255,0.86);
        color:rgba(0,0,0,0.92);
        border-color:rgba(255,255,255,0.86);
    }
    .wv-btn-primary:hover{
        background:rgba(255,255,255,0.95);
        border-color:rgba(255,255,255,0.95);
    }

    .wv-modal[hidden]{ display:none; }
    .wv-modal{
        position:fixed;
        inset:0;
        z-index:2147483000;
        display:grid;
        place-items:center;
        padding:1rem;
        color:rgba(255,255,255,0.92);
    }
    .wv-modal-backdrop{
        position:absolute;
        inset:0;
        z-index:0;
        background:rgba(0,0,0,0.58);
        backdrop-filter:blur(4px);
    }
    .wv-modal-dialog{
        position:relative;
        z-index:2;
        width:min(720px, 100%);
        max-height:min(86vh, 900px);
        border-radius:16px;
        border:1px solid rgba(255,255,255,0.18);
        background:#0b0f17;
        box-shadow:0 28px 90px rgba(0,0,0,0.72);
        overflow:auto;
    }
    .wv-edit-form{
        display:grid;
        gap:1rem;
        padding:1.1rem;
    }
    .wv-modal-head{
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:1rem;
    }
    .wv-modal-head h2{
        margin:0;
        font-size:1.1rem;
        font-weight:900;
    }
    .wv-modal-close{
        width:36px;
        height:36px;
        border-radius:8px;
        border:1px solid rgba(255,255,255,0.16);
        background:rgba(255,255,255,0.10);
        color:rgba(255,255,255,0.92);
        font-weight:900;
        cursor:pointer;
    }
    .wv-edit-field{
        display:grid;
        gap:0.4rem;
    }
    .wv-edit-field span{
        font-size:0.78rem;
        letter-spacing:0.04em;
        text-transform:uppercase;
        color:rgba(255,255,255,0.66);
        font-weight:900;
    }
    .wv-edit-field input,
    .wv-edit-field textarea,
    .wv-edit-field select{
        width:100%;
        border-radius:10px;
        border:1px solid rgba(255,255,255,0.14);
        background:rgba(0,0,0,0.32);
        color:rgba(255,255,255,0.92);
        padding:0.75rem 0.85rem;
        outline:none;
        font:inherit;
    }
    .wv-edit-field textarea{
        min-height:110px;
        resize:vertical;
    }
    .wv-edit-field select option{
        background:#0b0f17;
        color:#fff;
    }
    .wv-edit-field input:focus,
    .wv-edit-field textarea:focus,
    .wv-edit-field select:focus{
        border-color:rgba(255,255,255,0.34);
        background:rgba(0,0,0,0.42);
    }
    .wv-edit-grid{
        display:grid;
        grid-template-columns:1fr 1fr;
        gap:0.8rem;
    }
    .wv-edit-checks{
        display:flex;
        gap:0.75rem;
        flex-wrap:wrap;
    }
    .wv-edit-checks label{
        display:inline-flex;
        align-items:center;
        gap:0.45rem;
        padding:0.65rem 0.8rem;
        border-radius:10px;
        border:1px solid rgba(255,255,255,0.14);
        background:rgba(0,0,0,0.24);
        font-weight:900;
        cursor:pointer;
    }
    .wv-edit-checks input{
        width:18px;
        height:18px;
        accent-color:#fff;
    }
    .wv-modal-actions{
        display:flex;
        justify-content:flex-end;
        gap:0.65rem;
        flex-wrap:wrap;
    }

    /* responsive */
    @media (max-width: 1200px){
        .wv-recommend-grid{ grid-template-columns:repeat(3, minmax(0, 1fr)); }
    }
    @media (max-width: 980px){
        .wv-player-tiktok{ min-height: 420px; }
        .wv-recommend-grid{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
        .wv-info-grid{ grid-template-columns:1fr; }
    }
    @media (max-width: 720px){
        .wv-watch{ padding: 2.4rem 1rem 3.2rem; }
        .wv-edit-grid{ grid-template-columns:1fr; }
        .wv-player-panel{ padding:0.7rem; }
        .wv-controls{
            grid-template-columns:auto minmax(0,1fr) auto auto;
            left:0.45rem;
            right:0.45rem;
            bottom:0.45rem;
        }
        .wv-controls-downloadable{
            grid-template-columns:auto minmax(0,1fr) auto auto auto;
        }
        .wv-time,.wv-volume{ display:none; }
        .wv-control-download{
            min-width:40px;
            width:40px;
            padding:0;
            overflow:hidden;
            color:transparent;
            position:relative;
        }
        .wv-control-download::before{
            content:"DL";
            color:rgba(255,255,255,0.92);
            position:absolute;
        }
        .wv-recommend{ padding:0.9rem; }
        .wv-recommend-grid{ grid-template-columns:minmax(0, 1fr); }
        .wv-title{ font-size: 1.45rem; }
    }


