:root{
    --blue:#0f6fe8;
    --blue-dark:#0a4fa8;
    --soft:#f4f7fb;
    --text:#263445;
    --muted:#778195;
    --line:#e8edf5;
    --purple:#6b5bd6;
    --green:#2bcf3a;
    --red:#fb5262;
    --orange:#ffad42;
    --shadow:0 10px 28px rgba(31,45,61,.08);
}
*{box-sizing:border-box}
body{margin:0;font-family:"Segoe UI",Arial,sans-serif;background:var(--soft);color:var(--text)}
a{text-decoration:none;color:inherit}
.app-shell{display:flex;min-height:100vh}
.sidebar{width:260px;background:#fff;border-right:1px solid var(--line);display:flex;flex-direction:column;position:fixed;top:0;bottom:0;left:0;z-index:10;box-shadow:0 4px 18px rgba(0,0,0,.05)}
.brand{height:86px;background:var(--blue);display:flex;gap:12px;align-items:center;padding:18px 22px;color:#fff}
.brand-mark{width:40px;height:40px;border:2px solid rgba(255,255,255,.8);border-radius:12px;display:flex;align-items:center;justify-content:center;font-weight:800;letter-spacing:.5px}
.brand-title{font-weight:800;font-size:17px;letter-spacing:.5px}.brand-sub{font-size:12px;opacity:.9;letter-spacing:1.4px}
.profile{display:flex;align-items:center;gap:12px;padding:22px 20px;border-bottom:1px solid var(--line)}
.avatar,.top-avatar{width:45px;height:45px;border-radius:50%;background:var(--purple);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:20px;box-shadow:inset 0 -2px 0 rgba(0,0,0,.12)}
.profile-name{font-weight:700;max-width:155px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.profile-role{font-size:12px;color:var(--muted);margin-top:4px}
.menu{padding:14px 16px;flex:1;overflow:auto}.menu-caption{font-size:11px;color:#8d98aa;margin:18px 10px 8px;text-transform:uppercase;letter-spacing:.8px}.menu a{display:flex;align-items:center;gap:11px;padding:12px 14px;border-radius:8px;color:#6b7280;font-weight:600;margin:4px 0;font-size:14px}.menu a span{width:19px;text-align:center}.menu a.active{background:var(--blue);color:#fff;box-shadow:0 7px 14px rgba(15,111,232,.22)}.menu a.sub{font-size:13px;font-weight:500;padding:8px 14px 8px 36px;color:#7f8899}.menu a:hover{background:#eef5ff;color:var(--blue)}.menu a.active:hover{background:var(--blue);color:#fff}
.logout{display:block;margin:16px 22px 24px;background:var(--red);color:#fff;text-align:center;border-radius:6px;padding:12px 14px;font-weight:700;font-size:14px}
.main{margin-left:260px;flex:1;min-height:100vh;display:flex;flex-direction:column}.topbar{height:76px;background:linear-gradient(120deg,var(--blue),var(--blue-dark));display:flex;align-items:center;padding:0 30px;color:#fff;box-shadow:0 2px 10px rgba(15,111,232,.25);position:sticky;top:0;z-index:5}.hamburger{background:transparent;border:0;color:#fff;font-size:25px;cursor:pointer;margin-right:22px}.topbar-title{font-weight:700;letter-spacing:.2px;flex:1}.top-avatar{width:42px;height:42px;border:2px solid #fff;background:#5b54d2}
.content{padding:34px;flex:1}.hero{background:linear-gradient(120deg,var(--blue),#06418b);color:#fff;padding:40px 34px 74px;margin:-34px -34px 0}.hero h1{margin:0;font-size:28px}.hero p{margin:12px 0 0;color:#dbeafe}.quick-actions{display:flex;gap:12px;margin-top:22px}.btn{border:0;border-radius:8px;padding:11px 18px;font-weight:700;display:inline-flex;gap:8px;align-items:center;cursor:pointer;font-size:14px}.btn-primary{background:var(--blue);color:#fff}.btn-outline{background:#fff;color:var(--blue);border:1px solid #cfe1ff}.btn-green{background:var(--green);color:#fff}.btn-red{background:var(--red);color:#fff}.btn-orange{background:var(--orange);color:#fff}.btn-purple{background:var(--purple);color:#fff}.btn-sm{padding:7px 11px;font-size:12px}.btn-wide{width:100%;justify-content:center}.btn-white{background:#fff;color:var(--blue)}
.stat-wrap{background:#fff;margin-top:-45px;border-radius:8px;box-shadow:var(--shadow);display:grid;grid-template-columns:repeat(4,1fr);overflow:hidden}.stat{display:flex;align-items:center;gap:22px;padding:26px 28px;border-right:1px solid var(--line)}.stat:last-child{border-right:0}.stat-icon{width:94px;height:58px;border-radius:6px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:30px}.stat-meta{font-size:13px;color:var(--muted)}.stat-number{font-size:20px;margin-top:5px;color:#28364b}.bg-red{background:var(--red)}.bg-purple{background:var(--purple)}.bg-orange{background:var(--orange)}.bg-green{background:var(--green)}.bg-blue{background:var(--blue)}
.section-title{font-size:24px;color:var(--blue);margin:34px 0 18px}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:26px}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.card{background:#fff;border-radius:8px;box-shadow:var(--shadow);padding:24px}.card h2,.card h3{margin-top:0}.muted{color:var(--muted)}.divider{height:1px;background:var(--line);margin:16px 0}.feature-card{display:flex;align-items:center;gap:18px;background:#fff;border-radius:8px;box-shadow:var(--shadow);padding:24px;min-height:96px}.feature-icon{width:58px;height:58px;border-radius:7px;background:var(--blue);color:#fff;display:flex;align-items:center;justify-content:center;font-size:29px}.feature-title{font-size:19px;font-weight:700}.feature-text{font-size:13px;color:var(--muted);margin-top:4px}.page-title{font-size:25px;margin:0 0 22px}.breadcrumb{font-size:13px;color:var(--muted);margin-bottom:20px}.table-card{background:#fff;border-radius:8px;box-shadow:var(--shadow);overflow:hidden}.table-header{display:flex;align-items:center;justify-content:space-between;padding:18px 20px;border-bottom:1px solid var(--line)}.table{width:100%;border-collapse:collapse;background:#fff}.table th,.table td{padding:16px 18px;border-bottom:1px solid var(--line);vertical-align:top;text-align:left;font-size:14px}.table th{font-size:13px;color:#1e293b;background:#fff}.table tr:nth-child(even) td{background:#fbfcfe}.badge{display:inline-block;border-radius:999px;color:#fff;padding:5px 10px;font-size:12px;font-weight:700}.badge-open{background:var(--red)}.badge-answered{background:var(--purple)}.badge-reply{background:var(--orange)}.badge-closed{background:var(--green)}.pill{display:inline-block;border-radius:999px;padding:5px 10px;background:#121b3f;color:#fff;font-size:12px}.pill-purple{background:var(--purple)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}.form-group{margin-bottom:17px}.label{display:block;font-weight:700;font-size:13px;margin-bottom:7px}.input,.select,.textarea{width:100%;border:1px solid #d9e2ef;border-radius:8px;background:#fff;padding:12px 13px;font-family:inherit;font-size:14px;outline:none}.input:focus,.select:focus,.textarea:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(15,111,232,.10)}.textarea{min-height:130px;resize:vertical}.help{font-size:12px;color:var(--muted);margin-top:6px}.ticket-head{background:#fff;border-radius:8px;box-shadow:var(--shadow);padding:22px;border-bottom:4px solid var(--blue)}.ticket-meta{display:grid;grid-template-columns:repeat(3,1fr) 260px;gap:18px;margin-top:20px;align-items:center}.message{background:#fff;border-radius:12px;box-shadow:var(--shadow);padding:20px;margin:20px 0}.message.admin{margin-left:60px}.message.user{margin-right:60px}.message-top{display:flex;justify-content:space-between;gap:18px;margin-bottom:12px}.message-name{font-weight:800}.message-role{margin-left:8px}.time-chip{background:var(--blue);color:#fff;padding:6px 10px;border-radius:999px;font-size:12px;white-space:nowrap}.attachment{display:inline-flex;align-items:center;gap:8px;color:var(--blue);font-weight:700;font-size:13px}.toast{position:fixed;right:24px;top:92px;z-index:99;background:#fff;border-left:5px solid var(--blue);box-shadow:var(--shadow);border-radius:8px;padding:13px 18px;min-width:280px;animation:fadeout 5s forwards}.toast.success{border-color:var(--green)}.toast.danger{border-color:var(--red)}.toast.info{border-color:var(--blue)}@keyframes fadeout{0%,80%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(-10px);pointer-events:none}}
.login-body{min-height:100vh;background:linear-gradient(135deg,#0f6fe8 0%,#063d88 48%,#f4f7fb 48%,#f4f7fb 100%);display:flex;align-items:center;justify-content:center;padding:35px}.login-panel{width:100%;max-width:1040px;background:#fff;border-radius:20px;box-shadow:0 20px 60px rgba(0,0,0,.18);overflow:hidden;display:grid;grid-template-columns:1.05fr 1fr}.login-left{background:linear-gradient(135deg,var(--blue),#06418b);color:#fff;padding:44px}.login-logo{width:70px;height:70px;border:2px solid rgba(255,255,255,.9);border-radius:18px;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:24px;margin-bottom:28px}.login-left h1{font-size:34px;margin:0 0 12px;line-height:1.1}.login-left p{color:#dbeafe;font-size:15px;line-height:1.7}.login-bullets{margin-top:28px}.login-bullet{display:flex;gap:12px;margin:14px 0}.login-bullet span{width:24px;height:24px;border-radius:50%;background:rgba(255,255,255,.16);display:flex;align-items:center;justify-content:center}.login-right{padding:44px}.role-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:18px 0 22px}.role-tab{border:1px solid #d9e2ef;background:#fff;border-radius:12px;padding:14px;cursor:pointer;text-align:center;font-weight:800;color:#64748b}.role-tab.active{background:var(--blue);color:#fff;border-color:var(--blue);box-shadow:0 8px 18px rgba(15,111,232,.2)}.privacy{font-size:12px;color:var(--muted);line-height:1.5;background:#f8fafc;border:1px solid var(--line);border-radius:10px;padding:12px;margin:12px 0}.footer{display:flex;justify-content:space-between;gap:12px;padding:16px 34px;color:#6b7280;font-size:12px;background:#fff;border-top:1px solid var(--line)}
.kpi-mini{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:20px}.kpi-mini .card{padding:18px}.kpi-value{font-size:28px;font-weight:800;color:var(--blue)}.kpi-label{color:var(--muted);font-size:13px}.risk-item{border-left:4px solid var(--blue);padding:12px 14px;background:#f8fbff;margin:10px 0;border-radius:8px}.empty{padding:36px;text-align:center;color:var(--muted)}
@media(max-width:980px){.sidebar{transform:translateX(-100%);transition:.2s}.sidebar.show{transform:translateX(0)}.main{margin-left:0}.stat-wrap,.grid-2,.grid-3,.grid-4,.kpi-mini{grid-template-columns:1fr}.ticket-meta{grid-template-columns:1fr}.form-row{grid-template-columns:1fr}.login-panel{grid-template-columns:1fr}.login-left{display:none}.content{padding:22px}.hero{margin:-22px -22px 0;padding:30px 22px 68px}.stat{border-right:0;border-bottom:1px solid var(--line)}.footer{flex-direction:column}.message.admin,.message.user{margin-left:0;margin-right:0}}
/* Portal awal GERBANG INTEGRITAS */
.portal-body{min-height:100vh;background:#f4f7fb;color:var(--text)}
.portal-hero{background:linear-gradient(125deg,#0f6fe8 0%,#06418b 78%);color:#fff;padding:26px 42px 130px;position:relative;overflow:hidden}
.portal-hero:before{content:"";position:absolute;right:-120px;top:-160px;width:430px;height:430px;border-radius:50%;background:rgba(255,255,255,.12)}
.portal-hero:after{content:"";position:absolute;left:-90px;bottom:-140px;width:330px;height:330px;border-radius:50%;background:rgba(255,255,255,.08)}
.portal-nav{display:flex;justify-content:space-between;align-items:center;gap:20px;position:relative;z-index:1}
.brand-inline{display:flex;align-items:center;gap:13px;color:inherit}
.brand-inline span{width:46px;height:46px;border-radius:14px;background:rgba(255,255,255,.16);border:2px solid rgba(255,255,255,.8);display:flex;align-items:center;justify-content:center;font-weight:900;letter-spacing:.5px}
.brand-inline b{display:block;font-size:16px;letter-spacing:.6px}.brand-inline small{display:block;font-size:12px;opacity:.8;letter-spacing:1.2px;margin-top:2px}
.portal-title{max-width:860px;margin:90px auto 0;text-align:center;position:relative;z-index:1}.portal-title h1{font-size:48px;line-height:1.05;margin:14px 0}.portal-title p{font-size:17px;color:#dbeafe;line-height:1.7;margin:0 auto;max-width:780px}.hero-badge{display:inline-flex;padding:8px 13px;border-radius:999px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.28);font-weight:800;font-size:13px}
.portal-main{max-width:1180px;margin:-82px auto 0;padding:0 24px 50px;position:relative;z-index:2}.portal-card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.entry-card{background:#fff;border-radius:22px;box-shadow:0 20px 55px rgba(31,45,61,.13);padding:30px;min-height:310px;display:flex;flex-direction:column;position:relative;overflow:hidden;border:1px solid #edf2f9;transition:.18s transform,.18s box-shadow}.entry-card:hover{transform:translateY(-5px);box-shadow:0 25px 65px rgba(31,45,61,.18)}.entry-card:before{content:"";position:absolute;right:-50px;top:-50px;width:160px;height:160px;border-radius:50%;background:#f2f7ff}.entry-icon{width:70px;height:70px;border-radius:18px;background:var(--blue);color:#fff;display:flex;align-items:center;justify-content:center;font-size:33px;margin-bottom:20px;position:relative}.report-entry .entry-icon{background:var(--purple)}.info-entry .entry-icon{background:var(--orange)}.entry-tag{position:absolute;right:24px;top:24px;border-radius:999px;background:#f1f5f9;color:#64748b;padding:6px 12px;font-size:12px;font-weight:800}.entry-card h2{font-size:25px;margin:0 0 12px}.entry-card p{color:var(--muted);line-height:1.65;margin:0;flex:1}.entry-action{font-weight:900;color:var(--blue);margin-top:22px}.report-entry .entry-action{color:var(--purple)}.info-entry .entry-action{color:#f08d13}.portal-note{background:#fff;border:1px solid #e8edf5;border-left:5px solid var(--blue);border-radius:14px;padding:18px 22px;box-shadow:var(--shadow);margin-top:24px;line-height:1.6;color:#475569}
.auth-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#0f6fe8 0%,#06418b 42%,#f4f7fb 42%,#f4f7fb 100%);padding:34px}.auth-card{width:100%;max-width:760px;background:#fff;border-radius:22px;padding:34px;box-shadow:0 20px 60px rgba(0,0,0,.18)}.wide-auth{max-width:820px}.report-auth{max-width:1120px}.auth-logo{width:64px;height:64px;border-radius:18px;background:var(--blue);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:22px;margin-bottom:18px}.auth-card h1{margin:0 0 8px;font-size:32px}.back-link{display:inline-block;color:var(--blue);font-weight:800;margin-bottom:18px}.soft-card{box-shadow:none;border:1px solid var(--line);background:#fff}.accent-card{background:#fbfaff;border-color:#ded8ff}.report-login-grid{margin-top:22px}.access-note{margin:18px 0;background:#f8fbff;border:1px solid #dceaff}.access-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.access-grid div{background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px}.access-grid span{display:block;color:var(--muted);font-size:12px}.access-grid b{font-size:22px;color:var(--blue);letter-spacing:.5px}
.public-body{background:#f4f7fb}.public-header{height:78px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:18px;padding:0 42px;position:sticky;top:0;z-index:4;box-shadow:0 4px 18px rgba(0,0,0,.04)}.public-header .brand-inline span{background:var(--blue);border:0;color:#fff}.public-header .brand-inline b{color:#1e293b}.public-header .brand-inline small{color:var(--muted);opacity:1}.public-actions{display:flex;gap:10px;align-items:center}.info-hero{background:linear-gradient(125deg,#0f6fe8,#06418b);color:#fff;text-align:center;padding:72px 24px 86px}.info-hero h1{font-size:42px;margin:13px 0}.info-hero p{max-width:860px;margin:0 auto;color:#dbeafe;line-height:1.65}.public-main{max-width:1180px;margin:-42px auto 0;padding:0 24px 44px}.info-filter{display:grid;grid-template-columns:1.6fr .8fr auto;gap:12px;background:#fff;border-radius:16px;box-shadow:var(--shadow);padding:18px;margin-bottom:24px}.info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.info-card{background:#fff;border-radius:20px;box-shadow:var(--shadow);padding:24px;min-height:250px;display:flex;flex-direction:column;border:1px solid #eef2f7;transition:.18s}.info-card:hover{transform:translateY(-4px);box-shadow:0 18px 45px rgba(31,45,61,.13)}.info-topline{display:flex;justify-content:space-between;gap:12px;align-items:center;color:var(--muted);font-size:12px;margin-bottom:18px}.info-channel{border-radius:999px;padding:6px 11px;font-weight:900;color:#fff;background:var(--blue)}.info-channel.dumas{background:var(--orange)}.info-channel.coi{background:var(--purple)}.info-channel.wbs{background:var(--red)}.info-card h2{margin:0 0 12px;font-size:21px}.info-card p{color:var(--muted);line-height:1.6;flex:1}.info-card-footer{display:flex;justify-content:space-between;gap:12px;color:var(--blue);font-size:13px;font-weight:800;margin-top:16px}.article-main{max-width:900px;margin:34px auto;padding:0 24px}.article-card{background:#fff;border-radius:22px;box-shadow:var(--shadow);padding:34px;border:1px solid #eef2f7}.article-card h1{font-size:36px;margin:8px 0 12px}.lead{font-size:17px;color:#64748b;line-height:1.7}.article-card p{line-height:1.8}.article-actions{margin-top:26px;display:flex;gap:10px;flex-wrap:wrap}.public-footer{padding:24px;text-align:center;color:#64748b;font-size:13px;background:#fff;border-top:1px solid var(--line);margin-top:30px}
@media(max-width:980px){.portal-hero{padding:22px 22px 110px}.portal-title{margin-top:56px}.portal-title h1{font-size:36px}.portal-card-grid,.info-grid,.info-filter{grid-template-columns:1fr}.public-header{padding:0 18px}.public-actions{display:none}.auth-wrap{padding:18px}.auth-card{padding:24px}.access-grid{grid-template-columns:1fr}}
/* v1.2: WBS public recap, admin follow-up recap, and information manager */
.wbs-public-box{margin-top:24px;background:#fff;border:1px solid #fee2e2;border-left:6px solid var(--red);border-radius:20px;box-shadow:var(--shadow);padding:24px;display:grid;grid-template-columns:1.3fr auto;gap:22px;align-items:center}.wbs-public-box h2{margin:18px 0 8px}.wbs-public-box p{color:var(--muted);line-height:1.65;margin:0}.wbs-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}.static-tag{position:static;display:inline-flex;margin-bottom:0;background:#fff0f1;color:var(--red)}.home-section{margin-top:34px}.home-info-grid{margin-bottom:22px}.wbs-inline-alert{background:#fff;border:1px solid #fecdd3;border-left:5px solid var(--red);border-radius:14px;padding:16px 20px;box-shadow:var(--shadow);margin-bottom:20px;line-height:1.6;color:#475569}.wbs-inline-alert a{color:var(--red);font-weight:900}.admin-actions-row{display:flex;gap:10px;flex-wrap:wrap;margin:-8px 0 20px}.bar-row{margin:16px 0}.bar-label{display:flex;justify-content:space-between;gap:12px;font-size:13px;color:#334155;margin-bottom:8px}.bar-label span{color:var(--muted);font-weight:700}.bar-track{height:16px;background:#eef2f7;border-radius:999px;overflow:hidden}.bar-fill{height:100%;border-radius:999px;min-width:5px}.bar-fill.badge-open{background:var(--red)}.bar-fill.badge-answered{background:var(--purple)}.bar-fill.badge-reply{background:var(--orange)}.bar-fill.badge-closed{background:var(--green)}.admin-recap-table th,.admin-recap-table td{min-width:140px}.admin-recap-table th:nth-child(1),.admin-recap-table td:nth-child(1){min-width:60px}.admin-recap-table th:nth-child(3),.admin-recap-table td:nth-child(3){min-width:300px}.admin-recap-table th:nth-child(5),.admin-recap-table td:nth-child(5){min-width:260px}.small-textarea{min-height:92px}.recap-hero{padding-bottom:76px}.recap-main{margin-top:-36px}.public-kpi{margin-bottom:24px}.print-card{margin-top:12px}
@media(max-width:980px){.wbs-public-box{grid-template-columns:1fr}.wbs-actions{justify-content:flex-start}}
@media print{.no-print,.public-header,.public-footer,.btn,.portal-note{display:none!important}body{background:#fff}.info-hero{padding:22px!important;background:#fff!important;color:#111!important}.info-hero p{color:#333!important}.public-main,.recap-main{max-width:none;margin:0;padding:0}.table-card,.card,.wbs-inline-alert{box-shadow:none;border:1px solid #ddd}.table th,.table td{font-size:11px;padding:8px}.kpi-mini{grid-template-columns:repeat(4,1fr);gap:8px}.kpi-value{font-size:22px}}

/* v1.3: home dibuat lebih ringkas + logo resmi + WBS side card */
.portal-simple-hero{
    background:linear-gradient(125deg,#0f6fe8 0%,#06418b 82%);
    color:#fff;
    padding:42px 24px 122px;
    position:relative;
    overflow:hidden;
    text-align:center;
}
.portal-simple-hero:before{content:"";position:absolute;right:-150px;top:-170px;width:460px;height:460px;border-radius:50%;background:rgba(255,255,255,.11)}
.portal-simple-hero:after{content:"";position:absolute;left:-120px;bottom:-180px;width:380px;height:380px;border-radius:50%;background:rgba(255,255,255,.08)}
.portal-logo-wrap{position:relative;z-index:1;display:flex;justify-content:center;margin:0 auto 18px}
.portal-logo-img{max-width:min(780px,92vw);height:auto;display:block;background:rgba(255,255,255,.98);border-radius:18px;padding:18px 24px;box-shadow:0 18px 45px rgba(0,0,0,.16)}
.compact-title{margin:22px auto 0;max-width:900px}.compact-title h1{font-size:46px;margin:13px 0 10px}.compact-title p{max-width:780px}
.simple-main{margin:-76px auto 0}.menu-only-grid{grid-template-columns:repeat(4,1fr);gap:20px}.menu-only-grid .entry-card{min-height:278px;padding:26px}.menu-only-grid .entry-icon{width:64px;height:64px;font-size:30px}.recap-entry .entry-icon{background:var(--green)}.recap-entry .entry-action{color:var(--green)}
.report-auth-layout{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:22px;margin-top:20px;align-items:stretch}.report-auth-main .report-login-grid{margin-top:0}.wbs-side-card{background:linear-gradient(145deg,#fff7f8 0%,#ffffff 70%);border:1px solid #fecdd3;border-left:7px solid var(--red);border-radius:18px;padding:22px;box-shadow:0 12px 34px rgba(251,82,98,.12);display:flex;flex-direction:column;justify-content:center}.wbs-side-icon{width:48px;height:48px;border-radius:14px;background:var(--red);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:26px;margin-bottom:12px}.wbs-side-tag{display:inline-flex;width:max-content;border-radius:999px;background:#ffe4e6;color:var(--red);font-weight:900;font-size:12px;padding:6px 11px;margin-bottom:12px}.wbs-side-card h2{margin:0 0 10px;font-size:22px;color:#991b1b}.wbs-side-card p{color:#64748b;line-height:1.62;margin:0 0 16px}.wbs-mini-link{display:block;text-align:center;margin-top:12px;color:var(--red);font-weight:900;font-size:13px}
@media(max-width:1180px){.menu-only-grid{grid-template-columns:repeat(2,1fr)}.report-auth-layout{grid-template-columns:1fr}.wbs-side-card{justify-content:flex-start}}
@media(max-width:980px){.portal-simple-hero{padding:28px 18px 104px}.portal-logo-img{padding:12px 14px;border-radius:14px}.compact-title h1{font-size:34px}.menu-only-grid{grid-template-columns:1fr}.simple-main{margin-top:-64px}.menu-only-grid .entry-card{min-height:auto}.report-auth-layout{grid-template-columns:1fr}}
@media print{.portal-logo-img{box-shadow:none;border:1px solid #ddd}.wbs-side-card{box-shadow:none}}

/* v1.4: penyempurnaan halaman awal dan rekap publik */
.portal-logo-img{
    max-width:min(430px,74vw);
    height:auto;
    background:transparent!important;
    border-radius:0!important;
    padding:0!important;
    box-shadow:none!important;
    filter:drop-shadow(0 8px 14px rgba(0,0,0,.18));
}
.portal-logo-wrap{margin:0 auto 8px}
.compact-title{margin:14px auto 0;max-width:900px}.compact-title h1{font-size:46px;line-height:1.08}.compact-title p{font-size:16px}.portal-simple-hero{padding-top:34px}
.portal-main.simple-main{max-width:1360px;width:calc(100% - 52px);padding-left:0;padding-right:0}
.menu-only-grid{gap:22px}.menu-only-grid .entry-card{padding:28px;min-height:270px}.menu-only-grid .entry-card h2{font-size:24px}.menu-only-grid .entry-card p{font-size:14px}.public-recap-note{border-color:#dbeafe;border-left-color:var(--blue)}.public-recap-note a{color:var(--blue);font-weight:900}.public-recap-table th,.public-recap-table td{min-width:135px}.public-recap-table th:first-child,.public-recap-table td:first-child{min-width:60px}.public-recap-grid{margin-bottom:24px}.wbs-side-card .wbs-mini-link{display:none}
@media(max-width:1180px){.portal-main.simple-main{max-width:900px}.menu-only-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:980px){.portal-logo-img{max-width:min(360px,80vw);padding:0!important}.compact-title h1{font-size:34px}.portal-main.simple-main{width:calc(100% - 36px)}}
@media print{.portal-logo-img{border:0!important;filter:none!important}.public-recap-note{box-shadow:none;border:1px solid #ddd}}

/* v1.7: SP4N-LAPOR card, filter rekap, cetak PDF A4 portrait, dan Excel */
.external-channel-stack{display:grid;grid-template-columns:1fr;gap:16px}
.sp4n-side-card{background:linear-gradient(145deg,#eff6ff 0%,#ffffff 72%);border:1px solid #bfdbfe;border-left:7px solid var(--blue);border-radius:18px;padding:22px;box-shadow:0 12px 34px rgba(15,111,232,.12);display:flex;flex-direction:column;justify-content:center}
.sp4n-side-icon{width:48px;height:48px;border-radius:14px;background:var(--blue);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:24px;margin-bottom:12px}
.sp4n-side-tag{display:inline-flex;width:max-content;border-radius:999px;background:#dbeafe;color:var(--blue-dark);font-weight:900;font-size:12px;padding:6px 11px;margin-bottom:12px}
.sp4n-side-card h2{margin:0 0 10px;font-size:22px;color:#0f3f83}.sp4n-side-card p{color:#64748b;line-height:1.62;margin:0 0 16px}
.admin-filter-card{margin-bottom:18px}.admin-filter-form{display:grid;grid-template-columns:1fr 1fr 1fr auto;gap:14px;align-items:end}.admin-filter-form .form-group{margin-bottom:0}.filter-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:end}.public-filter-form{grid-template-columns:1fr 1fr auto}.public-filter-card{margin-bottom:18px}.public-org-heading{margin:0 0 8px;font-size:22px;color:#fff}.recap-hero p b{color:#fff}.btn-green{background:var(--green);color:#fff}
@media(max-width:1180px){.admin-filter-form,.public-filter-form{grid-template-columns:1fr 1fr}.filter-actions{grid-column:1/-1}.external-channel-stack{grid-template-columns:1fr 1fr}}
@media(max-width:980px){.admin-filter-form,.public-filter-form,.external-channel-stack{grid-template-columns:1fr}.filter-actions{grid-column:auto}}
@media print{@page{size:A4 portrait;margin:12mm}.sidebar,.topbar,.footer,.no-print,.toast{display:none!important}.main{margin-left:0!important}.content{padding:0!important}.card,.table-card{box-shadow:none!important}.section-title{font-size:18px;margin:16px 0 8px}.table th,.table td{font-size:10px;padding:6px}.admin-recap-table th:nth-child(8),.admin-recap-table td:nth-child(8){display:none!important}.public-org-heading{color:#111!important}.info-hero{padding:14px 0!important}.recap-hero p b{color:#111!important}}


/* v1.8: presisi card Lapor/Konsultasi dan penyederhanaan cetak rekap publik */
.report-auth{max-width:1320px}
.report-card-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:18px;
    align-items:stretch;
    margin-top:22px;
}
.report-card-grid > .card,
.report-card-grid > .wbs-side-card,
.report-card-grid > .sp4n-side-card{
    height:100%;
    min-height:440px;
}
.report-card-grid .report-action-card,
.report-card-grid .external-action-card{
    display:flex;
    flex-direction:column;
}
.report-card-grid .report-action-card form{
    display:flex;
    flex-direction:column;
    flex:1;
}
.report-card-grid .report-action-card .btn,
.report-card-grid .external-action-card .btn{
    margin-top:auto;
}
.report-card-grid .wbs-side-card,
.report-card-grid .sp4n-side-card{
    justify-content:flex-start;
}
@media(max-width:1180px){
    .report-auth{max-width:900px}
    .report-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:980px){
    .report-card-grid{grid-template-columns:1fr}
    .report-card-grid > .card,
    .report-card-grid > .wbs-side-card,
    .report-card-grid > .sp4n-side-card{min-height:auto}
}
@media print{
    .print-hide-only{display:none!important}
}
