:root{
  --bg:#121212; --surface:#1A1A1A; --surface-2:#212121; --surface-3:#262626;
  --pink:#FF3399; --green:#33FF99;
  --text:#F2F2F2; --text-soft:#8C8C8C; --line:#292929;
}
*{box-sizing:border-box; margin:0; padding:0;}
body{background:var(--bg); color:var(--text); font-family:'Space Grotesk', sans-serif; font-size:14px; -webkit-font-smoothing:antialiased;}
a{color:inherit; text-decoration:none;}
button, input, select, textarea{font-family:inherit; font-size:inherit;}
img{display:block; max-width:100%;}

/* ---------- Top bar (all inner screens) ---------- */
.topbar{display:flex; align-items:center; justify-content:space-between; padding:14px 26px; border-bottom:1px solid var(--line); background:var(--surface);}
.topbar-left{display:flex; align-items:center; gap:16px;}
.topbar-logo{height:28px; width:28px;}
.back-link{font-family:'JetBrains Mono', monospace; font-size:12px; color:var(--text-soft); display:flex; align-items:center; gap:6px;}
.back-link:hover{color:var(--text);}
.topbar-right{display:flex; align-items:center; gap:12px;}
.avatar{width:28px; height:28px; border-radius:50%; background:rgba(51,255,153,0.14); color:var(--green); display:flex; align-items:center; justify-content:center; font-family:'JetBrains Mono', monospace; font-size:11px; flex-shrink:0;}
.user-name{font-size:12.5px;}

.shell{max-width:1180px; margin:0 auto; padding:32px 26px 60px;}
.page-title{display:flex; align-items:center; justify-content:space-between; margin-bottom:26px; flex-wrap:wrap; gap:14px;}
.page-title h1{font-size:24px; font-weight:700;}
.page-title .eyebrow{font-family:'JetBrains Mono', monospace; font-size:11px; letter-spacing:0.08em; text-transform:uppercase; color:var(--text-soft); margin-bottom:6px; display:block;}

