:root{--green:#0f6b5c;--green-d:#0a4f44;--green-l:#e8f3f0;--gold:#b7791f;--gold-l:#fdf3dc;--red:#b91c1c;--red-l:#fdecec;--ink:#1d2a27;--muted:#5b6b66;--line:#d5ddd9;--bg:#f3f5f2;--card:#fff;--radius:12px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--bg);color:var(--ink);font-family:Segoe UI,system-ui,-apple-system,Roboto,Helvetica Neue,Arial,sans-serif;font-size:15px;line-height:1.5}button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer}:focus-visible{outline-offset:2px;outline:3px solid #2b8f7d}.topbar{background:var(--green-d);color:#fff;flex-wrap:wrap;align-items:center;gap:12px;padding:12px 20px;display:flex}.topbar h1{letter-spacing:.2px;margin:0;font-size:18px;font-weight:700}.topbar .sub{opacity:.85;font-size:13px}.topbar .spacer{flex:1}.chip-live,.chip-sample{border-radius:999px;padding:3px 10px;font-size:12px;font-weight:700}.chip-sample{background:var(--gold-l);color:#7a4a00}.chip-live{color:var(--green-d);background:#d1f0e7}.presets{border-bottom:1px solid var(--line);background:#fff;align-items:center;gap:10px;padding:12px 20px;display:flex;overflow-x:auto}.presets>strong{color:var(--muted);white-space:nowrap;font-size:13px}.preset-btn{white-space:nowrap;border:1px solid var(--line);background:var(--green-l);color:var(--green-d);border-radius:999px;padding:7px 14px;font-size:13px;font-weight:600}.preset-btn:hover{background:#d4ebe5}.layout{grid-template-columns:minmax(380px,460px) minmax(0,1fr);align-items:start;gap:20px;padding:20px;display:grid}.panel-form{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:20px}.panel-preview{min-width:0}.mobile-tabs{display:none}@media (max-width:960px){.layout{grid-template-columns:1fr;padding:12px 16px 80px}.layout.show-form .panel-preview,.layout.show-preview .panel-form{display:none}.mobile-tabs{z-index:20;border-top:1px solid var(--line);background:#fff;gap:8px;padding:8px 16px;display:flex;position:fixed;bottom:0;left:0;right:0}.mobile-tabs button{border:1px solid var(--line);background:#fff;border-radius:10px;flex:1;padding:11px;font-weight:700}.mobile-tabs button.on{background:var(--green);color:#fff;border-color:var(--green)}.presets,.topbar{padding:10px 16px}}.step{margin-bottom:26px}.step>h2{color:var(--green-d);align-items:center;gap:10px;margin:0 0 12px;font-size:15px;display:flex}.step>h2 .no{background:var(--green);color:#fff;border-radius:50%;flex:none;place-items:center;width:26px;height:26px;font-size:13px;display:inline-grid}.field{margin-bottom:12px}.field label,.label{margin-bottom:4px;font-size:13px;font-weight:600;display:block}.hint{color:var(--muted);margin-top:4px;font-size:12px}.err{color:var(--red);margin-top:4px;font-size:13px;font-weight:600}.invalid input,.invalid select,.invalid textarea,.invalid .cards{border-color:var(--red)!important}input[type=text],input[type=number],input[type=date],select,textarea{border:1px solid var(--line);background:#fff;border-radius:8px;width:100%;padding:9px 11px}textarea{resize:vertical;min-height:64px}.row2{grid-template-columns:1fr 1fr;gap:10px;display:grid}.row3{grid-template-columns:repeat(3,1fr);gap:10px;display:grid}@media (max-width:420px){.row3{grid-template-columns:1fr 1fr}}.seg{gap:6px;display:flex}.seg button{border:1px solid var(--line);background:#fff;border-radius:8px;flex:1;padding:9px;font-weight:700}.seg button.on{background:var(--green);color:#fff;border-color:var(--green)}.cards{gap:8px;display:grid}.card-check{border:1px solid var(--line);cursor:pointer;background:#fff;border-radius:10px;align-items:flex-start;gap:10px;padding:10px 12px;display:flex}.card-check.on{background:var(--green-l);border-color:#7fbfb2}.card-check input{width:18px;height:18px;accent-color:var(--green);flex:none;margin-top:3px}.card-check b{font-size:14px;display:block}.card-check span{color:var(--muted);font-size:12.5px}.subhead{color:var(--muted);text-transform:uppercase;letter-spacing:.5px;margin:14px 0 6px;font-size:12px;font-weight:700}.model-box{background:var(--green-l);border-radius:10px;margin-top:8px;padding:10px 12px;font-size:13px}.model-box ol{margin:6px 0 0;padding-left:20px}.source-box{background:#fafcfb;border:1px dashed #9db5ae;border-radius:10px;padding:12px}.source-info{border:1px solid var(--line);background:#fff;border-radius:8px;margin-top:10px;padding:10px;font-size:13px}.source-info .snip{color:var(--muted);white-space:pre-wrap;max-height:84px;margin-top:6px;font-size:12px;overflow:auto}.alert{border-radius:8px;margin-top:8px;padding:10px 12px;font-size:13px}.alert.warn{background:var(--gold-l);color:#6b4300;border:1px solid #ecd18c}.alert.error{background:var(--red-l);color:#7f1d1d;border:1px solid #f3b4b4}.alert.ok{color:var(--green-d);background:#e1f5ee;border:1px solid #a8dccb}.check-inline{align-items:center;gap:8px;margin-bottom:8px;font-size:14px;font-weight:600;display:flex}.check-inline input{width:18px;height:18px;accent-color:var(--green)}.total-box{background:var(--gold-l);color:#6b4300;border-radius:8px;padding:8px 12px;font-size:13px;font-weight:700}.generate-area{border-top:1px solid var(--line);margin-top:6px;padding:14px 0 4px}.btn{border:1px solid var(--line);background:#fff;border-radius:9px;padding:8px 14px;font-size:13.5px;font-weight:700}.btn:hover:not(:disabled){background:var(--green-l)}.btn:disabled{opacity:.55;cursor:not-allowed}.btn.primary{background:var(--green);border-color:var(--green);color:#fff}.btn.primary:hover:not(:disabled){background:var(--green-d)}.btn.big{border-radius:11px;width:100%;padding:14px;font-size:16px}.btn.small{padding:4px 10px;font-size:12px}.btn.danger{color:var(--red)}.status{align-items:center;gap:8px;margin-top:10px;font-size:13px;display:flex}.spinner{border:3px solid #cde5df;border-top-color:var(--green);border-radius:50%;flex:none;width:16px;height:16px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.toolbar{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:14px;padding:10px 14px;display:flex}.toolbar .title{margin-right:auto;font-size:14px;font-weight:700}.empty{background:var(--card);border:1px dashed var(--line);border-radius:var(--radius);text-align:center;color:var(--muted);padding:40px 24px}.a4{border:1px solid var(--line);color:#111;background:#fff;border-radius:6px;width:100%;max-width:210mm;margin:0 auto;padding:16mm 15mm;font-family:Calibri,Segoe UI,Arial,sans-serif;font-size:10.5pt;line-height:1.4;box-shadow:0 6px 24px #0f322c14}@media (max-width:640px){.a4{padding:14px 12px;font-size:10pt}}.doc-banner{background:var(--red-l);color:var(--red);text-align:center;border:1px solid #f0b4b4;border-radius:6px;margin-bottom:10px;padding:6px 10px;font-size:10pt;font-weight:700}.doc-head{text-align:center;border-bottom:2px solid var(--green);margin-bottom:10px;padding-bottom:8px}.doc-head .y{color:#555;letter-spacing:.5px;font-size:9pt}.doc-head .m{color:var(--green);font-size:15pt;font-weight:800}.doc-head .a{color:#555;font-size:9pt}.doc-head .j{margin-top:4px;font-size:14pt;font-weight:800}.doc-head .sj{font-size:11.5pt}.doc-head .k{color:#555;margin-top:2px;font-size:8.5pt}.sec{margin-top:14px}.sec-head{background:var(--green-l);border-left:4px solid var(--green);color:var(--green-d);break-after:avoid;align-items:center;gap:8px;padding:4px 8px;font-size:11pt;font-weight:800;display:flex}.sec-head .letter{background:var(--green);color:#fff;border-radius:4px;padding:0 7px}.sec-tools{gap:6px;margin-left:auto;display:flex}.sec-tools-solo{justify-content:flex-end;gap:6px;margin:4px 0;display:flex}.sec-body{padding-top:6px}.sec.busy{opacity:.55;pointer-events:none}.kv{border-collapse:collapse;width:100%;margin-bottom:6px}.kv td{vertical-align:top;padding:3px 6px}.kv td:first-child{width:28%;color:var(--green-d);font-weight:700}.kv .val{white-space:pre-line;text-align:justify}.tag{vertical-align:middle;white-space:nowrap;border-radius:999px;margin-left:6px;padding:0 6px;font-size:7.5pt;font-weight:700;display:inline-block}.tag.Usulan{color:#26408b;background:#e8eefc}.tag.Data{color:var(--green-d);background:#e1f5ee}.tag.Perlu{background:var(--gold-l);color:#7a4a00}.warn-text{color:#9a3412}.gt{border-collapse:collapse;width:100%;margin:4px 0 8px}.gt th,.gt td{vertical-align:top;text-align:left;border:1px solid #b8c4c0;padding:4px 6px}.gt th{background:var(--green-l)}.gt td{white-space:pre-line;text-align:justify}.gt tr{break-inside:avoid}.doc-h{color:var(--green-d);break-after:avoid;margin:8px 0 3px;font-weight:800}.doc-p{text-align:justify;margin:2px 0 4px}.doc-p.italic{color:#444;font-size:9.5pt;font-style:italic}.doc-ul{margin:2px 0 6px;padding-left:20px}.doc-ul li{text-align:justify}.answer-line{border-bottom:1px dotted #777;height:22px}.checks{flex-wrap:wrap;gap:4px 18px;margin:4px 0 10px;display:flex}.sig{break-inside:avoid;margin-top:14px}.sig .date{text-align:right;margin-bottom:4px}.sig table{border-collapse:collapse;width:100%}.sig td{vertical-align:top;width:50%;padding:0 6px}.sig .space{height:56px}.bagan{width:100%;height:auto;margin:6px 0}.attach-title{color:var(--green-d);border-bottom:2px solid var(--green);margin:0 0 6px;padding-bottom:3px;font-size:12.5pt;font-weight:800}.sec.attach{break-before:page;border-top:3px double var(--line);margin-top:28px;padding-top:14px}.editor{background:#fbfdfc;border:1px solid #9ccabd;border-radius:8px;margin:6px 0;padding:10px}.ed-field{margin-bottom:8px}.ed-field>label{color:var(--green-d);margin-bottom:2px;font-size:12px;font-weight:700;display:block}.ed-field textarea,.ed-field input,.ed-field select{font-size:13px}.ed-obj{border-left:3px solid #bcd8d0;margin:6px 0;padding-left:10px}.ed-item{border:1px solid var(--line);background:#fff;border-radius:8px;margin-bottom:8px;padding:8px}.ed-item-head{color:var(--muted);justify-content:space-between;margin-bottom:4px;font-size:12px;font-weight:700;display:flex}.ed-list-row{gap:6px;margin-bottom:6px;display:flex}.ed-list-row textarea{min-height:38px}.banner-contoh{background:var(--red-l);color:#7f1d1d;border:1px solid #f0b4b4;border-radius:10px;margin-bottom:12px;padding:10px 12px;font-size:13px}.login{border:1px solid var(--line);background:#fff;border-radius:14px;max-width:380px;margin:12vh auto;padding:28px}.login h1{color:var(--green-d);margin:0 0 4px;font-size:20px}@page{size:A4;margin:16mm 15mm 18mm;@bottom-center{content:"Khairul Falah | Format RPP dan RPM | " counter(page);font-size:8pt;color:#666}}@media print{body{background:#fff}.topbar,.presets,.panel-form,.toolbar,.mobile-tabs,.sec-tools,.sec-tools-solo,.no-print,.banner-contoh{display:none!important}.layout{padding:0;display:block}.panel-preview{display:block!important}.a4{box-shadow:none;border:none;border-radius:0;max-width:none;padding:0}.sec-head,.gt th,.tag,.doc-banner{-webkit-print-color-adjust:exact;print-color-adjust:exact}.editor{display:none}}@media (max-width:640px){.kv td:first-child{width:34%}}
