:root{--navy:#1e3a8a;--navy-dark:#142a66;--navy-50:#eef2fb;--orange:#f97316;--orange-50:#fff3e8;--gray-900:#111827;--gray-700:#374151;--gray-500:#6b7280;--gray-400:#9ca3af;--gray-300:#d1d5db;--gray-200:#e5e7eb;--gray-100:#f3f4f6;--white:#fff;--success:#16a34a;--success-50:#dcfce7;--warning:#f59e0b;--warning-50:#fef3c7;--danger:#dc2626;--danger-50:#fee2e2;--info-50:#dbeafe;--shadow-sm:0 1px 2px #1118270a;--shadow-md:0 4px 12px #1118270f;--shadow-lg:0 12px 24px #11182714;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:20px}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%;color:var(--gray-900);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#e5e7eb;margin:0;padding:0;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif}button{cursor:pointer;color:inherit;background:0 0;border:none;padding:0;font-family:inherit}input,textarea,select{color:var(--gray-900);font-family:inherit;font-size:15px}a{color:inherit;text-decoration:none}.app-shell{background:radial-gradient(circle at 20% 10%,#f973162e 0%,#0000 35%),radial-gradient(circle at 80% 90%,#1e3a8a33 0%,#0000 40%),linear-gradient(135deg,#e0e7ff 0%,#f3f4f6 60%,#ffe4d0 100%);justify-content:center;align-items:stretch;min-height:100%;padding:24px 16px;display:flex}.iphone-wrap{flex-shrink:0;width:421px;margin:auto;position:relative}.iphone-body{background:linear-gradient(145deg,#6b7280 0%,#1f2937 22%,#111827 50%,#1f2937 78%,#6b7280 100%);border-radius:60px;padding:14px;position:relative;box-shadow:inset 0 0 0 1.5px #ffffff38,inset 0 0 0 2.5px #0006,0 30px 60px -10px #0f172a73,0 18px 30px -15px #0f172a4d}.phone-frame{background:var(--white);border-radius:50px;flex-direction:column;width:393px;height:852px;display:flex;position:relative;overflow:hidden}.dynamic-island{z-index:100;pointer-events:none;background:#000;border-radius:999px;width:124px;height:36px;position:absolute;top:12px;left:50%;transform:translate(-50%);box-shadow:inset 0 0 0 1px #1a1a1a}.status-bar{z-index:90;pointer-events:none;background:0 0;justify-content:space-between;align-items:center;padding:16px 30px 6px;display:flex;position:absolute;top:0;left:0;right:0}.status-bar .time{letter-spacing:-.01em;color:var(--status-fg,var(--gray-900));font-size:15px;font-weight:700}.status-bar .status-icons{color:var(--status-fg,var(--gray-900));align-items:center;gap:6px;display:flex}.phone-content{--status-fg:var(--gray-900);flex-direction:column;flex:1;min-height:0;display:flex;position:relative;overflow:hidden}:is(.phone-content:has(.splash),.phone-content:has(>div>.screen>.top-header.brand:first-child),.phone-content:has(>.screen>.top-header.brand:first-child)){--status-fg:#fff}.phone-content>.screen,.phone-content>div>.screen,.phone-content .splash{flex:1;height:auto;min-height:0}.iphone-side{z-index:0;flex-direction:column;gap:14px;width:3px;display:flex;position:absolute;top:0;bottom:0}.iphone-side-left{align-items:flex-end;left:-3px}.iphone-side-right{align-items:flex-start;right:-3px}.iphone-side .btn-silent,.iphone-side .btn-vol,.iphone-side .btn-power{background:linear-gradient(90deg,#4b5563 0%,#1f2937 100%);border-radius:2px;display:block;box-shadow:inset 0 0 0 .5px #00000080}.iphone-side-right .btn-silent,.iphone-side-right .btn-vol,.iphone-side-right .btn-power{background:linear-gradient(270deg,#4b5563 0%,#1f2937 100%)}.iphone-side .btn-silent{width:3px;height:30px;margin-top:130px}.iphone-side .btn-vol{width:3px;height:50px}.iphone-side .btn-vol.up{margin-top:14px}.iphone-side .btn-power{width:3px;height:86px;margin-top:180px}@media (width<=480px){.app-shell{background:var(--white);padding:0}.iphone-wrap{max-width:100%}.iphone-body{box-shadow:none;background:0 0;border-radius:0;padding:0}.phone-frame{border-radius:0;height:100vh;max-height:100vh}.dynamic-island,.status-bar,.iphone-side{display:none}}.screen{background:var(--gray-100);flex-direction:column;flex:1;min-height:0;padding-bottom:88px;display:flex;overflow-y:auto}.screen.no-tab{padding-bottom:16px}.screen.plain{background:var(--white)}.top-header{z-index:10;background:var(--white);border-bottom:1px solid var(--gray-200);flex-shrink:0;align-items:center;gap:12px;padding:54px 20px 14px;display:flex;position:sticky;top:0}.top-header h1{letter-spacing:-.01em;color:var(--gray-900);flex:1;margin:0;font-size:17px;font-weight:700}.top-header .back-btn{width:36px;height:36px;color:var(--gray-700);border-radius:10px;justify-content:center;align-items:center;display:flex}.top-header .back-btn:active{background:var(--gray-100)}.top-header .right-action{color:var(--navy);font-size:14px;font-weight:600}.top-header.brand{background:var(--navy);color:var(--white);border-bottom:none;padding:58px 20px 22px}.top-header.brand h1,.top-header.brand .back-btn,.top-header.brand .right-action{color:var(--white)}.bottom-nav{background:var(--white);border-top:1px solid var(--gray-200);z-index:20;padding:8px 8px 14px;display:flex;position:absolute;bottom:0;left:0;right:0}.bottom-nav .tab{color:var(--gray-500);border-radius:12px;flex-direction:column;flex:1;align-items:center;gap:4px;padding:8px 4px;font-size:11px;font-weight:500;display:flex}.bottom-nav .tab.active{color:var(--navy)}.bottom-nav .tab .icon-wrap{justify-content:center;align-items:center;width:28px;height:28px;display:flex}.bottom-nav .tab.active .icon-wrap{background:var(--navy-50);border-radius:10px}.btn{letter-spacing:-.01em;border-radius:12px;justify-content:center;align-items:center;gap:8px;padding:14px 18px;font-size:15px;font-weight:600;transition:opacity .15s,transform 50ms;display:inline-flex}.btn:active{transform:scale(.98)}.btn-primary{background:var(--navy);color:var(--white)}.btn-primary:disabled{background:var(--gray-300);color:var(--gray-500)}.btn-accent{background:var(--orange);color:var(--white)}.btn-outline{border:1.5px solid var(--gray-300);color:var(--gray-900);background:0 0}.btn-ghost{background:var(--navy-50);color:var(--navy)}.btn-danger{background:var(--danger-50);color:var(--danger)}.btn-success{background:var(--success);color:var(--white)}.btn-block{width:100%;display:flex}.card{background:var(--white);border-radius:var(--radius-lg);border:1px solid var(--gray-200);box-shadow:var(--shadow-sm);padding:16px}.list-card{background:var(--white);border-radius:var(--radius-lg);border:1px solid var(--gray-200);align-items:center;gap:12px;padding:14px;display:flex}.section-title{color:var(--gray-500);text-transform:uppercase;letter-spacing:.04em;margin:20px 20px 8px;font-size:13px;font-weight:600}.content{flex-direction:column;gap:12px;padding:16px 20px;display:flex}.muted{color:var(--gray-500);font-size:13px}.field{flex-direction:column;gap:6px;display:flex}.field label{color:var(--gray-700);font-size:13px;font-weight:600}.field input,.field select,.field textarea{border:1.5px solid var(--gray-200);background:var(--white);border-radius:12px;outline:none;padding:14px;transition:border-color .15s}.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--navy)}.field textarea{resize:vertical;min-height:80px}.field .helper{color:var(--gray-500);font-size:12px}.pill{border-radius:999px;align-items:center;gap:6px;padding:4px 10px;font-size:12px;font-weight:600;display:inline-flex}.pill-warning{background:var(--warning-50);color:#92400e}.pill-success{background:var(--success-50);color:#166534}.pill-danger{background:var(--danger-50);color:var(--danger)}.pill-info{background:var(--info-50);color:var(--navy)}.pill-gray{background:var(--gray-100);color:var(--gray-700)}.pill-orange{background:var(--orange-50);color:var(--orange)}.thumb{width:56px;height:56px;color:var(--navy);background:linear-gradient(135deg,#dbeafe 0%,#eef2fb 100%);border-radius:12px;flex-shrink:0;justify-content:center;align-items:center;font-weight:700;display:flex}.thumb.orange{color:var(--orange);background:linear-gradient(135deg,#ffedd5 0%,#fed7aa 100%)}.thumb.gray{background:var(--gray-100);color:var(--gray-500)}.divider{background:var(--gray-200);height:1px;margin:12px 0}.stat-grid{grid-template-columns:1fr 1fr;gap:12px;display:grid}.stat-card{background:var(--white);border:1px solid var(--gray-200);border-radius:14px;padding:14px}.stat-card .label{color:var(--gray-500);font-size:12px;font-weight:500}.stat-card .value{letter-spacing:-.02em;margin-top:6px;font-size:20px;font-weight:700}.stat-card .trend{align-items:center;gap:2px;margin-top:4px;font-size:11px;display:flex}.stat-card .trend.up{color:var(--success)}.stat-card .trend.down{color:var(--danger)}.hero-card{background:linear-gradient(135deg, var(--navy) 0%, #2945a8 100%);color:var(--white);border-radius:18px;padding:18px;position:relative;overflow:hidden}.hero-card:after{content:"";background:#f973162e;border-radius:50%;width:180px;height:180px;position:absolute;top:-60px;right:-60px}.hero-card .label{opacity:.85;z-index:1;font-size:13px;position:relative}.hero-card .amount{letter-spacing:-.02em;z-index:1;margin-top:4px;font-size:28px;font-weight:800;position:relative}.hero-card .row{z-index:1;justify-content:space-between;align-items:center;display:flex;position:relative}.switch{background:var(--gray-300);cursor:pointer;border-radius:999px;flex-shrink:0;width:44px;height:26px;transition:background .2s;position:relative}.switch.on{background:var(--success)}.switch:after{content:"";background:var(--white);border-radius:50%;width:20px;height:20px;transition:left .2s;position:absolute;top:3px;left:3px;box-shadow:0 2px 4px #00000026}.switch.on:after{left:21px}.tab-row{background:var(--white);border-bottom:1px solid var(--gray-200);flex-shrink:0;gap:6px;padding:12px 20px 14px;display:flex;overflow-x:auto}.tab-row .chip{flex-shrink:0}.tab-row::-webkit-scrollbar{display:none}.tab-row .chip{color:var(--gray-500);background:var(--gray-100);white-space:nowrap;border:none;border-radius:999px;padding:8px 14px;font-size:13px;font-weight:600}.tab-row .chip.active{background:var(--navy);color:var(--white)}.otp-row{justify-content:space-between;gap:10px;display:flex}.otp-input{border:1.5px solid var(--gray-200);text-align:center;background:var(--white);border-radius:14px;outline:none;width:52px;height:60px;font-size:22px;font-weight:700}.otp-input:focus{border-color:var(--navy)}.stepper{flex-direction:column;gap:0;display:flex}.step-row{gap:14px;padding-bottom:18px;display:flex;position:relative}.step-row:not(:last-child):before{content:"";background:var(--gray-200);width:2px;height:calc(100% - 22px);position:absolute;top:28px;left:13px}.step-row.done:not(:last-child):before{background:var(--success)}.step-dot{background:var(--gray-200);width:28px;height:28px;color:var(--gray-500);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:13px;font-weight:700;display:flex}.step-row.done .step-dot{background:var(--success);color:var(--white)}.step-row.active .step-dot{background:var(--orange);color:var(--white)}.step-body .title{font-size:14px;font-weight:600}.step-body .meta{color:var(--gray-500);margin-top:2px;font-size:12px}.bar-chart{align-items:flex-end;gap:10px;height:140px;padding:12px 0 0;display:flex}.bar-chart .bar{background:linear-gradient(180deg, var(--orange) 0%, #fb923c 100%);border-radius:6px 6px 0 0;flex:1;min-height:8px}.bar-chart .bar.muted{background:linear-gradient(180deg, var(--navy) 0%, #3b56b8 100%)}.bar-labels{gap:10px;margin-top:6px;display:flex}.bar-labels span{text-align:center;color:var(--gray-500);flex:1;font-size:11px}.splash{background:linear-gradient(160deg, var(--navy) 0%, #2945a8 60%, var(--orange) 140%);color:var(--white);text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:12px;padding:70px 32px 32px;display:flex;position:relative}.splash .logo{background:#ffffff26;border:1px solid #fff3;border-radius:28px;justify-content:center;align-items:center;width:96px;height:96px;margin-bottom:18px;display:flex}.splash h1{letter-spacing:-.02em;margin:0;font-size:28px;font-weight:800}.splash p{opacity:.85;max-width:280px;margin:0}.splash .actions{flex-direction:column;gap:10px;width:100%;max-width:320px;margin-top:28px;display:flex}.splash .btn-primary{background:var(--orange)}.splash .btn-outline{color:var(--white);border-color:#fff6}.doc-upload{background:var(--white);border:1.5px dashed var(--gray-300);border-radius:12px;justify-content:space-between;align-items:center;padding:14px;display:flex}.doc-upload.uploaded{border-style:solid;border-color:var(--success);background:var(--success-50)}.doc-upload .meta{align-items:center;gap:10px;display:flex}.doc-upload .info{flex-direction:column;display:flex}.doc-upload .info b{font-size:14px}.doc-upload .info span{color:var(--gray-500);font-size:12px}.approval{background:linear-gradient(135deg, var(--navy) 0%, #2945a8 100%);color:var(--white);text-align:center;border-radius:18px;padding:20px}.approval.success{background:linear-gradient(135deg, #15803d 0%, var(--success) 100%)}.approval.rejected{background:linear-gradient(135deg, #b91c1c 0%, var(--danger) 100%)}.approval.review{background:linear-gradient(135deg, #b45309 0%, var(--warning) 100%)}.approval .icon-circle{background:#fff3;border-radius:50%;justify-content:center;align-items:center;width:64px;height:64px;margin:0 auto 12px;display:flex}.approval h2{margin:0 0 6px;font-size:20px}.approval p{opacity:.9;margin:0;font-size:13px}.empty{text-align:center;color:var(--gray-500);padding:48px 24px}.empty .icon{background:var(--gray-100);border-radius:50%;justify-content:center;align-items:center;width:64px;height:64px;margin:0 auto 12px;display:flex}.amount-strip{background:var(--orange-50);border-radius:12px;justify-content:space-between;align-items:center;padding:12px 14px;display:flex}.amount-strip .label{color:var(--gray-700);font-size:12px}.amount-strip .value{color:var(--orange);font-size:18px;font-weight:700}.kv{justify-content:space-between;align-items:center;padding:10px 0;font-size:14px;display:flex}.kv .k{color:var(--gray-500)}.kv .v{color:var(--gray-900);font-weight:600}.bottom-action{background:var(--white);border-top:1px solid var(--gray-200);padding:14px 16px calc(14px + env(safe-area-inset-bottom));flex-shrink:0;gap:10px;display:flex;position:sticky;bottom:0}.search-bar{background:var(--white);border:1.5px solid var(--gray-200);border-radius:12px;align-items:center;gap:8px;padding:0 12px;display:flex}.search-bar input{background:0 0;border:none;outline:none;width:100%;padding:12px 0}.icon-btn{background:var(--gray-100);width:38px;height:38px;color:var(--gray-700);border-radius:12px;justify-content:center;align-items:center;display:flex;position:relative}.icon-btn .dot{background:var(--orange);border:2px solid var(--white);border-radius:50%;width:8px;height:8px;position:absolute;top:8px;right:9px}.chips{flex-wrap:wrap;gap:8px;display:flex}.chips .chip{background:var(--gray-100);color:var(--gray-700);border:1.5px solid #0000;border-radius:999px;padding:8px 14px;font-size:13px;font-weight:500}.chips .chip.active{background:var(--navy-50);color:var(--navy);border-color:var(--navy)}.tag-orange{background:var(--orange);color:var(--white);letter-spacing:.04em;border-radius:6px;padding:2px 8px;font-size:11px;font-weight:700}.row-between{justify-content:space-between;align-items:center;gap:12px;display:flex}.fw{width:100%}.flex{display:flex}.flex-col{flex-direction:column;display:flex}.gap-8{gap:8px}.gap-12{gap:12px}.gap-16{gap:16px}.mt-8{margin-top:8px}.mt-12{margin-top:12px}.mt-16{margin-top:16px}.fs-12{font-size:12px}.fs-13{font-size:13px}.fs-14{font-size:14px}.fw-600{font-weight:600}.fw-700{font-weight:700}.text-navy{color:var(--navy)}.text-orange{color:var(--orange)}.text-success{color:var(--success)}.text-danger{color:var(--danger)}