*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg:#f5f5f7;--surface:#ffffffd1;--surface-dark:#0000000a;--border:#00000014;--border-mid:#0000001f;--text:#1d1d1f;--text-sec:#6e6e73;--text-ter:#aeaeb2;--accent:#0071e3;--accent-hover:#0077ed;--success:#34c759;--warning:#ff9f0a;--danger:#ff3b30;--r-card:18px;--r-btn:14px;--r-input:12px;--r-pill:999px;--font-base:-apple-system, BlinkMacSystemFont, "SF Pro Text", "Inter", sans-serif;--font-display:-apple-system, BlinkMacSystemFont, "SF Pro Display", "Inter", sans-serif;--font-mono:"SF Mono", "JetBrains Mono", "Fira Code", monospace;--shadow-sm:0 2px 8px #0000000d;--shadow-md:0 8px 30px #00000012;--shadow-lg:0 20px 60px #0000001f;--shadow-accent:0 2px 12px #0071e347;--t-fast:.12s ease;--t-base:.2s ease;--t-slow:.3s ease}html,body{background:var(--bg);height:100%;color:var(--text);font-family:var(--font-base);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px}::-webkit-scrollbar{width:4px;height:4px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#0000001f;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#0003}:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}input,textarea,button,select{font-family:var(--font-base)}@keyframes fadeIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeOut{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(6px)}}@keyframes slideUp{0%{opacity:0;transform:translateY(12px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes slideDown{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}@keyframes blink{0%,80%,to{opacity:.3}40%{opacity:1}}@keyframes progress{0%{width:0%}to{width:100%}}@keyframes shimmer{0%{background-position:-400px 0}to{background-position:400px 0}}@keyframes toastIn{0%{opacity:0;transform:translate(-50%)translateY(10px)}to{opacity:1;transform:translate(-50%)translateY(0)}}@keyframes backdropIn{0%{opacity:0}to{opacity:1}}.glass{background:var(--surface);-webkit-backdrop-filter:blur(20px)saturate(180%)}.skeleton{background:linear-gradient(90deg,#0000000d 25%,#00000017 50%,#0000000d 75%) 0 0/400px 100%;border-radius:8px;animation:1.4s linear infinite shimmer}.badge-kuat{color:#1a7a35;background:#34c7591f}.badge-perlu-latihan{color:#8a5a00;background:#ff9f0a1f}.badge-gap-kritis{color:#c0392b;background:#ff3b301f}.btn{border-radius:var(--r-btn);font-family:var(--font-base);cursor:pointer;transition:all var(--t-base);white-space:nowrap;border:none;justify-content:center;align-items:center;gap:6px;font-weight:500;display:inline-flex}.btn:active{transform:scale(.97)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn:disabled:active{transform:none}.btn-primary{background:var(--accent);color:#fff;box-shadow:var(--shadow-accent);padding:10px 20px;font-size:14px}.btn-primary:hover:not(:disabled){background:var(--accent-hover)}.btn-secondary{color:var(--text);border:.5px solid var(--border);background:#0000000d;padding:9px 18px;font-size:13.5px}.btn-secondary:hover:not(:disabled){background:#00000014}.btn-danger{color:var(--danger);border-radius:var(--r-pill);background:#ff3b301a;border:.5px solid #ff3b3040;padding:5px 13px;font-size:12px;font-weight:600}.card{border:.5px solid var(--border);border-radius:var(--r-card);box-shadow:var(--shadow-sm);background:#fff}.anim-fade-in{animation:.2s forwards fadeIn}.anim-slide-up{animation:.22s forwards slideUp}.anim-scale-in{animation:.18s forwards scaleIn}.app-container{background:var(--bg);width:100vw;height:100vh;display:flex;overflow:hidden}.main-content{flex-direction:column;flex:1;display:flex;position:relative;overflow:hidden}.app-sidebar{background:var(--surface);-webkit-backdrop-filter:blur(20px)saturate(180%);border-right:.5px solid var(--border);flex-direction:column;width:224px;min-width:224px;padding-bottom:12px;display:flex}.bottom-nav{background:var(--surface);-webkit-backdrop-filter:blur(20px)saturate(180%);border-top:.5px solid var(--border);z-index:100;justify-content:space-around;align-items:center;height:60px;padding:0 10px;display:none;position:fixed;bottom:0;left:0;right:0}.bottom-nav-item{color:var(--text-sec);cursor:pointer;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:3px;height:100%;font-size:10px;display:flex}.bottom-nav-item i{font-size:18px}.bottom-nav-item.active{color:var(--accent)}.grid-3-col{grid-template-columns:repeat(3,1fr);gap:10px;display:grid}.grid-2-col{grid-template-columns:1.2fr .8fr;gap:12px;display:grid}.grid-equal-2-col{grid-template-columns:1fr 1fr;gap:12px;display:grid}.chat-container{flex:1;display:flex;position:relative;overflow:hidden}.chat-right-panel{background:var(--surface);-webkit-backdrop-filter:blur(20px)saturate(180%);border-left:.5px solid var(--border);flex-direction:column;width:196px;min-width:196px;display:flex;overflow-y:auto}.login-nav{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-bottom:.5px solid var(--border);z-index:10;background:#f5f5f7e0;justify-content:space-between;align-items:center;padding:14px 40px;display:flex;position:sticky;top:0}.login-hero-text{color:var(--text);letter-spacing:-1.2px;margin-bottom:14px;font-size:42px;font-weight:700;line-height:1.12}.login-value-props{grid-template-columns:repeat(3,1fr);gap:12px;width:100%;max-width:720px;margin-top:36px;animation:.35s slideUp;display:grid}.table-wrapper{-webkit-overflow-scrolling:touch;width:100%;overflow-x:auto}@media (max-width:900px){.chat-right-panel{display:none!important}}@media (max-width:768px){.app-sidebar{display:none!important}.bottom-nav{display:flex}.main-content{padding-bottom:60px}.grid-3-col,.grid-2-col,.grid-equal-2-col{grid-template-columns:1fr}.login-nav{padding:14px 20px}.login-hero-text{letter-spacing:-.8px;font-size:32px}.login-value-props{grid-template-columns:1fr}}@media print{html,body{color:#000!important;background:#fff!important;height:auto!important;overflow:visible!important}div[style*="width: 224px"],div[style*="min-width: 224px"]{width:0!important;min-width:0!important;display:none!important}button,.btn,.ti,div[style*="display: flex; gap: 8px"],div[style*="display: flex; gap: 8"],div[style*="display: flex; gap: 6"]{display:none!important}div[style*="display: flex; height: 100vh"]{background:#fff!important;height:auto!important;display:block!important}div[style*="flex: 1"]{width:100%!important;height:auto!important;margin:0!important;padding:0!important;display:block!important;overflow:visible!important}.card,div[style*="background: white"]{page-break-inside:avoid;box-shadow:none!important;border:.5px solid #ccc!important;margin-bottom:16px!important}*{-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important}}.logout-btn:hover{background:#ff3b3014!important}.logout-btn:hover i{color:#ff3b30!important}