/* ============================================================ modules/cineshot-script.css — Guion: editor en página, modo Fountain, vista paginada y lateral de medidas. Escala: 1" = 96 px, Courier 12 = 16 px (10 caracteres por pulgada), 6 líneas por pulgada = 16 px. ============================================================ */ .sp-wrap{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:start} .sp-main{min-width:0;overflow:visible} /* sin scroll propio: la barra de estado se pega al desplazamiento de la ventana; la hoja ya se escala al ancho */ .sp-mode{display:flex;gap:2px;background:var(--paper);border-radius:6px;padding:2px} .sp-mode button{display:flex;align-items:center;gap:5px;padding:5px 10px;border-radius:5px;font-weight:600;font-size:12px;color:var(--ink-2)} .sp-mode button.on{background:#fff;color:var(--gc);box-shadow:var(--shadow-sm)} /* ---------- Editor en página ---------- */ .sp-paper{background:#fff;border:1px solid var(--line);border-radius:4px;width:816px;min-height:1056px;padding:96px 86px 96px 144px;margin:0 auto;box-shadow:0 2px 14px rgba(27,30,65,.08);box-sizing:border-box} .sp-editor{font-family:'Courier Prime','Courier New',Courier,monospace;font-size:16px;line-height:16px;color:#111;outline:none;min-height:860px;width:586px;caret-color:var(--accent)} .sp-el{margin:0;padding:0;white-space:pre-wrap;word-break:break-word;position:relative;min-height:16px} .sp-el + .sp-el{margin-top:16px} .sp-el[data-type=parenthetical],.sp-el[data-type=dialogue],.sp-el[data-type=lyrics]{margin-top:0} .sp-el[data-type=scene_heading]{text-transform:uppercase;font-weight:700} .sp-el[data-type=action]{margin-left:var(--sp-ml-action,0);width:var(--sp-w-action,auto)} .sp-el[data-type=character]{margin-left:var(--sp-ml-character,192px);width:var(--sp-w-character,317px);text-transform:uppercase} .sp-el[data-type=parenthetical]{margin-left:var(--sp-ml-parenthetical,144px);width:var(--sp-w-parenthetical,250px)} .sp-el[data-type=dialogue]{margin-left:var(--sp-ml-dialogue,96px);width:var(--sp-w-dialogue,346px)} .sp-el[data-type=lyrics]{margin-left:var(--sp-ml-lyrics,96px);width:var(--sp-w-lyrics,346px)} .sp-el[data-type=lyrics]{font-style:italic} .sp-el[data-type=transition]{text-align:right;text-transform:uppercase} .sp-el[data-type=centered]{text-align:center} .sp-el[data-type=section]{color:var(--accent);font-weight:700;font-family:'Open Sans',sans-serif;font-size:13px} .sp-el[data-type=synopsis]{color:#7c8093;font-style:italic;font-family:'Open Sans',sans-serif;font-size:13px} .sp-el[data-type=note]{color:#7c6a00;background:#fff8d6;border-radius:3px;padding:0 4px} .sp-el[data-type=page_break]{border-top:2px dashed var(--line);height:0;min-height:0;margin-top:16px} .sp-el:empty::before,.sp-el[data-type][data-empty="1"]::before{content:attr(data-ph);color:#c0c3d2;position:absolute;left:0;top:0;pointer-events:none;text-transform:none;font-weight:400} /* (doble [data-type] para ganar en especificidad a la regla genérica de arriba) */ .sp-el[data-type][data-type=transition][data-empty="1"]::before{left:auto;right:0} .sp-el[data-type][data-type=centered][data-empty="1"]::before{left:50%;transform:translateX(-50%)} .sp-el::after{content:attr(data-label);position:absolute;left:-120px;top:1px;width:104px;text-align:right;font:600 9.5px/14px 'Open Sans',sans-serif;letter-spacing:.5px;text-transform:uppercase;color:#b3b6c6;opacity:0;pointer-events:none;transition:opacity .12s} .sp-el[data-type=character]::after{left:-312px}.sp-el[data-type=parenthetical]::after{left:-264px}.sp-el[data-type=dialogue]::after,.sp-el[data-type=lyrics]::after{left:-216px} .sp-el:hover::after,.sp-el.focus::after{opacity:1} .sp-el.focus::after{color:var(--gc)} .sp-suggest{position:fixed;z-index:200;background:#fff;border:1px solid #e6e7ee;border-radius:6px;box-shadow:var(--shadow);min-width:220px;max-height:220px;overflow:auto;font-family:'Open Sans',sans-serif;font-size:13px} .sp-suggest div{padding:6px 12px;cursor:pointer;white-space:nowrap} /* la lista cuelga de , fuera del módulo: colores literales, no variables de .cs */ .sp-suggest div:hover{background:#f0f2ff} .sp-suggest div.on{background:#5d78ff;color:#fff;font-weight:600} .sp-suggest .sp-suggest-hint,.sp-suggest .sp-suggest-hint:hover{font-size:10px;color:#9a9da8;background:#f6f6f9;cursor:default;padding:4px 10px;border-top:1px solid #e6e7ee} /* ---------- Modo Fountain ---------- */ .sp-fountain{width:100%;min-height:720px;font-family:'Courier Prime','Courier New',monospace;font-size:14px;line-height:1.5;border:1px solid var(--line);border-radius:6px;padding:18px 22px;resize:vertical;background:#fff;color:#111} .sp-fountain:focus{outline:none;border-color:var(--accent)} /* ---------- Vista paginada ---------- */ .sp-pages{display:flex;flex-direction:column;gap:18px;align-items:center} .sp-page{position:relative;background:#fff;border:1px solid var(--line);box-shadow:0 2px 14px rgba(27,30,65,.08);font-family:'Courier Prime','Courier New',monospace;font-size:16px;line-height:16px;color:#111;overflow:hidden;flex-shrink:0} .sp-line{position:absolute;white-space:pre} .sp-line.sp-scene_heading{font-weight:700} .sp-line.sp-lyrics{font-style:italic} .sp-pnum{position:absolute} .sp-scenenum{color:#111} .sp-title{position:absolute;left:0;right:0;top:336px;text-align:center;display:flex;flex-direction:column;gap:32px} .sp-title b{font-weight:700} .sp-title-foot{position:absolute;left:144px;bottom:96px;white-space:pre-line} /* ---------- Lateral: riel de iconos + panel desplegable ---------- Franja fija de toda la altura en el borde derecho (bajo la cabecera pegajosa de CineShot): no se mueve con el scroll. El panel abierto se despliega junto al riel y el contenido (subcabecera, barra y página) deja libre esa columna. --sp-top lo fija csSpRailPlace(). */ .sp-wrap{display:block} .cs-guion{padding-right:80px;transition:padding-right .16s ease-out} .cs-guion.open{padding-right:420px} /* Barra de modos mínima (modos, tipo del bloque y extraer): tarjeta angosta centrada sobre la página, pegajosa bajo la subcabecera */ .cs-guion > .cs-toolbar{width:max-content;max-width:100%;margin:0 auto 16px;padding:5px 6px;gap:6px;border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow-sm);box-sizing:border-box} .cs-guion > .cs-toolbar .btn-sm{padding:5px 10px} .sp-typebar{max-width:190px} /* Subcabecera y barra de modos pegajosas bajo la cabecera: se esconden al bajar y vuelven en cuanto subes (csSpScrollWatch) */ .cs.sp-railed .cs-sub{position:sticky;top:var(--sp-stick,58px);z-index:5;transition:transform .18s ease-out,opacity .18s ease-out} .cs.sp-railed .cs-guion > .cs-toolbar{position:sticky;top:calc(var(--sp-stick,58px) + var(--sp-sub,50px) + 16px);z-index:5;transition:transform .18s ease-out,opacity .18s ease-out} /* la isla queda centrada: 16px bajo la subcabecera y 16px sobre la hoja, en reposo y al desplazar */ /* Con el panel abierto la isla se queda en el espacio libre (no se mete debajo del panel ni lo deforma): se parte en dos filas si hace falta */ .cs-guion.open > .cs-toolbar{justify-content:center} .cs-guion > .cs-toolbar{row-gap:6px;column-gap:10px;justify-content:center} /* La isla nunca se rompe en pedazos: tres grupos indivisibles (edición · modos · acciones) que, si no caben, bajan de fila enteros; y cuando el sitio es poco (panel abierto o pantalla angosta) los botones pasan a solo icono */ .sp-tb-g{display:flex;align-items:center;gap:6px;flex-wrap:nowrap;white-space:nowrap} .sp-tb-edit .sp-fmt,.sp-tb-edit .sp-undo{flex-wrap:nowrap} .sp-tb-txt{display:inline} .cs-guion > .cs-toolbar.compact .sp-tb-txt{display:none} .sp-tb-g{min-width:0;max-width:100%} .cs-guion > .cs-toolbar.compact .sp-tb-edit{flex:1 1 auto} .cs-guion > .cs-toolbar.compact .sp-typebar{flex:1 1 90px;min-width:0;max-width:170px} .cs-guion > .cs-toolbar.compact .sp-undo,.cs-guion > .cs-toolbar.compact .sp-fmt > :not(.keep){display:none} /* en compacto negrita, cursiva… y deshacer pasan al menú «Aa»; diálogo doble, alternativas y nota se quedan */ .cs-guion > .cs-toolbar.compact .sp-fmt{gap:2px} .sp-tb-more{display:none;width:28px;height:28px;font:700 12px/1 'Figtree',var(--font);color:var(--ink)} .cs-guion > .cs-toolbar.compact .sp-tb-more{display:inline-flex} .sp-tb-pop{display:flex;align-items:center;gap:8px;padding:4px 2px} .sp-tb-pop .sp-undo,.sp-tb-pop .sp-fmt{display:flex;gap:2px} .sp-tb-pop .sp-fmt{border-left:1px solid var(--line);padding-left:8px} .cs-guion > .cs-toolbar.compact{overflow:hidden} .cs-guion > .cs-toolbar.compact .btn{padding-left:8px;padding-right:8px} .cs.sp-railed.sp-hide .cs-sub,.cs.sp-railed.sp-hide .cs-guion > .cs-toolbar{transform:translateY(-130%);opacity:0;pointer-events:none} @media (prefers-reduced-motion:reduce){.cs.sp-railed .cs-sub,.cs.sp-railed .cs-guion > .cs-toolbar{transition:none}} .sp-side{position:static} /* Tarjeta flotante fija a la derecha, debajo de la subcabecera (no se mueve con el scroll) */ .sp-rail{position:fixed;right:28px;top:calc(var(--sp-top,58px) + var(--sp-sub,50px) + 16px);width:48px;max-height:calc(100vh - var(--sp-top,58px) - var(--sp-sub,50px) - 28px);display:flex;flex-direction:column;gap:2px;padding:5px;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow-sm);z-index:6;overflow:hidden auto;box-sizing:border-box} .sp-rail button{position:relative;width:36px;height:36px;border-radius:8px;display:grid;place-items:center;color:var(--ink-2);background:transparent;border:0;cursor:pointer;flex-shrink:0} .sp-rail button:hover{background:var(--paper);color:var(--ink)} .sp-rail button.on{background:color-mix(in srgb,var(--gc) 14%,#fff);color:var(--gc)} .sp-rail button:focus-visible{outline:2px solid var(--gc);outline-offset:1px} .sp-rail button em{position:absolute;top:3px;right:2px;min-width:15px;height:15px;padding:0 4px;border-radius:8px;background:var(--gc);color:#fff;font:800 9px/15px 'Open Sans',sans-serif;font-style:normal;text-align:center;box-sizing:border-box} .sp-rail button em.warn{background:#e0405a} .sp-rail hr{border:0;border-top:1px solid var(--line);margin:4px 6px;width:auto} .sp-rail button.danger:hover{background:#ffe1e5;color:#c62839} .cs-del-list{margin:0 0 10px;padding-left:20px;line-height:1.6} .sp-panel{position:fixed;right:88px;top:calc(var(--sp-top,58px) + var(--sp-sub,50px) + 16px);width:320px;max-height:calc(100vh - var(--sp-top,58px) - var(--sp-sub,50px) - 28px);display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 8px 28px rgba(27,30,65,.12);z-index:6;box-sizing:border-box;animation:sp-panel-in .16s ease-out} @keyframes sp-panel-in{from{opacity:0;transform:translateX(12px)}to{opacity:1;transform:none}} @media (prefers-reduced-motion:reduce){.sp-panel{animation:none}.cs-guion{transition:none}} .sp-panel-head{display:flex;align-items:center;gap:7px;padding:10px 8px 10px 14px;border-bottom:1px solid var(--line);font-size:13px;flex-shrink:0} .sp-panel-head .ic{color:var(--gc)} .sp-panel-head b{font-weight:700} .sp-panel-head small{color:var(--ink-2);font-size:11.5px;white-space:nowrap} .sp-panel-head .btn-sm{padding:4px 8px;font-size:11.5px} .sp-panel-head .icon-btn{width:26px;height:26px} .sp-panel-body{padding:12px 14px 14px;overflow:auto;min-height:0} .sp-panel-body .field{margin-bottom:8px} .sp-panel-body .field label{font-size:11px} .sp-panel-body .field input,.sp-panel-body .field select{padding:6px 8px;font-size:13px} .sp-panel-body .field input,.sp-panel-body .field select,.sp-panel-body .field textarea{width:100%;min-width:0;box-sizing:border-box} /* el panel mide 320px: nada lo ensancha */ .sp-panel-body .field textarea{min-height:0;padding:6px 8px;font-size:13px;font-family:inherit} .sp-panel-body .field-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px} .sp-panel-body .sp-def{display:block;font-size:10.5px;line-height:1.35;color:var(--ink-2);margin-top:3px} .sp-card .field{margin-bottom:8px} .sp-card .field label{font-size:11px} .sp-card .field input,.sp-card .field select{padding:6px 8px;font-size:13px} .sp-stat{display:grid;grid-template-columns:1fr auto;gap:5px 10px;font-size:12px;align-items:baseline} .sp-stat b{text-align:right;font-variant-numeric:tabular-nums} .sp-stat small{font-size:10px} .sp-chars{display:flex;flex-wrap:wrap;gap:4px;margin-top:10px} .sp-chars span{font-size:11px;background:var(--paper);border-radius:6px;padding:3px 7px} .sp-chars span b{font-weight:700;margin-right:2px} .sp-scenes{max-height:360px;overflow:auto;display:flex;flex-direction:column;gap:2px} .sp-scene{display:flex;gap:8px;align-items:center;padding:5px 6px;border-radius:6px;cursor:pointer;font-size:12px} .sp-scene:hover{background:var(--paper)} .sp-scene .h{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600} .sp-scene small{color:var(--ink-2);font-variant-numeric:tabular-nums} .sp-scene .ic{color:var(--gc)} /* Si no cabe la página junto al panel, el panel flota sobre ella en vez de quitarle sitio (evita el scroll horizontal) */ @media (max-width:1360px){.cs-guion.open{padding-right:80px}} /* el panel flota sobre la página; la isla se aparta de él (csSpToolbarFit le fija ancho y margen según dónde empiece el panel) */ /* ---------- Importar y exportar ---------- */ .cs-io-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:6px} .cs-io-card{display:flex;flex-direction:column;align-items:center;gap:6px;padding:18px 12px;border:1px solid var(--line,#e6e7ee);border-radius:8px;background:#fff;cursor:pointer;text-align:center;font-family:inherit} .cs-io-card:hover{border-color:#5d78ff;background:rgba(93,120,255,.06)} .cs-io-card .ic{color:#5d78ff} .cs-io-card b{font-size:13px}.cs-io-card small{color:#4b5066;font-size:11px;line-height:1.35} .cs-io-card.off{opacity:.45;cursor:not-allowed} .cs-io-formats{display:grid;grid-template-columns:repeat(2,1fr);gap:6px} .cs-io-fmt{display:flex;align-items:center;gap:9px;padding:8px 10px;border:1px solid var(--line,#e6e7ee);border-radius:6px;cursor:pointer;background:#fff} .cs-io-fmt input{margin:0} .cs-io-fmt b{font-size:13px;display:block}.cs-io-fmt small{color:#4b5066;font-size:11px;display:block;line-height:1.3} .cs-io-fmt.on{border-color:#5d78ff;background:rgba(93,120,255,.08)} .cs-io-fmt.off{opacity:.45;cursor:not-allowed} .cs-io-dest{display:flex;gap:6px;flex-wrap:wrap} .cs-io-dest .cs-io-fmt{flex:1;min-width:150px} .cs-io-dest .ic{color:#5d78ff} /* ---------- Ola azul: saltos de página en vivo, estado, números de escena, navegador, notas ---------- */ .sp-pagebreak{position:relative;margin:16px 0 0;border-top:1px dashed #b3b6c6;height:0;user-select:none} .sp-pagebreak span{position:absolute;right:-84px;width:80px;top:-9px;padding-left:8px;box-sizing:border-box;font:600 9px/16px 'Open Sans',sans-serif;letter-spacing:.4px;text-transform:uppercase;color:#b3b6c6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} /* rótulo en el margen derecho de la hoja, sin tocar el borde */ .sp-editor{position:relative} .sp-pagebreak.in{position:absolute;left:0;right:0;margin:0;pointer-events:none;z-index:1} .sp-pagebreak + .sp-el{margin-top:16px} .sp-status{position:sticky;bottom:10px;z-index:4;display:flex;gap:14px;align-items:center;padding:7px 18px;margin:12px auto 0;width:max-content;max-width:calc(100% - 40px);min-width:0;box-sizing:border-box;border-radius:999px;font-size:12px;color:#2a2d3a; /* Vidrio: desenfoque con saturación, cuerpo translúcido con degradado, brillo especular arriba, filo luminoso y sombra suave */ background:linear-gradient(180deg,rgba(255,255,255,.72) 0%,rgba(255,255,255,.42) 55%,rgba(255,255,255,.55) 100%)!important;border:1px solid rgba(255,255,255,.75)!important; box-shadow:inset 0 1px 0 rgba(255,255,255,.95),inset 0 -1px 0 rgba(27,30,65,.06),0 1px 2px rgba(27,30,65,.06),0 10px 30px rgba(27,30,65,.16); -webkit-backdrop-filter:blur(22px) saturate(200%) brightness(1.05);backdrop-filter:blur(22px) saturate(200%) brightness(1.05);overflow:hidden} .sp-status::before{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(115deg,rgba(255,255,255,.55) 0%,rgba(255,255,255,0) 38%,rgba(255,255,255,0) 62%,rgba(255,255,255,.25) 100%)} /* reflejo especular diagonal */ .sp-status::after{content:'';position:absolute;left:12%;right:12%;top:0;height:1px;border-radius:2px;pointer-events:none;background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.95),rgba(255,255,255,0))} /* filo de luz superior */ .sp-status > *{position:relative;z-index:1} @supports not (backdrop-filter:blur(1px)){.sp-status{background:rgba(255,255,255,.92)!important}} .sp-status span{display:inline-flex;align-items:center;gap:5px} .sp-status .grow{flex:0 0 18px} .sp-el[data-type=scene_heading][data-show]:not([data-empty="1"])::after{content:attr(data-show);opacity:1;color:#111;font:700 16px/16px 'Courier Prime','Courier New',monospace;letter-spacing:0;text-transform:none;left:-64px;width:48px} .sp-el[data-type=scene_heading][data-show]:not([data-empty="1"])::before{content:attr(data-show);position:absolute;right:-70px;left:auto;top:0;color:#111;font-weight:700;pointer-events:none} .sp-editor.hide-notes .sp-el[data-type=note]{display:none} .sp-el[data-type=note]::after{content:'Nota'} .sp-el[data-type=note][data-cap]::after{content:attr(data-cap)} .sp-note{display:flex;flex-direction:column;gap:2px}.sp-note .sp-note-who{color:var(--ink-2);font-size:10.5px;font-weight:600}.sp-note .sp-note-target{display:flex;align-items:center;gap:4px;color:var(--ink-2);font-size:10.5px;font-family:'Courier Prime','Courier New',monospace} .sp-nav-search{margin:0 0 8px;min-width:0} .sp-nav{display:flex;flex-direction:column;gap:4px} .sp-nav-sec{font-size:10px;font-weight:800;letter-spacing:.8px;text-transform:uppercase;color:var(--accent);padding:8px 4px 2px} .sp-nav-card{display:flex;gap:8px;align-items:flex-start;padding:7px 8px;border:1px solid var(--line);border-radius:6px;cursor:pointer;background:#fff;font-size:12px} .sp-nav-card:hover{border-color:var(--accent)} .sp-nav-card{position:relative} .sp-nav-card.over-top::before,.sp-nav-card.over-bottom::after{content:'';position:absolute;left:-2px;right:-2px;height:3px;border-radius:2px;background:var(--gc);box-shadow:0 0 0 2px #fff} .sp-nav-card.over-top::before{top:-5px}.sp-nav-card.over-bottom::after{bottom:-5px} .sp-nav-card .b{flex:1;min-width:0} .sp-nav-card .h{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .sp-nav-card .s{color:var(--ink-2);font-size:11px;line-height:1.35;margin-top:2px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden} .sp-nav-card .m{display:flex;flex-wrap:wrap;gap:3px;align-items:center;margin-top:4px} .sp-nav-card .m em{font-style:normal;font-size:10px;font-weight:700;background:var(--paper);border-radius:6px;padding:1px 5px} .sp-nav-card .m small{color:var(--ink-2);font-size:10px;margin-left:auto;white-space:nowrap} .sp-nav-card .ic{color:var(--gc);flex-shrink:0;margin-top:2px} .sp-toggle{font-size:11px;font-weight:400;color:var(--ink-2);display:inline-flex;align-items:center;gap:4px;cursor:pointer} .sp-notes{display:flex;flex-direction:column;gap:4px} .sp-note{display:grid;grid-template-columns:1fr auto;gap:2px 6px;padding:6px 8px;border-radius:6px;background:#fff8d6;cursor:pointer;font-size:12px;color:#5b4a00;align-items:center} .sp-note span{grid-column:1}.sp-note small{grid-column:1;color:#8a7a2a;font-size:10px}.sp-note .icon-btn{grid-column:2;grid-row:1/3;width:20px;height:20px} .sp-issues{display:flex;flex-direction:column;gap:4px} .sp-issue{display:flex;gap:8px;align-items:center;padding:8px 10px;border-radius:6px;background:var(--bg);cursor:pointer;font-size:13px} .sp-issue:hover{background:rgba(93,120,255,.1)} .sp-issue .ic{color:#e0405a;flex-shrink:0}.sp-issue span{flex:1}.sp-issue small{color:var(--muted)} /* ---------- Ola rosa: revisiones de color, numeración bloqueada, versiones, portada completa ---------- */ .sp-el[data-rev]::before{content:'*';position:absolute;right:-40px;left:auto;top:0;color:#111;font-weight:700;pointer-events:none;text-transform:none} .sp-el[data-rev][data-type=character]::before{right:-117px} .sp-el[data-rev][data-type=parenthetical]::before{right:-232px} .sp-el[data-rev][data-type=dialogue]::before,.sp-el[data-rev][data-type=lyrics]::before{right:-184px} .sp-el[data-rev][data-type=scene_heading][data-show]:not([data-empty="1"])::before{content:attr(data-show) ' *';right:-86px} .sp-el[data-rev][data-type=note]::before{content:none} .sp-sec-title{font-size:10px;font-weight:800;letter-spacing:.8px;text-transform:uppercase;color:var(--ink-2);margin:12px 0 6px} .sp-panel-body > .sp-sec-title:first-child{margin-top:0} .sp-rev-card{border:1px solid var(--line);border-radius:8px;padding:10px 12px;display:flex;flex-direction:column;gap:8px;background:#fff} .sp-rev-head{display:flex;align-items:center;gap:7px;font-size:13px} .sp-rev-head small{color:var(--ink-2);font-size:11px;margin-left:auto;white-space:nowrap} .sp-rev-head .ic{color:var(--gc)} .sp-rev-actions{display:flex;gap:6px;flex-wrap:wrap} .sp-rev-row{display:flex;gap:6px;align-items:center} .sp-rev-row input{flex:1;min-width:0;padding:6px 8px;font-size:12.5px;border:1px solid var(--line);border-radius:6px;font-family:inherit} .sp-rev-hist{display:flex;flex-direction:column;gap:3px;margin-top:8px;font-size:12px} .sp-rev-hist small{color:var(--ink-2);font-size:11px} .sp-swatch{width:14px;height:14px;border-radius:4px;border:1px solid rgba(0,0,0,.15);display:inline-block;vertical-align:-2px;flex-shrink:0} .sp-star{font-family:'Courier Prime','Courier New',monospace;font-weight:700;color:var(--gc);width:12px;text-align:center;flex-shrink:0} .sp-vers{display:flex;flex-direction:column;gap:2px;margin-top:8px} .sp-ver{display:flex;align-items:center;gap:6px;padding:6px 8px;border-radius:6px;font-size:12px} .sp-ver:hover{background:var(--paper)} .sp-ver.cur{background:color-mix(in srgb,var(--gc) 8%,#fff)} .sp-ver .b{flex:1;min-width:0} .sp-ver .b b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .sp-ver .b small{color:var(--ink-2);font-size:10.5px} .sp-ver .icon-btn{width:24px;height:24px} .sp-ver .icon-btn:disabled{opacity:.35;cursor:default} .sp-diff{font-family:'Courier Prime','Courier New',monospace;font-size:12px;line-height:1.45;white-space:pre-wrap;word-break:break-word;max-height:60vh;overflow:auto;background:#fff;border:1px solid var(--line,#e6e7ee);border-radius:6px;padding:8px 10px} .sp-diff div{padding:0 6px;border-radius:3px;min-height:1.45em} .sp-diff .add{background:#dcf5e3} .sp-diff .del{background:#ffdcdc;text-decoration:line-through;color:#7a1f1f} .sp-diff .ctx{color:#6b6e78} .sp-diff .gap{color:#b3b6c6;text-align:center} .sp-nav-card.omitted{opacity:.7} .sp-nav-card.omitted .h{color:var(--ink-2);font-style:italic} .sp-nav-card .h .sp-omit{float:right;width:20px;height:20px;margin:-2px 0 0 4px;opacity:0} .sp-nav-card:hover .h .sp-omit{opacity:1} .sp-line.sp-rev{font-weight:700} .sp-phead{position:absolute;font-size:16px;white-space:nowrap} .sp-page.revised{border-color:rgba(0,0,0,.12)} .sp-title-foot-r{left:auto;right:96px;text-align:right} .sp-title-notes{position:absolute;left:144px;bottom:180px;white-space:pre-line;font-size:13px;color:#444} .cs-io-opts{display:flex;flex-wrap:wrap;gap:6px 16px;align-items:center;margin-top:8px;padding:8px 10px;border:1px dashed var(--line,#e6e7ee);border-radius:6px;font-size:12.5px} .cs-io-opts label{display:inline-flex;align-items:center;gap:5px;cursor:pointer} .cs-io-opts label.wm{flex:1;min-width:220px} .cs-io-opts label.wm input{flex:1;padding:5px 8px;font-size:12.5px;border:1px solid var(--line,#e6e7ee);border-radius:6px;font-family:inherit} .cs-io-opts small{flex-basis:100%;font-size:11px} /* ---------- Barra de modos: deshacer/rehacer, tipo, modos, versión de trabajo y publicar ---------- */ .sp-undo{display:flex;gap:1px;padding-right:4px;border-right:1px solid var(--line);margin-right:2px} .sp-undo .icon-btn{width:28px;height:28px} .sp-undo .icon-btn:disabled{opacity:.3;cursor:default} .sp-vchip{font-weight:800;font-size:12px;letter-spacing:.3px;padding:4px 9px;border-radius:6px;background:color-mix(in srgb,var(--gc) 12%,#fff);color:var(--gc);cursor:default;white-space:nowrap} .sp-change .icon-btn{width:22px;height:22px;flex-shrink:0;opacity:.55} .sp-change:hover .icon-btn{opacity:1} .sp-change .icon-btn.ok:hover{background:#dcf5e3;color:#08875f} /* ---------- Formato en línea y avisos ignorados ---------- */ .sp-fmt{display:flex;gap:1px;padding:0 4px;border-left:1px solid var(--line);border-right:1px solid var(--line);margin:0 2px} /* mismo tamaño que el resto de iconos, pero trazo más grueso y tinta más oscura para que se lean bien; la B de negrita, aún más */ .sp-fmt .icon-btn{width:28px;height:28px;color:var(--ink);border-radius:6px} .sp-fmt .icon-btn svg{stroke-width:2.6} .sp-fmt .icon-btn.fb svg{stroke-width:3.2} .sp-fmt .icon-btn:hover{background:var(--paper);color:var(--gc)} .sp-el b{font-weight:700}.sp-el i{font-style:italic}.sp-el u{text-decoration:underline}.sp-el s{text-decoration:line-through} .sp-line b{font-weight:700}.sp-line i{font-style:italic}.sp-line u{text-decoration:underline}.sp-line s{text-decoration:line-through} .sp-issue.ignored{opacity:.6} .sp-issue.ignored .ic{color:var(--ink-2)} /* ---------- Ola verde: buscar y reemplazar, alternativas, diálogo doble, máquina de escribir, enfoque y lectura ---------- */ .sp-fmt .icon-btn.on{background:color-mix(in srgb,var(--gc) 14%,#fff);color:var(--gc)} .sp-fmt .icon-btn:disabled{opacity:.35;cursor:default;background:transparent} .sp-fmt-sep{width:1px;background:var(--line);margin:4px 3px} ::highlight(sp-find){background:#ffe58a;color:#111} ::highlight(sp-find-cur){background:#ff9f43;color:#111} .sp-find .pop-input{padding:0;margin-bottom:8px} .sp-find .pop-input .icon-btn{width:28px;height:28px} .sp-find-meta{font-size:11.5px;color:var(--ink-2);min-height:16px;margin:-4px 0 6px} .sp-find-opts{display:flex;flex-wrap:wrap;gap:6px 14px;margin-bottom:8px;font-size:12px} .sp-find-actions{display:flex;gap:6px;margin-bottom:10px} .sp-find-list{display:flex;flex-direction:column;gap:3px} .sp-find-hit{padding:5px 8px;border-radius:6px;cursor:pointer;font-size:12px;line-height:1.35;background:var(--paper)} .sp-find-hit:hover{background:#eef0ff} .sp-find-hit.on{background:color-mix(in srgb,var(--gc) 14%,#fff)} .sp-find-hit small{display:block;color:var(--ink-2);font-size:10px;margin-bottom:1px} .sp-find-hit mark{background:#ffe58a;color:inherit;border-radius:2px;padding:0 1px} .sp-el[data-type=dialogue][data-alts]{box-shadow:-9px 0 0 -7px var(--gc)} .sp-paper{position:relative} .sp-badges{position:absolute;inset:0;pointer-events:none} .sp-alt-badge{position:absolute;pointer-events:auto;display:inline-flex;align-items:center;gap:3px;height:18px;padding:0 7px 0 5px;border-radius:9px;border:1px solid color-mix(in srgb,var(--gc) 40%,#fff);background:color-mix(in srgb,var(--gc) 12%,#fff);color:var(--gc);font:700 10.5px/16px 'Open Sans',sans-serif;cursor:pointer;white-space:nowrap} .sp-alt-badge:hover{background:var(--gc);color:#fff} .sp-alt-badge:focus-visible{outline:2px solid var(--gc);outline-offset:1px} .sp-alt-hint{margin:0 0 6px;font-size:11.5px;line-height:1.4;color:var(--ink-2)} .sp-alt-stats{margin-top:12px;border-top:1px solid var(--line);padding-top:8px} .sp-alt-row{display:grid;grid-template-columns:auto auto 1fr auto;gap:2px 6px;align-items:center;padding:5px 8px;border-radius:6px;cursor:pointer;font-size:12px} .sp-alt-row:hover{background:var(--paper)} .sp-alt-row b{color:var(--gc);font-size:11px} .sp-alt-row small{color:var(--ink-2);font-size:10px} .sp-alt-row span{grid-column:1/4;color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .sp-alt-row em{grid-row:1/3;font-style:normal;font-weight:800;color:var(--gc);background:color-mix(in srgb,var(--gc) 12%,#fff);border-radius:8px;padding:0 6px;font-size:10.5px} .sp-alts{display:flex;flex-direction:column;gap:4px;padding:2px 4px 4px;width:316px;max-width:calc(100vw - 40px);box-sizing:border-box} /* cabe en el popover (máx. 340px con su relleno) */ .sp-alt{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:4px 6px;align-items:center;padding:6px 8px;border-radius:6px;background:var(--paper);font-size:12.5px;line-height:1.4} .sp-alt.cur{background:color-mix(in srgb,var(--gc) 12%,#fff);grid-template-columns:minmax(0,1fr) auto} .sp-alt span{min-width:0;overflow-wrap:anywhere} .sp-alt .btn{white-space:nowrap;padding:3px 8px} .sp-alt small{color:var(--ink-2);font-size:10.5px;white-space:nowrap} .sp-alt .icon-btn{width:22px;height:22px} .sp-alts .pop-input{padding:0;margin-top:4px} /* Enfoque («luces apagadas»): un velo oscuro uniforme cubre toda la interfaz y solo la hoja queda encima, iluminada. El velo es un pseudoelemento fijo del contenedor de scroll (#view en el CPM, #cs-root en la app independiente) y no captura clics; la hoja, la barra de formato, el riel, el panel y la barra de estado suben por encima con z-index (ningún ancestro crea contexto de apilamiento: #view es relative sin z-index). Por debajo de modales (900), menús (1000) y avisos (1100). */ body:has(.sp-editor.sp-focus) :is(#view,#cs-root)::before{content:'';position:fixed;inset:0;background:rgba(14,15,20,.86);z-index:700;pointer-events:none;animation:sp-focus-in .3s ease-out} @keyframes sp-focus-in{from{opacity:0}to{opacity:1}} body:has(.sp-editor.sp-focus) .sp-paper{z-index:701;border-color:transparent;box-shadow:0 0 0 1px rgba(255,255,255,.05),0 24px 80px rgba(0,0,0,.6)} body:has(.sp-editor.sp-focus) .sp-status{position:relative;z-index:701} body:has(.sp-editor.sp-focus) :is(.sp-rail,.sp-panel){z-index:702} body:has(.sp-editor.sp-focus) .sp-rail{opacity:.55;transition:opacity .2s ease} body:has(.sp-editor.sp-focus) .sp-rail:hover{opacity:1} /* La cabecera y la subcabecera de CineShot (pegajosas) quedan ocultas bajo el velo: la hoja ocupa toda la altura y no se ve nada a medias; conservan su sitio para que el riel y la barra no se muevan */ body:has(.sp-editor.sp-focus) :is(.cs-top,.cs-sub){visibility:hidden} body:has(.sp-editor.sp-focus) .cs.sp-railed .cs-guion > .cs-toolbar{z-index:703} body:has(.sp-editor.sp-focus) .cs-guion:not(.open) .cs-toolbar{z-index:703;position:sticky} .sp-el.reading{background:#fff3c4;box-shadow:0 0 0 4px #fff3c4;border-radius:2px} .sp-read-ctrl{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-bottom:10px} .sp-read-ctrl input[type=range]{width:78px} .sp-read-now{min-height:38px;padding:8px 10px;border-radius:6px;background:var(--paper);font-size:12.5px;line-height:1.4;margin-bottom:8px;display:flex;flex-direction:column;gap:2px} .sp-read-now b{color:var(--gc);font-size:11px;letter-spacing:.4px} .sp-read-voices{display:flex;flex-direction:column;gap:4px;margin-top:6px} .sp-read-row{display:grid;grid-template-columns:1fr 150px;gap:6px;align-items:center;font-size:12px} .sp-read-row.head{font-weight:700;padding-bottom:4px;border-bottom:1px solid var(--line);margin-bottom:2px} .sp-read-row .cs-select-sm{min-width:0;width:100%} @media (prefers-reduced-motion:reduce){body:has(.sp-editor.sp-focus) :is(#view,#cs-root)::before{animation:none}body:has(.sp-editor.sp-focus) .sp-rail{transition:none}} /* ---------- Etapa oro: formatos de guion, páginas bloqueadas, presencia ---------- */ .sp-editor[data-format=stage] .sp-el[data-type=character]{text-align:center} .sp-editor[data-format=stage] .sp-el[data-type=action]{font-style:italic} .sp-editor[data-format=tv_multi] .sp-el[data-type=scene_heading]{text-decoration:underline} .sp-editor[data-format=tv_multi] .sp-el[data-type=action]{text-transform:uppercase} .sp-editor[data-format=tv_multi] .sp-el[data-type=dialogue],.sp-editor[data-format=tv_multi] .sp-el[data-type=lyrics]{line-height:32px} .sp-editor[data-format=tv_single] .sp-el[data-type=section],.sp-editor[data-format=tv_multi] .sp-el[data-type=section],.sp-editor[data-format=stage] .sp-el[data-type=section]{text-align:center;text-transform:uppercase;text-decoration:underline;font-family:'Courier Prime','Courier New',monospace;font-size:16px;color:var(--ink)} .sp-editor[data-format=av] .sp-el[data-type=action][data-empty="1"]::before{content:'Video…'} .sp-editor[data-format=av] .sp-el[data-type=dialogue][data-empty="1"]::before{content:'Audio…'} .sp-editor[data-format=av] .sp-el[data-type=character][data-empty="1"]::before{content:'VOZ / LOCUTOR'} .sp-editor[data-format=av] .sp-el[data-type=character] + .sp-el,.sp-editor[data-format=av] .sp-el[data-type=action] + .sp-el[data-type=character]{margin-top:4px} .sp-line.sp-ul{text-decoration:underline} .sp-line.sp-section{font-weight:700} .sp-line.sp-colhead{font-weight:700;letter-spacing:1px} .sp-who{display:inline-flex;align-items:center;gap:5px;padding:1px 8px;border-radius:9px;background:color-mix(in srgb,var(--gc) 12%,#fff);color:var(--gc);font-weight:700;font-size:11px} .sp-who i{width:7px;height:7px;border-radius:50%;background:var(--gc)} .sp-el[data-type=scene_heading][data-who]:not([data-empty="1"])::before{content:attr(data-who);position:absolute;right:0;top:-17px;font:700 9.5px/14px 'Open Sans',sans-serif;letter-spacing:.3px;text-transform:none;color:#fff;background:var(--gc);border-radius:7px;padding:0 6px;pointer-events:none} /* ---------- Enlace de lectura: enlaces, comentarios recibidos y marcas junto al texto ---------- */ .sp-share{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px;align-items:center;padding:8px 10px;border-radius:8px;background:var(--paper);margin-bottom:6px} .sp-share.off{opacity:.6} .sp-share .b b{display:block;font-size:12.5px}.sp-share .b small{display:block;color:var(--ink-2);font-size:10.5px;line-height:1.4} .sp-share-actions{display:flex;gap:2px}.sp-share-actions .icon-btn{width:24px;height:24px} .sp-share-new{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px;align-items:center;margin:6px 0 4px} .sp-share-new input[type=text],.sp-share-new input:not([type]){min-width:0;border:1px solid var(--line);border-radius:6px;padding:6px 8px;font-size:12.5px} .sp-mode-sm{margin-left:8px;font-weight:600;font-size:11px}.sp-mode-sm button{padding:2px 8px} .sp-cms{display:flex;flex-direction:column;gap:6px} .sp-cm{padding:8px 10px;border-radius:8px;background:#fff8e1;border:1px solid #f3e4b0;font-size:12.5px;line-height:1.45} .sp-cm.done{background:var(--paper);border-color:var(--line);opacity:.85} .sp-cm-head{display:flex;justify-content:space-between;gap:8px;align-items:baseline}.sp-cm-head b{font-size:12px}.sp-cm-head small{color:var(--ink-2);font-size:10.5px;white-space:nowrap}.sp-cm-head em{font-style:normal;color:#b06d00} .sp-cm-quote{margin:4px 0;padding:2px 8px;border-left:3px solid #e0b400;font-family:'Courier Prime','Courier New',monospace;font-size:11.5px;color:var(--ink-2);cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .sp-cm-text{margin:2px 0} .sp-cm-reply{margin-top:6px;padding:5px 8px;border-radius:6px;background:#fff;border:1px solid var(--line);font-size:12px}.sp-cm-reply b{display:block;font-size:10px;letter-spacing:.4px;text-transform:uppercase;color:var(--gc);margin-bottom:2px} .sp-cm-actions{display:flex;gap:4px;margin-top:6px;flex-wrap:wrap} .sp-cm-pop{gap:6px}.sp-cm-pop .sp-cm{max-width:340px} .sp-cm-badge{position:absolute;pointer-events:auto;display:inline-flex;align-items:center;gap:3px;height:18px;padding:0 7px 0 5px;border-radius:9px;border:1px solid #e6c463;background:#fff3c4;color:#8a5a00;font:700 10.5px/16px 'Open Sans',sans-serif;cursor:pointer;white-space:nowrap} .sp-cm-badge:hover{background:#e0b400;color:#fff} /* ---------- Ventana «Compartir» ---------- */ .sp-share-modal{--gc:#ff9d00;--ink:#1b1c21;--ink-2:#4b5066;--line:#e6e7ee;--paper:#f6f6f9} /* la ventana vive fuera de .cs: sus variables se declaran aquí */ .sp-share-hero{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:center;padding:14px 16px;border-radius:12px;background:linear-gradient(135deg,color-mix(in srgb,var(--gc) 10%,#fff),color-mix(in srgb,#2d7ff9 8%,#fff));border:1px solid color-mix(in srgb,var(--gc) 22%,#fff);margin-bottom:12px;animation:sp-rise .35s ease-out both} /* La ilustración cuenta el flujo: la página se escribe, llegan los comentarios y el enlace late */ .sp-share-art svg{display:block;overflow:visible} .sp-share-art .a-page{animation:sp-rise .5s ease-out both} .sp-share-art .a-ln{fill:#cfd2dc;transform-box:fill-box;transform-origin:left center;animation:sp-grow .45s ease-out both} .sp-share-art .a-ln:nth-of-type(2){animation-delay:.15s}.sp-share-art .a-ln:nth-of-type(3){animation-delay:.25s}.sp-share-art .a-ln:nth-of-type(4){animation-delay:.35s}.sp-share-art .a-ln:nth-of-type(5){animation-delay:.45s}.sp-share-art .a-ln:nth-of-type(6){animation-delay:.55s}.sp-share-art .a-ln:nth-of-type(7){animation-delay:.65s}.sp-share-art .a-ln:nth-of-type(8){animation-delay:.75s} .sp-share-art .a-hl{opacity:0;animation:sp-fade-in .4s ease-out 1s both;--sp-o:.16} .sp-share-art .a-bub{transform-box:fill-box;transform-origin:20% 100%;animation:sp-pop .5s cubic-bezier(.2,.9,.3,1.35) 1.15s both,sp-float 3.4s ease-in-out 1.7s infinite} .sp-share-art .a-bub2{transform-origin:80% 100%;animation-delay:1.55s,2.1s} .sp-share-art .a-link{transform-box:fill-box;transform-origin:center;animation:sp-pop .45s cubic-bezier(.2,.9,.3,1.35) .6s both} .sp-share-art .a-ring{transform-box:fill-box;transform-origin:center;opacity:0;animation:sp-ring 2.4s ease-out 1.9s infinite} @keyframes sp-rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}} @keyframes sp-grow{from{transform:scaleX(0)}to{transform:scaleX(1)}} @keyframes sp-fade-in{to{opacity:var(--sp-o,1)}} @keyframes sp-pop{from{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}} @keyframes sp-float{0%,100%{translate:0 0}50%{translate:0 -3px}} @keyframes sp-ring{0%{opacity:.75;transform:scale(1)}100%{opacity:0;transform:scale(2.3)}} .sp-live{display:inline-block;width:7px;height:7px;border-radius:50%;background:#0aa870;margin:0 6px 1px 0;box-shadow:0 0 0 0 rgba(10,168,112,.45);animation:sp-live 2s ease-out infinite} @keyframes sp-live{0%{box-shadow:0 0 0 0 rgba(10,168,112,.45)}70%{box-shadow:0 0 0 7px rgba(10,168,112,0)}100%{box-shadow:0 0 0 0 rgba(10,168,112,0)}} .sp-share-modal .sp-share-btns .btn{transition:transform .15s ease,box-shadow .15s ease,background .15s ease} .sp-share-modal .sp-share-btns .btn:hover{transform:translateY(-1px);box-shadow:0 6px 16px rgba(27,30,65,.14)} .sp-share-modal .sp-share-btns .btn-primary:hover{box-shadow:0 8px 18px rgba(45,127,249,.28)} .sp-share-modal .sp-share-copy.done{background:#e6f7ef;border-color:#0aa870;color:#0a7a52} @media (prefers-reduced-motion:reduce){.sp-share-hero,.sp-share-card,.sp-share-art *,.sp-live{animation:none!important;opacity:1}.sp-share-art .a-ring{display:none}.sp-share-modal .sp-share-btns .btn{transition:none}} .sp-share-hero h3{margin:0 0 8px;font-size:15px;color:var(--gc)} .sp-share-hero ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:5px;font-size:12.5px;line-height:1.45} .sp-share-hero li{display:flex;gap:7px;align-items:flex-start}.sp-share-hero li .ic{color:var(--gc);flex-shrink:0;margin-top:2px} .sp-share-art{display:flex;align-items:flex-end;gap:2px;color:color-mix(in srgb,var(--gc) 55%,#fff)} .sp-share-card{padding:12px 14px;border-radius:10px;background:var(--paper);border:1px solid var(--line);margin-bottom:10px;display:flex;flex-direction:column;gap:10px;animation:sp-rise .4s ease-out .08s both} .sp-share-card.new > b{font-size:12px;letter-spacing:.4px;text-transform:uppercase;color:var(--ink-2)} .sp-share-sel{display:flex;flex-direction:column;gap:3px}.sp-share-title{font-family:'Figtree',var(--font);font-weight:800;font-size:16px;letter-spacing:-.1px;color:var(--ink)} .sp-share-sel select{width:100%;font-weight:400;font-size:13px;color:var(--ink-2);padding:7px 10px;border:1px solid var(--line);border-radius:8px;background:#fff}.sp-share-sel small{color:var(--ink-2);font-size:11.5px} .sp-share-btns{display:flex;gap:8px;flex-wrap:wrap} .sp-share-links{display:flex;gap:4px 14px;flex-wrap:wrap} .sp-share-links .lnk{display:inline-flex;align-items:center;gap:5px;border:0;background:transparent;padding:2px 0;font:600 12px 'Open Sans',sans-serif;color:var(--gc);cursor:pointer} .sp-share-links .lnk:hover{text-decoration:underline}.sp-share-links .lnk.danger{color:#c62839} .sp-share-modal .sp-share-new{grid-template-columns:minmax(0,1fr) auto} /* Botón azul «Compartir» de la barra y botón principal azul de la ventana */ .sp-share-btn{background:#2d7ff9;border-color:#2d7ff9;color:#fff;font-weight:700} .sp-share-btn:hover{background:#1f6fe0;border-color:#1f6fe0;color:#fff} .sp-share-btn:disabled{opacity:.45} .sp-share-modal .sp-share-btns .btn-primary{background:#2d7ff9;border-color:#2d7ff9} .sp-share-modal .sp-share-btns .btn-primary:hover{background:#1f6fe0;border-color:#1f6fe0} /* Quién puede abrir el enlace */ .sp-share-access{display:flex;flex-direction:column;gap:6px;margin-top:6px} .sp-share-access label{display:flex;flex-direction:column;gap:3px;font-size:11.5px;font-weight:600;color:var(--ink-2)} .sp-share-access select{font-size:12.5px;padding:6px 8px;border:1px solid var(--line);border-radius:6px;background:#fff} .sp-share-access textarea{width:100%;box-sizing:border-box;border:1px solid var(--line);border-radius:6px;padding:6px 8px;font:12.5px 'Open Sans',sans-serif;resize:vertical} .sp-share-who{display:flex;align-items:center;gap:5px;margin-top:4px;color:var(--ink);font-weight:600} .sp-share-who .ic{color:var(--gc)} .sp-share-behind{color:#b06d00;font-weight:600} .sp-share-title .sp-share-ver{display:inline-flex;align-items:center;vertical-align:middle;margin-left:8px;padding:2px 8px;border-radius:7px;background:color-mix(in srgb,var(--gc) 12%,#fff);color:var(--gc);font:700 11px var(--font);letter-spacing:.3px;white-space:nowrap} .sp-share-others{display:flex;gap:6px;align-items:flex-start;font-size:11.5px;line-height:1.45;color:var(--ink-2);padding:6px 0 0} .sp-share-others .ic{flex-shrink:0;margin-top:2px;color:#b06d00} .sp-share-others .lnk{border:0;background:transparent;padding:0;font:600 11.5px 'Open Sans',sans-serif;color:var(--gc);cursor:pointer}.sp-share-others .lnk:hover{text-decoration:underline} .sp-share-card .sp-share-others{border-top:1px solid var(--line);margin-top:2px} .sp-share-publish{background:var(--gc);border-color:var(--gc)} .sp-share-actions .icon-btn.warn{color:#b06d00} /* Zoom de páginas (modo Páginas): −, porcentaje o «Ajustar», + */ .sp-zoom{position:fixed;right:calc(88px + 14px);bottom:16px;z-index:6;display:inline-flex;align-items:center;gap:1px;padding:3px 4px;border-radius:999px;border:1px solid rgba(255,255,255,.75);background:linear-gradient(180deg,rgba(255,255,255,.75),rgba(255,255,255,.5));-webkit-backdrop-filter:blur(18px) saturate(180%);backdrop-filter:blur(18px) saturate(180%);box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 6px 20px rgba(27,30,65,.14);opacity:.85;transition:opacity .15s} .sp-zoom:hover{opacity:1} .sp-zoom .icon-btn{width:24px;height:24px;border-radius:50%} body:has(.sp-editor.sp-focus) .sp-zoom{z-index:704} .sp-zoom-val{border:0;background:transparent;min-width:56px;padding:2px 6px;font:600 11.5px 'Open Sans',sans-serif;font-variant-numeric:tabular-nums;color:var(--ink);cursor:pointer;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;gap:3px} .sp-zoom-val:hover{background:var(--paper);color:var(--ink)} .sp-rev-lock{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--ink-2)}.sp-rev-lock input{margin:0} /* Cambios de la revisión en el panel: antes/después por palabras, tipo y autor */ .sp-change-body{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1} .sp-change-kind{color:var(--ink-2);font-size:10.5px} .sp-change-text{font-family:'Courier Prime','Courier New',monospace;font-size:12px;line-height:1.35;white-space:pre-wrap;word-break:break-word} .sp-change-text ins{text-decoration:none;border-radius:2px;padding:0 1px;font-weight:700} .sp-change-text del,.sp-alt-hint del{color:#c62839;text-decoration:line-through} .sp-issues .sp-issue.sp-change{align-items:flex-start} /* Texto revisado en el color de la revisión (editor y Páginas), como en los programas profesionales */ .sp-editor .sp-el[data-rev]{color:var(--rev-ink,#111)} .sp-pages .sp-line.revised-ink{color:var(--rev-ink,#111)} .sp-rev-view{margin:-2px 0 8px}.sp-rev-view .sp-mode{width:100%}.sp-rev-view .sp-mode button{flex:1;justify-content:center} /* Vista limpia: sin colores, encabezados ni asteriscos de revisión (la revisión sigue abierta y anotando) */ .cs.rev-clean .sp-el[data-rev]::before{content:none} .cs.rev-clean .sp-el[data-rev][data-type=scene_heading][data-show]:not([data-empty="1"])::before{content:attr(data-show)} .cs.rev-clean .sp-pages .sp-line.sp-rev{display:none} .cs.rev-clean .sp-editor .sp-el[data-rev]{color:#111} .sp-nav-legend{display:flex;align-items:center;gap:10px;font-size:9.5px;letter-spacing:.2px;color:var(--ink-2);margin:2px 0 6px;white-space:nowrap}.sp-nav-legend span{display:inline-flex;align-items:center;gap:3px}.sp-nav-legend .ic{color:var(--ink-2)} .sp-nav-sync{display:inline-flex;color:var(--ink-2);opacity:.6}.sp-nav-sync.ok{color:#0aa870;opacity:1} /* Escena omitida: no aparece en el editor (sigue en el texto, en Páginas y en el PDF como línea OMITIDA con su número) */ .sp-editor .sp-el[data-omitted]{display:none} .sp-nav-card.omitted{opacity:.55} /* Paleta de color de letra */ .sp-colors{display:flex;gap:6px;padding:6px 8px} .sp-color{width:22px;height:22px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px var(--line);cursor:pointer} .sp-color.none{background:#fff;display:grid;place-items:center;color:var(--ink-2)} .sp-color:hover{transform:scale(1.12)} /* Acciones de la isla, más discretas: versión, compartir y PDF */ .cs-guion > .cs-toolbar .sp-tb-mini{padding:3px 6px;font-size:11px;font-weight:600;border-radius:6px;min-height:0;line-height:1.3;gap:3px;letter-spacing:0} .cs-guion > .cs-toolbar .sp-tb-mini .ic{width:12px;height:12px} .cs-guion > .cs-toolbar.compact .sp-tb-mini{padding:3px 6px}