:root{--bg:#f5f7fb;--card:#fff;--text:#172033;--muted:#697386;--line:#e5e9f0;--accent:#2563eb;--green:#16a34a;--red:#dc2626;--purple:#7c3aed;--shadow:0 8px 30px rgba(20,30,50,.07)}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Arial,sans-serif}.app{max-width:1500px;margin:auto;padding:24px}header h1{margin:0;font-size:29px}header p{color:var(--muted);margin:5px 0 20px}.tabs{display:flex;gap:8px;border-bottom:1px solid var(--line);margin-bottom:18px}.tab{background:transparent;color:var(--muted);border:0;border-bottom:3px solid transparent;border-radius:0;padding:13px 20px;font-weight:800;cursor:pointer}.tab.active{color:var(--accent);border-color:var(--accent)}.tab-content{display:none}.tab-content.active{display:block}.loan-layout{display:grid;grid-template-columns:340px 1fr;gap:18px}.card{background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow)}.panel{padding:20px}.field{margin-bottom:15px}label{display:block;font-size:13px;font-weight:700;margin-bottom:7px}input,select{width:100%;height:44px;border:1px solid #d7dce5;border-radius:10px;padding:0 12px;font-size:15px;background:#fff;color:var(--text)}.row{display:grid;grid-template-columns:1fr 1fr;gap:10px}button{height:44px;border:0;border-radius:10px;background:var(--accent);color:#fff;font-weight:800;cursor:pointer;padding:0 15px}.mode-box{display:grid;grid-template-columns:1fr 1fr;gap:8px}.mode-box input{display:none}.mode-box label{margin:0}.mode-box span{display:block;text-align:center;padding:11px 5px;border:1px solid var(--line);border-radius:10px;cursor:pointer}.mode-box input:checked+span{border-color:var(--accent);background:#eff6ff;color:var(--accent)}.summary{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-bottom:18px}.metric{padding:15px;border:1px solid var(--line);border-radius:13px;background:#fff}.metric small{display:block;color:var(--muted);font-weight:700;font-size:12px}.metric b{display:block;font-size:18px;margin-top:5px}.blue b{color:var(--accent)}.red b{color:var(--red)}.green b{color:var(--green)}.chart-card{padding:18px;margin-bottom:18px}.chart-header h3{margin:0}.chart-header div{font-size:12px;color:var(--muted)}#loanChartWrap{width:100%;height:420px}#loanChart{width:100%;height:420px;cursor:crosshair}.chart-grid{stroke:#e7ebf1;stroke-width:1}.chart-axis-text{fill:#697386;font-size:12px;font-family:system-ui}.chart-line{fill:none;stroke-width:2}.chart-guide{stroke:#64748b;stroke-width:1;stroke-dasharray:5 5}.chart-dot{fill:#fff;stroke-width:2}.table-wrap{overflow:auto;max-height:500px;margin-top:12px}table{width:100%;border-collapse:collapse;font-size:13px}th,td{padding:10px 12px;border-bottom:1px solid var(--line);white-space:nowrap;text-align:right}th:first-child,td:first-child{text-align:center}th{position:sticky;top:0;background:#f8fafc;color:var(--muted)}.section-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.section-title h2{margin:0}.section-title span{color:var(--muted);font-size:13px}.scientific-layout{max-width:560px}.sci-card{padding:18px}.sci-display{background:#111827;color:#fff;border-radius:12px;padding:15px;text-align:right;min-height:95px}.sci-display div{height:25px;color:#9ca3af}.sci-display strong{font-size:30px;word-break:break-all}.angle-row{display:flex;gap:6px;margin:10px 0}.angle{flex:1;background:#eef2f7;color:#4b5563}.angle.active{background:#dbeafe;color:#2563eb}.keypad{display:grid;grid-template-columns:repeat(5,1fr);gap:7px}.keypad button{background:#f1f5f9;color:#172033}.keypad .danger{background:#fee2e2;color:#b91c1c}.keypad .equals{background:var(--accent);color:#fff}.conversion-layout{display:grid;grid-template-columns:420px 1fr;gap:18px}.conversion-result{padding:30px;display:flex;flex-direction:column;justify-content:center;min-height:300px}.conversion-result small{color:var(--muted);font-weight:800}.conversion-result strong{font-size:40px;margin:15px 0}.conversion-result div{color:var(--muted)}@media(max-width:1100px){.loan-layout,.conversion-layout{grid-template-columns:1fr}.summary{grid-template-columns:repeat(3,1fr)}}@media(max-width:650px){.app{padding:12px}.summary{grid-template-columns:1fr 1fr}.tabs{overflow:auto}.tab{white-space:nowrap}.conversion-result strong{font-size:28px}}
/* ===== BLASTING MODULE ===== */
.blast-section .card{margin-bottom:15px}
.blast-section .container{max-width:none;padding:0}
.blast-section .grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.blast-section .box{background:#f8fafc;border:1px solid #e5e7eb;padding:14px;border-radius:10px}
.blast-section .box-title{font-size:13px;color:#6b7280}
.blast-section .box-value{font-size:20px;font-weight:bold;margin-top:5px;color:#111827}
.blast-section .highlight{background:#eff6ff;border-color:#bfdbfe}
.blast-section .math{background:#f8fafc;border-left:4px solid #2563eb;padding:15px;margin-top:12px;line-height:1.7;border-radius:5px}
.blast-section .formula{font-family:'Courier New',monospace;background:#eef2ff;padding:8px;margin:7px 0;border-radius:5px;overflow-x:auto}
.blast-section .small-note{font-size:12px;color:#6b7280;margin-top:5px}
.blast-section .note{font-size:13px;color:#6b7280;line-height:1.6}
/* =====================================================
   MODULAR UTILITIES
   ===================================================== */
.is-hidden {
    display: none !important;
}

.field {
    margin-bottom: 2px;
}

.section-divider {
    height: 1px;
    background: #e5e7eb;
    margin: 18px 0;
}

.default-badge {
    display: inline-block;
    margin-left: 6px;
    padding: 2px 7px;
    border-radius: 999px;
    background: #dbeafe;
    color: #1d4ed8;
    font-size: 11px;
    font-weight: 700;
    vertical-align: middle;
}

/* =====================================================
   BLAST GEOMETRY — HOLE ONLY
   ===================================================== */

.geometry-card {
    overflow: hidden;
}

.geometry-wrap {
    width: 100%;
    overflow-x: auto;
    padding: 8px 0 2px;
}

#blastGeometry {
    width: 100%;
    min-width: 0;
    height: auto;
    display: block;
}

/* Lubang */
.hole-line {
    stroke: #202839;
    stroke-width: 10;
    stroke-linecap: round;
}

.hole-point {
    fill: #111827;
}

/* Stemming */
.stemming-line {
    stroke: #9ca3af;
    stroke-width: 10;
    stroke-linecap: round;
}

/* Powder column */
.charge-line {
    stroke: #f59e0b;
    stroke-width: 10;
    stroke-linecap: round;
}

/* Subdrill */
.subdrill-line {
    stroke: #6b7280;
    stroke-width: 8;
    stroke-dasharray: 6 5;
}

/* Dimensi */
.dimension-line {
    stroke: #2563eb;
    stroke-width: 2;
    marker-start: url(#arrowBlue);
    marker-end: url(#arrowBlue);
}

.dimension-label {
    font-size: 17px;
    font-weight: 700;
    fill: #2563eb;
    font-family: Arial, Helvetica, sans-serif;
}

.charge-label {
    font-size: 14px;
    font-weight: 700;
    fill: #92400e;
    font-family: Arial, Helvetica, sans-serif;
}

.stemming-label {
    font-size: 14px;
    font-weight: 700;
    fill: #4b5563;
    font-family: Arial, Helvetica, sans-serif;
}

@media (max-width: 600px) {
    #blastGeometry {
        min-width: 680px;
    }
}


/* Final PC geometry */
#blastGeometry .charge-line {
    stroke-width: 10;
}
#blastGeometry .subdrill-line {
    stroke-width: 7;
    stroke-dasharray: 6 5;
}

@media(max-width:600px){.blast-section .grid{grid-template-columns:1fr}}

.mining-grid{display:grid;grid-template-columns:repeat(2,minmax(320px,1fr));gap:18px}.result-box{margin-top:14px;padding:14px;border:1px solid var(--line);border-radius:12px;background:#f8fafc;line-height:1.7;min-height:90px}.muted{color:var(--muted)}.link-stat{display:flex;justify-content:space-between;border-bottom:1px solid var(--line);padding:12px 0}.ok{color:#15803d;font-weight:800}.warn{color:#b45309;font-weight:800}.danger{color:#b91c1c;font-weight:800}@media(max-width:900px){.mining-grid{grid-template-columns:1fr}}