/* =====================================================================
   Kids Fun Knowledge · Planeador de Experimentos
   Estilos: shell + escalado Carta + 3 skins (cuaderno / cómic / app)
   ===================================================================== */

/* ---------- Tokens de marca ---------- */
:root{
  --blue:#3DB5D4;  --blue-d:#2A93B0;  --blue-l:#D7F0F6;
  --orange:#F4972A; --orange-d:#E07C12; --orange-l:#FDEBD3;
  --ink:#33414A;   --ink-soft:#6A7882;
  --green:#4FA86A; --navy:#5B6BC0; --teal:#62C3D4; --maroon:#8E2C4E;
  --paper:#FBF6EA;
  --pageW:816px;   --pageH:1056px;
  --f-head:"Fredoka", system-ui, sans-serif;
  --f-body:"Nunito", system-ui, sans-serif;
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  font-family:var(--f-body);
  color:var(--ink);
  background:#E9ECF1;
  -webkit-print-color-adjust:exact; print-color-adjust:exact;
}

/* =====================================================================
   TOOLBAR  (oculta al imprimir)
   ===================================================================== */
.toolbar{
  position:sticky; top:0; z-index:50;
  display:flex; align-items:center; gap:18px; flex-wrap:wrap;
  padding:12px 20px;
  background:#fff;
  border-bottom:2px solid #E3E8EE;
  box-shadow:0 2px 14px rgba(40,60,80,.06);
}
.tb-brand{display:flex; align-items:center; gap:11px; padding-right:8px;}
.tb-brand img{height:38px; width:auto; display:block;}
.tb-brand .tb-titles{display:flex; flex-direction:column; line-height:1.05;}
.tb-brand .tb-kicker{font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:var(--orange-d); font-weight:700;}
.tb-brand .tb-name{font-family:var(--f-head); font-weight:600; font-size:17px; color:var(--ink);}

.tb-group{display:flex; align-items:center; gap:6px;}
.tb-label{font-size:11px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-soft); margin-right:2px;}

