/* Expediente visual de muestra · Ing. Víctor Marín · 08/10/2026 */
#portalView .gallery-section{background:linear-gradient(180deg,#fff 0%,#f7f4ed 100%)}
#portalView .gallery-heading h2{max-width:800px;line-height:1.04}
#portalView .gallery-heading p{max-width:820px}
#portalView .gallery-autoplay-toggle{display:inline-flex;align-items:center;gap:10px;min-height:42px;margin:0 0 14px;padding:8px 14px;border:1px solid #b4c8cb;border-radius:999px;background:#fff;color:#214a60;font-size:12px;font-weight:700;cursor:pointer}
#portalView .gallery-autoplay-toggle:hover,#portalView .gallery-autoplay-toggle:focus-visible{border-color:#ad8135;background:#fff8e8}
#portalView .gallery-autoplay-toggle span{color:#a77d2d;font-size:15px}
#portalView .room-viewer{overflow:hidden;border:1px solid #d7d9d4;border-radius:16px;background:#fff;box-shadow:0 28px 65px rgba(7,36,62,.11)}
#portalView .room-view-stage{height:clamp(420px,58svh,780px);background:#082947}
#portalView .room-view-image img{object-fit:contain;background:radial-gradient(circle at center,#244358,#082947 70%)}
#portalView .room-reference-badge{position:absolute;top:18px;left:18px;z-index:3;padding:8px 12px;border:1px solid #efd394;border-radius:999px;background:rgba(5,33,57,.87);color:#ffe3a6;font-size:11px;font-weight:800;letter-spacing:.07em;text-transform:uppercase}
#portalView .room-view-copy{padding:25px clamp(22px,3vw,42px)}
#portalView .room-view-copy h3{font-size:clamp(28px,2.7vw,42px)}
#portalView .room-view-thumbnails{display:flex;gap:12px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;padding:16px clamp(17px,2.4vw,30px) 20px;border-top:1px solid #e7e7e1;background:#fbfaf7;scrollbar-color:#c1a561 #f3efe4;scrollbar-width:thin}
#portalView .room-view-thumb{flex:0 0 128px;display:grid;grid-template-rows:82px auto;gap:8px;scroll-snap-align:start;min-width:0;padding:5px;border:2px solid transparent;border-radius:10px;background:transparent;color:#34546b;text-align:left;cursor:pointer}
#portalView .room-view-thumb img,#portalView .room-view-thumb .thumb-pending{width:100%;height:82px;object-fit:cover;border-radius:6px;background:#dfe8e8}
#portalView .room-view-thumb span:last-child{overflow:hidden;padding:0 3px 4px;font-size:12px;font-weight:700;line-height:1.25;text-overflow:ellipsis;white-space:nowrap}
#portalView .room-view-thumb.active{border-color:#c89638;background:#fff8e7;color:#092e50;box-shadow:0 7px 20px rgba(47,56,42,.11)}
#portalView .room-view-thumb:hover{background:#fff}
#portalView .room-view-thumb:focus-visible{outline:3px solid #0c6f8b;outline-offset:2px}
#portalView .room-view-select{padding:0 30px 22px;background:#fbfaf7;color:#35536a}
#portalView .room-view-select select{border-color:#c5d0d0;background:#fff;color:#103a57}

