:root{--bg: #f7f7f5;--surface: #ffffff;--surface-2: #f1f1ee;--text: #16181d;--muted: #6b7079;--line: #e4e4df;--brand: #2f6bff;--brand-ink: #ffffff;--brand-soft: #e8efff;--ok: #138a4b;--ok-soft: #e3f5ea;--warn: #b26a00;--warn-soft: #fff2db;--bad: #c62828;--bad-soft: #fde7e7;--radius: 14px;--radius-sm: 10px;--shadow: 0 1px 2px rgba(16, 24, 40, .05), 0 4px 16px rgba(16, 24, 40, .06);--font: "Plus Jakarta Sans", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;--maxw: 1080px;color-scheme:light}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--bg);color:var(--text);font-family:var(--font);font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased}a{color:inherit}img{max-width:100%;display:block}button{font:inherit}.container{width:100%;max-width:var(--maxw);margin:0 auto;padding:0 16px}.h1{font-size:clamp(26px,5vw,38px);line-height:1.15;font-weight:800;letter-spacing:-.02em;margin:0 0 8px}.h2{font-size:22px;line-height:1.25;font-weight:800;letter-spacing:-.01em;margin:0 0 6px}.h3{font-size:17px;font-weight:700;margin:0 0 4px}.muted{color:var(--muted)}.small{font-size:13px}.tiny{font-size:11.5px}.center{text-align:center}.stack{display:flex;flex-direction:column;gap:12px}.stack-sm{display:flex;flex-direction:column;gap:6px}.row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.row-between{display:flex;align-items:center;justify-content:space-between;gap:12px}.grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}.grow{flex:1;min-width:0}.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:16px;box-shadow:var(--shadow)}.card.flat{box-shadow:none}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--line);background:var(--surface);color:var(--text);border-radius:var(--radius-sm);padding:10px 16px;font-weight:700;cursor:pointer;text-decoration:none;min-height:44px;transition:transform .06s ease,background .15s ease}.btn:active{transform:translateY(1px)}.btn:disabled{opacity:.55;cursor:not-allowed}.btn.primary{background:var(--brand);border-color:var(--brand);color:var(--brand-ink)}.btn.ghost{background:transparent;border-color:transparent}.btn.danger{background:var(--bad);border-color:var(--bad);color:#fff}.btn.sm{min-height:34px;padding:6px 12px;font-size:13px}.btn.block{width:100%}.input,select.input,textarea.input{width:100%;border:1px solid var(--line);background:var(--surface);color:var(--text);border-radius:var(--radius-sm);padding:11px 12px;font:inherit;min-height:44px}.input:focus{outline:2px solid var(--brand);outline-offset:1px;border-color:transparent}.input.code{font-size:24px;letter-spacing:8px;text-align:center;font-weight:700}label.field{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:600}.pill{display:inline-flex;align-items:center;gap:4px;border-radius:999px;padding:3px 10px;font-size:12px;font-weight:700;background:var(--surface-2);color:var(--muted);white-space:nowrap}.pill.ok{background:var(--ok-soft);color:var(--ok)}.pill.warn{background:var(--warn-soft);color:var(--warn)}.pill.bad{background:var(--bad-soft);color:var(--bad)}.pill.brand{background:var(--brand-soft);color:var(--brand)}.note{background:var(--warn-soft);color:#6b4300;border-radius:var(--radius-sm);padding:10px 12px;font-size:13px}.error{color:var(--bad);font-size:14px}.login{max-width:400px;margin:48px auto;padding:0 16px;display:flex;flex-direction:column;gap:12px}.spinner{width:22px;height:22px;border-radius:50%;border:3px solid var(--line);border-top-color:var(--brand);animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.divider{height:1px;background:var(--line);margin:8px 0}table.tbl{width:100%;border-collapse:collapse;font-size:13px}table.tbl th,table.tbl td{text-align:left;padding:8px 6px;border-bottom:1px solid var(--line)}.scroll-x{overflow-x:auto;-webkit-overflow-scrolling:touch}@media (max-width: 640px){.hide-sm{display:none!important}}:root{--bg: #FCF8F7;--surface: #ffffff;--surface-2: #F7EEF0;--text: #22141B;--muted: #6E5F67;--line: #EED9DE;--brand: #B4235A;--brand-2: #D63A74;--brand-ink: #fff;--brand-soft: #FCE7EF;--dark: #2A0F1E;--cta: #DF5527;--cta-2: #EC6A38;--cta-d: #A93A15;--ok: #1F9D63;--ok-soft: #E6F6EE;--radius: 18px;--radius-sm: 14px;--maxw: 560px;--font: "Plus Jakarta Sans", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;--head: "Bricolage Grotesque", "Plus Jakarta Sans", system-ui, sans-serif}body{font-size:16px}.h1,.h2,.h3,h1,h2,h3{font-family:var(--head);letter-spacing:-.02em}.btn{min-height:50px;border-radius:15px}.btn.primary{background:var(--brand);border-color:var(--brand)}.btn.cta{background:linear-gradient(180deg,var(--cta-2),var(--cta));border:0;color:#fff;box-shadow:0 4px 0 var(--cta-d);font-size:17px}.btn.cta:active{transform:translateY(3px);box-shadow:0 1px 0 var(--cta-d)}.btn.soft{background:var(--brand-soft);border-color:var(--brand-soft);color:var(--brand)}.btn.dark{background:var(--dark);border-color:var(--dark);color:#fff}.tbar{position:sticky;top:0;z-index:20;background:#fcf8f7eb;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}.tbar .in{max-width:var(--maxw);margin:0 auto;padding:0 16px;height:58px;display:flex;align-items:center;gap:10px}.logo{display:flex;align-items:center;gap:9px;text-decoration:none;font-family:var(--head);font-weight:800;font-size:21px;color:var(--text)}.logo svg{width:32px;height:32px}.tbar .back{border:0;background:var(--surface-2);width:40px;height:40px;border-radius:12px;font-size:22px;display:grid;place-items:center;color:var(--text);text-decoration:none}.tbar .ttl{font-family:var(--head);font-weight:800;font-size:18px;flex:1}.page{max-width:var(--maxw);margin:0 auto;padding:18px 16px 100px;display:flex;flex-direction:column;gap:16px}.lbl{display:block;font-size:12px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);margin-bottom:4px}.hero h1{font-size:clamp(30px,8vw,40px);line-height:1.08;margin:8px 0}.hero h1 em{font-style:normal;color:var(--brand);background:linear-gradient(transparent 62%,#ffe08a 62%)}.lockcard{display:flex;align-items:center;gap:12px;background:var(--ok-soft);border:1px solid #BFE6CE;border-radius:16px;padding:12px 14px;color:#0f5e37;font-weight:800;text-decoration:none}.lockcard .faces{display:flex}.lockcard .faces img{width:34px;height:34px;border-radius:50%;object-fit:cover;border:2px solid #fff;margin-left:-10px}.lockcard .faces img:first-child{margin-left:0}.lockcard small{display:block;font-weight:600;color:#3b7a58}.selfies{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.selfies .s{position:relative;aspect-ratio:1;border-radius:14px;overflow:hidden;background:var(--surface-2)}.selfies .s img{width:100%;height:100%;object-fit:cover}.selfies .s .x{position:absolute;right:4px;top:4px;width:24px;height:24px;border-radius:50%;border:0;background:#0000008c;color:#fff;font-size:13px;cursor:pointer}.selfies .s .ok{position:absolute;left:4px;bottom:4px;font-size:10px;font-weight:800;background:var(--ok);color:#fff;border-radius:999px;padding:2px 7px}.selfies .add{aspect-ratio:1;border-radius:14px;border:2px dashed #E3B6C6;background:#fff6f9;display:grid;place-items:center;font-size:28px;color:var(--brand);cursor:pointer}.selfies .add small{display:block;font-size:11px;font-weight:700}.tips{display:grid;grid-template-columns:1fr 1fr;gap:6px;font-size:13px;color:var(--muted)}.tips span:before{content:"✓ ";color:var(--ok);font-weight:800}.meter{height:8px;border-radius:999px;background:var(--surface-2);overflow:hidden}.meter i{display:block;height:100%;background:linear-gradient(90deg,var(--brand-2),var(--ok));transition:width .4s}.mark{position:relative;border-radius:16px;overflow:hidden;background:#111;touch-action:manipulation}.mark img{display:block;width:100%;height:auto;-webkit-user-select:none;user-select:none;-webkit-user-drag:none}.mark .box{position:absolute;border:3px solid #fff;border-radius:14px;box-shadow:0 0 0 9999px #00000073;pointer-events:none;transition:left .2s,top .2s,width .2s,height .2s}.mark .box b{position:absolute;left:50%;top:-30px;transform:translate(-50%);background:var(--brand);color:#fff;font-size:12px;padding:4px 10px;border-radius:999px;white-space:nowrap}.seg{display:flex;gap:6px;background:var(--surface-2);padding:4px;border-radius:14px}.seg button{flex:1;border:0;background:transparent;padding:10px 6px;border-radius:11px;font-weight:700;font-size:14px;color:var(--muted);cursor:pointer}.seg button.on{background:#fff;color:var(--brand);box-shadow:0 1px 4px #1018281f}.fixes{display:grid;gap:10px}.fix{background:#fff;border:1.5px solid var(--line);border-radius:16px;padding:12px 14px}.fix.on{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}.fix .top{display:flex;align-items:center;gap:10px;font-weight:800;font-size:16px;cursor:pointer}.fix .top .sw{margin-left:auto;width:44px;height:26px;border-radius:999px;background:#e3d3d9;position:relative;transition:background .2s;flex:none}.fix .top .sw:after{content:"";position:absolute;left:3px;top:3px;width:20px;height:20px;border-radius:50%;background:#fff;transition:left .2s}.fix.on .top .sw{background:var(--brand)}.fix.on .top .sw:after{left:21px}.fix .sub{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}.fix .sub button{border:1.5px solid var(--line);background:#fff;border-radius:999px;padding:6px 12px;font-weight:700;font-size:13.5px;cursor:pointer;color:var(--muted)}.fix .sub button.on{background:var(--brand);border-color:var(--brand);color:#fff}.steps{display:grid;gap:9px}.steps div{display:flex;align-items:center;gap:10px;font-weight:700;color:var(--muted);opacity:.45}.steps div.on{opacity:1;color:var(--text)}.steps div i{width:24px;height:24px;border-radius:50%;border:2px solid var(--line);display:grid;place-items:center;font-style:normal;font-size:12px;flex:none}.steps div.on i{border-color:var(--brand)}.steps div.done i{background:var(--ok);border-color:var(--ok);color:#fff}.spin{width:18px;height:18px;border:3px solid var(--brand-soft);border-top-color:var(--brand);border-radius:50%;animation:spin .8s linear infinite}.grid4{display:grid;grid-template-columns:1fr 1fr;gap:8px}.ver{position:relative;border-radius:14px;overflow:hidden;background:var(--surface-2);aspect-ratio:4/5;cursor:pointer;border:0;padding:0}.ver img{width:100%;height:100%;object-fit:cover;display:block}.ver.sel{box-shadow:0 0 0 3px var(--brand-2)}.ver .bd.cek{color:var(--muted, #666);font-weight:700;font-size:10px}.ver .bd{position:absolute;left:6px;bottom:6px;font-size:11px;font-weight:800;background:#fff;color:var(--ok);padding:3px 8px;border-radius:999px;box-shadow:0 2px 8px #00000040}.ver .n{position:absolute;left:6px;top:6px;font-size:11px;font-weight:800;background:#00000080;color:#fff;padding:2px 8px;border-radius:999px}.ver.wait{display:grid;place-items:center;color:var(--muted);font-size:12.5px;font-weight:700;text-align:center;padding:10px}.facechk{background:var(--ok-soft);border:1px solid #BFE6CE;border-radius:14px;padding:11px 14px;color:#0f5e37;font-size:14.5px}.facechk b{display:block;font-size:16px}.ba{position:relative;border-radius:16px;overflow:hidden;-webkit-user-select:none;user-select:none;touch-action:pan-y;background:#111}.ba img{display:block;width:100%;height:auto}.ba .after{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden}.ba .after img{position:absolute;left:0;top:0;height:100%;width:auto;max-width:none}.ba .line{position:absolute;top:0;bottom:0;width:3px;background:#fff;box-shadow:0 0 8px #0006}.ba .line:after{content:"⇆";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:34px;height:34px;border-radius:50%;background:#fff;display:grid;place-items:center;font-weight:800;color:var(--brand)}.ba .t{position:absolute;top:8px;font-size:11px;font-weight:800;padding:3px 9px;border-radius:999px;background:#0000008c;color:#fff}.tabs{display:flex;gap:6px;overflow-x:auto}.tabs button{flex:none;border:1.5px solid var(--line);background:#fff;border-radius:999px;padding:7px 13px;font-weight:800;font-size:13.5px;cursor:pointer;color:var(--muted)}.tabs button.on{background:var(--dark);border-color:var(--dark);color:#fff}.prev{display:flex;justify-content:center;background:var(--surface-2);border-radius:16px;padding:12px}.prev img{max-height:360px;max-width:100%;border-radius:10px;box-shadow:0 10px 24px -14px #00000080}.hist{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.hist a{position:relative;aspect-ratio:4/5;border-radius:12px;overflow:hidden;background:var(--surface-2);display:block}.hist a img{width:100%;height:100%;object-fit:cover}.hist a span{position:absolute;left:5px;bottom:5px;font-size:10.5px;font-weight:800;background:#0000008c;color:#fff;padding:2px 7px;border-radius:999px}.bigb{display:flex;align-items:center;gap:14px;background:var(--brand);color:#fff;border-radius:18px;padding:16px;font-weight:800;font-size:18px;text-decoration:none}.bigb .ic{width:46px;height:46px;border-radius:14px;background:#ffffff2e;display:grid;place-items:center;font-size:24px}.bigb small{display:block;font-size:13px;font-weight:600;color:#fad4e1}.note.ok{background:var(--ok-soft);color:#0f5e37}.fadein{animation:fadein .45s ease both}@keyframes fadein{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.wm{position:absolute;right:6px;top:6px;font-size:10px;font-weight:800;background:#ffffffd9;color:var(--brand);padding:2px 7px;border-radius:999px}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation:none!important;transition:none!important}}.hero-shot{position:relative;border-radius:22px;overflow:hidden;aspect-ratio:4/5;max-height:320px;box-shadow:0 24px 50px -30px #2a0f1e8c}.hero-shot img{width:100%;height:100%;object-fit:cover;object-position:center 30%;display:block}.hero-shot em{position:absolute;left:10px;right:10px;bottom:10px;font-style:normal;font-weight:800;font-size:14px;line-height:1.3;color:#fff;background:#1b091399;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border-radius:14px;padding:9px 12px}.gal-row{display:grid;grid-auto-flow:column;grid-auto-columns:86%;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding:2px 2px 8px;margin:0 -2px;overscroll-behavior-x:contain}.gal-card{scroll-snap-align:start;background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:10px;display:flex;flex-direction:column;gap:8px;min-width:0}.gal-main{position:relative;border:0;padding:0;border-radius:14px;overflow:hidden;aspect-ratio:4/5;background:var(--surface-2);cursor:pointer;display:block;width:100%}.gal-card.wide .gal-main{aspect-ratio:4/3}.gal-main img{width:100%;height:100%;object-fit:cover;display:block}.gal-tag{position:absolute;left:8px;top:8px;font-size:11px;font-weight:800;padding:4px 9px;border-radius:999px;background:#0000008c;color:#fff}.gal-tag.ok{background:var(--ok)}.gal-hint{position:absolute;right:8px;bottom:8px;font-size:10.5px;font-weight:700;padding:3px 8px;border-radius:999px;background:#ffffffd9;color:var(--text)}.gal-thumbs{display:grid;grid-template-columns:repeat(5,1fr);gap:5px}.gal-thumbs button{position:relative;border:2px solid transparent;padding:0;border-radius:10px;overflow:hidden;aspect-ratio:4/5;background:var(--surface-2);cursor:pointer}.gal-card.wide .gal-thumbs button,.gal-card.wide .gal-drop{aspect-ratio:4/3}.gal-thumbs button.on{border-color:var(--brand)}.gal-thumbs img{width:100%;height:100%;object-fit:cover;display:block}.gal-thumbs small{position:absolute;left:0;right:0;bottom:0;font-size:9.5px;font-weight:800;color:#fff;background:#00000073;text-align:center}.gal-drop{aspect-ratio:4/5;border-radius:10px;border:1.5px dashed var(--line);font-size:9px;font-weight:800;color:var(--muted);display:grid;place-items:center;text-align:center;padding:2px;background:#fff6f9}.gal-lbl{font-family:var(--head);font-size:16px}.gal-fx{display:flex;flex-wrap:wrap;gap:4px}.gal-fx span{font-size:11.5px;font-weight:700;background:var(--brand-soft);color:var(--brand);border-radius:999px;padding:2px 8px}.gal-foot{display:flex;align-items:center;justify-content:space-between;gap:6px;flex-wrap:wrap}.gal-keys{display:flex;align-items:center;gap:3px;font-size:11px;color:var(--muted);font-weight:700}.gal-keys img{width:24px;height:24px;border-radius:7px;object-fit:cover}.gal-ok{font-size:12px;font-weight:800;color:var(--ok)}.fitur3{display:grid;gap:10px}.fitur3>div{display:flex;gap:12px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:8px 12px 8px 8px}.fitur3 img{width:76px;height:76px;border-radius:14px;object-fit:cover;flex:none}.fitur3 b{font-family:var(--head);font-size:16px}.fitur3 p{margin:2px 0 0;font-size:13.5px;color:var(--muted);line-height:1.4}.contoh-selfie{display:flex;flex-direction:column;gap:6px;background:#fff6f9;border:1px solid var(--line);border-radius:16px;padding:10px}.cs-row{display:grid;grid-template-columns:repeat(8,1fr);gap:4px}.cs-row img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:8px;display:block}.ilus-kunci{width:100%;max-width:220px;aspect-ratio:1;object-fit:cover;border-radius:18px;align-self:center}.logo img.lg{width:30px;height:30px;border-radius:9px;display:block}.modes{display:grid;gap:8px}.modeb{display:flex;align-items:center;gap:12px;background:var(--surface);border:1.5px solid var(--line);border-radius:18px;padding:12px 14px;text-decoration:none;color:var(--text);font-weight:800;font-size:16.5px}.modeb .ic{width:44px;height:44px;border-radius:13px;background:var(--brand-soft);display:grid;place-items:center;font-size:23px;flex:none}.modeb small{display:block;font-size:13px;font-weight:600;color:var(--muted)}.modeb .ar{margin-left:auto;font-size:24px;color:var(--brand)}.modehead{display:flex;gap:12px;align-items:center;background:var(--brand-soft);border-radius:18px;padding:12px 14px}.modehead .ic{font-size:30px}.modehead b{font-family:var(--head);font-size:19px;display:block}.modehead small{display:block;font-size:13.5px;color:var(--muted);line-height:1.4}.pickb{aspect-ratio:4/3;border-radius:18px;border:2px dashed #E3B6C6;background:#fff6f9;font-size:17px;font-weight:800;color:var(--brand);cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px}.pickb small{font-weight:600;font-size:13px;color:var(--muted)}.chips{display:flex;gap:8px;flex-wrap:wrap}.chips button{border:1.5px solid var(--line);background:#fff;border-radius:999px;padding:9px 14px;font-weight:800;font-size:14.5px;cursor:pointer;color:var(--text);min-height:44px}.chips button.on{background:var(--brand);border-color:var(--brand);color:#fff}.modetag{font-weight:800;font-size:14px;background:var(--brand-soft);color:var(--brand);border-radius:999px;padding:5px 12px}.zoom{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:10px}.zrow{display:grid;grid-template-columns:1fr 1fr;gap:8px;position:relative}.zrow figure{margin:0;position:relative}.zrow img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:12px;display:block}.zrow figcaption{position:absolute;left:6px;top:6px;font-size:11px;font-weight:800;background:#0000008c;color:#fff;border-radius:999px;padding:2px 8px}.zbd{position:absolute;left:50%;bottom:8px;transform:translate(-50%);background:#fff;color:var(--ok);font-weight:800;font-size:13px;border-radius:999px;padding:5px 12px;box-shadow:0 2px 10px #00000040;white-space:nowrap;text-align:center}.zbd.cek{color:var(--muted)}.zbd small{display:block;font-size:10px;color:var(--muted);font-weight:700}.lockcard.off{background:var(--surface-2);border-color:var(--line);color:var(--text)}.lockcard.off small{color:var(--muted)}.lockcard .ic{font-size:24px}.prem{align-self:flex-start;font-size:13px;font-weight:800;color:#7a4a00;background:#fff1cc;border:1px solid #F3D58A;border-radius:999px;padding:4px 11px}
