/* PROYECTOS (27 oct 2026): columnas en horizontal, mismo lenguaje que Anotar */
.proyectos .vcab h2 { font-size: 44px; }
.pj-cols { flex: 1; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(230px, 1fr); border-top: var(--borde); min-height: 0; overflow-x: auto; overflow-y: hidden; }
.pj-col { overflow: hidden; display: flex; flex-direction: column; min-height: 0; padding: 16px 16px 0; border-left: 1.5px solid var(--linea); }
.pj-col:first-child { border-left: 0; padding-left: 0; }
.pj-raya { display: block; width: 64px; height: 6px; background: var(--c); margin-bottom: 12px; }
.pj-col h3 { font-family: Flexa; font-weight: 400; font-size: clamp(17px, 1.7vw, 25px); overflow-wrap: anywhere; line-height: 1; letter-spacing: -.02em; min-height: 50px; display: flex; align-items: flex-start; }
.pj-cuenta { font-family: Mono; font-size: 10.5px; letter-spacing: .08em; color: var(--gris); text-transform: uppercase; margin: 6px 0 14px; }
.pj-nuevo { display: flex; align-items: center; gap: 8px; border: var(--borde); border-radius: var(--pill); height: 40px; padding: 0 14px; background: var(--blanco); cursor: text; }
.pj-nuevo span { font-size: 18px; line-height: 1; }
.pj-nuevo input { flex: 1; min-width: 0; border: 0; outline: 0; background: none; font: inherit; font-size: 15px; }
.pj-nuevo:focus-within { border-color: var(--c); box-shadow: 0 0 0 3px color-mix(in srgb, var(--c) 25%, transparent); }
.pj-lista { flex: 1; overflow-y: auto; margin-top: 10px; padding-bottom: 20px; }
.pj-it { display: flex; gap: 12px; align-items: flex-start; padding: 10px 2px; border-bottom: 1.5px solid var(--linea); }
.pj-it .check { margin-top: -2px; }
.pj-it .tx { flex: 1; font-size: 16px; line-height: 1.3; min-width: 0; overflow-wrap: anywhere; outline: 0; }
.pj-it .tx[contenteditable] { background: var(--suave); border-radius: 6px; padding: 0 4px; }
.pj-it.hecho .check { background: var(--tinta); color: #fff; }
.pj-it.hecho .tx { text-decoration: line-through; color: var(--gris2); }
.pj-borrar { width: 24px; height: 24px; border-radius: 8px; display: grid; place-items: center; color: var(--gris2); opacity: 0; flex: none; }
.pj-borrar svg { width: 14px; height: 14px; }
.pj-it:hover .pj-borrar, .pj-borrar.armado { opacity: 1; }
.pj-borrar:hover { color: var(--tinta); background: var(--suave); }
.pj-borrar.armado { background: var(--rojo); color: #fff; }
/* logos en lugar del nombre (27 oct) */
.pj-col h3 .pj-logo { display: block; max-width: 100%; height: 46px; width: auto; object-fit: contain; object-position: left top; }
.pj-col h3 .pj-plasma { height: 34px; margin-top: 6px; }
.pj-col h3 .pj-cineclub { height: 24px; margin-top: 12px; }
.pj-col h3 .pj-chingadazo { height: 34px; margin-top: 6px; }
.pj-giallo { font-family: 'Barlow Condensed', 'Arial Narrow', Impact, sans-serif; font-weight: 900; font-size: 44px; line-height: .85; letter-spacing: -.01em; }
.pj-cuci { border: 2.5px solid var(--tinta); padding: 6px 12px 4px; font-family: Flexa; font-size: 22px; line-height: 1; letter-spacing: -.03em; margin-top: 4px; }
.pj-col h3 { flex-direction: column; }
.pj-sub { display: block; font-family: Mono; font-size: 10.5px; letter-spacing: .08em; color: var(--gris); margin-top: 5px; }
/* logos centrados en su columna (27 oct) */
.pj-col h3 { align-items: center; text-align: center; }
.pj-col h3 .pj-logo { object-position: center top; }
/* la raya de color ocupa todo el ancho de la columna (27 oct) */
.pj-raya { width: 100%; }
/* arrastrar columnas (27 oct) */
.pj-cab { cursor: grab; }
.pj-cab:active { cursor: grabbing; }
.pj-arrastrada { opacity: .35; }
.pj-antes { box-shadow: inset 4px 0 0 var(--tinta); }
.pj-despues { box-shadow: inset -4px 0 0 var(--tinta); }
/* reloj de trabajo (27 oct) */
.pj-relojes { position: relative; }
.pj-relojes .btn svg { flex: none; }
.pj-menu { position: absolute; right: 0; top: 48px; z-index: 30; background: var(--blanco); border: var(--borde); border-radius: 18px; padding: 8px; min-width: 260px; box-shadow: 0 12px 30px rgba(0,0,0,.12); }
.pj-menu-t { font-family: Mono; font-size: 10.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--gris); padding: 6px 10px 8px; }
.pj-menu button { display: flex; align-items: center; gap: 10px; width: 100%; text-align: left; padding: 10px; border-radius: 10px; font-size: 15px; }
.pj-menu button:hover { background: var(--suave); }
.pj-menu button i { width: 14px; height: 14px; border-radius: 4px; background: var(--c); flex: none; }
.pj-col { position: relative; }
.pj-crono { position: absolute; left: 12px; right: 12px; bottom: 18px; z-index: 5; display: flex; align-items: center; gap: 10px; background: var(--c); color: #fff; border-radius: 999px; padding: 6px 6px 6px 16px; box-shadow: 0 10px 24px rgba(0,0,0,.18); }
.pj-col:first-child .pj-crono { left: 0; }
.pj-trabajando .pj-lista { padding-bottom: 80px; }
.pj-crono i { width: 9px; height: 9px; border-radius: 50%; background: #fff; animation: pjLate 1s infinite; flex: none; }
.pj-crono b { font-family: Mono; font-weight: 500; font-size: 18px; letter-spacing: .02em; flex: 1; }
.pj-crono .btn { background: #fff; color: var(--tinta); border-color: #fff; }
@keyframes pjLate { 50% { opacity: .25; } }
.pj-trabajando { background: color-mix(in srgb, var(--c) 6%, transparent); }
.pj-tiempo { margin: -6px 0 14px; }
.pj-tiempo span { font-family: Mono; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: var(--gris2); }
.pj-tiempo i { display: block; height: 3px; background: var(--c); border-radius: 2px; margin-top: 5px; min-width: 0; }