body{background:#f2f5f9;color:#19344e;-webkit-font-smoothing:antialiased}
header{background:#121a66;border-top:4px solid #e0a91c;padding:19px 28px;gap:18px}header>b{font-size:13px;letter-spacing:1.8px}header nav{font-size:12px;color:#d3d6ee}header nav a{text-decoration:none}header nav a:hover{color:white}
main{max-width:1800px;margin:auto;padding:30px 28px}.top{margin-bottom:26px;gap:18px}.top small{font-size:10px;letter-spacing:1.8px;color:#63809a;font-weight:700}h1{font-size:29px;letter-spacing:-.8px;margin:8px 0}.top p{font-size:13px;margin:8px 0}.badge{background:#e4eef5;color:#416982;font-size:11px;border:1px solid #d2e2ed;padding:7px 12px;white-space:nowrap}
.layout{grid-template-columns:minmax(430px,1.9fr) repeat(3,minmax(210px,1fr));gap:14px;align-items:start}section{min-width:0;padding:20px;border:1px solid #dce5ed;border-radius:13px;box-shadow:0 3px 12px #102d5004}h2{font-size:15px;letter-spacing:-.2px;margin-bottom:18px;display:flex;align-items:center;gap:9px}section>h2:first-child:before{content:'';width:4px;height:16px;border-radius:3px;background:#76b8d5;flex-shrink:0}.player>h2:first-child:before{background:#121a66}.layout>section:last-child{border-top:3px solid #7dbbd6}.muted,small{color:#718599;font-size:12px;line-height:1.6}label{font-size:12px;font-weight:600;color:#527088}
button,input,select{font-size:12px;line-height:1.4;min-height:36px;border-radius:7px;border-color:#cfdae5;padding:8px 11px;transition:background .15s,border-color .15s,box-shadow .15s}input,select{background:#f9fbfd}select{max-width:100%;width:100%;text-overflow:ellipsis}button{font-weight:600}button:hover{background:#eaf3f9;border-color:#86b4cd}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #8ac6e4;outline-offset:2px}.primary{background:#1a2380;border-color:#1a2380;color:white}.primary:hover{background:#0b2e50;color:white}#play:before{content:'▶';font-size:10px;margin-right:7px}#save{border-color:#91b7ce;color:#205b7d}#matches{font-weight:600;margin-bottom:2px}#title{flex:1 1 180px}#url{flex:1 1 220px}#addMatch{margin-left:auto}iframe{display:block;border-radius:9px;box-shadow:0 3px 12px #102d5010}#playing{min-height:12px;margin:8px 0 20px}.row{gap:6px}
#tagboard{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;background:#eef3f8;border:1px solid #dce6ef;padding:10px;border-radius:10px}#tagboard button{background:#1a24a0;color:white;border:1px solid #1a24a0;min-height:43px;font-size:12px;border-radius:7px;padding:8px 4px;box-shadow:0 2px 3px #102d5008}#tagboard button.rival{background:#566b94;border-color:#566b94}#tagboard button:hover:enabled{background:#1a2380;transform:translateY(-1px)}#tagboard button:disabled{opacity:.55}#tagboard button:nth-child(3),#tagboard button:last-child{grid-column:auto;grid-row:auto}#clock{font-size:11px;font-variant-numeric:tabular-nums;margin-left:auto}#settings{padding:12px;background:#f4f8fb;border-radius:8px;margin-top:12px}.timing{grid-template-columns:1.3fr 1fr 1fr}.timing b{font-size:11px}
#start,#end{width:100%;margin-top:5px}.player label{flex:1;min-width:100px}.player .row:has(#clipTitle){flex-wrap:wrap}#clipTitle{flex:1 1 150px}.clip{padding:13px 0}.clip strong{font-size:12px;line-height:1.5;margin-bottom:4px;overflow-wrap:anywhere}.clip small{font-size:10px}.clip button{font-size:10px;min-height:29px;padding:5px 8px}.clip [data-action=add]{color:#23627e;border-color:#b2d1e1;background:#f0f8fc}.clip .row{margin:9px 0 0}.tag-group{border-color:#e0e8ef;background:#fff;padding:9px;margin:12px 0}.tag-group h3{font-size:12px;background:#eef4f8;padding:8px;display:flex;align-items:center;justify-content:space-between}.tag-group .badge{padding:2px 7px;font-size:10px}.tag-group .clip:last-child{border-bottom:0}#clips,#createdClips,#playlist{max-height:68vh;overflow:auto;scrollbar-width:thin;scrollbar-color:#ccdae5 transparent}#clips>.muted,#createdClips>.muted,#playlist>.muted{padding:24px 14px;border:1px dashed #cbdce9;border-radius:8px;text-align:center;background:#f8fbfd}#name{font-weight:600}#status:not(:empty){position:sticky;bottom:12px;border:1px solid #cee2db;background:#f3faf6;box-shadow:0 3px 15px #102d5008;padding:12px 16px;border-radius:9px;font-size:12px}dialog{padding:24px;box-shadow:0 20px 70px #102d5030}dialog label input{display:block;width:100%;margin-top:6px}
@media(min-width:1251px) and (max-width:1450px){main{padding:26px 18px}.layout{gap:10px;grid-template-columns:minmax(370px,1.8fr) repeat(3,minmax(180px,1fr))}section{padding:15px}}
@media(max-width:1250px){.layout{grid-template-columns:repeat(3,minmax(0,1fr))}.player{grid-column:1/-1}#tagboard{grid-template-columns:repeat(3,minmax(0,1fr))}.player iframe{max-height:60vh}}
@media(max-width:780px){main{padding:24px 16px}.layout{grid-template-columns:1fr 1fr}.layout>section:last-child{grid-column:1/-1}.top{align-items:flex-start;flex-direction:column}.top .badge{white-space:normal}h1{font-size:25px}header{padding:18px 16px}}
@media(max-width:560px){.layout{display:block}section{margin-bottom:16px;padding:16px}#clips,#createdClips,#playlist{max-height:50vh}header nav{font-size:11px}}
/* Listas de cortes y charla */
#clips,#createdClips,#playlist{padding:4px 3px 8px;scrollbar-gutter:stable}
#clips>.clip,#playlist>.clip,.tag-group .clip{background:#fff;border:1px solid #dce6ee;border-radius:9px;padding:13px 11px;margin:0 0 9px;box-shadow:0 2px 5px #102d5004;transition:border-color .15s,box-shadow .15s}
#clips>.clip:hover,#playlist>.clip:hover,.tag-group .clip:hover{border-color:#93bed5;box-shadow:0 3px 10px #102d5009}
.clip strong{font-size:13px;font-weight:650;line-height:1.5;letter-spacing:-.15px;margin-bottom:7px}
.clip small{display:block;font-size:11px;font-variant-numeric:tabular-nums;color:#607d94;line-height:1.7;overflow-wrap:anywhere}
.clip .row{display:flex;gap:5px;margin-top:12px;padding-top:10px;border-top:1px solid #edf2f6}
.clip button{border-radius:6px;font-size:10px;padding:6px 8px;min-height:31px}
.clip button[data-action=view]{background:#1a2380;border-color:#1a2380;color:#fff;flex:1}
.clip button[data-action=view]:hover{background:#0b2e50}
.clip button[data-action=view]:before{content:'▶';font-size:8px;margin-right:5px}
.clip button[data-action=edit]{background:#f7f9fc;color:#526e84;flex:1}
.clip button[data-action=add]{background:#eef0fa;border-color:#c4deed;color:#225b7b;flex:1;white-space:nowrap}
.tag-group{border:0;background:#f1f5f9;border-radius:10px;padding:9px;margin:8px 0 15px}
.tag-group h3{background:transparent;padding:4px 2px 12px;font-size:12px;color:#254963;letter-spacing:.2px}
.tag-group .badge{background:#fff;border-color:#d3e3ed;color:#426e88;min-width:25px;text-align:center;font-variant-numeric:tabular-nums}
.tag-group .clip:last-child{border:1px solid #dce6ee;margin-bottom:0}
#playlist>.clip{border-left:3px solid #8bbdd4}
#playlist [data-remove]{margin-left:auto;color:#9c5050;background:#fff8f8;border-color:#ead8d8}
#playlist [data-move]{color:#426985;background:#f5f6fb;min-width:28px}
#filter,#createdFilter,#saved{margin:3px 0 8px}
.layout>section:not(.player)>.row{gap:7px;margin:12px 0 18px}
#exportImported,#exportCreated{width:100%;font-size:11px;background:#f7fafc;color:#52738c;border-color:#d9e5ee}
#clips>.muted,#createdClips>.muted,#playlist>.muted{line-height:1.9;padding:30px 14px}

/* Cortes agrupados en filas compactas */
.tag-group{background:#eaf0f6;padding:10px}.tag-group h3{text-transform:uppercase;font-size:12px;justify-content:flex-start;gap:9px;padding:5px 2px 12px}.tag-group h3:before{content:'';width:9px;height:9px;border-radius:3px;background:#3987ad;flex-shrink:0}.section-play{width:100%;margin:0 0 12px;background:#1a24a0;color:white;border-color:#1a24a0;font-size:11px;min-height:38px}.section-play:hover{background:#1a2380;color:white}
.tag-group .compact-cut,#clips>.compact-cut{display:flex;align-items:center;gap:7px;padding:10px 8px;margin-bottom:7px;border-radius:8px;min-height:59px}.cut-number{font-size:10px;font-weight:700;color:#59778e;background:#edf3f8;border-radius:5px;min-width:22px;height:25px;display:grid;place-items:center;font-variant-numeric:tabular-nums}.compact-cut button.cut-play{flex:none;width:28px;height:28px;min-height:28px;padding:0;border-radius:50%;background:#24698f;color:#fff;border:0;font-size:10px}.compact-cut button.cut-play:before{content:none}.cut-info{min-width:0;flex:1}.compact-cut .cut-info strong{font-size:11px;white-space:nowrap;font-variant-numeric:tabular-nums;margin:0}.compact-cut .cut-info small{font-size:10px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;max-width:100%;margin-top:3px}.cut-actions{display:flex;gap:4px;flex-shrink:0}.compact-cut .cut-actions button{min-width:24px;min-height:26px;padding:3px 5px;font-size:13px;flex:none}.cut-actions button[data-action=add]{background:#e1f0f8}.compact-cut:has(>.row){flex-wrap:wrap}.compact-cut>.row{width:100%}@media(min-width:1251px){.compact-cut .cut-info strong{font-size:10px}.tag-group .compact-cut{gap:5px;padding:9px 6px}.cut-number{min-width:18px}.cut-actions{gap:3px}.compact-cut .cut-actions button{min-width:22px;padding:3px}}

[hidden]{display:none!important}.my-playlists-link{display:block;font-size:12px;color:#21658a;font-weight:650;text-decoration:none;margin:-6px 0 16px}#mis-playlists{margin-top:26px;scroll-margin-top:20px}#saved-playlists{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}.saved-playlist-card{border:1px solid #d7e3ed;border-radius:10px;padding:18px;background:#f9fbfd}.saved-playlist-card h3{font-size:15px;margin:0 0 9px;overflow-wrap:anywhere}.saved-playlist-card p{margin:0}.saved-playlist-card .row{margin:16px 0 0}.saved-playlist-card button:last-child{background:#1a2380;color:white;border-color:#1a2380}
