:root{--green:#0f6b3a;--green-dark:#073b22;--green-soft:#e8f5ec;--gold:#d9b45f;--text:#14251a;--muted:#66766b;--line:#dce9df;--danger:#b42318;--white:#fff;--bg:#f5faf4}*{box-sizing:border-box}body{margin:0;font-family:Arial,Helvetica,sans-serif;background:var(--bg);color:var(--text)}a{color:var(--green);text-decoration:none}a:hover{text-decoration:underline}.cms-topbar{position:sticky;top:0;z-index:20;display:grid;grid-template-columns:1.1fr 1.5fr auto;gap:18px;align-items:center;padding:14px 24px;background:rgba(255,255,255,.94);border-bottom:1px solid var(--line);box-shadow:0 8px 28px rgba(8,48,28,.06);backdrop-filter:blur(10px)}.brand a{display:block;color:var(--green-dark);font-weight:800;font-size:18px}.brand span{display:block;color:var(--muted);font-size:12px;margin-top:3px}.cms-nav{display:flex;gap:8px;flex-wrap:wrap}.cms-nav a{padding:8px 10px;border-radius:10px;color:#1d3b29;font-weight:700;font-size:13px}.cms-nav a:hover{background:var(--green-soft);text-decoration:none}.userbox{text-align:right;font-size:13px;color:var(--muted)}.userbox span{display:block;font-weight:800;color:var(--text)}.userbox small{text-transform:uppercase;letter-spacing:.05em}.cms-shell{width:min(1180px,94vw);margin:28px auto}.hero{padding:32px;border-radius:26px;background:linear-gradient(135deg,#fff,#eaf5ed);border:1px solid var(--line);box-shadow:0 18px 50px rgba(8,48,28,.08)}.hero h1{margin:0 0 10px;color:var(--green-dark);font-size:34px}.hero p{max-width:820px;color:#425348;line-height:1.65}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:22px}.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.cms-card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:20px;box-shadow:0 12px 35px rgba(8,48,28,.06)}.cms-card h2,.cms-card h3{margin-top:0;color:var(--green-dark)}.article-list{display:grid;gap:16px}.article-item{background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px}.article-item h2,.article-item h3{margin:0 0 8px}.meta{font-size:12px;color:var(--muted);margin-bottom:10px}.badge{display:inline-block;border-radius:999px;background:var(--green-soft);color:var(--green-dark);padding:4px 9px;font-size:12px;font-weight:800}.badge.draft{background:#fff7df;color:#8a5a00}.badge.archived{background:#eee;color:#555}.actions{display:flex;gap:10px;flex-wrap:wrap;margin:14px 0}.btn,button.btn{display:inline-block;border:0;background:var(--green);color:#fff;border-radius:12px;padding:10px 14px;font-weight:800;cursor:pointer;text-decoration:none}.btn:hover{background:var(--green-dark);text-decoration:none}.btn.secondary{background:#edf5ef;color:var(--green-dark)}.btn.danger{background:var(--danger)}.btn.small{padding:6px 9px;border-radius:9px;font-size:12px}.admin-layout{display:grid;grid-template-columns:240px 1fr;gap:20px}.admin-sidebar{background:#fff;border:1px solid var(--line);border-radius:20px;padding:16px;height:max-content;position:sticky;top:92px}.admin-sidebar h3{margin:0 0 12px;color:var(--green-dark)}.admin-sidebar a{display:block;padding:9px 10px;border-radius:10px;color:#1d3b29;font-weight:700}.admin-sidebar a:hover{background:var(--green-soft);text-decoration:none}.admin-content{min-width:0}.toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}.table-wrap{overflow:auto;background:#fff;border:1px solid var(--line);border-radius:18px}table{border-collapse:collapse;width:100%;min-width:760px}th,td{padding:12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}th{font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:#4f6255;background:#f7fbf8}tr:last-child td{border-bottom:0}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.form-row{margin-bottom:14px}label{display:block;font-weight:800;margin-bottom:6px;color:#243b2c}input[type=text],input[type=number],input[type=url],input[type=datetime-local],select,textarea,input[type=file]{width:100%;border:1px solid #cfded3;border-radius:12px;padding:10px 12px;font:inherit;background:#fff}textarea{min-height:260px;line-height:1.5}.notice{border-radius:14px;padding:12px 14px;margin:0 0 16px;border:1px solid var(--line);background:#eef8f1;color:#164b2b}.notice.error{background:#fff0ed;color:#8f1d12;border-color:#ffd2ca}.notice.warning{background:#fff9e8;color:#704d00;border-color:#f5d98c}.content-body{line-height:1.75;font-size:16px}.content-body img{max-width:100%;border-radius:16px}.media-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.media-box{background:#fff;border:1px solid var(--line);border-radius:16px;padding:12px;overflow:hidden}.media-box img{width:100%;height:130px;object-fit:cover;border-radius:12px;background:#f1f5f2}.muted{color:var(--muted)}.pagination{display:flex;gap:8px;margin-top:18px}.pagination a,.pagination span{padding:8px 11px;border-radius:10px;border:1px solid var(--line);background:#fff}.pagination .active{background:var(--green);color:#fff}@media(max-width:900px){.cms-topbar{grid-template-columns:1fr}.userbox{text-align:left}.grid,.grid.two,.admin-layout,.form-grid,.media-grid{grid-template-columns:1fr}.admin-sidebar{position:static}table{min-width:680px}.hero h1{font-size:28px}}

/* Rich article editor and reusable article components */
.article-editor{border:1px solid var(--line);border-radius:18px;overflow:hidden;background:#fff}.article-editor-import{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:14px 16px;background:#f7fbf8;border-bottom:1px solid var(--line)}.article-editor-import p{margin:4px 0 0;font-size:12px;line-height:1.5}.article-import-button{position:relative;overflow:hidden;white-space:nowrap;margin:0}.article-import-button input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.article-import-status{min-height:0;margin:0;padding:0 16px;color:var(--green-dark);font-size:12px;font-weight:700}.article-import-status:not(:empty){padding-top:10px;padding-bottom:10px;border-bottom:1px solid var(--line);background:#eef8f1}.article-editor-tabs{display:flex;gap:6px;padding:10px 12px;background:#f7fbf8;border-bottom:1px solid var(--line)}.article-editor-tab{border:1px solid transparent;background:transparent;color:#405347;border-radius:10px;padding:9px 13px;font-weight:800;cursor:pointer}.article-editor-tab:hover{background:#eaf5ed}.article-editor-tab.is-active{background:var(--green);color:#fff}.article-editor-panel[hidden]{display:none}.article-editor-toolbar{padding:10px 12px;border-bottom:1px solid var(--line);background:#fff}.article-toolbar-group{display:flex;gap:6px;flex-wrap:wrap}.article-toolbar-group button{border:1px solid #cfded3;background:#fff;color:#233b2c;border-radius:9px;min-height:34px;padding:6px 9px;font:inherit;font-size:12px;font-weight:800;cursor:pointer}.article-toolbar-group button:hover{background:var(--green-soft);border-color:#a9cdb3}.article-toolbar-label{margin:10px 0 7px;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.07em;font-weight:800}.template-buttons button{background:#f7fbf8}.article-visual-editor{min-height:390px;padding:24px;outline:none;background:#fff}.article-visual-editor:focus{box-shadow:inset 0 0 0 2px rgba(15,107,58,.14)}.article-visual-editor:empty:before{content:'Mulai tulis berita di sini atau impor file HTML...';color:#8a998f;pointer-events:none}.article-source-help{padding:12px 15px;background:#fff9e8;color:#704d00;border-bottom:1px solid #f5d98c;font-size:12px;line-height:1.55}.article-source-editor{display:block;width:100%;min-height:460px!important;border:0!important;border-radius:0!important;padding:18px!important;background:#101b14!important;color:#d9f4df!important;font-family:Consolas,Monaco,'Courier New',monospace!important;font-size:13px!important;line-height:1.65!important;resize:vertical}.article-source-editor:focus{outline:2px solid rgba(15,107,58,.25);outline-offset:-2px}.article-content-hidden{display:none!important}.article-preview-frame{display:block;width:100%;height:580px;border:0;background:var(--bg)}.editor-preview-shell{margin-top:22px;margin-bottom:22px}

.content-body{overflow-wrap:anywhere}.content-body> :first-child{margin-top:0}.content-body> :last-child{margin-bottom:0}.content-body h1,.content-body h2,.content-body h3,.content-body h4{color:var(--green-dark);line-height:1.25;margin:1.5em 0 .55em}.content-body h2{font-size:clamp(24px,3vw,34px)}.content-body h3{font-size:clamp(19px,2.2vw,25px)}.content-body p{margin:0 0 1.05em}.content-body ul,.content-body ol{padding-left:1.35em;margin:0 0 1.2em}.content-body li{margin:.38em 0}.content-body a{text-decoration:underline;text-underline-offset:3px}.content-body blockquote:not(.article-quote){margin:1.4em 0;padding:4px 0 4px 20px;border-left:4px solid var(--gold);color:#3f5045;font-size:1.08em}.content-body table{min-width:620px}.content-body figure{margin:1.6em 0}.content-body figcaption{margin-top:8px;color:var(--muted);font-size:13px;text-align:center}.content-body pre{overflow:auto;padding:16px;border-radius:14px;background:#102018;color:#e3f4e8}.content-body code{font-family:Consolas,Monaco,'Courier New',monospace}.content-body :not(pre)>code{padding:2px 6px;border-radius:6px;background:#edf5ef;color:#164b2b}

.article-lead{margin:0 0 28px;padding:clamp(22px,4vw,38px);border-radius:24px;background:linear-gradient(135deg,#eaf7ee,#fff9e8);border:1px solid #cfe4d5}.article-lead h2{margin:.35em 0!important;font-size:clamp(27px,4vw,42px)!important}.article-lead p{max-width:800px;margin:0!important;color:#405347;font-size:1.08em}.article-kicker{display:inline-block;padding:5px 10px;border-radius:999px;background:var(--green);color:#fff;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.06em}.article-info-box{margin:24px 0;padding:18px 20px;border:1px solid #b9dbc3;border-left:5px solid var(--green);border-radius:16px;background:#eef8f1}.article-info-box.warning{border-color:#f0d184;border-left-color:#c58a00;background:#fff9e8}.article-info-box strong{display:block;margin-bottom:5px;color:var(--green-dark);font-size:1.05em}.article-info-box.warning strong{color:#704d00}.article-info-box p:last-child{margin-bottom:0}.article-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin:26px 0}.article-card{padding:20px;border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:0 10px 28px rgba(8,48,28,.05)}.article-card h3{margin-top:0!important}.article-card p:last-child{margin-bottom:0}.article-quote{position:relative;margin:30px 0;padding:28px 28px 24px 58px;border:0;border-radius:20px;background:var(--green-dark);color:#fff}.article-quote:before{content:'“';position:absolute;left:22px;top:8px;color:var(--gold);font-family:Georgia,serif;font-size:64px;line-height:1}.article-quote p{margin:0 0 12px;font-family:Georgia,'Times New Roman',serif;font-size:clamp(20px,2.8vw,28px);line-height:1.5}.article-quote cite{display:block;color:#d6e5db;font-size:13px;font-style:normal}.article-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:26px 0}.article-stat{padding:20px 16px;border-radius:18px;background:#f3f8f4;border:1px solid var(--line);text-align:center}.article-stat strong{display:block;color:var(--green);font-size:clamp(26px,4vw,42px);line-height:1.1}.article-stat span{display:block;margin-top:8px;color:var(--muted);font-size:13px}.article-image img{display:block;width:100%;max-height:620px;object-fit:cover;border-radius:20px}.article-checklist{list-style:none;padding-left:0!important}.article-checklist li{position:relative;padding:11px 12px 11px 42px;margin:8px 0!important;border-radius:12px;background:#f6faf7}.article-checklist li:before{content:'✓';position:absolute;left:14px;top:10px;display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--green);color:#fff;font-size:12px;font-weight:900}.content-body .article-grid .article-card>*:first-child{margin-top:0}.content-body .article-grid .article-card>*:last-child{margin-bottom:0}

@media(max-width:720px){.article-editor-import{align-items:flex-start;flex-direction:column}.article-import-button{width:100%;text-align:center}.article-editor-tabs{overflow:auto}.article-editor-tab{white-space:nowrap}.article-visual-editor{padding:18px;min-height:330px}.article-grid,.article-stats{grid-template-columns:1fr}.article-quote{padding:25px 20px 22px 48px}.article-quote:before{left:15px}.content-body table{min-width:560px}}

/* Full-page HTML article mode */
.article-content-mode{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:14px 16px;border-bottom:1px solid var(--line);background:#fff}.article-content-mode p{margin:4px 0 0;font-size:12px;line-height:1.5;max-width:720px}.article-content-mode-buttons{display:flex;gap:7px;flex-wrap:wrap}.article-content-mode-buttons button{border:1px solid #cfded3;background:#f7fbf8;color:#294333;border-radius:10px;padding:9px 12px;font:inherit;font-size:12px;font-weight:800;cursor:pointer;white-space:nowrap}.article-content-mode-buttons button:hover{background:var(--green-soft)}.article-content-mode-buttons button.is-active{border-color:var(--green);background:var(--green);color:#fff}.article-editor-tab:disabled{cursor:not-allowed;opacity:.42}.article-source-help.standalone{background:#eaf4ff;color:#174a72;border-color:#b8d8f3}.article-editor.is-standalone .article-source-editor{min-height:620px!important;background:#08131f!important;color:#d7eafe!important}.article-editor.is-standalone .article-preview-frame{height:720px;background:#fff}.article-import-status.is-error{background:#fff0ed!important;color:#8f1d12!important;border-color:#ffd2ca!important}

body.cms-body--standalone{width:100%;max-width:100%;overflow-x:hidden}.cms-body--standalone .cms-topbar>*{min-width:0}.cms-body--standalone .brand,.cms-body--standalone .cms-nav,.cms-body--standalone .userbox{overflow-wrap:anywhere}.cms-shell.cms-shell--standalone{display:block;width:100%;max-width:100%;min-width:0;margin:0 0 28px;padding:0;overflow:clip}.cms-standalone-wrap{display:block;width:100%;max-width:100%;min-width:0;overflow:hidden}.cms-standalone-header{width:min(1180px,calc(100% - 32px));max-width:calc(100% - 32px);margin:28px auto 16px}.cms-standalone-header h1{margin:6px 0 0;color:var(--green-dark);font-size:clamp(25px,3.5vw,38px);line-height:1.2;overflow-wrap:anywhere}.cms-standalone-note{width:min(1180px,calc(100% - 32px));margin:0 auto 10px;color:var(--muted);font-size:12px}.cms-standalone-frame{display:block;width:100%;max-width:100%;min-width:0;min-height:760px;margin:0;padding:0;border:1px solid var(--line);border-right:0;border-left:0;border-radius:0;background:#fff;box-shadow:0 12px 35px rgba(8,48,28,.06)}

@media(max-width:720px){.article-content-mode{align-items:flex-start;flex-direction:column}.article-content-mode-buttons{width:100%}.article-content-mode-buttons button{flex:1}.article-editor.is-standalone .article-preview-frame{height:620px}.cms-body--standalone .cms-topbar{width:100%;max-width:100%;padding-left:14px;padding-right:14px}.cms-shell.cms-shell--standalone{width:100%;max-width:100%;margin:0 0 20px}.cms-standalone-header{width:calc(100% - 24px);max-width:calc(100% - 24px);margin:16px 12px 12px;padding:16px}.cms-standalone-frame{width:100%;max-width:100%;min-height:640px;border-radius:0}}