/* Las portadas se muestran como un catálogo legible antes de abrir el lector. */
#portalView .document-workspace{display:grid;grid-template-columns:minmax(0,1fr);overflow:visible;border:1px solid #d9d8d1;border-radius:16px;background:#fff;box-shadow:0 22px 54px rgba(9,37,58,.08)}
#portalView .document-index{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:start;gap:14px;max-height:none;overflow:visible;padding:clamp(18px,2.4vw,32px);border:0;border-bottom:1px solid #e6e3da;border-radius:16px 16px 0 0;background:linear-gradient(125deg,#f4f1e9,#eaf0ee);scroll-snap-type:none}
#portalView .plans-section .document-index{max-height:none;overflow:visible}
#portalView .document-list-label,#portalView .plan-group-title{display:block;grid-column:1/-1;margin:0 0 3px;color:#9d732d;font-size:11px;font-weight:800;letter-spacing:.15em;text-transform:uppercase}
#portalView .plan-group-title:not(:first-child){margin-top:13px;padding-top:13px;border-top:1px solid #d5dbd6}
#portalView .document-index .document-item{position:relative;display:flex;flex-direction:column;align-items:stretch;gap:10px;width:100%;max-width:none;min-height:0;height:100%;margin:0;padding:10px;border:1px solid #d9dedb;border-radius:12px;background:#fff;text-align:left;box-shadow:0 10px 24px rgba(5,36,59,.05);transition:transform .2s,border-color .2s,box-shadow .2s}
#portalView .document-index .document-item:hover{transform:translateY(-3px);border-color:#ba8d39;background:#fff;box-shadow:0 17px 31px rgba(5,36,59,.12)}
#portalView .document-index .document-item.active{border-color:#b7852c;background:#fff9ea;box-shadow:inset 0 0 0 2px #d4aa56,0 12px 28px rgba(82,58,20,.13)}
#portalView .document-index .document-icon{display:grid;place-items:center;width:100%;height:210px;min-height:210px;overflow:hidden;border:1px solid #e5e5df;border-radius:7px;background:#f6f7f4;color:#42657d;font-size:27px}
#portalView .document-index .document-icon img{display:block;width:100%;height:100%;object-fit:contain}
#portalView .document-index .document-icon-cover{height:250px;min-height:250px;background:#edece5}
#portalView .document-index .document-item-copy{display:grid;gap:5px;padding:0 4px 8px}
#portalView .document-index .document-item-copy strong{font-size:15px;line-height:1.3}
#portalView .document-index .document-item-copy small{font-size:11px;line-height:1.4}
#portalView .document-index .document-item-arrow{position:absolute;top:17px;right:17px;display:grid;place-items:center;width:27px;height:27px;border-radius:50%;background:#062b4b;color:#f9d880;font-size:15px}
#portalView .document-preview{border:0;border-radius:0 0 16px 16px;box-shadow:none}
#portalView .document-preview-top{border-top:3px solid #c59b48}
#portalView .document-preview.has-cover .document-preview-content{display:grid;grid-template-columns:minmax(220px,285px) minmax(0,1fr);align-items:start;column-gap:clamp(24px,4vw,62px);padding:clamp(24px,3.5vw,48px)}
#portalView .document-preview.has-cover .document-cover-visual{grid-column:1;grid-row:1 / span 5;align-self:start;width:100%;margin:0;padding:20px;background:#f4f0e6;border:1px solid #d7cdb9;border-radius:10px}
#portalView .document-preview.has-cover .document-cover-visual img{width:100%;max-height:440px;object-fit:contain;box-shadow:0 13px 30px rgba(7,32,51,.15)}
#portalView .document-preview.has-cover .document-preview-content>:not(.document-cover-visual){grid-column:2}
#portalView .document-preview.has-cover .document-preview-actions{grid-row:auto;max-width:360px;margin-top:14px}
#portalView .document-preview.has-cover .document-preview-content{grid-template-columns:minmax(0,1fr);padding:clamp(22px,3vw,38px)}
#portalView .document-preview.has-cover .document-cover-visual{display:none}
#portalView .document-preview.has-cover .document-preview-content>:not(.document-cover-visual){grid-column:1}
#portalView .document-preview.has-cover .document-preview-actions{max-width:none}
#portalView .document-preview-content h3{font-size:clamp(31px,3.2vw,49px)}
#portalView .document-frame{height:min(78svh,1040px);min-height:570px;margin:0 22px 22px;border:1px solid #d4d9da;border-radius:8px;background:#e8edee}
#portalView .plan-image-stage{padding:24px 24px 0;background:#fff}
#portalView .plan-image-expand{min-height:400px;max-height:80svh;border-color:#c7d6d9;border-radius:10px;background:#e9efef}
#portalView .plan-image-expand img{width:100%;max-height:80svh;object-fit:contain}
#portalView .plans-section .document-index .document-icon{height:165px;min-height:165px}

