:root{--biru-utama:#0F6FD4;--biru-tua:#0B4FA0;--biru-muda:#E8F1FF;--biru-sangat:#F5F9FF;--teks:#19364F;--teks-2:#6B7F92;--garis:#EAF0F6;--latar:#F6F8FB;--putih:#FFF;--hijau:#12B76A;--kuning:#F7B500;--merah:#F04438;--radius:16px;--shadow:0 2px 10px rgba(16,64,128,.06);--line:var(--garis);--bg:var(--latar);--ink:var(--teks);--muted:var(--teks-2);--ok:var(--hijau);--ok-bg:#EAFBF1;--warn:#A46F00;--warn-bg:#FFF6D9;--bad:var(--merah);--bad-bg:#FFF0EF;--info:var(--biru-utama);--info-bg:var(--biru-muda);--emas:var(--kuning)}*{box-sizing:border-box;margin:0;padding:0}html{background:#eaf0f5}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--latar);color:var(--teks);-webkit-font-smoothing:antialiased}button,input,select,textarea{font:inherit;color:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:active,a:active,.kartu-advokat:active,.promo-card:active{transform:scale(.97)}h1{font-size:22px;line-height:1.2;letter-spacing:-.45px}h2{font-size:16px;line-height:1.25}.overline{font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--teks-2);font-weight:750}.muted{font-size:13px;line-height:1.5;color:var(--teks-2)}.err{font-size:12px;color:var(--merah);font-weight:650}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 17px;border:0;border-radius:14px;background:var(--biru-utama);color:#fff;text-decoration:none;font-weight:750;font-size:14px;transition:.15s}.btn.ghost{background:#fff;color:var(--biru-utama);border:1px solid var(--biru-muda)}.btn.full{width:100%}.field{display:flex;flex-direction:column;gap:6px;margin-bottom:13px}.field label{font-size:12.5px;font-weight:700}.field input,.field select,.field textarea{width:100%;min-height:46px;border:1px solid var(--garis);border-radius:13px;background:#fff;padding:0 13px}.field textarea{padding:12px;min-height:90px}.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--biru-muda);border-color:var(--biru-utama)}.chip{min-height:36px;padding:0 12px;border:1px solid var(--garis);border-radius:99px;background:#fff;color:var(--teks-2);font-size:12px}.chip.aktif{background:var(--biru-utama);border-color:var(--biru-utama);color:#fff}.chips{display:flex;gap:7px;flex-wrap:wrap}.tag,.status{display:inline-flex;padding:4px 8px;border-radius:8px;font-size:10.5px;font-weight:800;text-transform:capitalize}.tag.ok,.status.selesai{background:#eafbf1;color:var(--hijau)}.tag.warn{background:#fff6d9;color:#9a6b00}.tag.bad,.status.dibatalkan{background:#fff0ef;color:var(--merah)}.tag.info,.status.aktif{background:var(--biru-muda);color:var(--biru-utama)}.app-frame{width:100%;max-width:480px;min-height:100dvh;margin:0 auto;background:var(--latar);position:relative;box-shadow:0 0 30px #19364f14;padding-bottom:calc(72px + env(safe-area-inset-bottom))}.app-frame.admin-frame,.app-frame.tanpa-nav{max-width:none;padding-bottom:0;box-shadow:none}.screen{min-height:100dvh;padding:calc(14px + env(safe-area-inset-top)) 14px 24px}.screen-header{min-height:56px;display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;background:var(--latar)}.screen-header h1{margin-top:2px}.screen-enter-active,.screen-leave-active{transition:opacity .18s ease,transform .18s ease}.screen-enter-from{opacity:0;transform:translate(8px)}.screen-leave-to{opacity:0;transform:translate(-6px)}.bottom-nav{position:fixed;z-index:35;left:50%;bottom:0;transform:translate(-50%);width:min(100%,480px);height:calc(62px + env(safe-area-inset-bottom));padding:0 6px env(safe-area-inset-bottom);background:#fff;border-top:1px solid var(--garis);display:grid;grid-template-columns:repeat(5,1fr);align-items:center}.bottom-nav>a{height:62px;color:var(--teks-2);text-decoration:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:10px;transition:.15s}.bottom-nav>a.aktif{color:var(--biru-utama);font-weight:800}.bottom-nav .nav-chat{color:var(--biru-utama);position:relative}.nav-chat>span{width:56px;height:56px;margin-top:-28px;border-radius:50%;background:linear-gradient(135deg,var(--biru-utama),var(--biru-tua));color:#fff;display:grid;place-items:center;border:4px solid #fff;box-shadow:0 8px 20px #0f6fd459}.nav-chat small{font-size:10px;font-weight:800;margin-top:1px}.home-screen{padding-top:calc(10px + env(safe-area-inset-top))}.home-header{height:56px;display:flex;align-items:center;gap:9px}.avatar{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;flex:0 0 auto;background:var(--biru-muda);color:var(--biru-utama);font-weight:800;font-size:14px}.avatar.kecil{width:40px;height:40px}.avatar.besar{width:66px;height:66px;font-size:20px}.home-name{display:flex;flex-direction:column;min-width:0}.home-name small{font-size:10.5px;color:var(--teks-2)}.home-name strong{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.home-name strong span{color:var(--biru-utama)}.location-button{margin-left:auto;min-height:44px;max-width:110px;border:0;background:none;color:var(--biru-utama);display:flex;align-items:center;gap:3px;font-weight:700;font-size:12px}.location-button span{overflow:hidden;text-overflow:ellipsis}.login-callout{background:var(--biru-sangat);border:1px solid var(--biru-muda);border-radius:16px;padding:13px;margin:8px 0 12px}.login-callout>div:first-child strong{font-size:13px}.login-callout p{font-size:11.5px;color:var(--teks-2);margin-top:3px}.login-callout>div:last-child{display:flex;gap:8px;margin-top:10px}.kecil-btn{min-height:38px;padding:0 14px;font-size:12px}.quick-cards{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:8px 0 18px}.quick-card{min-height:76px;padding:11px;display:flex;align-items:center;gap:8px;border:1px solid var(--garis);border-radius:16px;background:var(--biru-sangat);text-decoration:none;color:var(--teks);box-shadow:var(--shadow)}.quick-card>span:nth-child(2){min-width:0;display:flex;flex:1;flex-direction:column}.quick-card small{font-size:10.5px;color:var(--teks-2)}.quick-card strong{font-size:13px;line-height:1.2;margin-top:3px}.quick-card>b{font-size:22px;color:var(--biru-utama)}.round-icon{width:38px;height:38px;border-radius:50%;background:var(--biru-muda);color:var(--biru-utama);display:grid;place-items:center;flex:0 0 auto}.round-icon.jingga{background:#fff3e6}.round-icon.mini{width:36px;height:36px}.app-section{margin:0 0 22px}.section-heading{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:11px}.section-heading p{font-size:11px;color:var(--teks-2);margin-top:3px}.section-heading>a{font-size:11.5px;color:var(--biru-utama);font-weight:700;text-decoration:none}.menu-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px 7px}.menu-item,.category-item{border:0;background:none;text-decoration:none;color:var(--teks-2);display:flex;flex-direction:column;align-items:center;gap:7px;text-align:center;font-size:10.5px;line-height:1.25}.menu-icon{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;color:var(--biru-tua)}.pastel-0{background:#e8f1ff}.pastel-1{background:#fff3e6}.pastel-2{background:#eafbf1}.pastel-3{background:#f3ecff}.pastel-4{background:#ffeef0}.pastel-5{background:#e9f7fe}.pastel-6{background:#fff6d9}.pastel-7{background:#fcebdd}.pastel-8{background:#eef1f5}.category-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px 8px}.category-grid .menu-icon{width:56px;height:56px}.category-grid .menu-icon svg{width:32px;height:32px}.category-item.aktif .menu-icon{box-shadow:0 0 0 2px var(--biru-utama)}.category-item{font-size:11px;color:var(--teks)}.home-categories .category-item:nth-child(n+7){display:none}.edge-section{margin-left:-14px;margin-right:-14px}.edge-section .section-heading{padding:0 14px}.promo-row{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 14px 6px;scrollbar-width:none}.promo-card{width:260px;height:120px;flex:0 0 auto;scroll-snap-align:start;border-radius:16px;padding:15px;color:#fff;display:flex;flex-direction:column;justify-content:space-between;box-shadow:var(--shadow);transition:.15s}.promo-card.biru{background:linear-gradient(135deg,#0f6fd4,#5aa8f4)}.promo-card.ungu{background:linear-gradient(135deg,#7255bd,#9b83dc)}.promo-card.hijau{background:linear-gradient(135deg,#078a66,#43c69b)}.promo-card.jingga{background:linear-gradient(135deg,#d66c28,#f2a45b)}.promo-card strong{display:block;width:82%;font-size:15px}.promo-card p{font-size:11px;margin-top:5px;opacity:.9;max-width:90%}.promo-card button{align-self:flex-start;min-height:28px;padding:0 12px;border:0;border-radius:99px;background:#fff;color:var(--biru-tua);font-size:10.5px;font-weight:800}.advokat-list{background:#fff;border:1px solid var(--garis);border-radius:16px;overflow:hidden;box-shadow:var(--shadow)}.kartu-advokat{position:relative;padding:13px;display:grid;grid-template-columns:1fr auto;gap:6px 8px;border-bottom:1px solid var(--garis);background:#fff;transition:.15s}.kartu-advokat:last-child{border-bottom:0}.kartu-advokat .kepala{display:flex;gap:10px;grid-column:1/3}.nama-baris strong{font-size:13px}.badge-verif{display:inline-flex;color:var(--hijau);font-size:10px;font-weight:800;margin-top:2px}.law-field{font-size:11px;color:var(--teks-2);margin-top:3px}.kartu-advokat .meta{font-size:11.5px;color:var(--teks-2)}.rating{font-size:11.5px;font-weight:700}.rating .bintang{color:var(--kuning)}.harga{color:var(--teks);font-weight:800}.card-actions{grid-column:2;grid-row:2/4;display:flex;align-items:center;gap:8px}.profile-link{font-size:11px;color:var(--biru-utama);text-decoration:none;font-weight:700}.chat-btn{min-height:34px;padding:0 14px;border-radius:10px;font-size:11.5px}.article-list,.list-card{background:#fff;border:1px solid var(--garis);border-radius:16px;overflow:hidden;box-shadow:var(--shadow)}.list-row{width:100%;min-height:58px;padding:10px 13px;display:flex;align-items:center;gap:10px;border:0;border-bottom:1px solid var(--garis);background:#fff;text-decoration:none;color:var(--teks);text-align:left}.list-row:last-child{border-bottom:0}.list-row>div{min-width:0;flex:1}.list-row strong{font-size:12.5px}.list-row p{font-size:10.8px;color:var(--teks-2);margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.list-row>b{margin-left:auto;color:var(--biru-utama)}.platform-note{font-size:10.5px;line-height:1.5;text-align:center;color:var(--teks-2);padding:8px 18px 18px}.search-pill{height:46px;border:1px solid var(--garis);border-radius:99px;background:#fff;display:flex;align-items:center;gap:9px;padding:0 14px;margin-bottom:20px;color:var(--teks-2)}.search-pill input{border:0;outline:0;min-width:0;flex:1;font-size:13px;background:none}.sort-select{height:34px;border:1px solid var(--garis);border-radius:99px;background:#fff;padding:0 8px;font-size:11px}.filter-fab{position:fixed;z-index:20;bottom:calc(86px + env(safe-area-inset-bottom));right:max(14px,calc(50% - 226px));min-height:44px;padding:0 16px;border:0;border-radius:99px;background:var(--biru-utama);color:#fff;display:flex;align-items:center;gap:6px;box-shadow:0 8px 20px #0f6fd44d;font-weight:700}.filter-fab:active{transform:scale(.97)}.filter-fab b{background:#fff;color:var(--biru-utama);border-radius:50%;width:18px;height:18px;display:grid;place-items:center;font-size:10px}.sheet-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;background:#19364f59}.sheet{position:fixed;z-index:51;left:50%;bottom:0;transform:translate(-50%);width:min(100%,480px);max-height:88dvh;background:#fff;border-radius:22px 22px 0 0;display:flex;flex-direction:column}.sheet-handle{width:46px;height:5px;border-radius:99px;background:#d4dee7;margin:9px auto}.sheet-head{padding:0 16px 10px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--garis)}.sheet-head h2{font-size:17px}.sheet-close{min-width:44px;min-height:44px;border:0;background:none}.sheet-body{padding:14px 16px;overflow:auto}.sheet-foot{display:flex;gap:9px;padding:11px 16px calc(11px + env(safe-area-inset-bottom));border-top:1px solid var(--garis)}.sheet-foot .btn{flex:1}.icon-button{width:44px;height:44px;border:0;background:transparent;color:var(--biru-utama);display:grid;place-items:center;border-radius:50%}.tab-row{display:flex;gap:7px;overflow:auto;margin-bottom:12px}.tab-row button{min-height:38px;padding:0 15px;border-radius:99px;border:1px solid var(--garis);background:#fff;color:var(--teks-2);font-size:12px;font-weight:700}.tab-row button.aktif{background:var(--biru-utama);border-color:var(--biru-utama);color:#fff}.empty-state{text-align:center;padding:70px 24px}.empty-icon{width:64px;height:64px;border-radius:50%;background:var(--biru-muda);color:var(--biru-utama);display:grid;place-items:center;margin:0 auto 14px}.empty-state h2{font-size:16px}.empty-state p{font-size:12.5px;line-height:1.5;color:var(--teks-2);margin:7px 0 16px}.chat-list .list-row aside{margin-left:auto;text-align:right}.chat-list time{font-size:9.5px;color:var(--teks-2)}.chat-list aside b{display:grid;place-items:center;width:18px;height:18px;margin:5px 0 0 auto;border-radius:50%;background:var(--biru-utama);color:#fff;font-size:9px}.history-row{padding:13px;display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--garis)}.history-row:last-child{border:0}.history-main{min-width:0;flex:1}.history-main>div{display:flex;align-items:center;gap:6px}.history-main strong{font-size:12.5px}.history-main p{font-size:10.5px;color:var(--teks-2);margin:3px 0}.history-main>b{font-size:11.5px}.mini-button{min-height:36px;padding:0 10px;font-size:10.5px}.chat-room{height:100dvh;display:flex;flex-direction:column;background:#f3f7fb}.chat-header{padding:env(safe-area-inset-top) 10px 0;height:calc(58px + env(safe-area-inset-top));display:flex;align-items:center;gap:8px;background:#fff;border-bottom:1px solid var(--garis);flex:0 0 auto}.chat-header>a{width:32px;text-align:center;text-decoration:none;color:var(--teks);font-size:30px}.chat-header>div{flex:1}.chat-header strong{display:block;font-size:13px}.chat-header small{font-size:10px;color:var(--hijau)}.chat-header small i{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--hijau)}.messages{flex:1;overflow:auto;padding:16px 14px}.day-label{text-align:center;color:var(--teks-2);font-size:10px;margin-bottom:15px}.bubble{max-width:80%;width:max-content;margin:0 auto 10px 0;padding:10px 11px 6px;border:1px solid var(--garis);border-radius:16px 16px 16px 4px;background:#fff;font-size:12.5px;line-height:1.45}.bubble.mine{margin-left:auto;margin-right:0;background:var(--biru-utama);border-color:var(--biru-utama);color:#fff;border-radius:16px 16px 4px}.bubble time{display:block;font-size:8.5px;text-align:right;opacity:.72;margin-top:4px}.chat-composer{padding:9px 10px calc(9px + env(safe-area-inset-bottom));display:flex;align-items:center;gap:6px;background:#fff;border-top:1px solid var(--garis)}.chat-composer>button{width:44px;height:44px;border:0;border-radius:50%;display:grid;place-items:center;background:none;color:var(--biru-utama)}.chat-composer input{height:44px;min-width:0;flex:1;border:1px solid var(--garis);border-radius:99px;padding:0 14px;background:#fff}.chat-composer .send-button{background:var(--biru-utama);color:#fff}.identity-card{display:flex;align-items:center;gap:14px;padding:16px;margin-bottom:14px;background:linear-gradient(135deg,var(--biru-sangat),#fff);border:1px solid var(--garis);border-radius:16px}.identity-card h2{font-size:17px}.identity-card p,.identity-card span{display:flex;align-items:center;gap:3px;font-size:11.5px;color:var(--teks-2);margin-top:4px}.profile-menu .list-row>b{font-size:12px}.privacy-card{margin:0 14px 16px;padding:13px;background:var(--biru-sangat);border:1px solid var(--biru-muda);border-radius:16px;display:flex;gap:10px}.privacy-card strong{font-size:13px}.privacy-card p{font-size:11px;color:var(--teks-2);line-height:1.5;margin:5px 0}.text-button{min-height:36px;border:0;background:none;color:var(--biru-utama);font-size:11px;font-weight:750;margin-right:10px}.text-button.danger{color:var(--merah)}.logout-button{width:calc(100% - 28px);min-height:48px;margin:0 14px 16px;border:1px solid #FFD8D5;border-radius:14px;background:#fff;color:var(--merah);font-weight:750}.auth-screen{min-height:100dvh;background:#fff;padding-bottom:90px}.focus-header{padding:env(safe-area-inset-top) 14px 0;min-height:calc(56px + env(safe-area-inset-top));display:flex;align-items:center;justify-content:space-between;background:#fff;border-bottom:1px solid var(--garis)}.focus-header>a{width:44px;height:44px;display:grid;place-items:center;color:var(--teks);font-size:30px;text-decoration:none}.focus-header>span{width:44px}.focus-header strong{font-size:14px}.auth-body{max-width:420px;margin:0 auto;padding:30px 20px}.brand-mark{width:54px;height:54px;border-radius:16px;background:linear-gradient(135deg,var(--biru-utama),var(--biru-tua));color:#fff;display:grid;place-items:center;font-weight:900;margin-bottom:18px}.auth-body h1{margin:4px 0 8px}.auth-form{margin-top:24px}.auth-switch{text-align:center;font-size:12px;color:var(--teks-2);margin-top:15px}.auth-switch a,.portal-links button{color:var(--biru-utama);font-weight:700}.portal-links{border-top:1px solid var(--garis);margin-top:28px;padding-top:14px;display:flex;flex-direction:column}.portal-links button{min-height:44px;border:0;background:none}.divider{text-align:center;color:var(--teks-2);font-size:10px;margin:-4px 0 9px}.steps{display:flex;gap:5px;margin:8px 0 20px}.steps i{height:4px;flex:1;border-radius:99px;background:var(--garis)}.steps i.aktif{background:var(--biru-utama)}.sticky-action{position:fixed;z-index:25;bottom:0;left:50%;transform:translate(-50%);width:min(100%,560px);display:flex;gap:9px;padding:10px 14px calc(10px + env(safe-area-inset-bottom));background:#fff;border-top:1px solid var(--garis)}.sticky-action .btn{flex:1}.wrap{max-width:560px;margin:0 auto;padding:14px}.kartu{background:#fff;border:1px solid var(--garis);border-radius:16px;box-shadow:var(--shadow);padding:13px}.baris{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--garis)}.grid-stat{display:grid;grid-template-columns:1fr 1fr;gap:10px}.stat .nilai{font-size:24px;font-weight:800}.steps .step{height:4px;flex:1;background:var(--garis);border-radius:99px}.steps .step.aktif,.steps .step.selesai{background:var(--biru-utama)}.progress-bar{height:8px;background:var(--garis);border-radius:99px;overflow:hidden}.progress-bar .isi{height:100%;background:var(--biru-utama)}.switch{position:relative;width:42px;height:24px}.switch input{opacity:0}.switch .rel{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:99px;background:var(--garis)}.admin-shell{display:flex;min-height:100vh}.admin-sidebar{width:230px;background:#fff;border-right:1px solid var(--garis);padding:16px 10px}.admin-sidebar a{display:block;padding:10px;border-radius:10px;text-decoration:none;color:var(--teks)}.admin-sidebar a.router-link-active{background:var(--biru-utama);color:#fff}.admin-main{flex:1;min-width:0}.admin-topbar{height:58px;padding:0 16px;display:flex;align-items:center;justify-content:space-between;background:#fff;border-bottom:1px solid var(--garis)}.admin-content{padding:16px;max-width:1100px}.admin-mobile-nav{display:none}.tabel{width:100%;border-collapse:collapse}.tabel th,.tabel td{text-align:left;padding:10px;border-bottom:1px solid var(--garis);font-size:12px}.tabel-scroll{overflow:auto}.dropdown{position:relative}.dropdown-menu{position:absolute;right:0;background:#fff;border:1px solid var(--garis);border-radius:12px;padding:6px;z-index:5}.nav-avatar{width:38px;height:38px;border-radius:50%;border:0;background:var(--biru-utama);color:#fff}.footer,.nav{display:none}@media(max-width:899px){.admin-sidebar{display:none}.admin-mobile-nav{display:flex;overflow:auto;gap:6px;padding:8px;background:#fff}.admin-mobile-nav a{white-space:nowrap;text-decoration:none;padding:7px 10px;border:1px solid var(--garis);border-radius:99px;color:var(--teks);font-size:11px}.admin-mobile-nav a.router-link-active{background:var(--biru-utama);color:#fff}}@media(min-width:600px){body{padding:18px 0}.app-frame{min-height:calc(100dvh - 36px);border-radius:24px;overflow:hidden}.bottom-nav{bottom:18px;border-radius:0 0 24px 24px}.filter-fab{bottom:104px}.app-frame.admin-frame,.app-frame.tanpa-nav{border-radius:0;overflow:visible;min-height:100dvh;margin-top:-18px}}.hint{font-size:10.5px;color:var(--teks-2)}.disclaimer{padding:12px;border-radius:14px;background:var(--biru-sangat);color:var(--teks-2);font-size:11px;line-height:1.5}.kosong{text-align:center;padding:60px 20px}.meta{display:flex;align-items:center}.advokat-wizard{min-height:100dvh;padding-bottom:88px}.advokat-wizard>.kartu{max-height:calc(100dvh - 180px);overflow:auto}@media(prefers-reduced-motion:reduce){*{transition:none!important}}