*{box-sizing:border-box;margin:0;padding:0}
body{font-family:Roboto,Arial,sans-serif;color:#222}
.bar{padding:10px 8vw;font-weight:700;text-transform:uppercase;font-size:15px}
.video{position:relative;width:100%;aspect-ratio:16/9;background:#05051a;overflow:hidden}
.video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.video .ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#9aa;font-size:14px;text-align:center;padding:20px}
.offer{text-align:center;padding:14px 16px 0}
.offer .for{font-size:14px;text-transform:uppercase;line-height:1.3}
.offer .price{font-size:20px;line-height:1.3}
.yes{display:inline-block;margin-top:8px;padding:11px 24px;border-radius:4px;border:0;cursor:pointer;font:600 16px Montserrat,Arial,sans-serif;color:#111;background:linear-gradient(90deg,#5ccb6b,#9be9a0);text-decoration:none}
.yes:hover{filter:brightness(1.05)}
.no{display:block;margin:18px auto 0;font:italic 500 15px Montserrat,Arial,sans-serif;color:#e01b1b;text-decoration:none}
.fine{font-size:14px;margin:28px auto 40px;max-width:720px;padding:0 16px}
/* up+ */
.up{background:#cfae5a;min-height:100vh}
.up .bar{background:#a60e0e;color:#fff;text-align:center;font-size:20px;text-transform:none}
.up .bar b{color:#ffe14d}
.up .sub{text-align:center;color:#fff;font-size:17px;padding:6px 0}
.up .video{max-width:594px;margin:0 auto}
.up .offer{color:#fff;padding-top:36px}
.up .fine{color:#bfa25a;text-align:center}
/* 2+ */
.p2 .bar{background:#c9288c;color:#fff;padding:6px 6vw;font-size:14px}
.p2 .wrap{max-width:876px;margin:0 auto}
.p2 .offer{color:#c9a24a}
.p2 .fine{color:#888;text-align:center}
/* 3 */
.p3{background:#cfae5a;min-height:100vh}
.p3 .bar{background:#000;color:#fff;font-size:14px}
.p3 .h{text-align:center;font-weight:700;font-size:18px;line-height:1.7;padding:12px 16px 6px;color:#111;text-transform:uppercase}
.p3 .h em{font-style:normal;color:#b3150f}
.p3 .wrap{max-width:892px;margin:0 auto}
.p3 .offer{color:#fff}
.p3 .fine{color:#bfa25a;text-align:center}
/* youtube dark */
.yt{background:#000;color:#fff;font-family:Roboto,Arial,sans-serif;min-height:100vh}
.yt .search{display:flex;align-items:center;width:470px;max-width:92%;margin:60px auto 36px;border:1px solid #303030;border-radius:40px;height:36px;padding:0 6px 0 16px;color:#aaa;background:#000}
.yt .search span{flex:1;font-size:15px}
.yt .search i{width:50px;height:34px;display:grid;place-items:center;font-style:normal;background:#222;border-radius:0 40px 40px 0;margin-right:-6px}
.yt .mic{width:40px;height:40px;border-radius:50%;background:#222;display:grid;place-items:center;margin-left:10px}
.yt .main{display:flex;gap:18px;justify-content:center;align-items:flex-start;max-width:1000px;margin:0 auto;padding:0 12px;flex-wrap:wrap}
.yt .left{width:450px;max-width:100%}
.yt h1{font-size:20px;line-height:1.45;margin:12px 0 10px}
.yt .row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:12px}
.yt .av{width:26px;height:26px;border-radius:50%;background:#c00;display:grid;place-items:center;font-size:7px;font-weight:700}
.yt .sub{background:#f00;color:#fff;border-radius:20px;padding:9px 18px;font-weight:700;font-size:14px;margin-left:12px}
.yt .pill{background:#272727;border-radius:20px;padding:9px 14px;font-size:14px;font-weight:500}
.yt .chat{width:270px;max-width:100%;border:1px solid #333;border-radius:12px;display:flex;flex-direction:column;height:472px}
.yt .chat .t{padding:10px 16px 6px;border-bottom:1px solid #222}
.yt .chat .t b{font-size:15px;display:block}.yt .chat .t small{color:#aaa;font-size:11px}
.yt .msgs{flex:1;overflow-y:auto;padding:8px 16px;font-size:12.5px;line-height:1.35}
.yt .msg{display:flex;gap:10px;margin:0 0 12px}
.yt .msg .a{flex:0 0 18px;height:18px;border-radius:50%;margin-top:4px;font-size:9px;display:grid;place-items:center;color:#000}
.yt .msg b{font-weight:600;margin-right:6px}
.yt .in{display:flex;align-items:center;gap:6px;padding:10px 12px;border-top:1px solid #222}
.yt .in input{flex:1;background:#222;border:0;border-radius:20px;padding:10px 14px;color:#fff;font-size:13px}
.yt .in small{color:#aaa;font-size:11px}
@media(max-width:700px){.p2 .bar,.p3 .bar{padding:8px 14px}.yt .chat{height:360px}}
.yt .in button{background:none;border:0;color:#fff;font-size:20px;cursor:pointer}