@media(max-width:1000px){
 #portalView .document-index{grid-template-columns:repeat(3,minmax(0,1fr))}
 #portalView .document-index .document-icon-cover{height:215px;min-height:215px}
}
@media(max-width:700px){
 #portalView .room-view-stage{height:clamp(330px,54svh,580px)}
 #portalView .room-view-thumbnails{gap:8px;padding:11px 14px 14px}
 #portalView .room-view-thumb{flex-basis:104px;grid-template-rows:69px auto}
 #portalView .room-view-thumb img,#portalView .room-view-thumb .thumb-pending{height:69px}
 #portalView .room-reference-badge{top:10px;left:10px;padding:6px 8px;font-size:9px}
 #portalView .document-index{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;padding:12px}
 #portalView .document-index .document-item{min-height:0;padding:7px}
 #portalView .document-index .document-icon,#portalView .plans-section .document-index .document-icon{height:150px;min-height:150px}
 #portalView .document-index .document-icon-cover{height:180px;min-height:180px}
 #portalView .document-index .document-item-copy strong{font-size:12px}
 #portalView .document-index .document-item-copy small{font-size:10px}
 #portalView .document-preview.has-cover .document-preview-content{grid-template-columns:1fr;padding:18px}
 #portalView .document-preview.has-cover .document-cover-visual{grid-column:1;grid-row:1;max-width:210px;padding:10px}
 #portalView .document-preview.has-cover .document-cover-visual img{max-height:260px}
 #portalView .document-preview.has-cover .document-preview-content>:not(.document-cover-visual){grid-column:1}
 #portalView .document-preview.has-cover .document-preview-actions{grid-column:1;grid-row:auto}
 #portalView .document-frame{height:68svh;min-height:380px;margin:0 9px 9px}
 #portalView .plan-image-stage{padding:10px 10px 0}
 #portalView .plan-image-expand{min-height:220px}
}
@media(prefers-reduced-motion:reduce){#portalView .document-index .document-item{transition:none}}

/* Tablero de pagos: importes de las cuotas publicadas, en soles. */
#portalView .payment-dashboard{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 178px;align-items:center;column-gap:26px;min-height:244px;overflow:hidden;margin:22px 0 16px;padding:29px clamp(22px,3.2vw,42px);border:1px solid #254862;border-radius:16px;background:radial-gradient(circle at 88% 15%,rgba(231,184,91,.2),transparent 29%),linear-gradient(135deg,#092a49,#0a2038);color:#fff;box-shadow:0 22px 45px rgba(5,35,61,.15)}
#portalView .payment-dashboard:before{content:"";position:absolute;right:-95px;bottom:-185px;width:390px;height:390px;border:1px solid rgba(255,211,131,.16);border-radius:50%;pointer-events:none}
#portalView .payment-dashboard-copy{position:relative;z-index:1}
#portalView .payment-dashboard-eyebrow{display:block;margin-bottom:14px;color:#e9bd69;font-size:11px;font-weight:800;letter-spacing:.16em;text-transform:uppercase}
#portalView .payment-dashboard-copy strong{display:block;color:#fff;font:400 clamp(42px,5vw,66px)/1 Georgia,serif;font-variant-numeric:tabular-nums;letter-spacing:-.045em}
#portalView .payment-dashboard-copy p{margin:12px 0 0;color:#d6e1e9;font-size:14px}
#portalView .payment-dashboard-visual{position:relative;z-index:1;display:grid;place-items:center}
#portalView .payment-donut{--payment-progress:0%;position:relative;display:grid;place-items:center;width:154px;aspect-ratio:1;border-radius:50%;background:conic-gradient(#e9b956 var(--payment-progress),rgba(255,255,255,.15) 0);box-shadow:0 0 0 1px rgba(255,255,255,.15)}
#portalView .payment-donut:before{content:"";position:absolute;width:120px;aspect-ratio:1;border-radius:50%;background:#0b2946}
#portalView .payment-donut span{position:relative;z-index:1;color:#fff;font:400 28px Georgia,serif;font-variant-numeric:tabular-nums}
#portalView .payment-dashboard-track{grid-column:1/-1;height:9px;overflow:hidden;margin-top:23px;border-radius:999px;background:rgba(255,255,255,.18)}
#portalView .payment-dashboard-track span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#ca8e26,#f6ca77);transition:width .45s ease}
#portalView .payment-dashboard-legend{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:22px;margin-top:12px;color:#d9e4ea;font-size:11px}
#portalView .payment-dashboard-legend span{display:inline-flex;align-items:center;gap:7px}
#portalView .payment-dashboard-legend i{display:block;width:8px;height:8px;border-radius:50%;background:#e9b956}
#portalView .payment-dashboard-legend i.pending{background:#8ea6b7}
#portalView .payment-summary{gap:12px}
#portalView .payment-summary article{position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;min-height:165px;overflow:hidden;padding:23px 24px;border:1px solid #d8e1e4;border-radius:13px;background:#f4f8f8;box-shadow:0 9px 22px rgba(9,44,70,.045)}
#portalView .payment-summary article:nth-child(2){background:#eaf5ef;border-color:#c8ddd1}
#portalView .payment-summary article:nth-child(3){background:#fbf4e6;border-color:#ead7ad}
#portalView .payment-summary .payment-summary-mark{position:absolute;top:14px;right:19px;color:#9bb2bd;font:400 34px Georgia,serif;opacity:.65}
#portalView .payment-summary article:nth-child(2) .payment-summary-mark{color:#7eab94}
#portalView .payment-summary article:nth-child(3) .payment-summary-mark{color:#cfa958}
#portalView .payment-summary small{color:#627e8d;font-size:11px;font-weight:800;letter-spacing:.11em;text-transform:uppercase}
#portalView .payment-summary strong{margin:11px 0 7px;color:#082d4d;font:400 clamp(25px,2.4vw,34px)/1.12 Georgia,serif;font-variant-numeric:tabular-nums;letter-spacing:-.035em;overflow-wrap:anywhere}
#portalView .payment-summary article>span:last-child{color:#6a8291;font-size:11px}
#portalView .payment-note{display:flex;align-items:flex-start;gap:10px;margin:15px 0 42px;padding:11px 15px;border-left:3px solid #c6953a;border-radius:0 8px 8px 0;background:#faf7ef;color:#677b8a;font-size:12px;line-height:1.5}
#portalView .payment-note:before{content:"i";display:grid;place-items:center;flex:0 0 17px;height:17px;border:1px solid #b08434;border-radius:50%;color:#9f742a;font:700 11px Georgia,serif}
#portalView .payment-list-heading{margin:0 0 21px;padding-bottom:17px;border-bottom:1px solid #dce4e6}
#portalView .payment-list-heading h3{margin:8px 0;color:#092e50;font:400 clamp(30px,3vw,43px)/1.14 Georgia,serif}
#portalView .payment-list-heading p{margin:0;color:#6c8290;font-size:13px}
#portalView .payment-list{gap:13px}
#portalView .payment-card{position:relative;grid-template-columns:minmax(0,1.5fr) minmax(150px,.9fr) minmax(150px,.9fr);gap:26px;min-height:188px;padding:25px 28px;border:1px solid #dbe4e5;border-left:5px solid #d2a247;border-radius:13px;background:linear-gradient(100deg,#fff,#fbfcfc);box-shadow:0 10px 24px rgba(7,43,67,.045)}
#portalView .payment-card.confirmed{border-left-color:#55a781}
#portalView .payment-card.partial{border-left-color:#d9a13d}
#portalView .payment-card.scheduled{border-left-color:#9fb2c0}
#portalView .payment-card-main{min-width:0}
#portalView .payment-card-number{display:block;margin-bottom:9px;color:#a4772d;font-size:10px;font-weight:800;letter-spacing:.16em}
#portalView .payment-card h3{margin:0 0 8px;color:#0b3152;font:400 clamp(22px,2.2vw,29px)/1.2 Georgia,serif}
#portalView .payment-card small{color:#698195;font-size:12px;line-height:1.45}
#portalView .payment-card-amount,#portalView .payment-card-paid{display:flex;flex-direction:column;justify-content:center;min-width:0;padding-left:23px;border-left:1px solid #e2e8e9}
#portalView .payment-card-amount>small:first-child,#portalView .payment-card-paid>small:first-child{color:#7b8f9b;font-size:10px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
#portalView .payment-card strong{margin:8px 0;color:#103b58;font:400 clamp(20px,2vw,27px)/1.13 Georgia,serif;font-variant-numeric:tabular-nums}
#portalView .payment-card-paid strong{color:#2b7459}
#portalView .payment-state{margin:2px 0 7px;padding:5px 10px;font-size:10px;font-weight:750}
#portalView .payment-state.scheduled{background:#ebf0f4;color:#4f6d81}
#portalView .payment-card-track{height:6px;overflow:hidden;margin-top:14px;border-radius:999px;background:#e8edef}
#portalView .payment-card-track span{display:block;height:100%;border-radius:inherit;background:#63a888}
#portalView .payment-card.scheduled .payment-card-track span{background:#a4b9c5}
#portalView .payment-card.partial .payment-card-track span{background:#d0a24c}
@media(max-width:800px){
 #portalView .payment-dashboard{grid-template-columns:minmax(0,1fr) 132px;min-height:208px;padding:24px}
 #portalView .payment-donut{width:122px}#portalView .payment-donut:before{width:94px}#portalView .payment-donut span{font-size:22px}
 #portalView .payment-summary{grid-template-columns:repeat(2,minmax(0,1fr))}
 #portalView .payment-summary article:nth-child(3){grid-column:1/-1}
 #portalView .payment-summary article{min-height:145px;padding:17px}
 #portalView .payment-card{grid-template-columns:repeat(2,minmax(0,1fr));gap:13px;padding:20px}
 #portalView .payment-card-main{grid-column:1/-1}
 #portalView .payment-card-amount{padding-left:0;border-left:0}
 #portalView .payment-card-paid{padding-left:18px}
}
@media(max-width:560px){
 #portalView .payment-dashboard{grid-template-columns:minmax(0,1fr) 94px;gap:8px;padding:20px;min-height:0}
 #portalView .payment-dashboard-eyebrow{font-size:9px;margin-bottom:10px}
 #portalView .payment-dashboard-copy strong{font-size:39px}#portalView .payment-dashboard-copy p{font-size:12px}
 #portalView .payment-donut{width:88px}#portalView .payment-donut:before{width:67px}#portalView .payment-donut span{font-size:16px}
 #portalView .payment-dashboard-track{margin-top:20px}
 #portalView .payment-summary{grid-template-columns:1fr}
 #portalView .payment-summary article:nth-child(3){grid-column:1}
 #portalView .payment-summary article{display:flex;min-height:105px;align-items:flex-start;justify-content:center;padding:16px 18px}
 #portalView .payment-summary strong{margin:6px 0;font-size:28px}
 #portalView .payment-note{margin-bottom:30px}
 #portalView .payment-card{gap:17px}
 #portalView .payment-card strong{font-size:20px}
}
@media(max-width:390px){#portalView .payment-card{grid-template-columns:1fr}#portalView .payment-card-main{grid-column:1}#portalView .payment-card-paid{padding-left:0;border-left:0;border-top:1px solid #e2e8e9;padding-top:12px}}
@media(prefers-reduced-motion:reduce){#portalView .payment-dashboard-track span{transition:none}}