@import"https://fonts.googleapis.com/css2?family=Sarabun:wght@400;500&family=Urbanist:wght@500;600;700&display=swap";:root{font-family:Urbanist,sans-serif;color:var(--color-primary-text,#14181B);background:var(--color-primary-background,#F1F4F8);font-synthesis:none}*{box-sizing:border-box}body{margin:0}a{color:inherit;text-decoration:none}header{height:76px;padding:0 max(5vw,24px);display:flex;align-items:center;justify-content:space-between;background:var(--color-primary,#004751);color:#dbe8f4}.brand{font-family:Urbanist,sans-serif;font-weight:800;letter-spacing:.07em}.brand span{color:var(--color-turquoise,#39D2C0)}nav{display:flex;gap:28px;font-size:.92rem}nav a.active{color:var(--color-turquoise,#39D2C0)}main{min-height:calc(100vh - 136px)}footer{height:60px;padding:20px 5vw;color:#63748a;font-size:.85rem}.hero{min-height:620px;padding:120px max(8vw,24px);color:#fff;background:radial-gradient(circle at 80% 30%,#145568 0,transparent 35%),linear-gradient(120deg,#071b33,#0a2e4b)}h1,h2,h3{font-family:Urbanist,sans-serif;margin-top:0}.hero h1{font-size:clamp(2.7rem,6vw,5.8rem);line-height:1.03;max-width:950px;margin:12px 0 25px}.hero h1 em{color:var(--color-turquoise,#39D2C0);font-style:normal}.hero>p:not(.eyebrow){max-width:650px;font-size:1.14rem;color:#bdd0df}.eyebrow{font-size:.75rem;letter-spacing:.18em;font-weight:700;color:#16866b}.actions{display:flex;gap:28px;align-items:center;margin-top:40px}.button,button{padding:14px 20px;border-radius:9px;background:#52d6a5;color:#071b33;border:0;font-weight:700}.text-link{color:#d5e7f4}.dashboard,.narrow{max-width:1180px;margin:auto;padding:64px 24px}.narrow{max-width:650px}.card{margin-top:70px;background:#fff;border:1px solid #dde5ee;border-radius:16px}.dashboard-head,.section-title,.work-head{display:flex;justify-content:space-between;gap:30px;align-items:flex-start}.dashboard-head h1{font-size:clamp(2.2rem,5vw,4rem);margin-bottom:14px}.dashboard-head p{max-width:720px;color:#617187}.phase,.badge{white-space:nowrap;border-radius:30px;padding:8px 13px;background:#daf7ed;color:#087156;font-size:.78rem;font-weight:700}.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:45px 0 65px}.metrics article,.workstreams article{background:#fff;border:1px solid #dfe7ef;border-radius:14px;padding:24px;box-shadow:0 10px 30px #17324c0a}.metrics strong{display:block;font-family:Urbanist,sans-serif;font-size:2.8rem;color:#0a765f}.metrics span,.metrics small{display:block}.metrics span{font-weight:700}.metrics small,.workstreams small,time{color:#79899c}.section-title{align-items:end;border-bottom:1px solid #dce4ec;padding-bottom:16px}.section-title h2{margin-bottom:4px}.section-title p{margin:0;color:#69798d}.workstreams{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-top:24px}.work-head h3{margin:5px 0}.badge{padding:5px 10px;background:#e8edf2;color:#526377}.badge.aktif{background:#fff1cb;color:#8a6200}.badge.selesai{background:#daf7ed;color:#087156}.workstreams p{min-height:48px;color:#65758a}.bar{height:7px;background:#e8edf2;border-radius:10px;margin:22px 0 8px;overflow:hidden}.bar i{display:block;height:100%;background:#27b58f;border-radius:10px}aside{margin-top:32px;padding:22px 25px;background:var(--color-primary,#004751);color:#d6e3ee;border-radius:14px}aside p{margin-bottom:0;line-height:1.6}@media (max-width:700px){header{height:auto;padding-top:20px;padding-bottom:20px;align-items:flex-start}nav{flex-direction:column;gap:8px;text-align:right}.hero{padding-top:80px}.metrics,.workstreams{grid-template-columns:1fr}.dashboard-head,.section-title{display:block}.phase{display:inline-block;margin-top:12px}.section-title time{display:block;margin-top:12px}.actions{align-items:flex-start;flex-direction:column}}.run-status{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1px;margin:2rem 0;background:#dfe7ef;border:1px solid #dfe7ef;border-radius:18px;overflow:hidden}.run-status>div{display:flex;flex-direction:column;gap:.45rem;padding:1.1rem;background:#fff}.run-status small{font-size:.67rem;letter-spacing:.1em;color:#63748a}.run-status strong{font-size:.92rem}.run-status[data-status=success]>div:first-child strong{color:#17845b}.run-status[data-status=failed]>div:first-child strong,.run-status[data-status=blocked]>div:first-child strong{color:#b42318}.blockers{margin:0 0 2rem;padding:1.25rem 1.5rem;border:1px solid #f2c7c2;border-radius:18px;background:#fff7f6}.blockers h2{margin:0 0 .7rem;font-size:1rem;color:#9c2f23}.blockers ul{margin:0;padding-left:1.2rem}.blockers li+li{margin-top:.45rem}.product-detail{display:grid;grid-template-columns:140px 1fr;gap:24px;padding:24px;margin:28px 0}.product-detail img,.image-placeholder{width:140px;height:140px;object-fit:cover;border-radius:12px;background:#e9eff5}.product-state{padding:24px;margin:28px 0}.product-state button{margin-top:8px}.product-truth{color:#52657b}@media (max-width:700px){.run-status{grid-template-columns:1fr 1fr}.product-detail{grid-template-columns:1fr}.product-detail img,.image-placeholder{width:100%;height:220px}}.runtime-meter{display:block;height:6px;margin-top:.3rem;border-radius:99px;background:#e4ebf2;overflow:hidden}.runtime-meter i{display:block;height:100%;border-radius:inherit;background:#16866b}.run-status[data-status=failed] .runtime-meter i,.run-status[data-status=blocked] .runtime-meter i{background:#b42318}.runtime-meter{position:relative}.runtime-meter .target-zone{position:absolute;top:0;height:100%;border-left:2px solid #e8a317;border-right:2px solid #e8a317;background:#e8a31738;z-index:2}.ui-button{min-height:44px;padding:var(--space-3, 12px) var(--space-5, 20px);border:1px solid transparent;border-radius:var(--radius-medium, 8px);font:inherit;font-weight:700;cursor:pointer}.ui-button:focus-visible{outline:3px solid var(--color-info, #1c4494);outline-offset:2px}.ui-button:disabled,.ui-button[aria-disabled=true]{cursor:not-allowed;opacity:.6}.ui-button--small{min-height:40px;padding:var(--space-2, 8px) var(--space-3, 12px)}.ui-button--medium{min-height:44px}.ui-button--primary{background:var(--color-primary, #004751);color:var(--color-primary-btn-text, #fff)}.ui-button--secondary{background:var(--color-secondary-background, #fff);color:var(--color-primary, #004751);border-color:var(--color-primary, #004751)}.ui-button--danger{background:var(--color-error, #e21c3d);color:#fff}.ui-card{padding:var(--space-4, 16px);border:1px solid var(--color-line-color, #e0e3e7);border-radius:var(--radius-large, 12px);background:var(--color-secondary-background, #fff);box-shadow:var(--elevation-low, 0 1px 4px rgba(20, 24, 27, .12))}.ui-badge{display:inline-flex;align-items:center;min-height:24px;padding:2px var(--space-2, 8px);border-radius:var(--radius-pill, 40px);color:var(--color-primary-text, #14181b);background:var(--color-accent4, #eee);font-size:.75rem;font-weight:700}.ui-badge--success{background:#d2f2df;background:color-mix(in srgb,var(--color-success, #04a24c) 18%,white)}.ui-badge--warning{background:#fff6b3;background:color-mix(in srgb,var(--color-warning, #fcdc0c) 28%,white)}.ui-badge--danger{background:#fbdde2;background:color-mix(in srgb,var(--color-error, #e21c3d) 15%,white)}.ui-badge--info{background:#dde3f0;background:color-mix(in srgb,var(--color-info, #1c4494) 15%,white)}.ui-state{display:grid;justify-items:start;gap:var(--space-2, 8px);padding:var(--space-6, 24px);border:1px dashed var(--color-line-color, #e0e3e7);border-radius:var(--radius-large, 12px);background:var(--color-secondary-background, #fff)}.ui-state>*{margin:0}.ui-state--error{border-color:#ec8e9d;border-color:color-mix(in srgb,var(--color-error, #e21c3d) 45%,white)}.ui-spinner{width:24px;height:24px;border:3px solid var(--color-line-color, #e0e3e7);border-top-color:var(--color-primary, #004751);border-radius:50%;animation:ui-spin .8s linear infinite}@keyframes ui-spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion: reduce){.ui-spinner{animation:none}}
