*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--green:#0e7a3c;--green-lit:#19a457;--green-lt:#dcfce7;--navy:#0b0e0c;--navy-deep:#060907;--navy-mid:#121714;--slate:#52665a;--terra:#0e7a3c;--terra-lt:#19a457;--terra-dim:#86efac;--sand:#f4f7f5;--sand-dark:#e6ede8;--white:#fff;--ink:#0b0e0c;--ink-mid:#1e2b22;--ink-soft:#4b6154;--yellow:#f59e0b;--yellow-lt:#fef3c7;--red:#ef4444;--red-lt:#fee2e2;--blue:#19a457;--blue-lt:#dcfce7;--border:#e2e8f0;--card-shadow:0 4px 6px -1px #0b0e0c0d, 0 2px 4px -2px #0b0e0c0d;--font:-apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Display", "Inter", "Segoe UI", Roboto, Helvetica, Arial, sans-serif}::-webkit-scrollbar{width:7px;height:7px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#64748b40 padding-box padding-box;border:1px solid #0000;border-radius:9999px}::-webkit-scrollbar-thumb:hover{background:#64748b73 padding-box padding-box;border:1px solid #0000;border-radius:9999px}html{font-family:var(--font);color:var(--ink);background:var(--sand);font-size:14px}body{min-height:100vh}.screen{min-height:100vh;display:none}.screen.active{display:flex}@keyframes shimmer{0%{background-position:-600px 0}to{background-position:600px 0}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}#login-screen{background:var(--navy-deep);flex-direction:column;justify-content:center;align-items:center;padding:40px 20px;position:relative;overflow:hidden}#login-screen:before{content:"";pointer-events:none;background-image:radial-gradient(circle at 20% 80%,#0e7a3c40 0%,#0000 50%),radial-gradient(circle at 80% 20%,#19a45747 0%,#0000 50%),radial-gradient(circle,#0e7a3c26 0%,#0000 70%);position:absolute;top:0;bottom:0;left:0;right:0}#login-screen:after{content:"";pointer-events:none;background-image:linear-gradient(#19a45714 1px,#0000 1px),linear-gradient(90deg,#19a45714 1px,#0000 1px);background-size:48px 48px;position:absolute;top:0;bottom:0;left:0;right:0}.login-header{z-index:1;text-align:center;margin-bottom:40px;position:relative}.login-logo{align-items:center;gap:10px;margin-bottom:20px;display:inline-flex}.login-logo-mark{background:var(--terra);color:#fff;border-radius:10px;justify-content:center;align-items:center;width:44px;height:44px;font-size:22px;font-weight:800;display:flex}.login-logo-text{text-align:left;line-height:1.2}.login-logo-text span:first-child{color:#fff;letter-spacing:-.3px;font-size:18px;font-weight:700;display:block}.login-logo-text span:last-child{color:#ffffff80;letter-spacing:1.5px;text-transform:uppercase;font-size:11px;font-weight:400;display:block}.login-title{color:#fff;letter-spacing:-.5px;font-size:28px;font-weight:800;line-height:1.2}.login-subtitle{color:#ffffff80;margin-top:6px;font-size:14px;font-weight:400}.login-prompt{z-index:1;letter-spacing:1.5px;text-transform:uppercase;color:var(--terra-dim);margin-bottom:20px;font-size:12px;font-weight:600;position:relative}.role-grid{z-index:1;grid-template-columns:repeat(4,1fr);gap:12px;width:100%;max-width:820px;display:grid;position:relative}@media (max-width:700px){.role-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:380px){.role-grid{grid-template-columns:1fr 1fr;gap:8px}}.role-card{cursor:pointer;text-align:center;-webkit-tap-highlight-color:transparent;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:14px;padding:20px 14px 16px;transition:all .2s;position:relative;overflow:hidden}.role-card:before{content:"";background:var(--terra);transform-origin:0;border-radius:14px 14px 0 0;height:3px;transition:transform .2s;position:absolute;top:0;left:0;right:0;transform:scaleX(0)}.role-card:hover{background:#ffffff1a;border-color:#19a45773;transform:translateY(-2px)}.role-card:hover:before{transform:scaleX(1)}.role-card:active{transform:translateY(0)}.role-avatar{background:#ffffff14;border:2px solid #ffffff1f;border-radius:50%;justify-content:center;align-items:center;width:52px;height:52px;margin:0 auto 12px;font-size:24px;display:flex}.role-name{color:#fff;margin-bottom:4px;font-size:13px;font-weight:700;line-height:1.3}.role-desc{color:#fff6;font-size:10px;font-weight:400;line-height:1.4}.role-badge{letter-spacing:.5px;text-transform:uppercase;border-radius:20px;margin-top:8px;padding:2px 8px;font-size:9px;font-weight:600;display:inline-block}.login-footer{z-index:1;text-align:center;color:#ffffff40;margin-top:28px;font-size:11px;position:relative}#app-screen{background:var(--sand);flex-direction:row}.sidebar{background:var(--navy);scrollbar-width:none;-ms-overflow-style:none;flex-direction:column;flex-shrink:0;width:240px;height:100vh;min-height:100vh;display:flex;position:sticky;top:0;overflow-y:auto}.sidebar::-webkit-scrollbar{width:0;height:0;display:none}.sidebar-brand{border-bottom:1px solid #ffffff12;align-items:center;gap:10px;padding:20px 18px 16px;display:flex}.sidebar-logo-mark{background:var(--terra);color:#fff;border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:34px;height:34px;font-size:16px;font-weight:800;display:flex}.sidebar-brand-text span:first-child{color:#fff;font-size:13px;font-weight:700;line-height:1.2;display:block}.sidebar-brand-text span:last-child{color:#fff6;font-size:10px;font-weight:400;display:block}.sidebar-user{border-bottom:1px solid #ffffff12;padding:12px 14px}.user-pill{cursor:pointer;background:#ffffff0f;border-radius:10px;align-items:center;gap:10px;padding:8px 10px;transition:background .15s;display:flex}.user-pill:hover{background:#ffffff1a}.user-avatar-sm{background:var(--terra);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:30px;height:30px;font-size:14px;display:flex}.user-info{flex:1;min-width:0}.user-name{color:#fff;white-space:nowrap;text-overflow:ellipsis;font-size:12px;font-weight:600;overflow:hidden}.user-role-badge{color:var(--terra-dim);letter-spacing:.3px;background:#0e7a3c4d;border-radius:4px;padding:1px 6px;font-size:9px;font-weight:600;display:inline-block}.user-switch{color:#ffffff4d;cursor:pointer;flex-shrink:0;font-size:16px}.sidebar-nav{flex:1;padding:10px}.nav-group-label{letter-spacing:1.5px;text-transform:uppercase;color:#ffffff40;padding:10px 8px 4px;font-size:9px;font-weight:700}.nav-item{cursor:pointer;border-radius:8px;align-items:center;gap:9px;margin-bottom:1px;padding:8px 10px;text-decoration:none;transition:all .15s;display:flex;position:relative}.nav-item:hover{background:#ffffff12}.nav-item.active{background:#19a45733}.nav-item.active .nav-icon{color:var(--terra-lt)}.nav-item.active .nav-label{color:#fff;font-weight:600}.nav-icon{text-align:center;color:#ffffff73;flex-shrink:0;width:20px;font-size:16px}.nav-label{color:#ffffffa6;font-size:12.5px;font-weight:400}.nav-badge{background:var(--terra);color:#fff;text-align:center;border-radius:10px;min-width:18px;margin-left:auto;padding:1px 6px;font-size:10px;font-weight:700}.sidebar-project{border-top:1px solid #ffffff12;padding:10px 14px 14px}.project-switcher-label{letter-spacing:1.5px;text-transform:uppercase;color:#ffffff40;margin-bottom:8px;font-size:9px;font-weight:700}.project-pill{cursor:pointer;background:#ffffff0f;border-radius:8px;padding:8px 10px;transition:background .15s}.project-pill:hover{background:#ffffff1a}.project-pill-name{color:#fff;font-size:11px;font-weight:600}.project-pill-sub{color:#fff6;margin-top:2px;font-size:10px}.project-progress-bar{background:#ffffff1a;border-radius:2px;height:3px;margin-top:8px}.project-progress-fill{background:var(--terra);border-radius:2px;height:3px;transition:width .4s}.main-content{flex-direction:column;flex:1;min-width:0;display:flex;overflow-x:clip}.mobile-topbar{display:none!important}.sidebar-backdrop{display:none}.app-header{z-index:30;background:var(--white);border-bottom:1px solid var(--border);flex-shrink:0;justify-content:space-between;align-items:center;gap:12px;height:52px;padding:0 24px;display:flex;position:sticky;top:0}.app-header-greeting{color:var(--ink-soft,#64748b);font-size:13px}.app-header-actions{align-items:center;gap:8px;display:flex}.app-header-btn{border:1px solid var(--border,#e2e8f0);background:var(--white,#fff);color:var(--ink,#1e293b);cursor:pointer;border-radius:8px;align-items:center;gap:6px;padding:6px 12px;font-size:13px;font-weight:500;transition:background .15s;display:inline-flex}.app-header-btn:hover{background:var(--sand,#f5efe6)}@media (max-width:1024px){.app-header{display:none}}.topbar{background:var(--white);border-bottom:1px solid var(--border);flex-shrink:0;align-items:center;gap:12px;height:56px;padding:0 24px;display:flex}.topbar-title{color:var(--navy);flex:1;font-size:15px;font-weight:700}.topbar-breadcrumb{color:var(--ink-soft);font-size:12px;font-weight:400}.topbar-breadcrumb span{color:var(--navy);font-weight:600}.topbar-actions{align-items:center;gap:8px;display:flex}.btn{font-family:var(--font);cursor:pointer;white-space:nowrap;border:none;border-radius:8px;align-items:center;gap:6px;padding:7px 14px;font-size:12.5px;font-weight:600;transition:all .15s;display:inline-flex}.btn:disabled,.btn[disabled]{opacity:.55;pointer-events:none;filter:grayscale(25%);cursor:not-allowed!important}.btn:focus-visible{outline:2px solid var(--terra)!important;outline-offset:2px!important}button:focus-visible{outline:2px solid var(--terra)!important;outline-offset:2px!important}a:focus-visible{outline:2px solid var(--terra)!important;outline-offset:2px!important}input:focus-visible{outline:2px solid var(--terra)!important;outline-offset:2px!important}select:focus-visible{outline:2px solid var(--terra)!important;outline-offset:2px!important}textarea:focus-visible{outline:2px solid var(--terra)!important;outline-offset:2px!important}.btn-primary{background:var(--terra);color:#fff}.btn-primary:hover{background:var(--terra-lt)}.btn-ghost{color:var(--ink-mid);border:1px solid var(--border);background:0 0}.btn-ghost:hover{background:var(--sand)}.btn-icon{border:1px solid var(--border);width:34px;height:34px;color:var(--ink-soft);cursor:pointer;background:0 0;border-radius:8px;justify-content:center;align-items:center;padding:0;font-size:16px;transition:all .15s;display:flex}.btn-icon:hover{background:var(--sand)}.page-content{flex:1;padding:24px;overflow-y:auto}.project-status-banner{background:var(--navy);border-radius:14px;align-items:center;gap:20px;margin-bottom:20px;padding:18px 22px;display:flex;position:relative;overflow:hidden}.project-status-banner:before{content:"";pointer-events:none;background:linear-gradient(90deg,#0000,#19a45726);width:300px;position:absolute;top:0;bottom:0;right:0}.banner-info{flex:1;min-width:0}.banner-project-name{color:#fff;font-size:18px;font-weight:800;line-height:1.2}.banner-sub{color:#ffffff80;margin-top:3px;font-size:12px}.banner-status-badge{letter-spacing:.3px;border-radius:20px;padding:5px 14px;font-size:12px;font-weight:700}.banner-meta{flex-shrink:0;align-items:center;gap:20px;display:flex}.banner-meta-item{text-align:center}.banner-meta-label{color:#fff6;text-transform:uppercase;letter-spacing:.8px;font-size:10px}.banner-meta-val{color:#fff;font-size:20px;font-weight:800;line-height:1.2}.banner-meta-sub{color:#fff6;font-size:10px}.stat-grid{grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:20px;display:grid}@media (max-width:900px){.stat-grid{grid-template-columns:repeat(2,1fr)}}.stat-card{background:var(--white);box-shadow:var(--card-shadow);border:1px solid var(--border);border-radius:12px;padding:16px 18px;position:relative;overflow:hidden}.stat-card-accent{border-radius:12px 12px 0 0;height:3px;position:absolute;top:0;left:0;right:0}.stat-label{color:var(--ink-soft);text-transform:uppercase;letter-spacing:.8px;margin-bottom:8px;font-size:11px;font-weight:600}.stat-value{color:var(--navy);letter-spacing:-1px;font-size:28px;font-weight:800;line-height:1}.stat-sub{color:var(--ink-soft);margin-top:5px;font-size:11px}.stat-delta{border-radius:4px;align-items:center;gap:3px;margin-top:4px;padding:2px 6px;font-size:11px;font-weight:600;display:inline-flex}.delta-up{background:var(--green-lt);color:var(--green)}.delta-down{background:var(--red-lt);color:var(--red)}.delta-warn{background:var(--yellow-lt);color:var(--yellow)}.content-grid{grid-template-columns:1fr 340px;gap:14px;display:grid}@media (max-width:1100px){.content-grid{grid-template-columns:1fr}}.clickable-card{cursor:pointer;transition:box-shadow .25s,transform .25s}.clickable-card:hover{transform:translateY(-2px);box-shadow:0 6px 24px #0000001a}@media (max-width:900px){#page-dashboard .page-content>div[style*=grid-template-columns]{grid-template-columns:1fr!important}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}.card{background:var(--white);border:1px solid var(--border);box-shadow:var(--card-shadow);border-radius:12px;overflow:hidden}.card-header{border-bottom:1px solid var(--border);align-items:center;gap:10px;padding:14px 18px;display:flex}.card-title{color:var(--navy);flex:1;font-size:13px;font-weight:700}.card-action{color:var(--terra);cursor:pointer;font-size:11px;font-weight:600}.card-body{padding:16px 18px}.progress-comparison{margin-bottom:16px}.progress-row{align-items:center;gap:10px;margin-bottom:10px;display:flex}.progress-row-label{color:var(--ink-soft);flex-shrink:0;width:70px;font-size:11px;font-weight:600}.progress-track{background:var(--sand-dark);border-radius:6px;flex:1;height:10px;overflow:hidden}.progress-fill{border-radius:6px;height:100%;transition:width .6s}.progress-pct{color:var(--navy);text-align:right;width:36px;font-size:12px;font-weight:700}.rab-item{border-bottom:1px solid var(--sand);align-items:center;gap:10px;padding:10px 0;display:flex}.rab-item:last-child{border-bottom:none}.rab-item-dot{border-radius:50%;flex-shrink:0;width:8px;height:8px}.rab-item-name{color:var(--ink);flex:1;font-size:12.5px;font-weight:500}.rab-item-pct{color:var(--navy);text-align:right;width:36px;font-size:12px;font-weight:700}.rab-item-bar{background:var(--sand-dark);border-radius:3px;width:80px;height:6px;overflow:hidden}.rab-item-bar-fill{border-radius:3px;height:100%}.rab-badge{letter-spacing:.3px;border-radius:4px;padding:2px 6px;font-size:9px;font-weight:700}.notif-item{border-bottom:1px solid var(--sand);align-items:flex-start;gap:10px;padding:10px 0;display:flex}.notif-item:last-child{border-bottom:none}.notif-dot{border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:28px;height:28px;margin-top:1px;font-size:13px;display:flex}.notif-content{flex:1;min-width:0}.notif-text{color:var(--ink);font-size:12px;font-weight:500;line-height:1.4}.notif-time{color:var(--ink-soft);margin-top:2px;font-size:10px}.notif-unread .notif-text{color:var(--navy);font-weight:600}.schedule-week{gap:4px;margin-bottom:14px;display:flex}.schedule-day{text-align:center;flex:1;padding:4px 0}.schedule-day-label{color:var(--ink-soft);text-transform:uppercase;font-size:9px;font-weight:600}.schedule-day-date{color:var(--navy);border-radius:50%;justify-content:center;align-items:center;width:28px;height:28px;margin:3px auto 0;font-size:13px;font-weight:700;display:flex}.schedule-day-date.today{background:var(--terra);color:#fff}.schedule-day-has-task{background:var(--terra);border-radius:50%;width:4px;height:4px;margin:4px auto 0}.form-section{margin-bottom:20px}.form-section-title{letter-spacing:1px;text-transform:uppercase;color:var(--ink-soft);border-bottom:1px solid var(--border);margin-bottom:12px;padding-bottom:8px;font-size:11px;font-weight:700}.form-row{grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px;display:grid}.form-row.cols-3{grid-template-columns:1fr 1fr 1fr}.form-row.cols-1{grid-template-columns:1fr}.form-group{flex-direction:column;gap:5px;display:flex}.form-label{color:var(--ink-mid);font-size:11px;font-weight:600}.form-input,.form-select,.form-textarea{border:1.5px solid var(--border);font-family:var(--font);color:var(--ink);background:var(--white);-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:8px;outline:none;padding:9px 12px;font-size:13px;transition:border-color .15s}.form-input:focus,.form-select:focus,.form-textarea:focus{border-color:var(--terra);box-shadow:0 0 0 3px #0e7a3c26}.form-textarea{resize:vertical;min-height:80px}.form-input.auto{background:var(--sand);color:var(--ink-soft);cursor:not-allowed}.weather-opts{gap:8px;display:flex}.weather-opt{border:1.5px solid var(--border);text-align:center;cursor:pointer;border-radius:8px;flex:1;padding:10px 8px;font-size:20px;line-height:1;transition:all .15s}.weather-opt.selected{border-color:var(--terra);background:#19a45714}.weather-opt span{color:var(--ink-soft);margin-top:4px;font-size:10px;font-weight:600;display:block}.photo-upload-zone{border:2px dashed var(--border);text-align:center;cursor:pointer;background:var(--sand);border-radius:10px;padding:24px;transition:all .15s}.photo-upload-zone:hover{border-color:var(--terra);background:#0e7a3c0f}.photo-upload-icon{margin-bottom:8px;font-size:28px}.photo-upload-text{color:var(--ink-soft);font-size:12px;font-weight:500}.photo-upload-sub{color:var(--ink-soft);opacity:.7;margin-top:3px;font-size:10px}.photo-grid-preview{grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px;display:grid}.photo-thumb{aspect-ratio:4/3;background:var(--sand-dark);border-radius:8px;justify-content:center;align-items:center;font-size:28px;display:flex;position:relative;overflow:hidden}.photo-thumb-label{color:#fff;background:linear-gradient(#0000,#0009);padding:12px 6px 6px;font-size:9px;font-weight:600;position:absolute;bottom:0;left:0;right:0}.status-track{align-items:center;gap:0;margin-bottom:20px;display:flex}.status-step{flex-direction:column;flex:1;align-items:center;display:flex;position:relative}.status-step:before{content:"";background:var(--border);z-index:0;height:2px;position:absolute;top:14px;left:50%;right:-50%}.status-step:last-child:before{display:none}.status-step.done:before{background:var(--green)}.status-dot{background:var(--white);border:2px solid var(--border);z-index:1;border-radius:50%;justify-content:center;align-items:center;width:28px;height:28px;font-size:13px;font-weight:700;transition:all .2s;display:flex;position:relative}.status-step.done .status-dot{background:var(--green);border-color:var(--green);color:#fff;font-size:12px}.status-step.active .status-dot{background:var(--terra);border-color:var(--terra);color:#fff}.status-step.pending .status-dot{background:var(--white);border-color:var(--border);color:var(--ink-soft)}.status-step-label{color:var(--ink-soft);text-align:center;letter-spacing:.3px;margin-top:6px;font-size:9px;font-weight:600}.status-step.done .status-step-label{color:var(--green)}.status-step.active .status-step-label{color:var(--terra);font-weight:700}.owner-topbar{background:var(--navy);justify-content:space-between;align-items:center;padding:16px 24px;display:flex}.owner-logo{align-items:center;gap:10px;display:flex}.owner-logo-mark{background:var(--terra);color:#fff;border-radius:8px;justify-content:center;align-items:center;width:36px;height:36px;font-size:16px;font-weight:800;display:flex}.owner-logo-text{color:#fff;font-size:14px;font-weight:700}.owner-user{color:#fff9;align-items:center;gap:8px;font-size:12px;display:flex}.owner-content{max-width:800px;margin:0 auto;padding:28px}.owner-project-hero{background:var(--navy);border-radius:16px;margin-bottom:20px;padding:28px;position:relative;overflow:hidden}.owner-project-hero:after{content:"";pointer-events:none;background:#0e7a3c33;border-radius:50%;width:180px;height:180px;position:absolute;top:-20px;right:-20px}.owner-project-label{letter-spacing:1.5px;text-transform:uppercase;color:#fff6;margin-bottom:8px;font-size:10px;font-weight:700}.owner-project-name{color:#fff;margin-bottom:6px;font-size:24px;font-weight:800;line-height:1.2}.owner-project-sub{color:#ffffff80;margin-bottom:20px;font-size:13px}.owner-status-pill{color:#5beba0;background:#1e8c5a33;border:1px solid #1e8c5a4d;border-radius:20px;align-items:center;gap:6px;padding:6px 14px;font-size:12px;font-weight:700;display:inline-flex}.owner-progress-visual{margin-top:20px}.owner-prog-labels{justify-content:space-between;margin-bottom:8px;display:flex}.owner-prog-label{font-size:11px;font-weight:600}.owner-prog-track{background:#ffffff1a;border-radius:8px;height:12px;margin-bottom:4px;position:relative;overflow:hidden}.owner-prog-fill-plan{background:#fff3;border-radius:8px;height:100%;position:absolute;top:0;left:0}.owner-prog-fill-actual{background:var(--terra);border-radius:8px;height:100%;position:absolute;top:0;left:0}.owner-prog-caption{color:#fff6;font-size:10px}.tracking-stages{gap:8px;margin-bottom:20px;padding-bottom:4px;display:flex;overflow-x:auto}.tracking-stage{border:1.5px solid var(--border);background:var(--white);color:var(--ink-soft);border-radius:10px;flex-shrink:0;align-items:center;gap:8px;padding:10px 14px;font-size:12px;font-weight:600;transition:all .15s;display:flex}.tracking-stage.done{border-color:var(--green);background:var(--green-lt);color:var(--green)}.tracking-stage.active{border-color:var(--terra);color:var(--terra);background:#19a45714;font-weight:700}.owner-cards{grid-template-columns:1fr 1fr;gap:14px;display:grid}@media (max-width:600px){.owner-cards{grid-template-columns:1fr}}.tabs{border-bottom:1px solid var(--border);gap:2px;margin-bottom:20px;display:flex}.tab{color:var(--ink-soft);cursor:pointer;border-bottom:2px solid #0000;margin-bottom:-1px;padding:10px 16px;font-size:13px;font-weight:600;transition:all .15s}.tab:hover{color:var(--navy)}.tab.active{color:var(--terra);border-bottom-color:var(--terra)}.data-table{border-collapse:collapse;width:100%}.data-table th{text-align:left;letter-spacing:.8px;text-transform:uppercase;color:var(--ink-soft);background:var(--sand);border-bottom:1px solid var(--border);padding:10px 14px;font-size:10px;font-weight:700}.data-table td{color:var(--ink);border-bottom:1px solid var(--sand);padding:11px 14px;font-size:12.5px}.data-table tr:last-child td{border-bottom:none}.data-table tr:hover td{background:#f5efe680}.dt{background:var(--white);border:1px solid var(--border);box-shadow:var(--card-shadow);border-radius:12px;overflow:hidden}.dt-toolbar{border-bottom:1px solid var(--border);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:12px 14px;display:flex}.dt-toolbar-left{flex-wrap:wrap;flex:1;align-items:center;gap:10px;min-width:0;display:flex}.dt-toolbar-right{flex-shrink:0;align-items:center;gap:8px;display:flex}.dt-search{align-items:center;width:300px;max-width:100%;display:flex;position:relative}.dt-search-icon{opacity:.5;pointer-events:none;font-size:12px;position:absolute;left:11px}.dt-search input{border:1px solid var(--border);width:100%;color:var(--ink);background:var(--white);border-radius:8px;outline:none;padding:8px 30px 8px 32px;font-size:13px;transition:border-color .15s,box-shadow .15s}.dt-search input:focus{border-color:var(--terra);box-shadow:0 0 0 3px #19a45726}.dt-search-clear{color:var(--ink-soft);cursor:pointer;background:0 0;border:none;padding:2px 4px;font-size:16px;line-height:1;position:absolute;right:8px}.dt-table-wrap{-webkit-overflow-scrolling:touch;overflow-x:auto}.dt-table thead th{z-index:1;white-space:nowrap;-webkit-user-select:none;user-select:none;position:sticky;top:0}.dt-table th.dt-sortable{cursor:pointer;transition:background .15s}.dt-table th.dt-sortable:hover{background:var(--sand-deep,#efe6d8);color:var(--ink)}.dt-th-inner{align-items:center;gap:6px;width:100%;display:inline-flex}.dt-sort{opacity:.35;font-size:9px;transition:opacity .15s}.dt-sort.active{opacity:1;color:var(--terra)}.dt-table tbody tr:nth-child(2n) td{background:#f5efe652}.dt-table tbody tr:hover td{background:#19a45714}.dt-state{text-align:center;color:var(--ink-soft);font-size:13px;padding:44px 16px!important}.dt-footer{border-top:1px solid var(--border);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:10px 14px;display:flex}.dt-info{color:var(--ink-soft);font-size:12px}.dt-footer-right{align-items:center;gap:14px;display:flex}.dt-pagesize{color:var(--ink-soft);align-items:center;gap:6px;font-size:12px;display:flex}.dt-pagesize select{border:1px solid var(--border);background:var(--white);color:var(--ink);cursor:pointer;border-radius:6px;padding:5px 8px;font-size:12px}.dt-pages{align-items:center;gap:4px;display:flex}.dt-page-btn{border:1px solid var(--border);background:var(--white);min-width:30px;height:30px;color:var(--ink);cursor:pointer;border-radius:6px;padding:0 8px;font-size:12px;font-weight:600;transition:all .15s}.dt-page-btn:hover:not(:disabled):not(.active){border-color:var(--terra);color:var(--terra)}.dt-page-btn.active{background:var(--navy);border-color:var(--navy);color:#fff;cursor:default}.dt-page-btn:disabled{opacity:.4;cursor:not-allowed}.dt-ellipsis{color:var(--ink-soft);padding:0 4px;font-size:12px}@media (max-width:640px){.dt-search{width:100%}.dt-footer{justify-content:center}}.page-nav{flex-wrap:wrap;gap:8px;margin-bottom:24px;display:flex}.page-nav-btn{font-family:var(--font);cursor:pointer;border:1.5px solid var(--border);background:var(--white);color:var(--ink-soft);border-radius:8px;padding:8px 16px;font-size:12px;font-weight:600;transition:all .15s}.page-nav-btn:hover{background:var(--sand);color:var(--navy)}.page-nav-btn.active{background:var(--terra);color:#fff;border-color:var(--terra)}tr.ts-row-highlight td{transition:background-color 1.2s;box-shadow:inset 3px 0 #0e7a3c}.skeleton{background:linear-gradient(90deg,#e8e4de 25%,#f5f1eb 50%,#e8e4de 75%) 0 0/600px 100%;border-radius:6px;animation:1.4s infinite shimmer}.back-btn{color:#fff9;cursor:pointer;font-size:12px;font-weight:600;font-family:var(--font);background:#ffffff14;border:none;border-radius:8px;align-items:center;gap:6px;margin-bottom:0;padding:6px 12px;text-decoration:none;transition:all .15s;display:inline-flex}.back-btn:hover{color:#fff;background:#ffffff24}@media (max-width:1024px){#app-screen{overflow-x:hidden}.mobile-topbar{background:var(--navy);z-index:900;box-sizing:border-box;justify-content:space-between;align-items:center;gap:6px;width:100%;max-width:100vw;height:52px;padding:0 10px;position:fixed;top:0;left:0;right:0;overflow:hidden;box-shadow:0 2px 8px #0000002e;display:flex!important}.mobile-menu-btn{color:#fff;cursor:pointer;background:#ffffff1a;border:none;border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:38px;height:38px;font-size:18px;display:flex}.mobile-brand{color:#fff;flex:1;align-items:center;gap:8px;min-width:0;font-size:14px;font-weight:700;display:flex}.mobile-brand span{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.sidebar{z-index:1000;width:264px;max-width:82vw;height:100vh;transition:transform .28s;position:fixed;top:0;left:0;transform:translate(-100%);box-shadow:2px 0 16px #00000040}.sidebar.open{transform:translate(0)}.sidebar-backdrop{z-index:999;background:#091c3080;animation:.2s backdropFade;display:block;position:fixed;top:0;bottom:0;left:0;right:0}.main-content{padding-top:52px;overflow:visible}.topbar{flex-wrap:wrap;gap:8px;height:auto;min-height:52px;padding:10px 16px}.form-row{grid-template-columns:1fr}.form-row.cols-3{grid-template-columns:1fr 1fr}.banner-meta{display:none}.stat-grid{grid-template-columns:1fr 1fr}.content-grid{grid-template-columns:1fr}.data-table:not(.dt-table){white-space:nowrap;-webkit-overflow-scrolling:touch;-webkit-overflow-scrolling:touch;display:block;overflow-x:auto}}@keyframes backdropFade{0%{opacity:0}to{opacity:1}}.text-green{color:var(--green)}.text-red{color:var(--red)}.text-yellow{color:var(--yellow)}.text-terra{color:var(--terra)}.text-navy{color:var(--navy)}.text-soft{color:var(--ink-soft)}.fw-700{font-weight:700}.fw-600{font-weight:600}.fs-11{font-size:11px}.fs-12{font-size:12px}.gap-8{gap:8px}.flex{display:flex}.items-center{align-items:center}.justify-between{justify-content:space-between}.mt-8{margin-top:8px}.mt-12{margin-top:12px}.mt-16{margin-top:16px}.mb-16{margin-bottom:16px}.modal-overlay{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:1000;background:#0f2a4799;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;top:0;bottom:0;left:0;right:0}.modal-content{background:var(--white);border-radius:12px;width:100%;max-width:500px;max-height:90vh;overflow-y:auto;box-shadow:0 10px 25px #0003}.modal-header{border-bottom:1px solid var(--border);background:var(--white);z-index:10;border-radius:12px 12px 0 0;justify-content:space-between;align-items:center;padding:20px 24px;display:flex;position:sticky;top:0}.modal-title{color:var(--navy);font-size:18px;font-weight:700}.modal-close{cursor:pointer;color:var(--ink-soft);background:0 0;border:none;font-size:24px;line-height:1;transition:color .15s}.modal-close:hover{color:var(--red)}.modal-body{padding:24px}@keyframes glitch{0%{text-shadow:2px 0 red,-2px 0 #00f;transform:translate(1px,1px)}20%{text-shadow:-2px 0 red,2px 0 #00f;transform:translate(-1px,-1px)}40%{text-shadow:2px 0 red,-2px 0 #00f;transform:translate(1px,-1px)}60%{text-shadow:-2px 0 red,2px 0 #00f;transform:translate(-1px,1px)}80%{text-shadow:2px 0 red,-2px 0 #00f;transform:translate(1px,1px)}to{text-shadow:-2px 0 red,2px 0 #00f;transform:translate(-1px,-1px)}}.glitch-text{color:#f33;font-weight:800;animation:1s linear infinite glitch}.glitch-banner{background:#ff00001a;border:1px solid red;border-radius:6px;align-items:center;gap:10px;margin-bottom:16px;padding:10px;display:flex;position:relative;overflow:hidden}.glitch-banner:before{content:"";pointer-events:none;animation:2s linear infinite glitch;position:absolute;top:0;bottom:0;left:0;right:0;box-shadow:inset 0 0 10px red}.has-tooltip{cursor:help;color:#1a6bb5;margin-left:4px;display:inline-flex;position:relative}.has-tooltip:after{content:attr(data-tooltip);background-color:var(--navy-deep);color:#fff;white-space:pre-wrap;opacity:0;visibility:hidden;z-index:100;pointer-events:none;border-radius:4px;width:max-content;max-width:200px;padding:6px 10px;font-size:11px;font-weight:500;transition:opacity .2s;position:absolute;bottom:150%;left:50%;transform:translate(-50%)}.has-tooltip:before{content:"";border-style:solid;border-width:5px;border-color:var(--navy-deep) transparent transparent transparent;opacity:0;visibility:hidden;z-index:100;pointer-events:none;transition:opacity .2s;position:absolute;bottom:100%;left:50%;transform:translate(-50%)}.has-tooltip:hover:after,.has-tooltip:hover:before{opacity:1;visibility:visible}.row-price-updated{box-shadow:none!important;background-color:#0000!important}.role-checkbox-group{align-items:center;gap:8px;display:flex}.role-checkbox{border:1px solid var(--border);cursor:pointer;background:#fff;border-radius:4px;align-items:center;gap:4px;padding:2px 4px;display:flex}.role-checkbox.disabled{opacity:.5;cursor:not-allowed}.role-checkbox label{color:var(--slate);cursor:pointer;font-size:9px;font-weight:700}.role-checkbox.disabled label{cursor:not-allowed}.rab-glitch-notification{color:#fff;text-align:center;background:#dc2626f2;border:1px solid #ff4d4d;border-radius:8px;justify-content:center;align-items:center;gap:10px;padding:12px 20px;font-size:13px;font-weight:700;animation:4s infinite glitch-anim-box;display:flex;position:relative;overflow:hidden;box-shadow:0 4px 15px #dc262680}.rab-glitch-notification:before{content:"SEGERA SELESAIKAN DATA RAB (MELEWATI BATAS 4 HARI)";color:#fff;z-index:-1;background:#dc2626e6;justify-content:center;align-items:center;width:100%;height:100%;animation:3s linear infinite alternate-reverse glitch-anim-text;display:flex;position:absolute;top:0;left:0}@keyframes glitch-anim-box{0%{transform:translate(0)}2%{transform:translate(-2px,1px)}4%{transform:translate(2px,-1px)}6%{transform:translate(0)}to{transform:translate(0)}}@keyframes glitch-anim-text{0%{clip-path:inset(20% 0 80%);color:#ffeb3b;transform:translate(-2px,2px)}10%{clip-path:inset(50% 0 30%);color:#fff;transform:translate(2px,-2px)}20%{clip-path:inset(10% 0 60%);color:#ffeb3b;transform:translate(-2px)}30%{clip-path:inset(80% 0 10%);color:#fff;transform:translate(2px,2px)}40%{clip-path:inset(40% 0 50%);transform:translate(0)}to{clip-path:inset(0);transform:translate(0)}}.rab-price-updated{box-shadow:none;transition:all .3s;border:1px solid var(--border)!important;background:0 0!important}.glitch-banner{color:#fff;text-align:center;background:linear-gradient(135deg,#dc2626 0%,#b91c1c 100%);border:1px solid #ff4d4d;border-radius:8px;justify-content:center;align-items:center;gap:12px;margin-bottom:20px;padding:14px 24px;font-size:13px;font-weight:700;animation:4s infinite glitch-anim-box;display:flex;position:relative;overflow:hidden;box-shadow:0 4px 20px #dc262666}.glitch-text{animation:2.5s infinite glitch-text-flicker;position:relative}@keyframes glitch-text-flicker{0%,to{opacity:1;text-shadow:none}92%{opacity:1;text-shadow:none}93%{opacity:.8;text-shadow:2px 0 #ff0,-2px 0 #0ff;transform:translate(2px)}94%{opacity:1;text-shadow:none;transform:translate(0)}96%{opacity:.7;text-shadow:-2px 0 #ff0,2px 0 #0ff;transform:translate(-1px)}97%{opacity:1;text-shadow:none;transform:translate(0)}}.dash-stat-row{grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:20px;display:grid}.dash-grid-2{grid-template-columns:1fr 1fr;gap:16px;margin-bottom:20px;display:grid}.dash-grid-3{grid-template-columns:2fr 1fr;gap:16px;margin-bottom:20px;display:grid}@media (max-width:1024px){.dash-stat-row{grid-template-columns:repeat(2,1fr)}.dash-grid-3{grid-template-columns:1fr}}@media (max-width:700px){.dash-grid-2{grid-template-columns:1fr;gap:12px}.dash-stat-row{gap:10px;margin-bottom:14px}}@media (max-width:400px){.dash-stat-row{grid-template-columns:1fr}}@media (max-width:700px){.dash-header{border-radius:12px!important;gap:10px!important;min-height:0!important;padding:16px!important}.dash-header-title{font-size:17px!important}.dash-stat-val{letter-spacing:-.5px!important;font-size:22px!important}.dash-stat-inner{padding:12px 14px!important}.dash-panel-body{padding:14px!important}.dash-panel-head{padding:12px 14px!important}}.dash-scroll-x{-webkit-overflow-scrolling:touch;overflow-x:auto}@media (max-width:700px){.dash-touch,.dash-touch button,.page-nav a,.page-nav button{min-height:40px}}@supports (padding:max(0px)){@media (max-width:700px){.page-content{padding-left:max(12px, env(safe-area-inset-left));padding-right:max(12px, env(safe-area-inset-right));padding-bottom:max(16px, env(safe-area-inset-bottom))}}}@media (max-width:700px){input[type=text],input[type=number],input[type=date],input[type=password],input[type=email],input[type=search],select,textarea,.form-input,.form-select{font-size:16px!important}.form-input,.form-select,select,textarea{min-height:44px;padding:10px 12px!important}textarea.form-input{min-height:88px}.btn{min-height:44px;padding:10px 16px}}.acc-form .form-input,.acc-form .form-select,.acc-form .form-textarea{box-sizing:border-box;width:100%;min-width:0}.acc-form label:not(.form-label){margin-bottom:4px;display:block}.form-input.currency-input{padding-left:38px!important}.row-void td{color:#94a3b8;background:#f8fafc;text-decoration:line-through}.row-void td :not(.void-badge):not(.void-badge *){color:inherit!important}.void-badge{text-decoration:none;display:inline-block}@media (max-width:700px){.stack-table thead{display:none}.stack-table,.stack-table tbody,.stack-table tr,.stack-table td{width:100%;display:block}.stack-table tr{background:#fff;border:1px solid #e2e8f0;border-radius:10px;margin-bottom:10px;padding:10px 40px 10px 10px;position:relative}.stack-table td{border:none;padding:5px 0}.stack-table td[data-label]:before{content:attr(data-label);text-transform:uppercase;letter-spacing:.4px;color:#8792a2;margin-bottom:3px;font-size:10px;font-weight:700;display:block}.stack-table td.half{vertical-align:top;width:48%;display:inline-block}.stack-table td.half+td.half{margin-left:4%}.stack-table td.row-del{width:auto;padding:0;position:absolute;top:6px;right:6px}.stack-table td[colspan]{text-align:center}.stack-table tr:has(td[colspan]){padding:10px}.worklist-card{padding:12px!important}}.fld-pair,.fld-pair-tight{gap:16px;display:grid}.fld-pair{grid-template-columns:1fr 1fr}.fld-pair-tight{grid-template-columns:2fr 1fr}@media (max-width:700px){.fld-pair{grid-template-columns:1fr;gap:10px}.fld-pair-tight{gap:10px}}html{-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%}.sidebar{padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}.app-header{height:calc(52px + env(safe-area-inset-top,0px));padding-top:env(safe-area-inset-top,0px)}@media (max-width:1024px){.mobile-topbar{height:calc(52px + env(safe-area-inset-top,0px));padding-top:env(safe-area-inset-top,0px);padding-left:max(10px, env(safe-area-inset-left,0px));padding-right:max(10px, env(safe-area-inset-right,0px))}.main-content{padding-top:calc(52px + env(safe-area-inset-top,0px))}}@supports (height:100dvh){body,.screen{min-height:100dvh}.sidebar{height:100dvh;min-height:100dvh}}@media (max-width:700px){input:not([type]),input[type=tel],input[type=url],input[type=time],input[type=datetime-local],input[type=month],input[type=week]{font-size:16px!important}}
