.be-wrap *{box-sizing:border-box}.be-wrap{margin:0;background:#08101d;color:#e8eef7;font-family:Inter,Segoe UI,Arial,sans-serif}.be-wrap .app{max-width:1240px;margin:auto;padding:30px 22px}.be-wrap .hero{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;margin-bottom:22px}.be-wrap .eyebrow{font-size:10px;letter-spacing:2px;color:#7e8ca1}.be-wrap .hero h1{font-size:38px;line-height:1.05;margin:7px 0 8px;letter-spacing:-1px}.be-wrap .hero h1 span{font-size:14px;color:#8fa6bf;vertical-align:middle;letter-spacing:1px}.be-wrap .hero p{margin:0;color:#8c9bb0;font-size:13px}.be-wrap .status-pill{border:1px solid #26364d;border-radius:999px;padding:9px 13px;font-size:10px;color:#9db1c9;background:#0d1726;white-space:nowrap}.be-wrap .dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#42d3a5;margin-right:7px}.be-wrap .panel{background:linear-gradient(180deg,#101b2b,#0d1624);border:1px solid #23344b;border-radius:18px;padding:20px;margin-bottom:18px;box-shadow:0 14px 40px rgba(0,0,0,.18)}.be-wrap .row{display:grid;grid-template-columns:1fr 1.15fr 1fr;gap:14px;margin-bottom:14px}.be-wrap .row label,.be-wrap .child-label,.be-wrap .field label,.be-wrap .panel>label{display:block;color:#8ea0b7;font-size:11px}.be-wrap .field input,.be-wrap .field textarea,.be-wrap .top-row select,.be-wrap .top-row input,.be-wrap .child-label select,.be-wrap .option-row select,.be-wrap .option-row input{width:100%;margin-top:7px;background:#091321;border:1px solid #26384f;color:#e8eef7;border-radius:10px;padding:11px 12px;font:inherit;min-height:42px}.be-wrap .field textarea{resize:vertical;min-height:95px;line-height:1.45}.be-wrap .field input:focus,.be-wrap .field textarea:focus,.be-wrap select:focus{outline:1px solid #4d9fff;border-color:#4d9fff}.be-wrap .route-bar{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;background:#091321;border:1px solid #23344b;border-radius:12px;padding:12px;margin-bottom:13px}.be-wrap .route-bar div{min-width:0}.be-wrap .route-bar span{display:block;color:#64758c;font-size:9px;letter-spacing:1px;margin-bottom:4px}.be-wrap .route-bar strong{font-size:13px;color:#f0f5fb}.be-wrap .route-note{font-size:11px;color:#667890;display:flex;align-items:center;justify-content:flex-end}.be-wrap .child-label{margin-bottom:16px}.be-wrap .mode-title,.be-wrap .section-title,.be-wrap .option-title{font-size:12px;font-weight:800;letter-spacing:.8px;color:#dbe6f4;margin:14px 0 8px}.be-wrap .data-modes,.be-wrap .choice-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:17px}.be-wrap .mode-card,.be-wrap .choice{display:flex;gap:10px;align-items:center;padding:12px;background:#091321;border:1px solid #26384f;border-radius:11px;cursor:pointer}.be-wrap .mode-card input,.be-wrap .choice input{width:auto;margin:0}.be-wrap .mode-card span,.be-wrap .choice span{display:flex;flex-direction:column}.be-wrap .mode-card b,.be-wrap .choice b{font-size:11px}.be-wrap .mode-card small,.be-wrap .choice small{font-size:9px;color:#71829a;margin-top:3px}.be-wrap .mode-card.is-checked,.be-wrap .choice.is-checked,.be-wrap .mode-card:has(input:checked),.be-wrap .choice:has(input:checked){border-color:#4d9fff;box-shadow:0 0 0 1px #4d9fff inset}.be-wrap .cv-options{border:1px solid #2c4968;background:linear-gradient(180deg,#0d1a2b,#0b1523);border-radius:14px;padding:14px;margin:4px 0 17px}.be-wrap .cv-options .choice-grid{grid-template-columns:repeat(3,1fr);margin-bottom:12px}.be-wrap .option-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.be-wrap .cv-hint,.be-wrap .field-hint{font-size:9px;color:#73859d}.be-wrap .cv-hint{padding-top:8px}.be-wrap .hidden{display:none!important}.be-wrap .fields{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin:10px 0 17px}.be-wrap .field{min-width:0}.be-wrap .field-hint{margin-left:6px;color:#4d9fff}.be-wrap .toggle{display:flex;justify-content:space-between;gap:14px;align-items:center;padding:11px 12px;background:#091321;border:1px solid #26384f;border-radius:10px;margin-bottom:15px}.be-wrap .check{display:flex;align-items:center;gap:8px;color:#dce6f2;font-size:11px}.be-wrap .check input{width:auto;margin:0}.be-wrap .toggle span{font-size:9px;color:#6e8097}.be-wrap .actions,.be-wrap .result-actions{display:flex;gap:9px;margin-top:14px}.be-wrap button{border:0;border-radius:10px;padding:11px 15px;background:#edf3fa;color:#08101d;font-weight:800;cursor:pointer;font-size:11px}.be-wrap button.secondary{background:#162337;color:#dbe6f2;border:1px solid #2a3e58}.be-wrap button.danger{background:#2a161b;color:#ffb9c0;border:1px solid #6a3039}.be-wrap button:hover{filter:brightness(1.08)}.be-wrap button:disabled{opacity:.5;cursor:wait}.be-wrap #status{min-height:18px;color:#8192a8;font-size:11px;margin-top:9px}.be-wrap .result-panel{min-height:500px}.be-wrap .result-head{display:flex;justify-content:space-between;align-items:center;gap:15px}.be-wrap .result-head h2{font-size:16px;margin:0}.be-wrap .result-head small{display:block;color:#6f8096;font-size:10px;margin-top:4px}.be-wrap .result-actions{margin-top:0}.be-wrap pre{white-space:pre-wrap;word-wrap:break-word;background:#08111e;border:1px solid #24364e;border-radius:12px;padding:17px;min-height:410px;line-height:1.55;font-family:Consolas,Monaco,monospace;font-size:12px;margin:14px 0 0;color:#dce7f3}.be-wrap .saved-list{display:grid;gap:9px;margin-top:14px}.be-wrap .saved-item{display:flex;justify-content:space-between;gap:15px;align-items:center;background:#091321;border:1px solid #24364e;border-radius:11px;padding:12px}.be-wrap .saved-info{display:flex;flex-direction:column;gap:4px;min-width:0}.be-wrap .saved-info strong{font-size:11px;overflow:hidden;text-overflow:ellipsis}.be-wrap .saved-info small{font-size:9px;color:#6e8097}.be-wrap .saved-actions{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}.be-wrap .saved-actions button{padding:7px 9px;font-size:9px}.be-wrap .empty{color:#6c7d93;font-size:10px;padding:12px;border:1px dashed #2a3c55;border-radius:10px}.be-wrap footer{color:#5f7189;font-size:10px;text-align:center;padding:3px 0 18px}@media(max-width:800px){.be-wrap .row,.be-wrap .fields,.be-wrap .data-modes,.be-wrap .cv-options .choice-grid,.be-wrap .option-row{grid-template-columns:1fr}.be-wrap .route-bar{grid-template-columns:1fr}.be-wrap .route-note{justify-content:flex-start}.be-wrap .hero{flex-direction:column}.be-wrap .result-head{align-items:flex-start;flex-direction:column}.be-wrap .result-actions{width:100%}.be-wrap .saved-item{align-items:flex-start;flex-direction:column}.be-wrap .saved-actions{justify-content:flex-start}}.be-wrap /* V2.4 WEB finishing: consistent controls and spacing */
.raw-label{display:block;color:#8ea0b7;font-size:11px;margin-top:2px}.be-wrap .raw-label textarea{display:block;width:100%;margin-top:7px;background:#091321;border:1px solid #26384f;color:#e8eef7;border-radius:10px;padding:11px 12px;font:inherit;min-height:110px;line-height:1.45;resize:vertical}.be-wrap .raw-label textarea:focus{outline:1px solid #4d9fff;border-color:#4d9fff}.be-wrap .fields .field input,.be-wrap .fields .field textarea,.be-wrap .option-row input,.be-wrap .option-row select,.be-wrap .top-row select,.be-wrap .top-row input,.be-wrap .child-label select{height:42px}.be-wrap .fields .field textarea{height:auto;min-height:100px}.be-wrap .option-row label{display:block;color:#8ea0b7;font-size:11px}.be-wrap .option-row label input,.be-wrap .option-row label select{display:block}.be-wrap /* ============================================================
   V2.5 WEB - tambahan optimasi kinerja & UI
   ============================================================ */

/* Hindari layout shift saat panel hasil kosong */
.result-panel{min-height:auto}.be-wrap pre{min-height:320px;contain:content}.be-wrap /* Panel yang jauh di bawah tidak ikut dirender sampai terlihat */
.saved-panel{content-visibility:auto;contain-intrinsic-size:auto 320px}.be-wrap /* Field wajib */
.field-hint.req{color:#ffb9c0}.be-wrap /* Hint shortcut keyboard */
.kbd-hint{display:flex;align-items:center;font-size:9px;letter-spacing:1px;color:#5f7189;
  border:1px solid #24364e;border-radius:8px;padding:0 10px;white-space:nowrap}.be-wrap /* Kotak pencarian prompt tersimpan */
.saved-search{width:100%;margin-top:12px;background:#091321;border:1px solid #26384f;color:#e8eef7;
  border-radius:10px;padding:10px 12px;font:inherit;font-size:11px;min-height:38px}.be-wrap .saved-search:focus{outline:1px solid #4d9fff;border-color:#4d9fff}.be-wrap .saved-search::placeholder{color:#5f7189}.be-wrap /* Transisi ringan hanya pada properti murah */
.mode-card,.be-wrap .choice,.be-wrap .saved-item{transition:border-color .12s ease,box-shadow .12s ease}.be-wrap button{transition:filter .12s ease}
@media(prefers-reduced-motion:reduce){.be-wrap *{transition:none!important;scroll-behavior:auto!important}}

/* Target sentuh lebih besar di layar kecil */
@media(max-width:800px){.be-wrap .kbd-hint{display:none}.be-wrap .actions{flex-wrap:wrap}.be-wrap .actions button{flex:1 1 auto}.be-wrap .saved-actions button{padding:9px 11px;font-size:10px}
}.be-wrap /* ============================================================
   V2.6 - Panel audit,.be-wrap tools export/import
   ============================================================ */

.audit{margin-top:13px;background:#091321;border:1px solid #24364e;border-radius:12px;padding:13px 14px}.be-wrap .audit-head{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}.be-wrap .audit-head b{font-size:10px;letter-spacing:1.4px;color:#dbe6f4}.be-wrap .audit-score{font-size:10px;padding:4px 10px;border-radius:999px;border:1px solid #26384f;white-space:nowrap}.be-wrap .audit-score.good{color:#42d3a5;border-color:#1f5c48;background:#0b2019}.be-wrap .audit-score.mid{color:#f0c674;border-color:#5c4a1f;background:#201b0b}.be-wrap .audit-score.low{color:#ffb9c0;border-color:#6a3039;background:#200e11}.be-wrap .audit-sec{margin-top:11px}.be-wrap .audit-sec>span{display:block;font-size:9px;letter-spacing:1.2px;color:#64758c;margin-bottom:5px}.be-wrap .audit-locks{font-size:10px;color:#9db1c9;line-height:1.7;word-break:break-word}.be-wrap .audit-locks b{color:#dce7f3;font-weight:700}.be-wrap .audit-missing{font-size:10px;color:#73859d;line-height:1.65;word-break:break-word}.be-wrap .audit-list{margin:0;padding-left:16px;font-size:10px;line-height:1.65}.be-wrap .audit-list li{margin-bottom:4px}.be-wrap .audit-list li.info{color:#8ea0b7}.be-wrap .audit-list li.warn{color:#f0c674}.be-wrap .saved-tools{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end}.be-wrap .saved-tools button{padding:9px 12px;font-size:9px}
@media(max-width:800px){.be-wrap .saved-tools{width:100%;justify-content:flex-start}.be-wrap .saved-tools button{flex:1 1 auto}
}.be-wrap /* ============================================================
   V2.9 - Hasil bisa diedit langsung
   ============================================================ */

pre[contenteditable="true"]{outline:none;cursor:text;transition:border-color .15s ease,box-shadow .15s ease}.be-wrap pre[contenteditable="true"]:hover{border-color:#2f4864}.be-wrap pre[contenteditable="true"]:focus{border-color:#4d9fff;box-shadow:0 0 0 1px #4d9fff inset}.be-wrap pre[contenteditable="true"].edited{border-color:#f0c674}.be-wrap pre[contenteditable="true"].edited:focus{border-color:#f0c674;box-shadow:0 0 0 1px #f0c674 inset}.be-wrap .edit-hint{font-size:9px;color:#5f7189;margin-top:7px;letter-spacing:.3px}.be-wrap .edit-badge{display:inline-block;margin-left:8px;font-size:9px;letter-spacing:1px;
  color:#f0c674;border:1px solid #5c4a1f;background:#201b0b;border-radius:999px;padding:2px 8px}
