@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@600;700;800&display=swap');
/* Los iconos se enlazan localmente desde cada página para que su carga sea inmediata. */

:root { --ink:#101828; --muted:#667085; --line:#e4e7ec; --paper:#fff; --canvas:#f6f7f9; --coral:#f65b3a; --coral-dark:#d94426; --yellow:#ffd25a; --green:#087443; --blue:#175cd3; --radius:20px; --shadow:0 18px 55px rgba(16,24,40,.1); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; overflow-x:hidden; color:var(--ink); background:var(--canvas); font-family:'DM Sans',sans-serif; }
h1,h2,h3,h4,.display-font { font-family:'Manrope',sans-serif; letter-spacing:-.045em; }
a { color:inherit; text-decoration:none; }
.pm-button { display:inline-flex; align-items:center; justify-content:center; gap:.55rem; min-height:44px; padding:.72rem 1.15rem; border:1px solid transparent; border-radius:12px; color:#fff; background:var(--coral); font-weight:700; transition:.2s; }
.pm-button:hover { color:#fff; background:var(--coral-dark); transform:translateY(-1px); }
.pm-button.dark { background:var(--ink); }
.pm-button.dark:hover { background:#26334b; }
.pm-button.light { color:var(--ink); background:#fff; border-color:var(--line); }
.pm-button.light:hover { color:var(--ink); background:#f9fafb; }
.pm-button.small { min-height:36px; padding:.5rem .8rem; border-radius:10px; font-size:.86rem; }
.pm-button:disabled { opacity:.55; pointer-events:none; }
.pm-brand { display:flex; align-items:center; gap:.72rem; font-family:'Manrope',sans-serif; font-weight:800; letter-spacing:-.04em; }
.pm-mark { display:grid; width:40px; height:40px; place-items:center; overflow:hidden; border-radius:12px; color:transparent; background:#fff url('../img/logo-tv-manchego.png?v=3') center 42%/cover no-repeat; font-size:.82rem; box-shadow:0 2px 10px rgba(16,24,40,.18); }
.pm-mark.pm-logo-mark { background:#fff url('../img/logo-tv-manchego.png?v=3') center 42%/cover no-repeat; }
.pm-logo-mark img { width:100%; height:100%; object-fit:cover; object-position:center 42%; transform:none; }
.eyebrow { margin:0 0 .6rem; color:var(--coral); font-size:.72rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase; }
.muted { color:var(--muted); }
.status-pill { display:inline-flex; align-items:center; gap:.42rem; padding:.32rem .62rem; border-radius:99px; color:#344054; background:#f2f4f7; font-size:.77rem; font-weight:700; }
.status-pill::before { content:''; width:7px; height:7px; border-radius:50%; background:#98a2b3; }
.status-pill.active,.status-pill.paid,.status-pill.live,.status-pill.approved,.status-pill.scheduled { color:#05603a; background:#ecfdf3; }
.status-pill.active::before,.status-pill.paid::before,.status-pill.live::before,.status-pill.approved::before,.status-pill.scheduled::before { background:#12b76a; }
.status-pill.pending,.status-pill.trial,.status-pill.open,.status-pill.pending_contract { color:#854a0e; background:#fffaeb; }
.status-pill.pending::before,.status-pill.trial::before,.status-pill.open::before,.status-pill.pending_contract::before { background:#f79009; }
.status-pill.rejected,.status-pill.cancelled,.status-pill.disabled,.status-pill.past_due { color:#b42318; background:#fef3f2; }
.status-pill.rejected::before,.status-pill.cancelled::before,.status-pill.disabled::before,.status-pill.past_due::before { background:#f04438; }
.form-control,.form-select { min-height:46px; border-color:#d0d5dd; border-radius:11px; }
.form-control:focus,.form-select:focus { border-color:var(--coral); box-shadow:0 0 0 3px rgba(246,91,58,.14); }
.form-label { margin-bottom:.42rem; font-size:.84rem; font-weight:700; }
.input-error { margin-top:.38rem; color:#b42318; font-size:.78rem; font-weight:600; }
.form-control[aria-invalid="true"],.form-select[aria-invalid="true"] { border-color:#f04438; box-shadow:0 0 0 3px rgba(240,68,56,.12); }
.alert-box { padding:.82rem 1rem; border:1px solid #fecdca; border-radius:12px; color:#912018; background:#fef3f2; font-size:.9rem; }
.success-box { border-color:#abefc6; color:#05603a; background:#ecfdf3; }

/* Public */
.public-page { background:#fffaf6; }
.public-nav { position:sticky; z-index:50; top:0; border-bottom:1px solid rgba(16,24,40,.08); background:rgba(255,250,246,.9); backdrop-filter:blur(18px); }
.public-nav .inner { display:flex; align-items:center; justify-content:space-between; width:min(1180px,calc(100% - 40px)); height:74px; margin:auto; }
.public-links { display:flex; align-items:center; gap:1.5rem; color:#475467; font-size:.9rem; font-weight:600; }
.public-actions { display:flex; gap:.6rem; }
.hero { position:relative; overflow:hidden; padding:clamp(5rem,9vw,9rem) 0 6rem; }
.hero::before { content:''; position:absolute; inset:-20% auto auto 58%; width:48vw; aspect-ratio:1; border-radius:50%; background:radial-gradient(circle at 35% 35%,#ffdc79,#ff7a59 50%,#ef4a2a 72%); box-shadow:0 40px 100px rgba(246,91,58,.24); }
.hero::after { content:'TV'; position:absolute; top:12%; right:7%; color:rgba(255,255,255,.35); font:800 20vw/1 'Manrope'; letter-spacing:-.1em; }
.hero-inner { position:relative; z-index:2; display:grid; grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr); gap:6vw; align-items:center; width:min(1180px,calc(100% - 40px)); margin:auto; }
.hero h1 { max-width:10ch; margin:.5rem 0 1.4rem; font-size:clamp(3.2rem,7vw,7rem); line-height:.91; }
.hero-lead { max-width:610px; color:#475467; font-size:clamp(1.05rem,1.5vw,1.3rem); line-height:1.65; }
.hero-buttons { display:flex; flex-wrap:wrap; gap:.8rem; margin-top:2rem; }
.tv-mockup { position:relative; min-height:430px; padding:18px; border-radius:30px; background:#172033; box-shadow:0 35px 80px rgba(16,24,40,.27); transform:rotate(2deg); }
.tv-mockup .screen { display:flex; flex-direction:column; height:100%; min-height:394px; overflow:hidden; border-radius:17px; color:#fff; background:linear-gradient(125deg,#101828 40%,#f65b3a 40%); }
.mock-header { display:flex; justify-content:space-between; padding:22px; font-weight:700; }
.mock-content { display:grid; flex:1; place-items:end start; padding:30px; background:linear-gradient(0deg,rgba(0,0,0,.3),transparent); }
.mock-content h2 { max-width:9ch; margin:0; font-size:3rem; line-height:.95; }
.mock-footer { padding:12px 22px; color:var(--ink); background:var(--yellow); font-weight:800; }
.trust-strip { border-block:1px solid #eee5df; background:#fff; }
.trust-strip .inner { display:grid; grid-template-columns:repeat(4,1fr); width:min(1180px,calc(100% - 40px)); margin:auto; }
.trust-item { padding:1.5rem; border-right:1px solid #eee5df; text-align:center; }
.trust-item:last-child { border:0; }
.trust-item b { display:block; font:800 1.5rem 'Manrope'; }
.section { padding:6.5rem 0; }
.section-inner { width:min(1180px,calc(100% - 40px)); margin:auto; }
.section-head { display:flex; align-items:end; justify-content:space-between; gap:3rem; margin-bottom:2.5rem; }
.section-head h2 { max-width:14ch; margin:0; font-size:clamp(2.3rem,4.5vw,4.3rem); line-height:.98; }
.section-head p { max-width:510px; color:var(--muted); line-height:1.7; }
.feature-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.feature-card { min-height:260px; padding:2rem; border:1px solid #ece6e1; border-radius:24px; background:#fff; box-shadow:0 12px 35px rgba(16,24,40,.04); }
.feature-icon { display:grid; width:46px; height:46px; margin-bottom:3.2rem; place-items:center; border-radius:14px; color:#fff; background:var(--ink); }
.feature-card h3 { font-size:1.35rem; }
.feature-card p { color:var(--muted); line-height:1.65; }
.public-demo { color:#fff; background:var(--ink); }
.demo-grid { display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:center; }
.demo-map { position:relative; min-height:460px; border:1px solid #344054; border-radius:30px; background:radial-gradient(circle at 30% 20%,#344054,transparent 40%),linear-gradient(145deg,#1d2939,#101828); }
.demo-pin { position:absolute; display:grid; width:48px; height:48px; place-items:center; border:6px solid rgba(255,255,255,.15); border-radius:50%; color:#fff; background:var(--coral); box-shadow:0 0 0 18px rgba(246,91,58,.1); }
.demo-pin:nth-child(1){left:20%;top:24%}.demo-pin:nth-child(2){left:65%;top:38%}.demo-pin:nth-child(3){left:42%;top:70%}
.plans-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.plan-card { position:relative; display:flex; flex-direction:column; padding:2rem; border:1px solid #e4e7ec; border-radius:24px; background:#fff; }
.plan-card.featured { color:#fff; background:var(--ink); transform:translateY(-12px); }
.plan-card .price { margin:1rem 0; font:800 3.2rem 'Manrope'; letter-spacing:-.06em; }
.plan-card .price small { font:500 .9rem 'DM Sans'; letter-spacing:0; }
.plan-card ul { flex:1; padding:0; list-style:none; }
.plan-card li { padding:.55rem 0; color:inherit; }
.plan-card li::before { content:'✓'; margin-right:.6rem; color:var(--coral); font-weight:900; }
.public-footer { padding:3rem 0; color:#98a2b3; background:#0b1220; }
.public-footer .inner { display:flex; justify-content:space-between; width:min(1180px,calc(100% - 40px)); margin:auto; }

/* Authentication */
.auth-page { min-height:100vh; background:#fff; }
.auth-layout { display:grid; grid-template-columns:minmax(380px,.88fr) minmax(480px,1.12fr); min-height:100vh; }
.auth-visual { position:relative; display:flex; flex-direction:column; justify-content:space-between; overflow:hidden; padding:3rem; color:#fff; background:var(--ink); }
.auth-visual::before { content:''; position:absolute; width:520px; aspect-ratio:1; right:-180px; bottom:-150px; border-radius:50%; background:var(--coral); box-shadow:0 0 0 70px rgba(246,91,58,.12),0 0 0 140px rgba(246,91,58,.06); }
.auth-visual > * { position:relative; z-index:1; }
.auth-visual h1 { max-width:9ch; font-size:clamp(3rem,5.5vw,5.7rem); line-height:.93; }
.auth-visual p { max-width:460px; color:#d0d5dd; font-size:1.05rem; line-height:1.65; }
.auth-main { display:grid; place-items:center; padding:3rem; }
.auth-card { width:min(460px,100%); }
.auth-card h2 { margin:.2rem 0 .7rem; font-size:2.3rem; }
.auth-card .lead { margin-bottom:2rem; color:var(--muted); }
.auth-card .field { margin-bottom:1rem; }
.auth-separator { display:flex; align-items:center; gap:1rem; margin:1.4rem 0; color:#98a2b3; font-size:.8rem; }
.auth-separator::before,.auth-separator::after { content:''; flex:1; height:1px; background:var(--line); }
.admin-auth .auth-visual { background:#111827; }
.admin-auth .auth-visual::before { background:#f2b94b; box-shadow:0 0 0 70px rgba(242,185,75,.11),0 0 0 140px rgba(242,185,75,.05); }

/* Portal */
.portal { min-height:100vh; background:var(--canvas); }
.portal-shell { display:grid; grid-template-columns:260px minmax(0,1fr); min-height:100vh; }
.sidebar { position:sticky; top:0; display:flex; flex-direction:column; height:100vh; height:100dvh; padding:1.3rem; color:#d0d5dd; background:#101828; }
.sidebar .pm-brand { padding:.45rem .5rem 1.5rem; color:#fff; }
.portal-nav { display:grid; gap:.3rem; }
.portal-nav a { display:flex; align-items:center; gap:.8rem; padding:.75rem .85rem; border:1px solid transparent; border-radius:11px; color:#98a2b3; font-size:.9rem; font-weight:600; transition:background .18s,border-color .18s,color .18s,transform .18s; }
.portal-nav a:hover { color:#fff; border-color:#344054; background:#182437; transform:translateX(2px); }
.portal-nav a.active { color:#fff; border-color:rgba(246,91,58,.45); background:linear-gradient(90deg,rgba(246,91,58,.22),#1d2939); }
.nav-icon,.nav-symbol { display:inline-grid; flex:0 0 24px; width:24px; height:24px; place-items:center; border-radius:7px; color:#c9d1dc; background:rgba(255,255,255,.06); font-size:1rem; line-height:1; text-align:center; transition:.18s; }
.nav-icon.bi::before { line-height:1; }
.portal-nav a:hover .nav-icon,.portal-nav a:hover .nav-symbol,.portal-nav a.active .nav-icon,.portal-nav a.active .nav-symbol { color:#fff; background:var(--coral); box-shadow:0 5px 12px rgba(246,91,58,.24); }
.sidebar-account { margin-top:auto; padding:1rem; border:1px solid #344054; border-radius:14px; background:#1d2939; }
.sidebar-account strong,.sidebar-account small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sidebar-account small { margin-top:.25rem; color:#98a2b3; }
.sidebar-account button { width:100%; margin-top:.9rem; }
.logout-button { display:inline-flex; align-items:center; justify-content:center; gap:.5rem; }
.sidebar-backdrop { display:none; }
.portal.sidebar-collapsed .portal-shell { grid-template-columns:82px minmax(0,1fr); }
.portal.sidebar-collapsed .sidebar { align-items:center; padding-inline:.8rem; }
.portal.sidebar-collapsed .sidebar .pm-brand { padding-inline:0; }.portal.sidebar-collapsed .sidebar .pm-brand>span:not(.pm-mark),.portal.sidebar-collapsed .portal-nav .nav-label,.portal.sidebar-collapsed .sidebar-account>strong,.portal.sidebar-collapsed .sidebar-account>small,.portal.sidebar-collapsed .sidebar-account .button-label { display:none; }
.portal.sidebar-collapsed .portal-nav { width:100%; }.portal.sidebar-collapsed .portal-nav a { justify-content:center; padding-inline:.4rem; }.portal.sidebar-collapsed .nav-icon,.portal.sidebar-collapsed .nav-symbol { font-size:1.15rem; }
.portal.sidebar-collapsed .sidebar-account { margin-inline:auto; padding:.2rem; border-color:transparent; background:transparent; }.portal.sidebar-collapsed .sidebar-account .logout-button { width:42px; min-height:42px; margin:0; padding:0; border-color:#344054; color:#d0d5dd; background:#1d2939; }
.portal-main { min-width:0; }
.portal-topbar { display:flex; align-items:center; justify-content:space-between; height:76px; padding:0 2rem; border-bottom:1px solid var(--line); background:rgba(255,255,255,.92); }
.portal-topbar small { display:block; color:var(--muted); }
.topbar-right { display:flex; align-items:center; gap:.7rem; }
.menu-button { display:grid; width:40px; height:40px; place-items:center; border:1px solid var(--line); border-radius:10px; color:var(--ink); background:#fff; cursor:pointer; font-size:1.25rem; transition:.2s; }.menu-button:hover { border-color:#b9c0ca; background:#f9fafb; }.menu-button:focus-visible,.pm-icon-button:focus-visible { outline:3px solid rgba(246,91,58,.25); outline-offset:2px; }
.portal-content { padding:2rem; }
.portal-content [id] { scroll-margin-top:1.25rem; }
.page-heading { display:flex; align-items:end; justify-content:space-between; gap:1rem; margin-bottom:1.7rem; }
.page-heading h1 { margin:0; font-size:2rem; }
.page-heading p { margin:.3rem 0 0; color:var(--muted); }
.orientation-switch { display:flex; flex-wrap:wrap; gap:.55rem; margin-top:1rem; }
.orientation-switch .pm-button.active { color:#fff; border-color:var(--coral); background:var(--coral); }
.panel { border:1px solid var(--line); border-radius:18px; background:#fff; box-shadow:0 6px 24px rgba(16,24,40,.035); }
.panel-head { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1.2rem 1.35rem; border-bottom:1px solid var(--line); }
.panel-head h2,.panel-head h3 { margin:0; font-size:1.05rem; letter-spacing:-.02em; }
.panel-body { padding:1.35rem; }
.metric-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; margin-bottom:1rem; }
.metric { padding:1.25rem; border:1px solid var(--line); border-radius:16px; background:#fff; }
.metric small { color:var(--muted); }
.metric b { display:block; margin-top:.5rem; font:800 2rem 'Manrope'; letter-spacing:-.06em; }
.table-wrap { overflow:auto; }
.pm-table { width:100%; border-collapse:collapse; }
.pm-table th { padding:.8rem 1rem; color:#667085; background:#f9fafb; font-size:.72rem; letter-spacing:.08em; text-align:left; text-transform:uppercase; }
.pm-table td { padding:1rem; border-top:1px solid var(--line); font-size:.88rem; vertical-align:middle; }
.empty-state { padding:3rem; color:var(--muted); text-align:center; }
.portal-grid { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(300px,.6fr); gap:1rem; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.form-grid .full { grid-column:1/-1; }
.permission-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:.55rem; }
.check-card { display:flex; align-items:center; gap:.6rem; padding:.65rem .75rem; border:1px solid var(--line); border-radius:10px; font-size:.84rem; }
.copy-field { display:flex; gap:.4rem; }
.copy-field input { min-width:260px; }
.toast-stack { position:fixed; z-index:2000; right:20px; bottom:20px; display:grid; gap:.6rem; }
.pm-toast { max-width:380px; padding:.9rem 1rem; border-radius:12px; color:#fff; background:#101828; box-shadow:var(--shadow); animation:toastIn .25s ease; }
.pm-toast.error { background:#b42318; }
.pm-confirm-backdrop { position:fixed; z-index:3000; inset:0; display:grid; place-items:center; padding:1rem; background:rgba(16,24,40,.58); backdrop-filter:blur(3px); }
.pm-confirm { width:min(430px,100%); padding:1.5rem; border-radius:18px; color:var(--ink); background:#fff; box-shadow:var(--shadow); }
.pm-confirm h2 { margin:0; font-size:1.3rem; }.pm-confirm p { margin:1rem 0 1.4rem; color:var(--muted); line-height:1.5; }.pm-confirm>div { display:flex; justify-content:flex-end; flex-wrap:wrap; gap:.65rem; }
.scanner-backdrop { position:fixed; z-index:3000; inset:0; display:grid; place-items:center; padding:1rem; background:rgba(16,24,40,.58); backdrop-filter:blur(3px); }
.scanner-modal { width:min(520px,100%); padding:1.25rem; border-radius:18px; background:#fff; box-shadow:var(--shadow); }
.scanner-modal-head { display:flex; align-items:start; justify-content:space-between; gap:1rem; margin-bottom:1rem; }.scanner-modal-head .eyebrow { margin-bottom:.2rem; }.scanner-modal-head h2 { margin:0; font-size:1.25rem; }
.scanner-modal video,.scanner-modal #pairingScannerFallback { display:block; width:100%; max-height:58vh; aspect-ratio:4/3; overflow:hidden; border-radius:12px; background:#101828; }.scanner-modal #pairingScannerFallback video { width:100%!important; height:100%!important; max-height:none; object-fit:cover; }.scanner-modal>p { margin-top:1rem; line-height:1.5; }
.pm-icon-button { display:grid; flex:0 0 40px; width:40px; height:40px; place-items:center; border:1px solid var(--line); border-radius:10px; color:var(--ink); background:#fff; }
@keyframes toastIn { from{opacity:0;transform:translateY(10px)} }

/* Studio */
.studio-layout { display:grid; grid-template-columns:280px minmax(340px,.8fr) minmax(420px,1.2fr); gap:1rem; align-items:start; }
.studio-column { min-width:0; }
.slides-list { display:grid; gap:.65rem; padding:1rem; max-height:calc(100vh - 260px); overflow:auto; }
.slide-row { display:grid; grid-template-columns:64px 1fr 24px; gap:.7rem; align-items:center; padding:.65rem; border:1px solid var(--line); border-radius:12px; cursor:pointer; }
.slide-row.active { border-color:var(--coral); box-shadow:0 0 0 2px rgba(246,91,58,.12); }
.slide-thumb { display:grid; width:64px; height:45px; place-items:center; overflow:hidden; border-radius:8px; color:#fff; background:#1d2939; font-weight:800; }
.slide-thumb img,.slide-thumb video { width:100%; height:100%; object-fit:cover; }
.slide-row strong,.slide-row small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.slide-row small { color:var(--muted); font-size:.72rem; }
.slide-editor { padding:1.2rem; }
.source-tabs { display:grid; grid-template-columns:1fr 1fr; gap:.4rem; padding:.35rem; border-radius:11px; background:#f2f4f7; }
.source-tabs button { padding:.55rem; border:0; border-radius:8px; color:var(--muted); background:transparent; font-weight:700; }
.source-tabs button.active { color:var(--ink); background:#fff; box-shadow:0 2px 8px rgba(16,24,40,.08); }
.media-preview { display:grid; min-height:140px; place-items:center; overflow:hidden; margin:.8rem 0; border:1px dashed #d0d5dd; border-radius:14px; color:var(--muted); background:#f9fafb; }
.media-preview img,.media-preview video { width:100%; height:180px; object-fit:cover; }
.upload-progress { margin:.6rem 0; display:flex; align-items:center; gap:.6rem; }
.upload-progress-track { flex:1; height:8px; border-radius:6px; background:var(--line); overflow:hidden; }
.upload-progress-bar { height:100%; width:0%; background:var(--coral); border-radius:6px; transition:width .12s ease; }
.upload-progress-label { min-width:3.2em; text-align:right; font-size:.78rem; font-weight:700; color:var(--muted); }
.preview-frame { position:sticky; top:92px; overflow:hidden; border:10px solid #101828; border-radius:20px; background:#101828; box-shadow:var(--shadow); transition:width .25s ease,margin .25s ease; }
.preview-frame iframe { display:block; width:100%; aspect-ratio:16/9; border:0; border-radius:10px; background:#101828; transition:aspect-ratio .25s ease; }
.preview-frame.is-vertical { width:min(100%,360px); justify-self:center; }
.preview-frame.is-vertical iframe { aspect-ratio:9/16; }
.settings-tabs { display:flex; gap:.5rem; margin-bottom:1rem; overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:thin; }
.settings-tabs button { flex:none; padding:.6rem .9rem; border:1px solid var(--line); border-radius:10px; background:#fff; font-weight:700; white-space:nowrap; }
.settings-tabs button.active { color:#fff; border-color:var(--ink); background:var(--ink); }
/* Selector "Pantalla 1..5" de la Plantilla 08 (Galería multipanel, ver
   renderPanelScreenTabs() en assets/js/studio.js): cada botón es una de las
   pantallas multipanel que se guardan seguidas y se emiten en bucle. */
/* Margen horizontal de 1rem a juego con '.slides-list' -ver más abajo-, ya
   que '.panel' no lleva relleno propio y este bloque va directo entre
   '.panel-head' y la lista. */
.panel-screen-tabs { display:flex; flex-wrap:wrap; gap:.4rem; padding:.6rem; margin:.75rem 1rem .5rem; background:var(--canvas); border-radius:10px; }
.panel-screen-tabs button { flex:none; padding:.4rem .7rem; border:1px solid var(--line); border-radius:8px; background:#fff; font-weight:700; font-size:.8rem; white-space:nowrap; }
.panel-screen-tabs button.active { color:#fff; border-color:var(--coral); background:var(--coral); }
.panel-screen-tabs button:disabled { opacity:.45; cursor:not-allowed; }
/* Misma idea para el aviso de orden de los paneles justo debajo (ver
   '#slidesHint' en studio/index.html): sin esto quedaba pegado al borde. */
#slidesHint { padding:0 1rem; }
.settings-section { display:none; }
.settings-section.active { display:block; }
.template-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:.65rem; }
.template-option { position:relative; cursor:pointer; }
.template-option input { position:absolute; opacity:0; }
.template-swatch { display:block; padding:.85rem; border:2px solid transparent; border-radius:12px; background:#f2f4f7; font-size:.8rem; font-weight:700; }
.template-option input:checked + .template-swatch { border-color:var(--coral); background:#fff4f0; }
.palette-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:.7rem; }
.color-field { display:flex; align-items:center; gap:.55rem; padding:.45rem; border:1px solid var(--line); border-radius:10px; }
.color-field input { width:36px; height:36px; padding:0; border:0; }

/* Platform */
.platform-shell { grid-template-columns:240px minmax(0,1fr); }
.platform-sidebar { background:#111827; }
.review-card { padding:1rem; border:1px solid var(--line); border-radius:14px; }
.review-card + .review-card { margin-top:.7rem; }
.review-actions { display:flex; gap:.5rem; margin-top:.8rem; }

@media (max-width:1100px) { .studio-layout{grid-template-columns:260px 1fr}.studio-layout .preview-frame{grid-column:1/-1;position:static}.feature-grid,.plans-grid{grid-template-columns:repeat(2,1fr)}.metric-grid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:820px) { .public-links{display:none}.hero-inner,.demo-grid,.auth-layout{grid-template-columns:1fr}.hero::before{inset:45% -25% auto auto;width:100vw}.tv-mockup{margin-top:3rem}.trust-strip .inner{grid-template-columns:repeat(2,1fr)}.feature-grid,.plans-grid{grid-template-columns:1fr}.section-head{display:block}.auth-visual{display:none}.auth-main{min-height:100vh;padding:2rem}.portal.menu-open{overflow:hidden}.portal-shell,.platform-shell{grid-template-columns:1fr}.sidebar{position:fixed;z-index:100;inset:0 auto 0 0;width:min(82vw,300px);overscroll-behavior:contain;transform:translateX(-105%);transition:transform .25s ease}.portal.menu-open .sidebar{transform:none}.sidebar-backdrop{position:fixed;z-index:90;inset:0;width:100%;border:0;background:rgba(16,24,40,.48);cursor:pointer}.portal.menu-open .sidebar-backdrop{display:block}.menu-button{display:grid}.portal-topbar{padding:0 1rem}.portal-content{padding:1rem}.studio-layout,.portal-grid{grid-template-columns:1fr}.slides-list{max-height:none}.form-grid{grid-template-columns:1fr}.form-grid .full{grid-column:auto}.settings-tabs button{padding:.55rem .75rem;font-size:.85rem}.preview-frame{top:0}.preview-frame.is-vertical{width:min(70vw,300px)} }
@media (max-width:520px) { .public-nav .inner{width:calc(100% - 24px)}.public-actions .light{display:none}.hero-inner,.section-inner{width:calc(100% - 24px)}.hero h1{font-size:3rem}.trust-strip .inner{width:100%}.metric-grid{grid-template-columns:1fr}.permission-grid,.template-grid,.palette-grid{grid-template-columns:1fr}.page-heading{align-items:start;flex-direction:column}.ticker-item{flex-wrap:wrap}.ticker-item-tag{flex:1 1 100%}.ticker-item-message{flex:1 1 100%}.ticker-item [data-remove-ticker]{margin-left:auto}.copy-field{display:grid}.copy-field input{min-width:0}.public-footer .inner{display:grid;gap:1rem} }

/* TV Manchego public landing */
.landing-v2 {
    --ink:#111923;
    --muted:#667085;
    --line:#e7e9ed;
    --canvas:#f7f7f4;
    --coral:#e94f2d;
    --coral-dark:#c93d1e;
    --yellow:#f7cb54;
    color:var(--ink);
    background:#fbfaf7;
}
.landing-v2 .public-nav { background:rgba(251,250,247,.93); }
.landing-v2 .public-nav .inner { width:min(1280px,calc(100% - 48px)); height:78px; }
.landing-v2 .pm-mark { border-radius:11px; background:#fff url('../img/logo-tv-manchego.png?v=3') center 42%/cover no-repeat; }
.landing-v2 .connect-tv-button { color:#fff; background:var(--ink); }
.landing-v2 .connect-tv-button:hover { background:#26303c; }
.button-status,.live-dot { display:inline-block; width:7px; height:7px; border-radius:50%; background:#64d49d; box-shadow:0 0 0 4px rgba(100,212,157,.17); }
.live-dot { margin-right:.35rem; background:var(--coral); box-shadow:0 0 0 4px rgba(233,79,45,.13); }

.hero-v2 { min-height:720px; padding:clamp(5.5rem,8vw,8rem) 0 clamp(5rem,7vw,7rem); background:radial-gradient(circle at 0 20%,rgba(247,203,84,.14),transparent 28%),#fbfaf7; }
.hero-v2::before { inset:-34% -15% auto auto; width:70vw; max-width:980px; background:radial-gradient(circle at 35% 38%,#f9d97e,#f07a52 47%,#e94f2d 72%); opacity:.96; }
.hero-v2::after { top:7%; right:4%; color:rgba(255,255,255,.19); font-size:min(22vw,320px); }
.hero-v2 .hero-inner { grid-template-columns:minmax(0,1fr) minmax(450px,.92fr); width:min(1280px,calc(100% - 48px)); gap:5vw; }
.hero-v2 .hero-copy { padding-top:1rem; }
.hero-v2 h1 { max-width:9ch; margin:.6rem 0 1.5rem; font-size:clamp(3.8rem,7vw,7.2rem); line-height:.88; }
.hero-v2 .hero-lead { max-width:670px; font-size:clamp(1.05rem,1.45vw,1.27rem); }
.hero-proof { display:flex; flex-wrap:wrap; gap:1.4rem; margin-top:2.4rem; color:#667085; font-size:.78rem; }
.hero-proof span { display:flex; align-items:center; gap:.5rem; }
.hero-proof b { color:var(--ink); font-size:.68rem; letter-spacing:.08em; }
.tv-scene { position:relative; min-height:510px; }
.tv-orbit { position:absolute; border:1px solid rgba(255,255,255,.35); border-radius:50%; }
.orbit-one { inset:-5% -17% 8% 0; }
.orbit-two { inset:11% -7% 23% 15%; }
.tv-mockup-v2 { position:absolute; top:8%; right:0; width:min(640px,100%); min-height:390px; transform:perspective(1200px) rotateY(-4deg) rotateZ(1deg); box-shadow:0 40px 100px rgba(45,25,19,.28); }
.tv-mockup-v2 .screen { min-height:354px; background:#f5efe5; }
.tv-mockup-v2 .mock-header { align-items:center; padding:17px 20px; color:#fff; background:#172033; font-size:.76rem; }
.mock-brand { display:flex; align-items:center; gap:.7rem; }
.mock-brand i { display:grid; width:36px; height:36px; place-items:center; border-radius:8px; color:#fff; background:var(--coral); font-style:normal; font-weight:900; }
.mock-brand span { display:grid; line-height:1.15; }
.mock-brand small { color:#aeb7c5; font-size:.58rem; font-weight:500; text-transform:uppercase; letter-spacing:.08em; }
.mock-time { display:flex; gap:.9rem; align-items:center; color:#d0d5dd; }.mock-time b{color:#fff;font-size:1rem}
.mock-layout { display:grid; grid-template-columns:minmax(0,3fr) minmax(110px,1fr); flex:1; min-height:255px; }
.mock-video { position:relative; display:grid; place-items:center; align-content:center; gap:.5rem; overflow:hidden; color:#fff; background:radial-gradient(circle at 70% 30%,#394b62,transparent 24%),linear-gradient(135deg,#172033,#253851); }
.mock-video::before { content:''; position:absolute; width:170px; height:170px; left:-35px; bottom:-75px; border:28px solid rgba(233,79,45,.55); border-radius:50%; }
.play-symbol { position:relative; z-index:1; display:grid; width:52px; height:52px; place-items:center; padding-left:3px; border:1px solid rgba(255,255,255,.35); border-radius:50%; background:rgba(255,255,255,.12); }
.mock-video small { position:relative; z-index:1; font-size:.55rem; letter-spacing:.16em; }
.mock-poster { display:flex; flex-direction:column; justify-content:center; align-items:center; padding:1rem; color:var(--ink); background:var(--yellow); text-align:center; font:800 1.45rem/1.02 'Manrope'; }
.mock-poster b { margin-top:1rem; padding:.5rem .7rem; border-radius:8px; color:#fff; background:var(--coral); font-size:1rem; }
.tv-mockup-v2 .mock-footer { padding:10px 18px; color:#fff; background:var(--coral); font-size:.63rem; letter-spacing:.06em; text-align:center; }
.tv-stand { position:absolute; left:43%; bottom:-47px; width:17%; height:48px; border-radius:0 0 20px 20px; background:linear-gradient(90deg,#111827,#354054,#111827); }
.tv-stand::after { content:''; position:absolute; width:190%; height:12px; left:-45%; bottom:-5px; border-radius:50%; background:#111827; }
.instant-badge { position:absolute; z-index:4; right:-12px; bottom:16px; display:flex; align-items:center; gap:.65rem; padding:.75rem .9rem; border:1px solid rgba(255,255,255,.75); border-radius:14px; background:rgba(255,255,255,.94); box-shadow:0 15px 40px rgba(16,24,40,.16); }
.instant-badge>span { display:grid; width:30px; height:30px; place-items:center; border-radius:50%; color:#fff; background:#159455; }
.instant-badge b,.instant-badge small { display:block; }.instant-badge b{font-size:.78rem}.instant-badge small{color:#667085;font-size:.65rem}

.landing-v2 .trust-strip { border-color:#e8e4de; background:#fff; }
.landing-v2 .trust-strip .inner { width:min(1280px,calc(100% - 48px)); }
.landing-v2 .trust-item { padding:1.65rem; border-color:#ece8e2; }
.landing-v2 .trust-item b { font-size:1.35rem; }
.landing-v2 .trust-item span { color:#667085; font-size:.8rem; }
.landing-v2 .section { padding:clamp(5rem,8vw,8rem) 0; }
.landing-v2 .section-inner { width:min(1280px,calc(100% - 48px)); }
.landing-v2 .section-head h2 { max-width:16ch; }
.centered-head { display:grid; justify-items:center; text-align:center; }
.centered-head h2 { max-width:18ch!important; }
.centered-head p { margin-inline:auto; }

.business-section { background:#f5f3ee; }
.business-grid { display:grid; grid-template-columns:1fr 1fr .84fr; gap:1rem; }
.business-card { position:relative; display:flex; flex-direction:column; min-height:590px; overflow:hidden; padding:2.2rem; border:1px solid #e2ded6; border-radius:26px; background:#fff; box-shadow:0 16px 45px rgba(17,25,35,.05); }
.business-card::after { content:''; position:absolute; width:190px; height:190px; right:-100px; bottom:-100px; border:34px solid rgba(233,79,45,.07); border-radius:50%; }
.business-card .card-number { position:absolute; top:2rem; right:2rem; color:#c6c9ce; font:700 .75rem 'Manrope'; letter-spacing:.14em; }
.business-icon { display:grid; width:54px; height:54px; margin-bottom:3.8rem; place-items:center; border-radius:15px; color:#fff; background:var(--coral); }
.business-icon svg { width:25px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.business-card h3 { max-width:11ch; margin:.3rem 0 1rem; font-size:clamp(1.8rem,2.5vw,2.55rem); line-height:1; }
.business-card>p:not(.eyebrow) { color:#667085; line-height:1.65; }
.business-card ul { flex:1; margin:1rem 0 1.6rem; padding:0; list-style:none; }
.business-card li { position:relative; margin:.7rem 0; padding-left:1.35rem; color:#475467; font-size:.86rem; line-height:1.5; }
.business-card li::before { content:'✓'; position:absolute; left:0; color:var(--coral); font-weight:900; }
.business-card>a { position:relative; z-index:2; display:flex; justify-content:space-between; padding-top:1.1rem; border-top:1px solid #e7e9ed; font-weight:800; }
.dark-card { color:#fff; border-color:#172033; background:#172033; }
.dark-card::after { border-color:rgba(247,203,84,.12); }
.dark-card .card-number { color:#64748b; }.dark-card .business-icon{color:#172033;background:var(--yellow)}
.dark-card>p:not(.eyebrow),.dark-card li { color:#b8c0cc; }.dark-card li::before{color:var(--yellow)}.dark-card>a{border-color:#344054}
.collaborator-card { background:#f8e5d4; }
.collaborator-card .business-icon { color:var(--coral); background:#fff; }

.workflow-section { background:#fff; }
.workflow-grid { display:grid; grid-template-columns:repeat(4,1fr); border-block:1px solid #e7e9ed; }
.workflow-grid article { position:relative; padding:2.2rem 2rem 2.2rem 0; }
.workflow-grid article:not(:last-child)::after { content:'→'; position:absolute; top:2.4rem; right:1.6rem; color:#c8ccd2; }
.workflow-grid span { color:var(--coral); font:800 .72rem 'Manrope'; letter-spacing:.1em; }
.workflow-grid h3 { margin:2.7rem 0 .55rem; font-size:1.35rem; }
.workflow-grid p { margin:0; color:#667085; font-size:.87rem; line-height:1.6; }

.connect-section { color:#fff; background:#111923; }
.connect-grid { display:grid; grid-template-columns:1fr minmax(430px,.9fr); gap:6vw; align-items:center; }
.connect-copy h2 { max-width:12ch; font-size:clamp(2.8rem,5vw,5.2rem); line-height:.94; }
.connect-copy>p:not(.eyebrow) { max-width:580px; color:#aeb7c5; line-height:1.7; }
.connect-methods { display:grid; margin:2rem 0; }
.connect-methods article { display:grid; grid-template-columns:68px 1fr; gap:1rem; padding:1.15rem 0; border-top:1px solid #344054; }
.connect-methods article>span { display:grid; width:52px; height:34px; place-items:center; border:1px solid #475467; border-radius:8px; color:var(--yellow); font:800 .65rem 'Manrope'; letter-spacing:.08em; }
.connect-methods h3 { margin:0 0 .35rem; font-size:1rem; letter-spacing:-.02em; }
.connect-methods p { margin:0; color:#98a2b3; font-size:.83rem; line-height:1.5; }
.pairing-demo { overflow:hidden; border:1px solid #3a4658; border-radius:28px; color:var(--ink); background:#fff; box-shadow:0 35px 90px rgba(0,0,0,.28); transform:rotate(1deg); }
.pairing-top { display:flex; align-items:center; gap:.8rem; padding:1rem 1.2rem; border-bottom:1px solid #e7e9ed; font-weight:800; }
.pairing-top small { margin-left:auto; color:#98a2b3; font-size:.6rem; letter-spacing:.12em; }
.pairing-body { display:grid; grid-template-columns:190px 1fr; gap:1.7rem; align-items:center; padding:2.5rem; }
.fake-qr { position:relative; width:190px; aspect-ratio:1; border:12px solid #fff; outline:1px solid #e0e3e7; background:repeating-linear-gradient(45deg,#111923 0 5px,#fff 5px 10px),repeating-linear-gradient(-45deg,transparent 0 7px,#111923 7px 10px); background-blend-mode:multiply; }
.fake-qr span { position:absolute; width:42px; height:42px; border:9px solid #111923; background:#fff; }.fake-qr span:nth-child(1){left:8px;top:8px}.fake-qr span:nth-child(2){right:8px;top:8px}.fake-qr span:nth-child(3){left:8px;bottom:8px}
.fake-qr i { position:absolute; inset:43% auto auto 43%; width:30px; height:30px; background:var(--coral); }
.pairing-body p { margin:0 0 1.5rem; color:#667085; line-height:1.5; }.pairing-body b,.pairing-body strong,.pairing-body small{display:block}.pairing-body b{font-size:.73rem}.pairing-body strong{margin:.4rem 0;font:800 1.8rem 'Manrope';letter-spacing:.08em}.pairing-body small{color:#98a2b3;font-size:.7rem}
.pairing-footer { padding:.85rem 1.2rem; color:#667085; background:#f7f7f4; font-size:.76rem; text-align:center; }
.pulse { display:inline-block; width:7px; height:7px; margin-right:.35rem; border-radius:50%; background:#159455; box-shadow:0 0 0 4px rgba(21,148,85,.12); }

.templates-section { background:#f5f3ee; }
.template-showcase-grid { display:grid; grid-template-columns:1fr 1fr; gap:1.3rem; }
.template-preview-card { overflow:hidden; border:1px solid #e0ddd7; border-radius:25px; background:#fff; }
.template-screen { display:grid; grid-template-rows:42px 1fr 24px; aspect-ratio:16/9; margin:1rem; overflow:hidden; border:7px solid #172033; border-radius:14px; box-shadow:0 20px 45px rgba(17,25,35,.13); }
.template-screen header { display:flex; align-items:center; justify-content:space-between; padding:0 1rem; color:#fff; background:#172033; font-size:.55rem; font-weight:800; letter-spacing:.05em; }
.template-screen main { min-height:0; }
.template-one main { display:grid; grid-template-columns:3fr 1fr; }
.video-placeholder { display:grid; place-items:center; align-content:center; gap:.3rem; color:#fff; background:linear-gradient(135deg,#26364a,#111923); }.video-placeholder i{display:grid;width:44px;height:44px;place-items:center;padding-left:3px;border:1px solid #8792a2;border-radius:50%;font-style:normal}.video-placeholder small{font-size:.5rem;letter-spacing:.12em}
.poster-placeholder { display:grid; place-items:center; color:#172033; background:var(--yellow); font:800 1rem 'Manrope'; }
.template-screen footer { display:grid; place-items:center; color:#fff; background:var(--coral); font-size:.45rem; font-weight:800; letter-spacing:.08em; }
.template-two { grid-template-rows:42px 1fr; }.template-two main{display:grid}.full-poster{display:grid;place-items:center;align-content:center;color:#fff;background:radial-gradient(circle at 75% 25%,#ef785c,transparent 24%),linear-gradient(135deg,#e94f2d,#8c2d1c);font:800 1.5rem/1.1 'Manrope';text-align:center}.full-poster small{font-size:.55rem;letter-spacing:.15em}
.template-meta { padding:1.1rem 1.8rem 1.8rem; }.template-meta>span{color:var(--coral);font-size:.65rem;font-weight:800;letter-spacing:.14em}.template-meta h3{margin:.5rem 0;font-size:1.45rem}.template-meta p{margin:0;color:#667085;font-size:.86rem;line-height:1.6}

.advantages-section { background:#fff; }
.advantage-grid { display:grid; grid-template-columns:repeat(3,1fr); border:1px solid #e7e9ed; border-radius:25px; overflow:hidden; }
.advantage-grid article { min-height:220px; padding:2rem; border-right:1px solid #e7e9ed; border-bottom:1px solid #e7e9ed; }
.advantage-grid article:nth-child(3n){border-right:0}.advantage-grid article:nth-child(n+4){border-bottom:0}
.advantage-grid span { display:grid; width:38px; height:38px; place-items:center; margin-bottom:2.5rem; border-radius:10px; color:#fff; background:#172033; font-weight:800; }
.advantage-grid h3 { font-size:1.08rem; }.advantage-grid p{margin:0;color:#667085;font-size:.84rem;line-height:1.6}

.plans-section { background:#f5f3ee; }.plans-v2 .plan-card{min-height:570px}.plans-v2 .plan-card.featured{transform:none}.plans-v2 .plan-card h3{min-height:58px;font-size:1.35rem}.plans-v2 .plan-intro{min-height:52px;color:#667085;line-height:1.5}.plans-v2 .featured .plan-intro{color:#b8c0cc}.popular-tag{position:absolute;right:1.4rem;top:1.6rem;padding:.36rem .55rem;border-radius:99px;color:#172033;background:var(--yellow);font-size:.56rem;font-weight:900;letter-spacing:.08em}.network-note{max-width:900px;margin:2rem auto 0;padding:1rem 1.2rem;border:1px solid #dfdbd4;border-radius:14px;color:#667085;background:#fff;text-align:center;font-size:.83rem}

.faq-section { background:#fff; }.faq-grid{display:grid;grid-template-columns:.72fr 1.28fr;gap:7vw;align-items:start}.faq-grid>div:first-child{position:sticky;top:120px}.faq-grid h2{max-width:10ch;font-size:clamp(2.8rem,4.7vw,4.8rem);line-height:.94}.faq-grid>div:first-child>p:not(.eyebrow){color:#667085;line-height:1.7}.faq-list{border-top:1px solid #dfe2e6}.faq-list details{border-bottom:1px solid #dfe2e6}.faq-list summary{position:relative;padding:1.5rem 2.2rem 1.5rem 0;font-weight:800;cursor:pointer;list-style:none}.faq-list summary::after{content:'+';position:absolute;right:.3rem;top:1.35rem;color:var(--coral);font-size:1.5rem;font-weight:500}.faq-list details[open] summary::after{content:'−'}.faq-list p{max-width:760px;margin:0;padding:0 2rem 1.5rem 0;color:#667085;line-height:1.65}
.final-cta { padding:5rem 0; color:#fff; background:var(--coral); }.final-cta .section-inner{display:flex;align-items:center;justify-content:space-between;gap:3rem}.final-cta .eyebrow{color:#ffd9cd}.final-cta h2{max-width:17ch;margin:0;font-size:clamp(2.5rem,4vw,4.2rem);line-height:.96}.final-cta .pm-button{color:var(--ink);background:#fff}.final-cta div>div:last-child{display:grid;gap:.8rem;text-align:center}.final-cta small{color:#ffe5dc;font-size:.7rem}
.footer-v2 .inner { display:grid; grid-template-columns:1.2fr 1fr .8fr; gap:3rem; align-items:start; width:min(1280px,calc(100% - 48px)); }.footer-v2 .pm-brand{color:#fff}.footer-v2 p{max-width:350px;margin-top:1rem;line-height:1.6}.footer-links{display:grid;gap:.7rem;color:#d0d5dd;font-size:.85rem}.footer-location{display:grid;text-align:right}.footer-location span{color:#667085;font-size:.6rem;letter-spacing:.13em}.footer-location b{margin:.35rem 0 1.5rem;color:#fff}.footer-location small{color:#667085}

@media (max-width:1100px) {
    .hero-v2 .hero-inner{grid-template-columns:1fr 440px}.business-grid{grid-template-columns:1fr 1fr}.collaborator-card{grid-column:1/-1;min-height:430px}.connect-grid{grid-template-columns:1fr 430px}.advantage-grid{grid-template-columns:repeat(2,1fr)}.advantage-grid article:nth-child(3n){border-right:1px solid #e7e9ed}.advantage-grid article:nth-child(2n){border-right:0}.advantage-grid article:nth-child(n+4){border-bottom:1px solid #e7e9ed}.advantage-grid article:nth-child(n+5){border-bottom:0}
}
@media (max-width:900px) {
    .landing-v2 .public-links{display:none}.hero-v2{padding-top:5rem}.hero-v2 .hero-inner{grid-template-columns:1fr}.hero-v2::before{inset:auto -35% 6% auto;width:110vw}.tv-scene{min-height:500px;margin-top:1.5rem}.business-grid,.template-showcase-grid,.connect-grid,.faq-grid{grid-template-columns:1fr}.business-card{min-height:520px}.collaborator-card{grid-column:auto}.connect-grid{gap:4rem}.pairing-demo{width:min(600px,100%);margin:auto}.faq-grid>div:first-child{position:static}.workflow-grid{grid-template-columns:repeat(2,1fr)}.workflow-grid article:nth-child(2)::after{display:none}.final-cta .section-inner{align-items:flex-start;flex-direction:column}.footer-v2 .inner{grid-template-columns:1fr 1fr}.footer-location{text-align:left}
}
@media (max-width:600px) {
    .landing-v2 .public-nav .inner,.hero-v2 .hero-inner,.landing-v2 .section-inner,.landing-v2 .trust-strip .inner,.footer-v2 .inner{width:calc(100% - 28px)}.landing-v2 .public-actions .light{display:none}.landing-v2 .connect-tv-button{padding:.5rem .65rem;font-size:.72rem}.hero-v2 h1{font-size:3.55rem}.hero-proof{gap:.8rem}.tv-scene{min-height:390px}.tv-mockup-v2{min-height:300px;padding:10px}.tv-mockup-v2 .screen{min-height:280px}.mock-layout{min-height:195px}.tv-stand{bottom:-38px;height:38px}.instant-badge{bottom:-6px}.business-card{min-height:0;padding:1.5rem}.business-icon{margin-bottom:3rem}.business-card h3{font-size:2rem}.workflow-grid{grid-template-columns:1fr}.workflow-grid article:not(:last-child)::after{content:'↓';top:auto;right:auto;left:0;bottom:-.4rem}.pairing-body{grid-template-columns:1fr;padding:1.5rem}.fake-qr{width:170px;margin:auto}.pairing-body>div:last-child{text-align:center}.template-screen{margin:.6rem}.advantage-grid{grid-template-columns:1fr}.advantage-grid article,.advantage-grid article:nth-child(3n),.advantage-grid article:nth-child(2n),.advantage-grid article:nth-child(n+4),.advantage-grid article:nth-child(n+5){border-right:0;border-bottom:1px solid #e7e9ed}.advantage-grid article:last-child{border-bottom:0}.footer-v2 .inner{grid-template-columns:1fr}.footer-location{text-align:left}
}

/* Collaborator application */
.collab-page { min-height:100vh; color:var(--ink); background:#f5f3ee; }
.collab-page .public-nav .inner { width:min(1280px,calc(100% - 48px)); }
.collab-layout { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(520px,.95fr); min-height:calc(100vh - 78px); }
.collab-intro { position:relative; display:flex; flex-direction:column; justify-content:space-between; overflow:hidden; padding:clamp(3rem,6vw,7rem); color:#fff; background:#111923; }
.collab-intro::after { content:''; position:absolute; width:500px; height:500px; right:-260px; bottom:-260px; border:70px solid rgba(233,79,45,.3); border-radius:50%; }
.collab-intro>* { position:relative; z-index:1; }
.collab-intro h1 { max-width:10ch; margin:.7rem 0 1.5rem; font-size:clamp(3rem,5.5vw,6rem); line-height:.92; }
.collab-lead { max-width:650px; color:#b8c0cc; font-size:1.05rem; line-height:1.7; }
.collab-steps { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; margin-top:4rem; }
.collab-steps article { padding-top:1.2rem; border-top:1px solid #344054; }
.collab-steps span { color:#f7cb54; font-size:.66rem; font-weight:800; letter-spacing:.1em; }
.collab-steps h2 { margin:1.5rem 0 .4rem; font-size:1rem; letter-spacing:-.02em; }
.collab-steps p { margin:0; color:#98a2b3; font-size:.75rem; line-height:1.5; }
.collab-form-wrap { display:grid; place-items:center; padding:clamp(2rem,5vw,6rem); }
.collab-form { width:min(620px,100%); padding:clamp(1.5rem,3vw,2.5rem); border:1px solid #e2ded6; border-radius:24px; background:#fff; box-shadow:0 20px 60px rgba(17,25,35,.08); }
.collab-form h2 { margin:.3rem 0 .7rem; font-size:2rem; }
.collab-form .form-note { display:block; margin-top:1rem; color:#98a2b3; text-align:center; }
.success-box { padding:.82rem 1rem; border:1px solid #abefc6; border-radius:12px; color:#05603a; background:#ecfdf3; font-size:.9rem; }
@media (max-width:1000px){.collab-layout{grid-template-columns:1fr}.collab-steps{margin-top:3rem}.collab-form-wrap{padding-block:4rem}}
@media (max-width:620px){.collab-page .public-nav .inner{width:calc(100% - 24px)}.collab-intro{padding:3.5rem 1.4rem}.collab-intro h1{font-size:3.2rem}.collab-steps{grid-template-columns:1fr}.collab-form-wrap{padding:1rem}.collab-form{padding:1.3rem}.collab-page .public-actions .light{display:none}}

/* Connected TV devices */
.screen-limit { padding:.55rem .8rem; border:1px solid var(--line); border-radius:10px; color:var(--muted); background:#fff; font-size:.8rem; font-weight:700; }
.screens-layout { grid-template-columns:minmax(0,1.35fr) minmax(340px,.65fr); }
.device-list { display:grid; gap:.7rem; padding:1rem; }
.device-open-links { display:flex; flex-wrap:wrap; gap:.6rem; margin:0 0 1rem; }
.device-card { display:grid; grid-template-columns:58px minmax(0,1fr) auto auto; gap:1rem; align-items:center; padding:1rem; border:1px solid var(--line); border-radius:14px; transition:border-color .3s ease,box-shadow .3s ease; }
/* Al elegir una TV en el selector de la cabecera (PM.renderDeviceSwitcher()
   en devices.js), se desplaza hasta su tarjeta y se resalta un instante. */
.device-card-highlight { border-color:var(--coral); box-shadow:0 0 0 3px rgba(246,91,58,.25); }
.device-symbol { display:grid; width:58px; height:40px; place-items:center; border:4px solid #1d2939; border-radius:7px; background:#f65b3a; }
.device-symbol span { width:13px; height:8px; border:2px solid #fff; border-radius:2px; }
.device-card strong,.device-card small { display:block; }
.device-card small { margin-top:.25rem; color:var(--muted); font-size:.75rem; }
.pairing-panel { align-self:start; }
.pairing-code-input { height:62px; font:800 1.55rem 'Manrope'; letter-spacing:.18em; text-align:center; text-transform:uppercase; }
@media(max-width:900px){.screens-layout{grid-template-columns:1fr}.device-card{grid-template-columns:58px 1fr auto}.device-card>[data-revoke]{grid-column:2/-1;justify-self:start}}
@media(max-width:560px){.device-card{grid-template-columns:48px 1fr}.device-card .status-pill{grid-column:2}.device-card>[data-revoke]{grid-column:2}.device-symbol{width:48px;height:34px}}

.template-help,.template-rule { margin:1rem 0 0; padding:.8rem 1rem; border:1px solid var(--line); border-radius:10px; color:var(--muted); background:#f9fafb; font-size:.8rem; line-height:1.55; }
/* Insignia "Monetizable" en "Elegir plantilla" (Estudio > Plantilla e
   identidad): mismos colores que .status-pill.active/.paid (verde = ingreso),
   para que se lea de un vistazo como "esto te da dinero". */
.monetized-badge { display:inline-flex; align-items:center; gap:.32rem; margin-bottom:.6rem; padding:.22rem .55rem; border-radius:99px; font-size:.68rem; font-weight:700; color:#05603a; background:#ecfdf3; }
.monetized-badge i { font-size:.72rem; }
.template-swatch b { display:block; margin-bottom:.8rem; }
/* Miniatura fiel: en vez de un icono decorativo, cada tarjeta incrusta la
   página real (TvdA7H/TvdA7V en modo ?preview=1) escalada a tamaño de
   miniatura con transform:scale(), así se ve exactamente como en la TV real
   y queda siempre al día si se cambia el CSS de una plantilla. Ver
   initTemplateThumbs()/scaleTemplateThumb() en studio.js. */
.template-thumb-frame { display:block; position:relative; width:100%; aspect-ratio:16/9; overflow:hidden; border:4px solid #1d2939; border-radius:6px; background:#101828; }
.template-thumb-frame.is-vertical { aspect-ratio:9/16; max-width:150px; margin:0 auto; }
.template-thumb-frame iframe.template-thumb { position:absolute; top:0; left:0; border:0; transform-origin:0 0; pointer-events:none; background:#101828; }
.template-card { display:flex; flex-direction:column; gap:.55rem; }
.template-status { display:flex; justify-content:center; align-items:center; min-height:1.7rem; }
.template-status .pm-button.small { padding:.32rem .75rem; font-size:.74rem; }
.template-status-text { font-size:.74rem; color:var(--muted); }
.ticker-items { display:flex; flex-direction:column; gap:.5rem; margin-bottom:.6rem; }
.ticker-item { display:flex; gap:.5rem; align-items:center; }
.ticker-item-tag { flex:0 0 150px; min-width:0; }
.ticker-item-message { flex:1 1 auto; min-width:0; }
.ticker-item [data-remove-ticker] { flex:0 0 auto; }

.campaign-estimate { display:grid; padding:1rem; border:1px solid #e4e7ec; border-radius:12px; background:#f9fafb; }
.campaign-estimate span { color:#667085; font-size:.62rem; font-weight:800; letter-spacing:.12em; }
.campaign-estimate strong { margin:.25rem 0; font:800 1.7rem 'Manrope'; }
.campaign-estimate small { color:#98a2b3; }
.monetization-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(330px,1fr));gap:1rem}.monetization-card{padding:1.25rem;border:1px solid var(--line);border-radius:16px;background:#f9fafb}.monetization-card h3{margin:.2rem 0;font-size:1.15rem}.monetization-card p{margin:0;color:var(--muted);font-size:.85rem}.commission-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.75rem 0;border-top:1px solid var(--line)}.commission-row small{display:block;color:var(--muted)}
.monetization-summary{list-style:none;margin:.6rem 0 0;padding:0;display:grid;gap:.3rem;font-size:.82rem;color:var(--muted)}
.pm-wizard-backdrop{position:fixed;z-index:3000;inset:0;display:grid;place-items:center;padding:1rem;background:rgba(16,24,40,.58);backdrop-filter:blur(3px)}
.pm-wizard{width:min(560px,100%);max-height:90vh;display:flex;flex-direction:column;border-radius:18px;color:var(--ink);background:#fff;box-shadow:var(--shadow)}
.pm-wizard-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;padding:1.4rem 1.5rem 0}
.pm-wizard-head h2{margin:.1rem 0 0;font-size:1.2rem}
.pm-wizard-body{padding:1rem 1.5rem;overflow-y:auto}
.pm-wizard-body .wizard-step p{line-height:1.55}
.pm-wizard-foot{display:flex;align-items:center;justify-content:space-between;gap:.65rem;padding:1rem 1.5rem 1.4rem}

.queue-public{display:grid;min-height:100vh;place-items:center;padding:1rem;background:radial-gradient(circle at 90% 10%,#f7cb54,transparent 28%),#f5f1e9}.queue-public-card{width:min(520px,100%);padding:2rem;border:1px solid var(--line);border-radius:24px;background:#fff;box-shadow:var(--shadow)}.queue-public-card h1{margin:.4rem 0;font:800 clamp(2rem,8vw,4rem)/.95 'Manrope'}.queue-now{display:grid;justify-items:center;margin-top:2rem;padding:1.5rem;border-radius:18px;color:#fff;background:var(--ink)}.queue-now small,.my-ticket small{color:var(--yellow);font-weight:900;letter-spacing:.12em}.queue-now strong,.my-ticket strong{font:800 4rem 'Manrope'}.my-ticket{display:grid;justify-items:center;margin-top:1rem;padding:1.2rem;border:2px solid var(--coral);border-radius:18px}.my-ticket.called{color:#fff;background:var(--coral)}.queue-manage-grid{display:grid;grid-template-columns:minmax(280px,.55fr) minmax(0,1.45fr);gap:1rem}.queue-control .panel-body{display:grid;justify-items:center;padding:3rem;text-align:center}.queue-control strong{font:800 clamp(4rem,10vw,8rem) 'Manrope'}
.guest-campaign-page{min-height:100vh;background:#f5f1e9}.guest-campaign-layout{display:grid;grid-template-columns:minmax(280px,.65fr) minmax(520px,1.35fr);gap:clamp(2rem,6vw,7rem);align-items:start;width:min(1320px,calc(100% - 2rem));margin:auto;padding:5rem 0}.guest-campaign-layout>section:first-child{position:sticky;top:5rem}.guest-campaign-layout h1{max-width:10ch;margin:.6rem 0;font:800 clamp(3rem,6vw,6rem)/.92 'Manrope';letter-spacing:-.06em}.guest-steps{display:grid;gap:1rem;margin-top:2rem;padding:0;list-style:none}.guest-steps li{display:flex;align-items:center;gap:.8rem}.guest-steps b{display:grid;width:34px;aspect-ratio:1;place-items:center;border-radius:50%;background:var(--yellow)}
@media(max-width:900px){.guest-campaign-layout{grid-template-columns:1fr}.guest-campaign-layout>section:first-child{position:static}.queue-manage-grid{grid-template-columns:1fr}}

/* Biblioteca (Estudio TV): todo lo subido por la empresa + índice de almacenamiento del plan */
.storage-bar-track { height:10px; border-radius:8px; background:var(--line); overflow:hidden; }
.storage-bar-fill { height:100%; width:0%; background:var(--coral); border-radius:8px; transition:width .2s ease; }
.storage-bar-fill.is-full { background:#d92d20; }
.library-grid { display:grid; gap:.7rem; }
.library-card { display:grid; grid-template-columns:74px minmax(0,1fr) auto; gap:1rem; align-items:center; padding:.85rem 1rem; border:1px solid var(--line); border-radius:14px; }
.library-thumb { display:flex; align-items:center; justify-content:center; width:74px; height:52px; border-radius:8px; overflow:hidden; background:#101828; flex:0 0 auto; }
.library-thumb img,.library-thumb video { width:100%; height:100%; object-fit:cover; }
.library-thumb i { color:#98a2b3; font-size:1.4rem; }
.library-card strong,.library-card small { display:block; }
.library-card small { margin-top:.2rem; color:var(--muted); font-size:.75rem; }
.library-tags { display:flex; flex-wrap:wrap; gap:.35rem; margin-top:.4rem; }
.library-tag { display:inline-flex; padding:.15rem .55rem; border-radius:999px; background:#fef3f2; color:#b42318; font-size:.68rem; font-weight:700; }
@media(max-width:700px){ .library-card{grid-template-columns:56px 1fr} .library-card>[data-delete-media]{grid-column:2;justify-self:start} }
.library-picker-modal { width:min(640px,100%); }
.library-picker-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(130px,1fr)); gap:.75rem; max-height:60vh; overflow-y:auto; padding-right:.2rem; }
.library-picker-card { display:flex; flex-direction:column; gap:.4rem; padding:.55rem; border:1px solid var(--line); border-radius:12px; background:none; cursor:pointer; text-align:left; font:inherit; color:inherit; }
.library-picker-card:hover,.library-picker-card:focus-visible { border-color:var(--coral); outline:none; }
.library-picker-thumb { width:100%; aspect-ratio:16/10; border-radius:8px; overflow:hidden; background:#101828; display:flex; align-items:center; justify-content:center; }
.library-picker-thumb img,.library-picker-thumb video { width:100%; height:100%; object-fit:cover; }
.library-picker-card strong { display:block; font-size:.78rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.library-picker-card small { display:block; color:var(--muted); font-size:.68rem; }
.library-picker-empty { grid-column:1/-1; }
.device-card > details.device-schedule { grid-column:1/-1; margin-top:.5rem; padding-top:.75rem; border-top:1px dashed var(--line); }
.device-card > details.device-schedule summary { cursor:pointer; font-size:.82rem; }
.device-card > details.device-schedule .form-control { max-width:150px; }
.schedule-days { display:flex; flex-direction:column; gap:.4rem; }
.schedule-day-row { display:grid; grid-template-columns:minmax(110px,1fr) auto auto; gap:.5rem; align-items:center; }
.schedule-day-row .schedule-day-label { padding:.4rem .6rem; margin:0; }
.schedule-day-row input[type="time"] { max-width:120px; }
@media(max-width:480px){.schedule-day-row{grid-template-columns:1fr;}}

/* Menú de cuenta (avatar con inicial) en el topbar: perfil, historial de
   conexión y cambio de contraseña. Sustituye a la antigua página de
   "Equipo", ya innecesaria porque cada empresa tiene un único usuario. */
.topbar-right { flex-wrap:wrap; justify-content:flex-end; }
.account-menu { position:relative; margin-left:.4rem; }
.account-avatar { display:flex; align-items:center; gap:.4rem; height:42px; padding:.2rem .55rem .2rem .2rem; border:1px solid transparent; border-radius:999px; background:none; color:var(--ink); cursor:pointer; transition:background .18s ease,border-color .18s ease; }
.account-avatar:hover { background:var(--canvas); border-color:var(--line); }
.account-avatar:focus-visible { outline:3px solid rgba(246,91,58,.25); outline-offset:2px; }
.account-avatar .avatar-initial { width:34px; height:34px; border-radius:50%; background:linear-gradient(160deg,var(--coral),var(--coral-dark)); color:#fff; box-shadow:0 2px 6px rgba(217,68,38,.35); }
.account-caret { font-size:.7rem; color:var(--muted); transition:transform .2s ease; }
.account-menu.open .account-caret { transform:rotate(180deg); }
.account-menu.open .account-avatar { background:var(--canvas); border-color:var(--line); }
.avatar-initial { display:flex; align-items:center; justify-content:center; flex:none; font-weight:700; font-size:.92rem; line-height:1; }
.avatar-initial.lg { width:46px; height:46px; min-width:46px; border-radius:50%; background:linear-gradient(160deg,var(--coral),var(--coral-dark)); color:#fff; font-size:1.2rem; box-shadow:0 2px 6px rgba(217,68,38,.35); }
.account-dropdown { position:absolute; right:0; top:calc(100% + 10px); z-index:1200; width:290px; padding:.55rem; border:1px solid var(--line); border-radius:16px; background:var(--paper); box-shadow:var(--shadow); animation:accountDropdownIn .16s ease; }
.account-dropdown[hidden] { display:none; }
@keyframes accountDropdownIn { from { opacity:0; transform:translateY(-6px); } to { opacity:1; transform:translateY(0); } }
.account-dropdown-head { display:flex; align-items:center; gap:.7rem; padding:.4rem .5rem 1rem; margin-bottom:.4rem; border-bottom:1px solid var(--line); }
.account-dropdown-head-static { padding-left:0; padding-right:0; }
/* Sin min-width:0 aquí, este <div> (hijo flex de .account-dropdown-head) no
   se encoge por debajo del ancho de su contenido: el text-overflow:ellipsis
   de abajo nunca llegaba a activarse y un correo largo desbordaba el
   desplegable en vez de cortarse con "…". */
.account-dropdown-head-info { min-width:0; flex:1 1 auto; overflow:hidden; }
.account-dropdown-head strong,.account-dropdown-head small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.account-dropdown-head strong { font-size:.95rem; }
.account-dropdown-head small { color:var(--muted); }
.account-item { display:flex; align-items:center; gap:.65rem; width:100%; padding:.62rem .6rem; border:none; border-radius:10px; background:none; text-align:left; font:inherit; font-size:.88rem; color:var(--ink); cursor:pointer; transition:background .15s ease; }
.account-item i { flex:none; width:1.1rem; text-align:center; color:var(--muted); font-size:.95rem; }
/* Mismo motivo que .account-dropdown-head-info: un nombre de TV largo (en
   el selector de pantalla de Pantallas/Estudio) se corta con "…" en vez de
   desbordar la tarjeta del menú. */
.account-item-label { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.account-item:hover,.account-item:focus-visible { background:var(--canvas); outline:none; }
.account-item.danger { color:#b42318; }
.account-item.danger i { color:#b42318; }
.account-item.active { background:var(--canvas); font-weight:700; }
.account-dropdown hr { margin:.4rem 0; border:none; border-top:1px solid var(--line); }
/* Selector de TV (cabecera de Pantallas/Estudio, PM.renderDeviceSwitcher()
   en core.js): mismo componente visual que el menú de cuenta (insignia +
   desplegable), pero con un color distinto al coral de la cuenta para no
   confundirlos de un vistazo. */
.device-menu .avatar-initial { background:linear-gradient(160deg,#3b5366,#1c2b38); box-shadow:0 2px 6px rgba(28,43,56,.35); }
.pm-modal-backdrop { position:fixed; z-index:3000; inset:0; display:grid; place-items:center; padding:1rem; background:rgba(16,24,40,.58); backdrop-filter:blur(3px); }
.pm-modal { width:min(460px,100%); max-height:90vh; overflow-y:auto; padding:1.5rem; border-radius:18px; color:var(--ink); background:#fff; box-shadow:var(--shadow); animation:accountDropdownIn .18s ease; }
.pm-modal.wide { width:min(680px,100%); }
.pm-modal-head { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; margin-bottom:1rem; }
.pm-modal-head h2 { margin:0; font-size:1.3rem; }
.profile-fields { display:grid; gap:.65rem; margin:1rem 0; padding:1rem; border-radius:12px; background:var(--canvas); }
.profile-fields > div { display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.profile-fields dt { color:var(--muted); font-size:.82rem; }
.profile-fields dd { margin:0; font-weight:700; }
@media(max-width:560px){ .account-dropdown{ width:min(300px,calc(100vw - 2rem)); } .account-avatar .avatar-initial,.avatar-initial{ width:30px; height:30px; font-size:.85rem; } .account-avatar{ height:38px; } }