/* SAMBAT EL 05.2P — Public Portal / Forest & Sage.
   Layered over established v04/v046 CSS; visual-only; no auth, API or form logic changes.
   CSP-safe: local CSS, no CDN/fonts/script dependencies. */
:root{--brand-900:#234F32;--brand-700:#396B45;--brand-500:#739A6E;--brand-300:#BBD0B5;--brand-100:#EAF1E6;--cream:#F7F4EB;--surface:#FFFDF8;--ink:#263C2C;--muted:#667A69;--border:#DFE6D9;--warning:#A46B27;--danger:#B34C3D;--success:#2D744B;--shadow-card:0 5px 22px -14px rgba(35,79,50,.20)}
body.public-forest{background:radial-gradient(ellipse 730px 480px at 85% 5%,#e7efe4 0,transparent 82%),var(--cream);color:var(--ink);font-family:'DM Sans','Segoe UI',system-ui,sans-serif;font-size:14px;line-height:1.6;min-height:100svh}
body.public-forest::before{height:3px;background:linear-gradient(90deg,var(--brand-900),var(--brand-500),#dfd8b9)}
body.public-forest :where(button,a,input,textarea,select):focus-visible{outline:3px solid #82a678;outline-offset:3px}
body.public-forest .sv-header{background:rgba(255,253,248,.95);border-bottom:1px solid var(--border);backdrop-filter:blur(12px)}
body.public-forest .sv-header-inner{width:min(1120px,calc(100% - 44px));min-height:72px;gap:18px}
body.public-forest .sv-brand img{width:48px;height:48px;object-fit:contain}
body.public-forest .sv-brand-text strong{color:var(--brand-900);font-size:24px;font-weight:850;letter-spacing:-1.1px}
body.public-forest .sv-brand-text small{color:var(--muted);font-size:10px;letter-spacing:.03em}
body.public-forest .sv-nav{gap:6px;flex-wrap:wrap}
body.public-forest .sv-nav a{color:var(--brand-900);border-radius:10px;padding:9px 13px;font-size:12px;font-weight:750;text-decoration:none;transition:background .18s}
body.public-forest .sv-nav a:hover,body.public-forest .sv-nav a:focus-visible{background:var(--brand-100);color:var(--brand-900);text-decoration:none}
body.public-forest.public-report .sv-nav a[href="/buat/"],body.public-forest.public-tracking .sv-nav a[href="/lacak/"]{background:var(--brand-100);color:var(--brand-900)}
body.public-forest .sv-footer{width:min(1120px,calc(100% - 44px));margin:0 auto;padding:19px 0 26px;border-top:1px solid var(--border);color:#778675;font-size:11px}
/* Public landing: decisive hero, premium cards, no made-up counters. */
body.public-home .public-wrap{width:min(1120px,calc(100% - 44px));margin:0 auto;padding:23px 0 32px}
body.public-home .public-hero{position:relative;isolation:isolate;overflow:hidden;background:repeating-radial-gradient(circle at 102% -2%,transparent 0 29px,rgba(255,255,255,.055) 29px 30px),linear-gradient(115deg,#234F32 0%,#396B45 65%,#739A6E 100%);border-radius:23px;display:grid;grid-template-columns:minmax(0,1.55fr) minmax(240px,.75fr);align-items:center;gap:10px;padding:clamp(26px,4vw,48px);color:#fff;box-shadow:0 18px 46px -30px rgba(35,79,50,.52)}
body.public-home .public-hero-copy{position:relative;z-index:2}
body.public-home .public-hero-kicker{display:inline-flex;align-items:center;gap:9px;font-size:10px;font-weight:850;letter-spacing:1.5px;color:#e2f0da}
body.public-home .public-glow-dot{width:8px;height:8px;border-radius:99px;background:#b5db9c;box-shadow:0 0 0 5px #ffffff1c}
body.public-home .public-hero h1{font-family:'Bricolage Grotesque','Segoe UI',system-ui,sans-serif;font-weight:850;letter-spacing:-1.8px;line-height:1.13;font-size:clamp(31px,4vw,48px);margin:17px 0 13px;color:#fff;max-width:680px}
body.public-home .public-hero h1 em{font-style:normal;color:#d5e9bf}
body.public-home .public-hero p{color:#edf6e9;font-size:14px;line-height:1.8;max-width:600px;margin:0}
body.public-home .public-hero-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:25px}
body.public-home .public-primary,body.public-home .public-secondary{display:inline-flex;align-items:center;justify-content:center;gap:13px;border-radius:11px;min-height:45px;padding:10px 17px;font-size:13px;font-weight:800;transition:transform .18s,background .18s}
body.public-home .public-primary{background:var(--surface);color:var(--brand-900);box-shadow:0 5px 18px #193a2229}
body.public-home .public-secondary{border:1px solid #ffffff91;color:white}
body.public-home .public-primary:hover,body.public-home .public-secondary:hover{transform:translateY(-2px)}
body.public-home .public-secondary:hover{background:#ffffff20}
body.public-home .public-hero-illustration{height:220px;position:relative;display:grid;place-items:center;min-width:0}
body.public-home .public-art-orbit{position:absolute;border:1px solid #ffffff3b;border-radius:50%;width:218px;height:218px;left:50%;top:50%;transform:translate(-50%,-50%)}
body.public-home .orbit-two{width:176px;height:176px;border-color:#ffffff2e}
body.public-home .public-art-icon{width:145px;height:145px;display:grid;place-items:center;border:1px solid #ffffff58;border-radius:34px;background:#ffffff24;box-shadow:0 18px 34px #17482c28;transform:rotate(-6deg)}
body.public-home .public-art-icon svg{width:94px;height:94px;transform:rotate(6deg)}
body.public-home .public-art-caption{position:absolute;bottom:0;color:#eff5e8;font:500 9px ui-monospace,monospace;letter-spacing:.7px;white-space:nowrap}
body.public-home .public-art-caption span{color:#d5e9bf;margin:0 7px}
body.public-home .public-choices{padding-top:30px}
body.public-home .public-section-heading{display:flex;align-items:end;justify-content:space-between;gap:15px;flex-wrap:wrap;margin-bottom:15px}
body.public-home .public-overline{font-size:10px;font-weight:850;letter-spacing:1.7px;color:var(--brand-500)}
body.public-home .public-section-heading h2,body.public-home .public-how-title h2{font-family:'Bricolage Grotesque','Segoe UI',system-ui,sans-serif;font-size:clamp(22px,3vw,28px);font-weight:850;letter-spacing:-.6px;line-height:1.2;color:var(--brand-900);margin:6px 0 0}
body.public-home .public-section-heading p,body.public-home .public-how-title p{margin:0;color:var(--muted);font-size:12px}
body.public-home .public-choice-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}
body.public-home .public-choice-card{display:flex;flex-direction:column;min-height:238px;padding:24px 25px;border:1px solid var(--border);border-radius:19px;background:var(--surface);box-shadow:var(--shadow-card);transition:transform .18s,box-shadow .18s,border-color .18s}
body.public-home .public-choice-card:hover{transform:translateY(-3px);box-shadow:0 20px 34px -23px rgba(35,79,50,.33);border-color:#b6ceae}
body.public-home .choice-report{background:linear-gradient(160deg,#f4f8f0,var(--surface) 67%)}
body.public-home .choice-track{background:linear-gradient(160deg,#fbfaf3,var(--surface) 67%)}
body.public-home .public-choice-top{display:flex;align-items:start;justify-content:space-between;gap:12px}
body.public-home .public-choice-icon{width:51px;height:51px;border-radius:14px;background:var(--brand-100);display:grid;place-items:center;color:var(--brand-900);flex:none}
body.public-home .choice-track .public-choice-icon{background:#ede9d9}
body.public-home .public-choice-icon svg{width:26px;height:26px}
body.public-home .public-choice-index{font:600 10px ui-monospace,monospace;letter-spacing:.9px;color:#788b71}
body.public-home .public-choice-card h3{font-size:23px;color:var(--brand-900);letter-spacing:-.5px;line-height:1.3;margin:16px 0 6px;font-weight:850}
body.public-home .public-choice-card p{font-size:12.6px;line-height:1.7;color:var(--muted);margin:0 0 17px;max-width:430px}
body.public-home .public-choice-arrow{display:flex;justify-content:space-between;align-items:center;gap:10px;color:var(--brand-700);font-size:12px;font-weight:850;margin-top:auto}
body.public-home .public-choice-arrow span{border-radius:50%;background:var(--brand-100);width:31px;height:31px;display:grid;place-items:center;font-size:19px}
body.public-home .public-how{display:grid;grid-template-columns:minmax(190px,1fr) minmax(0,2.5fr);gap:22px;align-items:center;margin-top:15px;border-radius:18px;border:1px solid var(--border);background:#fffdf8;padding:23px 25px;box-shadow:var(--shadow-card)}
body.public-home .public-how-title h2{font-size:21px}
body.public-home .public-how-title p{font-size:11.5px;line-height:1.6;margin-top:7px}
body.public-home .public-how-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:0;list-style:none;margin:0}
body.public-home .public-how-list li{display:flex;gap:10px;min-width:0;align-items:start}
body.public-home .public-how-number{display:grid;place-items:center;width:31px;height:31px;border-radius:10px;background:var(--brand-100);font:700 11px ui-monospace,monospace;color:var(--brand-900);flex:none}
body.public-home .public-how-list b{display:block;color:var(--brand-900);font-size:12px}
body.public-home .public-how-list p{color:var(--muted);font-size:11px;line-height:1.6;margin:3px 0 0}
body.public-home .public-privacy-note{display:flex;justify-content:center;align-items:center;gap:9px;margin:20px auto 0;max-width:850px;color:var(--muted);font-size:11px;line-height:1.6;text-align:center}
body.public-home .public-privacy-note svg{width:19px;height:19px;flex:none;color:var(--brand-700)}
/* Shared document interiors: consistent forest cards + readable spacing. */
body.public-forest :where(.inner-main){min-height:calc(100svh - 155px)}
body.public-forest.public-report .inner-main{width:min(720px,calc(100% - 36px));padding:25px 0 38px}
body.public-forest.public-tracking .track-main{width:min(730px,calc(100% - 36px));padding:25px 0 36px}
body.public-forest .back-link{color:var(--brand-700);font-size:12px;font-weight:800;margin-bottom:15px}
body.public-forest .page-intro{margin-bottom:17px}
body.public-forest .page-intro .eyebrow{color:var(--brand-500);font-size:10px;letter-spacing:1.5px}
body.public-forest .page-intro h1{font-family:'Bricolage Grotesque','Segoe UI',system-ui,sans-serif;font-size:clamp(29px,3.7vw,37px);font-weight:850;letter-spacing:-.8px;color:var(--brand-900);margin:6px 0 4px}
body.public-forest .page-intro h1 span{color:var(--brand-500)}
body.public-forest .page-intro p{color:var(--muted);font-size:12.5px;line-height:1.65}
body.public-forest .portal-card,body.public-forest .track-card{background:var(--surface);border:1px solid var(--border);border-radius:18px;box-shadow:0 18px 45px -28px rgba(35,79,50,.33);overflow:hidden}
body.public-forest .portal-card::before,body.public-forest .track-card::before{height:4px;background:linear-gradient(90deg,var(--brand-900),var(--brand-500),var(--brand-300))}
body.public-forest .public-page-accent,body.public-forest .public-track-ribbon{display:flex;gap:9px;align-items:center;flex-wrap:wrap;background:var(--brand-100);border:1px solid var(--border);color:var(--brand-900);border-radius:12px;padding:9px 13px;margin:0 0 14px}





body.public-forest .public-track-ribbon{justify-content:space-between;gap:8px;font-size:10.5px;font-weight:750}
/* 05.2Q: three self-contained steps; never style the whole step as a numbered badge.
   The old nth-child selectors made 01 and 03 only 24px wide, pushing labels below the ribbon. */
body.public-forest .public-page-accent{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch;gap:8px;padding:9px;margin-bottom:15px}
body.public-forest .public-page-accent > .public-mini-step{display:flex;min-width:0;min-height:48px;align-items:center;justify-content:flex-start;gap:9px;white-space:normal;overflow-wrap:normal;line-height:1.35;font-size:10px;font-weight:800;letter-spacing:.12px;color:var(--brand-900);background:rgba(255,253,248,.83);border:1px solid #d8e5d3;border-radius:9px;padding:8px 10px}
body.public-forest .public-page-accent > .public-mini-step > b{width:27px;height:27px;display:grid;place-items:center;flex:0 0 27px;border-radius:8px;background:var(--brand-100);color:var(--brand-900);font:800 11px ui-monospace,monospace}
body.public-forest .public-page-accent > .public-mini-step:first-child{background:#fffdf8;border-color:#b7d2ae}
/* Tracking steps are guidance, not buttons. Keep every phrase inside its own column. */
body.public-forest .public-track-ribbon{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch;gap:8px;padding:9px;margin-bottom:15px}
body.public-forest .public-track-ribbon > span{display:flex;min-width:0;align-items:center;justify-content:center;text-align:center;padding:9px 8px;min-height:45px;border:1px solid #d8e5d3;border-radius:9px;background:rgba(255,253,248,.83);font-size:10px;line-height:1.45;font-weight:750;overflow-wrap:break-word}

/* OTP and wizard: DOM IDs & script-inserted controls stay untouched. */
body.public-forest.public-report .portal-card .portal-header{background:linear-gradient(100deg,#edf4e9,#fffdf8);border-bottom-color:var(--border)}
body.public-forest.public-report .portal-header h2{color:var(--brand-900)}
body.public-forest.public-report .portal-card #panel-form{padding:25px 28px 27px}
body.public-forest.public-report .gate-step{color:var(--brand-500);font-size:10px}
body.public-forest.public-report .gate-title{color:var(--brand-900);font-size:25px;letter-spacing:-.55px;margin:6px 0 6px}
body.public-forest.public-report .gate-lead{color:var(--muted);line-height:1.75;font-size:12.8px;max-width:580px;margin-bottom:19px}
body.public-forest.public-report .field label,body.public-forest.public-report .otp-code-field{color:var(--brand-900);font-weight:750}
body.public-forest.public-report :is(.field input,.field textarea,.field select,.otp-code-field input){border-color:#cfdccc;background:#fffefa;color:var(--ink);border-radius:10px}
body.public-forest.public-report :is(.field input,.field select,.otp-code-field input){min-height:42px}
body.public-forest.public-report :is(.button-primary,#next-btn,#otp-check,#otp-send,.button){border-radius:10px}
body.public-forest.public-report :is(.button-primary,#next-btn,#otp-check){background:var(--brand-700);border-color:var(--brand-700);color:#fff}
body.public-forest.public-report :is(.button-primary,#next-btn,#otp-check):hover:not(:disabled){background:var(--brand-900);border-color:var(--brand-900)}
body.public-forest.public-report .sambat-otp-stage{border-top-color:var(--border)}
body.public-forest.public-report .otp-compact-heading,body.public-forest.public-report .otp-compact-heading strong{color:var(--brand-900)}
body.public-forest.public-report .verified-ribbon{background:var(--brand-100);border-color:var(--brand-300);color:var(--brand-900)}
body.public-forest.public-report .verified-dot{background:var(--success)}
body.public-forest.public-report .verified-change{color:var(--brand-700)}
body.public-forest.public-report .progress li.current span{background:var(--brand-700);border-color:var(--brand-700);color:white}
body.public-forest.public-report .portal-card .step-panel legend{color:var(--brand-900);font-weight:850}
body.public-forest.public-report :is(.location-picker,.bukti-panel,.review-grid,.law-details){border-color:var(--border)}
body.public-forest.public-report .location-picker{background:#f7faf5}
body.public-forest.public-report .bukti-panel{background:#f8faf6;border-radius:14px}
body.public-forest.public-report .bukti-add{border-radius:10px}
body.public-forest.public-report .law-details{background:#f9f9f2}
body.public-forest.public-report .law-details summary{color:var(--brand-700)}
body.public-forest.public-report .secure-note{color:var(--muted);font-size:11px}
/* Tracking: result remains private and uses existing Worker status. */
body.public-forest.public-tracking .track-card{padding:0 28px 27px}
body.public-forest.public-tracking .track-topline{color:var(--brand-500);margin-top:25px}
body.public-forest.public-tracking .track-topline-icon{background:var(--brand-100);color:var(--brand-900);border-radius:10px}
body.public-forest.public-tracking .track-card h2{font-size:25px;font-weight:850;color:var(--brand-900)}
body.public-forest.public-tracking .track-card>p{color:var(--muted);font-size:12.8px}
body.public-forest.public-tracking #ticket-form label{color:var(--brand-900);font-size:12px}
body.public-forest.public-tracking #ticket-form input{background:#fffefa;border-color:#cfddcd;border-radius:10px;color:var(--ink);font-size:13px}
body.public-forest.public-tracking #ticket-form button{background:var(--brand-700);border-radius:10px;font-weight:800;font-size:12px}
body.public-forest.public-tracking #ticket-form button:hover:not(:disabled){background:var(--brand-900)}
body.public-forest.public-tracking .track-result{border-color:var(--border);background:#fffefa}
body.public-forest.public-tracking .track-result-heading{background:var(--brand-100);border-bottom-color:var(--border)}
body.public-forest.public-tracking .track-result-heading h3,body.public-forest.public-tracking .status-main strong{color:var(--brand-900)}
body.public-forest.public-tracking .track-result-check{background:var(--success)}
body.public-forest.public-tracking .status-pulse{background:var(--brand-700);border-color:var(--brand-300)}
body.public-forest.public-tracking .copy-ticket{color:var(--brand-700)}
body.public-forest.public-tracking .privacy-line{color:var(--muted);font-size:11px;max-width:650px}
@media(max-width:960px){body.public-home .public-hero{grid-template-columns:minmax(0,1fr) 190px}body.public-home .public-hero-illustration{height:190px}body.public-home .public-art-orbit{width:185px;height:185px}body.public-home .orbit-two{width:150px;height:150px}body.public-home .public-art-icon{width:120px;height:120px;border-radius:27px}body.public-home .public-art-icon svg{width:79px;height:79px}body.public-home .public-how{grid-template-columns:1fr}body.public-home .public-how-list{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:650px){
 body.public-forest .sv-header-inner{width:calc(100% - 24px);min-height:65px;gap:7px}
 body.public-forest .sv-brand{gap:6px}
 body.public-forest .sv-brand img{width:41px;height:41px}
 body.public-forest .sv-brand-text strong{font-size:20px;letter-spacing:-1px}
 body.public-forest .sv-brand-text small{font-size:8px}
 body.public-forest .sv-nav{gap:2px}
 body.public-forest .sv-nav a{padding:8px 7px;font-size:10px}
 body.public-forest .sv-footer{width:calc(100% - 30px);font-size:10px}
 body.public-home .public-wrap{width:calc(100% - 24px);padding:13px 0 25px}
 body.public-home .public-hero{grid-template-columns:1fr;gap:3px;padding:25px 21px;border-radius:18px}
 body.public-home .public-hero h1{font-size:clamp(30px,8.4vw,40px);letter-spacing:-1px;margin:14px 0 10px}
 body.public-home .public-hero p{font-size:12.5px;line-height:1.7}
 body.public-home .public-hero-kicker{font-size:8.5px;letter-spacing:1px}
 body.public-home .public-hero-actions{gap:8px;margin-top:19px}
 body.public-home .public-primary,body.public-home .public-secondary{font-size:11.5px;padding:10px 12px;min-height:44px}
 body.public-home .public-hero-illustration{display:none}
 body.public-home .public-choices{padding-top:24px}
 body.public-home .public-section-heading{align-items:start;margin-bottom:12px}
 body.public-home .public-section-heading h2{font-size:22px}
 body.public-home .public-section-heading p{font-size:11px}
 body.public-home .public-choice-grid{grid-template-columns:1fr;gap:11px}
 body.public-home .public-choice-card{min-height:199px;padding:20px;border-radius:17px}
 body.public-home .public-choice-card h3{margin-top:13px;font-size:21px}
 body.public-home .public-choice-card p{font-size:12px;margin-bottom:14px}
 body.public-home .public-how{padding:19px;margin-top:12px;border-radius:16px;gap:16px}
 body.public-home .public-how-list{grid-template-columns:1fr;gap:11px}
 body.public-home .public-how-list li{gap:12px}
 body.public-home .public-privacy-note{font-size:10px;align-items:flex-start;text-align:left}
 body.public-forest.public-report .inner-main,body.public-forest.public-tracking .track-main{width:calc(100% - 24px);padding-top:18px}
 body.public-forest .page-intro h1{font-size:27px}
 body.public-forest .page-intro p{font-size:11.5px}
 
 
 
 
 body.public-forest .public-page-accent{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding:7px}
 body.public-forest .public-page-accent > .public-mini-step{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:7px;min-height:84px;padding:9px 8px;font-size:9px;line-height:1.3;white-space:normal}
 body.public-forest .public-page-accent > .public-mini-step > b{width:26px;height:26px;flex:0 0 26px}
 body.public-forest .public-track-ribbon{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding:7px}
 body.public-forest .public-track-ribbon > span{font-size:9px;min-height:65px;padding:8px 6px;line-height:1.35}
 body.public-forest.public-report .portal-card #panel-form{padding:18px 17px 20px}
 body.public-forest.public-report .gate-title{font-size:22px}
 body.public-forest.public-tracking .track-card{padding:0 18px 22px}
 body.public-forest.public-tracking .track-card h2{font-size:21px}
 body.public-forest.public-tracking .ticket-search-row{grid-template-columns:1fr}
 body.public-forest.public-tracking #ticket-form button{min-height:45px}
}
@media(max-width:385px){body.public-forest .sv-brand-text small{display:none}body.public-forest .sv-nav a{font-size:9px;padding:7px 5px}body.public-forest .public-page-accent span:nth-child(even){font-size:7.5px}}
@media(prefers-reduced-motion:reduce){body.public-home .public-primary,body.public-home .public-secondary,body.public-home .public-choice-card{transition:none}body.public-home .public-primary:hover,body.public-home .public-secondary:hover,body.public-home .public-choice-card:hover{transform:none}}

/* 05.2Q — safe navigation on narrow screens and font-size scaling */
@media (max-width:410px){
 body.public-forest .sv-header-inner{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;row-gap:0;padding:9px 0 7px}
 body.public-forest .sv-brand{flex:1 1 140px}
 body.public-forest .sv-nav{flex:1 0 100%;justify-content:space-between;gap:7px;margin-top:5px}
 body.public-forest .sv-nav a{flex:1;text-align:center;font-size:11px;line-height:1.4;padding:7px 5px}
 body.public-forest .public-page-accent > .public-mini-step{font-size:8.7px}
}
@media (max-width:350px){
 body.public-forest .public-page-accent{grid-template-columns:1fr;gap:5px}
 body.public-forest .public-page-accent > .public-mini-step{min-height:37px;flex-direction:row;align-items:center;gap:9px}
 body.public-forest .public-track-ribbon{grid-template-columns:1fr;gap:5px}
 body.public-forest .public-track-ribbon > span{min-height:34px;text-align:left;justify-content:flex-start}
}
