:root{font-family:ui-rounded,"Nunito",system-ui,sans-serif;color:#12323a;background:#f4fbfc}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at 80% 0,#d6f3eb,transparent 30rem),#f4fbfc}main{max-width:1120px;margin:auto;padding:1.2rem 1rem 4rem}header{display:flex;align-items:center;justify-content:space-between;padding:.4rem 0 2.5rem}.brand{font-size:1.6rem;font-weight:900;color:#164e63;text-decoration:none;letter-spacing:-.08em}.brand span{color:#e86f51}.quiet{border:0;background:white;color:#164e63;border-radius:999px;padding:.7rem 1rem;font-weight:800;cursor:pointer;box-shadow:0 2px 10px #164e6320}.intro{max-width:42rem}.eyebrow{font-size:.75rem;letter-spacing:.12em;font-weight:900;color:#e86f51;margin:0 0 .55rem}h1{font-size:clamp(2.4rem,7vw,5rem);line-height:.96;letter-spacing:-.06em;margin:0;color:#12323a}h2{font-size:1.5rem;margin:.3rem 0 .7rem}.intro>p:last-child,.muted{font-size:1.05rem;color:#497078;line-height:1.5}.channel-menu{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:1.15rem;margin-top:2.4rem}.channel-choice{appearance:none;min-height:230px;padding:1.1rem;border:0;border-radius:1.4rem;text-align:left;cursor:pointer;background:#164e63;color:#fff;box-shadow:0 10px 25px #164e6320;transition:transform .15s,box-shadow .15s}.channel-choice:hover,.channel-choice:focus-visible{transform:translateY(-4px);box-shadow:0 16px 30px #164e6330}.channel-choice img{width:5.1rem;height:5.1rem;border-radius:50%;object-fit:cover;border:3px solid #fff9}.channel-choice strong{display:block;font-size:1.3rem;margin-top:1.2rem;line-height:1.1}.channel-choice span{display:block;margin-top:.45rem;color:#d6f3eb;font-weight:700}.back{margin-top:1.6rem;border:0;background:#fff;color:#164e63;border-radius:999px;padding:.75rem 1rem;font:inherit;font-weight:900;cursor:pointer;box-shadow:0 2px 10px #164e6320}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:1.1rem;margin-top:1.3rem}.card{appearance:none;border:0;text-align:left;background:white;border-radius:1.25rem;overflow:hidden;padding:0;box-shadow:0 8px 22px #164e6316;cursor:pointer;transition:transform .15s}.card:hover{transform:translateY(-3px)}.card img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block}.card div{padding:.9rem}.card strong{font-size:1rem;line-height:1.2;display:block;color:#12323a}.card small{display:block;color:#63818a;margin-top:.4rem}.message{margin:2rem 0 0;padding:1rem 1.1rem;border-radius:1rem;background:white;color:#497078;display:none}.message.show{display:block}dialog{border:0;border-radius:1.4rem;padding:1.7rem;width:min(680px,calc(100vw - 2rem));box-shadow:0 16px 55px #12323a50;color:#12323a}dialog::backdrop{background:#12323a88}.close{float:right;border:0;background:#e6f4f2;width:2rem;height:2rem;border-radius:50%;font-size:1.5rem;line-height:1;cursor:pointer;color:#164e63}form{display:flex;gap:.6rem;margin:1.2rem 0}input{min-width:0;flex:1;border:2px solid #d1e5e5;border-radius:.8rem;padding:.85rem;font:inherit}button:not(.quiet):not(.close):not(.back){border:0;background:#164e63;color:#fff;border-radius:.8rem;padding:.85rem 1rem;font-weight:900;cursor:pointer}.error{color:#b42318;font-weight:700;min-height:1.2em}.channels{display:grid;gap:.65rem;margin:1.1rem 0 1.5rem}.channel{display:flex;align-items:center;gap:.7rem;background:#f4fbfc;padding:.65rem;border-radius:.9rem}.channel img{width:2.5rem;height:2.5rem;border-radius:50%;object-fit:cover}.channel strong{flex:1}.channel button{background:#fff1ed!important;color:#b42318!important}.toggle{display:flex;gap:.7rem;align-items:center;font-weight:700}.toggle input{flex:none;width:1.2rem;height:1.2rem}.hint{font-size:.85rem;line-height:1.45;color:#63818a;margin-top:1.5rem}#player{padding:1.2rem}#player-frame{clear:both;padding-top:1rem}iframe{width:100%;aspect-ratio:16/9;border:0;border-radius:.9rem}#player-title{margin:1rem 0 .2rem}#player-channel{color:#63818a;margin:0}@media(max-width:560px){main{padding:.9rem .8rem 3rem}header{padding-bottom:1.5rem}.channel-menu{grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}.channel-choice{min-height:180px;padding:.85rem}.channel-choice img{width:3.8rem;height:3.8rem}.channel-choice strong{font-size:1rem;margin-top:.75rem}.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}.card strong{font-size:.88rem}dialog{padding:1.2rem}form{flex-direction:column}}