/* V15.2 Surat Pengantar - compact, responsive, fast perceived loading */
.letter-nav-btn{position:relative}.letter-lock{margin-left:auto;font-size:8px;opacity:.72;padding:2px 5px;border-radius:999px;background:#edf4ff;color:#245fa8}
.letter-workspace{display:none;background:var(--bg)}.letter-workspace.show{display:block}.letter-shell{display:grid;gap:10px}
.letter-head{display:flex;align-items:center;justify-content:space-between;gap:12px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px 14px}.letter-title-wrap{min-width:0}.letter-eyebrow{display:block;margin-bottom:2px;color:#6683a6;font-size:8px;font-weight:900;letter-spacing:.08em}.letter-head h2{margin:0;font-size:18px;color:var(--navy)}.letter-head p{margin:3px 0 0;color:var(--muted);font-size:10px}.letter-head-actions,.letter-panel-actions{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.letter-btn{border:1px solid #d9e2ef;background:#fff;color:#1f3553;border-radius:9px;min-height:34px;padding:0 11px;font-size:10px;font-weight:850;cursor:pointer}.letter-btn.compact{min-height:31px;padding:0 9px}.letter-btn:hover{border-color:#9ebce4;background:#f7fbff}.letter-btn.primary{background:#1769e0;border-color:#1769e0;color:#fff}.letter-btn.primary-soft{background:#eef5ff;border-color:#c8dcf7;color:#1559ab}.letter-btn.excel{background:#edf8f0;border-color:#cce8d4;color:#16723b}.letter-btn.danger{color:#b42318;border-color:#f0c3bf;background:#fff8f7}.letter-btn:disabled{opacity:.48;cursor:not-allowed}
.letter-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.letter-kpis.user-mode{grid-template-columns:minmax(180px,280px)}.letter-kpi{background:#fff;border:1px solid var(--line);border-radius:12px;padding:9px 11px;min-height:68px}.letter-kpi span{display:block;color:var(--muted);font-size:8px;font-weight:900;text-transform:uppercase;letter-spacing:.04em}.letter-kpi strong{display:block;margin-top:2px;font-size:21px;color:var(--navy);line-height:1.1}.letter-kpi small{display:block;margin-top:2px;color:#8390a2;font-size:8px}
.letter-tabs{display:flex;gap:6px;flex-wrap:wrap}.letter-tab{border:1px solid #dce5f1;background:#fff;color:#45617f;border-radius:999px;padding:7px 11px;font-size:9px;font-weight:900;cursor:pointer}.letter-tab.active{background:var(--blue-soft);color:var(--blue);border-color:#b8d2f8}
.letter-panel{background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden}.letter-panel-head{padding:10px 12px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:8px}.letter-panel-head strong{font-size:12px;color:var(--navy)}.letter-panel-head small{color:var(--muted);font-size:9px}.letter-table-wrap{overflow:auto}.letter-table{width:100%;border-collapse:collapse;min-width:820px}.letter-table th{background:#f5f8fc;color:#5c6f86;font-size:8px;text-transform:uppercase;letter-spacing:.03em;text-align:left;padding:8px;border-bottom:1px solid var(--line);white-space:nowrap}.letter-table td{padding:8px;border-bottom:1px solid #edf1f6;font-size:10px;vertical-align:middle}.letter-table tr:last-child td{border-bottom:0}.letter-table td strong{color:#1c3452}.letter-error-text{color:#a23a31;font-size:8px}
.letter-status{display:inline-flex;align-items:center;gap:4px;padding:4px 7px;border-radius:999px;font-size:8px;font-weight:900;white-space:nowrap}.letter-status.none{background:#f2f4f7;color:#667085}.letter-status.incomplete{background:#fff4df;color:#9a5a00}.letter-status.processing{background:#edf3ff;color:#315ea9}.letter-status.ready{background:#eaf8ef;color:#14733b}.letter-status.failed{background:#fff0ef;color:#b42318}.letter-row-actions,.letter-schedule-cell{display:flex;gap:4px;flex-wrap:wrap;align-items:center}.letter-mini-btn{border:1px solid #dce5f1;background:#fff;color:#34516f;border-radius:7px;padding:4px 7px;font-size:8px;font-weight:900;cursor:pointer}.letter-mini-btn.primary{background:#1769e0;color:#fff;border-color:#1769e0}.letter-mini-btn.ready{background:#ecf8f0;color:#14733b;border-color:#ccebd7}.letter-mini-btn.failed{background:#fff4f2;color:#b42318;border-color:#f3cbc6}.letter-readonly{font-size:9px;font-weight:800}.letter-readonly.done{color:#14733b}.letter-readonly.pending{color:#7a8795}
.letter-counter-setup{padding:10px 12px;display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap;background:#fff8e8;border:1px solid #f2d392;border-radius:12px;font-size:9px}.letter-counter-setup strong{color:#7a4d00}.letter-counter-row{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.letter-counter-row input{width:150px;height:34px;border:1px solid #d9e1eb;border-radius:8px;padding:0 9px}
.letter-overlay{position:fixed;inset:0;z-index:120;background:rgba(7,22,43,.58);display:none;align-items:center;justify-content:center;padding:14px}.letter-overlay.show{display:flex}.letter-modal{width:min(900px,100%);max-height:92vh;overflow:auto;background:#fff;border-radius:16px;border:1px solid #dce4ef;box-shadow:0 24px 70px rgba(7,35,75,.20)}.letter-modal-head{position:sticky;top:0;z-index:2;background:#fff;border-bottom:1px solid var(--line);padding:12px 14px;display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.letter-modal-head h3{margin:0;color:var(--navy);font-size:16px}.letter-modal-head p{margin:3px 0 0;color:var(--muted);font-size:9px}.letter-close{border:0;background:#f1f4f8;color:#41536b;width:32px;height:32px;border-radius:9px;font-size:18px;cursor:pointer}.letter-modal-body{padding:12px;display:grid;gap:9px}.letter-section{border:1px solid #e2e8f0;border-radius:12px;overflow:hidden}.letter-section-title{padding:8px 10px;background:#f7f9fc;color:#36506e;font-size:9px;font-weight:900;text-transform:uppercase;letter-spacing:.04em}.letter-section-body{padding:10px}.letter-read-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.letter-read-item{min-height:52px;border:1px solid #e7ecf2;border-radius:9px;padding:7px 9px;background:#fbfcfe}.letter-read-item span{display:block;color:#7b899a;font-size:7px;font-weight:900;text-transform:uppercase}.letter-read-item strong{display:block;color:#233c59;font-size:10px;margin-top:3px;word-break:break-word}.letter-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.letter-field{display:grid;gap:4px}.letter-field.full{grid-column:1/-1}.letter-field label{color:#4d627b;font-size:8px;font-weight:900}.letter-field input,.letter-field select{width:100%;min-width:0;height:36px;border:1px solid #d6dfe9;border-radius:8px;padding:0 9px;color:#1f3553;background:#fff}.letter-auto-box{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.letter-auto-item{padding:8px 9px;border-radius:9px;background:#eef5ff;border:1px solid #d5e5fb}.letter-auto-item span{display:block;color:#57708f;font-size:7px;font-weight:900;text-transform:uppercase}.letter-auto-item strong{display:block;margin-top:3px;color:#174f99;font-size:11px}.letter-validation{border-radius:9px;padding:8px 9px;font-size:9px;font-weight:800}.letter-validation.ok{background:#eaf8ef;color:#14733b}.letter-validation.bad{background:#fff2e5;color:#975600}.letter-modal-actions{position:sticky;bottom:0;z-index:2;background:#fff;border-top:1px solid var(--line);padding:10px 12px;display:flex;justify-content:flex-end;gap:7px;flex-wrap:wrap}
.letter-bulk-hint{margin:10px 12px 0;padding:9px 11px;background:#f7fbff;border:1px solid #dceaf9;border-radius:10px;color:#49637f;font-size:9px}.letter-bulk-tools{padding:10px 12px;display:flex;gap:7px;flex-wrap:wrap;align-items:end;border-bottom:1px solid var(--line)}.letter-bulk-tools .letter-field{min-width:250px}.letter-grid-wrap{overflow:auto;max-height:52vh}.letter-grid{width:100%;min-width:1220px;border-collapse:collapse}.letter-grid th{position:sticky;top:0;z-index:1;background:#f2f6fb;color:#58708d;font-size:7px;text-transform:uppercase;padding:7px;border:1px solid #dce4ed}.letter-grid td{border:1px solid #e0e7ef;padding:0;min-width:110px}.letter-grid td[data-col="name"],.letter-grid td[data-col="clinic"]{min-width:170px}.letter-grid td[contenteditable="true"]{padding:7px;outline:none;background:#fff;font-size:9px}.letter-grid td[contenteditable="true"]:focus{box-shadow:inset 0 0 0 2px #6da7f3;background:#f8fbff}.letter-grid tr.invalid td{background:#fff8f2}.letter-grid tr.valid td{background:#fbfffc}.letter-grid .bulk-status{padding:6px;min-width:120px;font-size:8px;font-weight:800}.letter-bulk-summary{padding:10px 12px;display:flex;gap:9px;align-items:center;flex-wrap:wrap;border-top:1px solid var(--line);background:#fafbfd;font-size:9px}.letter-bulk-summary .letter-btn{margin-left:auto}.letter-bulk-summary strong{color:#233e5e}
.letter-pdf-modal{width:min(980px,100%);height:min(92vh,900px);display:grid;grid-template-rows:auto 1fr auto}.letter-pdf-frame{width:100%;height:100%;min-height:570px;border:0;background:#eef1f5}.schedule-site-target{min-width:125px}
.letter-skeleton-list{display:grid;gap:7px;padding:12px}.letter-skeleton-list i{display:block;height:34px;border-radius:8px;background:linear-gradient(90deg,#eef2f7 25%,#f8fafc 50%,#eef2f7 75%);background-size:200% 100%;animation:letterShimmer 1.2s linear infinite}@keyframes letterShimmer{to{background-position:-200% 0}}
@media(max-width:780px){.letter-shell{gap:8px}.letter-head{align-items:flex-start;flex-direction:column;padding:11px}.letter-head-actions{width:100%}.letter-btn{min-height:36px}.letter-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.letter-kpis.user-mode{grid-template-columns:1fr}.letter-read-grid,.letter-form-grid,.letter-auto-box{grid-template-columns:1fr}.letter-field.full{grid-column:auto}.letter-overlay{padding:7px;align-items:flex-end}.letter-modal{max-height:94vh;border-radius:16px 16px 9px 9px}.letter-pdf-modal{height:94vh}.letter-pdf-frame{min-height:490px}.letter-bulk-tools .letter-field{min-width:100%}.letter-panel-head{align-items:flex-start;flex-direction:column}.letter-panel-actions{width:100%}.letter-panel-actions .letter-btn{flex:1}.letter-table-wrap{overflow:visible}.letter-table{min-width:0;border:0}.letter-table thead{display:none}.letter-table tbody{display:grid;gap:8px;padding:8px}.letter-table tr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border:1px solid #e0e7ef;border-radius:11px;overflow:hidden;background:#fff}.letter-table td{display:block;padding:8px;border-bottom:1px solid #edf1f6;font-size:10px}.letter-table td:nth-last-child(-n+2){grid-column:1/-1}.letter-table td:empty{display:none}.letter-row-actions{justify-content:flex-start}.letter-grid-wrap{overflow:auto}.letter-grid{min-width:1220px}.letter-bulk-summary .letter-btn{margin-left:0;width:100%}}
