:root {
    --mine-navy: #17252e;
    --mine-green: #1f7257;
    --mine-green-soft: #e8f4ef;
    --mine-gold: #d99a24;
    --mine-stone: #eef1f3;
    --mine-border: #dfe5e8;
}

body { font-family: "Source Sans 3", system-ui, sans-serif; letter-spacing: .005em; }
.app-header { min-height: 64px; border-bottom: 1px solid var(--mine-border); }
.mobile-header-brand { display:none; }
.app-main { background: #f4f6f7; }
.app-content-header { padding: 1.75rem 0 1.1rem; }
.app-content { padding-bottom: 2rem; }
.app-content-header h1 { font-size: clamp(1.55rem, 2vw, 2rem); font-weight: 700; color: var(--mine-navy); }
.eyebrow { color: var(--mine-green); font-weight: 700; font-size: .74rem; letter-spacing: .12em; text-transform: uppercase; }

.sidebar-brand { height: 64px; border-bottom-color: rgba(255,255,255,.1); }
.brand-mark { width: 35px; height: 35px; display: inline-grid; place-items: center; border-radius: 10px; background: var(--mine-green); color: #fff; margin-right: .55rem; }
.brand-symbol { width: 25px; height: 25px; display: block; }
.brand-text { letter-spacing: 0; }
.brand-name { font-family: "Space Grotesk", sans-serif; font-size: 1.05rem; font-weight: 500; letter-spacing: -.04em; white-space: nowrap; }
.brand-name-accent { color: #2a8e69; font-weight: 700; }
.app-sidebar .brand-name-accent, .login-visual .brand-name-accent { color: #c5f36a; }
.tenant-panel { margin: .85rem .75rem 1rem; padding: .9rem 2.5rem .9rem .9rem; border: 1px solid rgba(255,255,255,.11); background: rgba(255,255,255,.06); border-radius: 12px; position: relative; display: flex; flex-direction: column; }
.tenant-panel small { color: #79c5aa; font-size: .65rem; font-weight: 700; letter-spacing: .1em; }
.tenant-panel strong { color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin: .2rem 0; }
.tenant-panel > a { position: absolute; right: .8rem; top: 1.25rem; color: #c9d3d8; }
.sidebar-menu .nav-header { font-size: .65rem; letter-spacing: .12em; color: #7f8e97; margin-top: .75rem; }
.sidebar-menu .nav-link { border-radius: 8px; margin-inline: .45rem; width: auto; }
.sidebar-menu .nav-link.active { background: var(--mine-green); box-shadow: 0 4px 12px rgba(0,0,0,.2); }
.sync-pill { padding: .35rem .7rem; border-radius: 999px; font-size: .78rem; font-weight: 600; transition: color .2s, background-color .2s; }
.sync-pill.is-checking { color: #65757d; background: #edf0f2; }
.sync-pill.is-online { color: var(--mine-green); background: var(--mine-green-soft); }
.sync-pill.is-offline { color: #ad3440; background: #fde8ea; }
.user-avatar { display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--mine-navy); color: white; font-weight: 700; }
.user-avatar-lg { width: 68px; height: 68px; font-size: 1.6rem; margin-bottom: .5rem; background: rgba(255,255,255,.18); }
.user-role-menu { width: min(360px, calc(100vw - 1rem)); }
.user-role-panel { padding: .9rem 1rem; border-bottom: 1px solid var(--mine-border); background: #fff; }
.user-role-title { margin-bottom: .4rem; color: #7d8b93; font-size: .67rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.user-project-roles { display: grid; gap: .35rem; max-height: 160px; overflow-y: auto; }
.user-project-role { display: flex; justify-content: space-between; align-items: center; gap: .75rem; padding: .42rem .55rem; border-radius: 7px; background: #f5f7f8; font-size: .76rem; }
.user-project-role span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--mine-navy); }
.user-project-role strong { flex: 0 0 auto; color: var(--mine-green); font-size: .7rem; }

.btn-mine { --bs-btn-color:#fff; --bs-btn-bg:var(--mine-green); --bs-btn-border-color:var(--mine-green); --bs-btn-hover-color:#fff; --bs-btn-hover-bg:#165d46; --bs-btn-hover-border-color:#165d46; }
.card { border-color: var(--mine-border); box-shadow: 0 2px 10px rgba(29,45,55,.04); border-radius: 12px; overflow: hidden; }
.card-header { background: #fff; border-bottom-color: var(--mine-border); padding: 1rem 1.15rem; }
.card-title { float: none; font-weight: 700; color: var(--mine-navy); }
.card-header .section-kicker { display: block; margin-bottom: .15rem; }
.metric-card { position: relative; min-height: 138px; padding: 1.1rem; color: #fff; border: 0; }
.metric-card .metric-label { opacity: .8; font-size: .78rem; font-weight: 600; text-transform: uppercase; letter-spacing: .07em; }
.metric-card .metric-value { font-size: 2rem; line-height: 1; font-weight: 700; margin: .65rem 0 .4rem; }
.metric-card .metric-note { font-size: .78rem; opacity: .82; }
.metric-card .metric-icon { position: absolute; right: 1rem; top: 1rem; font-size: 2.4rem; opacity: .2; }
.metric-green { background: linear-gradient(135deg, #216e56, #2f9875); }
.metric-navy { background: linear-gradient(135deg, #233641, #3d5969); }
.metric-gold { background: linear-gradient(135deg, #c68312, #e9ad3f); }
.metric-blue { background: linear-gradient(135deg, #27748b, #3aa0b8); }

.section-kicker { font-size: .7rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; color: #7d8b93; }
.status-dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; margin-right: .4rem; }
.status-ok { background:#27a36f; box-shadow: 0 0 0 4px rgba(39,163,111,.12); }
.status-warning { background:#e0a529; box-shadow: 0 0 0 4px rgba(224,165,41,.13); }
.status-danger { background:#dc5964; box-shadow: 0 0 0 4px rgba(220,89,100,.12); }
.badge-soft-success { background:#e4f4ed; color:#187052; }
.badge-soft-warning { background:#fff3d7; color:#98640b; }
.badge-soft-info { background:#e3f3f7; color:#176a7d; }
.badge-soft-danger { background:#fde8ea; color:#ad3440; }
.badge-soft-secondary { background:#edf0f2; color:#52616a; }
.badge { font-weight: 600; }
.organization-note-indicator { padding: .05rem .25rem; border: 0; color: var(--mine-gold); background: transparent; }
.organization-note-indicator:hover, .organization-note-indicator:focus { color: #a66b08; background: #fff3d7; }
.tooltip-inner { max-width: 360px; text-align: left; white-space: pre-line; }

.mini-chart { height: 210px; display: flex; align-items: flex-end; gap: 8px; padding-top: 1rem; border-bottom: 1px solid var(--mine-border); background-image: linear-gradient(to bottom, transparent 49%, #edf0f2 50%, transparent 51%); background-size: 100% 33%; }
.mini-chart .bar { flex: 1; min-width: 12px; background: linear-gradient(180deg, #3b9d79, #1f7257); border-radius: 5px 5px 0 0; position: relative; opacity: .9; }
.mini-chart .bar:hover { opacity: 1; }
.mini-chart .bar::after { content: attr(data-label); position: absolute; bottom: -1.6rem; width: 100%; text-align: center; font-size: .68rem; color: #7d8b93; }
.progress-thin { height: 6px; }
.activity-line { position: relative; padding-left: 1.8rem; padding-bottom: 1.2rem; }
.activity-line:not(:last-child)::before { content:""; position:absolute; left:.36rem; top:.8rem; bottom:-.2rem; border-left:1px solid #d8e0e4; }
.activity-line::after { content:""; position:absolute; left:0; top:.3rem; width:.75rem; height:.75rem; border-radius:50%; background:var(--mine-green); box-shadow:0 0 0 4px var(--mine-green-soft); }
.activity-line small { color:#809099; }

.table-modern { margin-bottom: 0; }
.table-modern thead th { color:#78868e; font-size:.68rem; text-transform:uppercase; letter-spacing:.07em; border-bottom-width:1px; white-space:nowrap; }
.table-modern tbody td { vertical-align:middle; padding-block:.85rem; }
.sample-code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-weight:700; color:var(--mine-navy); }
.initial-badge { width:34px; height:34px; display:inline-grid; place-items:center; border-radius:9px; background:var(--mine-green-soft); color:var(--mine-green); font-weight:700; }
.filter-strip { padding:.9rem; background:#f7f9fa; border:1px solid var(--mine-border); border-radius:10px; }
.grid-sort { color:inherit; text-decoration:none; display:inline-flex; gap:.3rem; align-items:center; }
.grid-sort:hover { color:var(--mine-green); }
.table-modern .btn-group form { display:flex; }
.form-label { color:var(--mine-navy); font-weight:600; margin-bottom:.35rem; }
.form-section-title { color:var(--mine-green); font-size:.72rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; padding-bottom:.55rem; border-bottom:1px solid var(--mine-border); margin:1.5rem 0 1rem; }
.form-section-title:first-of-type { margin-top:0; }
.font-monospace { font-size:.88rem; }

.license-card { border-left: 4px solid var(--mine-green); }
.license-card.warning { border-left-color: var(--mine-gold); }
.project-progress { display:flex; gap:.3rem; }
.project-progress span { height:5px; flex:1; border-radius:5px; background:#e3e8ea; }
.project-progress span.done { background:var(--mine-green); }
.sync-device { display:flex; align-items:center; gap:1rem; padding:1rem 0; border-bottom:1px solid var(--mine-border); }
.sync-device:last-child { border-bottom:0; }
.device-icon { width:44px; height:44px; display:grid; place-items:center; border-radius:12px; background:var(--mine-stone); font-size:1.25rem; }

.custody-timeline { display:grid; grid-template-columns:repeat(4,1fr); position:relative; gap:1rem; margin:1.5rem 0; }
.custody-timeline::before { content:""; position:absolute; top:22px; left:10%; right:10%; height:2px; background:#dfe5e8; }
.custody-step { position:relative; text-align:center; z-index:1; }
.custody-step .step-icon { width:46px; height:46px; display:grid; place-items:center; margin:0 auto .55rem; border-radius:50%; background:#fff; border:2px solid #cad4d9; }
.custody-step.done .step-icon { background:var(--mine-green); border-color:var(--mine-green); color:#fff; }
.custody-step.current .step-icon { background:#fff7e7; border-color:var(--mine-gold); color:#9d680b; }

.qaqc-gauge { --value: 92%; width:142px; aspect-ratio:1; border-radius:50%; background:conic-gradient(var(--mine-green) var(--value), #e4e9eb 0); display:grid; place-items:center; margin:auto; }
.qaqc-gauge::before { content:""; width:106px; aspect-ratio:1; border-radius:50%; background:#fff; }
.qaqc-gauge strong { position:absolute; font-size:1.75rem; color:var(--mine-navy); }

.map-shell { min-height:570px; position:relative; overflow:hidden; background-color:#dfe7e4; background-image:linear-gradient(35deg, transparent 48%, rgba(70,110,95,.15) 49%, rgba(70,110,95,.15) 51%, transparent 52%), linear-gradient(-55deg, transparent 48%, rgba(70,110,95,.12) 49%, rgba(70,110,95,.12) 51%, transparent 52%); background-size:110px 90px, 150px 130px; }
.map-shell::after { content:""; position:absolute; inset:8% 16% 12% 12%; border:3px dashed rgba(31,114,87,.55); border-radius:46% 31% 39% 28%; transform:rotate(-6deg); background:rgba(31,114,87,.05); }
.map-toolbar { position:absolute; z-index:4; top:1rem; left:1rem; right:1rem; display:flex; justify-content:space-between; pointer-events:none; }
.map-toolbar > * { pointer-events:auto; }
.map-layer-panel { position:absolute; z-index:4; right:1rem; bottom:1rem; width:220px; background:rgba(255,255,255,.94); border-radius:12px; padding:1rem; box-shadow:0 6px 24px rgba(23,37,46,.16); }
.map-pin { position:absolute; z-index:3; width:24px; height:24px; border-radius:50% 50% 50% 0; transform:rotate(-45deg); background:var(--mine-green); border:3px solid #fff; box-shadow:0 3px 8px rgba(0,0,0,.22); }
.map-pin.warning { background:var(--mine-gold); }
.map-pin.core { background:#347da2; }
.map-pin:nth-of-type(1) { left:29%; top:33%; }.map-pin:nth-of-type(2) { left:47%; top:52%; }.map-pin:nth-of-type(3) { left:62%; top:27%; }.map-pin:nth-of-type(4) { left:70%; top:64%; }.map-pin:nth-of-type(5) { left:38%; top:71%; }
.map-scale { position:absolute; z-index:3; left:1rem; bottom:1rem; font-size:.7rem; border-bottom:3px solid #33454f; width:100px; text-align:center; }
.interactive-map { width:100%; min-height:640px; z-index:1; background:#dfe7e4; }
.map-search-panel { position:absolute; z-index:500; top:1rem; left:3.6rem; width:min(360px,calc(100% - 5rem)); }
.map-search-results { background:#fff; border:1px solid var(--mine-border); border-radius:0 0 10px 10px; overflow:hidden; max-height:290px; overflow-y:auto; }
.map-search-results button { display:block; width:100%; border:0; border-bottom:1px solid var(--mine-border); background:#fff; padding:.65rem .8rem; text-align:left; }
.map-search-results button:hover { background:var(--mine-green-soft); }
.map-search-results small { display:block; color:#75848c; }
.map-click-hint { position:absolute; z-index:400; left:50%; bottom:1rem; transform:translateX(-50%); background:rgba(23,37,46,.88); color:#fff; border-radius:999px; padding:.45rem .8rem; font-size:.75rem; white-space:nowrap; pointer-events:none; }
.mobile-map-hint { display:none; }
.leaflet-popup-content a { color:var(--mine-green); font-weight:700; }

.empty-state { padding:3rem 1rem; text-align:center; color:#75848c; }
.empty-state i { font-size:2.4rem; color:#a7b4ba; }

@media (max-width: 767.98px) {
    .mobile-header-brand { display:flex; align-items:center; margin-left:.35rem; }
    .mobile-brand-link { display:flex; align-items:center; color:var(--mine-navy); text-decoration:none; }
    .mobile-brand-link .brand-mark { width:32px; height:32px; margin-right:.5rem; border-radius:9px; }
    .mobile-brand-link .brand-symbol { width:23px; height:23px; }
    .mobile-brand-link .brand-name { color:var(--mine-navy); font-family:"Space Grotesk",sans-serif; font-size:1.05rem; font-weight:500; letter-spacing:-.04em; line-height:1; }
    .mobile-brand-link .brand-name-main { color:var(--mine-navy); }
    .mobile-brand-link .brand-name-accent { color:#2a8e69; font-weight:700; }
    .sidebar-open .mobile-header-brand, .sidebar-expanded .mobile-header-brand { display:none; }
    .app-content-header { padding-top:1.2rem; }
    .custody-timeline { grid-template-columns:1fr; text-align:left; }
    .custody-timeline::before { top:0; bottom:0; left:22px; right:auto; width:2px; height:auto; }
    .custody-step { text-align:left; display:flex; gap:1rem; align-items:center; }
    .custody-step .step-icon { margin:0; flex:0 0 46px; }
    .map-shell { min-height:480px; }
    .map-layer-panel { left:1rem; right:1rem; width:auto; }
    .interactive-map { min-height:520px; }
    .map-search-panel { left:3.2rem; top:.7rem; }
    .map-click-hint { display:block; left:auto; right:.75rem; bottom:.75rem; transform:none; max-width:calc(100% - 1.5rem); padding:.42rem .7rem; white-space:normal; text-align:center; }
    .desktop-map-hint { display:none; }
    .mobile-map-hint { display:inline; }
}