.btn{border:none; padding:11px 20px; font-family:'JetBrains Mono', monospace; font-size:12.5px; letter-spacing:0.03em; text-transform:uppercase; cursor:pointer; border-radius:2px;}
.btn-primary{background:var(--green); color:#0b1f14; font-weight:500;}
.btn-secondary{background:transparent; border:1px solid var(--line); color:var(--text-soft);}
.btn-secondary:hover{color:var(--text); border-color:var(--text-soft);}
.btn-danger{background:transparent; border:1px solid #FF3355; color:#FF3355;}
.btn-danger:hover{background:rgba(255,51,85,0.08);}
.btn-row{display:flex; gap:10px;}

/* ---------- Dashboard big buttons ---------- */
.dash-greeting{font-family:'JetBrains Mono', monospace; font-size:13px; color:var(--text-soft); margin-bottom:6px;}
.dash-title{font-size:28px; font-weight:700; margin-bottom:30px;}
.dash-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px;}
.dash-btn{
  background:var(--surface); border:1px solid var(--line); border-top:3px solid var(--green);
  padding:26px 22px; display:flex; flex-direction:column; gap:10px; min-height:150px;
  transition:transform .15s ease, border-color .15s ease;
}
.dash-btn:hover{transform:translateY(-3px); border-color:var(--text-soft);}
.dash-btn.pink{border-top-color:var(--pink);}
.dash-mark{width:34px; height:34px; border-radius:8px; display:flex; align-items:center; justify-content:center; font-size:17px; background:rgba(51,255,153,0.12); color:var(--green);}
.dash-btn.pink .dash-mark{background:rgba(255,51,153,0.12); color:var(--pink);}
.dash-btn h3{font-size:16.5px; font-weight:700;}
.dash-btn p{font-size:12.5px; color:var(--text-soft); line-height:1.45;}
.dash-btn .go{margin-top:auto; font-family:'JetBrains Mono', monospace; font-size:11px; color:var(--text-soft); display:flex; align-items:center; gap:4px;}
.dash-btn:hover .go{color:var(--green);}
.dash-btn.pink:hover .go{color:var(--pink);}

/* ---------- Login ---------- */
.login-wrap{min-height:100vh; display:flex; align-items:center; justify-content:center; flex-direction:column; gap:32px;}
.login-logo{height:46px;}
.login-card{background:var(--surface); border:1px solid var(--line); padding:36px; width:360px;}
.login-card h2{font-size:17px; font-weight:700; margin-bottom:4px;}
.login-card .eyebrow{font-family:'JetBrains Mono', monospace; font-size:11px; color:var(--text-soft); text-transform:uppercase; letter-spacing:0.06em; margin-bottom:20px; display:block;}
.who-list{display:flex; flex-direction:column; gap:10px;}
.who-btn{display:flex; align-items:center; gap:12px; background:var(--surface-2); border:1px solid var(--line); padding:12px 14px; text-align:left; transition:border-color .15s;}
.who-btn:hover{border-color:var(--green);}
.who-avatar{width:36px; height:36px; border-radius:50%; background:rgba(51,255,153,0.14); color:var(--green); display:flex; align-items:center; justify-content:center; font-family:'JetBrains Mono', monospace; font-size:12px; flex-shrink:0;}
.who-name{font-size:13.5px; font-weight:600;}
.who-role{font-family:'JetBrains Mono', monospace; font-size:10.5px; color:var(--text-soft);}

/* ---------- Forms ---------- */
.field{margin-bottom:18px;}
.field label{display:block; font-family:'JetBrains Mono', monospace; font-size:11px; letter-spacing:0.05em; text-transform:uppercase; color:var(--text-soft); margin-bottom:7px;}
.field input[type=text], .field input[type=email], .field textarea, .field select{
  width:100%; background:var(--surface); border:1px solid var(--line); color:var(--text);
  padding:11px 12px; border-radius:2px;
}
.field input:focus, .field textarea:focus, .field select:focus{outline:none; border-color:var(--green);}
.field-title input{font-size:19px; font-weight:600; padding:13px 12px;}
.field-row{display:grid; grid-template-columns:1fr 1fr; gap:14px;}
.readonly-field{font-size:13px; color:var(--text-soft);}
.tag-input{display:flex; flex-wrap:wrap; gap:8px; background:var(--surface); border:1px solid var(--line); padding:9px 10px; border-radius:2px; align-items:center;}
.tag-chip{display:inline-flex; align-items:center; gap:6px; font-family:'JetBrains Mono', monospace; font-size:11.5px; color:var(--pink); background:rgba(255,51,153,0.1); padding:4px 9px; border-radius:2px;}
.tag-chip .x{cursor:pointer; opacity:0.6;}
.tag-input input{border:none; background:none; flex:1; min-width:80px; color:var(--text); padding:4px;}
.tag-suggest-wrap{position:relative;}
.tag-suggestions{position:absolute; top:calc(100% + 4px); left:0; right:0; background:var(--surface-2); border:1px solid var(--line); max-height:220px; overflow-y:auto; z-index:10;}
.tag-suggestions .opt{padding:9px 12px; font-size:12.5px; cursor:pointer; display:flex; justify-content:space-between; gap:10px;}
.tag-suggestions .opt .count{color:var(--text-soft); font-family:'JetBrains Mono', monospace; font-size:11px;}
.tag-suggestions .opt:hover, .tag-suggestions .opt.active{background:var(--surface-3); color:var(--green);}
.dropzone{border:1px dashed var(--line); border-radius:2px; padding:26px; text-align:center; color:var(--text-soft); font-size:12.5px; cursor:pointer; background-size:cover; background-position:center;}
.dropzone:hover{border-color:var(--green); color:var(--text);}
.pill{display:inline-flex; align-items:center; font-family:'JetBrains Mono', monospace; font-size:10.5px; letter-spacing:0.05em; text-transform:uppercase; padding:4px 10px; border-radius:2px; background:rgba(51,255,153,0.12); color:var(--green);}

/* ---------- Editor layout ---------- */
.editor-grid{display:grid; grid-template-columns:1fr 300px; gap:26px;}
.side-panel{background:var(--surface); border:1px solid var(--line); padding:18px; align-self:start;}
.side-panel h4{font-family:'JetBrains Mono', monospace; font-size:11px; letter-spacing:0.06em; text-transform:uppercase; color:var(--text-soft); margin-bottom:14px;}
.side-field{margin-bottom:14px;}
.side-field label{display:block; font-size:12px; color:var(--text-soft); margin-bottom:6px;}
.preview-thumb{aspect-ratio:16/9; background:linear-gradient(135deg,#1c1c22 0%, #262230 45%, #1e1e28 100%); background-size:cover; background-position:center; border:1px solid var(--line); margin-bottom:14px;}

/* ---------- Block-based body builder ---------- */
.block-toolbar{display:flex; flex-wrap:wrap; gap:8px; margin-bottom:16px; padding:14px; background:var(--surface); border:1px solid var(--line);}
.block-toolbar .label{font-family:'JetBrains Mono', monospace; font-size:10.5px; color:var(--text-soft); text-transform:uppercase; letter-spacing:0.05em; width:100%; margin-bottom:4px;}
.add-block-btn{background:var(--surface-2); border:1px solid var(--line); color:var(--text); padding:8px 14px; font-family:'JetBrains Mono', monospace; font-size:11.5px; cursor:pointer; display:flex; align-items:center; gap:6px;}
.add-block-btn:hover{border-color:var(--green); color:var(--green);}
.add-block-btn.pink-hover:hover{border-color:var(--pink); color:var(--pink);}

#blockCanvas{display:flex; flex-direction:column; gap:4px;}
.block{position:relative; background:var(--surface); border:1px solid var(--line); padding:16px; }
.block-controls{position:absolute; top:8px; right:8px; display:flex; gap:4px; opacity:0; transition:opacity .12s;}
.block:hover .block-controls{opacity:1;}
.block-controls button{width:22px; height:22px; background:var(--surface-3); border:1px solid var(--line); color:var(--text-soft); font-size:11px; cursor:pointer;}
.block-controls button:hover{color:var(--pink); border-color:var(--pink);}
.block-label{font-family:'JetBrains Mono', monospace; font-size:9.5px; text-transform:uppercase; letter-spacing:0.05em; color:var(--text-soft); margin-bottom:8px;}

.block-paragraph textarea{width:100%; border:none; background:none; color:#E4E4E4; font-size:16px; line-height:1.7; resize:vertical; min-height:70px;}
.block-paragraph textarea:focus{outline:none;}

.rt-toolbar{display:flex; gap:4px; margin-bottom:8px;}
.rt-toolbar button{width:26px; height:26px; background:var(--surface-2); border:1px solid var(--line); color:var(--text-soft); font-size:12px; cursor:pointer; font-family:'JetBrains Mono', monospace;}
.rt-toolbar button:hover{color:var(--green); border-color:var(--green);}
.rt-editable{min-height:70px; color:#E4E4E4; font-size:16px; line-height:1.7; outline:none;}
.rt-editable:empty:before{content:attr(data-placeholder); color:var(--text-soft);}
.rt-editable h2{font-size:20px; font-weight:700; margin:10px 0 6px;}
.rt-editable h3{font-size:17px; font-weight:700; margin:8px 0 6px;}
.rt-editable .rc-size-sm{font-size:13px;}
.rt-editable .rc-size-lg{font-size:19px;}

.block-image .img-bar{height:4px; background:var(--pink);}
.block-image .img-bar.bottom{background:var(--green);}
.block-image .img-box{aspect-ratio:16/9; background:linear-gradient(135deg,#1c2333 0%, #2c3f4d 100%); background-size:cover; background-position:center;}
.block-image .img-caption-input{width:100%; border:none; background:none; color:var(--text-soft); font-family:'JetBrains Mono', monospace; font-size:11px; padding:8px 0 0; text-align:center;}
.block-image .img-caption-input:focus{outline:none;}

.block-quote{border-left:3px solid var(--pink); background:var(--surface);}
.block-quote textarea{width:100%; border:none; background:none; color:#fff; font-size:19px; font-weight:500; line-height:1.5; resize:vertical; min-height:50px;}
.block-quote textarea:focus{outline:none;}

.block-subhead input{width:100%; border:none; background:none; color:var(--text); font-size:21px; font-weight:700;}
.block-subhead input:focus{outline:none;}

.block-keypoints{border-left:3px solid var(--green);}
.block-keypoints .kp-row{display:flex; align-items:center; gap:8px; margin-bottom:8px;}
.block-keypoints .kp-row::before{content:"—"; color:var(--green);}
.block-keypoints input{flex:1; border:none; background:none; color:var(--text); font-size:14.5px;}
.block-keypoints input:focus{outline:none;}

.block-factbox{border:1px solid var(--pink); background:rgba(255,51,153,0.04);}
.block-factbox .fb-row{display:grid; grid-template-columns:120px 1fr; gap:10px; margin-bottom:8px; align-items:center;}
.block-factbox .fb-row input{border:none; background:var(--surface-2); padding:6px 8px; color:var(--text); font-size:12.5px;}
.block-factbox .fb-row input:first-child{background:none; color:var(--pink); font-family:'JetBrains Mono', monospace; font-size:11px; text-transform:uppercase;}

.block-gallery{display:grid; grid-template-columns:repeat(3,1fr); gap:8px;}
.block-gallery .g-thumb{aspect-ratio:1/1; background:linear-gradient(135deg,#241a2e 0%, #452650 100%);}
.block-gallery .g-thumb.g2{background:linear-gradient(135deg,#182430 0%, #204458 100%);}
.block-gallery .g-thumb.g3{background:linear-gradient(135deg,#2a1818 0%, #542626 100%);}

.block-embed input{width:100%; border:none; background:var(--surface-2); padding:9px 10px; color:var(--text); font-size:13px;}
.block-embed input:focus{outline:none;}
.block-embed .embed-hint{font-family:'JetBrains Mono', monospace; font-size:10.5px; color:var(--text-soft); margin-top:6px;}
.block-embed .embed-hint.ok{color:var(--green);}
.block-embed .embed-hint.err{color:var(--pink);}

/* ---------- Notas list ---------- */
.tabs{display:flex; gap:6px; margin-bottom:18px;}
.tab{padding:6px 14px; font-family:'JetBrains Mono', monospace; font-size:11.5px; text-transform:uppercase; border:1px solid var(--line); color:var(--text-soft); border-radius:100px; cursor:pointer;}
.tab.active{border-color:var(--green); color:var(--green);}
table{width:100%; border-collapse:collapse;}
th{text-align:left; font-family:'JetBrains Mono', monospace; font-size:10.5px; text-transform:uppercase; letter-spacing:0.05em; color:var(--text-soft); padding:10px 12px; border-bottom:1px solid var(--line);}
td{padding:13px 12px; border-bottom:1px solid var(--line); font-size:13px; vertical-align:middle;}
tr:hover td{background:var(--surface);}
.pill.draft{background:rgba(140,140,140,0.14); color:var(--text-soft);}
.hashtag{font-family:'JetBrains Mono', monospace; font-size:11px; color:var(--pink); margin-right:6px;}
.row-title{font-weight:600;}
.row-meta{font-family:'JetBrains Mono', monospace; font-size:11px; color:var(--text-soft);}
.edit-icon{color:var(--text-soft); font-family:'JetBrains Mono', monospace; font-size:12px;}
tr:hover .edit-icon{color:var(--green);}

/* ---------- Editar Home ---------- */
.slot{background:var(--surface); border:1px solid var(--line); border-left:3px solid var(--green); padding:16px; margin-bottom:14px; display:flex; align-items:center; justify-content:between; gap:16px;}
.slot.pink{border-left-color:var(--pink);}
.slot-label{font-family:'JetBrains Mono', monospace; font-size:10.5px; text-transform:uppercase; letter-spacing:0.05em; color:var(--text-soft); width:150px; flex-shrink:0;}
.slot-content{flex:1; font-size:14px; font-weight:600;}
.slot-select{background:var(--surface-2); border:1px solid var(--line); color:var(--text); padding:8px 10px; font-size:12.5px;}
.ticker-row{display:flex; align-items:center; gap:10px; padding:10px 0; border-bottom:1px solid var(--line);}
.ticker-num{font-family:'JetBrains Mono', monospace; font-size:11px; color:var(--text-soft); width:20px;}

/* ---------- Ajustes ---------- */
.settings-grid{display:grid; grid-template-columns:220px 1fr; gap:26px;}
.settings-nav{display:flex; flex-direction:column; gap:2px;}
.settings-nav a{padding:9px 12px; font-size:13px; color:var(--text-soft); border-radius:4px;}
.settings-nav a.active{background:var(--surface); color:var(--text);}
.settings-card{background:var(--surface); border:1px solid var(--line); padding:22px; margin-bottom:18px;}
.settings-card h3{font-size:15px; font-weight:700; margin-bottom:16px;}
.team-row{display:flex; align-items:center; justify-content:space-between; padding:10px 0; border-bottom:1px solid var(--line);}
.team-row:last-child{border-bottom:none;}
.team-row-top{display:flex; align-items:center; justify-content:space-between; width:100%; gap:16px;}
.team-avatar-preview{width:44px; height:44px; border-radius:50%; object-fit:cover; background:var(--surface-2); flex-shrink:0;}
.team-edit{margin-top:14px; padding-top:14px; border-top:1px dashed var(--line); display:none; width:100%;}
.team-edit.open{display:block;}
.social-row{display:grid; grid-template-columns:90px 1fr; gap:10px; align-items:center; margin-bottom:8px;}
.social-row label{font-family:'JetBrains Mono', monospace; font-size:10.5px; color:var(--text-soft); text-transform:uppercase;}
.social-row input{width:100%; background:var(--surface-2); border:1px solid var(--line); color:var(--text); padding:8px 10px; font-size:12.5px; border-radius:2px;}

@media (max-width:900px){
  .dash-grid{grid-template-columns:1fr 1fr;}
  .editor-grid, .settings-grid{grid-template-columns:1fr;}
  .home-editor-grid{grid-template-columns:1fr;}
}

/* ---------- Editar Home: editor visual drag-and-drop ---------- */
.home-editor-grid{display:grid; grid-template-columns:280px 1fr; gap:24px; align-items:start;}
.home-section{margin-bottom:22px;}
.home-section-title{font-family:'JetBrains Mono', monospace; font-size:11px; text-transform:uppercase; letter-spacing:0.06em; color:var(--text-soft); margin-bottom:10px;}
.home-pool{background:var(--surface); border:1px solid var(--line); padding:10px; max-height:70vh; overflow-y:auto; display:flex; flex-direction:column; gap:6px;}
.home-dropzone{background:var(--surface-2); border:1px dashed var(--line); padding:10px; min-height:56px; display:flex; flex-direction:column; gap:6px; transition:border-color .12s, background .12s;}
.home-dropzone.drag-over{border-color:var(--green); background:rgba(51,255,153,0.06);}
.home-dropzone-single{min-height:60px;}
.home-slot-item{display:flex; align-items:center; gap:8px; background:var(--surface); border:1px solid var(--line); padding:8px 10px; cursor:grab;}
.home-slot-item:active{cursor:grabbing;}
.home-slot-num{font-family:'JetBrains Mono', monospace; font-size:10.5px; color:var(--text-soft); width:16px; flex-shrink:0;}
.home-slot-title{flex:1; font-size:12.5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.slot-remove{width:20px; height:20px; flex-shrink:0; background:var(--surface-3); border:1px solid var(--line); color:var(--text-soft); font-size:10px; cursor:pointer;}
.slot-remove:hover{color:var(--pink); border-color:var(--pink);}
