:root{--bg:#f6f6f4;--card:#fff;--ink:#1a1a1a;--mid:#666;--line:#ddd;--acc:#0b57d0;--rojo:#b3261e}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
a{color:var(--acc)}
.top{display:flex;align-items:center;gap:18px;padding:0 18px;height:50px;background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5}
.marca{font-weight:700;color:var(--ink);text-decoration:none;white-space:nowrap}.marca span{color:var(--mid);font-weight:400}
.top nav{display:flex;gap:2px;flex:1;overflow:auto}
.top nav a{padding:6px 10px;border-radius:6px;color:var(--ink);text-decoration:none;white-space:nowrap}
.top nav a.on,.top nav a:hover{background:#eee}
.top .der{display:flex;gap:12px;align-items:center;white-space:nowrap}
.wrap{max-width:1000px;margin:0 auto;padding:22px 18px 60px}
h1{font-size:24px;margin:0 0 16px;display:flex;align-items:center;gap:14px}
h2{font-size:17px;margin:26px 0 8px}
.aviso{background:#e6f4ea;border:1px solid #b7dfc1;padding:10px 14px;border-radius:8px;margin:0 0 16px}
.aviso.mal{background:#fdecea;border-color:#f3b5b0}
.btn{display:inline-block;border:0;background:var(--acc);color:#fff;font:inherit;font-weight:600;padding:8px 16px;border-radius:8px;cursor:pointer;text-decoration:none;line-height:1.3}
.btn.b2{background:#fff;color:var(--ink);box-shadow:0 0 0 1px var(--line) inset}
.btn.mini{padding:5px 10px;font-size:13px;font-weight:500}
.btn:hover{filter:brightness(.96)}
.lnk{border:0;background:none;color:var(--acc);cursor:pointer;font:inherit;padding:0}
.rojo{color:var(--rojo)}
.inline{display:inline}
.gris{color:var(--mid)}.mono{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:13px}
.mini{font-size:13px;color:var(--mid)}
.tag{font-size:11px;background:#fbe9c6;color:#7a4b00;padding:1px 6px;border-radius:4px;vertical-align:middle}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px;margin:0 0 18px}
.tile{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:14px 16px;color:var(--ink);text-decoration:none}
.tile b{display:block;font-size:26px}
.acciones{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
table.lista{width:100%;border-collapse:collapse;background:var(--card);border:1px solid var(--line);border-radius:10px;overflow:hidden}
table.lista td{padding:9px 12px;border-top:1px solid var(--line);vertical-align:top}
table.lista tr:first-child td{border-top:0}
form label{display:block;font-size:13px;color:var(--mid);margin:0 0 10px}
form label small{font-weight:400}
input[type=text],input[type=email],input[type=password],input[type=date],input[type=number],input[type=url],input:not([type]),select,textarea{display:block;width:100%;font:inherit;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:8px;padding:8px 10px;margin-top:3px}
input.corto{width:90px}
textarea{resize:vertical;min-height:80px;line-height:1.5}
textarea#body,textarea.md,textarea.mono{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:14px}
textarea:focus,input:focus,select:focus{outline:2px solid #9ec0f5;border-color:#9ec0f5}
.fila{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end}
.fila>label{flex:1 1 180px}.fila>label.crece{flex:3 1 260px}
.fila.pie{align-items:center;margin-top:12px}
.crece{flex:1}
label.check{display:flex;align-items:center;gap:6px;color:var(--ink);flex:0 0 auto}
label.check input{width:auto;margin:0}
fieldset{border:1px solid var(--line);background:var(--card);border-radius:10px;padding:14px 16px;margin:0 0 16px}
legend{font-weight:600;padding:0 6px}
details summary{cursor:pointer;color:var(--acc);margin:6px 0 10px}
.barra-editor{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin:8px 0 6px}
.subir{cursor:pointer}
.galeria{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 10px}
.thumb{border:1px solid var(--line);background:#fff;padding:2px;border-radius:6px;cursor:pointer;width:74px;height:74px}
.thumb img{width:100%;height:100%;object-fit:cover;border-radius:4px;display:block}
.galeria.grande{gap:14px}
.foto{width:220px;background:var(--card);border:1px solid var(--line);border-radius:10px;overflow:hidden}
.foto img{display:block;width:100%;height:150px;object-fit:cover}
.pie-foto{padding:8px 10px;font-size:12px;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.pie-foto code{cursor:copy;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.copiado{outline:2px solid #6fcf97}
.preview{background:#fff;border:1px solid var(--line);border-radius:8px;padding:16px 20px;margin:8px 0;max-height:70vh;overflow:auto}
.preview img{max-width:100%}
.preview .embed-video{position:relative;aspect-ratio:16/9}.preview .embed-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.ayuda{font-size:13px;color:var(--mid)}
.ayuda code,code{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.92em;background:#eee;padding:1px 4px;border-radius:3px}
.peligro{margin-top:24px;text-align:right}
.temas{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px;margin:0 0 12px}
.tema{display:block;border:1px solid var(--line);border-radius:8px;padding:10px 12px;color:var(--ink);cursor:pointer}
.tema:has(input:checked){border-color:var(--acc);box-shadow:0 0 0 1px var(--acc)}
.tema input{width:auto}
.retrat{width:96px;height:96px;border-radius:50%;object-fit:cover}
.subida{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin:0 0 16px}
.grupo{margin:0 0 14px}
.grupo .item{border-top:1px dashed var(--line);padding-top:8px;margin-top:4px}
.grupo .item>label{flex:1 1 150px}
.orden{display:flex;gap:10px;align-items:center;padding-bottom:12px;white-space:nowrap}
.entrar{max-width:360px;margin:12vh auto 0;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:28px}
.entrar h1{font-size:20px;margin-bottom:18px}.entrar h1 span{color:var(--mid);font-weight:400}
.entrar .btn{width:100%;margin-top:6px}
@media (max-width:700px){.top{height:auto;flex-wrap:wrap;padding:8px 12px;gap:8px}.top nav{order:3;width:100%}.wrap{padding:14px 12px 50px}}
