@font-face{font-family:Vistr Sans;src:url('/assets/fonts/VistrSans-Latin-Regular.woff2') format('woff2');font-weight:400;font-display:swap}@font-face{font-family:Vistr Sans;src:url('/assets/fonts/VistrSans-Latin-SemiBold.woff2') format('woff2');font-weight:600 800;font-display:swap}
:root{--navy:#102c3b;--text:#405560;--teal:#006b5e;--mint:#edf7f3;--line:#d7e3df;--paper:#fafcfb;--font:'Vistr Sans',system-ui,sans-serif;color:var(--navy);font-family:var(--font);font-size:16px;line-height:1.6;font-synthesis:none}*{box-sizing:border-box}body{margin:0;background:white}a{color:inherit;text-decoration-thickness:1px;text-underline-offset:4px}button,input,select{font:inherit}button,a,input,select,summary{-webkit-tap-highlight-color:transparent}:focus-visible{outline:3px solid #087f9c;outline-offset:4px}button{cursor:pointer}h1,h2,h3,p{margin:0}h1,h2,h3{font-weight:600;line-height:1.2;letter-spacing:-.025em}h1{font-size:clamp(36px,4.7vw,62px)}h2{font-size:26px}h3{font-size:21px}p{color:var(--text)}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.guide-wrap{width:min(1240px,calc(100% - 80px));margin-inline:auto}.skip{position:fixed;top:-80px;left:16px;background:var(--navy);color:white;padding:12px 20px;z-index:10}.skip:focus{top:10px}.guide-header{border-bottom:1px solid var(--line);background:white}.header-row{display:flex;justify-content:space-between;align-items:center;gap:20px;min-height:88px}.guide-brand{display:flex;align-items:center;gap:20px;text-decoration:none;font-size:15px;font-weight:600}.guide-brand img{display:block;width:100px;height:36px}.guide-brand span{border-left:1px solid var(--line);padding-left:20px}.header-row nav{display:flex;align-items:center;gap:28px;font-size:14px}.header-row nav a{padding-block:12px;text-decoration:none}.header-row nav a:hover{text-decoration:underline}.language-link{color:var(--teal);font-weight:600}.guide-hero{background:var(--mint);border-bottom:1px solid var(--line)}.hero-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:90px;padding-block:72px}.eyebrow{text-transform:uppercase;letter-spacing:.11em;font-size:12px;font-weight:600;color:var(--teal);margin-bottom:18px}.lead{font-size:19px;line-height:1.65;margin-top:22px;max-width:720px}.search-form{margin-top:32px}.search-form label{font-size:14px;font-weight:600;display:block;margin-bottom:8px}.search-control{display:flex;min-height:54px;background:white;border:1px solid #8ba69c;border-radius:5px;overflow:hidden}.search-control:focus-within{outline:3px solid #087f9c;outline-offset:3px}.search-control input{min-width:0;flex:1;border:0;padding:13px 16px;color:var(--navy);background:transparent}.search-control input:focus-visible{outline:none}.search-control button,.header-search button{border:0;background:var(--teal);color:white;padding:10px 22px;font-weight:600;min-height:44px}.search-control button:hover,.header-search button:hover{background:#005348}.search-note{font-size:13px;margin-top:9px}.start-panel{background:white;border:1px solid var(--line);border-radius:8px;padding:30px;align-self:center}.start-panel h2{font-size:26px;max-width:300px}.start-panel ol{list-style:none;counter-reset:step;padding:0;margin:22px 0 0}.start-panel li{counter-increment:step;display:flex;align-items:center;gap:15px;padding-block:16px;border-top:1px solid var(--line)}.start-panel li:before{content:counter(step,decimal-leading-zero);font-weight:600;color:var(--teal);font-size:13px}.start-panel a{text-decoration:none}.start-panel a:hover{text-decoration:underline}.home-content{padding-block:55px 80px}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:22px}.section-heading>p{font-size:14px;max-width:530px}.role-links{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.role-links a{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;border:1px solid var(--line);border-radius:4px;text-decoration:none;gap:14px;font-size:15px;min-height:54px}.role-links a:hover{background:var(--mint);border-color:#92bbae}.role-links a>span:last-child{color:var(--teal)}#tasks{margin-top:65px;scroll-margin-top:25px}.role-filter{display:flex;align-items:center;gap:12px;font-size:14px}.role-filter select{border:1px solid #91a69c;border-radius:4px;background:white;min-height:44px;max-width:230px;padding:8px 30px 8px 12px;color:var(--navy)}.search-status{font-size:14px;margin-bottom:16px}.guide-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.guide-card{border:1px solid var(--line);border-radius:6px;padding:24px 25px 48px;position:relative;min-width:0;background:white}.guide-card:hover{border-color:#7dafa0;background:#fcfefd}.guide-card h3{margin-bottom:12px;font-size:22px}.guide-card h3 a{text-decoration:none}.guide-card h3 a:after{content:'';position:absolute;inset:0}.guide-card h3 a:focus-visible{outline:none}.guide-card:focus-within{outline:3px solid #087f9c;outline-offset:3px}.guide-card p{font-size:15px}.guide-card .card-audience{font-size:11px;font-weight:600;color:var(--teal);margin-bottom:14px}.card-mark{position:absolute;bottom:17px;right:24px;color:var(--teal);font-size:22px}.empty{padding:24px;background:var(--mint);border-radius:5px}.guide-footer{background:var(--paper);border-top:1px solid var(--line);padding:35px 0 24px}.guide-footer>.guide-wrap{display:grid;grid-template-columns:1fr auto;gap:25px 50px}.guide-footer strong{font-size:24px}.guide-footer p{font-size:13px;max-width:590px;margin-top:8px}.guide-footer nav{display:flex;align-items:start;gap:24px;font-size:14px;padding-top:4px}.guide-footer nav a{padding-block:8px}.guide-footer .copyright{grid-column:1/-1;border-top:1px solid var(--line);padding-top:18px;max-width:none;font-size:12px}.article-top{display:flex;align-items:center;justify-content:space-between;gap:35px;padding-block:25px 35px;font-size:13px;color:var(--text)}.article-top>nav{min-width:0;overflow-wrap:anywhere}.header-search{display:flex;max-width:300px;flex:none;border:1px solid var(--line);border-radius:4px;overflow:hidden}.header-search input{width:180px;min-width:0;border:0;padding:9px 12px;font-size:14px}.header-search button{padding:8px 15px;font-size:14px}.article-layout{display:grid;grid-template-columns:minmax(0,820px) minmax(180px,250px);gap:80px;justify-content:center;padding-bottom:75px}.guide-article{min-width:0}.article-heading h1{font-size:clamp(34px,4vw,48px);line-height:1.14;max-width:760px}.article-heading .eyebrow{margin-bottom:15px}.article-heading .lead{font-size:20px}.audience{display:flex;flex-wrap:wrap;gap:7px;margin-top:22px}.audience a{display:inline-flex;align-items:center;min-height:32px;font-size:12px;text-decoration:none;border:1px solid var(--line);border-radius:4px;padding:4px 10px;color:var(--teal)}.audience a:hover{background:var(--mint)}.review-date{font-size:12px;margin-top:17px}.scope-note{border-left:3px solid #77ac9d;background:var(--mint);padding:14px 18px;font-size:14px;margin-top:27px}.article-section{margin-top:38px;scroll-margin-top:25px}.article-section h2{font-size:26px;margin-bottom:18px}.article-section p{font-size:17px;line-height:1.8;margin-top:14px}.instruction-list{counter-reset:instruction;list-style:none;padding:0;margin:0}.instruction-list > li{counter-increment:instruction;position:relative;padding:0 0 24px 48px;font-size:17px;line-height:1.8;color:var(--text)}.instruction-list > li:before{content:counter(instruction);position:absolute;left:0;top:2px;width:29px;height:29px;display:grid;place-items:center;background:var(--mint);color:var(--teal);border-radius:50%;font-size:14px;font-weight:600;line-height:1}.article-toc{align-self:start;position:sticky;top:30px;padding-left:24px;border-left:1px solid var(--line);margin-top:14px}.article-toc h2{font-size:14px;letter-spacing:0}.article-toc ul{padding:0;list-style:none;margin:14px 0 0}.article-toc li+li{margin-top:8px}.article-toc a{display:block;font-size:14px;line-height:1.5;padding:5px 0;color:var(--text);text-decoration:none}.article-toc a:hover{color:var(--teal);text-decoration:underline}.article-related{background:var(--paper);border:1px solid var(--line);border-radius:5px;padding:24px;margin-top:38px}.article-related h2{font-size:21px}.article-related ul{margin:12px 0 0;padding:0;list-style:none}.article-related a{display:inline-block;padding-block:8px;color:var(--teal)}.back-link{display:inline-block;padding-block:12px;margin-top:25px;font-size:14px;color:var(--teal)}.role-hero{padding-block:25px 45px}.role-hero .back-link{margin:0 0 25px}.role-hero .eyebrow{margin-bottom:10px}.role-hero h1{font-size:clamp(34px,4.7vw,52px)}.role-content{padding-bottom:75px}.role-content>h2{margin:50px 0 22px}
@media(max-width:1100px){.hero-grid{gap:38px;padding-block:50px}.guide-wrap{width:calc(100% - 56px)}.header-row nav{gap:18px}.article-layout{gap:45px;grid-template-columns:minmax(0,1fr) 200px}.guide-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.role-links{grid-template-columns:repeat(3,minmax(0,1fr))}.guide-brand{gap:14px}.guide-brand span{padding-left:14px}}
@media(max-width:800px){.header-row{flex-wrap:wrap;padding-block:18px;gap:8px}.header-row nav{width:100%;justify-content:space-between;font-size:13px}.hero-grid{grid-template-columns:1fr;gap:30px}.start-panel{max-width:none}.start-panel h2{max-width:none}.start-panel ol{display:flex;gap:24px}.start-panel li{flex:1;align-items:start;line-height:1.5;font-size:14px;gap:10px}.section-heading{display:block}.section-heading>p{margin-top:12px}.role-filter{margin-top:20px}.role-links{grid-template-columns:repeat(2,minmax(0,1fr))}.article-layout{display:flex;flex-direction:column;gap:0}.article-toc{position:static;order:-1;margin:0 0 32px;padding:17px 20px;border:1px solid var(--line);border-radius:4px;background:var(--paper)}.article-toc ul{display:flex;gap:4px 20px;flex-wrap:wrap;margin-top:8px}.article-toc li+li{margin:0}.article-top{gap:20px;align-items:start}.article-top>nav{max-width:50%}.header-search{max-width:230px}.header-search input{width:130px}.guide-footer>.guide-wrap{grid-template-columns:1fr;gap:15px}.guide-footer nav{flex-wrap:wrap}}
@media(max-width:500px){.guide-wrap{width:calc(100% - 36px)}.guide-brand span{font-size:13px}.guide-brand img{width:90px}.header-row nav{gap:10px}.header-row nav a{min-height:44px;display:flex;align-items:center}.hero-grid{padding-block:36px}.lead{font-size:17px;margin-top:17px}.search-control input{padding-inline:12px;font-size:15px}.search-control button{padding-inline:17px}.start-panel{padding:23px}.start-panel ol{display:block}.start-panel li{padding-block:14px;align-items:center;font-size:15px}.home-content{padding-block:35px 50px}.guide-cards{grid-template-columns:1fr;gap:12px}.guide-card{padding:23px 23px 45px}.role-links{gap:8px}.role-links a{font-size:13px;padding:12px;min-width:0;gap:6px}.role-links a>span:first-child{overflow-wrap:anywhere}.section-heading h2{font-size:25px}#tasks{margin-top:40px}.article-top{flex-direction:column;padding-block:20px;gap:15px}.article-top>nav{max-width:none}.header-search{width:100%;max-width:none}.header-search input{flex:1;width:auto}.article-heading .lead{font-size:18px}.article-section p,.instruction-list > li{font-size:16px}.instruction-list > li{padding-left:42px}.article-section h2{font-size:24px}.article-toc{margin-bottom:25px}.article-toc a{font-size:13px}.article-related{padding:20px}.article-layout{padding-bottom:45px}.guide-footer nav{gap:8px 20px}.role-hero{padding-bottom:32px}.role-content{padding-bottom:45px}}
@media(prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}a,button,.guide-card{transition:background-color .12s,border-color .12s}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
@media print{.guide-header,.guide-footer,.header-search,.article-toc,.back-link{display:none}.guide-wrap{width:100%}.article-layout{display:block}.article-top{padding:0 0 20px}.article-section{break-inside:avoid}.guide-card{break-inside:avoid}.scope-note{background:white}.audience a{border:0;padding:0}.article-heading h1{font-size:30px}}

.hero-grid>*{min-width:0}.mobile-toc{display:none}
@media(max-width:800px){.article-layout>.article-toc{display:none}.mobile-toc{display:block;margin-top:25px}.mobile-toc .article-toc{margin-bottom:0}.article-heading h1{overflow-wrap:anywhere}}
@media print{.mobile-toc{display:none}}

/* Visual tetap terbaca tanpa skrip; gambar asli dimuat saat dibuka. */
.sample-note,.capture-note{font-size:12px!important;line-height:1.6!important}.sample-note{margin-top:16px}.task-before{border:1px solid var(--line);padding:24px;border-radius:8px;background:var(--paper)}.task-outcome{border-left:4px solid var(--teal);padding:20px 24px;background:var(--mint)}.task-outcome h2{margin-bottom:8px}.flow-figure{margin:24px 0 0}.flow-list{list-style:none;padding:0;margin:0}.flow-list>li{position:relative;padding-bottom:30px}.flow-list>li:not(:last-child):after{content:'↓';position:absolute;left:24px;bottom:1px;color:var(--teal);font-size:22px;line-height:28px}.flow-node{position:relative;padding:18px 18px 18px 62px;border:1px solid #91b9ad;background:var(--mint);border-radius:8px;min-height:85px}.flow-number{position:absolute;left:18px;top:23px;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--teal);color:white;font-size:13px;font-weight:600}.flow-actor{display:block;color:var(--teal);font-size:12px;font-weight:600;margin-bottom:3px}.flow-node strong{display:block;font-size:17px;line-height:1.5}.flow-branches{margin:12px 0 0 37px;padding:0 0 0 23px;list-style:none;border-left:2px solid var(--line)}.flow-branches li{position:relative;border:1px solid var(--line);border-radius:6px;padding:12px 16px;margin-top:8px;font-size:14px}.flow-branches li:before{content:'';position:absolute;left:-25px;top:23px;width:24px;border-top:2px solid var(--line)}.flow-branches strong,.flow-branches span{display:block}.flow-branches strong{color:var(--teal);margin-bottom:4px}.flow-branches span{color:var(--text)}.flow-figure figcaption{color:var(--text);font-size:13px}.visual-open{display:inline-flex;align-items:center;min-height:44px;color:var(--teal);font-size:14px;margin-top:8px}.guide-figure{margin:22px 0 30px;min-width:0}.guide-figure-phone{max-width:390px}.screenshot-link{display:block;position:relative;border:1px solid var(--line);border-radius:7px;overflow:hidden;background:var(--paper)}.screenshot-link img{display:block;width:100%;height:auto}.enlarge-label{display:block;text-align:center;padding:10px 12px;font-size:13px;font-weight:600;background:var(--mint);color:var(--teal);border-top:1px solid var(--line);min-height:44px}.guide-figure figcaption{font-size:14px;line-height:1.65;color:var(--text);margin-top:12px}.figure-callouts{list-style:none;counter-reset:callout;padding:0;margin:12px 0 0;display:grid;gap:8px}.figure-callouts li{counter-increment:callout;position:relative;padding-left:32px;font-size:13px;line-height:1.6;overflow-wrap:anywhere;color:var(--text)}.figure-callouts li:before{content:counter(callout);position:absolute;left:0;top:0;width:23px;height:23px;display:grid;place-items:center;border-radius:50%;background:var(--navy);color:white;font-size:11px;font-weight:600}.article-section .capture-note{margin-top:10px}.instruction-list>li>p{margin-top:0}.field-table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:6px}.field-table{width:100%;border-collapse:collapse;text-align:left;font-size:14px;line-height:1.6}.field-table caption{text-align:left;padding:14px 16px;font-size:13px;color:var(--text)}.field-table th,.field-table td{vertical-align:top;padding:14px 16px;border-top:1px solid var(--line);min-width:110px}.field-table td{min-width:155px;color:var(--text)}.field-table thead{background:var(--mint)}.field-table tbody th{font-weight:600}.guide-issue{border-block:1px solid var(--line)}.guide-issue+.guide-issue{border-top:0}.guide-issue summary{padding:16px 4px;cursor:pointer;font-weight:600;min-height:48px;line-height:1.6}.guide-issue p{padding:0 4px 20px;margin:0;font-size:16px}.guide-viewer{border:0;border-radius:8px;padding:0;width:calc(100vw - 40px);max-width:1500px;max-height:calc(100dvh - 40px);color:var(--navy);background:white}.guide-viewer[open]{display:flex;flex-direction:column}.guide-viewer::backdrop{background:rgba(9,28,38,.8)}.guide-viewer header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:12px 20px;border-bottom:1px solid var(--line)}.guide-viewer h2{font-size:19px}.guide-viewer button,.viewer-original{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 16px;line-height:1.4;border:1px solid var(--line);border-radius:4px;background:white;color:var(--navy);font-size:14px;text-decoration:none}.guide-viewer button[aria-pressed=true]{background:var(--teal);color:white;border-color:var(--teal)}.viewer-toolbar{display:flex;flex-wrap:wrap;gap:8px;padding:10px 20px}.viewer-canvas{overflow:auto;min-height:0;flex:1;background:#edf1f0;padding:16px;text-align:center;overscroll-behavior:contain}.viewer-canvas img{display:block;width:auto;height:auto;max-width:100%;max-height:calc(100dvh - 265px);object-fit:contain;margin:auto}.guide-viewer.is-full .viewer-canvas{text-align:left}.guide-viewer.is-full .viewer-canvas img{max-width:none;max-height:none;margin:0}.viewer-caption{font-size:13px;line-height:1.5;padding:12px 20px}.viewer-open{overflow:hidden}
@media(max-width:500px){.task-before{padding:19px}.task-outcome{padding:18px}.flow-node{padding-left:53px}.flow-number{left:13px}.flow-branches{margin-left:27px;padding-left:17px}.flow-branches li:before{left:-19px;width:18px}.guide-viewer{width:calc(100vw - 16px);max-height:calc(100dvh - 16px)}.guide-viewer header,.viewer-toolbar{padding:10px 12px}.guide-viewer button,.viewer-original{font-size:12px;padding:8px 10px}.viewer-canvas{padding:8px}.viewer-caption{padding:10px 12px}.instruction-list > li .guide-figure{margin-left:-30px}.guide-figure-phone{max-width:100%}}
@media print{.guide-viewer,.visual-open,.enlarge-label{display:none!important}.flow-node,.flow-branches li,.guide-figure{break-inside:avoid}.guide-figure-phone{max-width:260px}.field-table-wrap{overflow:visible}.field-table th,.field-table td{min-width:0}.guide-issue::details-content{content-visibility:visible}.guide-issue>*{display:block}.flow-list>li{break-inside:avoid}.article-section{break-inside:auto}}