:root{--bg: #f5f5f2;--surface: #eceeeb;--surface-2: #e4e6e1;--border: rgba(21, 32, 43, .15);--border-strong: rgba(21, 32, 43, .28);--text: #15202b;--muted: rgba(21, 32, 43, .68);--muted-2: rgba(21, 32, 43, .5);--accent: #3a8c2d;--accent-hover: #2c6d22;--accent-weak: #eef7ec;--green: #2c6d22;--green-bg: #eef7ec;--amber: #a97600;--amber-bg: #fbf2d9;--red: #a92f22;--red-bg: #fae5e2;--blue: #2a5caa;--blue-bg: #ecf1fa;--blue-border: #d4e0f4;--blue-text: #163161;--red-border: #f3cec8;--red-text: #7c241a;--green-border: #d8ebd2;--green-text: #204f19;--amber-border: #f0dca0;--amber-text: #7a5800;--gray-bg: #e4e6e1;--seg-upcoming: #d4e0f4;--violet: #6a3fa0;--violet-bg: #efe7f7;--violet-border: #ddccf0;--violet-text: #4a2a75;--radius: 2px;--radius-sm: 2px;--shadow-sm: 0 1px 2px rgba(21, 32, 43, .08);--shadow-md: 0 3px 10px rgba(21, 32, 43, .1);--shadow-lg: 0 14px 32px rgba(21, 32, 43, .16);--shadow-glass: 0 8px 32px rgba(21, 32, 43, .1);--font-heading: "Source Serif 4", Georgia, serif;--font-body: "Source Serif 4", Georgia, serif}html[data-theme=dark]{--bg: #14181b;--surface: #1c2226;--surface-2: #262d31;--border: rgba(241, 241, 238, .14);--border-strong: rgba(241, 241, 238, .26);--text: #f1f1ee;--muted: rgba(241, 241, 238, .68);--muted-2: rgba(241, 241, 238, .5);--accent: #4faa3d;--accent-hover: #6cc95a;--accent-weak: rgba(79, 170, 61, .16);--green: #6cc95a;--green-bg: rgba(79, 170, 61, .15);--amber: #e0a53a;--amber-bg: rgba(224, 165, 58, .15);--red: #e2685a;--red-bg: rgba(226, 104, 90, .15);--blue: #7ba3d9;--blue-bg: rgba(123, 163, 217, .15);--blue-border: rgba(123, 163, 217, .32);--blue-text: #aec6e9;--red-border: rgba(226, 104, 90, .32);--red-text: #f3a89c;--green-border: rgba(108, 201, 90, .32);--green-text: #9edb8c;--amber-border: rgba(224, 165, 58, .32);--amber-text: #f0c67c;--gray-bg: #262d31;--seg-upcoming: rgba(123, 163, 217, .28);--violet: #b491e0;--violet-bg: rgba(138, 91, 194, .18);--violet-border: rgba(180, 145, 224, .35);--violet-text: #d3bdf0;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .4);--shadow-md: 0 4px 10px rgba(0, 0, 0, .4);--shadow-lg: 0 16px 32px rgba(0, 0, 0, .5);--shadow-glass: 0 8px 32px rgba(0, 0, 0, .4)}*{box-sizing:border-box}html,body,#root{height:100%}html.text-sm{font-size:87.5%}html.text-md{font-size:100%}html.text-lg{font-size:112.5%}.text-size-toggle{display:inline-flex;align-items:center;gap:2px;background:transparent;border:1px solid var(--border);border-radius:var(--radius-sm);padding:3px}.text-size-toggle button{background:none;border:none;cursor:pointer;color:var(--muted);font-weight:700;font-family:var(--font-heading);border-radius:1px;padding:5px 9px;line-height:1;transition:all .15s ease}.text-size-toggle button:hover{color:var(--text)}.text-size-toggle button.active{background:var(--text);color:var(--bg)}.text-size-toggle button:nth-child(1){font-size:.75rem}.text-size-toggle button:nth-child(2){font-size:.875rem}.text-size-toggle button:nth-child(3){font-size:1rem}.theme-toggle{font-size:1rem;line-height:1;padding:8px 12px}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font-body);font-size:.9rem;line-height:1.55;-webkit-font-smoothing:antialiased;transition:background-color .2s ease,color .2s ease}h1,h2,h3,h4,h5,h6,.brand-name{font-family:var(--font-heading);font-weight:600;letter-spacing:-.015em}.app{width:100%;margin:0 auto;padding:0 28px 60px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:20px 0 0}.brand{display:flex;align-items:center;gap:12px}.brand-mark{width:44px;height:44px;object-fit:contain;display:block;flex:none}.brand-name{font-size:1.25rem;font-weight:600;letter-spacing:-.02em}.brand-name:after{content:"-TL";color:var(--accent)}.topbar-right{display:flex;align-items:center;gap:10px}.periode-pick{display:flex;align-items:center;gap:8px;font-size:.8rem;color:var(--muted);font-weight:500}.periode-pick select{min-width:160px}.masthead-rule{height:3px;background:var(--text);margin:14px 0 0}.masthead-rule+.tabs,.masthead-rule+.toolbar{margin-top:0}.tabs{display:flex;gap:0;border-bottom:1px solid var(--border);margin-bottom:24px}.tab{background:none;border:none;padding:11px 0;margin-right:26px;font-size:.75rem;cursor:pointer;color:var(--muted);border-bottom:3px solid transparent;margin-bottom:-1px;border-radius:0;transition:all .15s ease;font-weight:600;font-family:var(--font-heading);text-transform:uppercase;letter-spacing:.09em}.tab:hover{color:var(--text)}.tab.active{color:var(--text);border-bottom-color:var(--accent)}.program-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}.program-tab{background:var(--surface);border:1px solid var(--border-strong);color:var(--muted);padding:9px 18px;border-radius:999px;font-size:.78rem;cursor:pointer;font-weight:700;font-family:var(--font-heading);transition:all .15s ease}.program-tab:hover{color:var(--text);border-color:var(--accent)}.program-tab.active{background:var(--accent);border-color:var(--accent);color:#f5f5f2}.content{min-height:50vh;animation:fadeIn .4s ease-out;padding-top:22px}.foot{text-align:center;color:var(--muted-2);font-size:.7rem;margin-top:40px;letter-spacing:.04em}.btn{border:1px solid var(--border-strong);background:transparent;color:var(--text);padding:8px 16px;border-radius:var(--radius-sm);font-size:.8rem;cursor:pointer;font-weight:600;font-family:var(--font-heading);transition:background .15s ease;text-decoration:none;display:inline-block}.btn:hover{background:#15202b0d}html[data-theme=dark] .btn:hover{background:#f1f1ee14}.btn:active{background:#15202b17}.btn-primary{background:var(--accent);border-color:var(--accent);color:#f5f5f2}.btn-primary:hover{background:var(--accent-hover);border-color:var(--accent-hover)}.btn.ghost{background:transparent;border-color:transparent;color:var(--muted)}.btn.ghost:hover{color:var(--text);background:#15202b0d}html[data-theme=dark] .btn.ghost:hover{background:#f1f1ee14}.btn-amber{background:var(--amber-bg);border:1px solid var(--amber);color:var(--amber-text)}.btn-amber:hover{background:var(--amber-border);border-color:var(--amber)}.btn-logout{background:var(--red);border-color:var(--red);color:#fff}.btn-logout:hover{background:var(--red-text);border-color:var(--red-text)}.btn-sm{padding:5px 10px;font-size:.74rem}.btn:disabled{opacity:.4;cursor:default;pointer-events:none}.push{margin-left:auto}input,select,textarea{font:inherit;color:var(--text);background:var(--surface);border:1px solid var(--border-strong);border-radius:var(--radius-sm);padding:9px 11px;width:100%;transition:border-color .15s ease}input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-weak)}input:disabled{background:var(--surface-2);color:var(--muted);cursor:not-allowed}textarea{resize:vertical}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:20px 22px}.card-title{margin:0 0 16px;font-size:1.05rem;font-weight:600;letter-spacing:-.01em}.kp-dok-panel{border:1px solid var(--border-strong);border-radius:var(--radius);background:var(--surface);overflow:hidden}.kp-dok-toggle{display:flex;align-items:center;gap:10px;width:100%;padding:14px 18px;background:var(--accent-weak);border:none;cursor:pointer;font-family:var(--font-heading);font-weight:700;font-size:.95rem;color:var(--text);text-align:left;transition:background .15s ease}.kp-dok-toggle:hover{background:var(--amber-border)}html[data-theme=dark] .kp-dok-toggle:hover{background:#f1f1ee1a}.kp-dok-chevron{font-size:.7rem;color:var(--muted);transition:transform .15s ease;flex-shrink:0}.kp-dok-toggle.expanded .kp-dok-chevron{transform:rotate(90deg)}.kp-dok-heading{display:flex;align-items:center;gap:10px;padding:14px 18px;background:var(--accent-weak);font-family:var(--font-heading);font-weight:700;font-size:.95rem}.kp-dok-body{padding:16px 18px;border-top:1px solid var(--border-strong)}.dashboard{display:flex;flex-direction:column;gap:22px}.metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:2px}.metric{padding:18px 20px 20px;position:relative;overflow:hidden}.metric-blue{background:var(--blue-bg)}.metric-green{background:var(--green-bg)}.metric-amber{background:var(--amber-bg)}.metric-red{background:var(--red-bg)}.metric-label{display:block;font-size:.68rem;color:var(--muted);margin-bottom:8px;font-weight:600;text-transform:uppercase;letter-spacing:.1em}.metric-value{font-family:var(--font-heading);font-size:2.25rem;font-weight:600;letter-spacing:-.02em;line-height:1;color:var(--text)}.val-green{color:var(--green-text)}.val-amber{color:var(--amber-text)}.val-red{color:var(--red-text)}.dash-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:40px}.bars{display:flex;flex-direction:column;gap:12px}.bar-row{display:flex;align-items:center;gap:12px}.bar-row.tight{gap:10px}.bar-key{width:50px;font-size:.78rem;color:var(--muted);font-weight:500}.bar-track{flex:1;height:10px;background:var(--blue-bg);border-radius:0;overflow:hidden}.bar-fill{height:100%;border-radius:0;transition:width .5s ease-out}.fill-blue{background:var(--blue)}.fill-amber{background:var(--amber)}.fill-red{background:var(--red)}.fill-green{background:var(--accent)}.bar-val{width:26px;text-align:right;font-size:.8rem;font-weight:600;font-variant-numeric:tabular-nums}.attn{list-style:none;margin:0;padding:0}.attn li{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid var(--border)}.attn li:last-child{border-bottom:none}.attn-info{display:flex;flex-direction:column}.attn-name{font-size:.875rem;font-weight:500}.attn-sub{font-size:.72rem;color:var(--muted)}.sebaran{display:flex;flex-wrap:wrap;gap:0;border-top:1px solid var(--border)}.sebaran-item{display:flex;align-items:center;gap:10px;border-right:1px solid var(--border);padding:10px 16px 10px 0;margin-right:16px}.sebaran-label{font-size:.8rem;color:var(--text);font-weight:500}.sebaran-count{min-width:22px;text-align:center;background:transparent;color:var(--accent);font-weight:700;font-size:.85rem;border-radius:0;padding:0}.badge{display:inline-block;font-size:.68rem;font-weight:600;padding:2px 9px;border-radius:var(--radius-sm);white-space:nowrap;letter-spacing:.02em}.badge-green{background:var(--green-bg);color:var(--green-text)}.badge-amber{background:var(--amber-bg);color:var(--amber-text)}.badge-red{background:var(--red-bg);color:var(--red-text)}.badge-blue{background:var(--blue-bg);color:var(--blue-text)}.badge-gray{background:var(--gray-bg);color:var(--muted)}.stagebar{display:flex;flex-direction:column;gap:5px}.stagebar-track{display:flex;gap:2px}.seg{flex:1;height:7px;border-radius:0;background:var(--seg-upcoming);transition:background .3s ease}.seg-done{background:var(--accent)}.seg-active{background:var(--amber)}.stagebar-label{font-size:.72rem;color:var(--muted);font-weight:500}.toolbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:20px}.toolbar .search{flex:1;min-width:240px}.toolbar select{width:auto;min-width:140px}.hint{font-size:.8rem;color:var(--muted)}.table-wrap{padding:0;overflow-x:auto;background:transparent;border-radius:0;border:none;box-shadow:none}.table-wrap.card{background:transparent;border:none;box-shadow:none;padding:0}.table-wrap{border-top:3px solid var(--text)}.tbl{width:100%;border-collapse:collapse;font-size:.84rem}.tbl th,.tbl td{text-align:left;padding:12px;border-bottom:1px solid var(--border);vertical-align:middle}.tbl th{font-size:.68rem;color:var(--muted);font-weight:600;background:transparent;position:sticky;top:0;text-transform:uppercase;letter-spacing:.07em;border-bottom:1px solid var(--border-strong)}.tbl tbody tr:last-child td{border-bottom:none}.tbl tbody tr{transition:background .15s ease}.tbl tbody tr:hover{background:#15202b09}html[data-theme=dark] .tbl tbody tr:hover{background:#f1f1ee0d}.tbl .num{text-align:center;color:var(--muted);font-weight:500}.cell-name{font-weight:600;color:var(--text)}.cell-sub{font-size:.72rem;color:var(--muted);margin-top:3px}.cell-judul{max-width:280px;color:var(--text);line-height:1.4}.muted{color:var(--muted)}.cell-actions{white-space:nowrap;text-align:right}.pagination{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;margin-top:12px}.pagination-controls{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.pagination-controls select{width:auto;min-width:0}.tbl-group-row td{background:var(--blue-bg);font-weight:700;font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;color:var(--blue-text);padding:10px 12px;border-bottom:1px solid var(--blue-border);border-top:1px solid var(--blue-border)}.tbl-resizable{table-layout:fixed;width:auto;min-width:100%}.tbl-wide{width:auto;min-width:100%}.tbl-wide th,.tbl-wide td{white-space:nowrap}.tbl-resizable th{position:relative;overflow:hidden;text-overflow:ellipsis;border-right:1px solid var(--border)}.tbl-resizable th:last-child{border-right:none}.tbl-resizable td{overflow-wrap:break-word}.col-resize-handle{position:absolute;top:0;right:-4px;bottom:0;width:8px;cursor:col-resize;-webkit-user-select:none;user-select:none;z-index:3}.col-resize-handle:after{content:"";position:absolute;top:20%;bottom:20%;left:50%;width:2px;background:var(--border-strong);transform:translate(-50%)}.col-resize-handle:hover:after,.col-resize-handle:active:after{background:var(--accent);width:3px}.link-btn{background:none;border:none;color:var(--blue);cursor:pointer;font-size:.8rem;padding:4px 8px;font-weight:600;font-family:var(--font-heading);border-radius:var(--radius-sm);transition:background .15s}.link-btn:hover{background:var(--blue-bg);text-decoration:none}.link-btn.danger{color:var(--red)}.link-btn.danger:hover{background:var(--red-bg)}.empty{padding:40px 20px;text-align:center;color:var(--muted);font-size:.875rem;display:flex;flex-direction:column;align-items:center;gap:8px}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#15171a73;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);display:flex;align-items:center;justify-content:center;padding:20px;z-index:50;overflow-y:auto;animation:fadeIn .2s ease-out}.modal{background:var(--bg);border-radius:var(--radius);width:100%;max-width:680px;box-shadow:var(--shadow-lg);display:flex;flex-direction:column;max-height:calc(100vh - 40px);animation:slideUp .25s cubic-bezier(.16,1,.3,1);border:1px solid var(--border)}.modal-head{display:flex;align-items:center;justify-content:space-between;padding:18px 24px;border-bottom:3px solid var(--text);flex:0 0 auto}.modal-head h3{margin:0;font-size:1.15rem;font-weight:600}.modal-body{padding:24px;overflow-y:auto;flex:1 1 auto}.modal-foot{display:flex;justify-content:flex-end;gap:12px;padding:16px 24px;border-top:1px solid var(--border);flex:0 0 auto}.icon-btn{background:none;border:none;font-size:1.125rem;cursor:pointer;color:var(--muted);padding:6px;border-radius:var(--radius-sm);transition:all .2s ease;display:grid;place-items:center}html[data-theme=dark] .gear-icon{filter:invert(1)}.icon-btn:hover{background:#15202b12;color:var(--text)}html[data-theme=dark] .icon-btn:hover{background:#f1f1ee1a}.icon-btn-outline{width:36px;height:36px;flex:none;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--border-strong);border-radius:var(--radius);background:none;color:var(--blue);cursor:pointer;transition:background .15s ease}.icon-btn-outline:hover{background:#15202b0d}html[data-theme=dark] .icon-btn-outline:hover{background:#f1f1ee14}.brand-identity-text{line-height:1.15}.brand-identity-name{font-size:.95rem;font-weight:600}.brand-identity-nim{font-size:.75rem;color:var(--muted)}.modal-wide{max-width:1100px}.modal-kp-layout{display:flex;gap:24px;align-items:flex-start}.modal-kp-main{flex:1 1 60%;min-width:0;display:flex;flex-direction:column;gap:16px}.modal-kp-side{flex:0 0 320px;position:sticky;top:0;display:flex;flex-direction:column;gap:16px}@media (max-width: 860px){.modal-kp-layout{flex-direction:column}.modal-kp-side{position:static;flex-basis:auto;width:100%}}.pengaturan-layout{display:flex;gap:40px;align-items:flex-start}.pengaturan-side{flex:0 0 240px;position:sticky;top:20px}.pengaturan-nav{display:flex;flex-direction:column;gap:2px}.pengaturan-nav-item{display:flex;align-items:center;gap:12px;width:100%;text-align:left;padding:10px 16px;border:none;border-radius:999px;background:none;cursor:pointer;font-family:var(--font-heading);font-size:.88rem;font-weight:600;color:var(--text);transition:background .15s ease}.pengaturan-nav-item:hover{background:var(--surface-2)}.pengaturan-nav-item.active{background:var(--accent-weak);color:var(--accent)}.pengaturan-nav-icon{font-size:1rem;line-height:1}.pengaturan-main{flex:1;min-width:0}.pengaturan-section-title{font-size:1rem;font-weight:700;margin-bottom:14px;font-family:var(--font-heading)}@media (max-width: 720px){.pengaturan-layout{flex-direction:column;gap:20px}.pengaturan-side{position:static;flex-basis:auto;width:100%}.pengaturan-nav{flex-direction:row;flex-wrap:wrap}}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px 20px}.field{display:flex;flex-direction:column;gap:6px}.field-full{grid-column:1 / -1}.field-label{font-size:.72rem;color:var(--muted);font-weight:600;text-transform:uppercase;letter-spacing:.05em}.check{display:flex;align-items:center;gap:10px;font-size:.85rem;cursor:pointer}.check input{width:16px;height:16px;accent-color:var(--accent);cursor:pointer}@media (max-width: 600px){.form-grid{grid-template-columns:1fr}.brand-name{font-size:1rem}}.jadwal-mini{margin-top:8px;display:flex;flex-direction:column;gap:6px}.chips{display:flex;flex-wrap:wrap;gap:6px}.chip{font-size:.68rem;font-weight:600;padding:2px 9px;border-radius:var(--radius-sm);background:transparent;color:var(--muted);border:1px solid var(--border-strong)}.chip-on{background:var(--green-bg);color:var(--green-text);border-color:var(--green-border)}.chip-off{background:var(--red-bg);color:var(--red-text);border-color:var(--red-border)}.role-pill{display:inline-flex;align-items:center;gap:7px;padding:5px 12px;border-radius:999px;font-size:.78rem;font-weight:600;border:1px solid var(--border-strong);background:var(--surface-2);color:var(--text);line-height:1.2}.role-pill-dot{width:7px;height:7px;border-radius:50%;flex:none}.role-pill-sub{font-weight:500;opacity:.75}.role-pill-mahasiswa{background:var(--blue-bg);border-color:var(--blue-border);color:var(--blue-text)}.role-pill-mahasiswa .role-pill-dot{background:var(--blue)}.role-pill-dosen{background:var(--green-bg);border-color:var(--green-border);color:var(--green-text)}.role-pill-dosen .role-pill-dot{background:var(--green)}.role-pill-admin{background:var(--violet-bg);border-color:var(--violet-border);color:var(--violet-text)}.role-pill-admin .role-pill-dot{background:var(--violet)}.sched{border:1px solid var(--border);border-radius:var(--radius);padding:16px;background:var(--surface)}.sched-title{font-size:.9rem;font-weight:600;margin-bottom:14px;color:var(--text);font-family:var(--font-heading)}.sched-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}.sched-checks{display:flex;gap:24px;margin-top:14px;flex-wrap:wrap}.sebaran-group+.sebaran-group{margin-top:20px}.sebaran-group-title{font-size:.7rem;font-weight:700;color:var(--muted);margin-bottom:10px;text-transform:uppercase;letter-spacing:.06em}@media (max-width: 640px){.sched-grid{grid-template-columns:1fr}}.seg-wrap{display:inline-flex;gap:0;background:transparent;border:1px solid var(--border-strong);border-radius:var(--radius-sm);padding:0;overflow:hidden;flex-wrap:wrap}.seg-wrap.seg-sm{padding:0}.seg-btn{background:none;border:none;padding:8px 15px;font-size:.8rem;border-radius:0;cursor:pointer;color:var(--muted);font-weight:600;font-family:var(--font-heading);transition:all .15s;border-right:1px solid var(--border-strong)}.seg-btn:last-child{border-right:none}.seg-btn:hover{color:var(--text)}.seg-btn.active{background:var(--accent);color:#f5f5f2}.seg-sm .seg-btn{padding:5px 12px;font-size:.75rem}.toolbar .exp-wrap{margin-left:auto}.exp-wrap{position:relative}.exp-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:40}.exp-menu{position:absolute;right:0;top:calc(100% + 6px);z-index:41;background:var(--bg);border:1px solid var(--border-strong);border-radius:var(--radius-sm);box-shadow:var(--shadow-lg);padding:4px;min-width:160px;animation:slideUp .15s ease-out}.exp-menu button{display:block;width:100%;text-align:left;background:none;border:none;padding:10px 14px;font-size:.85rem;border-radius:var(--radius-sm);cursor:pointer;color:var(--text);font-weight:500;font-family:var(--font-body);transition:background .15s}.exp-menu button:hover{background:var(--surface-2);color:var(--accent)}.login-wrap{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px 20px;background:var(--bg);position:relative}.login-topbar{position:absolute;top:20px;right:20px;display:flex;gap:8px;align-items:center}.periode-aktif-banner{background:var(--blue-bg);border:1px solid var(--blue-border);color:var(--blue-text);border-radius:var(--radius-sm);padding:8px 16px;font-size:.85rem;font-weight:600;margin-bottom:16px;text-align:center}.login-container{display:flex;flex-wrap:wrap-reverse;gap:32px;max-width:900px;width:100%;justify-content:center;align-items:stretch}.login-announcements{flex:1 1 350px;background:var(--surface);border-top:3px solid var(--text);border-bottom:1px solid var(--border);padding:32px}.login-announcements h3{font-size:1.3rem;font-weight:600;margin:0 0 20px;color:var(--text)}.announcement-list{display:flex;flex-direction:column;gap:16px}.announcement-item{display:flex;flex-direction:column;gap:4px;padding-bottom:16px;border-bottom:1px solid var(--border)}.announcement-item:last-child{border-bottom:none;padding-bottom:0}.announcement-date{font-size:.68rem;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}.announcement-item h4{font-size:1rem;font-weight:600;margin:0;line-height:1.4;color:var(--text)}.announcement-item p{font-size:.85rem;color:var(--muted);margin:0;line-height:1.5}.login-card{background:var(--surface);border-top:3px solid var(--text);border-bottom:1px solid var(--border);width:100%;max-width:400px;padding:32px;flex:1 1 350px}.login-brand{display:flex;align-items:center;gap:14px;margin-bottom:24px}.login-brand .brand-mark{width:72px;height:72px}.login-title{font-size:1.7rem;font-weight:600;letter-spacing:-.02em;margin-bottom:4px}.login-title:after{content:"-TL";color:var(--accent)}.login-sub{font-size:.85rem;color:var(--muted)}.login-roles,.login-form{display:flex;flex-direction:column;gap:14px}.login-hint{font-size:.7rem;color:var(--muted);margin:0 0 4px;text-transform:uppercase;letter-spacing:.09em;font-weight:600}.btn.block{display:block;width:100%;text-align:center;padding:11px;font-size:.9rem}.login-tabs{display:flex;gap:0;margin-bottom:8px;border-bottom:1px solid var(--border)}.login-tab{flex:1;background:none;border:none;border-bottom:2px solid transparent;padding:10px 0;font-size:.82rem;cursor:pointer;color:var(--muted);font-weight:600;font-family:var(--font-heading);transition:all .15s}.login-tab:hover{color:var(--text)}.login-tab.active{color:var(--text);border-bottom-color:var(--accent)}.login-err{background:var(--red-bg);color:var(--red-text);font-size:.85rem;padding:10px 12px;border-radius:var(--radius-sm);font-weight:500;border:1px solid var(--red-border)}.login-foot{color:var(--muted-2);font-size:.72rem;margin-top:24px;text-align:center;letter-spacing:.03em}.page-title{font-size:1.6rem;font-weight:600;margin:0;letter-spacing:-.02em}.portal .toolbar{align-items:center;margin-bottom:24px}.cards{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}@media (max-width: 780px){.cards{grid-template-columns:1fr}}.kartu{display:flex;flex-direction:column;gap:8px;border-top:3px solid var(--text)}.kartu-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px}.kartu-prog{font-size:.7rem;font-weight:700;color:var(--accent);text-transform:uppercase;letter-spacing:.08em}.kartu-head-right{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.kartu-judul{font-size:1.05rem;font-weight:600;line-height:1.4}.kartu-aksi{margin-top:12px;display:flex;gap:10px;align-items:center;flex-wrap:wrap}.callout{background:var(--blue-bg);border-left:3px solid var(--blue);border-radius:0;padding:12px 16px;font-size:.85rem;color:var(--blue-text)}.callout a{color:var(--blue-text);text-decoration:underline}.callout-red{background:var(--red-bg);border-left-color:var(--red);color:var(--red-text)}.callout-red a{color:var(--red-text)}.callout-green{background:var(--green-bg);border-left-color:var(--green);color:var(--green-text)}.callout-green a{color:var(--green-text)}.callout-amber{background:var(--amber-bg);border-left-color:var(--amber);color:var(--amber-text)}.callout-amber a{color:var(--amber-text)}.portal-form{max-width:760px;margin:0 auto;background:var(--surface);padding:32px;border-radius:0;border-top:3px solid var(--text);border-bottom:1px solid var(--border)}.portal-form .page-title{margin-bottom:20px}.file-drop{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;text-align:center;padding:20px 16px;cursor:pointer;border:2px dashed var(--border-strong);border-radius:var(--radius-sm);background:var(--surface-2);color:var(--text);transition:border-color .15s,background .15s}.file-drop input[type=file]{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden}.file-drop:hover{border-color:var(--accent)}.file-drop-over{border-color:var(--accent);background:var(--accent-weak)}.file-drop-busy{cursor:not-allowed;opacity:.7}.file-drop-icon{font-size:1.3rem;color:var(--muted)}.file-drop-label{font-weight:600}.file-drop-hint{font-size:.78rem;color:var(--muted)}.verif-info{font-size:.85rem;color:var(--text);display:flex;flex-direction:column;gap:4px;background:var(--surface-2);padding:12px;border-radius:var(--radius-sm);border:1px solid var(--border);margin-top:8px}.verif-info a{color:var(--blue);text-decoration:none;font-weight:500}.verif-info a:hover{text-decoration:underline}.card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}.card-head .card-title{margin:0}.periode-list{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-direction:column;gap:8px}.periode-item{display:flex;align-items:center;justify-content:space-between;background:var(--surface-2);border-radius:var(--radius-sm);padding:10px 14px;font-size:.875rem;font-weight:500}.riwayat-list{max-height:168px;overflow-y:auto}.notif-msg{width:100%;resize:vertical;font:inherit;padding:12px 14px;border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--surface);color:var(--text);line-height:1.5}.notif-msg:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-weak);outline:none}.notif-actions{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0 6px;align-items:center}.notif-actions .btn{text-decoration:none}.notif-dsn{display:inline-flex;gap:8px}.phone-display{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.phone-display-number{font-family:var(--font-heading);font-size:1rem;font-weight:600;letter-spacing:.02em;padding:8px 14px;border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--surface-2)}.th-sort{cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap;transition:color .2s}.th-sort:hover{color:var(--accent)}.tab-icon,.stage-mobile,.mhs-mobile-rows,.panduan-link-mobile,.kp-dok-tabs-mobile{display:none}.kartu{min-width:0}.toolbar-toggle{display:inline-flex;align-items:center;gap:4px}.toolbar-filter{position:relative}.toolbar-filter-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:40;background:#15171a73;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);animation:fadeIn .2s ease-out}.toolbar-extra{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:41;display:flex;flex-direction:column;align-items:stretch;gap:10px;background:var(--bg);border:1px solid var(--border-strong);border-radius:var(--radius);box-shadow:var(--shadow-lg);padding:20px;width:min(360px,calc(100vw - 32px));max-height:calc(100vh - 40px);overflow-y:auto;animation:slideUp .2s cubic-bezier(.16,1,.3,1)}.toolbar-extra select{width:100%}.mhs-mobile-group{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--blue-text);background:var(--blue-bg);border-top:1px solid var(--blue-border);border-bottom:1px solid var(--blue-border);padding:8px 4px;margin-top:4px}.mhs-mobile-rows{border-top:3px solid var(--text)}.mhs-row{padding:12px 2px 14px;border-bottom:1px solid var(--border);cursor:pointer}.mhs-row-top{display:flex;align-items:baseline;justify-content:space-between;gap:10px}.mhs-row-name{font-size:.95rem;font-weight:600}.mhs-row-sub{font-size:.75rem;color:var(--muted);margin:3px 0 8px}.mhs-row-foot{display:flex;justify-content:space-between;gap:10px;font-size:.72rem;color:var(--muted-2);margin-top:6px}.mhs-row .stagebar{margin-top:2px}.mhs-row-actions{display:flex;justify-content:flex-end;margin-top:6px}.mhs-row-del{min-height:32px;padding:4px 8px}.stage-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}.stage-list-item{display:flex;align-items:center;gap:11px;min-height:27px;font-size:.85rem;color:var(--muted)}.stage-list-dot{width:10px;height:10px;border-radius:50%;flex:none;background:var(--blue-bg);border:1px solid var(--blue-border)}.stage-list-item.stage-done .stage-list-dot{background:var(--accent);border-color:var(--accent)}.stage-list-item.stage-done .stage-list-label{color:var(--muted)}.stage-list-item.stage-active{color:var(--text);font-weight:600}.stage-list-item.stage-active .stage-list-dot{background:var(--amber);border-color:var(--amber)}@media (max-width: 640px){html,body{overflow-x:hidden}nav.tabs{position:fixed;left:0;right:0;bottom:0;z-index:30;display:flex;justify-content:space-around;align-items:stretch;margin:0;gap:0;background:var(--surface);border-top:1px solid var(--border);border-bottom:none;padding:4px 4px calc(4px + env(safe-area-inset-bottom,0px));box-shadow:0 -2px 10px #0000000f}nav.tabs .tab{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:48px;margin:0;padding:4px 2px;border-bottom:none;text-transform:none;letter-spacing:0}nav.tabs .tab.active{color:var(--accent)}nav.tabs .tab .tab-icon{display:block}nav.tabs .tab .tab-label{font-size:.62rem;font-weight:600}main.content{padding-bottom:calc(64px + env(safe-area-inset-bottom,0px))}.app{padding:0 14px 24px}.topbar{padding-top:12px;gap:8px}.topbar-right{gap:6px;flex-wrap:wrap;justify-content:flex-end}.topbar-right .btn{padding:7px 11px;font-size:.76rem}.brand-mark{width:32px;height:32px}.brand-name{font-size:1.02rem}.periode-pick span:first-child{display:none}.periode-pick select{min-width:0}.role-pill-sub{display:none}.masthead-rule{margin-top:10px}.text-size-toggle{display:none}.topbar-identity{flex-wrap:nowrap}.topbar-identity .brand-identity{flex:1 1 auto;min-width:0;gap:8px}.topbar-identity .brand-identity-text{min-width:0}.topbar-identity .brand-identity-name,.topbar-identity .brand-identity-nim{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.topbar-identity .brand-identity-name{font-size:.82rem}.topbar-identity .brand-identity-nim{font-size:.66rem}.topbar-identity .topbar-right{flex:none;flex-wrap:nowrap;gap:6px}.topbar-identity .topbar-right .btn-primary{padding:6px 10px;font-size:.72rem}.login-wrap{padding:16px 12px;min-height:100dvh}.login-topbar{position:static;width:100%;justify-content:flex-end;margin-bottom:10px}.periode-aktif-banner{width:100%}.login-card,.login-announcements{padding:20px}.login-title{font-size:1.4rem}.login-brand .brand-mark{width:52px;height:52px}.login-container{gap:16px}.mhs-table-wrap{display:none}.mhs-mobile-rows{display:block}.program-tabs{flex-wrap:nowrap;overflow-x:auto;padding-bottom:2px;-webkit-overflow-scrolling:touch}.program-tab{flex:none}.toolbar{gap:8px}.toolbar .search{min-width:0;flex-basis:100%}.toolbar-filter{flex:1}.toolbar-toggle{width:100%;justify-content:center}.toolbar .exp-wrap{flex:1;margin-left:0}.toolbar .exp-wrap>.btn{width:100%;justify-content:center}.toolbar>.btn-primary{flex:1 1 100%}.pagination{flex-direction:column;align-items:stretch;gap:8px}.pagination-controls{justify-content:center}.stage-desktop{display:none}.stage-mobile{display:block}.kartu-aksi{flex-direction:column;align-items:stretch}.kartu-aksi .btn{width:100%;min-height:44px;text-align:center}.kartu-aksi .btn-primary{order:-1}.cards{gap:14px}.perpanjangan-btn{display:block;width:100%;min-height:44px;text-align:center;margin-top:8px}.portal-form{padding:20px 16px}.panduan-link-desktop{display:none}.panduan-link-mobile{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;flex:none;border:1px solid var(--border-strong);border-radius:var(--radius)}.panduan-link-mobile img{display:block}div.tabs{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch}div.tabs .tab{flex:none}.kp-dok-tabs-desktop{display:none}.kp-dok-tabs-mobile{display:block;width:100%;margin-bottom:14px;background:var(--bg);border:1.5px solid var(--accent);border-radius:var(--radius-sm);color:var(--text);font-family:var(--font-heading);font-weight:700;font-size:.95rem;padding:11px 14px;box-shadow:var(--shadow-sm)}.kp-dok-tabs-mobile:focus{outline:none;box-shadow:0 0 0 3px var(--accent-weak)}.kp-dok-body{padding:14px 12px}.kp-dok-item .btn{width:100%}.metrics{grid-template-columns:repeat(2,1fr)}}@media (max-width: 420px){.metrics{grid-template-columns:1fr 1fr}.metric-value{font-size:1.9rem}}