{"id":12954,"date":"2026-04-04T22:13:56","date_gmt":"2026-04-04T15:13:56","guid":{"rendered":"https:\/\/gfcc.or.id\/?page_id=12954"},"modified":"2026-10-10T21:25:02","modified_gmt":"2026-10-10T14:25:02","slug":"stewardship","status":"publish","type":"page","link":"https:\/\/gfcc.or.id\/id\/stewardship\/","title":{"rendered":"GFCC Stewardship"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"12954\" class=\"elementor elementor-12954\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-f1ddc90 e-con-full e-flex e-con e-parent\" data-id=\"f1ddc90\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t<div class=\"elementor-element elementor-element-29ae51b e-con-full e-flex e-con e-child\" data-id=\"29ae51b\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-f229b47 elementor-nav-menu--dropdown-tablet elementor-nav-menu__text-align-aside elementor-nav-menu--toggle elementor-nav-menu--burger elementor-widget elementor-widget-nav-menu\" data-id=\"f229b47\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;layout&quot;:&quot;horizontal&quot;,&quot;submenu_icon&quot;:{&quot;value&quot;:&quot;&lt;i class=\\&quot;fas fa-caret-down\\&quot; aria-hidden=\\&quot;true\\&quot;&gt;&lt;\\\/i&gt;&quot;,&quot;library&quot;:&quot;fa-solid&quot;},&quot;toggle&quot;:&quot;burger&quot;}\" data-widget_type=\"nav-menu.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t<nav aria-label=\"Menu\" class=\"elementor-nav-menu--main elementor-nav-menu__container elementor-nav-menu--layout-horizontal e--pointer-underline e--animation-fade\">\n\t\t\t\t<ul id=\"menu-1-f229b47\" class=\"elementor-nav-menu\"><li class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-home menu-item-5303\"><a href=\"https:\/\/gfcc.or.id\/id\/\" class=\"elementor-item\">Home<\/a><\/li>\n<li class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-3334\"><a href=\"https:\/\/gfcc.or.id\/id\/about-us\/\" class=\"elementor-item\">About US<\/a><\/li>\n<li class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-3271\"><a href=\"https:\/\/gfcc.or.id\/id\/online-service\/\" class=\"elementor-item\">ONLINE SERVICE<\/a><\/li>\n<li class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-6099\"><a href=\"https:\/\/gfcc.or.id\/id\/renungan-harian\/\" class=\"elementor-item\">DEVOTIONAL<\/a><\/li>\n<li class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-3275\"><a href=\"https:\/\/gfcc.or.id\/id\/give\/\" class=\"elementor-item\">GIVE<\/a><\/li>\n<li class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-14899\"><a href=\"https:\/\/gfcc.or.id\/id\/pembangunan-gfccfit\/\" class=\"elementor-item\">BUILD<\/a><\/li>\n<li class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-12967\"><a href=\"https:\/\/gfcc.or.id\/id\/stewardship\/\" class=\"elementor-item\">Stewardship<\/a><\/li>\n<li class=\"trp-language-switcher-container menu-item menu-item-type-post_type menu-item-object-language_switcher current-language-menu-item menu-item-5946\"><a href=\"https:\/\/gfcc.or.id\/id\/wp-json\/wp\/v2\/pages\/12954#TRPLINKPROCESSED\" class=\"elementor-item elementor-item-anchor\"><span data-no-translation><img decoding=\"async\" class=\"trp-flag-image\" src=\"https:\/\/gfcc.or.id\/wp-content\/plugins\/translatepress-multilingual\/assets\/images\/flags\/en_US.png\" width=\"18\" height=\"12\" alt=\"en_US\" title=\"English\"><span class=\"trp-ls-language-name\">EN<\/span><\/span><\/a><\/li>\n<\/ul>\t\t\t<\/nav>\n\t\t\t\t\t<div class=\"elementor-menu-toggle\" role=\"button\" tabindex=\"0\" aria-label=\"Menu Toggle\" aria-expanded=\"false\">\n\t\t\t<i aria-hidden=\"true\" role=\"presentation\" class=\"elementor-menu-toggle__icon--open eicon-menu-bar\"><\/i><i aria-hidden=\"true\" role=\"presentation\" class=\"elementor-menu-toggle__icon--close eicon-close\"><\/i>\t\t<\/div>\n\t\t\t\t\t<nav class=\"elementor-nav-menu--dropdown elementor-nav-menu__container\" aria-hidden=\"true\">\n\t\t\t\t<ul id=\"menu-2-f229b47\" class=\"elementor-nav-menu\"><li class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-home menu-item-5303\"><a href=\"https:\/\/gfcc.or.id\/id\/\" class=\"elementor-item\" tabindex=\"-1\">Home<\/a><\/li>\n<li class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-3334\"><a href=\"https:\/\/gfcc.or.id\/id\/about-us\/\" class=\"elementor-item\" tabindex=\"-1\">About US<\/a><\/li>\n<li class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-3271\"><a href=\"https:\/\/gfcc.or.id\/id\/online-service\/\" class=\"elementor-item\" tabindex=\"-1\">ONLINE SERVICE<\/a><\/li>\n<li class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-6099\"><a href=\"https:\/\/gfcc.or.id\/id\/renungan-harian\/\" class=\"elementor-item\" tabindex=\"-1\">DEVOTIONAL<\/a><\/li>\n<li class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-3275\"><a href=\"https:\/\/gfcc.or.id\/id\/give\/\" class=\"elementor-item\" tabindex=\"-1\">GIVE<\/a><\/li>\n<li class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-14899\"><a href=\"https:\/\/gfcc.or.id\/id\/pembangunan-gfccfit\/\" class=\"elementor-item\" tabindex=\"-1\">BUILD<\/a><\/li>\n<li class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-12967\"><a href=\"https:\/\/gfcc.or.id\/id\/stewardship\/\" class=\"elementor-item\" tabindex=\"-1\">Stewardship<\/a><\/li>\n<li class=\"trp-language-switcher-container menu-item menu-item-type-post_type menu-item-object-language_switcher current-language-menu-item menu-item-5946\"><a href=\"https:\/\/gfcc.or.id\/id\/wp-json\/wp\/v2\/pages\/12954#TRPLINKPROCESSED\" class=\"elementor-item elementor-item-anchor\" tabindex=\"-1\"><span data-no-translation><img decoding=\"async\" class=\"trp-flag-image\" src=\"https:\/\/gfcc.or.id\/wp-content\/plugins\/translatepress-multilingual\/assets\/images\/flags\/en_US.png\" width=\"18\" height=\"12\" alt=\"en_US\" title=\"English\"><span class=\"trp-ls-language-name\">EN<\/span><\/span><\/a><\/li>\n<\/ul>\t\t\t<\/nav>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-b6f20af e-con-full e-flex e-con e-parent\" data-id=\"b6f20af\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-4c2e2ba elementor-widget elementor-widget-html\" data-id=\"4c2e2ba\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!doctype html>\r\n<html lang=\"id\">\r\n<head>\r\n<meta charset=\"utf-8\">\r\n<meta name=\"viewport\" content=\"width=device-width,initial-scale=1\">\r\n<title>GFCC Financial Report<\/title>\r\n<style>\r\n:root{--blue:#3f8796;--light:#c9e4f8;--green:#58a34f;--red:#c51d22;--ink:#172033}\r\n*{box-sizing:border-box}body{margin:0;font-family:Arial,sans-serif;color:var(--ink);background:#fff}\r\n#status{color:#777;font-style:italic}\r\n.hero{background:linear-gradient(135deg,#d7ecfb,#c1ddf4);border-bottom:5px solid #287bd0;padding:28px}\r\n.hero-in{max-width:1400px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:28px}\r\n.logo{font-size:24px;font-weight:900;color:#1681bb;border:5px solid #1681bb;border-radius:45px;padding:16px}\r\nh1{font-size:34px;font-weight:500;margin:0}.period{font-size:28px;color:#d92722;margin-top:8px}\r\n.selector{background:#4fa9be;color:#fff;border-radius:8px;padding:8px 10px;min-width:190px}\r\n.selector label{display:block;font-size:11px;font-weight:700;margin-bottom:2px}\r\n.selector select{width:100%;font-size:19px;color:#10202a;background:#fff;border:0;border-radius:6px;padding:4px 7px}\r\nselect{width:100%;font-size:18px;border:0;background:transparent;color:#10202a;padding:4px}\r\n.wrap{max-width:1400px;margin:auto;padding:26px}\r\n.cards,.grid2{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.grid2{grid-template-columns:1fr 1fr}\r\n.card,.panel{background:#fff;border-radius:12px;box-shadow:0 5px 22px #20324d18;padding:22px}\r\n.card{border-top:5px solid var(--green)}.card.exp{border-color:#5d6ec3}.card.neg{border-color:var(--red)}\r\n.label{font-size:19px;color:#566275}.value{font-size:34px;font-weight:800;margin-top:8px}.card small{display:block;font-size:16px;line-height:1.35;margin-top:5px;color:#566275}.green{color:var(--green)}.red{color:var(--red)}.recap-income-green{color:var(--green)!important;font-weight:800!important}.recap-income-red{color:var(--red)!important;font-weight:800!important}.recap-income-star{color:var(--red)!important;font-weight:900!important;margin-left:4px;}\r\n.recap-income-value{display:inline-flex;align-items:baseline;justify-content:flex-end;gap:4px;white-space:nowrap;}\r\n.recap-income-value .recap-income-star{margin-left:0;}\r\n.section{margin-top:22px}.panel h2{margin:0 0 20px;font-size:23px;line-height:1.25}\r\n.bars{display:grid;gap:13px}.bar-label{display:flex;justify-content:space-between;font-size:17px;line-height:1.4}.bar-label b{font-size:17px}.bar-bg{height:13px;background:#e8edf3;border-radius:9px;margin-top:5px;overflow:hidden}.bar{height:100%;background:#5d7fe0;border-radius:9px}\r\n.gaugeWrap{width:100%;max-width:500px;margin:auto}\r\n.gaugeSvg{display:block;width:100%;height:auto;overflow:visible}\r\n.gaugeZone{fill:none;stroke-width:28;stroke-linecap:butt}\r\n.gaugeGreen{stroke:#58a34f}\r\n.gaugeRed{stroke:#c51d22}\r\n.gaugeActual{stroke:#3f5db2;stroke-width:5;stroke-linecap:round;transition:x1 .45s ease,y1 .45s ease,x2 .45s ease,y2 .45s ease}\r\n.gaugeTarget{stroke:#111;stroke-width:4}\r\n.gaugeTargetLabel{fill:#3f5db2;font-size:17px;font-weight:800;text-anchor:middle}\r\n.gaugeMin,.gaugeMax{fill:#3f5db2;font-size:15px}\r\n.gaugeMax{text-anchor:end}\r\n.gaugeCaption{fill:#6677bd;font-size:17px;text-anchor:middle}\r\n.gaugeBig{fill:#3f5db2;font-size:30px;font-weight:800;text-anchor:middle}.gaugeBig.green{fill:var(--green)}.gaugeBig.red{fill:var(--red)}\r\n.gaugeTargetText{text-align:center;margin-top:-4px;font-size:18px;line-height:1.4}.target-note{color:var(--red)!important;font-weight:700}.gaugeStatus{text-align:center;font-size:16px;line-height:1.35;margin-top:2px;font-weight:700}\r\n.metrics{display:grid;gap:7px}.metric{display:flex;justify-content:space-between;border-bottom:1px solid #e2e8ee;padding:11px 0;gap:16px;font-size:18px;line-height:1.35}.metric b{white-space:nowrap;font-size:18px}\r\n.metric.total-row{margin-top:8px;padding:14px 12px;border-top:2px solid #172033;border-bottom:0;background:#f1f5f8;border-radius:8px;font-size:19px}.metric.total-row span,.metric.total-row b{font-weight:800;color:#172033}\r\n.exp-info{display:grid;gap:16px}.exp-info-box{border:1px solid #dce5eb;border-radius:12px;padding:17px 18px;background:linear-gradient(135deg,#fbfdff,#f4f8fb);box-shadow:0 2px 8px rgba(32,50,77,.06)}.exp-info-title{font-size:18px;font-weight:800;color:#173f55;margin-bottom:9px;line-height:1.3}.exp-info-text{font-size:17px;line-height:1.65;color:#465766}.exp-info-box.rutin{border-left:5px solid #58a34f}.exp-info-box.nonrutin{border-left:5px solid #d7a32b}.exp-info-box.aktivitas{border-left:5px solid #5d6ec3}\r\n.note{margin-top:15px;padding:12px;background:#fff7e4;border-left:4px solid #e1a82e;font-size:15px;line-height:1.45}\r\n.program-panel{position:relative}\r\n.program-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:14px}\r\n.program-head h2{margin:0}\r\n.program-selector{background:#4fa9be;color:#fff;border-radius:8px;padding:8px 10px;min-width:190px}\r\n.program-selector label{display:block;font-size:11px;font-weight:700;margin-bottom:2px}\r\n.program-selector select{font-size:19px;color:#10202a;background:#fff;border-radius:6px;padding:4px 7px}\r\n.program-table-wrap{overflow:auto}\r\n.program-table{min-width:720px}\r\n.program-table th{background:#eef4f8}\r\n.program-table td{padding:9px 10px}\r\n.program-table tbody tr:nth-child(even){background:#f8fafc}\r\n.program-table td.budget{text-align:right;font-weight:700;white-space:nowrap}\r\n.program-total{display:flex;justify-content:flex-end;align-items:center;gap:12px;margin-top:12px;padding:11px 14px;background:#e7f4f8;border-radius:8px;font-size:19px}\r\n.program-total b{font-size:21px}\r\n.program-empty{padding:24px 10px;text-align:center;color:#667085;background:#f8fafc;border-radius:8px}\r\n@media(max-width:850px){\r\n  .card .label{font-size:18px}\r\n  .card .value{font-size:30px}\r\n  .card small{font-size:15px}\r\n  .bar-label,.bar-label b{font-size:16px}\r\n  .gaugeTargetText{font-size:17px}\r\n  .panel h2{font-size:22px}\r\n  #expenseDetail .metric{\r\n    font-size:17px;\r\n    padding:12px 0;\r\n  }\r\n  #expenseDetail .metric b{font-size:17px}\r\n  #expenseDetail .metric.total-row{\r\n    font-size:18px;\r\n    padding:14px 12px;\r\n  }\r\n  .exp-info{gap:12px}\r\n  .exp-info-box{padding:15px 16px;border-radius:11px}\r\n  .exp-info-title{font-size:17px}\r\n  .exp-info-text{font-size:17px;line-height:1.6}\r\n}\r\n@media(max-width:850px){\r\n  .program-panel,\r\n  .loan-panel{\r\n    width:100%;\r\n    box-sizing:border-box;\r\n  }\r\n\r\n  .program-head{\r\n    display:flex;\r\n    flex-direction:column;\r\n    align-items:stretch;\r\n    gap:12px;\r\n    margin-bottom:16px;\r\n  }\r\n\r\n  .program-head h2{\r\n    font-size:24px;\r\n    line-height:1.2;\r\n    margin:0;\r\n  }\r\n\r\n  .program-selector{\r\n    width:100%;\r\n    min-width:0;\r\n    box-sizing:border-box;\r\n    padding:10px 12px;\r\n    border-radius:10px;\r\n  }\r\n\r\n  .program-selector label{\r\n    font-size:19px;\r\n    margin-bottom:5px;\r\n  }\r\n\r\n  .program-selector select{\r\n    width:100%;\r\n    min-height:40px;\r\n    box-sizing:border-box;\r\n    font-size:19px;\r\n    padding:6px 10px;\r\n  }\r\n\r\n  .program-table-wrap{\r\n    overflow:visible;\r\n  }\r\n\r\n  .program-table{\r\n    min-width:0;\r\n    width:100%;\r\n    display:block;\r\n    border-collapse:separate;\r\n  }\r\n\r\n  .program-table thead{\r\n    display:none;\r\n  }\r\n\r\n  .program-table tbody{\r\n    display:block;\r\n    width:100%;\r\n  }\r\n\r\n  .program-table tr{\r\n    display:grid;\r\n    grid-template-columns:minmax(0,1fr) auto;\r\n    grid-template-areas:\r\n      \"date budget\"\r\n      \"dept budget\"\r\n      \"name name\";\r\n    gap:5px 10px;\r\n    width:100%;\r\n    box-sizing:border-box;\r\n    margin:0 0 10px;\r\n    padding:13px 12px;\r\n    background:#f8fafc !important;\r\n    border:1px solid #e2e8ee;\r\n    border-radius:12px;\r\n  }\r\n\r\n  .program-table td{\r\n    display:block;\r\n    box-sizing:border-box;\r\n    padding:0 !important;\r\n    margin:0;\r\n    border:0 !important;\r\n    background:transparent !important;\r\n    text-align:left !important;\r\n    min-width:0;\r\n  }\r\n\r\n  .program-table td:nth-child(1){\r\n    grid-area:date;\r\n    color:#667085;\r\n    font-size:19px;\r\n    font-weight:600;\r\n  }\r\n\r\n  .program-table td:nth-child(2){\r\n    grid-area:dept;\r\n    color:#475467;\r\n    font-size:19px;\r\n    line-height:1.25;\r\n  }\r\n\r\n  .program-table td:nth-child(3){\r\n    grid-area:name;\r\n    color:#173f55;\r\n    font-size:19px;\r\n    font-weight:800;\r\n    line-height:1.35;\r\n    margin-top:3px;\r\n    overflow-wrap:anywhere;\r\n  }\r\n\r\n  .program-table td:nth-child(4){\r\n    grid-area:budget;\r\n    align-self:start;\r\n    text-align:right !important;\r\n    color:#10202a;\r\n    font-size:19px;\r\n    font-weight:800;\r\n    white-space:nowrap;\r\n  }\r\n\r\n  .program-total{\r\n    width:100%;\r\n    box-sizing:border-box;\r\n    justify-content:space-between;\r\n    gap:10px;\r\n    padding:13px 14px;\r\n    margin-top:12px;\r\n    font-size:19px;\r\n  }\r\n\r\n  .program-total b{\r\n    font-size:19px;\r\n    white-space:nowrap;\r\n  }\r\n\r\n  .loan-panel{\r\n    padding:20px;\r\n  }\r\n\r\n  .loan-panel h2{\r\n    font-size:24px;\r\n    line-height:1.2;\r\n    margin-bottom:16px;\r\n  }\r\n\r\n  .loan-panel .metrics{\r\n    width:100%;\r\n  }\r\n\r\n  .loan-panel .metric{\r\n    display:grid;\r\n    grid-template-columns:minmax(0,1fr) auto;\r\n    align-items:center;\r\n    gap:12px;\r\n    padding:12px 0;\r\n  }\r\n\r\n  .loan-panel .metric span{\r\n    line-height:1.35;\r\n  }\r\n\r\n  .loan-panel .metric b{\r\n    text-align:right;\r\n    font-size:16px;\r\n    white-space:nowrap;\r\n  }\r\n\r\n  .loan-panel .note{\r\n    width:100%;\r\n    box-sizing:border-box;\r\n    margin-top:15px;\r\n    padding:12px 12px 12px 14px;\r\n    font-size:13px;\r\n    line-height:1.5;\r\n  }\r\n}\r\n\r\ntable{width:100%;border-collapse:collapse}th,td{padding:10px;border-bottom:1px solid #dfe5ec;text-align:right}th:first-child,td:first-child{text-align:left}th{background:#eef4f8}\r\n@media(max-width:850px){\r\n  \/* Rekap 2026: tampilkan tiap bulan sebagai kartu vertikal agar tidak perlu geser ke samping *\/\r\n  #recapSection > div{overflow:visible !important}\r\n  #recapSection table{width:100%;table-layout:fixed;border-collapse:separate;border-spacing:0}\r\n  #recapSection thead{display:none}\r\n  #recapSection tbody{display:block;width:100%}\r\n  #recapSection tbody tr{\r\n    display:grid;\r\n    grid-template-columns:minmax(0,1fr);\r\n    width:100%;\r\n    margin:0 0 14px;\r\n    border:1px solid #e2e8ee;\r\n    border-radius:10px;\r\n    overflow:hidden;\r\n    background:#fff;\r\n    box-shadow:0 2px 8px rgba(32,50,77,.06);\r\n  }\r\n  #recapSection tbody tr:nth-child(odd){background:#f8f6f1}\r\n  #recapSection tbody td{\r\n    display:flex;\r\n    justify-content:space-between;\r\n    align-items:center;\r\n    gap:14px;\r\n    width:100%;\r\n    min-width:0;\r\n    padding:12px 14px;\r\n    border-bottom:1px solid #e2e8ee;\r\n    text-align:right;\r\n    overflow-wrap:anywhere;\r\n    font-size:16px;\r\n    line-height:1.35;\r\n  }\r\n  #recapSection tbody td:first-child{\r\n    display:block;\r\n    background:#172b2d;\r\n    color:#fff;\r\n    font-size:18px;\r\n    font-weight:800;\r\n    text-align:left;\r\n    padding:13px 14px;\r\n  }\r\n  #recapSection tbody td:nth-child(2)::before{\r\n    content:\"Penerimaan\";\r\n    color:#566275;\r\n    font-weight:600;\r\n    text-align:left;\r\n  }\r\n  #recapSection tbody td:nth-child(3)::before{\r\n    content:\"Pengeluaran\";\r\n    color:#566275;\r\n    font-weight:600;\r\n    text-align:left;\r\n  }\r\n  #recapSection tbody td:nth-child(4)::before{\r\n    content:\"Saldo\";\r\n    color:#566275;\r\n    font-weight:600;\r\n    text-align:left;\r\n  }\r\n  #recapSection tbody td:last-child{border-bottom:0}\r\n  .hero-in,.cards,.grid2{display:grid;grid-template-columns:1fr}\r\n  .wrap{padding:16px;display:flex;flex-direction:column}\r\n  h1{font-size:27px}.period{font-size:23px}.selector{min-width:0;padding:10px 12px;border-radius:10px}\r\n  .selector label{font-size:19px;margin-bottom:5px}\r\n  .selector select{width:100%;min-height:40px;box-sizing:border-box;font-size:19px;padding:6px 10px}\r\n\r\n  \/* Urutan khusus MOBILE:\r\n     1. Header tetap di luar .wrap\r\n     2. Gauge \/ Kebutuhan Operasional\r\n     3. Total Penerimaan \/ Pengeluaran \/ Saldo Bersih\r\n     4. Penerimaan Bulan Ini\r\n     5. Bagian-bagian berikutnya\r\n  *\/\r\n  #mainOverview{display:contents}\r\n  #mainOverview > .panel:first-child{order:1}\r\n  .wrap > .cards{order:2}\r\n  #mainOverview > .panel:nth-child(2){order:3}\r\n  .wrap > section:nth-of-type(3){order:4}\r\n  .wrap > section:nth-of-type(4){order:5}\r\n  .wrap > section:nth-of-type(5){order:6}\r\n  #recapSection{order:7}\r\n}\r\n<\/style>\r\n<\/head>\r\n<body>\r\n<header class=\"hero\"><div class=\"hero-in\">\r\n<div class=\"logo\">GFCC<\/div>\r\n<div><h1>GFCC FUK IM THONG (Financial Report)<\/h1><div class=\"period\" id=\"period\">September 2026<\/div><\/div>\r\n<div class=\"selector\"><label for=\"months\">Pilih Periode<\/label><select id=\"months\"><\/select><\/div>\r\n<\/div><\/header>\r\n<main class=\"wrap\">\r\n<div id=\"status\">Memuat data\u2026<\/div>\r\n<div id=\"error\" style=\"display:none;color:#a71919;background:#fff0f0;padding:12px;border-radius:8px\"><\/div>\r\n<section class=\"section cards\">\r\n<div class=\"card\"><div class=\"label\">Total Penerimaan<\/div><div id=\"income\" class=\"value green\">Rp 0<\/div><small>Tidak termasuk Pinjaman \/ Talangan<\/small><small id=\"incomeTargetNote\" class=\"target-note\" style=\"display:none\">* Belum memenuhi target Rp80.000.000<\/small><\/div>\r\n<div class=\"card exp\"><div class=\"label\">Total Pengeluaran<\/div><div id=\"expense\" class=\"value\">Rp 0<\/div><small>Operasional & program<\/small><\/div>\r\n<div id=\"balanceCard\" class=\"card\"><div class=\"label\">Saldo Bersih<\/div><div id=\"balance\" class=\"value\">Rp 0<\/div><small>Penerimaan \u2212 Pengeluaran<\/small><\/div>\r\n<\/section>\r\n<section id=\"mainOverview\" class=\"section grid2\">\r\n<div class=\"panel\"><h2>Kebutuhan Operasional & Program per bulan<\/h2>\r\n  <div class=\"gaugeWrap\">\r\n    <svg id=\"gaugeSvg\" class=\"gaugeSvg\" viewBox=\"0 0 500 285\" role=\"img\" aria-label=\"Gauge penerimaan bulan ini\">\r\n      <!-- Zona tetap: 0\u201380 juta HIJAU, 80\u2013100 juta MERAH -->\r\n      <path id=\"gaugeRed\" class=\"gaugeZone gaugeRed\" d=\"M 55 230 A 195 195 0 0 1 445 230\" pathLength=\"100\"><\/path>\r\n      <path id=\"gaugeGreen\" class=\"gaugeZone gaugeGreen\" d=\"M 55 230 A 195 195 0 0 1 445 230\" pathLength=\"100\"><\/path>\r\n\r\n      <!-- Penanda nilai aktual: bergerak mengikuti penerimaan bulan yang dipilih -->\r\n      <line id=\"gaugeActual\" class=\"gaugeActual\" x1=\"0\" y1=\"0\" x2=\"0\" y2=\"0\"><\/line>\r\n\r\n      <!-- Garis target Rp80 juta -->\r\n      <line id=\"gaugeTarget\" class=\"gaugeTarget\" x1=\"0\" y1=\"0\" x2=\"0\" y2=\"0\"><\/line>\r\n      <text id=\"gaugeTargetLabel\" class=\"gaugeTargetLabel\" x=\"0\" y=\"0\">80 juta<\/text>\r\n      <text class=\"gaugeMin\" x=\"55\" y=\"258\">0<\/text>\r\n      <text class=\"gaugeMax\" x=\"445\" y=\"258\">100 juta<\/text>\r\n      <text class=\"gaugeCaption\" x=\"250\" y=\"174\">Penerimaan Bulan Ini<\/text>\r\n      <text id=\"gaugeSvgValue\" class=\"gaugeBig\" x=\"250\" y=\"211\">Rp 0<\/text>\r\n    <\/svg>\r\n  <\/div>\r\n  <div class=\"gaugeTargetText\">Target kebutuhan: <b>Rp80.000.000<\/b><\/div><div id=\"gaugeStatus\" class=\"gaugeStatus\" style=\"display:none\"><\/div>\r\n<\/div>\r\n<div class=\"panel\"><h2>Penerimaan Bulan Ini<\/h2><div id=\"incomeBars\" class=\"bars\"><\/div><\/div>\r\n<\/section>\r\n<section class=\"section grid2\">\r\n<div class=\"panel\"><h2>Rincian Pengeluaran<\/h2><div id=\"expenseDetail\" class=\"metrics\"><\/div><\/div>\r\n<div class=\"panel\"><h2>Keterangan Pengeluaran<\/h2>\r\n  <div class=\"exp-info\">\r\n    <div class=\"exp-info-box rutin\">\r\n      <div class=\"exp-info-title\">Pengeluaran Rutin (Bulanan)<\/div>\r\n      <div class=\"exp-info-text\">Listrik, Air, Internet, Salary, BPJS, Asuransi, Kas Kecil Kantor, Kas Ministry, Program, Iuran Sinode GKIP.<\/div>\r\n    <\/div>\r\n    <div class=\"exp-info-box nonrutin\">\r\n      <div class=\"exp-info-title\">Pengeluaran Tidak Rutin<\/div>\r\n      <div class=\"exp-info-text\">Pembelian Anggur Perjamuan, Maintenance Gedung\/Kendaraan, Kasbon Satpam, Biaya Tamu, Pengembalian Pinjaman (Talangan).<\/div>\r\n    <\/div>\r\n    <div class=\"exp-info-box aktivitas\">\r\n      <div class=\"exp-info-title\">Aktivitas Operasional<\/div>\r\n      <div class=\"exp-info-text\">Pajak, Adm Bank, Bunga.<\/div>\r\n    <\/div>\r\n  <\/div>\r\n<\/div>\r\n<\/section><section class=\"section\">\r\n<div class=\"panel program-panel\">\r\n  <div class=\"program-head\">\r\n    <h2>Program Pelayanan GFCC 2026<\/h2>\r\n    <div class=\"program-selector\">\r\n      <label for=\"programMonths\">Pilih Bulan<\/label>\r\n      <select id=\"programMonths\"><\/select>\r\n    <\/div>\r\n  <\/div>\r\n  <div class=\"program-table-wrap\">\r\n    <table class=\"program-table\">\r\n      <thead><tr><th>Tanggal<\/th><th>Departemen<\/th><th>Program<\/th><th>Budget<\/th><\/tr><\/thead>\r\n      <tbody id=\"programRows\"><\/tbody>\r\n    <\/table>\r\n  <\/div>\r\n  <div class=\"program-total\">\r\n    <span>Budget Program<\/span>\r\n    <b id=\"programTotal\">Rp 0<\/b>\r\n  <\/div>\r\n<\/div>\r\n<\/section>\r\n\r\n<section class=\"section\">\r\n<div class=\"panel loan-panel\">\r\n  <h2>Pinjaman \/ Talangan<\/h2>\r\n  <div class=\"metrics\">\r\n    <div class=\"metric\"><span>Diterima bulan ini<\/span><b id=\"loanIn\">Rp 0<\/b><\/div>\r\n    <div class=\"metric\"><span>Dikembalikan bulan ini<\/span><b id=\"loanOut\">Rp 0<\/b><\/div>\r\n  <\/div>\r\n  <div class=\"note\">Pinjaman\/talangan bukan pendapatan gereja, tetapi tetap memengaruhi arus kas.  Saat dana diterima, kas bertambah; saat dikembalikan, kas berkurang.  Karena itu, transaksi ini dicatat sebagai Pinjaman\/Talangan, bukan sebagai Penerimaan atau Pengeluaran Operasional.<\/div>\r\n<\/div>\r\n<\/section>\r\n\r\n<section id=\"recapSection\" class=\"section panel\"><h2>Rekap 2026<\/h2><div style=\"overflow:auto\"><table><thead><tr><th>Bulan<\/th><th>Penerimaan<\/th><th>Pengeluaran<\/th><th>Saldo<\/th><\/tr><\/thead><tbody id=\"year\"><\/tbody><\/table><\/div><\/section>\r\n<\/main>\r\n<script>\r\nconst CFG={\r\n  id:\"1DWqUHr3pPaOEFU0y5yYiXAeoeTj6Az9QkpCU2NSNZuw\",\r\n  sheet:\"Month In-Out\",\r\n  programId:\"1DWqUHr3pPaOEFU0y5yYiXAeoeTj6Az9QkpCU2NSNZuw\",\r\n  programSheet:\"Program\",\r\n  target:80000000\r\n};\r\n\r\nconst incCats=[\"Perpuluhan\",\"Syukur\",\"Program\",\"Khusus\",\"Sulung\",\"Aktivitas Operasional\"];\r\nconst expCats=[\"Operasional Rutin\",\"Operasional Non Rutin\",\"Program\",\"Aktivitas Operasional\"];\r\nlet rows=[];\r\nlet programRows=[];\r\nlet programPeriods=[];\r\n\r\n\/\/ Google Visualization mengembalikan tanggal sebagai teks seperti:\r\n\/\/ Date(2026,8,1). Ubah menjadi label yang mudah dibaca.\r\nfunction parsePeriod(v){\r\n  const s=String(v??\"\").trim();\r\n  let m=s.match(\/^Date\\((\\d{4}),(\\d{1,2}),(\\d{1,2})\\)$\/);\r\n  if(m){\r\n    return {year:+m[1], month:+m[2]+1, day:+m[3]};\r\n  }\r\n\r\n  \/\/ Antisipasi jika suatu saat GViz mengirim Date object \/ format ISO.\r\n  const d=new Date(v);\r\n  if(!Number.isNaN(d.getTime())){\r\n    return {year:d.getFullYear(), month:d.getMonth()+1, day:d.getDate()};\r\n  }\r\n\r\n  return null;\r\n}\r\n\r\nconst monthNames=[\r\n  \"Januari\",\"Februari\",\"Maret\",\"April\",\"Mei\",\"Juni\",\r\n  \"Juli\",\"Agustus\",\"September\",\"Oktober\",\"November\",\"Desember\"\r\n];\r\n\r\nfunction periodKey(v){\r\n  const p=parsePeriod(v);\r\n  return p ? `${p.year}-${String(p.month).padStart(2,\"0\")}` : \"\";\r\n}\r\n\r\nfunction periodLabel(v){\r\n  const p=parsePeriod(v);\r\n  return p ? `${monthNames[p.month-1]} ${p.year}` : String(v??\"\");\r\n}\r\n\r\nfunction todayJakarta(){\r\n  const parts=new Intl.DateTimeFormat(\"en-US\",{\r\n    timeZone:\"Asia\/Jakarta\",\r\n    year:\"numeric\",month:\"numeric\",day:\"numeric\"\r\n  }).formatToParts(new Date());\r\n  const o={};\r\n  parts.forEach(x=>{if(x.type!==\"literal\") o[x.type]=+x.value});\r\n  return {year:o.year,month:o.month,day:o.day};\r\n}\r\n\r\nconst money=n=>new Intl.NumberFormat(\"id-ID\",{\r\n  style:\"currency\",\r\n  currency:\"IDR\",\r\n  maximumFractionDigits:0\r\n}).format(Number(n)||0);\r\n\r\nconst num=v=>{\r\n  if(typeof v===\"number\" && Number.isFinite(v)) return v;\r\n  const s=String(v??\"\").trim();\r\n  if(!s || s===\"#N\/A\" || s===\"#VALUE!\" || s===\"#REF!\") return 0;\r\n  return Number(\r\n    s.replace(\/[^0-9,-]\/g,\"\")\r\n     .replace(\/\\.\/g,\"\")\r\n     .replace(\",\",\".\")\r\n  )||0;\r\n};\r\n\r\nasync function gv(sheet,range,spreadsheetId=CFG.id){\r\n  const u=`https:\/\/docs.google.com\/spreadsheets\/d\/${spreadsheetId}\/gviz\/tq?tqx=out:json&sheet=${encodeURIComponent(sheet)}&range=${encodeURIComponent(range)}`;\r\n\r\n  const r=await fetch(u,{cache:\"no-store\"});\r\n  const t=await r.text();\r\n\r\n  if(!r.ok){\r\n    throw Error(`Google Sheets tidak dapat diakses (HTTP ${r.status}).`);\r\n  }\r\n\r\n  const m=t.match(\/setResponse\\((.*)\\);?\\s*$\/s);\r\n\r\n  if(!m){\r\n    throw Error(\r\n      `Google Sheets tidak mengembalikan data JSON untuk tab \"${sheet}\". `+\r\n      `Pastikan Sheet dapat dibaca oleh halaman web.`\r\n    );\r\n  }\r\n\r\n  let j;\r\n  try{\r\n    j=JSON.parse(m[1]);\r\n  }catch(err){\r\n    throw Error(`Respons Google Sheets untuk \"${sheet}\" tidak valid.`);\r\n  }\r\n\r\n  if(j.status===\"error\" || j.errors?.length){\r\n    const msg=\r\n      j.errors?.[0]?.detailed_message ||\r\n      j.errors?.[0]?.message ||\r\n      \"Google Sheets mengembalikan error.\";\r\n    throw Error(msg);\r\n  }\r\n\r\n  if(!j.table){\r\n    throw Error(`Tab \"${sheet}\" atau range \"${range}\" tidak ditemukan.`);\r\n  }\r\n\r\n  return (j.table.rows||[]).map(row=>\r\n    (row.c||[]).map(cell=>cell?.v ?? \"\")\r\n  );\r\n}\r\n\r\n\r\nfunction parseProgramRows(data){\r\n  return data\r\n    .filter(r=>Array.isArray(r) && r.length>=4)\r\n    .map(r=>{\r\n      const p=parsePeriod(r[0]);\r\n      const dept=String(r[1]??\"\").trim();\r\n      const name=String(r[2]??\"\").trim();\r\n      const budget=num(r[3]);\r\n      return {p,dept,name,budget};\r\n    })\r\n    .filter(x=>x.p && x.dept && x.name && (x.budget!==0 || String(x.budget)===\"0\"));\r\n}\r\n\r\nfunction renderProgram(k){\r\n  const sel=document.getElementById(\"programMonths\");\r\n  const selected=programPeriods[k];\r\n  if(!selected) return;\r\n\r\n  sel.value=selected.key;\r\n\r\n  const list=programRows.filter(x=>\r\n    x.p.year===selected.year && x.p.month===selected.month\r\n  );\r\n\r\n  const tbody=document.getElementById(\"programRows\");\r\n  const total=list.reduce((sum,x)=>sum+x.budget,0);\r\n\r\n  if(!list.length){\r\n    tbody.innerHTML=`<tr><td colspan=\"4\"><div class=\"program-empty\">Tidak ada program pelayanan pada bulan ${monthNames[selected.month-1]} ${selected.year}.<\/div><\/td><\/tr>`;\r\n  }else{\r\n    tbody.innerHTML=list.map(x=>`\r\n      <tr>\r\n        <td>${String(x.p.day).padStart(2,\"0\")}-${monthNames[x.p.month-1].slice(0,3)}<\/td>\r\n        <td>${escapeHtml(x.dept)}<\/td>\r\n        <td>${escapeHtml(x.name)}<\/td>\r\n        <td class=\"budget\">${money(x.budget)}<\/td>\r\n      <\/tr>\r\n    `).join(\"\");\r\n  }\r\n\r\n  document.getElementById(\"programTotal\").textContent=money(total);\r\n}\r\n\r\nfunction escapeHtml(v){\r\n  return String(v??\"\").replace(\/[&<>\"']\/g,ch=>({\r\n    \"&\":\"&amp;\",\"<\":\"&lt;\",\">\":\"&gt;\",'\"':\"&quot;\",\"'\":\"&#039;\"\r\n  }[ch]));\r\n}\r\n\r\nasync function load(){\r\n\r\n  \/\/ Kedua tabel yang dipakai dashboard sekarang berada di TAB\r\n  \/\/ \"Month In-Out\" pada Google Sheet Dashboard:\r\n  \/\/ A1:H20  = Pengeluaran + TOTAL (range diperlebar agar aman sampai Desember)\r\n  \/\/ A21:J40 = Penerimaan + TOTAL (range diperlebar agar aman sampai Desember)\r\n  \/\/ Tab \"New Month Income\" tidak dipakai oleh dashboard karena\r\n  \/\/ tab tersebut masih berisi format\/rincian lama (NonTunai\/Tunai\/Org).\r\n  const [e,i,pdata]=await Promise.all([\r\n    gv(CFG.sheet,\"A1:H20\"),\r\n    gv(CFG.sheet,\"A21:J40\"),\r\n    gv(CFG.programSheet,\"A1:D200\",CFG.programId)\r\n  ]);\r\n\r\n  const validRows=data=>data.filter(r=>\r\n    Array.isArray(r) &&\r\n    r.some(v=>v!==\"\" && v!==null && v!==undefined)\r\n  );\r\n\r\n  const im=validRows(i).filter(r=>{\r\n    const label=String(r[0]??\"\").trim().toLowerCase();\r\n    return (\r\n      label &&\r\n      label!==\"bulan\" &&\r\n      !label.startsWith(\"total\") &&\r\n      label!==\"#n\/a\"\r\n    );\r\n  });\r\n\r\n  const em=validRows(e).filter(r=>{\r\n    const label=String(r[0]??\"\").trim().toLowerCase();\r\n    return (\r\n      label &&\r\n      label!==\"bulan\" &&\r\n      !label.startsWith(\"total\") &&\r\n      label!==\"#n\/a\"\r\n    );\r\n  });\r\n\r\n  if(!im.length){\r\n    throw Error(\r\n      'Data Penerimaan pada tab \"Month In-Out\" tidak ditemukan. '+\r\n      'Pastikan range A21:J31 berisi data.'\r\n    );\r\n  }\r\n\r\n  if(!em.length){\r\n    throw Error(\r\n      'Data Pengeluaran pada tab \"Month In-Out\" tidak ditemukan. '+\r\n      'Pastikan range A1:H11 berisi data.'\r\n    );\r\n  }\r\n\r\n  rows=im.map(r=>({\r\n    key:periodKey(r[0]),\r\n    m:periodLabel(r[0]),\r\n    i:r,\r\n    e:em.find(x=>periodKey(x[0])===periodKey(r[0]))||[]\r\n  })).filter(x=>x.key);\r\n\r\n  if(!rows.length){\r\n    throw Error(\"Tidak ada data periode yang dapat ditampilkan.\");\r\n  }\r\n\r\n  \/\/ Urutkan kronologis.\r\n  rows.sort((a,b)=>a.key.localeCompare(b.key));\r\n\r\n  const s=document.getElementById(\"months\");\r\n\r\n  s.innerHTML=rows.map((x,n)=>\r\n    `<option value=\"${n}\">${x.m}<\/option>`\r\n  ).join(\"\");\r\n\r\n  \/\/ Saat website dibuka, otomatis pilih BULAN BERJALAN\r\n  \/\/ berdasarkan waktu Asia\/Jakarta.\r\n  const today=todayJakarta();\r\n  const currentKey=`${today.year}-${String(today.month).padStart(2,\"0\")}`;\r\n  let defaultIndex=rows.findIndex(x=>x.key===currentKey);\r\n\r\n  \/\/ Jika bulan berjalan belum ada di Sheet, gunakan periode terbaru yang tersedia.\r\n  if(defaultIndex<0) defaultIndex=rows.length-1;\r\n\r\n  s.value=String(defaultIndex);\r\n  s.onchange=()=>render(+s.value);\r\n\r\n  programRows=parseProgramRows(validRows(pdata));\r\n  programPeriods=monthNames.map((_,idx)=>({\r\n    key:`2026-${String(idx+1).padStart(2,\"0\")}`,\r\n    year:2026,\r\n    month:idx+1\r\n  }));\r\n\r\n  const ps=document.getElementById(\"programMonths\");\r\n  ps.innerHTML=programPeriods.map(x=>\r\n    `<option value=\"${x.key}\">${monthNames[x.month-1]} ${x.year}<\/option>`\r\n  ).join(\"\");\r\n\r\n  const todayProgram=todayJakarta();\r\n  const currentProgramKey=`${todayProgram.year}-${String(todayProgram.month).padStart(2,\"0\")}`;\r\n  let programDefault=programPeriods.findIndex(x=>x.key===currentProgramKey);\r\n  if(programDefault<0) programDefault=programPeriods.length-1;\r\n  if(programDefault>=0){\r\n    ps.value=programPeriods[programDefault].key;\r\n    ps.onchange=()=>{\r\n      const idx=programPeriods.findIndex(x=>x.key===ps.value);\r\n      if(idx>=0) renderProgram(idx);\r\n    };\r\n    renderProgram(programDefault);\r\n  }else{\r\n    document.getElementById(\"programRows\").innerHTML=\r\n      `<tr><td colspan=\"4\"><div class=\"program-empty\">Belum ada data Program Pelayanan GFCC 2026.<\/div><\/td><\/tr>`;\r\n    document.getElementById(\"programTotal\").textContent=money(0);\r\n  }\r\n\r\n  document.getElementById(\"status\").textContent=\r\n    `Data berhasil dimuat. Periode otomatis: ${rows[defaultIndex].m}.`;\r\n\r\n  render(defaultIndex);\r\n}\r\n\r\nfunction render(k){\r\n\r\n  if(!rows.length || !rows[k]){\r\n    throw Error(\"Periode data tidak tersedia.\");\r\n  }\r\n\r\n  const x=rows[k];\r\n  const r=x.i;\r\n  const e=x.e;\r\n\r\n  \/\/ Tampilkan periode sebagai bulan berjalan + rentang MTD.\r\n  const today=todayJakarta();\r\n  const currentKey=`${today.year}-${String(today.month).padStart(2,\"0\")}`;\r\n  if(x.key===currentKey){\r\n    document.getElementById(\"period\").textContent=\r\n      `${x.m} \u2022 1\u2013${today.day} ${monthNames[today.month-1]} ${today.year}`;\r\n  }else{\r\n    document.getElementById(\"period\").textContent=x.m;\r\n  }\r\n\r\n  \/*\r\n   * New Month Income:\r\n   * A Bulan\r\n   * B Perpuluhan\r\n   * C Syukur\r\n   * D Program\r\n   * E Khusus\r\n   * F Sulung\r\n   * G Aktivitas Operasional\r\n   * H Pinjaman \/ Talangan\r\n   * I Total Penerimaan\r\n   * J TOTAL\r\n   *\/\r\n\r\n  const iv=incCats.map((_,i)=>num(r[i+1]));\r\n  const income=num(r[8]);\r\n  const loan=num(r[7]);\r\n\r\n  \/*\r\n   * Month In-Out:\r\n   * A Bulan\r\n   * B Operasional Rutin\r\n   * C Operasional Non Rutin\r\n   * D Program\r\n   * E Aktivitas Operasional\r\n   * F Pinjaman \/ Talangan\r\n   * G Total Pengeluaran\r\n   * H TOTAL SEMUA\r\n   *\/\r\n\r\n  const ev=expCats.map((_,i)=>num(e[i+1]));\r\n  const expense=num(e[6]);\r\n  const loanOut=num(e[5]);\r\n\r\n  const bal=income-expense;\r\n\r\n  const incomeEl=document.getElementById(\"income\");\r\n  incomeEl.textContent=money(income);\r\n  incomeEl.className=\"value \"+(income>=CFG.target?\"green\":\"red\");\r\n  const incomeTargetNote=document.getElementById(\"incomeTargetNote\");\r\n  if(income<CFG.target){\r\n    incomeTargetNote.textContent=\"* Belum memenuhi target Rp80.000.000\";\r\n    incomeTargetNote.style.display=\"block\";\r\n  }else{\r\n    incomeTargetNote.textContent=\"\";\r\n    incomeTargetNote.style.display=\"none\";\r\n  }\r\n  document.getElementById(\"expense\").textContent=money(expense);\r\n\r\n  const bc=document.getElementById(\"balanceCard\");\r\n  const bv=document.getElementById(\"balance\");\r\n\r\n  bv.textContent=money(bal);\r\n  bv.className=\"value \"+(bal>=0?\"green\":\"red\");\r\n  bc.classList.toggle(\"neg\",bal<0);\r\n\r\n  updateGauge(income);\r\n  document.getElementById(\"loanIn\").textContent=money(loan);\r\n  document.getElementById(\"loanOut\").textContent=money(loanOut);\r\n\r\n  \/\/ Grafik penerimaan menggunakan TOTAL PENERIMAAN sebagai skala 100%.\r\n  \/\/ Jadi setiap batang menunjukkan kontribusi kategori terhadap total bulan tersebut.\r\n  bars(\r\n    \"incomeBars\",\r\n    incCats.map((n,i)=>[n,iv[i]]),\r\n    income,\r\n    true\r\n  );\r\n\r\n  document.getElementById(\"expenseDetail\").innerHTML=\r\n    expCats.map((n,i)=>metric(n,ev[i])).join(\"\")+\r\n    `<div class=\"metric total-row\"><span>Total Pengeluaran<\/span><b>${money(expense)}<\/b><\/div>`;\r\n\r\n  document.getElementById(\"year\").innerHTML=\r\n    rows.map(x=>{\r\n      const p=num(x.i[8]);\r\n      const q=num(x.e[6]);\r\n      const z=p-q;\r\n\r\n      return `\r\n        <tr>\r\n          <td>${x.m}<\/td>\r\n          <td class=\"${p>=CFG.target?\"recap-income-green\":\"recap-income-red\"}\"><span class=\"recap-income-value\">${money(p)}${p<CFG.target?'<span class=\"recap-income-star\" aria-label=\"Belum mencapai target Rp80.000.000\">*<\/span>':\"\"}<\/span><\/td>\r\n          <td>${money(q)}<\/td>\r\n          <td style=\"font-weight:800;color:${z>=0?\"#58a34f\":\"#c51d22\"}\">\r\n            ${money(z)}\r\n          <\/td>\r\n        <\/tr>`;\r\n    }).join(\"\");\r\n}\r\n\r\n\r\nfunction updateGauge(income){\r\n  const svg=document.getElementById(\"gaugeSvg\");\r\n  const actual=document.getElementById(\"gaugeActual\");\r\n  const target=document.getElementById(\"gaugeTarget\");\r\n  const targetLabel=document.getElementById(\"gaugeTargetLabel\");\r\n  const valueText=document.getElementById(\"gaugeSvgValue\");\r\n\r\n  const max=100000000;\r\n  const targetValue=80000000;\r\n  const value=Math.max(0,Math.min(Number(income)||0,max));\r\n\r\n  \/\/ Gauge: dana terkumpul = HIJAU, sisa menuju maksimum Rp100 juta = MERAH.\r\n  \/\/ Target Rp80 juta hanya ditandai dengan garis hitam.\r\n  const greenPct = (value \/ max) * 100;\r\n  const greenPath = document.getElementById(\"gaugeGreen\");\r\n  greenPath.style.strokeDasharray = `${greenPct.toFixed(4)} ${Math.max(0,100-greenPct).toFixed(4)}`;\r\n  greenPath.style.strokeDashoffset = \"0\";\r\n\r\n  \/\/ Busur = 180 derajat: kiri = 0 juta, kanan = 100 juta.\r\n  const cx=250, cy=230, r=195;\r\n\r\n  function pointAt(v, inner, outer){\r\n    const pct=v\/max;\r\n    const angle=Math.PI-(pct*Math.PI);\r\n    return {\r\n      x1:cx+inner*Math.cos(angle),\r\n      y1:cy-inner*Math.sin(angle),\r\n      x2:cx+outer*Math.cos(angle),\r\n      y2:cy-outer*Math.sin(angle)\r\n    };\r\n  }\r\n\r\n  \/\/ Penanda nilai aktual bergerak sesuai data bulan yang dipilih.\r\n  const a=pointAt(value,r-19,r+19);\r\n  actual.setAttribute(\"x1\",a.x1.toFixed(2));\r\n  actual.setAttribute(\"y1\",a.y1.toFixed(2));\r\n  actual.setAttribute(\"x2\",a.x2.toFixed(2));\r\n  actual.setAttribute(\"y2\",a.y2.toFixed(2));\r\n\r\n  \/\/ Garis target tetap pada Rp80 juta.\r\n  const t=pointAt(targetValue,r-19,r+19);\r\n  target.setAttribute(\"x1\",t.x1.toFixed(2));\r\n  target.setAttribute(\"y1\",t.y1.toFixed(2));\r\n  target.setAttribute(\"x2\",t.x2.toFixed(2));\r\n  target.setAttribute(\"y2\",t.y2.toFixed(2));\r\n\r\n  targetLabel.setAttribute(\"x\",(t.x2+18).toFixed(2));\r\n  targetLabel.setAttribute(\"y\",(t.y2-6).toFixed(2));\r\n  targetLabel.textContent=\"80 juta\";\r\n\r\n  valueText.textContent=money(income)+(income<CFG.target?\" *\":\"\");\r\n  valueText.classList.remove(\"green\",\"red\");\r\n  valueText.classList.add(income>=CFG.target?\"green\":\"red\");\r\n\r\n  const gaugeStatus=document.getElementById(\"gaugeStatus\");\r\n  if(income<CFG.target){\r\n    gaugeStatus.textContent=\"* Belum memenuhi target\";\r\n    gaugeStatus.className=\"gaugeStatus target-note\";\r\n    gaugeStatus.style.display=\"block\";\r\n  }else{\r\n    gaugeStatus.textContent=\"\";\r\n    gaugeStatus.className=\"gaugeStatus\";\r\n    gaugeStatus.style.display=\"none\";\r\n  }\r\n\r\n  svg.setAttribute(\"aria-label\",`Penerimaan bulan ini ${money(income)}${income<CFG.target?\" belum memenuhi target\":\" sudah memenuhi target\"} Rp80.000.000 dan maksimum Rp100.000.000`);\r\n}\r\n\r\nfunction metric(n,v,b=false){return `<div class=\"metric\"><span>${n}<\/span><b>${money(v)}<\/b><\/div>`}\r\n\r\nfunction bars(id,a,total=null,showPercent=false){\r\n  const denominator = total !== null ? Number(total)||0 : Math.max(...a.map(x=>x[1]),1);\r\n\r\n  document.getElementById(id).innerHTML=a.map(x=>{\r\n    const value=Number(x[1])||0;\r\n    const pct=denominator>0 ? (value\/denominator*100) : 0;\r\n    const width=value>0 ? Math.max(2,Math.min(100,pct)) : 0;\r\n    const pctText=showPercent ? ` <span style=\"font-weight:normal;color:#667085\">(${pct.toFixed(1)}%)<\/span>` : \"\";\r\n\r\n    return `\r\n      <div>\r\n        <div class=\"bar-label\">\r\n          <span>${x[0]}${pctText}<\/span>\r\n          <b>${money(value)}<\/b>\r\n        <\/div>\r\n        <div class=\"bar-bg\">\r\n          <div class=\"bar\" style=\"width:${width}%\"><\/div>\r\n        <\/div>\r\n      <\/div>`;\r\n  }).join(\"\");\r\n}\r\nload().catch(e=>{document.getElementById(\"status\").style.display=\"none\";let x=document.getElementById(\"error\");x.style.display=\"block\";x.textContent=e.message+\" Pastikan Google Sheet dapat dibaca oleh halaman web (Publish to web \/ akses pembaca).\";});\r\n<\/script>\r\n<\/body><\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-e238561 e-con-full e-transform e-transform e-flex e-con e-child\" data-id=\"e238561\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;,&quot;_transform_translateX_effect&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;_transform_translateX_effect_laptop&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;_transform_translateX_effect_tablet&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;_transform_translateX_effect_mobile&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;_transform_translateY_effect&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;_transform_translateY_effect_laptop&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;_transform_translateY_effect_tablet&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;_transform_translateY_effect_mobile&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;_transform_scale_effect&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;_transform_scale_effect_laptop&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;_transform_scale_effect_tablet&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;_transform_scale_effect_mobile&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]}}\">\n\t\t<div class=\"elementor-element elementor-element-b48e29f e-con-full e-transform e-flex e-con e-child\" data-id=\"b48e29f\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;_transform_translateX_effect&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:-60,&quot;sizes&quot;:[]},&quot;_transform_translateX_effect_tablet&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:0,&quot;sizes&quot;:[]},&quot;_transform_translateX_effect_mobile&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:0,&quot;sizes&quot;:[]},&quot;_transform_translateX_effect_laptop&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;_transform_translateY_effect&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;_transform_translateY_effect_laptop&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;_transform_translateY_effect_tablet&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;_transform_translateY_effect_mobile&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]}}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-10cc67c elementor-widget elementor-widget-heading\" data-id=\"10cc67c\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\"><a href=\"https:\/\/gfcc.or.id\/give\/\">Saya rindu bersumbangsih di dalam pekerjaan Kerajaan Allah.<\/a><\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-f6f7f55 e-con-full e-flex e-con e-child\" data-id=\"f6f7f55\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-ac89660 elementor-button-info elementor-widget elementor-widget-button\" data-id=\"ac89660\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-button-wrapper\">\n\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-sm\" href=\"https:\/\/gfcc.or.id\/give\/\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">Click HERE<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\n    <div class=\"xs_social_share_widget xs_share_url after_content \t\tmain_content  wslu-style-1 wslu-share-box-shaped wslu-fill-colored wslu-none wslu-share-horizontal wslu-theme-font-no wslu-main_content\">\n\n\t\t\n        <ul>\n\t\t\t        <\/ul>\n    <\/div> \n","protected":false},"excerpt":{"rendered":"<p>GFCC Financial Report GFCC GFCC FUK IM THONG (Financial Report) September 2026 Pilih Periode Memuat data\u2026 Total PenerimaanRp 0Tidak termasuk Pinjaman \/ Talangan* Belum memenuhi target Rp80.000.000 Total PengeluaranRp 0Operasional &#038; program Saldo BersihRp 0Penerimaan \u2212 Pengeluaran Kebutuhan Operasional&hellip;<\/p>","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"postBodyCss":"","postBodyMargin":[],"postBodyPadding":[],"postBodyBackground":{"backgroundType":"classic","gradient":""},"ngg_post_thumbnail":0,"footnotes":""},"class_list":["post-12954","page","type-page","status-publish","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v28.8 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>GFCC Stewardship - GFCC<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/gfcc.or.id\/id\/stewardship\/\" \/>\n<meta property=\"og:locale\" content=\"id_ID\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"GFCC Stewardship - GFCC\" \/>\n<meta property=\"og:description\" content=\"GFCC Financial Report GFCC GFCC FUK IM THONG (Financial Report) September 2026 Pilih Periode Memuat data\u2026 Total PenerimaanRp 0Tidak termasuk Pinjaman \/ Talangan* Belum memenuhi target Rp80.000.000 Total PengeluaranRp 0Operasional &#038; program Saldo BersihRp 0Penerimaan \u2212 Pengeluaran Kebutuhan Operasional&hellip;\" \/>\n<meta property=\"og:url\" content=\"https:\/\/gfcc.or.id\/id\/stewardship\/\" \/>\n<meta property=\"og:site_name\" content=\"GFCC\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/GFCCPalembang\" \/>\n<meta property=\"article:modified_time\" content=\"2026-10-10T14:25:02+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Estimasi waktu membaca\" \/>\n\t<meta name=\"twitter:data1\" content=\"2 menit\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/gfcc.or.id\\\/stewardship\\\/\",\"url\":\"https:\\\/\\\/gfcc.or.id\\\/stewardship\\\/\",\"name\":\"GFCC Stewardship - GFCC\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/gfcc.or.id\\\/id\\\/#website\"},\"datePublished\":\"2026-04-04T15:13:56+00:00\",\"dateModified\":\"2026-10-10T14:25:02+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/gfcc.or.id\\\/stewardship\\\/#breadcrumb\"},\"inLanguage\":\"id\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/gfcc.or.id\\\/stewardship\\\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/gfcc.or.id\\\/stewardship\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/gfcc.or.id\\\/id\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"GFCC Stewardship\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/gfcc.or.id\\\/id\\\/#website\",\"url\":\"https:\\\/\\\/gfcc.or.id\\\/id\\\/\",\"name\":\"GFCC\",\"description\":\"Good Friends will lead you Jesus\",\"publisher\":{\"@id\":\"https:\\\/\\\/gfcc.or.id\\\/id\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/gfcc.or.id\\\/id\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"id\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/gfcc.or.id\\\/id\\\/#organization\",\"name\":\"Good Friends Community Church\",\"url\":\"https:\\\/\\\/gfcc.or.id\\\/id\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"id\",\"@id\":\"https:\\\/\\\/gfcc.or.id\\\/id\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/gfcc.or.id\\\/wp-content\\\/uploads\\\/2023\\\/03\\\/cropped-DEFAULT-1.png\",\"contentUrl\":\"https:\\\/\\\/gfcc.or.id\\\/wp-content\\\/uploads\\\/2023\\\/03\\\/cropped-DEFAULT-1.png\",\"width\":512,\"height\":512,\"caption\":\"Good Friends Community Church\"},\"image\":{\"@id\":\"https:\\\/\\\/gfcc.or.id\\\/id\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/GFCCPalembang\",\"https:\\\/\\\/www.instagram.com\\\/gfcc.plg\\\/\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"GFCC Stewardship - GFCC","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/gfcc.or.id\/id\/stewardship\/","og_locale":"id_ID","og_type":"article","og_title":"GFCC Stewardship - GFCC","og_description":"GFCC Financial Report GFCC GFCC FUK IM THONG (Financial Report) September 2026 Pilih Periode Memuat data\u2026 Total PenerimaanRp 0Tidak termasuk Pinjaman \/ Talangan* Belum memenuhi target Rp80.000.000 Total PengeluaranRp 0Operasional &#038; program Saldo BersihRp 0Penerimaan \u2212 Pengeluaran Kebutuhan Operasional&hellip;","og_url":"https:\/\/gfcc.or.id\/id\/stewardship\/","og_site_name":"GFCC","article_publisher":"https:\/\/www.facebook.com\/GFCCPalembang","article_modified_time":"2026-10-10T14:25:02+00:00","twitter_card":"summary_large_image","twitter_misc":{"Estimasi waktu membaca":"2 menit"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/gfcc.or.id\/stewardship\/","url":"https:\/\/gfcc.or.id\/stewardship\/","name":"GFCC Stewardship - GFCC","isPartOf":{"@id":"https:\/\/gfcc.or.id\/id\/#website"},"datePublished":"2026-04-04T15:13:56+00:00","dateModified":"2026-10-10T14:25:02+00:00","breadcrumb":{"@id":"https:\/\/gfcc.or.id\/stewardship\/#breadcrumb"},"inLanguage":"id","potentialAction":[{"@type":"ReadAction","target":["https:\/\/gfcc.or.id\/stewardship\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/gfcc.or.id\/stewardship\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/gfcc.or.id\/id\/"},{"@type":"ListItem","position":2,"name":"GFCC Stewardship"}]},{"@type":"WebSite","@id":"https:\/\/gfcc.or.id\/id\/#website","url":"https:\/\/gfcc.or.id\/id\/","name":"GFCC","description":"Good Friends will lead you Jesus","publisher":{"@id":"https:\/\/gfcc.or.id\/id\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/gfcc.or.id\/id\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"id"},{"@type":"Organization","@id":"https:\/\/gfcc.or.id\/id\/#organization","name":"Good Friends Community Church","url":"https:\/\/gfcc.or.id\/id\/","logo":{"@type":"ImageObject","inLanguage":"id","@id":"https:\/\/gfcc.or.id\/id\/#\/schema\/logo\/image\/","url":"https:\/\/gfcc.or.id\/wp-content\/uploads\/2023\/03\/cropped-DEFAULT-1.png","contentUrl":"https:\/\/gfcc.or.id\/wp-content\/uploads\/2023\/03\/cropped-DEFAULT-1.png","width":512,"height":512,"caption":"Good Friends Community Church"},"image":{"@id":"https:\/\/gfcc.or.id\/id\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/GFCCPalembang","https:\/\/www.instagram.com\/gfcc.plg\/"]}]}},"_links":{"self":[{"href":"https:\/\/gfcc.or.id\/id\/wp-json\/wp\/v2\/pages\/12954","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/gfcc.or.id\/id\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/gfcc.or.id\/id\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/gfcc.or.id\/id\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/gfcc.or.id\/id\/wp-json\/wp\/v2\/comments?post=12954"}],"version-history":[{"count":251,"href":"https:\/\/gfcc.or.id\/id\/wp-json\/wp\/v2\/pages\/12954\/revisions"}],"predecessor-version":[{"id":15572,"href":"https:\/\/gfcc.or.id\/id\/wp-json\/wp\/v2\/pages\/12954\/revisions\/15572"}],"wp:attachment":[{"href":"https:\/\/gfcc.or.id\/id\/wp-json\/wp\/v2\/media?parent=12954"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}