/* segmented proposals */
.seg{display:flex; background:#EEF2F6; border-radius:12px; padding:4px; gap:4px;}
.seg button{
  border:0; cursor:pointer; background:transparent; font-family:var(--f-body);
  font-weight:800; font-size:12.5px; color:var(--ink-soft); white-space:nowrap;
  padding:6px 12px; border-radius:9px; display:flex; flex-direction:column; align-items:flex-start; gap:1px; line-height:1.15; transition:.15s;
}
.seg button .seg-tag{font-size:9.5px; font-weight:700; color:var(--ink-soft); opacity:.7; white-space:nowrap;}
.seg button:hover{color:var(--ink);}
.seg button.active{background:#fff; color:var(--blue-d); box-shadow:0 1px 6px rgba(40,60,80,.14);}
.seg button.active .seg-tag{color:var(--orange-d); opacity:1;}

/* language pills */
.langs{display:flex; gap:5px;}
.langs button{
  border:2px solid #E3E8EE; background:#fff; cursor:pointer;
  font-family:var(--f-body); font-weight:800; font-size:12px; color:var(--ink-soft);
  width:40px; height:34px; border-radius:9px; transition:.15s;
}
.langs button:hover{border-color:var(--blue);}
.langs button.active{background:var(--blue); border-color:var(--blue); color:#fff;}

.tb-spacer{flex:1;}
.tb-actions{display:flex; gap:8px;}
.btn{
  font-family:var(--f-body); font-weight:800; font-size:13px; cursor:pointer;
  border-radius:10px; padding:9px 15px; border:2px solid transparent; transition:.15s;
  display:inline-flex; align-items:center; gap:7px;
}
.btn-ghost{background:#fff; border-color:#E3E8EE; color:var(--ink-soft);}
.btn-ghost:hover{border-color:var(--maroon); color:var(--maroon);}
.btn-brand,.btn{text-decoration:none;}
.btn-primary{background:var(--orange); color:#fff;}
.btn-primary:hover{background:var(--orange-d);}
.btn-line{background:#fff; border-color:var(--blue); color:var(--blue-d);}
.btn-line:hover{background:var(--blue-l);}
.tb-brand{text-decoration:none; color:inherit; cursor:pointer;}

.tb-hint{
  width:100%; font-size:12.5px; color:var(--ink-soft); padding-top:2px;
  display:flex; align-items:center; gap:7px;
}
.tb-hint b{color:var(--blue-d);}

/* =====================================================================
   ESCENARIO + ESCALADO
   ===================================================================== */
.stage{padding:34px 16px 70px; overflow-x:hidden;}
.scaler{transform-origin:top center;}
.pages-col{
  width:var(--pageW); margin:0 auto;
  display:flex; flex-direction:column; align-items:center; gap:30px;
}
.proposal{display:none; flex-direction:column; align-items:center; gap:30px;}
.proposal.active{display:flex;}

/* hoja base */
.page{
  position:relative; width:var(--pageW); min-height:var(--pageH);
  background:#fff; overflow:hidden;
  box-shadow:0 12px 40px rgba(30,50,70,.16);
  border-radius:3px;
}

/* marca de agua del logo */
.page::after{
  content:""; position:absolute; inset:0; pointer-events:none; z-index:0;
  background-image:var(--wm); background-repeat:no-repeat;
  background-position:center 46%; background-size:62% auto;
  opacity:.05; mix-blend-mode:multiply;
}
.page > *{position:relative; z-index:1;}

/* sello de esquina (logo pequeño) */
.seal{
  position:absolute; bottom:20px; right:22px; z-index:3;
  display:flex; align-items:center; gap:7px; opacity:.85;
}
.seal img{height:30px; width:auto;}
.seal .seal-tag{font-size:9px; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-soft); font-weight:700;}

.pagenum{
  position:absolute; bottom:24px; left:24px; z-index:3;
  font-size:11px; font-weight:800; color:var(--ink-soft); letter-spacing:.04em;
}

/* ---------- Controles compartidos: campos / inputs ---------- */
.f-input, .f-area, .f-select{
  font-family:var(--f-body); font-size:15px; color:var(--ink);
  width:100%; border:0; background:transparent; outline:none; resize:none;
}
.f-area{line-height:30px;}
.f-input::placeholder, .f-area::placeholder{color:#B7C0C7; font-style:italic;}
.f-select{appearance:none; cursor:pointer;}

/* checkbox custom */
.chk{display:flex; align-items:flex-start; gap:10px; cursor:pointer; font-size:14.5px; font-weight:600; line-height:1.25;}
.chk .lbl{padding-top:1px;}
.chk input[type="checkbox"]{position:absolute; opacity:0; width:0; height:0;}
.chk .box{
  flex:none; width:22px; height:22px; border-radius:7px; border:2.5px solid var(--blue);
  display:flex; align-items:center; justify-content:center; transition:.12s; background:#fff;
}
.chk .box svg{width:14px; height:14px; opacity:0; transform:scale(.4); transition:.12s;}
.chk input[type="checkbox"]:checked + .box{background:var(--blue); border-color:var(--blue);}
.chk input[type="checkbox"]:checked + .box svg{opacity:1; transform:scale(1);}
.chk input[type="checkbox"]:checked ~ .lbl{text-decoration:line-through; color:var(--ink-soft);}

/* estrellas */
.stars{display:flex; gap:6px;}
.stars .star{width:30px; height:30px; cursor:pointer; color:#E0E6EC; transition:transform .1s, color .12s;}
.stars .star:hover{transform:scale(1.15);}
.stars .star.on{color:var(--orange);}

/* emojis mood */
.moods{display:flex; gap:10px;}
.moods .mood{
  width:42px; height:42px; border-radius:50%; border:2.5px solid #E3E8EE; background:#fff;
  font-size:22px; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:.12s;
}
.moods .mood:hover{border-color:var(--orange);}
.moods .mood.on{border-color:var(--orange); background:var(--orange-l); transform:scale(1.08);}

/* sí/no toggle */
.yesno{display:inline-flex; gap:6px;}
.yesno button{
  border:2px solid #E3E8EE; background:#fff; cursor:pointer; font-family:var(--f-body);
  font-weight:800; font-size:13px; color:var(--ink-soft); padding:6px 16px; border-radius:20px; transition:.12s;
}
.yesno button.on[data-v="yes"]{background:var(--green); border-color:var(--green); color:#fff;}
.yesno button.on[data-v="no"]{background:var(--maroon); border-color:var(--maroon); color:#fff;}

/* lienzo de dibujo */
.draw-wrap{position:relative;}
.draw-tools{display:flex; align-items:center; gap:7px; margin-bottom:8px;}
.draw-tools .swatch{width:24px; height:24px; border-radius:50%; border:2px solid #fff; box-shadow:0 0 0 2px #E3E8EE; cursor:pointer;}
.draw-tools .swatch.on{box-shadow:0 0 0 2px var(--ink);}
.draw-tools .tool{
  border:2px solid #E3E8EE; background:#fff; border-radius:8px; cursor:pointer;
  font-family:var(--f-body); font-weight:800; font-size:11px; color:var(--ink-soft); padding:5px 10px;
}
.draw-tools .tool:hover{border-color:var(--blue); color:var(--blue-d);}
canvas.pad{display:block; width:100%; touch-action:none; cursor:crosshair; border-radius:12px;}

/* =====================================================================
   SKIN 1 — CUADERNO DE LABORATORIO
   ===================================================================== */
.skin-notebook .page{
  background:
    radial-gradient(circle, rgba(61,181,212,.16) 1.3px, transparent 1.4px) 0 0/22px 22px,
    var(--paper);
  border:1px solid #ECE3CD;
}
.skin-notebook .nb-inner{padding:46px 54px 58px 70px;}
/* margen rojo + perforaciones */
.skin-notebook .page::before{
  content:""; position:absolute; top:0; bottom:0; left:46px; width:2px;
  background:rgba(229,115,115,.5); z-index:2;
}
.nb-holes{position:absolute; top:0; bottom:0; left:16px; width:18px; z-index:2;
  display:flex; flex-direction:column; justify-content:space-around; padding:40px 0;}
.nb-holes span{width:16px; height:16px; border-radius:50%; background:#E9ECF1; box-shadow:inset 0 1px 2px rgba(0,0,0,.18);}

.nb-tape{
  position:absolute; width:120px; height:30px; background:rgba(61,181,212,.28);
  border:1px dashed rgba(42,147,176,.4); top:-8px; left:50%; transform:translateX(-50%) rotate(-2deg); z-index:5;
}

.nb-head{display:flex; align-items:flex-end; gap:18px; margin-bottom:18px;}
.nb-head .nb-title{font-family:var(--f-head); font-weight:600; font-size:38px; color:var(--blue-d); line-height:.95;}
.nb-head .nb-sub{font-size:14px; color:var(--orange-d); font-weight:700;}
.nb-head .nb-monti{height:120px; margin-left:auto; margin-bottom:-8px;}

.nb-meta{display:grid; grid-template-columns:1fr 1fr; gap:10px 24px; margin:14px 0 8px;}
.nb-field{display:flex; flex-direction:column; gap:2px;}
.nb-field .nb-lbl{font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.05em; color:var(--orange-d);}
.nb-field .nb-line{border-bottom:2px dotted #C9BFA6; padding-bottom:3px;}
.nb-field.wide{grid-column:1/3;}

.nb-step{margin-top:20px;}
.nb-step-head{display:flex; align-items:flex-start; gap:12px; margin-bottom:6px; line-height:1.3;}
.nb-step-head > div:last-child{flex:1; min-width:0; padding-top:1px;}
.nb-step-head .nb-num{
  flex:none; width:38px; height:38px; border-radius:11px; background:var(--orange);
  color:#fff; font-family:var(--f-head); font-weight:600; font-size:20px;
  display:flex; align-items:center; justify-content:center; box-shadow:0 3px 0 var(--orange-d);
}
.nb-step-head .nb-kind{font-family:var(--f-head); font-weight:600; font-size:21px; color:var(--blue-d); display:block;}
.nb-step-head .nb-q{font-size:13.5px; color:var(--ink-soft); font-weight:700; display:block; margin-top:1px;}
.nb-hint{font-size:12px; color:var(--ink-soft); font-style:italic; margin:6px 0 6px 50px;}
.nb-lines{
  margin-left:50px;
  background-image:repeating-linear-gradient(transparent, transparent 29px, #D8E8EC 29px, #D8E8EC 31px);
}
.nb-lines .f-area{min-height:62px;}
.nb-lines.tall .f-area{min-height:122px;}

.nb-materials{margin-left:50px; display:grid; grid-template-columns:1fr 1fr; gap:12px 22px; align-items:start;}
.nb-addrow{grid-column:1/3; display:flex; align-items:center; gap:10px; border-bottom:2px dotted #C9BFA6; padding-bottom:3px;}
.nb-addrow .plus{color:var(--blue); font-weight:900; font-size:18px;}
/* casilla + material de texto libre */
.mat-chk{align-items:center;}
.mat-chk .mat-text{flex:1; border-bottom:2px dotted #C9BFA6; padding:0 0 3px 2px; font-weight:600;}
.mat-chk input[type=checkbox]:checked ~ .mat-text{color:var(--ink-soft); text-decoration:line-through;}

.nb-observe{display:grid; grid-template-columns:1.15fr 1fr; gap:18px; margin-left:50px;}
.nb-draw{background:#fff; border:2.5px dashed var(--blue); border-radius:14px; padding:8px;}
.nb-draw .draw-cap{font-size:11px; font-weight:800; text-transform:uppercase; color:var(--blue-d); margin-bottom:4px;}

/* --- Página 3: observaciones a hoja completa --- */
.nb-inner-obs{display:flex; flex-direction:column; min-height:1056px;}
.obs-full{flex:1; display:flex; flex-direction:column; gap:20px; margin-left:50px; padding:6px 0 70px;}
.obs-draw{flex:0 0 auto; display:flex; flex-direction:column;}
.obs-draw .draw-wrap{display:flex; flex-direction:column;}
.obs-draw canvas.pad{height:460px; border:1px solid #E7ECF1;}
.obs-notes{flex:1; display:flex; flex-direction:column; min-height:0;}
.obs-noteslbl{color:var(--orange-d)!important; font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.05em; margin-bottom:6px;}
.obs-lines{flex:1; display:flex; flex-direction:column; min-height:200px;}
.obs-lines .f-area{flex:1; min-height:0!important; height:auto;}

.skin-notebook .seal img{filter:none;}

/* =====================================================================
   SKIN 2 — MISIÓN CIENTÍFICA (cómic)
   ===================================================================== */
.skin-comic .page{
  background:
    radial-gradient(rgba(244,151,42,.16) 2px, transparent 2.2px) 0 0/16px 16px,
    #FFF8EE;
}
.skin-comic .cm-inner{padding:30px 34px 56px;}
.skin-comic .page::after{opacity:.045;}

.cm-banner{
  position:relative; background:var(--blue); border:4px solid var(--ink);
  border-radius:18px; padding:16px 20px; color:#fff; display:flex; align-items:center; gap:16px;
  box-shadow:7px 7px 0 var(--ink); margin-bottom:18px;
}
.cm-banner .cm-monti{height:120px; margin:-34px 0 -26px;}
.cm-banner h1{font-family:var(--f-head); font-weight:600; font-size:34px; margin:0; line-height:.95; text-shadow:2px 2px 0 var(--blue-d);}
.cm-banner .cm-sub{font-weight:800; font-size:13px; color:var(--blue-l);}
.cm-burst{
  position:absolute; right:-10px; top:-22px; background:var(--orange); color:#fff;
  font-family:var(--f-head); font-weight:600; font-size:13px; padding:14px; border:3px solid var(--ink);
  transform:rotate(8deg); box-shadow:3px 3px 0 var(--ink);
  clip-path:polygon(50% 0,61% 12%,78% 6%,78% 24%,96% 30%,84% 44%,100% 56%,82% 64%,90% 82%,70% 80%,62% 98%,50% 86%,38% 98%,30% 80%,10% 82%,18% 64%,0 56%,16% 44%,4% 30%,22% 24%,22% 6%,39% 12%);
  width:84px; height:84px; display:flex; align-items:center; justify-content:center; text-align:center;
}

.cm-panel{
  background:#fff; border:4px solid var(--ink); border-radius:16px;
  box-shadow:5px 5px 0 var(--ink); padding:16px 18px; margin-bottom:16px; position:relative;
}
.cm-panel.id-card{display:grid; grid-template-columns:auto 1fr; gap:16px; align-items:center;}
.cm-id-photo{
  width:92px; height:92px; border-radius:14px; border:4px solid var(--ink); background:var(--blue-l);
  display:flex; align-items:flex-end; justify-content:center; overflow:hidden;
}
.cm-id-photo img{height:84px; width:84px; object-fit:contain; object-position:bottom; margin-bottom:0;}
.cm-id-fields{display:grid; grid-template-columns:1fr 1fr; gap:8px 16px;}
.cm-id-fields .full{grid-column:1/3;}
.cm-flbl{font-size:10px; font-weight:800; text-transform:uppercase; letter-spacing:.06em; color:var(--orange-d);}
.cm-fbox{border:2.5px solid var(--ink); border-radius:9px; padding:5px 9px; background:#fff;}

.cm-step-tag{
  position:absolute; top:-15px; left:16px; background:var(--orange); color:#fff;
  font-family:var(--f-head); font-weight:600; font-size:14px; padding:3px 13px; border:3px solid var(--ink);
  border-radius:20px; transform:rotate(-2deg); box-shadow:2px 2px 0 var(--ink);
}
.cm-step-head{display:flex; align-items:center; gap:10px; margin:6px 0 8px;}
.cm-step-head .cm-num{
  width:34px; height:34px; flex:none; border-radius:50%; background:var(--blue); color:#fff;
  border:3px solid var(--ink); font-family:var(--f-head); font-weight:600; font-size:18px;
  display:flex; align-items:center; justify-content:center;
}
.cm-step-head .cm-kind{font-family:var(--f-head); font-weight:600; font-size:22px; color:var(--ink);}
.cm-bubble{
  position:relative; background:var(--blue-l); border:3px solid var(--ink); border-radius:14px;
  padding:8px 12px; font-weight:700; font-size:12.5px; color:var(--blue-d); margin-bottom:10px;
}
.cm-bubble::before{
  content:""; position:absolute; left:24px; bottom:-13px; width:18px; height:18px; background:var(--blue-l);
  border-right:3px solid var(--ink); border-bottom:3px solid var(--ink); transform:rotate(45deg);
}
.cm-write{border:2.5px solid var(--ink); border-radius:12px; background:#fff; padding:10px 12px;}
.cm-write .f-area{min-height:58px; font-weight:600;}
.cm-write.tall .f-area{min-height:120px;}

.cm-grid2{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
.cm-materials{display:flex; flex-direction:column; gap:9px;}
.cm-draw{border:3px solid var(--ink); border-radius:14px; background:#fff; padding:8px; box-shadow:3px 3px 0 var(--ink);}

.skin-comic .chk .box{border-color:var(--ink); border-width:3px;}
.skin-comic .chk input:checked + .box{background:var(--green); border-color:var(--ink);}

/* =====================================================================
   SKIN 3 — BITÁCORA DIGITAL (app)
   ===================================================================== */
.skin-app .page{background:#F4F6F9;}
.skin-app .ap-inner{padding:38px 42px 60px;}
.skin-app .page::after{opacity:.04;}

.ap-top{display:flex; align-items:center; gap:16px; margin-bottom:18px;}
.ap-top .ap-avatar{
  width:64px; height:64px; flex:none; border-radius:20px; background:linear-gradient(140deg,var(--blue-l),#fff);
  overflow:hidden; display:flex; align-items:flex-end; justify-content:center; box-shadow:0 6px 18px rgba(61,181,212,.25);
}
.ap-top .ap-avatar img{height:58px; width:58px; object-fit:contain; object-position:bottom; margin-bottom:0;}
.ap-top h1{font-family:var(--f-head); font-weight:600; font-size:28px; margin:0; color:var(--ink);}
.ap-top .ap-sub{font-size:13px; color:var(--ink-soft); font-weight:700;}
.ap-pill{margin-left:auto; background:var(--blue); color:#fff; font-weight:800; font-size:11px; padding:6px 13px; border-radius:20px; letter-spacing:.04em; white-space:nowrap;}

/* tabs */
.ap-tabs{display:flex; gap:8px; margin-bottom:16px;}
.ap-tabs .ap-tab{
  flex:1; text-align:center; background:#fff; border-radius:12px; padding:9px; font-weight:800; font-size:12.5px;
  color:var(--ink-soft); box-shadow:0 2px 8px rgba(40,60,80,.05);
}
.ap-tabs .ap-tab.on{background:var(--ink); color:#fff;}

/* progress */
.ap-progress{background:#fff; border-radius:16px; padding:14px 18px; margin-bottom:16px; box-shadow:0 4px 14px rgba(40,60,80,.06);}
.ap-progress .ap-plbl{display:flex; justify-content:space-between; font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.05em; color:var(--ink-soft); margin-bottom:7px;}
.ap-bar{height:10px; border-radius:6px; background:#E7ECF1; overflow:hidden;}
.ap-bar i{display:block; height:100%; width:0; background:linear-gradient(90deg,var(--blue),var(--orange)); border-radius:6px; transition:width .4s;}

.ap-card{
  background:#fff; border-radius:18px; padding:18px 20px; margin-bottom:14px;
  box-shadow:0 4px 16px rgba(40,60,80,.06); border:1px solid #EDF1F5;
}
.ap-meta{display:grid; grid-template-columns:1fr 1fr; gap:14px 18px;}
.ap-meta .full{grid-column:1/3;}
.ap-flbl{font-size:10px; font-weight:800; text-transform:uppercase; letter-spacing:.07em; color:var(--blue-d); margin-bottom:4px;}
.ap-fbox{background:#F7F9FB; border:1.5px solid #E7ECF1; border-radius:11px; padding:9px 12px;}
.ap-fbox:focus-within{border-color:var(--blue); background:#fff;}

.ap-step{display:flex; gap:14px; margin-bottom:14px;}
.ap-rail{display:flex; flex-direction:column; align-items:center; flex:none;}
.ap-rail .ap-dot{
  width:34px; height:34px; border-radius:11px; background:var(--blue-l); color:var(--blue-d);
  font-family:var(--f-head); font-weight:600; font-size:17px; display:flex; align-items:center; justify-content:center;
}
.ap-rail .ap-stem{flex:1; width:2px; background:#E7ECF1; margin:6px 0;}
.ap-step:last-child .ap-stem{display:none;}
.ap-body{flex:1; background:#fff; border-radius:16px; padding:14px 16px; box-shadow:0 4px 14px rgba(40,60,80,.05); border:1px solid #EDF1F5;}
.ap-kind{font-family:var(--f-head); font-weight:600; font-size:18px; color:var(--ink); display:flex; align-items:baseline; gap:9px;}
.ap-kind small{font-size:11px; font-weight:800; color:var(--blue-d); text-transform:uppercase; letter-spacing:.05em;}
.ap-q{font-size:13px; color:var(--ink-soft); font-weight:700; margin:1px 0 9px;}
.ap-write{background:#F7F9FB; border:1.5px solid #E7ECF1; border-radius:11px; padding:10px 12px;}
.ap-write:focus-within{border-color:var(--blue); background:#fff;}
.ap-write .f-area{min-height:54px;}
.ap-write.tall .f-area{min-height:118px;}
.ap-materials{display:grid; grid-template-columns:1fr 1fr; gap:9px 16px;}
.ap-grid2{display:grid; grid-template-columns:1.1fr 1fr; gap:16px;}
.ap-draw{background:#F7F9FB; border:1.5px solid #E7ECF1; border-radius:12px; padding:8px;}

.skin-app .chk .box{border-radius:8px;}

/* fila de resumen final (rating) */
.summary-row{display:flex; flex-wrap:wrap; gap:26px; align-items:center; margin-top:6px;}
.summary-row .sum-item{display:flex; flex-direction:column; gap:7px;}
.summary-row .sum-lbl{font-size:12px; font-weight:800; color:var(--ink-soft);}

/* =====================================================================
   IMPRESIÓN
   ===================================================================== */
@media print{
  @page{ size:8.5in 11in; margin:0; }
  body{background:#fff;}
  .toolbar{display:none !important;}
  .stage{padding:0; overflow:visible;}
  .scaler{transform:none !important;}
  .pages-col{width:auto; gap:0;}
  .proposal{display:none !important; gap:0;}
  .proposal.active{display:flex !important;}
  .page{
    width:8.5in; min-height:11in; height:11in; box-shadow:none; border-radius:0;
    break-after:page; page-break-after:always; border:none;
  }
  .page:last-child{break-after:auto; page-break-after:auto;}
  .draw-tools{display:none !important;}
}