:root{--navy:#071b35;--violet:#6d5dfb;--cyan:#15c4d8;--ink:#111827;--muted:#697386;--line:#e4e8f0;--canvas:#f7f8fc}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--canvas);color:var(--ink)}body,button,input,select,textarea{font-family:Manrope,Inter,ui-sans-serif,system-ui,sans-serif}a{text-decoration:none}.app-shell{min-height:100vh;display:flex}.sidebar{position:fixed;inset:0 auto 0 0;width:260px;background:linear-gradient(160deg,#071b35,#06172d 72%,#09213f);color:#dce6f5;padding:27px 20px 20px;display:flex;flex-direction:column;z-index:10}.brand{display:flex;align-items:center;gap:13px;padding:0 10px 30px;color:white;font-size:20px}.brand-mark{width:43px;height:38px;position:relative}.brand-mark i{position:absolute;width:18px;height:38px;border-radius:10px;transform:rotate(-39deg);background:linear-gradient(#20c9ef,var(--violet));left:7px}.brand-mark i:last-child{transform:rotate(39deg);left:20px}.portal-switch{display:grid;gap:4px;padding:12px 14px;margin:-10px 0 18px;border:1px solid #80a6e02e;border-radius:11px;background:#3c609a2b;color:#fff}.portal-switch span{font-size:10px;color:#8fa5c5;text-transform:uppercase}.portal-switch b{font-size:12px}.sidebar nav{display:grid;gap:5px}.sidebar nav a{display:flex;align-items:center;gap:15px;min-height:48px;padding:0 17px;border-radius:12px;color:#bfcbe0;font-size:15px}.sidebar nav a:hover{color:#fff;background:#142f57}.sidebar nav a span{flex:1}.side-bottom{margin-top:auto}.side-bottom form button{width:100%;padding:13px;background:transparent;border:0;border-bottom:1px solid #ffffff1a;color:#bfcbe0;text-align:left}.profile{display:flex;align-items:center;gap:10px;padding:14px 4px}.avatar{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:linear-gradient(145deg,#7367ff,#16c6da);color:#fff;font-size:12px;font-style:normal}.profile span{display:grid}.profile b{font-size:12px;color:#fff}.profile small{font-size:10px;color:#8ea0ba}.workspace{min-height:100vh;width:calc(100% - 260px);margin-left:260px}.topbar{height:82px;background:#fffffff0;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 34px;position:sticky;top:0;z-index:5}.search{display:flex;align-items:center;width:min(470px,48vw);height:48px;background:#fff;border:1px solid #d9dee8;border-radius:10px;padding:0 14px;color:#7d889b}.search input{width:100%;border:0;outline:0;padding:12px;background:transparent}.top-actions{display:flex;align-items:center;gap:18px}.content{max-width:1450px;margin:auto;padding:34px}.notice{padding:13px 16px;margin-bottom:20px;border:1px solid #9ee3d9;background:#eafffb;border-radius:12px}.notice.error{border-color:#fecaca;background:#fff1f2}.welcome{display:flex;align-items:center;justify-content:space-between;gap:30px;margin-bottom:28px}.welcome h1{font-size:29px;margin:0 0 7px}.welcome p,.catalog-head p{color:var(--muted);font-size:14px;margin:0}.primary,.secondary{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 18px;border:0;border-radius:10px;font-weight:700;cursor:pointer}.primary{color:#fff;background:var(--violet);box-shadow:0 8px 20px #6d5dfb40}.secondary{color:var(--ink);background:#eef0f5}.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:36px}.metrics article{min-height:148px;background:#fff;border:1px solid var(--line);border-radius:15px;display:flex;align-items:center;padding:22px;box-shadow:0 7px 22px #0f172e0e}.metric-icon{width:64px;height:64px;border-radius:15px;display:grid;place-items:center;font-size:31px;margin-right:18px;font-style:normal}.metric-icon.violet{color:#624bf4;background:#f0edff}.metric-icon.cyan{color:#00a7cb;background:#e3f9fd}.metric-icon.green-soft{color:#11a553;background:#e5f8eb}.metrics article>div{display:grid;gap:4px}.metrics span{color:#606b7c;font-size:13px}.metrics strong{font-size:27px}.metrics small{font-size:11px}.catalog-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:18px}.catalog-head h2{font-size:21px;margin:0 0 5px}.catalog-head select{min-width:160px;height:44px;padding:0 14px;background:#fff;border:1px solid #d9dee8;border-radius:9px}.widget-grid,.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.widget-card{min-height:178px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:22px;display:grid;grid-template-columns:70px 1fr 39px;gap:17px;box-shadow:0 4px 16px #0f172a09;transition:.2s}.widget-card:hover{transform:translateY(-4px);border-color:#c8c0ff;box-shadow:0 12px 28px #2a1f751a}.widget-icon{width:64px;height:64px;display:grid;place-items:center;border-radius:16px;color:#fff;font-size:31px}.widget-icon.red{background:linear-gradient(145deg,#ff2536,#e70013)}.widget-icon.pink{background:linear-gradient(145deg,#8b28d8,#f84b7e 65%,#ffb340)}.widget-icon.blue{background:linear-gradient(145deg,#1678ff,#0754dd)}.widget-icon.map{background:linear-gradient(145deg,#4285f4,#34a853)}.widget-icon.green{background:linear-gradient(145deg,#31d967,#0dab45)}.widget-icon.orange{background:linear-gradient(145deg,#ff8b21,#f55208)}.widget-icon.violet{background:linear-gradient(145deg,#8f6cff,#5535e9)}.widget-copy h3{font-size:15px;margin:2px 0 8px}.widget-copy p{color:var(--muted);font-size:12px;line-height:1.6;min-height:58px;margin:0 0 12px}.widget-copy>div{display:flex;gap:8px}.category,.installed,.pill{padding:6px 10px;border-radius:7px;font-size:10px}.category{color:#6d7480;background:#f1f3f7}.installed{color:#12834b;background:#e8f8ef}.widget-card>a{align-self:end;width:38px;height:38px;border-radius:50%;border:1px solid #d7dce6;display:grid;place-items:center;color:#111}.card,.empty{padding:22px;border:1px solid var(--line);border-radius:15px;background:#fff}.section-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}label{display:grid;gap:7px;margin:14px 0;font-size:12px;font-weight:700}input,select,textarea{width:100%;padding:11px 12px;border:1px solid #d9dee8;border-radius:9px;background:#fff}.check{display:flex;align-items:center}.check input{width:auto}.auth-page{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at 25% 20%,#dcd6ff,transparent 35%),#f6f7fb}.auth-card{width:min(420px,calc(100% - 30px));padding:38px;background:#fff;border:1px solid var(--line);border-radius:24px;box-shadow:0 24px 80px #27304a18}.editor{display:grid;grid-template-columns:390px minmax(0,1fr);gap:0;background:#fff;border-radius:18px;overflow:hidden;min-height:680px}.editor-panel{padding:22px 25px;background:#202326;color:#e7e9ed;overflow:auto}.editor-panel input,.editor-panel select,.editor-panel textarea{background:#303438;border-color:#454a50;color:#fff}.preview{padding:28px;background:#f4f5f8}.preview>div[data-widget-id]{background:#fff;min-height:420px;padding:25px}.install{margin-top:20px;padding:22px;background:#fff;border-radius:15px}.install pre{overflow:auto;padding:15px;background:#10131d;color:#d7dbea;border-radius:10px}@media(max-width:1000px){.widget-grid,.grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:760px){.sidebar{position:static;width:100%}.workspace{width:100%;margin:0}.app-shell{display:block}.content{padding:20px}.metrics,.widget-grid,.grid,.editor{grid-template-columns:1fr}.topbar{padding:0 20px}}
.yt-editor{background:#fff;border-radius:18px;overflow:hidden}.yt-editor-head{height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 22px;border-bottom:1px solid var(--line)}.yt-editor-head>div{display:flex;gap:10px;align-items:center}.yt-title i{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:#ff1744;color:#fff;font-style:normal}.yt-builder{display:grid;grid-template-columns:58px 340px 1fr;min-height:720px}.yt-tabs{background:#202326;display:flex;flex-direction:column}.yt-tabs button{height:74px;background:transparent;color:#98a0aa;border:0;font-size:18px}.yt-tabs button span{display:block;font-size:9px;margin-top:7px}.yt-tabs button.active{background:#292d31;color:#fff;border-left:3px solid var(--violet)}.yt-settings{padding:22px 20px;background:#24272a;color:#e8eaed;overflow:auto;max-height:720px}.yt-settings h2{font-size:20px}.yt-settings p,.managed-api span{color:#9da4ad;font-size:11px;line-height:1.6}.yt-settings input,.yt-settings select,.yt-settings textarea{background:#303438;border-color:#494e54;color:#fff}.source-box{padding:13px;border:1px solid #494e54;border-radius:11px;background:#2d3033;margin-bottom:12px}.source-box b{font-size:11px}.add-source{width:100%;padding:12px;border:0;border-radius:9px;background:#303438;color:#4db3ff}.editor-group{border-top:1px solid #42464b;margin-top:24px;padding-top:17px}.toggle{display:flex;align-items:center;gap:8px}.toggle input{width:auto}.managed-api{display:grid;gap:5px;padding:14px;border:1px solid #4f4880;border-radius:10px;background:#302d45}.builder-preview{padding:54px 38px 38px;background:#f3f4f7;position:relative}.device-switch{position:absolute;right:22px;top:16px;padding:10px 14px;background:#fff;border:1px solid #dfe3eb;border-radius:9px}.preview-canvas{max-width:1100px;min-height:540px;margin:auto;padding:26px;background:#fff;box-shadow:0 12px 35px #1d29391a}.install{margin-top:18px}@media(max-width:900px){.yt-builder{grid-template-columns:52px 1fr}.builder-preview{grid-column:1/-1;min-height:500px}.yt-settings{max-height:none}}

/* WidgetDO 3.8.14 — responsive application shell */
.mobile-top-start,.mobile-nav-toggle,.mobile-brand,.sidebar-close,.mobile-nav-backdrop{display:none}
@media(max-width:860px){
 html,body{overflow-x:hidden}
 body.mobile-nav-open{overflow:hidden}
 .app-shell{display:block;min-height:100dvh}
 .sidebar{position:fixed;inset:0 auto 0 0;width:min(86vw,320px);padding:22px 16px 18px;z-index:80;transform:translateX(-105%);transition:transform .24s ease;box-shadow:18px 0 55px #06172d55}
 body.mobile-nav-open .sidebar{transform:translateX(0)}
 .sidebar-close{display:grid;place-items:center;position:absolute;right:12px;top:12px;width:36px;height:36px;border:1px solid #ffffff20;border-radius:11px;background:#ffffff0d;color:#fff;font-size:25px;line-height:1;cursor:pointer}
 .mobile-nav-backdrop{display:block;position:fixed;inset:0;z-index:70;background:#08111f99;backdrop-filter:blur(3px);opacity:0;pointer-events:none;transition:opacity .2s ease}
 body.mobile-nav-open .mobile-nav-backdrop{opacity:1;pointer-events:auto}
 .sidebar .brand{padding:0 42px 22px 8px;font-size:18px}
 .sidebar nav{gap:4px}
 .sidebar nav a{min-height:44px;padding:0 13px;font-size:13px}
 .workspace{width:100%;margin:0;min-height:100dvh}
 .topbar{height:66px;padding:0 14px;gap:12px;z-index:40;background:#fffffffa;backdrop-filter:blur(12px)}
 .mobile-top-start{display:flex;align-items:center;gap:8px;flex:0 0 auto}
 .mobile-nav-toggle{display:grid;place-items:center;align-content:center;gap:4px;width:40px;height:40px;border:1px solid #e0e5ed;border-radius:12px;background:#fff;padding:0;cursor:pointer}
 .mobile-nav-toggle span{display:block;width:17px;height:2px;border-radius:4px;background:#1d2939}
 .mobile-brand{display:flex;align-items:center;gap:7px;color:#111827;max-width:150px}
 .mobile-brand .brand-mark{width:25px;height:24px;transform:scale(.62);transform-origin:left center;margin-right:-8px}
 .mobile-brand strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}
 .topbar .search{flex:1;width:auto;min-width:0;height:40px;padding:0 10px}
 .topbar .search input{padding:8px;font-size:12px}
 .top-actions{gap:8px;flex:0 0 auto}
 .admin-badge{display:none}
 .top-account-menu summary span{display:none}
 .avatar{width:34px;height:34px}
 .content{max-width:none;padding:18px 14px 30px}
 .welcome,.catalog-head,.section-head{align-items:flex-start;gap:14px}
 .welcome h1{font-size:24px}
 .metrics{grid-template-columns:1fr;gap:12px;margin-bottom:24px}
 .metrics article{min-height:112px;padding:17px}
 .widget-grid,.grid{grid-template-columns:1fr}
 .editor{grid-template-columns:1fr;border-radius:14px;min-height:0}
 .editor-panel{padding:18px}
 .preview{padding:14px}
 .preview>div[data-widget-id]{padding:14px;min-height:320px}
}
@media(max-width:560px){
 .mobile-brand strong{display:none}
 .topbar .search{max-width:none}
 .content{padding:14px 12px 26px}
 .primary,.secondary{min-height:40px;padding:0 14px}
}

/* WidgetDO P3.7.5.2 — module SVG marks */
.widget-icon svg{width:55%;height:55%;display:block;color:#fff;overflow:visible}

/* P3.8.15.20 — alertas de consumo de visualizaciones */
.usage-alert{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:14px;align-items:center;margin:0 0 18px;padding:16px 18px;border:1px solid #e9d9a8;border-radius:15px;background:linear-gradient(180deg,#fffdf7,#fffaf0);box-shadow:0 8px 22px rgba(34,43,69,.04)}
.usage-alert-danger{border-color:#efc8a8;background:linear-gradient(180deg,#fffaf5,#fff5eb)}
.usage-alert-limit{border-color:#efb4b4;background:linear-gradient(180deg,#fff8f8,#fff1f1)}
.usage-alert-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:12px;background:#fff1bf;color:#8d6600;font-size:18px;font-weight:900}
.usage-alert-danger .usage-alert-icon{background:#ffe5ce;color:#a64b00}.usage-alert-limit .usage-alert-icon{background:#ffe0e0;color:#b42318}
.usage-alert-copy{display:grid;gap:4px;min-width:0}.usage-alert-copy>span{font-size:9px;font-weight:900;text-transform:uppercase;letter-spacing:.08em;color:#8a6b16}.usage-alert-danger .usage-alert-copy>span{color:#a45112}.usage-alert-limit .usage-alert-copy>span{color:#b42318}.usage-alert-copy h2{margin:0;font-size:14px;line-height:1.3;color:#253044}.usage-alert-copy p{margin:0;color:#667085;font-size:10px;line-height:1.5}.usage-alert-copy small{font-size:9px;color:#87909d}.usage-alert-progress{height:7px;border-radius:999px;background:#eceff4;overflow:hidden;margin:4px 0 1px}.usage-alert-progress i{display:block;height:100%;border-radius:inherit;background:#d9a80b}.usage-alert-danger .usage-alert-progress i{background:#d97706}.usage-alert-limit .usage-alert-progress i{background:#d92d20}.usage-alert-action{display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:0 13px;border-radius:10px;background:#5f4be6;color:#fff;text-decoration:none;font-size:9px;font-weight:900;white-space:nowrap}.usage-alert-action:hover{background:#5140cf}.billing-views-card strong{display:flex;align-items:baseline;gap:5px}.billing-views-card strong em{font-size:11px;font-style:normal;color:#8b94a3;font-weight:800}.billing-mini-progress{height:6px;background:#edf0f4;border-radius:999px;overflow:hidden;margin:3px 0}.billing-mini-progress i{display:block;height:100%;border-radius:inherit;background:#6d5dfb}@media(max-width:760px){.usage-alert{grid-template-columns:auto 1fr}.usage-alert-action{grid-column:1/-1;width:100%}}

/* P3.8.15.20.1 — medidor visible antes del 80% */
.usage-alert-normal{border-color:#dfe4ec;background:linear-gradient(180deg,#ffffff,#fafbfc)}
.usage-alert-normal .usage-alert-icon{background:#eef1ff;color:#5f4be6}
.usage-alert-normal .usage-alert-copy>span{color:#697386}
.usage-alert-normal .usage-alert-progress i{background:#6d5dfb}
