:root{--green:#0e7443;--green2:#12965d;--green3:#eaf7f0;--yellow:#f4c430;--ink:#163228;--muted:#688278;--line:#dbe7e1;--bg:#f3f7f5;--white:#fff;--danger:#bb3030;--warn:#9b6900;--shadow:0 12px 34px rgba(16,80,51,.10)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;color:var(--ink);background:var(--bg)}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}.container{width:min(1160px,92%);margin:auto}
.public-nav{height:76px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;position:sticky;top:0;z-index:10}.public-nav .container{display:flex;align-items:center;justify-content:space-between}.public-brand{display:flex;gap:12px;align-items:center}.brand-logo{width:36px;height:36px;display:grid;place-items:center;flex:0 0 36px;overflow:hidden}.brand-logo img{display:block;width:100%;height:100%;object-fit:contain}.brand-mark{width:36px;height:36px;border-radius:11px;background:linear-gradient(145deg,var(--green),var(--green2));color:white;display:grid;place-items:center;font-weight:900;font-size:23px;box-shadow:0 7px 15px rgba(14,116,67,.22)}.public-brand strong{display:block;font-size:16px}.public-brand span{display:block;font-size:12px;color:var(--muted)}
.btn{border:0;border-radius:12px;padding:11px 17px;display:inline-flex;gap:8px;align-items:center;justify-content:center;font-weight:750;cursor:pointer;transition:.2s}.btn-primary{background:var(--green);color:white;box-shadow:0 8px 18px rgba(14,116,67,.2)}.btn-primary:hover{transform:translateY(-1px);background:#0b653a}.btn-secondary{background:#fff;color:var(--green);border:1px solid #bcd6c8}.btn-danger{background:#fff2f2;color:var(--danger);border:1px solid #f0caca}.btn-sm{padding:7px 10px;border-radius:9px;font-size:12px}.btn-block{width:100%}
.hero{padding:78px 0;background:radial-gradient(circle at 85% 10%,#d9f5e6 0,transparent 30%),linear-gradient(135deg,#fbfefc,#eef9f3)}.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:center}.pill{display:inline-flex;background:#fff4cb;color:#765900;border:1px solid #f2df99;padding:7px 11px;border-radius:999px;font-size:12px;font-weight:800}.hero h1{font-size:clamp(36px,5vw,62px);line-height:1.02;margin:18px 0}.hero h1 em{color:var(--green);font-style:normal}.hero p{font-size:18px;line-height:1.7;color:#506e62;max-width:720px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}.mock{background:#173b2d;color:white;border-radius:26px;padding:22px;box-shadow:0 25px 60px rgba(14,75,47,.22);transform:rotate(1deg)}.mock-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.mock-dot{width:8px;height:8px;background:#51d493;border-radius:50%;box-shadow:0 0 0 5px rgba(81,212,147,.12)}.mini-cards{display:grid;grid-template-columns:1fr 1fr;gap:12px}.mini-card{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.13);border-radius:16px;padding:17px}.mini-card small{color:#b7d4c8}.mini-card b{font-size:24px;display:block;margin-top:8px}.risk-list{margin-top:12px;background:#fff;color:var(--ink);padding:15px;border-radius:16px}.risk-row{display:grid;grid-template-columns:10px 1fr auto;gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid #edf2ef}.risk-row:last-child{border:0}.dot-high{background:#d84a4a;width:8px;height:8px;border-radius:50%}.dot-med{background:#e7ab26;width:8px;height:8px;border-radius:50%}
.section{padding:70px 0}.section-head{text-align:center;max-width:720px;margin:0 auto 34px}.section-head h2{font-size:34px;margin:8px 0}.section-head p{color:var(--muted);line-height:1.65}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.feature{background:#fff;border:1px solid var(--line);border-radius:18px;padding:24px;box-shadow:0 8px 22px rgba(21,79,55,.05)}.feature .ico{width:45px;height:45px;border-radius:13px;background:var(--green3);color:var(--green);display:grid;place-items:center;font-size:21px}.feature h3{margin:16px 0 8px}.feature p{color:var(--muted);line-height:1.6;margin:0}.public-footer{background:#103529;color:#cae1d7;padding:26px 0}.public-footer .container{display:flex;justify-content:space-between;gap:20px;align-items:center;font-size:13px}
.login-page{min-height:100vh;background:radial-gradient(circle at 20% 15%,#dff5e8,transparent 34%),#f5faf7;display:grid;place-items:center;padding:30px}.login-shell{width:min(930px,96%);display:grid;grid-template-columns:1fr 1fr;background:#fff;border:1px solid var(--line);border-radius:26px;overflow:hidden;box-shadow:var(--shadow)}.login-side{padding:45px;background:linear-gradient(155deg,#0e7443,#0a4f31);color:#fff}.login-side h2{font-size:32px;margin:22px 0 12px}.login-side p{color:#d9eee3;line-height:1.7}.login-side ul{padding-left:18px;color:#d9eee3;line-height:2}.login-form{padding:45px}.login-form h1{margin:0 0 5px}.login-form>p{margin:0 0 26px;color:var(--muted)}.field{margin-bottom:16px}.field label{display:block;font-size:13px;font-weight:750;margin-bottom:7px}.field input,.field select,.field textarea{width:100%;border:1px solid #cbdad3;background:white;border-radius:11px;padding:11px 12px;outline:none}.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--green2);box-shadow:0 0 0 3px rgba(18,150,93,.11)}.error-box{background:#fff0f0;color:#952b2b;border:1px solid #f1caca;padding:11px 13px;border-radius:10px;margin-bottom:15px;font-size:13px}.helper{margin-top:18px;padding:12px;border-radius:11px;background:#fff9e5;color:#6e5a12;font-size:12px;line-height:1.55}
.app-shell{min-height:100vh}.sidebar{position:fixed;left:0;top:0;bottom:0;width:255px;background:#103529;color:white;padding:20px 14px;display:flex;flex-direction:column;z-index:30}.brand{display:flex;gap:11px;align-items:center;padding:4px 8px 22px}.brand strong{display:block}.brand span{display:block;color:#a9c8bb;font-size:11px;margin-top:2px}.sidebar .brand-logo{width:34px;height:34px;flex-basis:34px;background:#fff;border-radius:9px;padding:2px}.nav{display:flex;flex-direction:column;gap:5px}.nav a{display:flex;gap:11px;align-items:center;padding:11px 12px;border-radius:11px;color:#cfe1d9;font-size:14px}.nav a span{width:20px;text-align:center}.nav a:hover,.nav a.active{background:rgba(255,255,255,.10);color:#fff}.nav a.active{box-shadow:inset 3px 0 0 var(--yellow)}.sidebar-foot{margin-top:auto;padding:12px 8px}.security-note{font-size:11px;color:#9ec0b2;margin-bottom:12px}.security-note span{color:#42d994}.logout-link{font-size:13px;color:#fff}.main{margin-left:255px;min-height:100vh}.topbar{height:82px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 28px;position:sticky;top:0;z-index:20}.topbar h1{font-size:22px;margin:2px 0 0}.eyebrow{font-size:10px;letter-spacing:.14em;color:var(--green);font-weight:850}.user-chip{display:flex;align-items:center;gap:9px}.avatar{width:37px;height:37px;border-radius:11px;background:var(--green3);color:var(--green);display:grid;place-items:center;font-weight:850}.user-chip strong,.user-chip span{display:block}.user-chip strong{font-size:13px}.user-chip span{font-size:11px;color:var(--muted)}.content{padding:26px}.app-footer{padding:0 26px 24px;color:#82958d;font-size:11px}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:18px}.stat{background:white;border:1px solid var(--line);border-radius:17px;padding:18px}.stat .label{color:var(--muted);font-size:12px}.stat .value{font-weight:850;font-size:26px;margin-top:7px}.stat .meta{font-size:11px;margin-top:6px;color:#789087}.stat .accent{color:var(--green)}.grid-2{display:grid;grid-template-columns:1.3fr .7fr;gap:18px}.card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:19px;box-shadow:0 5px 18px rgba(20,70,50,.04)}.card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:15px}.card h2,.card h3{margin:0}.card h2{font-size:17px}.muted{color:var(--muted)}.small{font-size:12px}.table-wrap{overflow:auto}.table{width:100%;border-collapse:collapse;min-width:700px}.table th{font-size:11px;text-transform:uppercase;letter-spacing:.04em;text-align:left;color:#71877e;padding:10px;border-bottom:1px solid var(--line)}.table td{font-size:13px;padding:11px 10px;border-bottom:1px solid #edf2ef;vertical-align:top}.table tr:last-child td{border-bottom:0}.badge{display:inline-flex;align-items:center;border-radius:999px;padding:5px 8px;font-size:10px;font-weight:850}.badge.danger{background:#fff0f0;color:#a52727}.badge.warning{background:#fff7dc;color:#845e00}.badge.success{background:#e9f8ef;color:#157344}.badge.neutral{background:#eef3f1;color:#52675f}.toolbar{display:flex;gap:10px;align-items:center;justify-content:space-between;margin-bottom:15px;flex-wrap:wrap}.toolbar .filters{display:flex;gap:8px;flex-wrap:wrap}.toolbar input,.toolbar select{border:1px solid #ccd9d3;border-radius:9px;padding:8px 10px;background:white}.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.form-grid .full{grid-column:1/-1}.modal-panel{border:1px dashed #bcd3c7;background:#fbfefc;border-radius:15px;padding:16px;margin-bottom:18px}.alert{padding:11px 13px;border-radius:10px;margin-bottom:14px;font-size:13px}.alert.success{background:#eaf8f0;color:#176a43}.alert.error{background:#fff0f0;color:#972d2d}.alert.info{background:#edf6ff;color:#285e91}.progress-row{margin:12px 0}.progress-top{display:flex;justify-content:space-between;font-size:12px;margin-bottom:6px}.progress{height:8px;background:#edf2ef;border-radius:99px;overflow:hidden}.progress>i{display:block;height:100%;background:linear-gradient(90deg,var(--green),#54c788);border-radius:99px}.empty{padding:30px;text-align:center;color:var(--muted)}.callout{padding:16px;border-radius:14px;background:#fff9e8;border-left:4px solid var(--yellow);font-size:13px;line-height:1.65}.kpi-list{display:grid;gap:9px}.kpi-item{display:flex;justify-content:space-between;gap:15px;padding:10px 0;border-bottom:1px solid #edf2ef;font-size:13px}.kpi-item:last-child{border-bottom:0}.reg-card{padding:20px;border-radius:16px;background:linear-gradient(135deg,#0f7544,#115836);color:#fff}.reg-card p{color:#d4e9de;line-height:1.6}.reg-card .btn{margin-top:6px}.danger-text{color:var(--danger)}.text-right{text-align:right}.mobile-only{display:none}.icon-btn{border:0;background:#edf5f1;border-radius:9px;padding:8px 10px;cursor:pointer}
@media(max-width:980px){.hero-grid,.login-shell,.grid-2{grid-template-columns:1fr}.feature-grid{grid-template-columns:1fr 1fr}.stats{grid-template-columns:1fr 1fr}.login-side{display:none}.sidebar{transform:translateX(-100%);transition:.2s}.sidebar.open{transform:none}.main{margin-left:0}.mobile-only{display:inline-flex}.topbar{padding:0 16px}.content{padding:18px}.user-chip>div:last-child{display:none}}
@media(max-width:650px){.hero{padding:48px 0}.feature-grid,.stats,.form-grid{grid-template-columns:1fr}.public-footer .container{flex-direction:column;align-items:flex-start}.login-form{padding:28px}.topbar h1{font-size:18px}.hero h1{font-size:39px}.mock{transform:none}}
@media print{.sidebar,.topbar,.app-footer,.toolbar,.no-print{display:none!important}.main{margin:0}.content{padding:0}.card{box-shadow:none;border-color:#bbb}.app-body{background:white}}

/* v2 - Modul input laporan */
.report-sheet{max-width:1050px;margin:0 auto}.report-letterhead{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;border-bottom:2px solid var(--green);padding-bottom:16px;margin-bottom:18px}.report-letterhead h2{font-size:22px;margin:5px 0}.report-no{text-align:right}.report-no span,.report-meta span,.report-sign span{display:block;color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.06em}.report-no b{display:block;margin-top:5px}.report-meta{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:18px 0}.report-meta>div{background:#f8fbf9;border:1px solid var(--line);border-radius:12px;padding:11px}.report-meta b{font-size:12px;display:block;margin-top:4px}.report-title{padding:22px 0 10px}.report-title>span{font-size:11px;font-weight:800;color:var(--green);text-transform:uppercase}.report-title h1{font-size:26px;line-height:1.25;margin:7px 0}.report-title p{color:var(--muted);font-size:12px}.report-section{padding:17px 0;border-top:1px solid var(--line)}.report-section h3{font-size:14px;margin:0 0 8px;color:#254b3b}.report-text{font-size:13px;line-height:1.75;white-space:normal}.report-sign{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;border-top:1px solid var(--line);padding-top:22px;margin-top:14px}.report-sign b{display:block;margin-top:8px;font-size:13px}.nav a[href="input_laporan.php"]{font-weight:750}
@media(max-width:780px){.report-meta,.report-sign{grid-template-columns:1fr 1fr}.report-letterhead{flex-direction:column}.report-no{text-align:left}}
@media print{.report-sheet{max-width:none;border:0;padding:0}.report-meta{grid-template-columns:repeat(4,1fr)}.report-section{break-inside:avoid}.report-letterhead{margin-top:0}}

/* v3 - Kanal WBS publik + database petugas */
.public-actions{display:flex;gap:8px;align-items:center}.public-trust{display:flex;gap:16px;flex-wrap:wrap;margin-top:20px;color:#5b776b;font-size:12px;font-weight:700}.inline-link{display:inline-flex;margin-top:14px;color:var(--green);font-weight:800;font-size:13px}.stats.five{grid-template-columns:repeat(5,1fr)}.compact-value{font-size:17px!important;line-height:1.25}.quick-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:13px}.compact-table{min-width:560px}
.report-public-body{background:#f3f7f5}.report-hero{padding:52px 0 36px;background:radial-gradient(circle at 85% 0,#d8f5e5 0,transparent 32%),linear-gradient(135deg,#fbfefc,#eef9f3);border-bottom:1px solid var(--line)}.report-hero-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:34px;align-items:center}.report-hero h1{font-size:clamp(34px,4.2vw,54px);margin:10px 0 12px;line-height:1.02}.report-hero h1 em{font-style:normal;color:var(--green)}.report-hero p{font-size:16px;line-height:1.7;color:#587267;max-width:760px}.privacy-box{background:#103529;color:white;border-radius:20px;padding:22px;box-shadow:0 18px 38px rgba(16,53,41,.16)}.privacy-box b,.privacy-box span{display:block}.privacy-box span{font-size:13px;line-height:1.6;color:#cbe2d8;margin-top:8px}.report-public-main{padding-top:28px;padding-bottom:60px}.public-form-grid{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:20px;align-items:start}.public-report-form{padding:28px}.form-title{padding-bottom:20px;border-bottom:1px solid var(--line);margin-bottom:6px}.form-title>span{font-size:10px;letter-spacing:.14em;font-weight:900;color:var(--green)}.form-title h2{font-size:26px;margin:7px 0 5px}.form-title p{margin:0;color:var(--muted);font-size:13px}.form-section{padding:22px 0;border-bottom:1px solid var(--line)}.form-section:last-of-type{border-bottom:0}.form-section h3{font-size:15px;margin:0 0 16px}.field-help{font-size:11px;color:var(--muted);line-height:1.55;margin-top:6px}.radio-cards{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}.radio-cards label{display:flex;align-items:flex-start;gap:10px;border:1px solid var(--line);border-radius:13px;padding:13px;cursor:pointer;background:#fbfefc}.radio-cards label:has(input:checked){border-color:#83c6a2;background:#effaf4;box-shadow:0 0 0 2px rgba(18,150,93,.08)}.radio-cards input{width:auto;margin-top:3px}.radio-cards b,.radio-cards small{display:block}.radio-cards small{color:var(--muted);margin-top:3px}.identity-fields{display:none}.identity-fields.show{display:grid}.consent-box{margin:4px 0 18px;padding:15px;border-radius:13px;background:#f8fbf9;border:1px solid var(--line)}.consent-box label{display:flex;gap:10px;align-items:flex-start;font-size:12px;line-height:1.6}.consent-box input{margin-top:3px}.public-report-side{display:grid;gap:14px;position:sticky;top:92px}.public-report-side .card{padding:20px}.public-report-side h3{font-size:17px;margin:5px 0 14px}.timeline{display:grid;gap:2px}.timeline>div{display:grid;grid-template-columns:32px 1fr;gap:10px;position:relative;padding-bottom:15px}.timeline>div:not(:last-child):before{content:"";position:absolute;left:15px;top:28px;bottom:0;border-left:1px dashed #b9cfc4}.timeline i{width:30px;height:30px;border-radius:10px;background:var(--green3);color:var(--green);display:grid;place-items:center;font-style:normal;font-weight:900}.timeline b,.timeline small{display:block}.timeline b{font-size:13px;margin:2px 0 3px}.timeline small{color:var(--muted);line-height:1.45}.side-warning{border-left:4px solid var(--yellow)!important}.submit-success{display:grid;grid-template-columns:52px 1fr;gap:16px;align-items:start;background:#effaf4;border:1px solid #bfe0ce;border-radius:18px;padding:20px;margin-bottom:20px}.success-icon{width:50px;height:50px;border-radius:50%;display:grid;place-items:center;background:var(--green);color:white;font-size:24px;font-weight:900}.submit-success h2{margin:0 0 4px}.submit-success p{margin:4px 0}.registration-code{display:inline-block;background:#103529;color:white;padding:9px 13px;border-radius:9px;font-weight:900;letter-spacing:.04em;margin:5px 0 8px}.hp-field{position:absolute!important;left:-99999px!important;opacity:0!important;width:1px!important;height:1px!important;overflow:hidden!important}
.wbs-detail-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(330px,.65fr);gap:18px;align-items:start}.detail-meta{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;padding:15px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.detail-meta>div{background:#f8fbf9;border-radius:10px;padding:10px}.detail-meta span,.detail-meta b{display:block}.detail-meta span{font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}.detail-meta b{font-size:12px;margin-top:4px}.detail-section{padding:17px 0;border-bottom:1px solid #edf2ef}.detail-section:last-child{border-bottom:0}.detail-section h3{font-size:13px;margin:0 0 8px;color:#315647}.detail-section p{margin:0;line-height:1.6;font-size:13px}.attachment-list{display:grid;gap:7px}.attachment-list a{display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid var(--line);border-radius:10px;padding:10px 12px}.attachment-list a:hover{border-color:#88bda2;background:#f7fbf9}.attachment-list b,.attachment-list span{font-size:12px}.attachment-list span{color:var(--muted)}.confidential-card{border-left:4px solid #d84a4a}.screening-card{margin-top:18px}.risk-preview{background:#fff8df;border:1px solid #f0dda0;border-radius:10px;padding:10px 12px;font-size:12px}.wbs-stats .stat{min-height:115px}
@media(max-width:1180px){.stats.five{grid-template-columns:repeat(3,1fr)}}
@media(max-width:980px){.report-hero-grid,.public-form-grid,.wbs-detail-grid{grid-template-columns:1fr}.public-report-side{position:static}.detail-meta{grid-template-columns:1fr 1fr}.stats.five{grid-template-columns:1fr 1fr}.public-actions .btn-secondary{display:none}}
@media(max-width:650px){.radio-cards,.detail-meta,.stats.five{grid-template-columns:1fr}.public-report-form{padding:20px}.report-hero{padding:36px 0 26px}.report-hero h1{font-size:38px}.public-actions .btn{padding:8px 10px}.submit-success{grid-template-columns:1fr}.success-icon{width:42px;height:42px}}
@media print{.confidential-card{border-color:#bbb}.screening-card button{display:none}.wbs-detail-grid{grid-template-columns:1fr}.public-report-side{display:none}}
.dashboard-charts{margin-top:18px}.apex-chart{min-height:285px;width:100%}